@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/Inter-latin.woff2) format("woff2")}
@font-face{font-family:"BubbledotICG-FinePos";font-weight:400;font-display:swap;src:url(/fonts/BubbledotICG-FinePos.woff2) format("woff2")}
:root{--bg:#000;--text:#fff;--muted:#8e8e8e;--nav-text:#2e2e2e;--pill-dark:#28282a;--sign-in-text:#c8c8c8;
--nav-shadow:0 4px 14px rgba(0,0,0,.16);--trust-bg:#28282a;--trust-border:rgba(255,255,255,.4);--trust-text:#c4c2c3;
--font-sans:"Inter","Segoe UI",system-ui,sans-serif;--font-display:"BubbledotICG-FinePos",monospace}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--font-sans);overflow:hidden;height:100vh;height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
.bg{position:absolute;inset:0;background:#000;overflow:hidden;z-index:0}
.bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}
.bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.28) 45%,rgba(0,0,0,.6))}
.page{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;height:100vh;height:100dvh;overflow:hidden;
padding:clamp(16px,2.4vh,28px) clamp(14px,3vw,32px)}
.header,.hero,.stats{position:relative;z-index:1}.header{z-index:4}
/* header */
.header{display:flex;align-items:center;justify-content:center;gap:clamp(18px,2.8vw,28px);width:100%;max-width:720px;flex-shrink:0;animation:slideDown .7s cubic-bezier(.22,1,.36,1) both}
.logo{display:grid;place-items:center;width:clamp(40px,4.4vw,46px);height:clamp(40px,4.4vw,46px);border-radius:50%;background:#fff;box-shadow:var(--nav-shadow);transition:transform .25s;flex-shrink:0}
.logo:hover{transform:scale(1.04)}
.logo img{width:72%;height:72%;object-fit:contain;border-radius:22%}
.nav{display:flex;align-items:center;justify-content:space-around;flex:1;max-width:430px;height:clamp(44px,5.2vw,48px);padding:4px 8px;background:#fff;border-radius:999px;box-shadow:var(--nav-shadow)}
.nav a{position:relative;padding:8px 10px;font-weight:500;font-size:clamp(13px,1.4vw,15px);letter-spacing:-.01em;color:var(--nav-text);opacity:.5;transition:opacity .2s}
.nav a:hover{opacity:.75}
.nav a.active{opacity:1}
.nav a.active::after{content:"";position:absolute;left:50%;bottom:5px;width:3px;height:3px;border-radius:50%;background:#000;transform:translateX(-50%);box-shadow:-5px 0 #000,5px 0 #000}
.cta-dark{display:inline-flex;align-items:center;height:clamp(44px,5.2vw,48px);padding:0 clamp(16px,2vw,22px);border-radius:999px;background:var(--pill-dark);color:var(--sign-in-text);font-weight:500;font-size:clamp(13px,1.4vw,15px);box-shadow:var(--nav-shadow);transition:background .2s,color .2s,transform .2s;white-space:nowrap}
.cta-dark:hover{background:#323234;color:#fff;transform:translateY(-1px)}
.burger{display:none}
/* hero */
.hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;max-width:900px;width:100%}
.trust{--trust-size:clamp(36px,4.5vw,42px);display:inline-flex;align-items:center;margin-bottom:clamp(16px,2.5vh,26px)}
.av{display:block;width:var(--trust-size);height:var(--trust-size);padding:5px;border-radius:50%;background:var(--trust-bg);border:1px solid var(--trust-border);transition:transform .35s;position:relative}
.av i{display:block;width:100%;height:100%;border-radius:50%}
.av+.av{margin-left:calc(var(--trust-size)*-.42)}
.a1{z-index:1}.a2{z-index:2}.a3{z-index:4}
.a1:hover{transform:translateY(-2px)}.a2:hover{transform:translateY(-4px)}.a3:hover{transform:translateY(-2px)}
.a1 i{background:#1f9d55}.a2 i{background:#e8a317}.a3 i{background:#d64545}
.trust-pill{display:inline-flex;align-items:center;height:var(--trust-size);margin-left:calc(var(--trust-size)*-.42);padding:0 16px 0 calc(var(--trust-size)*.58);border-radius:999px;background:var(--trust-bg);border:1px solid var(--trust-border);color:var(--trust-text);font-weight:500;font-size:clamp(12px,1.4vw,13.5px);white-space:nowrap}
.headline{font-family:var(--font-sans);font-weight:600;font-size:clamp(27px,6vw,76px);letter-spacing:-.035em;line-height:1.08;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.35);white-space:nowrap;overflow:hidden;margin-bottom:clamp(12px,2vh,20px)}
.headline span{display:block;opacity:0;animation:headlineFade .85s cubic-bezier(.22,1,.36,1) forwards}
.headline span:nth-child(1){animation-delay:.12s}.headline span:nth-child(2){animation-delay:.3s}
.sub{max-width:min(500px,92%);font-size:clamp(calc(13.5px + 2pt),calc(1.55vw + 2pt),calc(16.5px + 2pt));color:#e8e8e8;opacity:.92;text-shadow:0 1px 14px rgba(0,0,0,.4);line-height:1.55;font-weight:400;margin-bottom:clamp(18px,3vh,28px)}
.cta{display:inline-block;padding:clamp(11px,1.6vh,13px) clamp(22px,3vw,28px);border-radius:999px;background:#fff;color:#000;font-weight:600;font-size:clamp(13.5px,1.5vw,14.5px);
box-shadow:0 0 0 1px rgba(255,255,255,.15),0 0 22px rgba(255,255,255,.32),0 0 44px rgba(255,255,255,.12);transition:transform .25s,box-shadow .25s}
.cta:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 0 0 1px rgba(255,255,255,.25),0 0 28px rgba(255,255,255,.45),0 0 56px rgba(255,255,255,.2)}
/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,2vw,24px);width:100%;max-width:920px;flex-shrink:0;text-align:center}
.stat-icon{font-family:var(--font-display);font-size:clamp(22px,3vw,33px);line-height:1;color:#fff;margin-bottom:6px}
.stat-val{font-size:clamp(18px,2.2vw,26px);letter-spacing:-.025em;font-weight:500;font-variant-numeric:tabular-nums;color:#fff}
.stat-label{color:var(--muted);font-size:clamp(11px,1.2vw,12.5px);margin-top:2px}
.credit{position:relative;z-index:1;margin-top:clamp(8px,1.4vh,14px);font-size:11px;color:#6f6f6f;text-align:center}
.credit a{text-decoration:underline;text-underline-offset:2px}
/* entrance */
.anim{opacity:0;animation:reveal .85s cubic-bezier(.22,1,.36,1) forwards;animation-delay:var(--d,0s)}
.anim.pulse{animation-name:revealPulse}
@keyframes reveal{from{opacity:0;transform:translateY(22px) scale(.98);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes revealPulse{0%{opacity:0;transform:translateY(22px) scale(.98);filter:blur(6px)}70%{opacity:1;transform:translateY(0) scale(1.03);filter:none}100%{opacity:1;transform:none;filter:none}}
@keyframes headlineFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes slideDown{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}}
@keyframes overlayIn{from{opacity:0}to{opacity:1}}
@keyframes menuIn{from{opacity:0;transform:translateY(-10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes linkIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.anim,.headline span,.header{opacity:1;transform:none;filter:none}}
/* mobile */
.overlay,.menu{display:none}
@media (max-width:720px){
 .nav,.header>.cta-dark{display:none}
 .header{justify-content:space-between}
 .logo{width:48px;height:48px}
 .burger{display:grid;place-content:center;gap:5px;width:48px;height:48px;border:0;border-radius:50%;background:#28282a;cursor:pointer;box-shadow:var(--nav-shadow);transition:background .25s}
 .burger span{display:block;width:18px;height:1.5px;background:#fff;transition:transform .3s,background .25s}
 .burger[aria-expanded=true]{background:#fff}
 .burger[aria-expanded=true] span{background:#000}
 .burger[aria-expanded=true] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
 .burger[aria-expanded=true] span:nth-child(2){opacity:0}
 .burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
 body.menu-open .overlay{display:block;position:fixed;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:overlayIn .28s both;z-index:2}
 body.menu-open .menu{display:flex;flex-direction:column;position:fixed;z-index:3;left:14px;right:14px;top:calc(clamp(16px,2.4vh,28px) + 60px);background:#fff;border-radius:28px;padding:22px 18px 20px;box-shadow:0 20px 60px rgba(0,0,0,.45);animation:menuIn .38s cubic-bezier(.22,1,.36,1) both}
 .menu a.l{position:relative;padding:14px 8px 20px;text-align:center;color:#2e2e2e;font-weight:500;font-size:17px;opacity:.5;animation:linkIn .4s both}
 .menu a.l:nth-child(2){animation-delay:.05s}.menu a.l:nth-child(3){animation-delay:.1s}.menu a.l:nth-child(4){animation-delay:.15s}
 .menu a.l.active{opacity:1}
 .menu a.l.active::after{content:"";position:absolute;left:50%;bottom:8px;width:3px;height:3px;border-radius:50%;background:#000;transform:translateX(-50%);box-shadow:-5px 0 #000,5px 0 #000}
 .menu a.play{margin-top:10px;text-align:center;padding:14px;border-radius:999px;background:#28282a;color:#c8c8c8;font-weight:500;animation:linkIn .4s .2s both}
 .headline{letter-spacing:-.03em;line-height:1.08}
 .stats{grid-template-columns:1fr 1fr;row-gap:14px}
}
@media (max-width:420px){.headline{letter-spacing:-.03em;line-height:1.08}.trust{--trust-size:34px}.trust-pill{font-size:12px}}
@media (max-height:700px){.trust{margin-bottom:10px}.sub{margin-bottom:14px}.headline{margin-bottom:10px}}
