/* ════════════════ DESIGN SYSTEM ════════════════ */
:root{
  --bg:#0A0A0B; --bg-2:#0D0D0F; --surface:#131316;
  --text:#F4F4F5; --muted:#8A8A93; --dim:#7F7F89;
  --accent:#FF4230; --bone:#F2EDE3;
  --line:rgba(244,244,245,.12); --line-soft:rgba(244,244,245,.06);
  --nav-h:84px;
  --ease:cubic-bezier(.2,.8,.2,1);
  --slow:cubic-bezier(.16,1,.3,1);
  --pad:clamp(1.15rem,4vw,5rem);
  --display:"Syne","Archivo",Impact,sans-serif;
  --display-w:800;
  --body:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:400;letter-spacing:-.01em;text-wrap:balance}
p{text-wrap:pretty}
::selection{background:var(--accent);color:#0A0A0B}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{max-width:1560px;margin:0 auto;padding-inline:var(--pad)}

.grain{position:fixed;inset:-50%;z-index:9998;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.eyebrow{font-size:.63rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);font-weight:500}

/* ════════════════ NAV ════════════════ */
.nav{position:fixed;top:0;left:0;right:0;z-index:900;height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;padding-inline:var(--pad);
  border-bottom:1px solid transparent;
  transition:background .5s var(--ease),backdrop-filter .5s var(--ease),border-color .5s var(--ease)}
.nav.solid{background:rgba(10,10,11,.78);backdrop-filter:saturate(150%) blur(16px);border-bottom-color:var(--line-soft)}
.nav__logo .wm{height:30px;width:auto;display:block}
.nav__links{display:flex;align-items:center;gap:2rem}
.nav__links a{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  transition:color .3s var(--ease);position:relative}
.nav__links a:hover{color:var(--text)}
.nav__links a:not(.btn-nav)::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;
  background:var(--accent);transition:width .35s var(--ease)}
.nav__links a:not(.btn-nav):hover::after{width:100%}
.btn-nav::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1px;background:var(--accent);
  transition:width .35s var(--ease)}
.btn-nav:hover::before{width:16px}
.btn-nav[data-live="true"]::after{content:"";position:absolute;left:0;top:calc(50% - 3px);width:6px;height:6px;
  border-radius:999px;background:var(--accent);animation:pulse 3.4s ease-in-out infinite}
.btn-nav[data-live="true"]::before{display:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}

.burger{display:none;background:none;border:0;padding:.5rem;cursor:pointer;z-index:2}
.burger span{display:block;width:22px;height:1.5px;background:var(--text);margin:5px 0;
  transition:transform .4s var(--ease),opacity .3s}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(max-width:900px){
  .burger{display:block}
  .nav__links{position:fixed;inset:0;background:var(--bg);flex-direction:column;
    align-items:flex-start;justify-content:center;gap:0;padding:var(--nav-h) var(--pad) 3rem;
    clip-path:inset(0 0 100% 0);transition:clip-path .6s var(--slow);pointer-events:none}
  .nav__links.open{clip-path:inset(0 0 0 0);pointer-events:auto}
  .nav__links a{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
    font-size:clamp(1.04rem,5.18vw,1.76rem);line-height:1;letter-spacing:-.018em;color:var(--text);
    padding:.42rem 0;width:100%;opacity:0;transform:translateY(14px)}
  .nav__links.open a{opacity:1;transform:none;transition:opacity .5s var(--ease),transform .5s var(--ease)}
  .nav__links.open a:nth-child(1){transition-delay:.10s} .nav__links.open a:nth-child(2){transition-delay:.16s}
  .nav__links.open a:nth-child(3){transition-delay:.22s} .nav__links.open a:nth-child(4){transition-delay:.28s}
  .nav__links.open a:nth-child(5){transition-delay:.34s} .nav__links.open a:nth-child(6){transition-delay:.40s}
  .nav__links.open a:nth-child(7){transition-delay:.46s}
  .nav__links.open a:nth-child(8){transition-delay:.52s}
  .nav__links a:not(.btn-nav)::after{display:none}
  .btn-nav{font-size:1.05rem!important;padding:.9rem 0 .9rem 2rem;margin-top:1.4rem;
    letter-spacing:.14em!important;font-family:var(--body)}
  .btn-nav::before{width:14px}
}

/* ════════════════ HERO ════════════════ */
.hero{min-height:100svh;position:relative;display:flex;flex-direction:column;justify-content:flex-end;
  overflow:hidden;padding-bottom:clamp(1.6rem,4vh,3.2rem)}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg video,.hero__bg img{width:100%;height:100%;object-fit:cover}
#heroVid{animation:drift 30s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1)}to{transform:scale(1.02)}}
.hero__slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity 2.4s var(--slow)}
.hero__slide.on{opacity:1}
img.hero__slide{transform:scale(1);transition:opacity 2.4s var(--slow),transform 13s linear}
img.hero__slide.on{transform:scale(1.03)}
/* typography has to dominate the footage, not compete with it */
.hero__bg::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(10,10,11,.78) 0%,rgba(10,10,11,.34) 26%,rgba(10,10,11,.5) 58%,rgba(10,10,11,.93) 88%,var(--bg) 100%),
    radial-gradient(140% 100% at 50% 78%,rgba(10,10,11,0) 20%,rgba(10,10,11,.62) 100%)}
.hero__inner{position:relative;z-index:2;width:100%}


/* ticketing partner — Dice, the platform every event sells through */
.partner{border-top:1px solid var(--line-soft);padding-block:clamp(1.6rem,4vw,2.4rem)}
.partner__in{display:flex;align-items:center;gap:clamp(1.2rem,4vw,3rem);flex-wrap:wrap}
.partner__l{flex:none;font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);margin:0}
.partner__m{flex:none;display:inline-flex;align-items:center;min-height:44px;opacity:.75;
  transition:opacity .35s var(--ease)}
.partner__m:hover{opacity:1}
.partner__m img{height:clamp(13px,1.5vw,16px);width:auto;display:block;filter:grayscale(1) brightness(1.25);opacity:.5}
.partner__m:hover img{filter:none}
.partner__b{margin:0;flex:1 1 26ch;min-width:min(100%,26ch);font-size:.66rem;letter-spacing:.02em;color:var(--dim);line-height:1.7}
@media(max-width:640px){.partner__in{gap:.9rem}.partner__b{font-size:.8rem}}

