:root {
  --bg:#070b16; --card:#121a2f; --text:#eef2ff; --muted:#9aa8c7;
  --accent:#244ee8; --accent2:#6b93ff; --line:rgba(255,255,255,.08);
  --ok:#3dd68c; --warn:#ffb020; --radius:18px; --shadow:0 24px 60px rgba(0,0,0,.4);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;color:var(--text);line-height:1.6;overflow-x:hidden;background:var(--bg)}
.bg-orb{position:fixed;border-radius:50%;filter:blur(80px);opacity:.35;pointer-events:none;z-index:0;animation:orb 12s ease-in-out infinite alternate}
.orb-a{width:420px;height:420px;background:#244ee8;top:-80px;left:-80px}
.orb-b{width:380px;height:380px;background:#0d3b66;bottom:10%;right:-100px;animation-delay:-4s}
@keyframes orb{from{transform:translate(0,0) scale(1)}to{transform:translate(40px,30px) scale(1.15)}}
a{color:var(--accent2);text-decoration:none} a:hover{text-decoration:underline}
.wrap{width:min(1120px,92vw);margin:0 auto;position:relative;z-index:1}
.top{position:sticky;top:0;z-index:30;backdrop-filter:blur(14px);background:rgba(7,11,22,.8);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 0}
.logo{color:var(--text);font-weight:800;text-decoration:none}
.logo span{color:var(--accent2)}.logo em{font-style:normal;font-weight:600;color:var(--muted);font-size:.78rem;margin-left:.35rem}
.nav nav{display:flex;flex-wrap:wrap;gap:.85rem}
.nav nav a{color:var(--muted);font-size:.88rem;text-decoration:none}
.nav nav a:hover{color:var(--text)}
.btn{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),#3d6dff);color:#fff!important;text-decoration:none!important;border:0;border-radius:999px;padding:.85rem 1.25rem;font-weight:700;box-shadow:var(--shadow);transition:transform .2s ease,filter .2s}
.btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
.btn-ghost{background:transparent;border:1px solid var(--line);box-shadow:none;color:var(--text)!important}
.btn-sm{padding:.5rem .95rem;font-size:.88rem}
.pulse-btn{animation:pulseGlow 2.2s ease-in-out infinite}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(36,78,232,.55)}70%{box-shadow:0 0 0 14px rgba(36,78,232,0)}}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:2.2rem;align-items:center;padding:3.2rem 0 2.2rem}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--accent2);font-weight:800;margin:0 0 .7rem}
.hero h1{font-size:clamp(1.85rem,4vw,2.9rem);line-height:1.12;margin:0 0 1rem}
.grad{background:linear-gradient(90deg,#6b93ff,#a5c0ff,#6b93ff);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 4s linear infinite}
@keyframes shine{to{background-position:200% center}}
.lede{color:var(--muted);font-size:1.05rem;margin:0 0 1.3rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1rem}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}
.pill-row li{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:999px;padding:.35rem .75rem;font-size:.85rem;color:var(--muted)}
.float-delay{animation:floaty 4s ease-in-out infinite}.float-delay2{animation:floaty 4s ease-in-out .4s infinite}.float-delay3{animation:floaty 4s ease-in-out .8s infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hero-visual{text-align:center}
.hero-frame{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-img{display:block;width:100%;height:auto;vertical-align:middle}
.scan-line{position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,#6b93ff,transparent);animation:scan 2.8s linear infinite;opacity:.85}
@keyframes scan{0%{top:8%}100%{top:92%}}
.panel-cap{color:var(--muted);font-size:.88rem;margin:.75rem 0 0}
.band{background:rgba(255,255,255,.02);border-block:1px solid var(--line)}
.section{padding:3.2rem 0}.section.tight{padding:2rem 0}
.section h2{font-size:1.75rem;margin:0 0 .85rem}
.lead{color:var(--muted);font-size:1.05rem;max-width:70ch}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.4rem 0}
.card,.price-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem 1.35rem}
.card h3{margin:0 0 .55rem}.card p,.price-card li{color:var(--muted)}
.hover-lift{transition:transform .25s ease,box-shadow .25s}.hover-lift:hover,.hover-lift.in{transform:translateY(-4px);box-shadow:var(--shadow)}
.fade-up{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.fade-up.in,.fade-up.delay.in{opacity:1;transform:none}
.fade-up.delay{transition-delay:.15s}
.steps{color:var(--muted)}.steps.big{font-size:1.05rem}.steps li{margin-bottom:.9rem}.steps strong{color:var(--text)}
.demo-banner{border-color:rgba(255,176,32,.35)!important;background:rgba(255,176,32,.06)!important}
.demo-tag{margin:0 0 1rem;color:#ffb020;font-weight:800;font-size:.85rem;letter-spacing:.04em;text-align:center}
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.stat{text-align:center;background:var(--card);border:1px dashed rgba(255,176,32,.45);border-radius:var(--radius);padding:1.2rem;opacity:0;transform:scale(.96);transition:.5s ease}
.stat.in,.stat.pop.in{opacity:1;transform:scale(1)}
.stat-num{font-size:2.2rem;font-weight:800;margin:0}
.stat-label{margin:.35rem 0 0;color:var(--muted)}.stat-label span{color:#ffb020;font-size:.8rem}
.demo-pill{display:inline-block;background:rgba(255,176,32,.15);color:#ffb020;font-size:.72rem;font-weight:800;padding:.2rem .55rem;border-radius:999px;margin:0 0 .5rem}
.stories{display:flex;flex-direction:column;gap:1rem;margin-top:1.2rem}
.story-card{display:grid;grid-template-columns:120px 1fr;gap:1.1rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.25rem}
.story-card img{width:120px;height:120px;object-fit:cover;border-radius:50%;border:2px solid rgba(255,176,32,.4)}
.story-card h3{margin:0 0 .4rem;font-size:1.05rem}.story-card p{margin:0;color:var(--muted)}
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.4rem}
.price-card{display:flex;flex-direction:column;position:relative}
.price-card ul{padding-left:1.1rem;flex:1}
.price-card .btn{width:100%;margin-top:1rem}
.price{font-size:2.35rem;font-weight:800;margin:.35rem 0 1rem}
.featured{border-color:rgba(107,147,255,.5);box-shadow:0 0 0 1px rgba(107,147,255,.2),var(--shadow);transform:translateY(-4px)}
.badge{position:absolute;top:-10px;right:14px;margin:0;background:var(--ok);color:#062416;font-size:.72rem;font-weight:800;padding:.25rem .55rem;border-radius:999px}
.section-sub{color:var(--muted);margin-top:-.4rem}
details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;margin-bottom:.55rem}
summary{cursor:pointer;font-weight:700} details p{color:var(--muted);margin:.7rem 0 0}
.fine{color:var(--muted);font-size:.88rem}.fine.center{text-align:center}
code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85em;background:rgba(255,255,255,.06);padding:.1em .35em;border-radius:6px}
.foot{border-top:1px solid var(--line);padding:2rem 0 3rem;color:var(--muted);font-size:.9rem;position:relative;z-index:1}
@media(max-width:960px){
  .nav nav{display:none}
  .hero,.grid3,.pricing{grid-template-columns:1fr}
  .featured{transform:none}
  .stats-row{grid-template-columns:1fr}
  .story-card{grid-template-columns:1fr;justify-items:center;text-align:center}
}

.demo-pill.use{background:rgba(61,214,140,.15);color:var(--ok);}