/* ============================================================
   NextGen Storytellers 2.0: public site
   Poster type on a night sky. Rows and rules instead of cards;
   no pills, no chips.
   ============================================================ */

:root{
  --void:#05020e; --void-2:#0a0519; --panel:#120a26;
  --violet:#7c3aed; --violet-2:#a855f7; --lilac:#c4b5fd;
  --star:#f5f3ff; --ink:#e4def8; --muted:#a79cc9; --muted-2:#7f75a1;
  --live:#ff3d71; --gold:#ffd36e; --ok:#6ee7b7;
  --hair:rgba(255,255,255,.14); --hair-2:rgba(255,255,255,.07);

  --f-display:"Anton", Impact, "Arial Narrow", sans-serif;
  --f-sans:"Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Spacing scale (8px base). Use these instead of one-off numbers. */
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:32px; --sp-5:48px; --sp-6:64px; --sp-7:96px; --sp-8:128px;
  --sec:clamp(80px,9vw,144px);         /* vertical padding of a section */
  --sec-tight:clamp(56px,6vw,96px);    /* ... of a tighter section */
  --gut:clamp(24px,5vw,96px);          /* the left and right page margin every block aligns to */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; -webkit-tap-highlight-color:transparent; scroll-behavior:smooth; background:var(--void); }
