/* =====================================================================
   daisy-v2.css — V2 OVERRIDE LAYER
   Load AFTER zine.css. Re-skins every inner page onto the new home's
   system (daisy-v2.html): marble field + grain, Jost/Questrial/Fraunces/
   JetBrains-Mono, white ransom strips, monochrome accents, flat editorial
   sections. No markup rebuild — content/structure stay intact.

   REVERT: delete the <link> to this file on each page → punk look returns.
   ===================================================================== */

/* ---- 1. Token remap. Redefining zine.css vars re-skins the whole site. */
:root{
  /* v2 additions */
  --bg:#08080b;
  --fg:#f4f1ea;                 /* near-white text */
  --dim:rgba(244,241,234,.55);
  --line:rgba(244,241,234,.20);
  --strip:#f6f3ec;              /* white ransom strip */
  --strip-ink:#0a0a0c;          /* black ransom ink   */
  --nav:'Questrial',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;

  /* overrides of zine.css tokens (cascade: this :root wins) */
  --ink:#0a0a0c;                /* strip ink stays near-black            */
  --ink2:transparent;           /* title-strip backing → marble shows    */
  --paper:#f6f3ec;              /* lavender strip → white                 */
  --cream:#f4f1ea;              /* warm text/chips → near-white           */
  --violet:#9d99a3;             /* secondary grey (foot-mark, frames)     */
  --violet-deep:#6f6c77;
  --mag:#9d99a3;
  --green:#9d99a3;
  --sticker:#f4f1ea;            /* teal accent → near-white (no accent)   */

  /* FYCS uniform: one geometric face everywhere except the ransom strips (--mono) */
  --sans:'Questrial',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --serif:'Questrial',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --display:'Questrial',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --script:'Questrial',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
}

/* ---- 1b. Questrial is single-weight upright → strip the faux italic/bold the
   old Fraunces/Jost rules requested, so the uniform face stays clean. */
.nyt .q,.nyt .src,.strip em,.rw-head h2,.sound-head h2,.sitenav .wm,.foot-mark,
.block em,.block strong,.block .h-zine,.block .h-sub,.rw-cat h3,
.rw-list .rw-t,.rw-index li,.rw-art em,.redaction em,
.press-feat .pq-quote,.pq-quote,.pq-src{
  font-style:normal !important;
  font-weight:400 !important;
}

/* ---- 2. Marble field + single global grain (copied from the v2 home) */
body{
  background:var(--bg) url("asset-marble-bg.png") center center / cover no-repeat fixed !important;
  color:var(--fg);
  font-family:var(--sans);
  font-weight:300;
}
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;
  background:url("mpq7g45s-grain-dust.png") center/cover;
  mix-blend-mode:screen;opacity:.10;
}
::selection{background:var(--fg);color:var(--bg)}

/* ---- 3. Neutralize punk decoration so content sits clean on marble */
.intro-logo,.zine-wear,.tear-top,.fold,.scuff,.ring-wear,.scroll-cue{display:none !important}
/* per-section distress overlays off — the one body grain replaces them */
.vt::after,.vt-heavy::after,.vt-grain::before,
.hero-vintage .hero-photo::after,.hero-vintage .hero-photo::before{display:none !important}

/* ---- 4. Flatten the dark printed boxes → editorial sections on marble */
.zine,.highlights{
  background:transparent !important;box-shadow:none !important;
  border-top:1px solid var(--line);
  padding:clamp(46px,6vw,96px) clamp(20px,4vw,64px);
}
.strip{background:transparent;border-color:var(--line)}
.sound::before{display:none}
.sound-bg{display:none}
.sound{background:transparent}
/* press cards → faint glass instead of heavy dark slab */
.press-grid .pq{background:rgba(255,255,255,.03);border-color:var(--line);box-shadow:none}
/* drop the heavy registration drop-shadows on framed photos for a lighter feel */
.portrait,.nl-fig,.rw-lead{box-shadow:0 18px 44px rgba(0,0,0,.45) !important}

/* ---- 5. Ransom strips → white strip / black ink, clean (no filter/bleed) */
.ransom-line .hl{filter:none}
.redaction .hl{
  box-shadow:2px 2px 0 rgba(0,0,0,.5);          /* drop teal/mag side-bleed */
  letter-spacing:-.01em;
}
.redaction em{box-shadow:2px 2px 0 rgba(0,0,0,.45)}

