@import url('https://cdn.jsdelivr.net/npm/@fontsource/geist-sans@5.2.5/index.css');
:root { --background:260 87% 3%; --foreground:40 6% 95%; --hero-sub:40 6% 82%; color-scheme:dark; font-family:'Geist Sans',sans-serif; color:hsl(var(--foreground)); background:hsl(var(--background)); }
* { box-sizing:border-box; }
body { margin:0; }
button,a { -webkit-tap-highlight-color:transparent; }
button { font:inherit; color:inherit; cursor:pointer; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible { outline:2px solid #c4b5fd; outline-offset:6px; }
.page-wrapper { position:relative; overflow:hidden; min-height:100vh; min-height:100svh; background:hsl(var(--background)); }
#hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none; }
.page-content { position:relative; z-index:10; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; }
header { position:relative; z-index:20; }
.navbar { width:100%; padding:20px 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; }
.brand img { display:block; height:32px; width:auto; max-width:180px; object-fit:contain; mix-blend-mode:screen; }
.nav-items { display:flex; align-items:center; gap:32px; }
.nav-items button,.nav-items a { display:flex; align-items:center; gap:6px; border:0; background:none; padding:8px 0; color:hsl(var(--foreground)/.9); font-size:14px; transition:color .2s; }
.nav-items button:hover,.nav-items a:hover { color:#c4b5fd; }
.nav-items svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.5; }
.divider { height:1px; margin-top:3px; background:linear-gradient(to right,transparent,hsl(var(--foreground)/.2),transparent); }
.hero-secondary { display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:999px; font-size:14px; font-weight:500; transition:background .2s,transform .2s; }
.hero-secondary:hover { background:rgba(255,255,255,.09); transform:translateY(-1px); }
.signup { padding:8px 16px; white-space:nowrap; }
.hero { position:relative; flex:1; display:flex; align-items:center; justify-content:center; overflow:visible; padding:70px 24px 90px; }
.hero-blur { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:984px; height:527px; background:#030712; opacity:.9; filter:blur(82px); pointer-events:none; }
.hero-copy { position:relative; z-index:1; text-align:center; }
h1 { font-family:'General Sans',sans-serif; font-size:220px; font-weight:400; line-height:1.02; letter-spacing:-.024em; margin:0; white-space:nowrap; }
h1 span { background-image:linear-gradient(to left,#6366f1,#a855f7,#fcd34d); background-clip:text; -webkit-background-clip:text; color:transparent; }
h1 { position:relative; display:inline-block; }
.hero-version { position:absolute; left:calc(100% + 12px); bottom:18%; font-family:'Geist Sans',sans-serif; font-size:12px; font-weight:400; line-height:1.4; letter-spacing:.04em; color:hsl(var(--hero-sub)/.7); white-space:nowrap; }
@media(max-width:1200px) { .hero-version { left:auto; right:0; bottom:auto; top:100%; font-size:10px; } .hero-copy .subtitle { margin-top:27px; } }
.subtitle { color:hsl(var(--hero-sub)); font-size:18px; line-height:32px; max-width:448px; margin:9px auto 0; opacity:.8; }
.subtitle .pixel-word { display:inline-block; font-family:'Press Start 2P',monospace; font-size:.72em; font-weight:400; line-height:1; letter-spacing:-.04em; white-space:nowrap; transform:scaleY(1.2); transform-origin:center bottom; }
.consult { padding:24px 29px; margin-top:25px; }
.logo-footer { position:relative; padding:0 32px 40px; }
.logo-container { max-width:1024px; margin:auto; display:flex; align-items:center; gap:48px; }
.trust-copy { margin:0; flex-shrink:0; font-size:14px; line-height:22px; color:hsl(var(--foreground)/.5); }
.marquee { overflow:hidden; flex:1; min-width:0; mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent); }
.marquee-track { display:flex; width:max-content; animation:marquee 20s linear infinite; }
.logo-group { display:flex; align-items:center; gap:64px; padding-right:64px; }
.client-logo { display:flex; align-items:center; gap:9px; font-size:16px; font-weight:600; white-space:nowrap; }
.logo-icon { width:24px; height:24px; border-radius:8px; display:grid; place-items:center; font-size:13px; font-weight:500; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.liquid-glass { background:rgba(255,255,255,.01); background-blend-mode:luminosity; backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); border:none; box-shadow:inset 0 1px 1px rgba(255,255,255,.1); position:relative; overflow:hidden; }
.liquid-glass::before { content:''; position:absolute; inset:0; border-radius:inherit; padding:1.4px; background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,.15) 20%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(255,255,255,.15) 80%,rgba(255,255,255,.45) 100%); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; }
dialog { color:hsl(var(--foreground)); background:#100d1a; border:1px solid #ffffff26; border-radius:24px; padding:40px; width:min(440px,calc(100% - 32px)); box-shadow:0 30px 100px #0008; }
dialog::backdrop { background:#030109bb; backdrop-filter:blur(10px); }
dialog h2 { font:500 28px 'General Sans',sans-serif; margin:0 0 16px; }
dialog p { font-size:15px; color:hsl(var(--hero-sub)); line-height:1.8; margin:0 0 24px; }
.close-dialog { position:absolute; right:14px; top:10px; background:none; border:0; padding:5px 10px; font-size:26px; }
.dialog-link { padding:14px 22px; gap:20px; }
@media(max-width:1000px) { h1 { font-size:clamp(90px,18vw,180px); } .nav-items { gap:22px; } .hero-blur { width:85vw; } }
@media(max-width:600px) { .navbar { padding:20px; gap:14px; flex-wrap:wrap; } .brand img { max-width:135px; } .nav-items { order:3; width:100%; justify-content:center; gap:24px; } .nav-items button { font-size:12px; } .hero { padding:64px 16px 80px; } h1 { font-size:clamp(64px,19vw,114px); } .subtitle { font-size:15px; line-height:27px; } .hero-blur { width:100vw; height:380px; filter:blur(65px); } .logo-footer { padding:0 20px 28px; } .logo-container { flex-direction:column; gap:24px; } .trust-copy { text-align:center; } .trust-copy br { display:none; } .marquee { width:100%; flex:auto; } .logo-group { gap:40px; padding-right:40px; } }
@media(prefers-reduced-motion:reduce) { .marquee-track { animation:none; } .hero-secondary { transition:none; } }