/* supporting material — Rooms and Questions sit quietly under the main journey */
.sec--quiet{padding-block:clamp(2rem,4.5vw,3.2rem)}
.sec--quiet .sec__head{margin-bottom:clamp(1rem,2.4vw,1.6rem)}
.sec--quiet .sec__head h2{font-size:clamp(.95rem,1.9vw,1.25rem);letter-spacing:.04em;color:var(--muted)}
.sec--quiet .sec__intro{font-size:.82rem;color:var(--dim);max-width:52ch}
.sec--quiet .rooms__n{font-size:clamp(.82rem,1.5vw,1rem)}
.sec--quiet .rooms li{padding-block:.62rem}
.sec--quiet .faq__q{font-size:clamp(.86rem,1.6vw,1.02rem);padding-block:.9rem}
.sec--quiet .faq__a p{font-size:.85rem}

html.cursor-on,html.cursor-on *{cursor:none!important}
#dot{position:fixed;top:0;left:0;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--text);z-index:9999;pointer-events:none;display:none;will-change:transform;transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease),opacity .3s var(--ease)}
html.cursor-on #dot{display:block}
#dot.hot{width:46px;height:46px;margin:-23px 0 0 -23px;background:transparent;border:1px solid rgba(244,244,245,.55)}
@media (prefers-reduced-motion:reduce){
  #dot{display:none!important}
  html.cursor-on,html.cursor-on *{cursor:auto!important}
}

.sr-head{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* ═══════════ THE FIRST SCREEN ═══════════
   One composition, two states. The film owns the frame; type sits inside it,
   anchored to the bottom-left with the whole upper half left empty on purpose.
   Nothing here explains what Intriga is — that is the archive's job.        */

.hero__inner{position:relative;z-index:2;width:100%;
  min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  padding-block:calc(var(--nav-h) + 2rem) clamp(2rem,5vh,3.4rem)}

/* the signature line. Its full stop is the only red in the frame. */
.hero__eyebrow{margin:0 0 clamp(1rem,2.4vh,1.7rem);font-size:.62rem;letter-spacing:.34em;
  text-transform:uppercase;color:var(--text);opacity:0;
  animation:rise .9s var(--slow) .35s forwards}
.hero__eyebrow em{font-style:normal;color:var(--accent)}

/* the name. Oversized, left-aligned, cropped by the viewport rather than centred. */
.hero__name{margin:0;font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(1.6rem,5.2vw,4.3rem);line-height:.84;
  letter-spacing:-.035em;max-width:14ch}
.hero__name span{display:block;overflow:hidden}
.hero__name span > i{display:block;font-style:normal;transform:translateY(105%);
  animation:liftIn 1.15s var(--slow) forwards}
.hero__name span:nth-child(1) > i{animation-delay:.5s}
.hero__name span:nth-child(2) > i{animation-delay:.6s}
@keyframes liftIn{to{transform:translateY(0)}}

/* provenance left, the single action right, sharing one baseline */
.hero__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem 2rem;
  flex-wrap:wrap;margin-top:clamp(1.6rem,5vh,3.2rem)}
.hero__prov{margin:0;font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--dim);opacity:0;animation:rise .9s var(--slow) .95s forwards}
.hero__cta{opacity:0;animation:rise .9s var(--slow) 1.05s forwards}

/* an editorial link, never a pill */
.lnk{display:inline-flex;align-items:center;gap:.7rem;font-size:.72rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--text);padding-block:.6rem;
  border-bottom:1px solid var(--line);transition:color .35s var(--ease),border-color .35s var(--ease)}
.lnk:hover{color:var(--accent);border-color:var(--accent)}
.lnk .arw{transition:transform .35s var(--ease)}
.lnk:hover .arw{transform:translateX(5px)}

/* ── event mode: the night becomes the campaign ── */
.hero__when{display:flex;align-items:baseline;gap:.6rem;margin:0 0 clamp(.4rem,1.4vh,1rem)}
.hero__day{font-family:var(--display);font-weight:var(--display-w,800);
  font-size:clamp(1.5rem,3.4vw,2.5rem);line-height:.8;letter-spacing:-.04em;color:var(--accent)}
.hero__mon{font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;color:var(--text)}
.hero__name--ev{max-width:16ch}
.hero__room{margin:clamp(.8rem,2vh,1.4rem) 0 0;font-size:.7rem;letter-spacing:.28em;
  text-transform:uppercase;color:var(--text)}