/* ---- 5b. FYCS uniform: body ransom prose → clean Questrial.
   The mono ransom strips (--mono) are now reserved for quote moments only
   (home tagline .ransom-line + press .pq). Body copy on About / Events /
   Nightlife / Music Direction reads in the one geometric face. */
.redaction{max-width:760px}
.redaction p{line-height:1.62;text-align:left;transform:none !important;margin-left:0 !important}
.redaction .hl{
  font-family:var(--sans);font-weight:300;color:var(--fg);
  background:none;box-shadow:none;padding:0;
  font-size:clamp(15px,1.5vw,19px);line-height:1.62;letter-spacing:.005em;
}
.redaction em{
  font-family:var(--sans);font-style:normal;font-weight:500;color:var(--fg);
  background:none;box-shadow:none;padding:0;letter-spacing:.02em;
}

.about-statement{
  max-width:860px;
  margin:0 auto clamp(36px,5vw,70px);
  text-align:center;
}
.about-ransom{
  display:inline-block;
  text-align:left;
}
.about-ransom .r-line{
  display:table;
  margin:0 auto 6px;
}
.about-ransom .hl{
  display:inline;
  font-family:var(--mono);
  font-weight:600;
  background:var(--strip);
  color:var(--strip-ink);
  font-size:clamp(14px,2.1vw,25px);
  line-height:1.5;
  padding:.10em .42em;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  box-shadow:2px 2px 0 rgba(0,0,0,.55);
}
.about-ransom .r-line:nth-child(1){transform:rotate(-.6deg)}
.about-ransom .r-line:nth-child(2){transform:rotate(.5deg);margin-left:8px}
.about-ransom .r-line:nth-child(3){transform:rotate(-.35deg)}
.about-ransom .r-line:nth-child(4){transform:rotate(.55deg);margin-left:5px}
.about-nyt{
  margin-top:clamp(22px,3vw,34px);
}
.about-nyt .q{
  display:block;
  font-family:var(--sans);
  font-weight:200;
  font-size:clamp(18px,3vw,34px);
  letter-spacing:.06em;
  line-height:1.3;
  color:var(--fg);
}
.about-nyt .src{
  display:block;
  margin-top:14px;
  font-family:var(--sans);
  font-weight:400;
  font-size:clamp(10px,1vw,12px);
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--dim);
}

/* ---- 5c. Opt-out: .ransom-on restores the mono ransom strips (white strip /
   black ink) for specific quote blocks the global 5b flattened to Questrial.
   Reserves the ransom treatment for quote moments only. */
.redaction.ransom-on p{line-height:0;transform-origin:left center}
.redaction.ransom-on p:nth-of-type(1){transform:rotate(-.5deg)!important}
.redaction.ransom-on p:nth-of-type(2){transform:rotate(.4deg)!important;margin-left:6px!important}
.redaction.ransom-on .hl{
  font-family:var(--mono);font-weight:500;color:var(--strip-ink);background:var(--strip);
  font-size:clamp(12.5px,1.45vw,16px);line-height:1.78;letter-spacing:-.02em;
  padding:.12em .34em;box-decoration-break:clone;-webkit-box-decoration-break:clone;
  box-shadow:2px 2px 0 rgba(0,0,0,.5);
}
.redaction.ransom-on em{
  font-family:var(--mono);font-style:normal;font-weight:700;color:var(--strip-ink);
  background:none;box-shadow:none;padding:0;letter-spacing:-.02em;
}

/* ---- 6. Headings → home's serif, monochrome (no gold script) */
.strip{font-family:var(--sans);font-weight:300;letter-spacing:.16em;
  text-transform:uppercase;font-size:clamp(11px,1.4vw,15px);color:var(--dim)}
.strip em{font-family:var(--serif);font-style:italic;font-weight:600;
  color:var(--fg);font-size:1.25em;vertical-align:-1px}
.strip .dot{color:var(--dim)}
.rw-head h2,.sound-head h2{font-family:var(--serif);font-style:italic;font-weight:600;
  color:var(--fg);letter-spacing:0}
.rw-head h2{font-size:clamp(40px,6vw,78px);line-height:1.04}
.kicker{font-family:var(--nav);letter-spacing:.30em;color:var(--dim);font-size:11px}