a,button,label,select,summary{ touch-action:manipulation; }
body{
  margin:0; font-family:var(--f-sans); font-size:17px; line-height:1.65;
  color:var(--ink); overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
img,svg,video{ display:block; max-width:100%; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4,h5,p,figure{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
::selection{ background:var(--violet); color:#fff; }
[hidden]{ display:none !important; }
:focus-visible{ outline:2px solid var(--violet-2); outline-offset:3px; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.muted{ color:var(--muted); } .dim{ color:var(--muted-2); }

/* The sky. Nothing above it may form a stacking context around the logo
   clip, or its black backdrop stops blending away: so .page has no z-index. */
.cosmos,#starfield{ position:fixed; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; }
.cosmos{
  background:
    radial-gradient(1100px 700px at 12% -5%, rgba(124,58,237,.30), transparent 62%),
    radial-gradient(900px 620px at 88% 8%, rgba(30,6,135,.52), transparent 60%),
    radial-gradient(1000px 800px at 50% 108%, rgba(168,85,247,.2), transparent 64%),
    linear-gradient(180deg,var(--void),var(--void-2) 45%,#0b0520);
}
.page{ position:relative; }
.nebula{ display:none; }

.shell,.shell--wide{ width:100%; padding-inline:var(--gut); }
.section{ position:relative; padding-block:var(--sec); }
.section--tight{ padding-block:var(--sec-tight); }

/* ---------- type ---------- */
.title{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); line-height:.98; letter-spacing:.002em; }
.title--xl{ font-size:clamp(4rem,15vw,15rem); line-height:.92; }
.title--lg{ font-size:clamp(3rem,8.4vw,8.5rem); }
.title--md{ font-size:clamp(1.9rem,3.4vw,3.2rem); line-height:1.04; }
.lede{ font-size:clamp(1.05rem,1.5vw,1.3rem); color:var(--muted); max-width:58ch; line-height:1.5; }
.eyebrow{ display:block; font-size:.95rem; font-weight:500; color:var(--lilac); }
.section-head{ margin-bottom:clamp(40px,5vw,80px); display:grid; gap:var(--sp-3); }
.section-head--split{ grid-template-columns:1fr minmax(0,30rem); align-items:end; gap:32px; }

/* ---------- buttons ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; border:0; border-radius:999px; cursor:pointer; overflow:hidden; isolation:isolate;
  background:var(--star); color:var(--void); font-weight:600; font-size:1rem; white-space:nowrap;
  transition:color .35s var(--ease), transform .35s var(--ease-out);
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--violet);
  transform:translateY(101%); transition:transform .45s var(--ease-io);
}
.btn:hover{ color:#fff; }
.btn:hover::before{ transform:none; }
.btn svg{ width:16px; height:16px; fill:currentColor; }
.btn--ghost{ background:none; color:var(--star); box-shadow:inset 0 0 0 1px var(--hair); }
.btn--live{ background:var(--live); color:#fff; }
.btn--live::before{ background:#c8104a; }
.btn--lg{ padding:18px 34px; font-size:1.08rem; }
.btn--sm{ padding:10px 20px; font-size:.92rem; }
.btn--block{ width:100%; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }
.btn-row{ display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-3); align-items:center; }

/* Plain labels: what used to be boxed badges and chips. */
.badge{ display:inline-flex; align-items:center; gap:8px; font-weight:500; font-size:.92rem; color:var(--lilac); white-space:nowrap; }
.badge--online{ color:var(--ok); } .badge--physical{ color:var(--gold); }
.badge--live{ color:#ff8fab; } .badge--done{ color:var(--muted-2); }
.dot{ width:7px; height:7px; border-radius:50%; background:currentColor; flex:none; }
.dot--pulse{ animation:dotPulse 1.6s ease-in-out infinite; }
@keyframes dotPulse{ 0%,100%{ opacity:1; } 60%{ opacity:.35; } }

/* ---------- nav ---------- */
.nav{ position:fixed; inset:0 0 auto 0; z-index:110; transition:top .3s var(--ease), transform .5s var(--ease-io), background .4s; }
.nav.is-stuck{ background:rgba(5,2,14,.86); backdrop-filter:blur(14px); }
.nav.is-stuck .nav__inner{ height:66px; }
.nav__inner{ transition:height .4s var(--ease); }
.nav.is-away{ transform:translateY(-110%); }
.nav__inner{ display:flex; align-items:center; justify-content:space-between; gap:20px; height:84px; }
.nav__brand{ display:inline-flex; align-items:center; min-height:44px; }
.nav__brand img{ height:36px; width:auto; }
.nav__brand-txt{ display:none; }
.nav__links{ display:flex; gap:clamp(18px,2.6vw,38px); }
.nav__links a{ position:relative; display:inline-flex; align-items:center; min-height:44px; font-weight:500; color:var(--ink); }
.nav__links a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1.5px; background:var(--violet-2);
  transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease-io);
}
.nav__links a:hover::after,.nav__links a.is-active::after{ transform:scaleX(1); transform-origin:left; }
.nav__cta{ display:flex; align-items:center; gap:12px; }
.nav__burger{ display:none; width:44px; height:44px; background:none; border:0; cursor:pointer; align-items:center; justify-content:center; }
.nav__burger span,.nav__burger span::before,.nav__burger span::after{ display:block; width:24px; height:2px; background:var(--star); transition:transform .3s var(--ease), background .2s; }
.nav__burger span{ position:relative; }
.nav__burger span::before,.nav__burger span::after{ content:""; position:absolute; left:0; }
.nav__burger span::before{ top:-7px; } .nav__burger span::after{ top:7px; }
.nav__burger.is-open span{ background:transparent; }
.nav__burger.is-open span::before{ top:0; transform:rotate(45deg); }
.nav__burger.is-open span::after{ top:0; transform:rotate(-45deg); }
.nav__drawer{
  position:fixed; inset:0; z-index:109; display:flex; flex-direction:column; justify-content:center; padding:0 var(--gut); overflow-y:auto;
  background:var(--void); clip-path:inset(0 0 100% 0); visibility:hidden;
  transition:clip-path .6s var(--ease-io), visibility 0s linear .6s;
}
.nav__drawer.is-open{ clip-path:inset(0); visibility:visible; transition-delay:0s; }
.nav__drawer a{ font-family:var(--f-display); text-transform:uppercase; font-size:clamp(2.2rem,min(16vw,13svh),6rem); line-height:1.08; color:var(--star); }

/* ---------- live bar + takeover ---------- */
.livebar{ position:fixed; inset:0 0 auto 0; z-index:120; display:none; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap; padding:9px 18px; background:var(--live); color:#fff; font-weight:600; font-size:.95rem; }
.livebar.is-on{ display:flex; }
body.has-livebar .nav{ top:var(--livebar-h,44px); }
.livebar__tag{ display:inline-flex; align-items:center; gap:7px; }
.livebar__join{ text-decoration:underline; text-underline-offset:3px; }

.takeover{
  position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:24px var(--gut); overflow:auto;
  background:var(--void); opacity:0; visibility:hidden; transition:opacity .5s var(--ease), visibility 0s linear .5s;
}
.takeover.is-on{ opacity:1; visibility:visible; transition-delay:0s; }
.takeover__warp{ position:absolute; inset:0; width:100%; height:100%; }
.takeover__close{ position:absolute; top:22px; right:var(--gut); z-index:2; width:44px; height:44px; background:none; border:0; color:var(--star); font-size:2rem; line-height:1; cursor:pointer; }
.takeover__inner{ position:relative; z-index:1; width:100%; }
.takeover__pill{ display:inline-flex; align-items:center; gap:10px; color:#ff8fab; font-weight:600; font-size:clamp(1rem,1.6vw,1.3rem); }
.takeover__kicker{ margin-top:10px; color:var(--lilac); }
.takeover__title{ margin:14px 0 18px; font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(3.2rem,12vw,12rem); line-height:.95; }
.takeover__sub{ color:var(--muted); font-size:clamp(1.05rem,1.5vw,1.3rem); margin-bottom:20px; }
.takeover__meta{ display:flex; flex-wrap:wrap; gap:10px 28px; margin-bottom:30px; color:var(--ink); }
.takeover__meta span{ display:inline-flex; align-items:center; gap:8px; }
.takeover__actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; padding:clamp(108px,14vh,136px) var(--gut) 0; overflow:hidden; }
.hero__meta{ display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; color:var(--lilac); font-weight:500; }
.hero__main{ flex:1; display:grid; grid-template-columns:minmax(0,1fr) auto; align-content:center; align-items:center; column-gap:clamp(12px,2vw,32px); padding-block:clamp(14px,2.4vh,30px); }
.hero__brand{ grid-column:1; display:flex; align-items:flex-end; gap:clamp(12px,2vw,32px); font-weight:400; }
.hero__brand img{ width:min(68vw,calc(30svh * 4.27)); height:auto; filter:drop-shadow(0 0 44px rgba(168,85,247,.45)); will-change:transform; }
.hero__learn{ grid-column:1; display:flex; flex-wrap:wrap; align-items:baseline; gap:0 .22em; margin-top:clamp(10px,2vh,24px); font-family:var(--f-display); text-transform:uppercase; color:var(--star); font-size:min(9.8vw,22svh); line-height:1.02; }
/* Words share one grid cell: the box is as big as the longest word, with
   nothing clipped, and they crossfade instead of sliding through a window. */
.rotator{ display:inline-grid; color:var(--violet-2); }
.rotator span{
  grid-area:1/1; white-space:nowrap; opacity:0; transform:translateY(.2em);
  transition:opacity .4s var(--ease), transform .7s var(--ease-out);
}
.rotator span.is-in{ opacity:1; transform:none; transition-delay:.14s; }
.rotator span.is-out{ opacity:0; transform:translateY(-.2em); }
.hero__clip{
  grid-column:2; grid-row:1 / span 2; width:min(18vw,44svh);
  aspect-ratio:1164/988; object-fit:contain; mix-blend-mode:screen; pointer-events:none;
}
.hero__facts{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,3vw,44px); align-items:center; padding-block:clamp(20px,3.4vh,36px); border-top:1px solid var(--hair); }
.hero__fact b{ display:block; color:var(--star); font-weight:600; font-size:1.08rem; line-height:1.25; }
.hero__fact span{ color:var(--muted); font-size:.93rem; }

/* Entrance, released when the loading screen lifts (loader.js). */
[data-in]{ transition:opacity 1s var(--ease-out), transform 1.2s var(--ease-out); transition-delay:calc(var(--i,0) * 90ms + 180ms); }
html.is-loading [data-in]{ opacity:0; transform:translateY(46px); }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity .9s var(--ease-out), transform 1s var(--ease-out); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.08s; } .reveal[data-d="2"]{ transition-delay:.16s; }
.reveal[data-d="3"]{ transition-delay:.24s; } .reveal[data-d="4"]{ transition-delay:.32s; }

/* ---------- marquee ---------- */
.marquee{ overflow:hidden; padding-block:6px; }
.marquee__track{ display:flex; width:max-content; animation:marquee var(--speed,50s) linear infinite; }
.marquee--rev .marquee__track{ animation-direction:reverse; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%); } }
.marquee__item{ display:inline-flex; align-items:center; gap:.5em; padding-right:.5em; white-space:nowrap; font-family:var(--f-display); text-transform:uppercase; font-size:clamp(2.8rem,7vw,7rem); line-height:1.12; color:var(--star); }
.marquee__item i{ width:.16em; height:.16em; background:var(--violet-2); border-radius:50%; flex:none; }
.marquee--outline .marquee__item{ color:transparent; -webkit-text-stroke:1px var(--lilac); }

/* ---------- countdown ---------- */
.countdown__head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:14px 40px; margin-bottom:clamp(28px,4vw,56px); }
.countdown__what h3{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(2.2rem,5vw,5rem); line-height:1; margin-top:8px; }
.countdown__meta{ display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:var(--sp-2); color:var(--muted); }
.countdown__meta span{ display:inline-flex; align-items:center; gap:7px; }
.clock{ display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid var(--hair); }
.unit{ padding:clamp(20px,2.4vw,36px) 0 clamp(16px,2vw,28px) clamp(16px,2.4vw,40px); border-left:1px solid var(--hair); }
.unit:first-child{ border-left:0; padding-left:0; }
.unit__num{ display:block; font-family:var(--f-display); color:var(--star); font-size:clamp(3.4rem,15.5vw,16rem); line-height:1; font-variant-numeric:tabular-nums; }
.unit__lbl{ display:block; margin-top:var(--sp-2); color:var(--muted); font-size:clamp(.8rem,1.1vw,1rem); }
.countdown.is-live .unit__num{ color:var(--live); }
.countdown__foot{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--sp-2) var(--sp-3); margin-top:var(--sp-4); }
.countdown__note{ color:var(--muted); font-size:.95rem; }

