.hero{position:relative;min-height:min(100svh,980px);display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-bg{position:absolute;inset:-4% 0 0;width:100%;height:108%;object-fit:cover;object-position:center 40%;will-change:transform;transform-origin:center 60%}
.hero-shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(11,13,18,.72) 0%,rgba(11,13,18,.38) 30%,rgba(11,13,18,.55) 65%,var(--bg) 100%),
  radial-gradient(70% 60% at 50% 45%,rgba(11,13,18,.2),rgba(11,13,18,.6))}
.hero-in{text-align:center;padding-top:130px;padding-bottom:150px;width:100%}
.hero h1{font-size:clamp(34px,5.4vw,68px);font-weight:700;line-height:1.08;max-width:15em;margin-inline:auto;text-shadow:0 4px 30px rgba(0,0,0,.4)}
.hero h1 span{color:var(--sky)}
.hero p{max-width:46ch;margin:20px auto 0;color:#d5dbe5;font-size:clamp(15px,1.3vw,18px);text-shadow:0 2px 16px rgba(0,0,0,.5)}
.hero-cta{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin-top:34px}
.online-pill{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 18px;border-radius:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:14px;font-weight:600}
.online-pill svg{width:17px;height:17px;opacity:.8}
.online-pill b{color:#fff}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--win);box-shadow:0 0 0 0 rgba(61,220,151,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(61,220,151,0)}100%{box-shadow:0 0 0 0 rgba(61,220,151,0)}}
.hero-stats{display:flex;justify-content:center;gap:clamp(24px,6vw,72px);flex-wrap:wrap;margin-top:56px}
.hero-stats b{display:block;font-family:var(--f-h);font-size:clamp(26px,3vw,36px);font-weight:700;line-height:1.1}
.hero-stats small{color:#b9c1cd;font-size:13px}
.mouse{position:absolute;left:50%;bottom:30px;width:26px;height:42px;margin-left:-13px;border-radius:14px;border:2px solid rgba(255,255,255,.55);background:none;cursor:pointer;transition:border-color .2s}
.mouse:hover{border-color:#fff}
.mouse span{position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:wheel 1.8s var(--ease) infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:0}20%{opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}
@media (max-width:640px){.mouse{display:none}.hero-in{padding-bottom:90px}.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}}

.ann{position:relative;height:64px;display:flex;align-items:center;justify-content:center;margin-top:-32px;z-index:2;padding-inline:var(--gl) var(--gr)}
.ann::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:linear-gradient(90deg,transparent,var(--p) 12%,var(--sky) 50%,var(--p) 88%,transparent);box-shadow:0 0 18px rgba(47,123,255,.65)}

.sec-h{text-align:center;max-width:640px;margin:0 auto 44px}
.sec-h h2{font-size:clamp(26px,3.2vw,38px);font-weight:700}
.sec-h p{color:var(--muted);margin:12px 0 0}
.feats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.feat{padding:28px 24px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:transform .45s var(--ease),border-color .3s,background .3s}
.feat:hover{transform:translateY(-6px);border-color:rgba(47,123,255,.4);background:var(--card-2)}
.fi{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--p-soft);color:var(--sky);margin-bottom:18px;transition:transform .5s var(--ease),background .3s,color .3s}
.feat:hover .fi{transform:rotate(-8deg) scale(1.08);background:var(--p);color:#fff}
.fi svg{width:22px;height:22px}
.feat h3{font-size:17px;font-weight:600;margin-bottom:8px}
.feat p{margin:0;color:var(--muted);font-size:14px}
@media (max-width:980px){.feats{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.feats{grid-template-columns:1fr}}
.join{display:flex;justify-content:space-between;align-items:center;gap:24px 40px;flex-wrap:wrap;padding:30px 34px;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.join h2{font-size:clamp(22px,2.4vw,28px);font-weight:700}
.join p{margin:6px 0 0;color:var(--muted)}
.join-r{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.join-r .btn{height:50px}
.connect-btn{display:inline-flex;align-items:center;gap:14px;height:50px;padding:0 6px 0 18px;border-radius:12px;border:1px solid var(--line-2);background:var(--bg);cursor:pointer;transition:border-color .25s,background .25s}
.connect-btn:hover{border-color:var(--p);background:var(--p-soft)}
.connect-btn code{font-family:var(--f-m);font-size:14px;white-space:nowrap}
.connect-btn code span{color:var(--muted);margin-right:.6em}
.cb-ic{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:var(--p);color:#fff;transition:transform .3s var(--ease)}
.connect-btn:hover .cb-ic{transform:scale(1.06)}
.cb-ic svg{width:16px;height:16px}
@media (max-width:560px){.connect-btn{width:100%;justify-content:space-between}.join-r{width:100%}.join-r .btn{width:100%}}
.partners{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:44px 52px}
.partners .lbl{text-align:center;margin-bottom:30px}
.plogos{display:flex;justify-content:center;align-items:center;gap:clamp(24px,4vw,52px);flex-wrap:wrap}
.plogo{display:flex;align-items:center;gap:10px;color:#8b919c;font-family:var(--f-h);font-weight:700;font-size:18px;letter-spacing:-.01em;filter:grayscale(1);opacity:.75;transition:opacity .3s,color .3s,transform .4s var(--ease)}
.plogo:hover{opacity:1;color:#d8dde5;transform:translateY(-2px)}
.plogo svg{width:30px;height:30px}
.plogo .pimg{display:grid;place-items:center;width:64px;height:44px;flex:none}
.plogo img{width:100%;height:100%;object-fit:contain}

.xmas{position:relative;display:flex;align-items:center;min-height:330px;padding:40px 44px;border-radius:22px;overflow:hidden;isolation:isolate;margin-top:40px;background:radial-gradient(45% 80% at 85% 70%,rgba(196,32,54,.28),transparent 70%),var(--card);border:1px solid var(--line)}
.xmas-l{max-width:520px;position:relative;z-index:1}
.xmas-tag{font-size:13px;font-weight:700;color:#ff7a8a}
.xmas h2{font-size:clamp(28px,3vw,38px);font-weight:700;margin:6px 0 0}
.xmas p{color:#bfc6d1;margin:12px 0 0}
.xmas-cd{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin:20px 0 22px;font-size:14px;color:var(--muted)}
.xmas-cd span{margin-right:4px}
.xmas-cd b{font-family:var(--f-h);font-size:22px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.btn-xmas{background:#d8344a;color:#fff}
.btn-xmas:hover{background:#e84a5f}
.santa{position:absolute;right:40px;bottom:0;height:310px;width:auto;max-width:none;pointer-events:none}
@media (max-width:860px){.xmas{flex-direction:column;align-items:flex-start;padding:28px 24px 0}.santa{position:relative;right:auto;align-self:center;height:240px;margin-top:10px}}

.rev-h{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.rev-h h2{font-size:clamp(26px,3.2vw,38px);font-weight:700}
.rev-h p{color:var(--muted);margin:10px 0 0;max-width:52ch}
.rev-avg{display:grid;justify-items:end;gap:2px}
.rev-avg b{font-family:var(--f-h);font-size:40px;font-weight:700;line-height:1}
.rev-avg small{color:var(--muted);font-size:13px}
.revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.rev{margin:0;display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:18px;background:var(--card);border:1px solid var(--line);transition:transform .45s var(--ease),border-color .3s}
.rev:hover{transform:translateY(-5px);border-color:rgba(244,183,64,.35)}
.rev blockquote{margin:0;flex:1;color:#d3d8e0;font-size:15px;line-height:1.65}
.rev figcaption{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--line)}
.rev figcaption .av{width:38px;height:38px;font-size:12px}
.rev figcaption b{display:block;font-size:14px}
.rev figcaption small{font-size:12px;color:var(--muted)}
@media (max-width:980px){.revs{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.revs{grid-template-columns:1fr}.rev-avg{justify-items:start}}

.trailer{position:relative;padding-block:clamp(70px,9vw,110px);overflow:hidden;isolation:isolate}
.trailer-bg{position:absolute;inset:-40px;z-index:-1;background:center/cover no-repeat;filter:blur(40px) saturate(1.2);opacity:.35;transform:scale(1.1)}
.trailer::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(var(--bg),rgba(11,13,18,.55) 30%,rgba(11,13,18,.55) 70%,var(--bg))}
.tr-card{position:relative;display:block;width:100%;max-width:960px;margin:0 auto;aspect-ratio:16/9;border:0;padding:0;border-radius:20px;overflow:hidden;cursor:pointer;background:#000;box-shadow:0 40px 90px -40px #000,0 0 0 1px var(--line-2)}
.tr-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.82;transition:transform 1.2s var(--ease),opacity .4s}
.tr-card:hover img{transform:scale(1.04);opacity:.68}
.tr-play{position:absolute;left:50%;top:50%;width:78px;height:78px;margin:-39px 0 0 -39px;border-radius:50%;display:grid;place-items:center;background:var(--p);color:#fff;box-shadow:0 0 0 0 rgba(47,123,255,.6);animation:trPulse 2.2s infinite;transition:transform .4s var(--ease)}
.tr-card:hover .tr-play{transform:scale(1.1)}
.tr-play svg{width:28px;height:28px;margin-left:4px}
@keyframes trPulse{70%{box-shadow:0 0 0 22px rgba(47,123,255,0)}100%{box-shadow:0 0 0 0 rgba(47,123,255,0)}}
.tr-meta{position:absolute;left:0;right:0;bottom:0;display:grid;gap:2px;padding:22px 26px;text-align:left;background:linear-gradient(transparent,rgba(5,6,9,.85))}
.tr-meta b{font-family:var(--f-h);font-size:18px}
.tr-meta small{color:#c7cdd8;font-size:13px}
.vmodal{position:fixed;inset:0;z-index:122;display:grid;place-items:center;padding:50px var(--gr) 30px var(--gl);opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
.vmodal.on{opacity:1;pointer-events:auto}
.vmodal .x{position:absolute;right:20px;top:20px;background:rgba(255,255,255,.08)}
.vbox{width:min(1100px,100%);display:grid;gap:10px;justify-items:center;transform:scale(.96);transition:transform .5s var(--ease)}
.vmodal.on .vbox{transform:none}
.vbox iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:16px;background:#000;box-shadow:0 40px 90px -30px #000}
.vlink{font-size:13px;color:var(--muted)}
.vlink:hover{color:#fff}
.slides{position:relative;width:100%;aspect-ratio:16/9;max-width:100%;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 40px 90px -30px #000}
.slides figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.2s ease}
.slides figure.on{opacity:1}
.slides figure img{width:100%;height:100%;object-fit:cover}
.slides figure.on img{animation:kb 5s linear both}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.12) translate(-1.5%,-1%)}}
.slides figcaption{position:absolute;left:24px;bottom:30px;font-family:var(--f-h);font-size:clamp(18px,2.4vw,28px);font-weight:700;text-shadow:0 2px 20px rgba(0,0,0,.7)}
.slides-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.15)}
.slides-bar i{display:block;height:100%;width:0;background:var(--p)}
.slides-note{position:absolute;right:16px;top:14px;font-size:12px;padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.55);color:#c7cdd8}