/* zine/category ruled headers → near-white, lighter rule */
.block .h-zine,.rw-cat h3{color:var(--fg);border-color:var(--line)}
.rw-cat{border-color:var(--line)}
.zine-frame,.rw-frame{color:var(--dim);border-color:var(--line);
  font-family:var(--nav);letter-spacing:.26em}

/* body text legibility tweak on marble (kill the print-seat dark shadow) */
.block p,.block li,.rw-list li,.rw-index li,.rw-art li,.rw-fashion li,.rw-prose,.rw-awards,
.md-prose,.nl-bill .nl-chip,.pq-quote{text-shadow:none !important}

/* ---- 7. Top nav → v2 Questrial treatment (markup unchanged) */
.sitenav{
  background:rgba(8,8,11,.55) !important;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  gap:clamp(12px,2vw,30px);padding:14px clamp(16px,3vw,44px);
}
/* Wordmark → distressed logo image (transparent PNG — no blend hack needed).
   Anchor text kept for a11y/SEO. */
.sitenav .wm{
  display:inline-block;align-self:center;
  height:clamp(54px,6.2vw,84px);aspect-ratio:4232/2362;
  background:url("mq7bmkkz-a35a35e5-82ba-4a2d-af1d-6fc3b0db4340.png") left center/contain no-repeat;
  font-size:0;color:transparent;letter-spacing:0;white-space:nowrap;overflow:hidden;
  transition:opacity .25s ease;
}
.sitenav .wm:hover{opacity:.78}
.sitenav a.tab{
  font-family:var(--nav);font-weight:400;
  font-size:clamp(10px,1vw,12px);letter-spacing:.26em;text-transform:uppercase;
  color:var(--dim);background:none !important;border:0 !important;
  opacity:1;padding:4px 0;box-shadow:none !important;transform:none !important;
  transition:color .25s ease,letter-spacing .25s ease;
}
.sitenav a.tab:hover{color:var(--fg);letter-spacing:.30em}
.sitenav a.tab[aria-current="page"]{
  color:var(--fg);background:none !important;
  border-bottom:1px solid var(--fg) !important;padding-bottom:3px;
}
/* Centered masthead variant — opt-in via .nav-center on the <nav>.
   Stacks logo over a centered tab row; leaves other pages left-aligned. */
.sitenav.nav-center{flex-direction:column;justify-content:center;text-align:center}
.sitenav.nav-center .wm{align-self:flex-start;background-position:left center}
.sitenav.nav-center .tabs{justify-content:center;width:100%}
/* roomier centered masthead: more air under the logo, looser tab row */
.sitenav.nav-center{padding-top:14px;padding-bottom:14px;row-gap:14px}
.sitenav.nav-center .wm{margin:0 0 2px;margin-right:0 !important}

/* ---- 7c. Dot separators between tabs (sit in the gap, dim, non-clickable) */
.sitenav .tabs{gap:0 0}
.sitenav .tabs a.tab{padding-left:.85em;padding-right:.85em}
.sitenav .tabs a.tab:not(:last-child)::after{
  content:"·";color:var(--dim);opacity:.65;
  position:absolute;right:-.18em;top:50%;transform:translateY(-50%);
  pointer-events:none;
}
.sitenav .tabs a.tab{position:relative}

/* ---- 7d. DJ Work dropdown ------------------------------------------------
   Hover/focus-within reveals the sub-menu; the toggle itself still links to
   Events so it works on touch. Nav lifted above content sections (z 9100). */
.sitenav{z-index:9500 !important}
.sitenav .tabs .tab-dd{position:relative;display:inline-flex;align-items:center}
/* caret flows inline after the label, spacing driven by flex gap (not
   absolute positioning in reserved padding) so it sits a fixed distance
   from the word and never crowds the dot separator after it. */