.hero__line{list-style:none;margin:clamp(.9rem,2.2vh,1.5rem) 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;max-width:46ch}
.hero__line li{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

@media(max-width:640px){
  .hero__inner{padding-bottom:clamp(2.4rem,7vh,3.4rem)}
  .hero__name{max-width:11ch;letter-spacing:-.028em}
  .hero__eyebrow{font-size:.58rem;letter-spacing:.28em}
  .hero__foot{align-items:flex-start;flex-direction:column;gap:1.2rem}
  .hero__line{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .hero__name span > i{transform:none;animation:none}
  .hero__eyebrow,.hero__prov,.hero__cta{opacity:1;animation:none}
}

.rise{opacity:0;transform:translateY(16px);animation:rise .95s var(--slow) forwards}
@keyframes rise{to{opacity:1;transform:none}}

/* THE PRESENT MOMENT — half the previous size, quieter, still the anchor */
@keyframes liftIn{to{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
  .hero__statement span > i{transform:none;animation:none}
}

/* event-led hero */
.hero__date{display:flex;align-items:flex-end;gap:clamp(.6rem,1.4vw,1rem);margin-bottom:.3rem}
.hero__day{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(2.6rem,8vw,5.6rem);line-height:0.9;
  letter-spacing:-.03em;color:var(--accent)}
.hero__mon{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(0.65rem,1.78vw,1.3rem);line-height:1;
  letter-spacing:.02em;padding-bottom:clamp(.3rem,1vw,.9rem)}
.hero__venue{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.73rem,2.59vw,1.86rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:.4rem}
.hero__event{font-size:.9rem;color:#D6D6DB;margin:0 0 clamp(1.2rem,3vh,2rem)}
.hero__event span{color:var(--muted)}

.hero__foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:flex-start;gap:1.4rem;
  border-top:1px solid var(--line);padding-top:1.3rem}
.hero__cta{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
.stats{display:flex;gap:clamp(1.6rem,4vw,3.4rem)}
.stat__n{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:clamp(0.74rem,1.48vw,1.04rem);
  line-height:1;letter-spacing:-.005em}
.stat__l{font-size:.55rem;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);margin-top:.4rem}
@media(max-width:900px){
  .hero__foot{flex-direction:column;align-items:stretch;gap:1.15rem}
  .hero__cta{width:100%}
}

.hero__dots{position:absolute;bottom:clamp(1rem,3vh,2rem);right:var(--pad);z-index:3;display:flex;gap:.55rem;
  opacity:0;animation:rise .8s var(--slow) 1.9s forwards}
.hero__dots button{width:5px;height:5px;padding:0;border-radius:999px;border:1px solid rgba(244,244,245,.42);
  background:transparent;cursor:pointer;transition:background .45s var(--ease),border-color .45s var(--ease),transform .45s var(--ease)}
.hero__dots button.on{background:var(--accent);border-color:var(--accent);transform:scale(1.5)}
@media(max-width:900px){.hero__dots{display:none}}

/* ════════════════ BUTTONS ════════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;font-family:var(--body);
  font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:1.05rem 2rem;border-radius:0;border:1px solid var(--accent);
  background:var(--accent);color:#0A0A0B;cursor:pointer;white-space:nowrap;
  transition:transform .3s var(--ease),box-shadow .35s var(--ease),background .3s var(--ease),color .3s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 34px -10px rgba(255,66,48,.55)}
.btn--ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--text);background:rgba(244,244,245,.04);box-shadow:none}
.btn--block{width:100%}
.arw{transition:transform .3s var(--ease)}
.btn:hover .arw{transform:translateX(5px)}
@media(max-width:560px){.btn{width:100%;padding:1.1rem 1.4rem}}

/* ════════════════ TICKER ════════════════ */
.tick{border-block:1px solid var(--line);background:var(--accent);color:#0A0A0B;overflow:hidden;padding:.58rem 0}
.tick--quiet{background:transparent;color:var(--muted);border-color:var(--line-soft)}
.tick__t{display:flex;width:max-content;animation:slide 42s linear infinite}
.tick:hover .tick__t{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.tick__i{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(.85rem,1.7vw,1.15rem);text-transform:uppercase;
  letter-spacing:.03em;padding-inline:1.1rem;display:flex;align-items:center;gap:1.1rem}
.tick__i::after{content:"◆";font-family:var(--body);font-size:.46em;opacity:.5}
@media (prefers-reduced-motion:reduce){.tick__t{animation:none}}

/* ════════════════ SECTIONS ════════════════ */
.sec{padding-block:clamp(4.5rem,11vw,9.5rem)}
.sec--tight{padding-top:0}
.sec__head{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;
  padding-bottom:1.35rem;border-bottom:1px solid var(--line);margin-bottom:clamp(2rem,5vw,3.8rem)}
.sec__head h2{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.9rem,2.69vw,1.97rem);line-height:0.98;letter-spacing:-.018em}
.sec__head .idx{font-size:.62rem;letter-spacing:.3em;color:var(--dim);white-space:nowrap}

/* ════════════════ NEXT EVENT ════════════════ */
.next{background:var(--bg-2)}
.next__grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(1.8rem,5vw,5rem);align-items:start}
@media(max-width:940px){.next__grid{grid-template-columns:1fr}}
.next__flyer{position:relative;border:1px solid var(--line);overflow:hidden;background:var(--surface)}
.next__flyer img{width:100%;transition:transform 1.4s var(--slow)}
.next__flyer:hover img{transform:scale(1.03)}
.next__badge{position:absolute;top:1rem;left:1rem;background:var(--accent);color:#0A0A0B;
  font-size:.58rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:.4rem .82rem;border-radius:0}
.next__badge--quiet{background:transparent;color:var(--muted);border:1px solid var(--line)}

.poster__date{display:flex;align-items:flex-start;gap:clamp(.5rem,1.2vw,.9rem);margin-bottom:.7rem}
.poster__day{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(2.8rem,8vw,5.8rem);line-height:0.9;
  letter-spacing:-.03em;color:var(--accent)}
.poster__mon{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(0.71rem,1.78vw,1.3rem);line-height:1;
  letter-spacing:.02em;padding-top:clamp(.3rem,.9vw,.7rem)}
.poster__title{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.78rem,2.28vw,1.66rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:.3rem}
.poster__venue{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;color:var(--accent);
  font-size:clamp(0.74rem,1.78vw,1.18rem);line-height:1.05;letter-spacing:-.005em;margin-bottom:1.5rem}
.poster__meta{display:flex;flex-wrap:wrap;gap:.5rem 1.8rem;font-size:.8rem;color:var(--muted);
  border-top:1px solid var(--line-soft);padding-top:1.1rem;margin-bottom:1.5rem}
.poster__meta a{border-bottom:1px solid var(--line);transition:border-color .3s,color .3s}
.poster__meta a:hover{color:var(--accent);border-color:var(--accent)}
.poster__lineup{list-style:none;margin:0 0 1.8rem;padding:0;border-top:1px solid var(--line-soft)}
.poster__lineup li{border-bottom:1px solid var(--line-soft);padding:.62rem 0;
  font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:clamp(0.74rem,1.7vw,1.11rem);line-height:1;letter-spacing:-.01em}
.poster__lineup li:first-child{color:var(--accent)}
.ticket-note{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:.9rem 0 0}

.cd{display:flex;gap:.45rem;margin-bottom:1.6rem;max-width:460px}
.cd__u{flex:1;min-width:0;border:1px solid var(--line);padding:.72rem .4rem;text-align:center;
  background:rgba(244,244,245,.02)}
.cd__n{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(0.77rem,2.13vw,1.18rem);line-height:1;font-variant-numeric:tabular-nums}
.cd__l{font-size:.5rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);margin-top:.32rem}

/* no event announced */
.quiet{max-width:44ch}
.quiet__h{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.92rem,2.94vw,2.11rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:1rem}
.quiet p{color:var(--muted);margin:0 0 1.8rem}

/* ════════════════ MANIFESTO ════════════════ */
.man__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.8rem,5vw,5rem);align-items:center}
@media(max-width:940px){.man__grid{grid-template-columns:1fr}}
.man h3{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.98rem,2.8vw,1.86rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:1.4rem}
.man h3 em{font-style:normal;color:var(--accent)}
.man p{font-size:clamp(1rem,1.6vw,1.18rem);line-height:1.55;color:#C9C9D0;max-width:34ch;margin:0}
.man__vid{border:1px solid var(--line);overflow:hidden;aspect-ratio:16/10;background:var(--surface)}
.man__vid video,.man__vid img{width:100%;height:100%;object-fit:cover}

/* ════════════════ STATEMENT ════════════════ */
.statement{border-block:1px solid var(--line);padding-block:clamp(6rem,20vh,14rem);
  position:relative;overflow:hidden;display:grid;place-items:center;min-height:64svh}
.statement::before{content:"";position:absolute;left:50%;top:50%;width:min(130vw,1300px);aspect-ratio:1;
  transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(circle,rgba(255,66,48,.075) 0%,rgba(255,66,48,0) 62%)}
.statement__in{position:relative;text-align:center}
.statement h2{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(1.6rem,4.6vw,3.5rem);line-height:1.06;letter-spacing:-.02em}
.statement h2 .w{display:inline-block;opacity:.14;transition:opacity .9s var(--slow),color .9s var(--slow)}
.statement h2 .w.lit{opacity:1}
.statement h2 .w.acc.lit{color:var(--accent)}
.statement p{margin:clamp(1.6rem,4vw,2.6rem) auto 0;max-width:40ch;color:var(--muted);
  font-size:clamp(.9rem,1.4vw,1.02rem);opacity:0;transition:opacity 1.1s var(--slow) .5s}
.statement p.lit{opacity:1}

/* ════════════════ FACTS ════════════════ */
.facts{border-block:1px solid var(--line);background:var(--bg-2)}
.facts__g{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft)}
@media(max-width:700px){.facts__g{grid-template-columns:repeat(2,1fr)}}
.fact{background:var(--bg-2);padding:clamp(1.6rem,4vw,2.8rem) clamp(1rem,2.4vw,1.6rem)}
.fact__n{font-family:var(--display);font-weight:var(--display-w,800);font-size:clamp(1.5rem,3.6vw,2.6rem);line-height:0.95;
  letter-spacing:-.025em;color:var(--accent)}
