html.no-js .reveal-blur { opacity: 1; filter: none; transform: none; }
:root{
  --bg:#000;
  --surface-1:rgb(16,16,16);
  --surface-2:rgb(16,16,16);
  --border:#1a1a1a;
  --text:#eef1ff;
  --muted:#b4bdd6;
  --accent:#6f8eff;
  --accent-2:#a8bbff;
  --success:#22c55e;
  --radius:18px;
  --shadow:0 12px 30px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.02);
  --grid:min(1180px, 92vw);
  --ease:cubic-bezier(.22,.61,.36,1);
  --navH:64px;
  --bp:880px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, Segoe UI, Inter, Roboto, Helvetica, Arial;
  background:var(--bg); color:var(--text); line-height:1.55; letter-spacing:.2px;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
.container{width:var(--grid);margin-inline:auto}

header{position:sticky;top:0;z-index:60}
header::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#000000f2,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:-1}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;width:var(--grid);margin:auto}
.brand{display:flex;gap:10px;align-items:center;font-weight:800}
.logo{width:26px;height:26px;border-radius:8px;background:conic-gradient(from 200deg at 50% 50%, var(--accent) 0 60%, var(--accent-2) 60% 100%);box-shadow:0 0 0 3px #000, 0 6px 20px rgba(0,0,0,.45)}
.links{display:flex;gap:18px;align-items:center}
.links.primary a{padding:8px 0}
.btn{--p:12px 16px;display:inline-flex;align-items:center;gap:.6rem;padding:var(--p);border-radius:12px;border:1px solid var(--border);background:linear-gradient(180deg,var(--surface-2),var(--surface-1));color:var(--text);font-weight:700;box-shadow:var(--shadow);cursor:pointer;transition:transform .15s ease,border-color .2s ease,box-shadow .2s ease}
.btn:hover{transform:translateY(-1px);border-color:color-mix(in oklab, var(--accent) 35%, var(--border))}
.btn.primary{background:linear-gradient(180deg,var(--accent), color-mix(in oklab, var(--accent) 88%, #425bff));border:0;box-shadow:0 10px 30px rgba(111,142,255,.45)}
.menu-btn{display:none;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,var(--surface-2),var(--surface-1));cursor:pointer}
.menu-btn .bars{position:relative;width:18px;height:2px;background:#e5e9ff;border-radius:2px}
.menu-btn .bars::before,.menu-btn .bars::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#e5e9ff;border-radius:2px;transition:transform .25s var(--ease),top .25s var(--ease),opacity .2s}
.menu-btn .bars::before{top:-6px}
.menu-btn .bars::after{top:6px}
header.open .menu-btn .bars{background:transparent}
header.open .menu-btn .bars::before{top:0;transform:rotate(45deg)}
header.open .menu-btn .bars::after{top:0;transform:rotate(-45deg)}
.mobile-menu{display:none}
@media (max-width:880px){
  .links.primary{display:none}
  .menu-btn{display:inline-flex}
  .mobile-menu{display:block;overflow:hidden;transition:grid-template-rows .28s var(--ease),opacity .28s var(--ease),filter .28s var(--ease);grid-template-rows:0fr;display:grid;opacity:.6;filter:blur(2px);border-bottom:1px solid var(--border);background:linear-gradient(180deg,#0a0a0a,#000)}
  header.open .mobile-menu{grid-template-rows:1fr;opacity:1;filter:blur(0)}
  .mobile-menu>div{overflow:hidden}
  .mobile-links{display:grid;gap:10px;padding:12px 20px;width:var(--grid);margin:auto}
  .mobile-links a{padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(180deg,var(--surface-2),var(--surface-1))}
  .mobile-actions{display:grid;gap:10px;padding:12px 20px;width:var(--grid);margin:auto}
  .mobile-actions .btn{justify-content:center}
}

.accent-text{background:linear-gradient(90deg,#fff,color-mix(in oklab,var(--accent) 40%,#fff));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 20px rgba(111,142,255,.08))}
.accent-only{background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}

.reveal-blur{opacity:0;filter:blur(16px);transform:translateY(22px) scale(.985)}
.reveal-left{opacity:0;filter:blur(14px);transform:translateX(-40px)}
.reveal-right{opacity:0;filter:blur(14px);transform:translateX(40px)}
.in{opacity:1;filter:blur(0);transform:none}
@keyframes blurIn{to{opacity:1;filter:blur(0);transform:none}}
@keyframes slideLeft{from{opacity:0;filter:blur(14px);transform:translateX(40px)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes slideRight{from{opacity:0;filter:blur(14px);transform:translateX(-40px)}to{opacity:1;filter:blur(0);transform:none}}
@supports (animation-timeline:view()){
  .reveal-blur{animation:blurIn .9s both var(--ease);animation-timeline:view();animation-range:entry 10% cover 30%}
  .reveal-left{animation:slideRight .9s both var(--ease);animation-timeline:view();animation-range:entry 10% cover 30%}
  .reveal-right{animation:slideLeft .9s both var(--ease);animation-timeline:view();animation-range:entry 10% cover 30%}
}
.stagger>*{opacity:0;filter:blur(14px);transform:translateY(16px);transition:opacity .7s,filter .7s,transform .7s}
.stagger.in>*{opacity:1;filter:blur(0);transform:none}
.stagger.in>*:nth-child(1){transition-delay:.05s}
.stagger.in>*:nth-child(2){transition-delay:.12s}
.stagger.in>*:nth-child(3){transition-delay:.18s}
.stagger.in>*:nth-child(4){transition-delay:.24s}
.stagger.in>*:nth-child(5){transition-delay:.30s}

.hero{position:relative;overflow:hidden;padding:110px 0 40px;min-height:clamp(560px,80vh,860px);isolation:isolate}
.halo{position:absolute;width:1200px;height:1200px;left:50%;top:-820px;translate:-50% 0;background:radial-gradient(closest-side,rgba(111,142,255,.24),transparent 60%);filter:blur(28px);opacity:.6;pointer-events:none}
.hero-inner{display:grid;gap:18px;justify-items:center;text-align:center;position:relative;z-index:2}
.heading{margin:10px 0 6px;font-size:clamp(36px,6.2vw,68px);line-height:1.04}
.lead{max-width:900px;color:#c8d0ea;font-size:clamp(16px,2.6vw,18px)}
.cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:12px}

.hero-floaters{position:absolute;inset:0;z-index:1;pointer-events:none}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.floater{position:absolute;object-fit:cover;will-change:transform,opacity,filter;animation:floatY 7s ease-in-out infinite;filter:drop-shadow(0 12px 22px rgba(0,0,0,.45));opacity:0;filter:blur(12px) drop-shadow(0 12px 22px rgba(0,0,0,.45));transition:opacity .6s var(--ease),filter .6s var(--ease)}
.hero-floaters.in .floater{opacity:1;filter:blur(0) drop-shadow(0 12px 22px rgba(0,0,0,.45))}
.floater:nth-child(2){animation-duration:7.6s}
.floater:nth-child(3){animation-duration:8.1s}
.floater:nth-child(4){animation-duration:6.9s}
.floater:nth-child(5){animation-duration:7.3s}
.floater:nth-child(6){animation-duration:7.9s}
.hero-floaters.in .floater:nth-child(1){transition-delay:.06s}
.hero-floaters.in .floater:nth-child(2){transition-delay:.12s}
.hero-floaters.in .floater:nth-child(3){transition-delay:.18s}
.hero-floaters.in .floater:nth-child(4){transition-delay:.24s}
.hero-floaters.in .floater:nth-child(5){transition-delay:.30s}
.hero-floaters.in .floater:nth-child(6){transition-delay:.36s}
.floater--1{width:clamp(120px,22vw,220px);left:clamp(4%,10vw,12%);top:clamp(20px,8vh,80px);animation-delay:1.2s}
.floater--2{width:clamp(120px,22vw,220px);right:clamp(4%,10vw,12%);top:clamp(20px,8vh,80px);animation-delay:.9s}
.floater--3{width:clamp(120px,22vw,220px);left:clamp(6%,12vw,13%);top:clamp(260px,50vh,520px);animation-delay:1.35s}
.floater--4{width:clamp(160px,32vw,333px);right:clamp(4%,8vw,12%);top:clamp(200px,36vh,360px);animation-delay:.95s}
.floater--5{width:clamp(160px,34vw,290px);left:clamp(2%,6vw,8%);top:clamp(160px,32vh,320px);animation-delay:.7s}
.floater--6{width:clamp(120px,24vw,230px);right:clamp(6%,12vw,15%);top:clamp(320px,56vh,560px);animation-delay:1.6s}
@media (max-width:880px){
  .hero{min-height:clamp(480px,68vh,760px)}
  .hero-floaters{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  .floater{animation:none!important;transform:none!important}
}

.showcase{width:min(980px,95vw);margin:34px auto 0;border-radius:22px;background:linear-gradient(180deg,#111,#0b0b0b);border:1px solid #222;box-shadow:0 30px 80px rgba(0,0,0,.6);position:relative;overflow:hidden}
.showcase .rim{pointer-events:none}
section.hero>.showcase iframe.showcase{all:unset;display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;max-height:660px}
.showcase .sc-btn{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--border);background:linear-gradient(180deg,#0f0f0fcc,#0a0a0acc);backdrop-filter:blur(6px);cursor:pointer;box-shadow:var(--shadow);transition:transform .2s var(--ease),border-color .2s var(--ease);color:#e5eaff;z-index:2}
.showcase .sc-btn:hover{transform:translateY(-50%) scale(1.05);border-color:color-mix(in oklab,var(--accent) 35%,var(--border))}
.showcase .sc-btn.prev{left:12px}
.showcase .sc-btn.next{right:12px}
.showcase .sc-count{position:absolute;right:12px;bottom:10px;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:linear-gradient(180deg,#0f0f0fcc,#0a0a0acc);backdrop-filter:blur(6px);font-weight:800;color:#cfe0ff;font-size:12px;z-index:2}
.hero .heading,.hero .lead,.hero .cta,.hero .showcase{opacity:0;transform:translateY(20px);filter:blur(10px)}
.hero.ready .heading{animation:blurIn .6s .08s both}
.hero.ready .lead{animation:blurIn .6s .20s both}
.hero.ready .cta{animation:blurIn .6s .32s both}
.hero.ready .showcase{animation:blurIn .6s .44s both}
section.hero>.showcase{--zoom:1.20;transform:scale(var(--zoom));transform-origin:center top;will-change:transform}
@keyframes showcaseZoom{from{transform:scale(1.20)}to{transform:scale(1.10)}}
@supports (animation-timeline:view()){
  section.hero>.showcase{animation:showcaseZoom linear both;animation-timeline:view();animation-range:entry 0% cover 100%}
}

.trusted{padding:48px 0}
.trusted .title{font-size:28px;text-align:center;color:#dbe2ff;margin:0 0 18px}
.ticker{position:relative;overflow:hidden}
.ticker::before,.ticker::after{content:"";position:absolute;top:0;width:120px;height:100%;pointer-events:none;z-index:2}
.ticker::before{left:0;background:linear-gradient(90deg,#000,transparent)}
.ticker::after{right:0;background:linear-gradient(-90deg,#000,transparent)}
.track{display:flex;gap:36px;align-items:center;will-change:transform}
.logo-badge{height:clamp(42px,6vw,50px);min-width:clamp(120px,28vw,180px);border-radius:18px;padding:0 22px;display:grid;place-items:center;color:#aab5d8;background:linear-gradient(180deg,#0c0c0c,#0a0a0a);border:1px solid var(--border);box-shadow:0 8px 18px rgba(0,0,0,.35)}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.move{animation:marquee 40s linear infinite}

.card{position:relative;background:linear-gradient(180deg,var(--surface-2),var(--surface-1));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.card:hover{border-color:color-mix(in oklab,var(--accent) 24%,var(--border));box-shadow:0 20px 50px rgba(0,0,0,.55),0 0 0 1px color-mix(in oklab,var(--accent) 10%,transparent) inset}
h2.section-title{font-size:clamp(28px,4.4vw,48px);margin:0}
.tag{display:inline-block;margin-bottom:8px;color:var(--accent);font-weight:800}

.analytics{display:flex;gap:48px;align-items:center;flex-wrap:wrap}
.analytics>*{flex:1 1 360px}

.stat-grid{display:flex;flex-wrap:wrap;gap:18px;filter:drop-shadow(0 18px 40px rgba(0,0,0,.45))}
.stat-chip{flex:1 1 calc(25% - 18px);min-width:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;border-radius:24px;background:linear-gradient(180deg,#121212,#0a0a0a);border:1px solid var(--border);box-shadow:0 12px 36px rgba(0,0,0,.5);text-align:center}
.stat-chip b{font-size:clamp(26px,6vw,48px);display:block}
.stat-chip span{color:#c8cfe1;font-size:clamp(12px,3.4vw,15px)}
.stat-grid.cluster .stat-chip{transform:scale(.98);opacity:.98}
@media (max-width:1024px){
  .stat-chip{flex:1 1 calc(50% - 18px)}
}
@media (max-width:520px){
  .stat-chip{flex:1 1 100%}
}

.features-wrap{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:980px){.features-wrap{grid-template-columns:1fr}}
.feature-hero{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:28px}
@media (max-width:980px){.feature-hero{grid-template-columns:1fr}}
.feature-text h3{font-size:clamp(22px,3vw,34px);margin:8px 0 10px}
.feature-mock{border:0px solid var(--border);border-radius:20px;height:260px;position:relative;background:radial-gradient(700px 260px at 20% 10%,rgba(111,142,255,.12),transparent 55%),linear-gradient(180deg,#0f0f0f,#0a0a0a)}
.feature-card{padding:28px}
.feature-mini{height:260px;border:0px solid var(--border);border-radius:20px;margin-bottom:16px}

#pricing .muted{text-align:center}
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media (max-width:980px){.pricing-grid{grid-template-columns:1fr}}
.plan{border-radius:22px;padding:28px;display:flex;flex-direction:column;gap:16px;background:linear-gradient(180deg,#0e0e0e,#0a0a0a);border:1px solid var(--border);box-shadow:var(--shadow);position:relative}
.plan .head{font-weight:700;text-align:center;color:#dfe5ff}
.badge{position:absolute;top:14px;right:14px;background:rgba(111,142,255,.16);color:#cfe0ff;font-weight:700;border:1px solid color-mix(in oklab,var(--accent) 40%,#0a0a0a);padding:4px 10px;border-radius:999px;font-size:12px}
.price-line{display:flex;align-items:end;justify-content:center;gap:6px;margin:4px 0 6px}
.currency{font-size:22px;opacity:.9}
.amount{font-size:44px;font-weight:800;letter-spacing:.2px}
.features-list{list-style:none;padding:18px 0 0;margin:0;display:grid;gap:10px;color:#c7cfe6}
.features-list li{display:flex;gap:10px;align-items:flex-start}
.features-list i{color:var(--accent);margin-top:4px}
.plan .cta{margin-top:auto}
.plan .cta .btn{width:100%;justify-content:center;padding:12px 16px;border-radius:999px}
.plan.primary{border-color:color-mix(in oklab,var(--accent) 45%,var(--border));box-shadow:0 18px 44px rgba(111,142,255,.18)}

.faq-wrap{max-width:780px;margin-inline:auto}
details.ac{border:1px solid var(--border);background:linear-gradient(180deg,#0f0f0f,#0a0a0a);border-radius:16px;padding:14px}
details.ac+details.ac{margin-top:12px}
details.ac summary{cursor:pointer;list-style:none;font-weight:700;display:flex;align-items:center;justify-content:space-between}
details.ac summary .icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--border);transition:transform .35s var(--ease),background .2s}
details.ac[open] summary .icon{transform:rotate(45deg);background:#101010}
details.ac .content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease),opacity .35s var(--ease),filter .35s var(--ease);opacity:.6;filter:blur(2px)}
details.ac[open] .content{grid-template-rows:1fr;opacity:1;filter:blur(0)}
details.ac .content>div{overflow:hidden}

.to-top{position:fixed;right:16px;bottom:16px;z-index:80;width:44px;height:44px;border-radius:999px;border:1px solid var(--border);background:linear-gradient(180deg,var(--surface-2),var(--surface-1));color:#e5eaff;display:grid;place-items:center;box-shadow:var(--shadow);cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease),border-color .2s var(--ease)}
.to-top:hover{border-color:color-mix(in oklab,var(--accent) 35%,var(--border));transform:translateY(10px)}
.to-top.show{opacity:1;transform:translateY(0);pointer-events:auto}
@media (max-width:520px){.to-top{right:12px;bottom:12px;width:42px;height:42px}}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:10px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

footer{padding:48px 0 80px;border-top:1px solid var(--border);background:linear-gradient(180deg,#050505,#000);margin-top:40px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:22px;width:var(--grid);margin:auto}
.foot-grid h5{margin:0 0 10px;color:#dfe5ff}
.foot-grid a{display:block;padding:6px 0;color:#a6b2d6}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;width:var(--grid);margin:20px auto 0;color:#8d97b7}
@media (max-width:820px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-bottom{flex-direction:column;gap:12px}
}

#statGrid{position:relative;height:320px;filter:drop-shadow(0 14px 32px rgba(0,0,0,.45))}
#statGrid .stat-chip{
  position:absolute;width:min(300px,78vw);padding:20px 22px;border-radius:22px;
  background:linear-gradient(180deg,#121212,#0b0b0b);border:1px solid #1a1a1a;
  box-shadow:0 12px 28px rgba(0,0,0,.45);text-align:center
}
#statGrid .stat-chip b{display:block;font-size:clamp(28px,5vw,42px);font-weight:800;line-height:1.05}
#statGrid .stat-chip span{display:block;margin-top:4px;color:#c8cfe1;font-size:clamp(11px,2.4vw,14px);opacity:.95}

#statGrid .stat-chip:nth-child(1){top:6px;left:50%;transform:translate(-50%,0);z-index:3}
#statGrid .stat-chip:nth-child(2){top:46%;left:6%;transform:translate(0,-50%);z-index:2}
#statGrid .stat-chip:nth-child(3){top:46%;right:6%;transform:translate(0,-50%);z-index:2}
#statGrid .stat-chip:nth-child(4){bottom:6px;left:50%;transform:translate(-50%,0);z-index:1}

#statGrid .stat-chip:hover{transform:translate(-50%,0) scale(1.01)}
#statGrid .stat-chip:nth-child(2):hover{transform:translate(0,-50%) scale(1.01)}
#statGrid .stat-chip:nth-child(3):hover{transform:translate(0,-50%) scale(1.01)}

@media (max-width:640px){
  #statGrid,.stat-grid{display:grid;height:auto;grid-template-columns:1fr;gap:16px;padding:0 16px;justify-items:center}
  #statGrid .stat-chip,.stat-grid .stat-chip{position:static!important;inset:auto!important;transform:none!important;z-index:auto!important;width:min(520px,100%);margin:0 auto}
  #statGrid.scatter .stat-chip,.stat-grid.scatter .stat-chip{position:static!important;inset:auto!important;transform:none!important}
}
@media (min-width:641px) and (max-width:1024px){
  #statGrid,.stat-grid{display:grid;height:auto;grid-template-columns:repeat(2,minmax(160px,1fr));gap:16px;padding:0 16px}
  #statGrid .stat-chip,.stat-grid .stat-chip{position:static!important;inset:auto!important;transform:none!important;z-index:auto!important;width:100%}
  #statGrid.scatter .stat-chip,.stat-grid.scatter .stat-chip{position:static!important}
}

.logo-badge{
  max-width: clamp(120px, 40vw, 220px);
  padding: 0 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 520px){
  .track{ gap: 18px; }
  .logo-badge{
    max-width: 64vw;
    font-size: 13px;
    padding: 0 12px;
    border-radius: 16px;
  }
}

#faq .faq-wrap.stagger>*{opacity:1;filter:none;transform:none}