.sitenav .tabs .tab-dd > .tab{position:relative;display:inline-flex;align-items:center;gap:.6em}
.sitenav .tabs .tab-dd > .tab::after{
  content:"";flex:none;
  width:.32em;height:.32em;margin-top:-.2em;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg);opacity:.7;
  transition:transform .25s ease,opacity .25s ease,margin-top .25s ease;
}
.sitenav .tabs .tab-dd:hover > .tab::after,
.sitenav .tabs .tab-dd:focus-within > .tab::after{
  transform:rotate(225deg);opacity:1;margin-top:0;
}
/* dot separator after the dropdown (matches the inter-tab dots) */
.sitenav .tabs > .tab-dd:not(:last-child)::after{
  content:"\00B7";color:var(--dim);opacity:.65;
  position:absolute;right:-.7em;top:50%;transform:translateY(-50%);pointer-events:none;
}
.sitenav .dd-menu{
  position:absolute;top:calc(100% + 12px);left:50%;
  transform:translateX(-50%) translateY(-6px);
  display:flex;flex-direction:column;min-width:168px;
  background:rgba(8,8,11,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);padding:7px 0;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  z-index:9600;
}
/* hover bridge: a transparent strip filling the 12px gap above the menu so the
   cursor never crosses dead space between toggle and items. It lives inside
   .dd-menu (a descendant of .tab-dd), so hovering it keeps .tab-dd:hover true.
   Only live while the menu is open (pointer-events flips with the menu). */
.sitenav .dd-menu::before{
  content:"";position:absolute;left:0;right:0;top:-14px;height:14px;
}
.sitenav .tab-dd:hover .dd-menu,
.sitenav .tab-dd:focus-within .dd-menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
}
.sitenav .dd-item{
  font-family:var(--nav);font-weight:400;
  font-size:clamp(10px,1vw,12px);letter-spacing:.22em;text-transform:uppercase;
  color:var(--dim);padding:9px 20px;white-space:nowrap;text-align:center;
  background:none !important;border:0 !important;box-shadow:none !important;
  text-decoration:none !important;
  transition:color .2s ease,background .2s ease,letter-spacing .2s ease;
}
.sitenav .dd-item:hover{color:var(--fg);background:rgba(255,255,255,.06);letter-spacing:.26em;text-decoration:none !important}
/* current page in the dropdown: brighten only — no underline/border */
.sitenav .dd-item[aria-current="page"]{color:var(--fg);text-decoration:none !important;border-bottom:0 !important}

/* ---- 8. Booking pill → neutral (drop teal shadow) */
.book-pill{background:var(--strip);color:var(--strip-ink);border:0;
  box-shadow:3px 3px 0 rgba(0,0,0,.45)}
.book-pill:focus-visible{outline:2px solid var(--fg)}

/* ---- 9. Footer → marble/editorial */
.foot{border-top:1px solid var(--line)}
.foot-mark{
  font-size:0 !important;color:transparent !important;        /* hide the text node */
  height:clamp(120px,30vw,400px);                             /* 2× the old wordmark size */
  width:min(100%,calc(clamp(120px,30vw,400px) * 1.792));      /* logo aspect 4232:2362 */
  margin:0 auto -.15em;
  background:url("mq7bmkkz-a35a35e5-82ba-4a2d-af1d-6fc3b0db4340.png") center/contain no-repeat;
  opacity:.10;                                                /* same faded percentage */
}
.foot .url{background:var(--strip);color:var(--strip-ink)}
.stamp{background:var(--strip);color:var(--strip-ink);border:0;box-shadow:2px 2px 0 rgba(0,0,0,.4)}
.stamp:hover{box-shadow:3px 3px 0 rgba(0,0,0,.55)}
.booking a{color:var(--fg)}
.colophon{color:var(--dim)}

/* ---- 10. Press anchor + sponsorship accents → monochrome */
.press-feat{border-color:var(--line)}
.press-feat .pq-quote,.pq-quote{color:var(--fg)}
.press-feat .pq-pub,.pq-pub,.pq-src,.rw-list .rw-tag,.rw-awards b,
.md-credits .md-role,.pods .pod-go,.block li::before,.rw-art li::before,
.spon-copy .spon-name,.pods .pod-name{color:var(--fg)}
.pq-src:hover{border-color:var(--fg)}

/* ---- 11. Tape removed site-wide. Hides all photographed-tape PNG layers
   (.tape-strip + every .tape corner). zine.css untouched — delete this
   block to bring the tape back. */
.tape-strip,.tape,.portrait .tape,.rw-lead .tape,.nl-fig .tape,.sleeve .tape{
  display:none!important}