.fact__l{font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:.5rem}
.fact__s{font-size:.76rem;color:var(--dim);margin-top:.4rem;line-height:1.45}

/* ════════════════ PRINCIPLES ════════════════ */
.prin{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);
  border-block:1px solid var(--line-soft);margin-top:clamp(3rem,8vw,5.5rem)}
@media(max-width:1000px){.prin{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.prin{grid-template-columns:1fr}}
.prin__i{background:var(--bg);padding:clamp(1.8rem,4vw,3rem) clamp(1.1rem,2vw,1.8rem);
  display:flex;flex-direction:column;min-height:clamp(200px,20vw,270px)}
.prin__n{font-size:.56rem;letter-spacing:.28em;color:var(--accent);margin-bottom:auto}
.prin__t{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:clamp(0.77rem,1.66vw,1.18rem);
  line-height:0.98;letter-spacing:-.018em;margin:2.4rem 0 .7rem}
.prin__d{font-size:.86rem;color:var(--muted);line-height:1.5;margin:0;max-width:24ch}

/* section body copy */
.sec__lead{font-size:clamp(0.85rem,1.78vw,1.22rem);line-height:1.35;letter-spacing:-.012em;
  color:#E4E4E8;max-width:26ch;margin:0 0 1.3rem}
.sec__body{font-size:clamp(.95rem,1.5vw,1.05rem);line-height:1.65;color:var(--muted);
  max-width:52ch;margin:0 0 1.1rem}
.sec__body:last-child{margin-bottom:0}
.sec__note{font-size:.87rem;color:var(--dim);line-height:1.55;max-width:46ch;margin:1.4rem 0 0;
  padding-top:1.2rem;border-top:1px solid var(--line-soft)}
.sec__intro{color:var(--muted);font-size:clamp(.95rem,1.5vw,1.05rem);max-width:52ch;
  margin:-.6rem 0 clamp(1.8rem,4vw,2.6rem)}

/* residency copy column */
.resid__body{font-size:clamp(.95rem,1.5vw,1.05rem);line-height:1.65;color:var(--muted);max-width:44ch;margin:0 0 1.1rem}
.resid__who{font-size:.87rem;color:var(--dim);line-height:1.55;max-width:40ch;margin:0 0 1.6rem;
  padding-top:1.1rem;border-top:1px solid var(--line-soft)}

/* ════════════════ ROOMS LIST ════════════════ */
.rooms{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);
  columns:2;column-gap:clamp(1.6rem,4vw,4rem)}
@media(max-width:700px){.rooms{columns:1}}
.rooms li{break-inside:avoid;display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  border-bottom:1px solid var(--line-soft);padding:.72rem 0}
.rooms__n{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:clamp(0.7rem,1.48vw,0.96rem);
  line-height:1.1;letter-spacing:-.012em}
.rooms__c{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);white-space:nowrap}
.rooms li:first-child .rooms__c,.rooms li:nth-child(2) .rooms__c{color:var(--accent)}

/* ════════════════ FAQ ════════════════ */
.faq{border-top:1px solid var(--line)}
.faq__i{border-bottom:1px solid var(--line-soft)}
.faq__q{width:100%;background:none;border:0;color:var(--text);font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(0.74rem,1.63vw,1.11rem);line-height:1.15;letter-spacing:-.012em;
  text-align:left;padding:1.15rem 2.6rem 1.15rem 0;cursor:pointer;position:relative;
  transition:color .3s var(--ease)}
.faq__q:hover{color:var(--accent)}
.faq__q::after{content:"";position:absolute;right:.4rem;top:50%;width:11px;height:11px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-70%) rotate(45deg);transition:transform .4s var(--slow)}
.faq__i.open .faq__q{color:var(--accent)}
.faq__i.open .faq__q::after{transform:translateY(-30%) rotate(225deg)}
.faq__a{max-height:0;overflow:hidden;transition:max-height .5s var(--slow)}
.faq__a p{margin:0 0 1.3rem;color:var(--muted);font-size:.95rem;line-height:1.65;max-width:58ch}

/* ════════════════ ORIGIN ════════════════ */
.origin{border-top:1px solid var(--line);overflow:hidden}
.origin__label{font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);
  margin:0 0 clamp(1.8rem,5vw,3rem)}
.origin__h{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.99rem,4.29vw,3.47rem);line-height:0.98;letter-spacing:-.018em;margin:0}
/* story left, two vertical films right — fills the space under the heading */
.origin__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.72fr) minmax(0,.72fr);
  gap:clamp(1.6rem,4vw,3.4rem);align-items:end;margin-top:clamp(2.6rem,7vw,5rem)}
@media(max-width:1000px){.origin__grid{grid-template-columns:1fr 1fr;gap:1.6rem 2rem}
  .origin__text{grid-column:1/-1;margin-bottom:.6rem}}