/* ---------- pinned sideways timeline ---------- */
.hscroll__pin{ overflow:hidden; }
.hscroll.is-pinned .hscroll__pin{ position:sticky; top:0; height:100svh; display:flex; flex-direction:column; justify-content:center; }
.hscroll.is-pinned .roadmap{ display:flex; width:max-content; will-change:transform; }
.hscroll__head{ padding-inline:var(--gut); margin-bottom:clamp(20px,4vh,44px); }
.roadmap{ display:grid; padding-inline:var(--gut); }
.phase{ padding-block:clamp(36px,4vw,56px); border-top:1px solid var(--hair); }
.hscroll.is-pinned .phase{ width:min(68vw,860px); flex:none; padding:22px clamp(24px,4vw,64px) 0 0; margin-right:clamp(24px,4vw,64px); }
.phase__date{ font-family:var(--f-display); text-transform:uppercase; color:var(--star); font-size:clamp(2.8rem,7.4vw,7.4rem); line-height:1; }
.phase.is-active .phase__date{ color:var(--violet-2); }
.phase.is-done .phase__date{ color:var(--muted-2); }
.phase__status{ display:block; margin-bottom:6px; color:var(--lilac); font-size:.95rem; min-height:1.5em; }
.phase h4{ font-size:clamp(1.2rem,1.9vw,1.6rem); font-weight:600; color:var(--star); margin:22px 0 10px; }
.phase p{ color:var(--muted); max-width:56ch; }
.phase .phase__ents{ margin-top:18px; color:var(--ink); font-size:.98rem; max-width:62ch; }

/* ---------- outcomes ---------- */
.outcomes{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--hair); }
.oc{ padding:clamp(28px,3vw,44px) clamp(20px,2.6vw,40px) clamp(36px,3.6vw,56px) 0; }
.oc + .oc{ padding-left:clamp(20px,2.6vw,40px); border-left:1px solid var(--hair); }
.oc__n{ color:var(--violet-2); font-weight:600; }
.oc h3{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(1.8rem,2.8vw,2.8rem); line-height:1.04; margin:clamp(40px,7vw,110px) 0 12px; transition:color .3s; }
.oc:hover h3{ color:var(--violet-2); }
.oc p{ color:var(--muted); font-size:1rem; }