/* ---- 12. Featured press quote → ransom strips (mono, white strip/black ink),
   centered. Reuses the home tagline's .ransom-line vocabulary. */
.press-feat.ransom{display:flex;flex-direction:column;align-items:center;gap:2px}
.press-feat.ransom .ransom-line{margin-bottom:6px}
.press-feat.ransom .pq-pub{margin-top:24px}

/* ---- 13. Center the text in every section. Content boxes are already
   margin:auto centered; this centers the inline text inside them. Ransom
   strips (.ransom-on) keep their left-origin tilt. Delete this block to revert. */
/* prose + lead paragraphs */
.redaction:not(.ransom-on),
.redaction:not(.ransom-on) p,
.rw-prose,.md-prose,.rw-awards{text-align:center}
.rw-prose,.md-prose{margin-left:auto;margin-right:auto}
/* section sub-headers (Work / Art / Festivals etc.) */
.block .h-zine,.block .h-sub,.rw-cat h3{text-align:center;width:100%}
.rw-cat{justify-content:center;text-align:center}
/* multi-column reading lists — center items, drop the left ›/bullet so
   centered text doesn't collide with an absolutely-positioned marker */
.rw-list,.rw-index,.rw-art,.rw-fashion,.md-credits{text-align:center}
.rw-art li,.rw-fashion li,.block li{padding-left:0}
.rw-art li::before,.rw-fashion li::before,.block li::before{display:none}
.rw-fashion{
  list-style:none;
  max-width:760px;
  margin:clamp(24px,3vw,42px) auto 0;
}
.rw-fashion li{
  font-family:var(--sans);
  font-weight:400;
  font-size:13px;
  line-height:1.45;
  letter-spacing:.01em;
  color:var(--fg);
}
.rw-fashion li + li{margin-top:clamp(16px,2vw,24px)}
.rw-fashion em{
  font-family:var(--serif);
  font-style:italic;
  font-weight:600;
  color:var(--fg);
}
/* chip / roster walls (clients A–Z, shared billing) */
.nl-bill{justify-content:center}
/* zine-grid credits (about: Direction/Production/Hollywood/Art/DJ) — center
   the lead paragraphs + Production list + the section frame label too */
.block .lead,.block p,.block ul,.block li,.zine-frame{text-align:center}
.block ul{list-style:none;padding-left:0;margin-left:0}

/* Nightlife: plain centered copy + color photos. */
.nightlife-page .nl-intro{
  margin:clamp(24px,3vw,42px) auto clamp(24px,3.5vw,48px);
  text-align:center;
}
.nightlife-page .nl-intro p{
  text-align:center;
}
.nightlife-page .nl-intro p + p{
  margin-top:clamp(14px,2vw,22px);
}
.nightlife-page .nl-trio img{
  filter:none !important;
  mix-blend-mode:normal !important;
}
.nightlife-page .nl-note{
  max-width:760px;
  margin:clamp(24px,3vw,42px) auto 0;
  text-align:center;
  font-family:var(--sans);
  font-size:clamp(15px,1.5vw,19px);
  line-height:1.62;
  font-weight:300;
  color:var(--fg);
}
.nightlife-page .nl-note p + p{
  margin-top:clamp(8px,1.2vw,14px);
}
.nightlife-page .nl-note strong,
.nightlife-page .nl-note em{
  font-family:var(--sans);
  font-style:normal;
  font-weight:400;
  color:var(--fg);
}

/* Music Direction: center the captions under ELLE and Variety videos. */
.musicdir .md-vid figcaption,
.musicdir .md-feature figcaption{
  text-align:center;
}

/* ---- 14. Nav logo vertically centered (pinned left) + top-right Book pill
   removed. The logo was sitting at the top of the nav column; here it's
   absolutely positioned and centered against a min-height nav band so it
   reads as vertically centered with no overflow onto content. Delete this
   block to revert. */
.book-pill{display:none !important}
.sitenav.nav-center{position:relative;min-height:clamp(64px,7vw,96px);justify-content:center}
.sitenav.nav-center .wm{
  position:absolute;left:clamp(16px,3vw,44px);top:50%;
  transform:translateY(-50%);margin:0 !important;align-self:auto;
  /* Explicit width = height × (5504/3072). Once absolutely positioned the
     aspect-ratio stops sizing the box, leaving it full-width and stealing
     clicks from the tabs — pin width so the box hugs the visible logo. */
  width:clamp(97px,11.1vw,151px);
}
/* Reserve the logo's left footprint (mirrored on the right) so the centered
   tab cluster can never slide under the absolutely-positioned wordmark —
   fixes the "Home" tab overlapping the logo. */