@media(max-width:560px){.origin__grid{grid-template-columns:1fr}}
.origin__text p{font-size:clamp(.98rem,1.6vw,1.14rem);line-height:1.62;color:#C4C4CB;
  max-width:44ch;margin:0 0 1.2rem}
.origin__text p:last-of-type{margin-bottom:0}
.origin__fig{margin:0;position:relative}
.origin__fig img,.origin__fig video{width:100%;height:auto;display:block;border:1px solid var(--line-soft)}
.origin__fig{display:flex;flex-direction:column;justify-content:flex-end}
.origin__fig video{aspect-ratio:9/16;object-fit:cover;background:var(--surface);width:100%}
.origin__cap{font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);
  margin-top:.9rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;min-height:3.4em;align-items:flex-start}
.origin__cap a{color:var(--muted);border-bottom:1px solid var(--line-soft);transition:color .3s}
.origin__cap a:hover{color:var(--accent);border-color:var(--accent)}
.origin__close{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.67rem,2.28vw,1.76rem);line-height:1.05;letter-spacing:-.018em;
  margin:clamp(3.5rem,9vw,7rem) 0 0;max-width:20ch}
.origin__close em{font-style:normal;color:var(--accent)}

/* ════════════════ SECTION COVER ════════════════ */
.cover{position:relative;overflow:hidden;margin-bottom:clamp(2rem,5vw,3.6rem);
  aspect-ratio:21/9;background:var(--surface)}
@media(max-width:700px){.cover{aspect-ratio:16/10}}
.cover img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);
  transition:transform 1.6s var(--slow),filter 1.2s var(--slow);filter:saturate(.92) brightness(.82)}
.cover.in img{transform:scale(1)}
.cover::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,11,.45) 0%,rgba(10,10,11,.05) 45%,rgba(10,10,11,.75) 100%)}

/* ════════════════ RESIDENCY ════════════════ */
.resid{background:var(--bg-2);border-block:1px solid var(--line)}
.resid__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.8rem,5vw,4.5rem);align-items:center}
@media(max-width:940px){.resid__grid{grid-template-columns:1fr}}
.resid__day{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;color:var(--accent);
  font-size:clamp(1.09rem,3.63vw,2.72rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:.2rem}
.resid__venue{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.77rem,2.13vw,1.54rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:.9rem}
.resid__line{color:var(--muted);font-size:clamp(.95rem,1.5vw,1.08rem);max-width:32ch;margin:0 0 1.6rem}
.resid__meta{display:flex;flex-wrap:wrap;gap:.5rem 1.8rem;font-size:.8rem;color:var(--muted);
  border-top:1px solid var(--line-soft);padding-top:1.1rem;margin-bottom:1.6rem}
.resid__meta a{border-bottom:1px solid var(--line)}
.resid__meta a:hover{color:var(--accent);border-color:var(--accent)}
.resid__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-soft)}
.resid__list a{display:grid;grid-template-columns:52px 1fr auto;gap:1rem;align-items:center;
  border-bottom:1px solid var(--line-soft);padding:.78rem 0;
  transition:padding-left .45s var(--slow),color .3s var(--ease)}
.resid__list a:hover{padding-left:.9rem}
.resid__list a:hover .rl__t{color:var(--accent)}
.rl__d{font-family:var(--display);font-weight:var(--display-w,800);font-size:1.5rem;line-height:0.98;color:var(--accent);letter-spacing:-.018em}
.rl__d small{display:block;font-family:var(--body);font-size:.5rem;letter-spacing:.2em;
  color:var(--muted);margin-top:.16rem}
.rl__t{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:clamp(0.7rem,1.48vw,0.96rem);
  line-height:1;letter-spacing:-.01em;transition:color .3s var(--ease)}
.rl__n{font-size:.68rem;color:var(--dim);text-align:right;white-space:nowrap}
@media(max-width:560px){.resid__list a{grid-template-columns:46px 1fr}.rl__n{display:none}}

/* ════════════════ RESIDENTS ════════════════ */
.res{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-soft);
  border-block:1px solid var(--line-soft)}
@media(max-width:940px){.res{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.res{grid-template-columns:1fr}}
.res__c{position:relative;display:flex;flex-direction:column;background:var(--bg);
  padding:clamp(1.5rem,3vw,2.2rem) clamp(1.1rem,2vw,1.5rem);min-height:clamp(190px,22vw,250px);
  transition:background .45s var(--ease)}
.res__c:hover{background:var(--surface)}
.res__r{font-size:.57rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:.85rem}
.res__n{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.83rem,1.89vw,1.3rem);line-height:0.98;letter-spacing:-.018em;margin-bottom:.6rem}
.res__x{font-size:.85rem;color:var(--muted);line-height:1.5;margin:0 0 auto;max-width:26ch}
.res__l{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);
  margin-top:1.4rem;transition:color .3s var(--ease)}
a.res__c:hover .res__l{color:var(--accent)}
/* when a real portrait is supplied the card becomes an image card */
.res__c--photo{padding:0;min-height:0}
.res__img{position:relative;aspect-ratio:4/5;overflow:hidden}
.res__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--slow)}
.res__c--photo:hover .res__img img{transform:scale(1.045)}
.res__img::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,10,11,0) 45%,rgba(10,10,11,.9) 100%)}
.res__c--photo .res__b{padding:1rem 1rem 1.25rem;display:flex;flex-direction:column;gap:.3rem}

/* ════════════════ IN THE ROOM (credits) ════════════════ */
.credits{display:flex;flex-wrap:wrap;gap:.4rem 0;align-items:baseline}
.credits li{list-style:none;font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.62rem,1.78vw,1.24rem);line-height:1.12;letter-spacing:-.015em;color:#B9B9C1;
  transition:color .35s var(--ease)}
.credits li:hover{color:var(--accent)}
.credits li::after{content:"·";color:var(--dim);padding-inline:.55em;font-family:var(--body);font-size:.6em}
.credits li:last-child::after{content:""}

/* ════════════════ THE PEOPLE ════════════════ */
.ppl{display:flex;gap:.5rem;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;padding-bottom:1.1rem;
  scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.ppl::-webkit-scrollbar{height:2px}
.ppl::-webkit-scrollbar-thumb{background:var(--line)}
.ppl figure{margin:0;flex:0 0 clamp(190px,24vw,300px);scroll-snap-align:start;
  aspect-ratio:3/4;overflow:hidden;background:var(--surface)}
.ppl img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--slow)}
.ppl figure:hover img{transform:scale(1.05)}
.hint{font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);margin:.5rem 0 0}

