/* The scroll-scrubbed hero. Engineering standard from the scrub pipeline. */

.hero{position:relative;height:420vh;margin-top:calc(-1*var(--nav-h));z-index:0}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#1a2412;isolation:isolate}
.poster{position:absolute;inset:0;background-size:cover;background-position:center 45%;transform:scale(1.02)}
#hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;opacity:0;transition:opacity 1s var(--ease);will-change:transform;transform:translateZ(0);pointer-events:none}
.stage.video-ready #hero-video{opacity:1}
.stage.video-failed #hero-video{display:none}
.stage .scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(8,12,5,0) 45%,rgba(8,12,5,.42) 100%)}
.stage .topfade{position:absolute;left:0;right:0;top:0;height:140px;pointer-events:none;background:linear-gradient(rgba(8,12,5,.55),rgba(8,12,5,0))}

/* bands */
.band{position:absolute;color:#f6f0da;text-shadow:var(--tshadow);opacity:0;pointer-events:none;--k:0;z-index:2}
.band.on{pointer-events:auto}
.band::before{content:"";position:absolute;inset:-14% -18%;pointer-events:none;z-index:-1;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 74% 62% at 50% 50%,rgba(5,8,4,var(--peak,.66)) 0%,rgba(5,8,4,calc(var(--peak,.66)*.66)) 46%,rgba(5,8,4,0) 76%)}
.band .btn{text-shadow:none}
.band .eyebrow{display:inline-block;font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#f0cf7e;margin-bottom:16px;background:rgba(8,12,5,.5);border:1px solid rgba(240,207,126,.35);border-radius:999px;padding:6px 13px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);text-shadow:0 1px 3px rgba(5,8,4,.85)}
.band .small{display:inline-block;background:rgba(8,12,5,.5);border:1px solid rgba(240,207,126,.3);border-radius:999px;padding:6px 13px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.band h1,.band h2{color:#fdfaf0;font-weight:600;letter-spacing:-.01em}
.band .sub{font-size:clamp(1.02rem,1.5vw,1.22rem);color:#efe8d2;margin:16px auto 0;line-height:1.5}
.band .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}

.b1{left:50%;top:14%;transform:translateX(-50%);width:min(760px,90vw);text-align:center;--peak:.4}
.b1 h1{font-size:clamp(2.3rem,5.2vw,4.4rem);max-width:16ch;margin-inline:auto}
.b1 .sub{max-width:46ch}
.b2{left:6%;top:50%;transform:translateY(-50%);width:min(520px,44vw);--peak:.36}
.b2 .line{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.18;color:#fdfaf0;font-weight:600;position:relative}
.b2 .small{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#e8c777;margin-top:18px}
.b3{left:50%;top:50%;transform:translate(-50%,-50%);width:min(720px,90vw);text-align:center;--peak:.2}
.b3::before{inset:-6% -10%;background:radial-gradient(ellipse 62% 56% at 50% 50%,rgba(5,8,4,var(--peak,.34)) 0%,rgba(5,8,4,calc(var(--peak,.34)*.5)) 45%,rgba(5,8,4,0) 72%)}
.b3 h2{font-size:clamp(2.2rem,4.8vw,4rem);max-width:14ch;margin-inline:auto}
.b3 .sub{max-width:44ch}

/* entrance (e): word-by-word rise into a staged settle */
.band[data-entrance="rise"] .w{display:inline-block;--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*18px))}
.band[data-entrance="rise"] .eyebrow{--ke:clamp(0,var(--k,0)*3,1);opacity:var(--ke);transform:translateY(calc((1 - var(--ke))*-8px))}
.band[data-entrance="rise"] .sub{--ks:clamp(0,(var(--k,0) - .6)*3.4,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks))*12px))}
.band[data-entrance="rise"] .cta{--kb:clamp(0,(var(--k,0) - .74)*4.5,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*12px))}
.band[data-entrance="rise"] .small{--ks:clamp(0,(var(--k,0) - .6)*3.4,1);opacity:var(--ks)}

/* entrance (g): approach from depth, with a soft copy that sharpens */
.band[data-entrance="depth"] .line{--kc:clamp(0,var(--k,0)*1.5,1);opacity:var(--kc);transform:scale(calc(.84 + .16*var(--kc)))}
.band[data-entrance="depth"] .line .soft{position:absolute;inset:0;filter:blur(9px);opacity:calc(1 - var(--kc));pointer-events:none}
.band[data-entrance="depth"] .line .sharp{position:relative;opacity:var(--kc)}
.band[data-entrance="depth"] .eyebrow{--ke:clamp(0,var(--k,0)*2.4,1);opacity:var(--ke);transform:translateX(calc((1 - var(--ke))*-10px))}
.band[data-entrance="depth"] .small{--ks:clamp(0,(var(--k,0) - .55)*3,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks))*10px))}

/* loading ring and scroll cue */
.ring{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);width:44px;height:44px;color:#f6f0da;opacity:.85;transition:opacity .5s;z-index:3}
.ring circle{stroke-dashoffset:var(--ld,126);transition:stroke-dashoffset .15s linear;transform:rotate(-90deg);transform-origin:center}
.ring.hide{opacity:0}
.cue{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:#f6f0da;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;opacity:.85;transition:opacity .5s;z-index:3;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.cue svg{width:18px;height:18px;animation:cuebob 2.2s var(--ease-soft) -.6s infinite}
@keyframes cuebob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.cue.hide{opacity:0}
@media (max-height:560px){.cue,.ring{display:none}}

/* ===== the static hero gate: five conditions, identical in JS ===== */
@media (max-width:720px),(orientation:portrait) and (max-width:1024px),(orientation:portrait) and (pointer:coarse),(orientation:landscape) and (pointer:coarse) and (max-height:560px),(prefers-reduced-motion:reduce){
  .hero{height:auto}
  .stage{position:relative;height:auto;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:calc(var(--nav-h) + 56px) 20px 72px}
  .poster{background-image:url("img/hero-still.jpg");background-position:center 55%;transform:none}
  #hero-video,.ring,.cue,.b2,.b3,.topfade{display:none}
  .stage .scrim{background:linear-gradient(180deg,rgba(12,20,6,.7) 0%,rgba(12,20,6,.42) 45%,rgba(12,20,6,.78) 100%)}
  .band{position:relative;left:auto;top:auto;transform:none;opacity:1!important;pointer-events:auto;--k:1}
  .b1{width:min(640px,100%);text-align:center}
  .b1::before{display:none}
  .band .w,.band .eyebrow,.band .sub,.band .cta{opacity:1!important;transform:none!important}
  .b1 h1{font-size:clamp(2.2rem,8vw,3.2rem)}
}