.sitenav.nav-center .tabs{
  padding-left:clamp(130px,16vw,210px);
  padding-right:clamp(130px,16vw,210px);
}

/* ---- 15. Mobile: stack logo + make nav tabs touch-safe ----
   Applies only on small screens to the nav-center pages (About, Music,
   the DJ Work pages — Events/Nightlife/Clients — Music Direction, Press).
   The desktop logo is absolutely pinned left; on phones it rejoins normal
   flow so it cannot sit over the tab hit areas. The DJ Work menu opens below
   the whole nav instead of on top of adjacent tabs. Delete this block to
   revert. */
@media (max-width:600px){
  .sitenav.nav-center{
    align-items:center;
    min-height:auto;
    padding:10px 12px 12px;
    row-gap:8px;
  }
  .sitenav.nav-center .wm{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    width:clamp(104px,34vw,142px);
    height:auto;
    aspect-ratio:5504/3072;
    background-position:center;
    z-index:1;
  }
  .sitenav.nav-center .tabs{
    position:relative;
    z-index:2;
    width:100%;
    padding:0;
    justify-content:center;
    gap:6px 0;
  }
  .sitenav .tabs a.tab{
    min-height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
    padding-left:.72em;
    padding-right:.72em;
  }
  .sitenav .tabs .tab-dd{position:static}
  .sitenav .dd-menu{
    top:calc(100% - 1px);
    left:12px;
    right:12px;
    transform:translateY(-4px);
    min-width:0;
    flex-direction:row;
    justify-content:center;
    gap:0;
    padding:7px;
  }
  .sitenav .tab-dd:hover .dd-menu,
  .sitenav .tab-dd:focus-within .dd-menu{
    transform:translateY(0);
  }
  .sitenav .dd-menu::before{display:none}
  .sitenav .dd-item{
    flex:1 1 0;
    padding:10px 8px;
    text-align:center;
  }
}

/* ---- 16. Events: top Recent Work list as one centered column. */
body.events-page #highlights .rw-photo-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,1.6vw,22px);
  align-items:start;
  max-width:1100px;
  margin:clamp(20px,3vw,40px) auto clamp(26px,3.4vw,46px);
}
body.events-page #highlights .rw-photo-strip .rw-lead{
  width:auto;
  margin:0;
  transform:none !important;
  box-shadow:0 14px 38px rgba(0,0,0,.5) !important;
}
body.events-page #highlights .rw-photo-strip .rw-main{
  z-index:1;
}
body.events-page #highlights .rw-photo-strip img{
  display:block;
  width:100%;
  aspect-ratio:3712/4608;
  object-fit:cover;
}
body.events-page #highlights .rw-list{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  max-width:min(920px,92vw);
  margin-left:auto;
  margin-right:auto;
}
body.events-page #highlights .rw-list li{
  width:100%;
  max-width:820px;
  padding-left:0;
}
@media (max-width:760px){
  body.events-page #highlights .rw-photo-strip{
    grid-template-columns:1fr;
    max-width:420px;
    gap:14px;
  }
}