/* ════════════════ THE INDEX ════════════════ */
.index__list{border-top:1px solid var(--line)}
.index__row{display:grid;grid-template-columns:8.4rem 1fr auto;align-items:center;gap:1.4rem;
  padding:1.2rem 0;border-bottom:1px solid var(--line-soft);position:relative;
  transition:padding-left .5s var(--slow),opacity .45s var(--ease)}
.index__row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent);
  transform:scaleY(0);transition:transform .45s var(--slow)}
.index__list.hovering .index__row{opacity:.32}
.index__list.hovering .index__row:hover{opacity:1;padding-left:1.2rem}
.index__row:hover::before{transform:scaleY(1)}
.index__d{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  white-space:nowrap;font-variant-numeric:tabular-nums;transition:color .35s var(--ease)}
.index__row:hover .index__d{color:var(--accent)}
.index__t{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.78rem,1.78vw,1.33rem);line-height:1;letter-spacing:-.012em;transition:color .35s var(--ease)}
.index__row:hover .index__t{color:var(--accent)}
.index__v{font-size:.76rem;color:var(--muted);text-align:right;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:22ch}
.index__thumb{display:none}

.peek{position:fixed;top:0;left:0;width:250px;pointer-events:none;z-index:850;opacity:0;
  border:1px solid var(--line);box-shadow:0 30px 90px -24px rgba(0,0,0,.9);
  transition:opacity .45s var(--slow)}
.peek.on{opacity:1}
.peek img{width:100%;display:block}
@media(max-width:1024px),(hover:none){.peek{display:none}}

@media(max-width:900px),(hover:none){
  .index__row{grid-template-columns:60px 1fr;grid-template-areas:"f d" "f t" "f v";
    gap:.15rem .9rem;padding:.95rem 0;align-items:start}
  .index__thumb{display:block;grid-area:f;width:60px;aspect-ratio:4/5;overflow:hidden;
    background:var(--surface);border:1px solid var(--line-soft)}
  .index__thumb img{width:100%;height:100%;object-fit:cover}
  .index__d{grid-area:d;font-size:.6rem;color:var(--accent);letter-spacing:.16em}
  .index__t{grid-area:t;font-size:1.1rem}
  .index__v{grid-area:v;display:block;text-align:left;font-size:.7rem;max-width:none}
  .index__list.hovering .index__row{opacity:1}
  .index__list.hovering .index__row:hover{padding-left:0}
}

/* ════════════════ THE ROOM ════════════════ */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem}
@media(max-width:1000px){.gal{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.gal{grid-template-columns:repeat(2,1fr)}}
.gal figure{margin:0;overflow:hidden;background:var(--surface);aspect-ratio:4/5;position:relative}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--slow)}
.gal figure:hover img{transform:scale(1.05)}
.gal figure.wide:nth-child(7n+3){grid-column:span 2;aspect-ratio:16/10}
.gal figure.hid{display:none}
.gal__more{display:flex;justify-content:center;margin-top:1.6rem}

/* ════════════════ VENUES ════════════════ */
.venues{border-bottom:1px solid var(--line);padding-block:clamp(2.2rem,5vw,3.4rem);overflow:hidden}
.venues__t{display:flex;align-items:center;gap:clamp(2.6rem,6vw,5.5rem);width:max-content;
  animation:slide 52s linear infinite}
.venues:hover .venues__t{animation-play-state:paused}
.venues__t img{height:clamp(22px,3.4vw,34px);width:auto;opacity:.3;flex:none;
  filter:grayscale(1) brightness(2.6);transition:opacity .4s var(--ease)}
.venues__t img:hover{opacity:1}
@media (prefers-reduced-motion:reduce){.venues__t{animation:none;flex-wrap:wrap;width:auto;justify-content:center}}

/* ════════════════ PLAY ════════════════ */
.play{border-top:1px solid var(--line);background:var(--bg-2)}
.play__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,6vw,5rem);align-items:end}
@media(max-width:900px){.play__grid{grid-template-columns:1fr;gap:1.8rem}}
.play__label{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin:0 0 1.4rem}
.play__h{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.87rem,2.9vw,2.18rem);line-height:0.98;letter-spacing:-.018em;margin:0 0 1.4rem}
.play__b{font-size:clamp(.98rem,1.6vw,1.14rem);line-height:1.6;color:#C4C4CB;max-width:40ch;margin:0 0 1rem}
.play__d{font-size:.88rem;color:var(--muted);max-width:38ch;margin:0}
.play__side{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}

/* ════════════════ JOIN ════════════════ */
.join{background:var(--bg-2)}
.join__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
@media(max-width:940px){.join__grid{grid-template-columns:1fr}}
.join h2{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(0.92rem,2.84vw,2.02rem);line-height:0.98;letter-spacing:-.018em}
.join h2 em{font-style:normal;color:var(--accent)}
.join p{color:var(--muted);max-width:34ch;margin:1.1rem 0 0;font-size:.96rem}
.form{display:flex;flex-direction:column;gap:.65rem}
.form__row{display:flex;gap:.6rem}
@media(max-width:620px){.form__row{flex-direction:column}}
.form input{flex:1;min-width:0;background:transparent;border:1px solid var(--line);color:var(--text);
  padding:1.05rem 1.15rem;font-family:var(--body);font-size:.95rem;border-radius:0;
  transition:border-color .3s var(--ease)}
.form input::placeholder{color:var(--dim)}
.form input:focus{outline:none;border-color:var(--accent)}
.form .fine{font-size:.7rem;color:var(--dim);line-height:1.5;margin:0}
.form__ok{border:1px solid var(--accent);color:var(--accent);padding:1.1rem 1.2rem;font-size:.9rem;display:none}
.form__ok.on{display:block}
.hp{position:absolute;left:-9999px}

/* ════════════════ FOOTER ════════════════ */
.foot{padding-block:clamp(3.4rem,8vw,5.5rem) 2.2rem}
.foot__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2.4rem;
  padding-bottom:2.6rem;border-bottom:1px solid var(--line-soft)}
@media(max-width:820px){.foot__grid{grid-template-columns:1fr 1fr}.foot__brand{grid-column:1/-1}}
.foot__brand .wm{height:20px;width:auto;color:var(--text);margin-bottom:1.1rem;display:block}
.foot__brand p{color:var(--muted);font-size:.86rem;margin:0;line-height:1.7}
.foot h3,.foot__h{font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--dim);margin-bottom:1rem}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.foot ul a{font-size:.88rem;color:#C4C4CB;transition:color .3s var(--ease)}
.foot ul a:hover{color:var(--accent)}
.foot__base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.8rem;
  padding-top:1.6rem;font-size:.7rem;color:var(--dim)}

