:root{
  --bg:#f7f7fb; --ink:#0c0f1a; --muted:#6d7190;
  --card:#0f1328f2; --stroke:#e9e9f2;
  --violet:#7c3aed; --fuchsia:#c026d3; --cyan:#22d3ee; --ring: rgba(124,58,237,.35);
  --max:1200px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial;line-height:1.5}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}

/* Header */
.header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.7);backdrop-filter:blur(12px);border-bottom:1px solid var(--stroke)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900}
.brand-text{background:linear-gradient(90deg,#6b4eff,#d56bff,#5fd3ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.logo{width:34px;height:34px}
.nav{display:flex;gap:18px;align-items:center}
.nav a{color:#2b2e42;opacity:.85}
.nav a:hover{opacity:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;padding:12px 18px;font-weight:800;border:1px solid var(--stroke);background:#fff;box-shadow:0 12px 28px -16px rgba(0,0,0,.18)}
.btn.primary{background:linear-gradient(90deg,var(--violet),var(--fuchsia));color:#fff;border:none;box-shadow:0 18px 40px -16px var(--ring)}
.btn.ghost{background:#ffffff80;border-color:#ffffff80}
.btn.ghost:hover{background:#fff}

/* Hero */
.hero{position:relative;overflow:hidden;padding:64px 0 32px;background:radial-gradient(900px 500px at -10% -20%, #ffffff 0%, #f4f7ff 50%, transparent 60%)}
.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center}
.kicker{color:#6b4eff;font-weight:800;letter-spacing:.06em;font-size:12px;text-transform:uppercase}
h1{font-size: clamp(42px, 5vw, 60px);line-height:1.05;margin:8px 0 12px}
.sub{color:var(--muted);font-size:18px;max-width:60ch}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.badges{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.badges span{border:1px solid var(--stroke);padding:8px 12px;border-radius:999px;color:#39406b;background:#fff}

.hero-art{position:relative;height:520px;border-radius:20px;overflow:hidden;border:1px solid var(--stroke);box-shadow:0 18px 60px -30px rgba(0,0,0,.35)}
.hero-art .layer{position:absolute;inset:0}
.hero-art .art-img{position:absolute;inset:auto 0 0 0;height:110%;width:100%;object-fit:cover;transform:translateY(0) scale(1.02);filter:saturate(110%) contrast(103%)}
.blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;mix-blend-mode:multiply;animation:float 10s ease-in-out infinite}
.blob.a{width:420px;height:420px;right:-120px;top:-120px;background:radial-gradient(circle at 30% 30%, rgba(123,86,255,.45), transparent 70%)}
.blob.b{width:380px;height:380px;left:-140px;bottom:-120px;background:radial-gradient(circle at 70% 70%, rgba(34,211,238,.35), transparent 70%)}
@keyframes float{0%{transform:translate(0,0)}50%{transform:translate(12px,-14px)}100%{transform:translate(0,0)}}

/* Sections */
.section{padding:56px 0}
h2{font-size: clamp(28px, 3vw, 40px);margin:6px 0 8px}
.lead{color:var(--muted);max-width:60ch}

/* Dark cards */
.darkcard{
  border:1px solid rgba(17,22,58,.18);
  background: linear-gradient(180deg, rgba(15,19,40,.98), rgba(17,22,58,.92));
  color:#eef1ff;
  border-radius:18px;
  box-shadow: 0 20px 60px -30px rgba(17,22,58,.75);
}
.darkcard .muted{color:#c5c9ff}

/* Features */
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{padding:18px}
.card .icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#a855f72a;color:#f0abfc;border:1px solid rgba(255,255,255,.12)}

/* Testimonials */
.tgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.quote{padding:18px}

/* CTA band */
.cta-inner{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;padding:22px}

/* FAQ */
.qa{padding:14px 16px}
.qa summary{cursor:pointer;font-weight:800}

/* Footer */
footer{padding:28px 0 80px;color:#3e4380}

/* Sticky mobile CTA */
.sticky-cta{position:fixed;left:0;right:0;bottom:14px;display:none;z-index:70;justify-content:center}
.sticky-cta .btn{border-radius:999px;padding:14px 22px}

/* Reveal */
.reveal{opacity:0;transform:translateY(14px);transition:.6s cubic-bezier(.22,1,.36,1)}
.show{opacity:1;transform:none}

/* Responsive */
@media (max-width: 980px){
  .hero-inner{grid-template-columns:1fr}
  .hero-art{height:360px;margin-top:10px}
  .grid3,.tgrid{grid-template-columns:1fr}
  .sticky-cta{display:flex}
}