:root{
    --bg:#0f1021;
    --bg-2:#16173a;
    --card:#ffffff0d;
    --text:#e8e8ff;
    --muted:#bfc3ff;
    --brand:#5a31f4;
    --brand-2:#00d4a6;
    --light:#f4e7ff;
    --ink:#182033
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{color:var(--brand);text-decoration:none}
a.link{color:var(--brand-2)}
a:hover{opacity:.9}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.site-header{background:linear-gradient(90deg,rgba(90,49,244,.2),rgba(0,212,166,.2));backdrop-filter:saturate(120%) blur(6px);position:sticky;top:0;z-index:9}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 20px}
.brand{font-weight:800;color:#fff}
.main-nav a{color:var(--text);margin-left:18px;padding:8px 10px;border-radius:10px}
.main-nav a.active,.main-nav a:hover{background:var(--card)}
.hero{padding:56px 0}
.gradient{background:linear-gradient(135deg,#1a1b3c 0%,#0f1021 40%,#1b0c3a 100%)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.hero h1{font-size:clamp(28px,4vw,52px);line-height:1.1;margin:0 0 14px}
.lead{color:var(--muted);font-size:clamp(16px,1.6vw,20px)}
.hero-bullets{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.hero-bullets li{display:flex;gap:10px;align-items:flex-start}
.hero-bullets i{color:var(--brand-2);margin-top:3px}
.hero-visual .card{border:1px solid #ffffff24;background:var(--card);border-radius:18px;overflow:hidden;box-shadow:0 8px 40px #0006}
.stamp{position:absolute;transform:translate(10px,-20px);background:var(--brand);color:#fff;padding:8px 10px;border-radius:999px;font-weight:800;font-size:12px}
.bar{background:var(--bg-2);border-top:1px solid #ffffff0f;border-bottom:1px solid #ffffff0f}
.bar-grid{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:14px;align-items:center;padding:14px 0}
.i{color:var(--brand-2)}
.section{padding:56px 0}
.section.dark{background:#0b0c1c}
.section.alt{background:#111432}
h2{font-size:clamp(22px,2.6vw,34px);margin:0 0 14px}
h3{margin:0 0 8px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.visual-stack{position:relative}
.visual-stack .floating{position:absolute;right:-12px;bottom:-12px;width:52%;border:1px solid #ffffff1a;box-shadow:0 10px 30px #0007}
.rounded{border-radius:16px}
.shadow{box-shadow:0 8px 26px #0006}
.card{background:var(--card);border:1px solid #ffffff12;border-radius:16px;padding:20px}
.card.glass{background:linear-gradient(180deg,#ffffff14,#ffffff08);border:1px solid #ffffff1f}
.card.line{border-left:4px solid var(--brand);background:#0f1026}
.cards{display:grid;gap:18px}
.cards.two{grid-template-columns:1fr 1fr}
.cards.three{grid-template-columns:repeat(3,1fr)}
.icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#5a31f41a;color:var(--light);margin-bottom:8px}
.check{padding:0;margin:14px 0 0;list-style:none;display:grid;gap:8px}
.check li{position:relative;padding-left:26px}
.check li:before{content:"✓";position:absolute;left:0;top:0;color:var(--brand-2);font-weight:800}
.form{display:grid;gap:12px}
.lbl{font-weight:600}
.inp{background:#0b0c1c;color:#fff;border:1px solid #ffffff22;border-radius:12px;padding:12px 14px}
.inp:focus{outline:2px solid #5a31f455}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--muted)}
.btn{background:linear-gradient(90deg,var(--brand),var(--brand-2));color:#051018;border:0;border-radius:14px;padding:12px 18px;font-weight:800;cursor:pointer}
.btn:hover{filter:brightness(1.03)}
.page-hero{background:linear-gradient(135deg,#111432 0%,#0f1021 100%);padding:56px 0;border-bottom:1px solid #ffffff14}
.page-hero h1{margin:0 0 8px}
.legal{padding:40px 0}
.legal h2{margin-top:18px}
.center{text-align:center}
.site-footer{background:#0b0c1c;border-top:1px solid #ffffff12}
.foot-grid{display:grid;gap:12px;grid-template-columns:1.2fr 1fr .8fr;align-items:center;padding:20px 0}
.brand-mini{font-weight:800}
.links a{color:var(--text);margin-left:12px}
.links a:hover{color:var(--brand-2)}
@media (max-width:960px){
    .hero-grid,.two-col,.cards.two,.cards.three{grid-template-columns:1fr}
    .bar-grid{grid-template-columns:1fr 1fr}
    .visual-stack .floating{position:relative;right:0;bottom:0;width:100%;margin-top:12px}
    .foot-grid{grid-template-columns:1fr}
}