#hyper-hero{--hyh-green:#44d62c;--hyh-dim:.42;position:relative;z-index:0;flex:0 0 auto;max-width:none;height:420vh;background:#0a0a0a;font-family:Montserrat,"Inter Tight",Inter,Arial,sans-serif;color:#fff;-webkit-font-smoothing:antialiased;text-align:left}
#hyper-hero *{box-sizing:border-box;margin:0;padding:0}
#hyper-hero.hyh-editor{height:100vh}
#hyper-hero .hyh-stage{position:absolute;top:0;left:0;width:100%;height:100vh;overflow:hidden;z-index:1;background:#0a0a0a url(frames/d/f_001.webp) center/cover no-repeat}
@media (orientation:portrait){#hyper-hero .hyh-stage{background-image:url(frames/m/f_001.webp)}}
#hyper-hero .hyh-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#hyper-hero .hyh-dim{position:absolute;inset:0;background:rgba(0,0,0,var(--hyh-dim));pointer-events:none}
#hyper-hero .hyh-grad{position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(0,0,0,.72) 8%,rgba(0,0,0,.28) 48%,rgba(0,0,0,.55) 100%)}
#hyper-hero .hyh-text{position:absolute;inset:0;z-index:5;pointer-events:none}
#hyper-hero .hyh-line{position:absolute;top:58%;left:8%;right:8%;max-width:1100px;transform:translateY(-42%);opacity:0;transition:opacity .5s ease,transform .5s ease}
#hyper-hero .hyh-line.is-on{opacity:1;transform:translateY(-50%)}
#hyper-hero .hyh-kicker{display:flex;align-items:center;gap:12px;margin-bottom:16px;color:var(--hyh-green);font-size:13px;font-weight:700;letter-spacing:4px;line-height:1.2}
#hyper-hero .hyh-kicker::before{content:"";width:36px;height:1px;background:var(--hyh-green)}
#hyper-hero .hyh-h{font-size:clamp(26px,4.8vw,64px);font-weight:800;line-height:1.08;letter-spacing:-1px;text-transform:uppercase;color:#fff}
#hyper-hero .hyh-h b{color:var(--hyh-green);font-weight:800}
#hyper-hero .hyh-sub{margin-top:14px;color:#b9b9b9;font-size:clamp(13px,1.5vw,18px);font-weight:600;letter-spacing:.5px;line-height:1.35;text-transform:uppercase}
#hyper-hero .hyh-dots{position:absolute;left:8%;bottom:56px;z-index:6;display:flex;gap:10px}
#hyper-hero .hyh-dots span{position:relative;width:26px;height:3px;border-radius:2px;background:rgba(255,255,255,.25);overflow:hidden}
#hyper-hero .hyh-dots i{position:absolute;inset:0 auto 0 0;width:0;background:var(--hyh-green)}
#hyper-hero .hyh-hint{position:absolute;left:0;right:0;bottom:48px;z-index:6;text-align:center;color:#b9b9b9;font-size:11px;font-weight:600;letter-spacing:3px;transition:opacity .4s ease;pointer-events:none}
#hyper-hero .hyh-logo{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;will-change:opacity,transform}
#hyper-hero .hyh-logo-svg{width:min(560px,72vw);height:auto;display:block}
#hyper-hero .hyh-logo-svg .hyh-c1,#hyper-hero .hyh-logo-svg .hyh-c2{fill:#fff}
#hyper-hero .hyh-logo-svg .hyh-c3{fill:var(--hyh-green)}
#hyper-hero .hyh-cue{margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:10px;color:#fff;font-size:12px;font-weight:600;letter-spacing:3px;opacity:0;transition:opacity .5s ease}
#hyper-hero .hyh-cue.is-on{opacity:1}
#hyper-hero .hyh-cue::after{content:"";width:10px;height:10px;border-right:2px solid var(--hyh-green);border-bottom:2px solid var(--hyh-green);transform:rotate(45deg);animation:hyh-bounce 1.6s ease-in-out infinite}
@keyframes hyh-bounce{0%,100%{transform:rotate(45deg) translateY(0)}50%{transform:rotate(45deg) translateY(7px)}}
@media (max-width:820px){
#hyper-hero{--hyh-dim:.5}
#hyper-hero .hyh-line{left:7%;right:7%}
#hyper-hero .hyh-h{font-size:clamp(26px,7.4vw,48px)}
#hyper-hero .hyh-kicker{font-size:11px;letter-spacing:3px}
#hyper-hero .hyh-dots{bottom:96px;left:7%}
#hyper-hero .hyh-hint{bottom:84px}
}
@media (prefers-reduced-motion:reduce){#hyper-hero .hyh-line,#hyper-hero .hyh-cue{transition:none}#hyper-hero .hyh-cue::after{animation:none}}