/* ════════════════ STICKY TICKET ════════════════ */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:880;background:rgba(13,13,15,.95);
  backdrop-filter:blur(18px);border-top:1px solid var(--line);
  padding:.68rem var(--pad);padding-bottom:calc(.68rem + env(safe-area-inset-bottom));
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  transform:translateY(115%);transition:transform .55s var(--slow)}
.sticky.on{transform:translateY(0)}
.sticky__d{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;font-size:.98rem;line-height:1.05}
.sticky__v{font-size:.66rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sticky .btn{padding:.78rem 1.35rem;font-size:.68rem;width:auto;flex-shrink:0}
@media(min-width:1025px){.sticky{display:none}}

/* ════════════════ REVEAL ════════════════ */
.rv{opacity:0;transform:translateY(20px);transition:opacity .85s var(--slow),transform .85s var(--slow)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .rv,.statement p{opacity:1!important;transform:none!important;transition:none}
  .statement h2 .w{opacity:1!important}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ═══════════ MULTI-PAGE CHROME ═══════════ */

/* the landing's way in — the only navigation the first screen needs */}

/* the nav action is type, not a button. Red only once tickets are real. */
.nav__act{font-size:.66rem!important;letter-spacing:.24em!important;color:var(--muted)!important;
  display:inline-flex;align-items:center;gap:.5rem;min-height:44px;
  transition:color .35s var(--ease)}
.nav__act .arw{transition:transform .35s var(--ease)}
.nav__act:hover{color:var(--text)!important}
.nav__act:hover .arw{transform:translateX(4px)}
.nav__act[data-live="true"]{color:var(--accent)!important}

/* the mobile menu opens like a contents page */
@media(max-width:900px){
  .nav__links{gap:.2rem!important}
  .nav__links a{font-size:clamp(1.5rem,7vw,2.4rem)!important;letter-spacing:-.02em!important;
    font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
    color:var(--text)!important;padding-block:.45rem;line-height:1}
  .nav__links a:hover{color:var(--accent)!important}
  .nav__act{font-size:.72rem!important;letter-spacing:.24em!important;
    font-family:var(--body)!important;font-weight:600;margin-top:1.6rem}
}

/* art-directed crops: nothing important is allowed to fall outside the frame,
   and the phone gets its own focal point where the picture demands it */
.hero__slide{object-position:var(--fp,50% 45%)}
#heroVid{object-position:50% 42%}
@media(max-width:640px){
  .hero__slide{object-position:var(--fpm,var(--fp,50% 40%))}
  #heroVid{object-position:52% 40%}
}

/* A full-bleed film used as a break between the chapters and the practical
   end of the page. It sits flush against what surrounds it and carries a
   caption, so it reads as a deliberate cut rather than a stray video. */
.band{position:relative;width:100%;overflow:hidden;background:var(--bg);
  height:clamp(40svh,48vh,60svh);display:block}
.band video{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.band::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,11,.5) 0%,rgba(10,10,11,0) 26%,
    rgba(10,10,11,0) 62%,rgba(10,10,11,.82) 100%)}
.band__cap{position:absolute;left:var(--pad);right:var(--pad);bottom:clamp(1.2rem,3.5vh,2.2rem);
  z-index:2;margin:0;display:flex;justify-content:space-between;gap:1rem;
  font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
@media(max-width:640px){
  .band{height:clamp(34svh,42vh,48svh)}
  .band video{object-position:52% 42%}
  .band__cap{font-size:.54rem;letter-spacing:.22em}
}

/* ═══════════ THE ONE MOMENT ═══════════
   The single thing here meant to be remembered. The letterforms are a window
   onto the floor itself — the photograph is clipped inside the type rather
   than sitting behind it in a box. No glow, no gradient, no card.          */
.moment{display:flex;align-items:center;
  padding-block:clamp(3.4rem,9vh,6rem)}
.moment__in{width:100%}


.moment__t{margin:0;font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(1.35rem,4.9vw,4.4rem);line-height:.92;
  letter-spacing:-.03em;color:var(--text)}
.moment__t span{display:block;overflow:hidden}
.moment__t span > i{display:block;font-style:normal;transform:translateY(104%);
  transition:transform 1.15s var(--slow)}
.moment.in span:nth-child(1) > i{transition-delay:0s}
.moment.in span:nth-child(2) > i{transition-delay:.08s}
.moment.in span > i{transform:translateY(0)}
.moment__t em{font-style:normal;color:var(--accent);-webkit-text-fill-color:var(--accent)}

/* the photographic fill, only where the browser can actually clip to text —
   otherwise the type simply stays bone-white and nothing is lost */
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .moment__t.filled{
    /* the image itself is set on the element, so one path works both for the
       deployed stylesheet and for the inlined single-file preview */
    background-size:cover;background-position:50% 45%;background-repeat:no-repeat;
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent}
}
.moment__cap{margin:clamp(1.4rem,3.4vh,2.2rem) 0 0;font-size:.68rem;letter-spacing:.12em;
  text-transform:none;color:var(--muted);max-width:48ch;line-height:1.7}
@media (prefers-reduced-motion:reduce){
  .moment__t span > i{transform:none;transition:none}
}

/* The landing is a sequence of images and type, not a stack of documents —
   it wants a tighter vertical rhythm than the pages you actually read. */
body.landing .sec{padding-block:clamp(3rem,7vw,5.5rem)}
body.landing .venues{padding-block:clamp(1.8rem,4vw,2.6rem)}
body.landing .partner{padding-block:clamp(1.2rem,3vw,1.8rem)}

.room__v{width:100%;height:100%;object-fit:cover;display:block;background:var(--surface)}

/* the recorded set — a link into the room, not an embedded player */
.setblk{margin-top:clamp(2rem,5vw,3.4rem);border-top:1px solid var(--line-soft);padding-top:clamp(1.4rem,3.4vw,2.2rem)}
.setblk[hidden]{display:none}
.setblk__a{display:flex;align-items:center;gap:clamp(1rem,2.6vw,1.6rem);
  transition:color .35s var(--ease)}
.setblk__play{flex:none;width:clamp(42px,5vw,54px);height:clamp(42px,5vw,54px);border-radius:50%;
  border:1px solid var(--line);display:grid;place-items:center;font-size:.8rem;color:var(--text);
  transition:border-color .35s var(--ease),background .35s var(--ease),color .35s var(--ease)}