/* ---------- line-up rows ---------- */
.lineup{ border-bottom:1px solid var(--hair); }
.srow{ position:relative; border-top:1px solid var(--hair); }
.srow__head{
  position:relative; isolation:isolate; display:grid; grid-template-columns:3.2rem minmax(0,1fr) auto auto 26px; align-items:center; gap:clamp(12px,2vw,32px);
  width:100%; padding:clamp(24px,2.8vw,40px) 0; background:none; border:0; text-align:left; cursor:pointer; color:var(--star);
  transition:padding .5s var(--ease-out), color .3s;
}
.srow__head::before{
  content:""; position:absolute; inset:0 calc(var(--gut) * -1); z-index:-1; background:var(--violet);
  transform:scaleY(0); transform-origin:bottom; transition:transform .45s var(--ease-io);
}
@media (hover:hover){
  .srow__head:hover{ padding-left:clamp(10px,1.6vw,24px); }
  .srow__head:hover::before{ transform:none; }
  .srow__head:hover .srow__n,.srow__head:hover .srow__when,.srow__head:hover .badge{ color:#fff; }
}
.srow__n{ color:var(--muted); font-weight:500; }
.srow__title{ font-family:var(--f-display); text-transform:uppercase; font-size:clamp(2rem,5.2vw,5.2rem); line-height:1.02; }
.srow__when{ color:var(--ink); text-align:right; white-space:nowrap; }
.srow__tog{ position:relative; width:22px; height:22px; justify-self:end; }
.srow__tog::before,.srow__tog::after{ content:""; position:absolute; left:0; right:0; top:50%; height:2px; margin-top:-1px; background:currentColor; transition:transform .4s var(--ease); }
.srow__tog::after{ transform:rotate(90deg); }
.srow.is-open .srow__tog::after{ transform:none; }
.srow__body{ display:grid; grid-template-rows:0fr; visibility:hidden; transition:grid-template-rows .55s var(--ease-io), visibility 0s linear .55s; }
.srow.is-open .srow__body{ grid-template-rows:1fr; visibility:visible; transition-delay:0s; }
.srow__in{ min-height:0; overflow:hidden; }
.srow__grid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:32px clamp(32px,6vw,96px); padding:10px 0 clamp(40px,4.4vw,64px) calc(3.2rem + clamp(12px,2vw,32px)); }
.srow__desc{ font-size:clamp(1.05rem,1.5vw,1.3rem); line-height:1.5; color:var(--ink); }
.srow__note{ margin-top:16px; color:var(--gold); font-size:.95rem; }
.srow__cta{ margin-top:30px; }
.srow__wait{ color:var(--muted); font-size:.95rem; }
.wmeta{ display:grid; align-content:start; }
.wmeta__row{ display:grid; grid-template-columns:7rem minmax(0,1fr); gap:16px; padding:15px 0; border-top:1px solid var(--hair-2); }
.wmeta__k{ color:var(--muted); font-size:.95rem; }
.wmeta__v{ color:var(--ink); }
.empty{ padding:40px 0; color:var(--muted); }
.empty svg{ display:none; }

.filters{ display:flex; flex-wrap:wrap; gap:10px 32px; margin-bottom:40px; }
.filter{ position:relative; min-height:44px; padding:8px 0; background:none; border:0; cursor:pointer; color:var(--muted); font-weight:500; font-size:1.05rem; transition:color .25s; }
.filter:hover,.filter.is-on{ color:var(--star); }
.filter::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--violet-2); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease-io); }
.filter.is-on::after{ transform:scaleX(1); }

