@font-face{font-family:"Plus Jakarta Sans";font-weight:800;font-style:normal;font-display:swap;src:url(/card-font-800.ttf)}
@font-face{font-family:"Plus Jakarta Sans";font-weight:700;font-style:normal;font-display:swap;src:url(/card-font-700.ttf)}
@font-face{font-family:"Plus Jakarta Sans";font-weight:600;font-style:normal;font-display:swap;src:url(/card-font-600.ttf)}
@font-face{font-family:"Plus Jakarta Sans";font-weight:500;font-style:normal;font-display:swap;src:url(/card-font-500.ttf)}
@font-face{font-family:"Plus Jakarta Sans";font-weight:400;font-style:normal;font-display:swap;src:url(/card-font-400.ttf)}

body{margin:0;font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:#fff;background:#030b1a}
a{color:#9bdcff}a:hover{color:#fff}
*{box-sizing:border-box}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;border:0;font:inherit;font-size:15px;font-weight:700;cursor:pointer;text-decoration:none;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}
.btn:hover{background:rgba(255,255,255,.18);color:#fff}
.btn.primary{background:#3db8f2;color:#061530;border-color:#3db8f2;box-shadow:0 10px 40px rgba(61,184,242,.45)}
.btn.primary:hover{background:#6fcdf7;color:#061530}
.eyebrow{font-size:13px;font-weight:800;letter-spacing:.22em;color:#3db8f2}
.muted{color:#b4c6dc}
.glass{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.stars{position:absolute;left:0;top:0;width:2px;height:2px;border-radius:50%;background:transparent;box-shadow:120px 80px #fff,340px 40px #9bdcff,560px 150px #fff,820px 60px #fff,1040px 120px #9bdcff,1260px 70px #fff,1380px 200px #fff,200px 260px #9bdcff,460px 320px #fff,700px 280px #fff,960px 330px #9bdcff,1180px 300px #fff,60px 420px #fff,300px 480px #fff,620px 440px #9bdcff,880px 500px #fff,1120px 460px #fff,1340px 420px #9bdcff,150px 600px #fff,1240px 620px #fff;opacity:.7}
.beam{position:absolute;left:50%;top:-200px;width:900px;height:900px;margin-left:-450px;background:conic-gradient(from 200deg at 50% 0%,rgba(61,184,242,0) 0deg,rgba(61,184,242,.28) 18deg,rgba(61,184,242,0) 36deg,rgba(0,184,163,0) 300deg);filter:blur(30px);pointer-events:none}
.horizon{position:absolute;left:-10%;right:-10%;bottom:-260px;height:520px;border-radius:50%;background:radial-gradient(ellipse at 50% 0%,rgba(61,184,242,.55) 0%,rgba(6,119,201,.25) 30%,rgba(3,11,26,0) 65%);pointer-events:none}
.stage{position:relative;height:560px;perspective:1600px}
.phone{position:absolute;width:250px;height:500px;border-radius:38px;overflow:hidden;border:1px solid rgba(255,255,255,.18);box-shadow:0 50px 120px rgba(0,0,0,.6),0 0 80px rgba(61,184,242,.25)}
.float1{animation:float1 9s ease-in-out infinite}
.float2{animation:float2 11s ease-in-out infinite}
.float3{animation:float3 10s ease-in-out infinite}
@keyframes float1{0%,100%{transform:rotateY(-16deg) rotateX(6deg) translateY(0)}50%{transform:rotateY(-12deg) rotateX(4deg) translateY(-16px)}}
@keyframes float2{0%,100%{transform:rotateY(22deg) rotateX(8deg) translateZ(-120px) translateY(0)}50%{transform:rotateY(18deg) rotateX(6deg) translateZ(-120px) translateY(12px)}}
@keyframes float3{0%,100%{transform:rotateY(-28deg) rotateX(10deg) translateZ(-200px) translateY(0)}50%{transform:rotateY(-24deg) rotateX(8deg) translateZ(-200px) translateY(-10px)}}
.orbit{position:absolute;left:50%;top:50%;width:620px;height:200px;margin:-100px 0 0 -310px;border-radius:50%;border:1px solid rgba(155,220,255,.25);transform:rotateX(70deg)}
.ping{position:absolute;width:12px;height:12px;border-radius:50%;background:#3db8f2;box-shadow:0 0 24px 6px rgba(61,184,242,.8);animation:ping 2.6s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(61,184,242,.8)}100%{box-shadow:0 0 0 26px rgba(61,184,242,0)}}
.seg{min-height:44px;padding:0 22px;border-radius:999px;border:0;font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.tile{position:relative;border-radius:28px;padding:28px;overflow:hidden;min-height:250px;display:flex;flex-direction:column;gap:12px}
.tile h3{margin:0;font-size:20px;font-weight:800;letter-spacing:-.01em}
.tile p{margin:0;font-size:15px;line-height:1.55;color:#c3d3e6}
.glow{position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;filter:blur(40px);opacity:.55;pointer-events:none}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;font-weight:700;color:#c3d3e6}
.field input{height:48px;padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.28);color:#fff;font:inherit;font-size:15px}
.field input::placeholder{color:#8aa0bb}
@media (prefers-reduced-motion: reduce){.float1,.float2,.float3,.ping{animation:none}}

html{scroll-behavior:smooth}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #9bdcff;outline-offset:4px}[hidden]{display:none!important}.mobile-nav-toggle{display:none}
#landing-auth{border:0;padding:0;background:transparent;color:white;width:min(460px,calc(100vw - 28px));max-height:calc(100dvh - 32px);overflow:hidden}#landing-auth::backdrop{background:#020814c9;backdrop-filter:blur(8px)}#landing-auth .auth-inner{max-height:calc(100dvh - 32px)!important;max-width:none!important;width:100%;overflow:hidden!important}#landing-auth .auth-inner>div:first-child{flex:none}#landing-auth [data-if^=auth-]{overflow:auto;min-height:0;padding:3px}.signup-steps{padding-left:22px;line-height:2;color:#c3d3e6;font-size:14px}#login-error{color:#ffd0d9;background:#d52b5e22;border-radius:12px;padding:12px;font-size:14px;margin:0}.auth-inner .seg{min-width:0;padding:0 12px}
@media(max-width:720px){.mobile-nav-toggle{display:inline-flex;margin-left:auto;min-height:42px}header .wrap{gap:12px!important}#landing-nav{display:none!important;width:100%;order:3;margin:0!important;padding:12px 0;justify-content:space-between;gap:12px!important;font-size:13px!important}#landing-nav.is-open{display:flex!important}header .wrap>div:last-child{margin-left:auto}.wrap{padding-left:20px;padding-right:20px}.stage{height:480px;transform:scale(.85);transform-origin:top center;margin-bottom:-60px}.phone{width:220px;height:440px}.landing-hero{padding-bottom:70px!important}#analytics .glass{transform:none!important;padding:16px!important}#analytics .glass>div[style*="repeat(4"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}#pricing .wrap>div{grid-template-columns:1fr!important}#landing-auth .auth-inner{padding:20px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

.landing-brand{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;white-space:nowrap;flex-shrink:0}.landing-brand img{display:block;width:132px;height:30px;object-fit:contain;filter:brightness(0) invert(1)}.landing-brand strong{font-size:22px;font-weight:800;line-height:1;letter-spacing:-.04em}@media(max-width:720px){.landing-brand img{width:112px;height:26px}.landing-brand strong{font-size:19px}.landing-brand{gap:8px}}

/* Shared grid reserves the tallest message, keeping the calls to action steady. */
.hero-messages{display:grid;min-width:0}.hero-message{grid-area:1/1;display:flex;flex-direction:column;gap:24px;min-width:0}
.hero-message h1,.hero-message h2{margin:0;font-size:clamp(40px,6vw,68px);line-height:1.04;font-weight:800;letter-spacing:-.035em}.hero-message h1 span,.hero-message h2 span{color:#3db8f2}
.hero-message p{margin:0;font-size:19px;line-height:1.6;max-width:540px}
.hero-carousel.is-ready .hero-message{visibility:hidden;opacity:0;pointer-events:none;transition:opacity .45s ease}
.hero-carousel.is-ready .hero-message.is-active{visibility:visible;opacity:1;pointer-events:auto}
.hero-carousel-controls{display:flex;align-items:center;gap:12px;margin-top:24px;flex-wrap:wrap}
.hero-arrow,.hero-pause,.hero-dot{font:inherit;cursor:pointer;border:1px solid #ffffff35;color:#d6e4f3;background:#ffffff0a;border-radius:24px;min-height:44px}
.hero-arrow{width:44px;font-size:20px}.hero-pause{padding:0 16px;font-size:13px;margin-left:4px}.hero-dots{display:flex;gap:2px;flex-wrap:wrap}
.hero-dot{display:grid;place-items:center;width:36px;border:0;background:transparent;padding:0}.hero-dot:after{content:"";width:8px;height:8px;border-radius:20px;background:#ffffff50;transition:width .2s ease,background .2s ease}.hero-dot[aria-current=true]:after{width:24px;background:#3db8f2}