/* ---- 17. Music: clean embedded listening page. */
.music-page{
  min-height:70vh;
}
.music-hub{
  position:relative;
  padding:clamp(54px,7vw,112px) clamp(20px,4vw,64px);
}
.music-hub .sound-head{
  text-align:center;
  margin-bottom:clamp(28px,4vw,54px);
}
.music-hub .sound-head h2{
  font-size:clamp(50px,8vw,116px);
  line-height:.92;
}
.music-embeds{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(28px,4vw,52px);
  width:min(880px,92vw);
  margin:0 auto;
}
.music-card{
  border-top:1px solid var(--line);
  padding-top:clamp(18px,2.5vw,28px);
  text-align:center;
}
.music-card h3{
  margin:0 0 clamp(14px,2vw,22px);
  font-family:var(--nav);
  font-size:clamp(22px,3.8vw,48px);
  font-weight:400;
  letter-spacing:.22em;
  line-height:1;
  text-transform:uppercase;
  color:var(--fg);
}
.music-card h3 a{
  color:inherit;
  text-decoration:none;
  border-bottom:2px solid transparent;
  transition:border-color .2s ease,opacity .2s ease;
}
.music-card h3 a:hover{
  border-color:var(--accent,currentColor);
  opacity:.85;
}
.music-card iframe{
  display:block;
  width:100%;
  height:166px;
  border:0;
  background:rgba(255,255,255,.04);
  box-shadow:0 18px 44px rgba(0,0,0,.32);
}
.music-card:nth-child(1) iframe{height:180px}
.music-card:nth-child(3) iframe{height:352px}
.playlist-stack{
  display:grid;
  gap:clamp(22px,3vw,34px);
}
.playlist-stack .youtube-embed{
  height:auto;
  aspect-ratio:16/9;
}
.music-link{
  display:inline-block;
  margin-top:14px;
  font-family:var(--nav);
  font-size:10px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--dim);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.music-link:hover{
  color:var(--fg);
  border-color:var(--fg);
}

@media (max-width:600px){
  .music-card h3{letter-spacing:.14em}
  .music-card:nth-child(3) iframe{height:440px}
  .playlist-stack .youtube-embed{height:auto}
}

/* ---- 18. Press: featured podcast/video additions + clipping proof. */
.press-top-clip{
  max-width:min(760px,90vw);
  margin:0 auto clamp(34px,4.5vw,62px);
  padding:0;
  border:0;
  background:transparent;
}
.press-top-clip img{
  display:block;
  width:100%;
  max-height:min(72vh,820px);
  object-fit:contain;
  background:transparent;
  filter:drop-shadow(0 18px 44px rgba(0,0,0,.45));
}
.press-top-clip figcaption{
  padding:10px 2px 0;
  text-align:center;
  font-family:var(--nav);
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--dim);
}
/* Vogue Monsieur after-party caption — readable quote, slightly larger than body */
.press-top-clip figcaption.press-top-cap{
  max-width:680px;
  margin:clamp(18px,2.4vw,30px) auto 0;
  padding:0 6px;
  font-family:var(--serif);
  font-size:clamp(16px,1.55vw,21px);
  line-height:1.6;
  letter-spacing:.005em;
  text-transform:none;
  color:var(--fg);
}
.press-top-cite{
  display:inline-block;
  margin-left:.5em;
  font-weight:600;
  letter-spacing:.14em;
  color:var(--fg);
  text-decoration:none;
  border-bottom:1px solid rgba(244,241,234,.4);
  transition:border-color .18s ease,opacity .18s ease;
}
.press-top-cite:hover{border-bottom-color:var(--fg);opacity:.85}
.podcast-list{
  max-width:1180px;
  margin:0 auto clamp(22px,3vw,38px);
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:clamp(14px,2vw,24px);
  text-align:left;
  align-items:stretch;
}
.podcast-card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  background:
    linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),
    rgba(255,255,255,.03);
  display:grid;
  min-height:100%;
}
.podcast-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:100% 9px;
  mix-blend-mode:screen;
  opacity:.28;
}
.podcast-card-video{
  grid-template-rows:auto 1fr;
}
.podcast-card-link{
  grid-template-rows:auto 1fr;
}
.media-frame{
  position:relative;
  aspect-ratio:16/9;
  background:#050507;
  border-bottom:1px solid var(--line);
}
.media-frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.podcast-copy{
  position:relative;
  z-index:1;
  padding:clamp(18px,2.4vw,32px);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:10px;
  min-height:210px;
}
.media-kicker,.press-clips figcaption{
  font-family:var(--nav);
  font-size:10px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--dim);
}
.podcast-source{
  margin-top:4px;
  font-family:var(--nav);
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--fg);
}
.podcast-copy h4{
  max-width:18ch;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(25px,3vw,42px);
  line-height:1.02;
  color:var(--fg);
}
.podcast-copy p:not(.podcast-source){
  max-width:34ch;
  color:var(--dim);
  font-size:14px;
  line-height:1.55;
}
.podcast-mark{
  position:relative;
  z-index:1;
  min-height:210px;
  padding:clamp(18px,2.5vw,34px);
  display:grid;
  grid-template-columns:auto auto auto;
  align-items:center;
  justify-content:center;
  gap:.18em;
  border-bottom:1px solid var(--line);
  font-family:var(--serif);
  font-style:italic;
  color:var(--fg);
}
.podcast-mark span{
  display:block;
  font-size:clamp(58px,7vw,106px);
  line-height:.82;
  filter:url(#torn);
}
.podcast-mark span:nth-child(2){
  transform:rotate(-6deg);
  font-family:var(--nav);
  font-style:normal;
  font-size:clamp(18px,2vw,30px);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--dim);
}
.press-clips{
  max-width:580px;
  margin:0 auto clamp(24px,3vw,42px);
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(16px,2.4vw,28px);
}
.press-clips figure{
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  padding:10px;
}
.press-clips img{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  filter:grayscale(.08) contrast(1.04);
}
.press-clips figcaption{
  padding:12px 2px 2px;
  text-align:left;
}
@media(max-width:980px){
  .podcast-list{grid-template-columns:1fr}
  .podcast-copy{min-height:auto}
}
@media(max-width:700px){
  .press-clips{grid-template-columns:1fr}
}

