
/* ---- Aramo DJ: shared visuals (vinyl + equaliser) ---- */
.vinyl{width:min(320px,70vw);aspect-ratio:1;border-radius:50%;margin-inline:auto;position:relative;
  background:radial-gradient(circle,#0c0c0b 0 2.5%,var(--gold) 2.6% 17%,#0c0c0b 17.5% 19%,transparent 19.5%),
  repeating-radial-gradient(circle,#1c1a16 0 3px,#11100e 3px 6px);
  border:1px solid #fffdf726;box-shadow:0 0 90px #c9971638;animation:dj-spin 10s linear infinite}
.vinyl::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 20deg,transparent 0 20%,#fffdf712 25%,transparent 30% 70%,#fffdf712 75%,transparent 80%)}
.eq-bars{display:flex;align-items:flex-end;justify-content:center;gap:5px;height:84px;margin-top:34px}
.eq-bars span{width:6px;height:calc(var(--h) * 1%);background:linear-gradient(var(--yellow),var(--gold));
  transform-origin:bottom;animation:dj-eq 1.1s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.13s)}
@keyframes dj-spin{to{transform:rotate(360deg)}}
@keyframes dj-eq{from{transform:scaleY(.22)}to{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.vinyl,.eq-bars span{animation:none!important}}

/* ---- Aramo DJ: mini-site bar and hero ---- */
.dj-bar{background:var(--charcoal);border-bottom:1px solid var(--line-light);color:var(--cream)}
.dj-bar-in{width:min(var(--wrap),calc(100% - 44px));margin-inline:auto;display:flex;align-items:center;
  justify-content:space-between;gap:24px;min-height:54px}
.dj-brand{display:flex;align-items:center;gap:11px;text-decoration:none;font:600 .95rem var(--display);
  letter-spacing:-.03em;color:var(--cream);white-space:nowrap}
.dj-brand b{color:var(--yellow);font-weight:600}
.dj-mini{display:inline-flex;align-items:flex-end;gap:2px;height:17px}
.dj-mini i{display:block;width:3px;background:var(--yellow);height:100%;transform-origin:bottom;
  animation:dj-eq .9s ease-in-out infinite alternate}
.dj-mini i:nth-child(2){animation-delay:-.3s}.dj-mini i:nth-child(3){animation-delay:-.6s}.dj-mini i:nth-child(4){animation-delay:-.15s}
.dj-nav{display:flex;align-items:center;gap:22px;overflow-x:auto;scrollbar-width:none}
.dj-nav::-webkit-scrollbar{display:none}
.dj-nav a{font:.62rem var(--mono);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;
  color:rgba(255,253,247,.66);white-space:nowrap;padding:6px 0;transition:color .2s}
.dj-nav a:hover,.dj-nav a[aria-current="page"]{color:var(--yellow)}
.dj-nav .dj-book{border:1px solid var(--yellow);color:var(--yellow);padding:8px 13px}
.dj-nav .dj-book:hover{background:var(--yellow);color:var(--black)}
.dj-hero{position:relative;overflow:hidden;background:
  radial-gradient(60% 90% at 88% 20%,rgba(201,151,22,.26),transparent 70%),
  radial-gradient(40% 60% at 5% 100%,rgba(231,195,66,.1),transparent 70%),var(--black)}
.dj-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px;align-items:center}
.dj-hero h1{font-size:clamp(2.6rem,6vw,5.6rem)}
.dj-visual{display:block}
.dj-areas{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.dj-areas li{border:1px solid var(--line);padding:9px 15px;font:.64rem var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink)}
.section-dark .dj-areas li{border-color:var(--line-light);color:var(--cream)}
.dj-note{border-left:3px solid var(--gold);padding:4px 0 4px 18px;margin:26px 0;max-width:64ch}
.dj-note p{margin:0}
@media (max-width:900px){
  .dj-hero-grid{grid-template-columns:1fr;gap:34px}
  .dj-visual{max-width:260px;margin-inline:auto}
  .dj-bar-in{gap:14px}
}