.setblk__a:hover .setblk__play{border-color:var(--accent);background:var(--accent);color:#0A0A0B}
.setblk__txt{display:flex;flex-direction:column;gap:.28rem;min-width:0}
.setblk__l{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}
.setblk__t{font-family:var(--display);font-weight:var(--display-w,800);text-transform:uppercase;
  font-size:clamp(.95rem,2.2vw,1.35rem);line-height:1.05;letter-spacing:-.02em}
.setblk__a:hover .setblk__t{color:var(--accent)}
.setblk__n{font-size:.74rem;color:var(--muted);line-height:1.6}

/* ═══════════ NEXT GATHERING (landing) ═══════════
   Only exists when an event is announced. Flyer on the left at its own
   aspect ratio, the facts on the right. Hidden entirely the rest of the
   time — an empty "no events" block is worse than no block.            */
.nextup{border-top:1px solid var(--line);padding-block:clamp(2.6rem,7vw,4.6rem)}
.nextup[hidden]{display:none}
.nextup__grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);
  gap:clamp(1.6rem,5vw,4rem);align-items:center}
.nextup__art{display:block;overflow:hidden;background:var(--surface);max-width:420px}
.nextup__art img{width:100%;height:auto;display:block;
  transition:transform 1.2s var(--slow)}
.nextup__art:hover img{transform:scale(1.03)}
.nextup__label{margin:0 0 clamp(.7rem,2vw,1.1rem);font-size:.58rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--accent)}
.nextup__t{margin:0;font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(1.3rem,3.6vw,2.6rem);line-height:.98;letter-spacing:-.028em}
.nextup__meta{margin:clamp(.8rem,2vw,1.2rem) 0 0;font-size:.68rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);line-height:1.9}
.nextup__line{list-style:none;margin:clamp(.9rem,2vw,1.3rem) 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:.25rem .9rem;max-width:44ch}
.nextup__line li{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.nextup__cta{margin-top:clamp(1.2rem,3vw,1.9rem)}
@media(max-width:760px){
  .nextup__grid{grid-template-columns:1fr;gap:1.6rem}
  .nextup__art{max-width:none}
}

/* ═══════════ CHAPTERS ═══════════
   Not a sitemap. A contents page, with the photograph of each destination
   crossfading alongside as you move down the list.                          */
.chapters{border-top:1px solid var(--line);padding-block:clamp(2.4rem,6vh,4rem)}
.chapters__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(2rem,6vw,6rem);align-items:center}
.chapters__list{display:block}
.chapter{display:grid;grid-template-columns:auto 1fr;align-items:baseline;
  gap:clamp(1rem,3vw,2.4rem);padding-block:clamp(.9rem,2.4vh,1.5rem);
  border-bottom:1px solid var(--line-soft);
  transition:padding-left .55s var(--slow),color .4s var(--ease)}
.chapter:last-child{border-bottom:0}
.chapter__n{font-size:.58rem;letter-spacing:.28em;color:var(--dim);
  transition:color .4s var(--ease)}
.chapter__t{font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(1.05rem,2.6vw,1.9rem);line-height:.98;
  letter-spacing:-.025em}
.chapters__list:hover .chapter{opacity:.34}
.chapters__list:hover .chapter:hover{opacity:1;padding-left:clamp(.4rem,1.6vw,1.2rem)}
.chapter:hover .chapter__n{color:var(--accent)}

.chapters__art{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--surface)}
.chapters__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transform:scale(1.04);
  transition:opacity .7s var(--ease),transform 1.4s var(--slow)}
.chapters__img.on{opacity:1;transform:scale(1)}
@media(max-width:900px){
  .chapters__grid{grid-template-columns:1fr;gap:2rem}
  .chapters__art{aspect-ratio:16/10;order:-1}
}
@media(max-width:560px){
  .chapters__art{display:none}          /* no hover on touch — the list stands alone */
  .chapters__list:hover .chapter{opacity:1}
}

/* short pages should hand you the next one, not stop dead */
.pager{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr}
.pager__a{display:flex;flex-direction:column;gap:.5rem;padding:clamp(1.6rem,5vw,3rem) var(--pad);
  transition:background .35s var(--ease)}
.pager__a--n{text-align:right;border-left:1px solid var(--line)}
.pager__a span{font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--dim)}
.pager__a em{font-style:normal;font-family:var(--display);font-weight:var(--display-w,800);
  text-transform:uppercase;font-size:clamp(.95rem,2.4vw,1.5rem);line-height:1.05;letter-spacing:-.015em}
.pager__a:hover{background:var(--surface)}
.pager__a:hover em{color:var(--accent)}
@media(max-width:560px){.pager{grid-template-columns:1fr}
  .pager__a--n{text-align:left;border-left:0;border-top:1px solid var(--line)}}

/* the landing holds one screen; section pages start below the fixed nav */
body.landing{overflow-x:hidden}
body.landing .hero{min-height:calc(100svh - 1px)}
/* The bar is fixed, so section pages reserve its height on <main> itself.
   Relying on the first section's padding was fragile — any section whose own
   rule zeroed padding-top slid its heading under the logo. */
body.page main{padding-top:var(--nav-h)}
body.landing main{padding-top:0}
main > .sec:first-child,main > .facts:first-child{padding-top:clamp(3.4rem,8vw,6.5rem)}
main > .sec--tight:first-child,main > .sec--quiet:first-child{padding-top:clamp(3.4rem,8vw,6.5rem)}
/* the preview stacks every page inside one document; archive pads its own
   header by --nav-h already, so it must not also inherit main's reservation */
main.pv-page[data-page="archive.html"]{padding-top:0}
.intro__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,6vw,5rem);
  align-items:end;margin-top:clamp(2rem,5vw,3.4rem)}
@media(max-width:900px){.intro__grid{grid-template-columns:1fr;gap:2rem}}
.intro__grid p{color:var(--muted);font-size:clamp(.95rem,1.5vw,1.08rem);line-height:1.75;margin:0 0 1.1rem;max-width:56ch}
.nav__links a[aria-current=page]{color:var(--text)}
.skip{position:absolute;left:-9999px;top:0;z-index:10000;background:var(--accent);color:#0A0A0B;
  padding:.8rem 1.2rem;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase}
.skip:focus{left:0}

/* the live hero carries its own countdown */
#cdHero{margin-top:clamp(1.2rem,3vw,2rem)}