/* HYBRID — Hero & Ticker */

#hero{position:relative;height:100vh;min-height:700px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:visible}
.hvw{position:absolute;inset:0;z-index:0;overflow:hidden;contain:paint;backface-visibility:hidden;transform:translateZ(0)}
.hvb{width:100%;height:100%;overflow:hidden;position:relative;background:#000;transform-origin:center top}
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;backface-visibility:hidden;transform:translateZ(0)}
.ho{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(0,0,0,.6) 0%,rgba(0,0,0,.15) 35%,rgba(0,0,0,.1) 55%,rgba(0,0,0,.88) 100%)}

/* Hero content — no overflow hidden so logo isn't clipped */
.hc{position:relative;z-index:10;text-align:center;padding:0 clamp(20px,5vw,80px);display:flex;flex-direction:column;align-items:center;justify-content:center}
.hlm{animation:hf 1s ease .15s both;margin-bottom:20px}
.hbdg{display:inline-flex;align-items:center;gap:8px;font-family:var(--fb);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--y);padding:8px 20px;border-radius:980px;background:rgba(245,200,0,.06);border:1px solid rgba(245,200,0,.12);backdrop-filter:blur(12px);margin-top:18px;margin-bottom:24px;animation:hf 1s ease .3s both}
.bd{width:5px;height:5px;border-radius:50%;background:var(--y);animation:bk 1.5s ease-in-out infinite}
@keyframes bk{0%,100%{opacity:1}50%{opacity:.12}}
.hero-wordmark-wrap{animation:hf 1s ease .4s both;margin-bottom:10px}
.hero-wordmark{display:block;width:min(92vw,860px);height:auto;filter:drop-shadow(0 0 26px rgba(245,200,0,.25)) drop-shadow(0 6px 18px rgba(0,0,0,.45))}
.hero-wordmark-fallback{margin-bottom:0}
@media(min-width:769px){.hero-wordmark{width:min(74vw,680px)}}
.ht{font-family:var(--fd);font-weight:900;font-size:clamp(52px,11vw,140px);line-height:.88;letter-spacing:-.02em;color:var(--y);text-shadow:
    -3px -3px 0 rgba(0,0,0,.4),
    3px -3px 0 rgba(0,0,0,.4),
    -3px 3px 0 rgba(0,0,0,.4),
    3px 3px 0 rgba(0,0,0,.4),
    -4px 0 0 rgba(0,0,0,.3),
    4px 0 0 rgba(0,0,0,.3),
    0 -4px 0 rgba(0,0,0,.3),
    0 4px 0 rgba(0,0,0,.3),
    -2px -2px 0 rgba(0,0,0,.2),
    2px -2px 0 rgba(0,0,0,.2),
    -2px 2px 0 rgba(0,0,0,.2),
    2px 2px 0 rgba(0,0,0,.2),
    0 0 50px rgba(245,200,0,.5);animation:hf 1s ease .4s both;margin-bottom:10px}
.ht .y{color:var(--y);text-shadow:
    -3px -3px 0 rgba(0,0,0,.4),
    3px -3px 0 rgba(0,0,0,.4),
    -3px 3px 0 rgba(0,0,0,.4),
    3px 3px 0 rgba(0,0,0,.4),
    -4px 0 0 rgba(0,0,0,.3),
    4px 0 0 rgba(0,0,0,.3),
    0 -4px 0 rgba(0,0,0,.3),
    0 4px 0 rgba(0,0,0,.3),
    -2px -2px 0 rgba(0,0,0,.2),
    2px -2px 0 rgba(0,0,0,.2),
    -2px 2px 0 rgba(0,0,0,.2),
    2px 2px 0 rgba(0,0,0,.2),
    0 0 50px rgba(245,200,0,.5)}
.ht-sub{font-family:var(--fd);font-size:clamp(20px,3.5vw,44px);font-weight:700;letter-spacing:.01em;text-transform:uppercase;color:var(--y);display:block;margin-top:8px;text-shadow:
    -1px -1px 0 rgba(0,0,0,.3),
    1px -1px 0 rgba(0,0,0,.3),
    -1px 1px 0 rgba(0,0,0,.3),
    1px 1px 0 rgba(0,0,0,.3),
    -2px 0 0 rgba(0,0,0,.2),
    2px 0 0 rgba(0,0,0,.2),
    0 -2px 0 rgba(0,0,0,.2),
    0 2px 0 rgba(0,0,0,.2),
    0 0 30px rgba(245,200,0,.3)}
.hs{font-family:var(--fb);font-size:clamp(13px,1.8vw,17px);font-weight:400;color:rgba(255,255,255,.45);letter-spacing:.06em;animation:hf 1s ease .5s both;margin-bottom:16px}
.hm{font-family:var(--fd);font-size:clamp(22px,3.2vw,38px);font-weight:700;font-style:italic;color:var(--rb);text-shadow:0 0 30px rgba(229,34,34,.4),0 0 60px rgba(229,34,34,.18);animation:hf 1s ease .6s both;margin-bottom:36px}
.hbtns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;animation:hf 1s ease .7s both;margin-bottom:52px}
.hstats{display:flex;gap:clamp(16px,4vw,48px);animation:hf 1s ease .85s both}
.hstat{text-align:center}
.stn{font-family:var(--fd);font-size:clamp(28px,4vw,44px);font-weight:800;color:var(--y);line-height:1;letter-spacing:-.03em;text-shadow:0 0 20px rgba(245,200,0,.15)}
.stl{font-family:var(--fb);font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-top:4px}
@keyframes hf{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.shi{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:10;display:flex;flex-direction:column;align-items:center;gap:6px;animation:hf 1s ease 1.1s both;cursor:pointer}
.shi span{font-family:var(--fb);font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.25)}
.sha{width:24px;height:24px;border:1px solid rgba(255,255,255,.08);border-radius:50%;display:flex;align-items:center;justify-content:center;animation:bo 2s ease-in-out infinite}
@keyframes bo{0%,100%{transform:translateY(0);opacity:.3}50%{transform:translateY(5px);opacity:.7}}

/* Ticker */
.tk{position:relative;z-index:5;background:linear-gradient(90deg,var(--y),var(--yl),var(--y));overflow:hidden;padding:12px 0}
.tkt{display:flex;width:max-content;animation:tks 26s linear infinite}
.tki{font-family:var(--fd);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#000;padding:0 28px;white-space:nowrap;display:flex;align-items:center;gap:12px}
.td{width:4px;height:4px;border-radius:50%;background:var(--r);flex-shrink:0}
@keyframes tks{to{transform:translateX(-50%)}}

@media(max-width:768px){
    .hbdg{backdrop-filter:none;border-color:rgba(245,200,0,.18)}
    .hero-wordmark{filter:drop-shadow(0 0 16px rgba(245,200,0,.2))}
    .ht,.ht .y,.ht-sub{ text-shadow:0 0 24px rgba(245,200,0,.24)}
    .hm{text-shadow:0 0 22px rgba(229,34,34,.24)}
}