/* ---- DJ Shots — performance photo row ---------------------------------- */
.dj-shots{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:clamp(6px,0.8vw,12px);
  margin:0 auto clamp(24px,3vw,42px);
}
.dj-shots figure{
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  padding:4px;
  margin:0;
}
.dj-shots img{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  filter:grayscale(.06) contrast(1.04);
}
@media(max-width:860px){ .dj-shots{grid-template-columns:repeat(4,1fr)} }
@media(max-width:440px){ .dj-shots{grid-template-columns:repeat(2,1fr)} }

/* Press clippings — three articles, centered, natural aspect ratios */
.press-clippings{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:flex-start;
  gap:clamp(14px,2vw,28px);
  max-width:980px;
  margin:clamp(28px,3.5vw,48px) auto clamp(8px,1.5vw,20px);
}
.press-clippings figure{
  flex:0 1 300px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  padding:10px;
  margin:0;
}
.press-clippings img{
  display:block;
  width:100%;
  height:auto;
  filter:grayscale(.06) contrast(1.04);
}
@media(max-width:680px){ .press-clippings figure{flex-basis:240px} }

/* ---- 13. Mobile DJ Work dropdown — tap to toggle (nav.js) ----------------
   JS flips .dd-open on the .tab-dd. Below 600px the menu opens ONLY via
   .dd-open; sticky touch :hover / :focus-within are neutralized so the
   menu stays open until DJ Work is tapped again. */
.sitenav .tab-dd.dd-open .dd-menu{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
.sitenav .tab-dd.dd-open > .tab::after{transform:rotate(225deg);opacity:1;margin-top:0}
@media (max-width:600px){
  /* mobile .dd-menu is positioned with left/right, not translateX */
  .sitenav .tab-dd.dd-open .dd-menu{transform:translateY(0)}
  .sitenav .tab-dd:not(.dd-open):hover .dd-menu,
  .sitenav .tab-dd:not(.dd-open):focus-within .dd-menu{
    opacity:0;visibility:hidden;pointer-events:none;
  }
  .sitenav .tab-dd:not(.dd-open):hover > .tab::after,
  .sitenav .tab-dd:not(.dd-open):focus-within > .tab::after{
    transform:rotate(45deg);opacity:.7;margin-top:-.2em;
  }
}

/* ROXY x JBL — centered single-column (intro → video → quote) */
.roxy{max-width:760px;margin-left:auto;margin-right:auto;text-align:center}
.roxy-intro{font-family:var(--serif);font-style:italic;font-size:clamp(17px,1.8vw,21px);
  line-height:1.6;color:var(--fg);max-width:640px;margin:0 auto clamp(22px,3vw,34px)}
.roxy-vid{position:relative;aspect-ratio:16/9;width:100%;margin:0 auto;
  border:1px solid rgba(239,231,214,.3);background:#000;overflow:hidden}
.roxy-vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.roxy-quote{margin:clamp(24px,3.2vw,38px) auto 0;max-width:560px;text-align:center}
.roxy-quote .pq-pub{display:block}
.roxy-quote .pq-quote{margin-top:10px;font-size:clamp(17px,1.8vw,21px);line-height:1.6}
