/* ==========================================================================
   BATTLE BORN — investor site
   Loud edition. Deck palette (gold on near-black), deck data, no whispering.
   ========================================================================== */

:root{
  --ink:      #05060a;
  --ink-2:    #0a0c12;
  --ink-3:    #11141c;
  --line:     rgba(227,178,60,.22);
  --line-2:   rgba(255,255,255,.10);
  --gold:     #E3B23C;
  --gold-hot: #FFD36B;
  --gold-dim: #8a6c24;
  --blood:    #B01B0F;
  --bone:     #F4F0E6;
  --mute:     #9BA0AC;
  --wrap:     1280px;
  --disp:     'Oswald', 'Arial Narrow', sans-serif;
  --body:     'Inter', system-ui, -apple-system, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body{
  margin:0; background:var(--ink); color:var(--bone);
  font-family:var(--body); font-size:17px; line-height:1.62;
  font-weight:350; overflow-x:hidden;
}
body.locked{ overflow:hidden }
img{ max-width:100%; display:block }
a{ color:inherit }
h1,h2,h3,h4{ margin:0; font-family:var(--disp); font-weight:600; line-height:.94; letter-spacing:.01em }
p{ margin:0 0 1.1em }
sup{ font-size:.6em; color:var(--gold); top:-.5em }
.wrap{ width:min(var(--wrap),92vw); margin-inline:auto }
.mt{ margin-top:5rem }

/* ---------- grain ---------- */
.grain{
  position:fixed; inset:-120px; z-index:9; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
  animation:grain 700ms steps(3) infinite;
}
@keyframes grain{ 0%{transform:translate(0,0)} 33%{transform:translate(-6px,4px)} 66%{transform:translate(5px,-5px)} 100%{transform:translate(0,0)} }

/* ---------- reveal ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1) }
.reveal.in{ opacity:1; transform:none }

/* ==========================================================================
   NAV
   ========================================================================== */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:60;
  display:flex; align-items:center; gap:2rem;
  padding:.85rem clamp(1rem,4vw,2.4rem);
  transition:background .35s, border-color .35s, padding .35s;
  border-bottom:1px solid transparent;
}
.nav.stuck{ background:rgba(5,6,10,.92); backdrop-filter:blur(14px); border-bottom-color:var(--line); padding-block:.55rem }
.nav__mark img{ height:30px; width:auto; mix-blend-mode:screen; filter:brightness(1.7) contrast(1.15) }
.nav__links{ display:flex; gap:1.6rem; margin-left:auto }
.nav__links a{
  font-family:var(--disp); font-size:.84rem; text-transform:uppercase;
  letter-spacing:.2em; text-decoration:none; color:#cfd3db; padding-bottom:3px;
  border-bottom:2px solid transparent; transition:color .2s, border-color .2s;
}
.nav__links a:hover{ color:var(--gold-hot); border-bottom-color:var(--gold) }
.nav__cta{
  font-family:var(--disp); font-size:.82rem; text-transform:uppercase; letter-spacing:.18em;
  text-decoration:none; background:var(--gold); color:#14100a; font-weight:600;
  padding:.72rem 1.25rem; border:0; cursor:pointer; white-space:nowrap;
  box-shadow:4px 4px 0 rgba(227,178,60,.28); transition:transform .18s, box-shadow .18s, background .18s;
}
.nav__cta:hover{ background:var(--gold-hot); transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(227,178,60,.4) }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:center; isolation:isolate; padding:9rem 0 11rem }
.hero__bg{ position:absolute; inset:0; z-index:-2; overflow:hidden }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:center 60%; animation:drift 26s ease-in-out infinite alternate }
@keyframes drift{ from{transform:scale(1.06)} to{transform:scale(1.15) translateY(-1.5%)} }
.hero__scrim{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(120% 80% at 50% 45%, rgba(5,6,10,.28) 0%, rgba(5,6,10,.72) 55%, rgba(5,6,10,.95) 100%),
    linear-gradient(180deg, rgba(5,6,10,.85) 0%, rgba(5,6,10,.25) 28%, rgba(5,6,10,.72) 72%, var(--ink) 100%);
}
.hero__inner{ width:min(1100px,92vw); margin-inline:auto; text-align:center }
.hero__kicker{ margin:0 0 1.6rem; display:flex; align-items:center; gap:1.2rem; justify-content:center }
.hero__kicker span{ font-family:var(--disp); font-size:clamp(.72rem,1.3vw,.9rem); letter-spacing:.55em; text-transform:uppercase; color:var(--gold) }
.hero__kicker::before,.hero__kicker::after{ content:''; height:1px; width:clamp(40px,12vw,180px); background:linear-gradient(90deg,transparent,var(--gold)) }
.hero__kicker::after{ background:linear-gradient(90deg,var(--gold),transparent) }
.hero__wordmark{ width:min(880px,88vw); margin:0 auto; mix-blend-mode:screen; filter:brightness(1.55) contrast(1.12) drop-shadow(0 18px 50px rgba(0,0,0,.8)) }
.hero__genre{
  font-size:clamp(1.5rem,4.4vw,3.4rem); text-transform:uppercase; letter-spacing:.14em;
  margin:.4rem 0 1rem; font-weight:500; color:var(--bone);
}
.hero__tag{ max-width:46ch; margin:0 auto 2.4rem; color:#d7dae1; font-size:clamp(1rem,1.5vw,1.16rem) }
.hero__btns{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap }
.hero__rail{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  display:grid; grid-template-columns:repeat(5,1fr);
  border-top:2px solid var(--gold);
  background:linear-gradient(180deg, rgba(5,6,10,.5), rgba(5,6,10,.95));
  backdrop-filter:blur(6px);
}
.hero__rail div{ padding:1.15rem .9rem; text-align:center; border-left:1px solid var(--line) }
.hero__rail div:first-child{ border-left:0 }
.hero__rail b{ display:block; font-family:var(--disp); font-size:clamp(1.3rem,2.8vw,2.3rem); font-weight:600; color:var(--gold-hot); line-height:1 }
.hero__rail span{ display:block; margin-top:.35rem; font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--mute) }