/* ---------- recap ---------- */
.recap{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(28px,5vw,80px); align-items:center; }
.recap__copy{ display:grid; gap:24px; justify-items:start; }
.recap__visual{ position:relative; aspect-ratio:9/16; max-height:86svh; width:100%; max-width:460px; justify-self:end; overflow:hidden; background:#000; }
.recap__visual video{ width:100%; height:100%; object-fit:cover; }
.recap__play{ position:absolute; inset:0; display:grid; place-items:center; width:100%; height:100%; padding:0; border:0; cursor:pointer; background:linear-gradient(180deg,transparent 50%,rgba(5,2,14,.75)); transition:opacity .4s; }
.recap__btn{ width:92px; height:92px; border-radius:50%; display:grid; place-items:center; background:var(--star); transition:transform .5s var(--ease-out); }
.recap__visual:hover .recap__btn{ transform:scale(1.14); }
.recap__btn svg{ width:30px; height:30px; margin-left:4px; fill:var(--void); }
.recap__tag{ position:absolute; left:16px; right:16px; bottom:14px; color:#fff; font-weight:500; pointer-events:none; transition:opacity .4s; }
.recap__visual.is-playing .recap__play,.recap__visual.is-playing .recap__tag{ opacity:0; pointer-events:none; }

/* ---------- FAQ ---------- */
.faqwrap{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,80px); align-items:start; }
.faqwrap__head{ position:sticky; top:100px; display:grid; gap:20px; justify-items:start; }
.faq{ border-bottom:1px solid var(--hair); }
.faq__item{ border-top:1px solid var(--hair); }
.faq__h{ font:inherit; }
.faq__q{ display:flex; align-items:center; gap:22px; width:100%; padding:clamp(26px,2.6vw,36px) 0; background:none; border:0; text-align:left; cursor:pointer; color:var(--star); font-size:clamp(1.1rem,1.6vw,1.4rem); font-weight:600; line-height:1.3; transition:color .25s; }
.faq__q:hover{ color:var(--violet-2); }
.faq__num{ flex:none; width:2rem; color:var(--muted); font-size:.92rem; font-weight:500; }
.faq__txt{ flex:1; }
.faq__tog{ flex:none; position:relative; width:18px; height:18px; }
.faq__tog::before,.faq__tog::after{ content:""; position:absolute; left:0; right:0; top:50%; height:2px; margin-top:-1px; background:currentColor; transition:transform .4s var(--ease); }
.faq__tog::after{ transform:rotate(90deg); }
.faq__item.is-open .faq__tog::after{ transform:none; }
.faq__a{ display:grid; grid-template-rows:0fr; visibility:hidden; transition:grid-template-rows .45s var(--ease-io), visibility 0s linear .45s; }
.faq__item.is-open .faq__a{ grid-template-rows:1fr; visibility:visible; transition-delay:0s; }
.faq__a-in{ min-height:0; overflow:hidden; }
.faq__a-in p{ padding:0 40px 24px calc(2rem + 22px); color:var(--muted); max-width:70ch; }

/* ---------- big call to action ---------- */
.bigcta{
  position:relative; isolation:isolate; display:flex; justify-content:space-between; align-items:center; gap:24px;
  padding:clamp(28px,5vw,70px) var(--gut); border-block:1px solid var(--hair); color:var(--star);
  font-family:var(--f-display); text-transform:uppercase; font-size:clamp(3.4rem,13.5vw,14rem); line-height:.98;
}
.bigcta::before{ content:""; position:absolute; inset:0; z-index:-1; background:var(--violet); transform:scaleY(0); transform-origin:bottom; transition:transform .6s var(--ease-io); }
.bigcta:hover::before{ transform:none; }
.bigcta svg{ flex:none; width:.72em; height:.72em; fill:currentColor; transition:transform .6s var(--ease-out); }
.bigcta:hover svg{ transform:translateX(.12em); }
.subrow{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,30rem); gap:28px 64px; align-items:end; padding:clamp(48px,6vw,96px) var(--gut) clamp(24px,3vw,48px); }