/* ---------- buttons ---------- */
.btn-film{
  display:inline-flex; align-items:center; gap:.9rem; cursor:pointer;
  background:var(--gold); color:#14100a; border:0; padding:1.1rem 2rem;
  font-family:var(--disp); font-size:clamp(1rem,1.6vw,1.2rem); font-weight:600;
  text-transform:uppercase; letter-spacing:.2em; text-decoration:none;
  box-shadow:7px 7px 0 rgba(227,178,60,.3); transition:transform .18s, box-shadow .18s, background .18s;
}
.btn-film:hover{ background:var(--gold-hot); transform:translate(-3px,-3px); box-shadow:10px 10px 0 rgba(227,178,60,.42) }
.btn-film__play{ width:26px; height:26px; display:grid; place-items:center; background:#14100a; border-radius:50% }
.btn-film__play svg{ width:13px; fill:var(--gold); margin-left:2px }
.btn-gold{
  display:inline-block; background:var(--gold); color:#14100a; text-decoration:none;
  font-family:var(--disp); text-transform:uppercase; letter-spacing:.2em; font-weight:600;
  padding:1rem 1.8rem; box-shadow:6px 6px 0 rgba(227,178,60,.28);
  transition:transform .18s, box-shadow .18s, background .18s;
}
.btn-gold:hover{ background:var(--gold-hot); transform:translate(-3px,-3px); box-shadow:9px 9px 0 rgba(227,178,60,.42) }
.btn-gold--lg{ font-size:clamp(1.05rem,2.1vw,1.5rem); padding:1.3rem 2.6rem }
.btn-ghost{
  display:inline-block; text-decoration:none; color:var(--gold);
  font-family:var(--disp); text-transform:uppercase; letter-spacing:.2em; font-weight:500;
  padding:1rem 1.8rem; border:2px solid var(--gold); transition:background .2s, color .2s;
}
.btn-ghost:hover{ background:var(--gold); color:#14100a }
.btn-ghost--lg{ font-size:clamp(1rem,1.6vw,1.2rem); padding:1.1rem 2rem }

/* ==========================================================================
   TICKER
   ========================================================================== */
.ticker{ overflow:hidden; background:var(--gold); color:#14100a; border-block:2px solid #14100a; padding:.6rem 0 }
.ticker__row{ display:flex; gap:2.2rem; white-space:nowrap; width:max-content; animation:slide 44s linear infinite }
.ticker__row span{ font-family:var(--disp); font-size:clamp(.85rem,1.5vw,1.1rem); text-transform:uppercase; letter-spacing:.22em; font-weight:600 }
.ticker__row i{ font-style:normal; opacity:.55 }
@keyframes slide{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ==========================================================================
   SECTION SHELL
   ========================================================================== */
.sec{ position:relative; padding:clamp(5rem,10vw,9rem) 0; border-top:1px solid var(--line-2) }
.sec[data-num]::before{
  content:attr(data-num); position:absolute; top:clamp(1rem,3vw,3rem); left:-.06em;
  font-family:var(--disp); font-size:clamp(7rem,22vw,20rem); font-weight:700; line-height:.8;
  color:transparent; -webkit-text-stroke:1px rgba(227,178,60,.11);
  pointer-events:none; z-index:0;
}
.sec > *{ position:relative; z-index:1 }
.eyebrow{
  font-family:var(--disp); font-size:.82rem; letter-spacing:.42em; text-transform:uppercase;
  color:var(--mute); margin:0 0 1.1rem; display:flex; align-items:center; gap:1rem;
}
.eyebrow::after{ content:''; height:2px; flex:0 0 clamp(40px,7vw,110px); background:var(--gold) }
.eyebrow--gold{ color:var(--gold) }
.mega{
  font-size:clamp(2.6rem,7.6vw,6.6rem); text-transform:uppercase; font-weight:700;
  letter-spacing:-.005em; line-height:.92; margin:0 0 2.2rem;
}
.mega em{ font-style:normal; color:var(--gold) }
.mega--close{ font-size:clamp(2.6rem,8.6vw,7.6rem) }
.h-sub{ font-size:clamp(1.3rem,2.4vw,1.9rem); text-transform:uppercase; letter-spacing:.06em; margin:0 0 .9rem; color:var(--bone) }
.lede{ font-size:clamp(1.05rem,1.8vw,1.35rem); color:#d3d7df; max-width:62ch; margin:0 0 2.6rem }
.fineprint{ font-size:.78rem; line-height:1.6; color:#6f757f; max-width:100ch; margin:1.6rem 0 0 }
.stamp{
  display:inline-block; margin-top:2.6rem; font-family:var(--disp); font-size:.8rem;
  text-transform:uppercase; letter-spacing:.24em; color:var(--blood);
  border:2px solid var(--blood); padding:.55rem 1rem; transform:rotate(-1.2deg);
}

/* ==========================================================================
   02 THE ASK
   ========================================================================== */
.ask{ background:linear-gradient(180deg,var(--ink),var(--ink-2)) }
.slab{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-bottom:3.5rem }
.slab__big{ background:var(--ink-2); padding:clamp(1.6rem,3.4vw,2.8rem) }
.slab__big b{ display:block; font-family:var(--disp); font-weight:700; line-height:.9; color:var(--gold-hot); font-size:clamp(2rem,5.2vw,4.4rem) }
.slab__big:nth-child(2) b{ font-size:clamp(1.4rem,3.1vw,2.6rem) }
.slab__big span{ display:block; margin-top:.7rem; font-size:.76rem; letter-spacing:.24em; text-transform:uppercase; color:var(--mute) }
.slab__big--cut b{ color:var(--blood) }

.cards3{ display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:1.4rem }
.cards4{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.4rem; margin-bottom:4.5rem }
.card{ background:var(--ink-3); border:1px solid var(--line-2); border-top:3px solid var(--gold); padding:1.8rem 1.5rem }
.card h3{ font-size:1.25rem; text-transform:uppercase; letter-spacing:.06em; color:var(--gold); margin-bottom:.7rem }
.card p{ font-size:.95rem; color:#c6cad2; margin-bottom:.6rem }
.card strong{ color:var(--bone) }
.card__tag{ font-size:.78rem !important; color:#7c828d !important; border-top:1px solid var(--line-2); padding-top:.8rem; margin-top:1rem }

.flow{ list-style:none; margin:0 0 3rem; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2) }
.flow li{ background:var(--ink); padding:1.6rem 1.3rem }
.flow b{ display:block; font-family:var(--disp); font-size:2.4rem; font-weight:700; color:rgba(227,178,60,.3); line-height:1 }
.flow h4{ font-size:1.15rem; text-transform:uppercase; letter-spacing:.1em; margin:.5rem 0 .5rem; color:var(--gold) }
.flow p{ font-size:.88rem; color:#b7bcc5; margin:0 }

.example{ border:2px solid var(--gold); padding:clamp(1.4rem,3vw,2.2rem); background:rgba(227,178,60,.04) }
.example__label{ font-family:var(--disp); text-transform:uppercase; letter-spacing:.3em; font-size:.78rem; color:var(--gold); margin:0 0 1.4rem }
.example__row{ display:flex; align-items:flex-start; gap:1rem; flex-wrap:wrap }
.example__row > div:not(.arw){ flex:1 1 170px }
.example__row b{ display:block; font-family:var(--disp); font-size:clamp(1.6rem,3.4vw,2.8rem); font-weight:700; color:var(--bone); line-height:1 }
.example__row span{ display:block; margin-top:.4rem; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; color:var(--mute) }
.arw{ font-size:1.8rem; color:var(--gold); line-height:1.4 }

/* ==========================================================================
   03 FILM
   ========================================================================== */
.film{ background:var(--ink) }
.film__stage{ width:min(1180px,94vw); margin:0 auto 4rem }
.player{ position:relative; aspect-ratio:16/9; background:#000; border:1px solid var(--line); box-shadow:0 40px 90px rgba(0,0,0,.7) }
.player iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }
.player__facade{ position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; cursor:pointer; background:#000 }
.player__facade img{ width:100%; height:100%; object-fit:cover; opacity:.62; transition:opacity .4s, transform .8s }
.player__facade:hover img{ opacity:.8; transform:scale(1.03) }
.player__ring{
  position:absolute; inset:0; margin:auto; width:96px; height:96px; display:grid; place-items:center;
  border:2px solid var(--gold); border-radius:50%; background:rgba(5,6,10,.5); transition:transform .3s, background .3s;
}
.player__facade:hover .player__ring{ transform:scale(1.12); background:var(--gold) }
.player__ring svg{ width:30px; fill:var(--gold); margin-left:5px; transition:fill .3s }
.player__facade:hover .player__ring svg{ fill:#14100a }

.logline{ border-left:4px solid var(--gold); padding-left:clamp(1.2rem,3vw,2.4rem); margin-bottom:4.5rem }
.logline__label{ font-family:var(--disp); letter-spacing:.42em; text-transform:uppercase; font-size:.78rem; color:var(--gold); margin-bottom:1rem }
.logline__text{ font-size:clamp(1.3rem,3.1vw,2.3rem); font-family:var(--disp); font-weight:300; line-height:1.24; color:var(--bone); max-width:34ch }
.logline__comp{ font-size:1rem; color:var(--mute); margin:0 }
.logline__comp em{ color:var(--gold); font-style:italic }

.split{ display:grid; grid-template-columns:minmax(260px,.85fr) 1.6fr; gap:clamp(1.5rem,4vw,4rem); align-items:stretch; width:min(var(--wrap),92vw); margin:0 auto 4.5rem }
.split__fig{ margin:0; overflow:hidden }
.split__fig img{ width:100%; height:100%; min-height:420px; object-fit:cover; filter:contrast(1.08) saturate(.92) }
.split__copy p{ color:#c8ccd4 }
.split__copy strong{ color:var(--gold) }

.pos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2) }
.pos > div{ background:var(--ink); padding:1.7rem 1.4rem }
.pos h4{ font-size:1.05rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gold); margin-bottom:.6rem }
.pos p{ font-size:.9rem; color:#b7bcc5; margin:0 }

/* ==========================================================================
   04 PROOF
   ========================================================================== */
.proof{ background:linear-gradient(180deg,var(--ink-2),var(--ink)) }
.proof__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2); margin-bottom:4rem }
.stat{ background:var(--ink); padding:2rem 1.5rem }
.stat b{ display:block; font-family:var(--disp); font-weight:700; font-size:clamp(2.6rem,6.4vw,5rem); line-height:.9; color:var(--gold-hot) }
.stat--zero b{ color:var(--blood) }
.stat span{ display:block; margin:.7rem 0 .5rem; font-family:var(--disp); font-size:1rem; text-transform:uppercase; letter-spacing:.16em; color:var(--bone) }
.stat small{ display:block; font-size:.85rem; color:#8d939d; line-height:1.5 }
.proof__shot{ display:grid; grid-template-columns:minmax(220px,.62fr) 1.4fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center }
.proof__shot img{ width:100%; border:1px solid var(--line-2) }
.proof__shot p{ color:#c8ccd4; font-size:.98rem }
.proof__shot strong{ color:var(--gold) }

/* ==========================================================================
   05 MODEL
   ========================================================================== */
.model{ background:var(--ink) }
.cut{ display:flex; align-items:center; gap:clamp(1rem,3vw,2.5rem); flex-wrap:wrap; border:1px solid var(--line-2); padding:clamp(1.4rem,3.4vw,2.6rem); margin-bottom:4rem; background:var(--ink-2) }
.cut__from b,.cut__to b{ display:block; font-family:var(--disp); font-weight:700; line-height:.9 }
.cut__from b{ font-size:clamp(2rem,5vw,4rem); color:#5b6068; text-decoration:line-through; text-decoration-color:var(--blood); text-decoration-thickness:4px }
.cut__to b{ font-size:clamp(2.6rem,7vw,5.6rem); color:var(--gold-hot) }
.cut__from span,.cut__to span{ display:block; margin-top:.4rem; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--mute) }
.cut__arrow{ font-size:2.4rem; color:var(--gold) }
.cut__badge{ margin-left:auto; background:var(--blood); color:#fff; padding:1.1rem 1.5rem; transform:rotate(-2deg) }
.cut__badge b{ display:block; font-family:var(--disp); font-size:clamp(1.8rem,4vw,3rem); font-weight:700; line-height:.9 }
.cut__badge span{ display:block; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; margin-top:.35rem; opacity:.9 }

.how{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2); margin-bottom:4.5rem }
.how > div{ background:var(--ink); padding:1.7rem 1.3rem }
.how b{ display:block; font-family:var(--disp); font-size:clamp(1.5rem,3vw,2.2rem); font-weight:700; color:var(--gold) }
.how h4{ font-size:.95rem; text-transform:uppercase; letter-spacing:.16em; color:var(--bone); margin:.4rem 0 .6rem }
.how p{ font-size:.86rem; color:#a9aeb8; margin:0 }

.funds__bar{ display:flex; height:70px; border:1px solid var(--line); overflow:hidden }
.funds__bar span{
  width:var(--w); position:relative; border-right:1px solid var(--ink);
  background:repeating-linear-gradient(135deg, rgba(227,178,60,.85) 0 10px, rgba(227,178,60,.62) 10px 20px);
}
.funds__bar span:nth-child(3){ background:var(--gold-hot) }
.funds__bar span:nth-child(2){ background:rgba(227,178,60,.55) }
.funds__bar span:nth-child(5),.funds__bar span:nth-child(6){ background:rgba(227,178,60,.3) }
.funds__key{ list-style:none; margin:1.4rem 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:.7rem 1.6rem }
.funds__key li{ display:flex; align-items:center; gap:.6rem; font-size:.88rem; color:#aeb3bc }
.funds__key i{ width:14px; height:14px; background:var(--gold); flex:none }
.funds__key li:nth-child(2) i{ background:rgba(227,178,60,.55) }
.funds__key li:nth-child(3) i{ background:var(--gold-hot) }
.funds__key li:nth-child(5) i,.funds__key li:nth-child(6) i{ background:rgba(227,178,60,.3) }
.funds__key b{ color:var(--bone); font-family:var(--disp); font-weight:600; margin-left:auto }

/* ==========================================================================
   06 RISK
   ========================================================================== */
.risk{ position:relative; isolation:isolate; background:var(--ink-2) }
.risk__bg{ position:absolute; inset:0; z-index:-1; overflow:hidden; opacity:.16 }
.risk__bg img{ width:100%; height:100%; object-fit:cover }
.road{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line) }
.road li{ background:var(--ink); padding:1.7rem 1.3rem; position:relative }
.road b{ display:block; font-family:var(--disp); font-size:1.4rem; font-weight:600; color:var(--gold-hot); text-transform:uppercase; letter-spacing:.06em }
.road h4{ font-size:.95rem; text-transform:uppercase; letter-spacing:.1em; margin:.6rem 0 .4rem; color:var(--bone) }
.road p{ font-size:.84rem; color:#9ba0aa; margin:0 }

/* ==========================================================================
   07 MARKET
   ========================================================================== */
.market{ background:var(--ink) }
.comps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.6rem }
.comp{ margin:0; background:var(--ink-2); border:1px solid var(--line-2); transition:transform .3s, border-color .3s }
.comp:hover{ transform:translateY(-6px); border-color:var(--gold) }
.comp > img{ width:100%; aspect-ratio:2/3; object-fit:cover }
.comp figcaption{ padding:1.3rem 1.2rem }
.comp h4{ font-size:1.25rem; text-transform:uppercase; letter-spacing:.05em; color:var(--bone) }
.comp h4 span{ color:var(--mute); font-weight:300; font-size:.8em; margin-left:.4rem }
.comp p{ font-size:.86rem; color:#a4a9b3; margin:.8rem 0 0 }
.comp__nums{ color:var(--gold) !important; font-family:var(--disp); letter-spacing:.04em }
.comp__nums b{ color:var(--gold-hot); font-weight:600 }
.comp__tags{ font-size:.7rem !important; letter-spacing:.2em; text-transform:uppercase; color:#6b707a !important; border-top:1px solid var(--line-2); padding-top:.8rem; margin-top:1rem !important }
.comp--us{ border-color:var(--gold) }
.comp__us{ aspect-ratio:2/3; display:grid; place-content:center; text-align:center; gap:.3rem; padding:1.5rem; background:linear-gradient(180deg,rgba(227,178,60,.12),transparent) }
.comp__us img{ width:78%; margin:0 auto 1rem; mix-blend-mode:screen; filter:brightness(1.6) }
.comp__us b{ font-family:var(--disp); font-size:clamp(2rem,4vw,3rem); font-weight:700; color:var(--gold-hot); line-height:1 }
.comp__us span{ font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--mute) }

.mkt{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2); margin:4.5rem 0 }
.mkt__block{ background:var(--ink); padding:2rem 1.6rem }
.mkt__block p{ font-size:.9rem; color:#a4a9b3 }
.bars{ list-style:none; margin:0 0 1.4rem; padding:0 }
.bars li{ display:grid; grid-template-columns:70px 1fr 48px; align-items:center; gap:.7rem; margin-bottom:.55rem }
.bars span{ font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--mute) }
.bars i{ height:12px; background:var(--gold); width:var(--w); display:block }
.bars li:nth-child(2) i{ background:var(--gold-hot) }
.bars b{ font-family:var(--disp); color:var(--bone); text-align:right }
.mkt__huge{ font-family:var(--disp); font-size:clamp(3.4rem,8vw,6rem); font-weight:700; color:var(--gold-hot); line-height:.85; margin:.4rem 0 }
.mkt__cap{ font-family:var(--disp); text-transform:uppercase; letter-spacing:.2em; font-size:.8rem; color:var(--gold) !important; margin-bottom:1.2rem !important }
.mkt__pair{ display:flex; align-items:baseline; gap:.8rem; margin-bottom:.5rem !important }
.mkt__pair b{ font-family:var(--disp); font-size:clamp(1.8rem,3.6vw,2.8rem); font-weight:700; color:var(--gold-hot); line-height:1 }
.mkt__pair span{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--mute) }
.mkt__pair--dim b{ color:#5b6068 }

.aud{ display:grid; grid-template-columns:1.15fr 1fr; gap:1.6rem }
.aud__primary{ border:2px solid var(--gold); padding:clamp(1.4rem,3vw,2.2rem); background:rgba(227,178,60,.04) }
.aud__label{ font-family:var(--disp); letter-spacing:.34em; text-transform:uppercase; font-size:.74rem; color:var(--gold) }
.aud__big{ font-family:var(--disp); font-size:clamp(2.4rem,6vw,4.6rem); font-weight:700; text-transform:uppercase; line-height:.9; color:var(--bone); margin:.3rem 0 .5rem }
.aud__sub{ font-family:var(--disp); letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-size:.9rem }
.aud__primary > p:last-of-type{ color:#a4a9b3; font-size:.92rem }
.aud__comps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:1rem; border-top:1px solid var(--line); padding-top:1.3rem; margin-top:1.3rem }
.aud__comps b{ display:block; font-family:var(--disp); font-size:1.9rem; font-weight:700; color:var(--gold-hot); line-height:1 }
.aud__comps span{ display:block; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--bone) }
.aud__comps small{ display:block; margin-top:.3rem; font-size:.68rem; color:#6b707a }
.aud__sec{ display:grid; gap:1.6rem; align-content:start }
.aud__sec > div{ background:var(--ink-3); border-left:3px solid var(--gold); padding:1.3rem 1.4rem }
.aud__sec h4{ font-size:1.05rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gold); margin-bottom:.5rem }
.aud__sec p{ font-size:.88rem; color:#a9aeb8; margin:0 }
.aud__sec em{ color:var(--bone); font-style:normal; display:block; margin-top:.4rem; font-size:.82rem }

/* ==========================================================================
   08 DISTRIBUTION
   ========================================================================== */
.dist{ background:linear-gradient(180deg,var(--ink-2),var(--ink)) }
.doors{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:1px; background:var(--line-2); border:1px solid var(--line-2) }
.door{ background:var(--ink); padding:1.8rem 1.4rem; transition:background .3s }
.door:hover{ background:var(--ink-3) }
.door b{ display:block; font-family:var(--disp); font-size:1.1rem; color:rgba(227,178,60,.45); letter-spacing:.2em }
.door h4{ font-size:1.15rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gold); margin:.5rem 0 .5rem }
.door__p{ font-size:.84rem !important; color:var(--bone) !important; letter-spacing:.04em }
.door p{ font-size:.85rem; color:#9ba0aa; margin:0 }

/* ==========================================================================
   09 NUMBERS
   ========================================================================== */
.numbers{ background:var(--ink) }
.tablewrap{ overflow-x:auto; border:1px solid var(--line) }
.rev{ width:100%; border-collapse:collapse; min-width:620px; font-size:.95rem }
.rev th{
  background:var(--gold); color:#14100a; font-family:var(--disp); text-transform:uppercase;
  letter-spacing:.18em; font-size:.82rem; padding:.9rem 1.1rem; text-align:right;
}
.rev th:first-child{ text-align:left }
.rev td{ padding:.78rem 1.1rem; border-bottom:1px solid var(--line-2); text-align:right; color:#c4c9d1 }
.rev td:first-child{ text-align:left; color:#9ba0aa }
.rev tbody tr:hover td{ background:rgba(227,178,60,.05) }
.rev__sub td{ background:rgba(255,255,255,.03); color:var(--bone); font-weight:600 }
.rev__sub td:first-child{ color:var(--bone) }
.rev__tot td{ background:rgba(227,178,60,.1); color:var(--gold-hot); font-weight:700; font-size:1.05rem }
.rev__tot td:first-child{ color:var(--gold-hot) }
.rev__mult td{ font-family:var(--disp); font-size:1.5rem; font-weight:700; color:var(--gold-hot); background:var(--ink-3) }
.rev__mult td:first-child{ font-family:var(--body); font-size:.9rem; font-weight:400; color:var(--mute) }

.scen{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1.6rem }
.scen__card{ border:1px solid var(--line-2); border-top:4px solid var(--blood); background:var(--ink-2); padding:clamp(1.4rem,3vw,2.2rem) }
.scen__card--good{ border-top-color:var(--gold) }
.scen__tag{ font-family:var(--disp); letter-spacing:.3em; text-transform:uppercase; font-size:.76rem; color:var(--mute); margin-bottom:.6rem }
.scen__mult{ font-family:var(--disp); font-size:clamp(3.4rem,9vw,7rem); font-weight:700; line-height:.85; color:#77808c; margin:0 }
.scen__card--good .scen__mult{ color:var(--gold-hot) }
.scen__per{ font-family:var(--disp); font-size:clamp(1.4rem,3vw,2.2rem); font-weight:600; color:var(--bone); margin:.4rem 0 1.4rem }
.scen__per span{ display:block; font-family:var(--body); font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--mute); font-weight:400 }
.scen__card ul{ list-style:none; margin:0 0 1.2rem; padding:0 }
.scen__card li{ display:flex; justify-content:space-between; gap:1rem; padding:.55rem 0; border-bottom:1px solid var(--line-2); font-size:.88rem }
.scen__card li span{ color:#9ba0aa }
.scen__card li b{ font-family:var(--disp); font-weight:600; color:var(--bone); white-space:nowrap }
.scen__card li b.bad{ color:var(--blood) }
.scen__note{ font-size:.86rem; color:var(--gold); margin:0 }

.two{ margin:4rem 0 0; border:2px solid var(--gold); padding:clamp(1.4rem,3vw,2.4rem); background:rgba(227,178,60,.05) }
.two__label{ font-family:var(--disp); letter-spacing:.34em; text-transform:uppercase; font-size:.78rem; color:var(--gold); margin-bottom:1.6rem }
.two__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.8rem }
.two__grid b{ display:block; font-family:var(--disp); font-size:clamp(1.8rem,4.2vw,3.2rem); font-weight:700; color:var(--gold-hot); line-height:.95 }
.two__grid span{ display:block; margin-top:.5rem; font-size:.84rem; color:#a4a9b3 }
.two__split b{ color:var(--bone) }

/* ==========================================================================
   10 TEAM
   ========================================================================== */
.team{ background:linear-gradient(180deg,var(--ink-2),var(--ink)) }
.team__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:2rem }
.who img{ width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top center; border-bottom:3px solid var(--gold); filter:grayscale(.25) contrast(1.05) }
.who h3{ font-size:1.5rem; text-transform:uppercase; letter-spacing:.03em; margin:1.1rem 0 .2rem; color:var(--bone) }
.who__role{ font-family:var(--disp); font-size:.8rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); margin-bottom:.9rem }
.who p{ font-size:.87rem; color:#a4a9b3 }
.who strong{ color:var(--gold) }

/* ==========================================================================
   11 JTFK9s
   ========================================================================== */
.jtf{ position:relative; isolation:isolate; padding:clamp(6rem,12vw,11rem) 0 }
.jtf__bg{ position:absolute; inset:0; z-index:-2; overflow:hidden }
.jtf__bg img{ width:100%; height:100%; object-fit:cover; object-position:center 40% }
.jtf__scrim{ position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(5,6,10,.9),rgba(5,6,10,.7) 45%,rgba(5,6,10,.95)) }
.jtf__inner{ max-width:820px }
.jtf__pledge{ display:flex; align-items:center; gap:clamp(1.2rem,3vw,2.4rem); flex-wrap:wrap; margin-bottom:1.8rem }
.jtf__pct{ font-family:var(--disp); font-size:clamp(5rem,16vw,12rem); font-weight:700; line-height:.8; color:var(--gold-hot); margin:0 }
.jtf__h{ font-size:clamp(1.8rem,4.6vw,3.4rem); text-transform:uppercase; letter-spacing:.02em; color:var(--bone) }
.jtf__line{ font-size:clamp(1rem,1.7vw,1.2rem); color:#d3d7df; margin:.6rem 0 0; max-width:34ch }
.jtf__copy{ color:#c0c5cd; max-width:62ch }
.jtf__motto{ font-family:var(--disp); font-size:clamp(1.1rem,2.4vw,1.7rem); letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin:2rem 0 }
.jtf__foot{ display:flex; align-items:center; gap:2rem; flex-wrap:wrap; margin-bottom:2.5rem }
.jtf__logo{ width:120px }
.jtf__stories{ font-family:var(--disp); font-size:.86rem; letter-spacing:.42em; text-transform:uppercase; color:var(--mute); border-left:3px solid var(--gold); padding-left:1.2rem; margin:0 }

/* ==========================================================================
   12 INVEST
   ========================================================================== */
.invest{ background:var(--ink); text-align:center; padding-bottom:clamp(6rem,12vw,10rem) }
.invest .eyebrow{ justify-content:center }
.invest__slab{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin:0 0 2.6rem }
.invest__slab div{ background:var(--ink-2); padding:1.8rem 1.2rem }
.invest__slab b{ display:block; font-family:var(--disp); font-weight:700; font-size:clamp(1.6rem,3.8vw,3.2rem); color:var(--gold-hot); line-height:1 }
.invest__slab span{ display:block; margin-top:.6rem; font-size:.74rem; letter-spacing:.22em; text-transform:uppercase; color:var(--mute) }
.invest__copy{ max-width:62ch; margin:0 auto 2.6rem; color:#c0c5cd }
.invest__cta{ display:grid; gap:1.4rem; justify-items:center }
.invest__direct{ display:flex; gap:2rem; flex-wrap:wrap; justify-content:center; font-family:var(--disp); letter-spacing:.18em; text-transform:uppercase; font-size:.9rem }
.invest__direct a{ color:var(--gold); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px }
.invest__direct a:hover{ color:var(--gold-hot); border-bottom-color:var(--gold-hot) }
.invest__line{ margin-top:3.5rem; font-family:var(--disp); font-size:clamp(.72rem,1.4vw,.92rem); letter-spacing:.3em; text-transform:uppercase; color:var(--mute) }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.foot{ background:#020306; border-top:2px solid var(--gold); padding:4rem 0 3rem; text-align:center }
.foot__mark{ width:min(300px,60vw); margin:0 auto 1.2rem; mix-blend-mode:screen; filter:brightness(1.5) }
.foot__tag{ font-family:var(--disp); letter-spacing:.3em; text-transform:uppercase; font-size:.8rem; color:var(--gold) }
.foot__links{ display:flex; gap:1.6rem; justify-content:center; flex-wrap:wrap; margin:2rem 0 }
.foot__links a{ font-family:var(--disp); font-size:.8rem; letter-spacing:.2em; text-transform:uppercase; color:#9ba0aa; text-decoration:none }
.foot__links a:hover{ color:var(--gold) }
.foot__legal{ font-size:.72rem; line-height:1.65; color:#5e646e; max-width:96ch; margin:0 auto 1rem }

/* ==========================================================================
   THEATER
   ========================================================================== */
.theater{ position:fixed; inset:0; z-index:100; background:rgba(2,3,6,.97); display:grid; place-items:center; opacity:0; transition:opacity .45s }
.theater.open{ opacity:1 }
.theater__frame{ width:min(1500px,94vw); aspect-ratio:16/9; background:#000 }
.theater__frame iframe{ width:100%; height:100%; border:0 }
.theater__close{
  position:absolute; top:1.2rem; right:1.6rem; width:52px; height:52px; font-size:2rem; line-height:1;
  background:transparent; color:var(--gold); border:2px solid var(--gold); cursor:pointer; transition:background .2s, color .2s;
}
.theater__close:hover{ background:var(--gold); color:#14100a }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1000px){
  .split,.proof__shot,.aud{ grid-template-columns:1fr }
  .split__fig img{ min-height:300px }
  .proof__shot img{ max-width:360px; margin-inline:auto }
  .hero__rail{ grid-template-columns:repeat(3,1fr) }
  .hero__rail div:nth-child(n+4){ border-top:1px solid var(--line) }
  .hero__rail div:nth-child(4){ border-left:0 }
}
@media (max-width:820px){
  .nav__links{ display:none }
  .nav__cta{ margin-left:auto; font-size:.72rem; padding:.6rem .9rem }
  .slab{ grid-template-columns:1fr }
  .cut__badge{ margin-left:0 }
  .arw{ display:none }
  .example__row{ display:grid; grid-template-columns:1fr 1fr; gap:1.4rem }
}
@media (max-width:560px){
  body{ font-size:16px }
  .hero__rail{ grid-template-columns:repeat(2,1fr) }
  .hero__rail div:nth-child(odd){ border-left:0 }
  .hero__rail div:nth-child(n+3){ border-top:1px solid var(--line) }
  .hero__rail div:last-child{ grid-column:1/-1 }
  .example__row{ grid-template-columns:1fr }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important }
  .reveal{ opacity:1; transform:none }
  .grain{ display:none }
}

/* ==========================================================================
   OVERRIDES — specificity + fill fixes (keep at end of file)
   ========================================================================== */
.eyebrow.mt{ margin-top:clamp(3.5rem,7vw,5.5rem) }

/* split image fills its column at any copy length */
.split__fig{ position:relative; min-height:440px }
.split__fig img{ position:absolute; inset:0; width:100%; height:100%; min-height:0 }

/* proof: exactly two rows of three, no orphan cell */
@media (min-width:900px){ .proof__grid{ grid-template-columns:repeat(3,1fr) } }

/* doors: hairlines drawn per cell so a short last row leaves no grey block */
.doors{ background:none; border:0; gap:0 }
.door{ border:1px solid var(--line-2); margin:-1px 0 0 -1px }

/* market: #1 reads as a headline, not body copy */
.mkt__block p.mkt__huge{ font-size:clamp(3.4rem,8vw,6rem); color:var(--gold-hot); line-height:.85 }
.mkt__block p.mkt__pair b{ font-size:clamp(1.8rem,3.6vw,2.8rem) }

/* use-of-funds: bar segments and key swatches share one scale */
.funds__bar span:nth-child(1){ background:rgba(227,178,60,.38) }
.funds__bar span:nth-child(2){ background:rgba(227,178,60,.58) }
.funds__bar span:nth-child(3){ background:var(--gold-hot) }
.funds__bar span:nth-child(4){ background:var(--gold) }
.funds__bar span:nth-child(5){ background:rgba(227,178,60,.28) }
.funds__bar span:nth-child(6){ background:rgba(227,178,60,.18) }
.funds__key li:nth-child(1) i{ background:rgba(227,178,60,.38) }
.funds__key li:nth-child(2) i{ background:rgba(227,178,60,.58) }
.funds__key li:nth-child(3) i{ background:var(--gold-hot) }
.funds__key li:nth-child(4) i{ background:var(--gold) }
.funds__key li:nth-child(5) i{ background:rgba(227,178,60,.28) }
.funds__key li:nth-child(6) i{ background:rgba(227,178,60,.18) }

/* the three-position line should not break mid-figure */
.slab__big:nth-child(2) b{ font-size:clamp(1.15rem,2.5vw,2.1rem); white-space:nowrap }

/* jtfk9s pledge: the 5% and the name read as one lockup */
.jtf__inner{ max-width:920px }
.jtf__line{ max-width:46ch }
@media (min-width:760px){
  .jtf__pledge{ flex-wrap:nowrap; align-items:flex-start }
  .jtf__pct{ flex:none }
  .jtf__h{ margin-top:.4rem }
}

/* investment-level figures never split across lines */
.invest__slab b{ white-space:nowrap }
.invest__slab div:nth-child(2) b{ font-size:clamp(1.05rem,2.3vw,1.9rem) }

.hero__genre{ margin-top:.9rem }

/* hero rail joins the flow on small screens so it can never sit on the CTAs */
@media (max-width:900px){
  .hero{ padding-bottom:0 }
  .hero__rail{ position:static; margin-top:clamp(2.5rem,7vw,4rem) }
}

/* ==========================================================================
   HERO PLAYER — the film sits dead centre, directly under the wordmark
   ========================================================================== */
.hero{ padding-top:7.5rem }
.hero__wordmark{ width:min(620px,80vw) }
.hero__player{
  width:min(860px,92vw); margin:1.8rem auto 1.6rem; aspect-ratio:16/9;
  background:#000; border:1px solid var(--line);
  box-shadow:0 30px 80px rgba(0,0,0,.75), 0 0 0 1px rgba(0,0,0,.6);
}
.hero__player iframe{ width:100%; height:100%; border:0; display:block }
.hero__genre{ font-size:clamp(1.15rem,2.9vw,2.1rem); letter-spacing:.2em; margin-top:.2rem }
.hero__tag{ margin-bottom:1.8rem; font-size:clamp(.95rem,1.35vw,1.08rem) }
@media (max-width:900px){
  .hero{ padding-top:6rem }
  .hero__player{ margin:1.4rem auto }
}

/* hero statement line: longer copy than the old genre label, same face */
.hero__genre{
  font-size:clamp(1.15rem,2.6vw,2rem); letter-spacing:.14em;
  max-width:24ch; margin-inline:auto; line-height:1.14;
}

/* hero statement line: back to display scale — this is the loudest line above the fold */
.hero__genre{
  font-size:clamp(1.55rem,4.2vw,3.5rem);
  font-weight:600;
  letter-spacing:.05em;
  line-height:1.02;
  max-width:none;
  margin:1.1rem auto .9rem;
  text-shadow:0 6px 30px rgba(0,0,0,.85), 0 2px 6px rgba(0,0,0,.6);
}
.hero__genre em{ font-style:normal; color:var(--gold-hot) }
.hero__br{ display:none }
@media (max-width:760px){ .hero__br{ display:inline } }

/* three-line headline: scaled so each written line holds on one rendered line */
.mega--three{ font-size:clamp(1.85rem,5.1vw,4.4rem); line-height:.98 }

/* ==========================================================================
   JTFK9s without the 5% — the name carries the section now
   ========================================================================== */
.jtf__h{ font-size:clamp(2.4rem,6.4vw,5rem); letter-spacing:-.005em }
.jtf__line{ font-size:clamp(1.05rem,1.9vw,1.35rem); max-width:56ch; color:#d7dae1 }
@media (min-width:760px){ .jtf__h{ margin-top:0 } }

/* the project inbox, wherever it appears */
.ask__contact{
  margin:1.6rem 0 0; font-size:.92rem; color:var(--mute);
}
.ask__contact a{
  color:var(--gold); text-decoration:none;
  border-bottom:1px solid rgba(227,178,60,.4); padding-bottom:1px;
}
.ask__contact a:hover{ color:var(--gold-hot); border-bottom-color:var(--gold-hot) }
.foot__mail{ margin:.5rem 0 0 }
.foot__mail a{
  font-family:var(--disp); font-size:.9rem; letter-spacing:.14em;
  color:var(--gold); text-decoration:none;
}
.foot__mail a:hover{ color:var(--gold-hot) }

/* ==========================================================================
   MOTION — the page assembles itself instead of just being there
   ========================================================================== */

/* ---------- hero entrance, staged on load ---------- */
@keyframes heroRise{
  from{ opacity:0; transform:translateY(34px) }
  to  { opacity:1; transform:none }
}
@keyframes heroMark{
  from{ opacity:0; transform:translateY(38px) scale(.965) }
  to  { opacity:1; transform:none }
}
@keyframes railRise{
  from{ opacity:0; transform:translateY(100%) }
  to  { opacity:1; transform:none }
}
@keyframes ruleOut{ from{ transform:scaleX(0) } to{ transform:scaleX(1) } }

.hero__kicker,
.hero__wordmark,
.hero__player,
.hero__genre,
.hero__tag,
.hero__btns{
  opacity:0;
  animation:heroRise .95s cubic-bezier(.16,.84,.34,1) forwards;
}
.hero__wordmark{ animation-name:heroMark }
.hero__rail{ opacity:0; animation:railRise .9s cubic-bezier(.16,.84,.34,1) .95s forwards }

.hero__kicker  { animation-delay:.10s }
.hero__wordmark{ animation-delay:.26s }
.hero__player  { animation-delay:.52s }
.hero__genre   { animation-delay:.72s }
.hero__tag     { animation-delay:.84s }
.hero__btns    { animation-delay:.96s }

/* the gold rules either side of the kicker draw outward */
.hero__kicker::before,
.hero__kicker::after{ transform:scaleX(0); animation:ruleOut .8s cubic-bezier(.16,.84,.34,1) .34s forwards }
.hero__kicker::before{ transform-origin:right }
.hero__kicker::after { transform-origin:left }

/* ---------- section headlines wipe up into place ---------- */
.mega.reveal{
  transform:translateY(44px);
  clip-path:inset(0 0 100% 0);
  transition:opacity .85s cubic-bezier(.16,.84,.34,1),
             transform .95s cubic-bezier(.16,.84,.34,1),
             clip-path .95s cubic-bezier(.16,.84,.34,1);
}
.mega.reveal.in{ clip-path:inset(-18% 0 -18% 0) }

/* ---------- eyebrow rule draws itself ---------- */
.eyebrow.reveal::after{
  transform:scaleX(0); transform-origin:left;
  transition:transform .8s cubic-bezier(.16,.84,.34,1) .12s;
}
.eyebrow.reveal.in::after{ transform:scaleX(1) }

/* ---------- big figures land a touch later than their labels ---------- */
.stat.reveal b,
.slab.reveal b,
.scen__card.reveal .scen__mult{
  display:block;
  transform:translateY(16px); opacity:0;
  transition:opacity .7s cubic-bezier(.16,.84,.34,1) .18s,
             transform .7s cubic-bezier(.16,.84,.34,1) .18s;
}
.stat.reveal.in b,
.slab.reveal.in b,
.scen__card.reveal.in .scen__mult{ transform:none; opacity:1 }

/* ---------- honour the setting ---------- */
@media (prefers-reduced-motion:reduce){
  .hero__kicker,.hero__wordmark,.hero__player,.hero__genre,.hero__tag,
  .hero__btns,.hero__rail{ opacity:1 !important; animation:none !important; transform:none !important }
  .hero__kicker::before,.hero__kicker::after{ transform:none !important; animation:none !important }
  .mega.reveal{ clip-path:none !important; transform:none !important }
  .eyebrow.reveal::after{ transform:none !important }
  .stat.reveal b,.slab.reveal b,.scen__card.reveal .scen__mult{
    opacity:1 !important; transform:none !important }
}

/* short viewports (most laptops): keep the headline and CTAs above the fold */
@media (min-width:900px) and (max-height:960px){
  .hero{ padding-top:6rem }
  .hero__wordmark{ width:min(500px,64vw) }
  .hero__player{ width:min(660px,74vw); margin:1.2rem auto 1.1rem }
  .hero__tag{ margin-bottom:1.3rem }
}