/* ---------- forms ---------- */
.form{ display:grid; gap:38px; }
.form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:38px var(--sp-4); }
.field{ display:grid; gap:8px; }
.field > label{ font-weight:500; color:var(--lilac); font-size:.95rem; }
.req{ color:var(--violet-2); }
.field input,.field select,.field textarea{
  width:100%; padding:13px 0; background:none; border:0; border-bottom:1px solid var(--hair); border-radius:0;
  color:var(--star); font-size:1.1rem; transition:border-color .3s;
}
.field textarea{ resize:vertical; min-height:96px; }
.field select{
  appearance:none; cursor:pointer; padding-right:28px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c4b5fd' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") no-repeat right 2px center;
}
.field select option,.field select optgroup{ background:#140b29; color:var(--star); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--violet-2); }
.field input::placeholder,.field textarea::placeholder{ color:var(--muted-2); }
.field__hint{ font-size:.9rem; color:var(--muted); }
.field__err{ font-size:.9rem; color:#ff8fab; display:none; }
.field.has-err input,.field.has-err select,.field.has-err textarea{ border-color:#ff5c8a; }
.field.has-err .field__err{ display:block; }
.checkline{ display:flex; align-items:flex-start; gap:14px; padding-block:var(--sp-1); color:var(--ink); font-size:.98rem; cursor:pointer; }
.checkline input{ width:18px; height:18px; margin-top:4px; accent-color:var(--violet); flex:none; }

/* Session picker: rows you tick, not boxes. */
.pickers{ border-bottom:1px solid var(--hair); margin-top:8px; }
.picker{ position:relative; display:flex; align-items:flex-start; gap:var(--sp-2); padding:22px 0; border-top:1px solid var(--hair); cursor:pointer; transition:padding .4s var(--ease-out); }
.picker:hover{ padding-left:8px; }
.picker input{ position:absolute; opacity:0; pointer-events:none; }
.picker__mark{ position:relative; flex:none; width:22px; height:22px; margin-top:5px; box-shadow:inset 0 0 0 1.5px var(--lilac); transition:background .25s, box-shadow .25s; }
.picker__mark::after{ content:""; position:absolute; left:7px; top:3px; width:6px; height:11px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg) scale(0); transition:transform .22s var(--ease-out); }
.picker input:checked ~ .picker__mark{ background:var(--violet); box-shadow:inset 0 0 0 1.5px var(--violet); }
.picker input:checked ~ .picker__mark::after{ transform:rotate(45deg) scale(1); }
.picker input:focus-visible ~ .picker__mark{ outline:2px solid var(--violet-2); outline-offset:3px; }
.picker__txt{ min-width:0; }
.picker__txt b{ display:block; font-family:var(--f-display); font-weight:400; text-transform:uppercase; font-size:clamp(1.5rem,2.4vw,2.2rem); line-height:1.1; color:var(--star); margin-bottom:4px; transition:color .25s; }
.picker input:checked ~ .picker__txt b{ color:var(--violet-2); }
.picker__txt span{ font-size:.95rem; color:var(--muted); }
.picker.is-full{ opacity:.5; cursor:not-allowed; }
.form__msg{ display:none; font-size:.98rem; }
.form__msg.is-on{ display:block; }
.form__msg--err{ color:#ff9db5; } .form__msg--ok{ color:var(--ok); } .form__msg--info{ color:var(--lilac); }

.regwrap{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(40px,7vw,112px); align-items:start; }
.regwrap__head{ position:sticky; top:100px; display:grid; gap:20px; }

/* The pass is the one thing here that should look like an object. */
.pass{ max-width:600px; margin-inline:auto; background:var(--star); color:var(--void); animation:takeIn .8s var(--ease-out) both; }
@keyframes takeIn{ from{ opacity:0; transform:translateY(30px) rotate(-1deg); } }
.pass .eyebrow{ color:var(--violet); }
.pass .muted,.pass .dim{ color:#5b5375; }
.pass__top{ padding:30px 30px 24px; border-bottom:2px dashed rgba(5,2,14,.25); }
.pass__top h3{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; font-size:clamp(2.6rem,6vw,4rem); line-height:1; margin:10px 0; }
.pass__code{ margin-top:14px; font-family:var(--f-display); font-size:1.7rem; letter-spacing:.06em; color:var(--violet); }
.pass__rows{ padding:22px 30px; display:grid; gap:14px; }
.pass__row{ display:grid; grid-template-columns:110px minmax(0,1fr); gap:14px; }
.pass__row > b{ font-weight:600; font-size:.92rem; color:#5b5375; }
.pass__list{ display:grid; gap:12px; }
.pass__sess{ display:grid; }
.pass__sess b{ font-weight:700; }
.pass__sess span{ font-size:.92rem; }
.pass__foot{ padding:0 30px 28px; display:flex; flex-wrap:wrap; gap:12px; }
.pass .btn{ background:var(--void); color:var(--star); }
.pass .btn--ghost{ background:none; color:var(--void); box-shadow:inset 0 0 0 1px var(--void); }
.pass .btn--ghost:hover{ color:#fff; }

/* ---------- workshops page ---------- */
.facts3{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--hair); }
.facts3 > div{ padding:clamp(28px,3vw,44px) clamp(20px,2.6vw,40px) clamp(20px,2vw,32px) 0; }
.facts3 > div + div{ padding-left:clamp(20px,2.6vw,40px); border-left:1px solid var(--hair); }
.facts3 h3{ font-size:1.25rem; font-weight:600; color:var(--star); margin-bottom:14px; }
.facts3 p{ color:var(--muted); }
.modules{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); }
.module{ border-top:1px solid var(--hair); padding-top:clamp(24px,3vw,40px); }
.module h3{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(3rem,7vw,7rem); line-height:1; }
.module > p{ color:var(--muted); margin:16px 0 28px; }
.clusters{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,96px); }
.cluster{ border-top:1px solid var(--hair); padding-top:clamp(24px,3vw,40px); }
.cluster h3{ font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(3rem,7vw,7rem); line-height:1; }
.cluster__date{ color:var(--gold); margin:8px 0 16px; }
.cluster ul{ columns:2; column-gap:36px; margin-top:12px; }
.cluster li{ padding:9px 0; color:var(--ink); break-inside:avoid; }

/* ---------- contact: the org tree ---------- */
.org{ display:grid; }
.org__label{ position:relative; padding:clamp(64px,7vw,104px) 0 var(--sp-4); text-align:center; color:var(--lilac); font-weight:500; }
.org__label::before{ content:""; position:absolute; left:50%; top:14px; bottom:54px; width:1px; background:var(--hair); }
.org__row{ --g:clamp(18px,3vw,48px); display:grid; grid-template-columns:repeat(4,1fr); gap:var(--g); }
/* The MCVP gets one frame, exactly the width of a manager's, centred above them. */
.org__row--one{ grid-template-columns:calc((100% - 3 * var(--g)) / 4); justify-content:center; }
.person__img{ overflow:hidden; aspect-ratio:199/238; background:var(--panel); }
.person__img img{ width:100%; height:100%; object-fit:cover; object-position:center bottom; filter:grayscale(1) contrast(1.05); transition:filter .6s var(--ease), transform 1s var(--ease-out); }
.person:hover .person__img img{ filter:none; }
.person__img:has(.person__mono){ background:none; }
.person__mono{ display:grid; place-items:center; height:100%; font-family:var(--f-display); font-size:clamp(4rem,9vw,9rem); color:var(--violet-2); background:radial-gradient(circle at 50% 30%,rgba(124,58,237,.3),transparent 70%); }
.person b{ display:block; margin-top:var(--sp-2); font-family:var(--f-display); font-weight:400; text-transform:uppercase; color:var(--star); font-size:clamp(1.5rem,2.6vw,2.5rem); line-height:1.05; }
.person figcaption span{ color:var(--muted); }
.person__star{ position:relative; margin-left:2px; padding:0; border:0; background:none; font:inherit; color:var(--violet-2); cursor:pointer; }
.person__star::after,.footer__star::after{ content:""; position:absolute; inset:-14px; }
.person__star:hover,.footer__star:hover{ color:var(--lilac); }
#dulain{ position:relative; z-index:3; }
.person figcaption{ position:relative; }
.person figcaption .person__note{ position:absolute; display:block; padding:8px 12px; color:var(--star); font-size:.92rem; font-weight:500; line-height:1.35; background:var(--panel); box-shadow:inset 0 0 0 1px var(--violet-2); }
.org__note{ margin-top:22px; text-align:center; color:var(--muted-2); font-size:.95rem; }
.contactgrid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(40px,7vw,112px); align-items:start; }
.contact-links{ border-bottom:1px solid var(--hair); margin-top:var(--sp-4); }
.clink{ display:flex; align-items:center; gap:var(--sp-2); padding:22px 0; border-top:1px solid var(--hair); transition:padding .4s var(--ease-out), color .25s; }
.clink:hover{ padding-left:10px; color:var(--violet-2); }
.clink__ico svg{ width:20px; height:20px; fill:currentColor; }
.clink__txt b{ display:block; font-weight:600; color:var(--star); }
.clink__txt span{ font-size:.95rem; color:var(--muted); }

/* ---------- sound: on the right edge, no box ---------- */
.sound{
  position:fixed; right:6px; top:50%; z-index:115; transform:translateY(-50%); display:flex; align-items:center; gap:10px;
  writing-mode:vertical-rl; padding:12px 8px; background:none; border:0; cursor:pointer;
  color:var(--muted); font-size:.85rem; font-weight:500; transition:color .3s;
}
.sound:hover,.sound.is-on{ color:var(--star); }
.sound__bars{ display:flex; flex-direction:row; align-items:flex-end; gap:2px; width:13px; height:13px; writing-mode:horizontal-tb; }
.sound__bars i{ width:2px; height:4px; background:currentColor; }
.sound.is-on .sound__bars i{ background:var(--violet-2); animation:eq .95s ease-in-out infinite; }
.sound.is-on .sound__bars i:nth-child(2){ animation-delay:.16s; }
.sound.is-on .sound__bars i:nth-child(3){ animation-delay:.32s; }
@keyframes eq{ 0%,100%{ height:4px; } 50%{ height:13px; } }

/* ---------- cursor ---------- */
.cursor{
  position:fixed; left:0; top:0; z-index:190; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%;
  background:var(--star); pointer-events:none; opacity:0;
  display:grid; place-items:center; color:#fff; font-size:14px; font-weight:600; white-space:nowrap;
  transition:width .35s var(--ease-out), height .35s var(--ease-out), margin .35s var(--ease-out), opacity .3s, background .3s;
}
.cursor span{ opacity:0; transition:opacity .2s; }
.cursor.is-on{ opacity:1; }
.cursor.is-big{ width:84px; height:84px; margin:-42px 0 0 -42px; background:#6d28d9; }
.cursor.is-big span{ opacity:1; }
@media (hover:none){ .cursor{ display:none; } }

/* ---------- footer ---------- */
.footer{ position:relative; padding-top:clamp(72px,8vw,128px); margin-top:clamp(56px,7vw,112px); border-top:1px solid var(--hair); overflow:hidden; }
.footer__top{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:48px clamp(48px,8vw,136px); }
.footer__brand img{ height:56px; width:auto; margin-left:-8px; } /* the PNG has 8px of empty space on its left */
.footer__brand p{ margin:26px 0; color:var(--muted); max-width:44ch; }
.footer__org{ color:var(--muted); font-size:.92rem; }
.footer__socials{ display:flex; gap:var(--sp-1); margin:var(--sp-2) 0 0 -12px; }
.footer__socials a{ display:grid; place-items:center; width:44px; height:44px; }
.footer__socials svg{ width:20px; height:20px; fill:var(--muted); transition:fill .25s; }
.footer__socials a:hover svg{ fill:var(--star); }
.footer__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px 32px; }
.footer__col{ display:grid; gap:0; align-content:start; }
.footer__col h5{ font-size:.95rem; font-weight:500; color:var(--muted); margin-bottom:var(--sp-2); }
.footer__col a{ padding-block:9px; color:var(--star); transition:color .25s; overflow-wrap:anywhere; }
.footer__col a:hover{ color:var(--violet-2); }
.footer__starbar{ display:none; }
.footer__bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 32px; margin-top:clamp(56px,7vw,104px); color:var(--muted); font-size:.92rem; }
.footer__by{ color:var(--star); font-weight:500; }
.footer__star{ position:relative; color:var(--violet-2); }
.footer__word{ margin:clamp(20px,3vw,36px) 0 -.09em; padding-inline:var(--gut); white-space:nowrap; font-family:var(--f-display); text-transform:uppercase; color:transparent; -webkit-text-stroke:1px var(--muted-2); font-size:min(10.5vw,calc((100vw - 2 * var(--gut)) / 8.9)); line-height:1; text-align:center; }

/* ---------- admin ---------- */
.cfg-warn{ margin-bottom:26px; color:var(--gold); max-width:80ch; }
.cfg-warn code{ color:var(--star); }
.kpis{ display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid var(--hair); margin-top:12px; }
.kpi{ padding:18px 16px 16px; border-left:1px solid var(--hair); }
.kpi:first-child{ border-left:0; padding-left:0; }
.kpi b{ display:block; font-family:var(--f-display); font-weight:400; color:var(--star); font-size:clamp(3rem,7vw,6.5rem); line-height:1; }
.kpi span{ color:var(--muted); font-size:.95rem; }
.adm2{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,72px); margin-top:clamp(30px,4vw,52px); align-items:start; }
.adm-h{ font-size:1.05rem; font-weight:600; color:var(--lilac); margin-bottom:10px; }
.adm-block{ margin-top:clamp(48px,6vw,84px); }
.adm-bar{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:22px; }
.bar{ position:relative; display:flex; justify-content:space-between; gap:14px; padding:9px 0 11px; }
.bar i{ position:absolute; left:0; bottom:0; height:3px; max-width:100%; background:var(--violet-2); transition:width .8s var(--ease-out); }
.bar::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--hair); }
.bar__l{ color:var(--ink); } .bar__n{ color:var(--star); font-weight:600; white-space:nowrap; }
.table-wrap{ overflow-x:auto; border-top:1px solid var(--hair); }
table.data{ width:100%; border-collapse:collapse; min-width:1250px; font-size:.95rem; }
table.data th{ text-align:left; padding:12px 18px 12px 0; color:var(--lilac); font-weight:500; white-space:nowrap; }
table.data td{ padding:12px 18px 12px 0; border-top:1px solid var(--hair-2); vertical-align:top; color:var(--ink); }
table.data tbody tr:hover td{ color:var(--star); background:rgba(124,58,237,.12); }
.editor{ border-top:1px solid var(--hair); padding:14px 0; }
.editor:last-child{ border-bottom:1px solid var(--hair); }
.editor summary{ cursor:pointer; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; color:var(--star); font-weight:600; }
.msgrow{ padding:16px 0; border-top:1px solid var(--hair); }
.msgrow a{ color:var(--violet-2); }
.msgrow .badge{ font-size:.9rem; }
@media (max-width:900px){
  .kpis{ grid-template-columns:1fr 1fr; }
  .kpi:nth-child(3){ border-left:0; padding-left:0; }
  .kpi:nth-child(n+3){ border-top:1px solid var(--hair); }
  .adm2{ grid-template-columns:1fr; }
}


/* ---------- reading width ---------- */
.faq__a-in p,.recap p,.srow__desc{ max-width:62ch; }
.oc p{ max-width:36ch; }
.module > p{ max-width:52ch; }

/* ---------- responsive ---------- */
@media (max-width:900px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; }
  .nav__inner{ height:72px; }
  .hero__brand img{ width:min(90vw,calc(24svh * 4.27)); }
  .hero__learn{ font-size:min(17vw,14svh); }
  .hero__main{ grid-template-columns:minmax(0,1fr); }
  .hero__clip{ grid-column:1; grid-row:auto; justify-self:end; width:min(32vw,20svh); opacity:.9; }
  .section-head--split,.recap,.faqwrap,.regwrap,.contactgrid,.footer__top,.subrow{ grid-template-columns:minmax(0,1fr); }
  .faqwrap__head,.regwrap__head{ position:static; }
  .recap__visual{ justify-self:center; max-width:360px; }
  .outcomes{ grid-template-columns:1fr 1fr; }
  .oc:nth-child(3){ padding-left:0; border-left:0; }
  .oc:nth-child(n+3){ border-top:1px solid var(--hair); }
  .oc h3{ margin-top:32px; }
  .srow__head{ grid-template-columns:2.2rem minmax(0,1fr) 22px; }
  .srow__when,.srow__head .badge{ grid-column:2; text-align:left; justify-self:start; }
  .srow__tog{ grid-column:3; grid-row:1; }
  .srow__grid{ grid-template-columns:1fr; padding-left:0; }
  .facts3,.modules,.clusters{ grid-template-columns:1fr; }
  .facts3 > div + div{ padding-left:0; border-left:0; border-top:1px solid var(--hair); }
  .org__row{ grid-template-columns:1fr 1fr; }
  .org__row--one{ grid-template-columns:calc((100% - var(--g)) / 2); }

  /* The sound control moves out of the text column into the corner. */
  .sound{
    right:16px; top:auto; bottom:16px; transform:none; writing-mode:horizontal-tb; justify-content:center;
    width:44px; height:44px; padding:0; border-radius:50%;
    background:rgba(5,2,14,.78); box-shadow:inset 0 0 0 1px var(--hair); backdrop-filter:blur(10px);
  }
  .sound__lbl{ display:none; }
  /* room for it where the page ends in text */
  .hero__facts{ padding-bottom:72px; }
  .footer{ padding-bottom:72px; }
}
@media (max-width:620px){
  body{ font-size:16px; }
  .btn{ max-width:100%; white-space:normal; text-align:center; }
  .form__grid{ grid-template-columns:minmax(0,1fr); }
  .footer__cols{ grid-template-columns:1fr 1fr; }
  .hero__meta{ font-size:.9rem; }
  .hero__fact span{ font-size:.82rem; }
  .hero__fact b{ font-size:.95rem; }
  .outcomes{ grid-template-columns:1fr; }
  .oc,.oc + .oc{ padding:var(--sp-4) 0; border-left:0; }
  .oc + .oc{ border-top:1px solid var(--hair); }
  .oc h3{ margin:var(--sp-2) 0 var(--sp-1); }
  .oc p{ max-width:none; }
  .faq__q{ gap:12px; }
  .faq__a-in p{ padding:0 0 24px calc(2rem + 12px); }
  .wmeta__row{ grid-template-columns:5.5rem minmax(0,1fr); }
  .pass__row{ grid-template-columns:1fr; gap:2px; }
}
@media (hover:none){
  .btn:hover{ color:var(--void); }
  .btn--ghost:hover{ color:var(--star); }
  .btn--live:hover{ color:#fff; }
  .btn:hover::before{ transform:translateY(101%); }
  .btn:active{ transform:scale(.97); }
  .bigcta:hover::before{ transform:scaleY(0); }
  .oc:hover h3{ color:var(--star); }
}
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1 !important; transform:none !important; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}
@media print{
  #starfield,.cosmos,.nav,.footer,.livebar,.takeover,.sound,.cursor{ display:none !important; }
  body{ background:#fff; color:#000; }
  .faq__a{ grid-template-rows:1fr; visibility:visible; }
}