:root{
  --bg:#0b1220; --bg-soft:#0e1627; --card:#101a2e; --muted:#a7b3c6; --text:#e8eef7;
  --primary:#5e9bff; --accent:#8b5cf6; --ok:#22c55e; --warn:#f59e0b; --danger:#ef4444;
  --radius:16px; --radius-sm:12px; --shadow:0 20px 40px rgba(0,0,0,.35);
  --max:1120px;
}
*{box-sizing:border-box} html,body{height:100%}
body{
  margin:0; font:16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  color:var(--text); background: radial-gradient(1200px 600px at 80% -10%, #1b2a47 0%, transparent 60%) , var(--bg);
}
a{color:var(--primary); text-decoration:none} a:hover{text-decoration:underline}
.container{max-width:var(--max); margin:0 auto; padding:24px}
.hero{padding:56px 0}
.h-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:28px}
@media(max-width:920px){ .h-grid{grid-template-columns:1fr;}}
h1{font-size:44px; line-height:1.1; margin:0 0 12px}
.lead{color:var(--muted); font-size:18px; margin:0 0 20px}
.badge{display:inline-block; padding:6px 10px; border-radius:999px; background:#0d1a31; color:#9fb4d3; font-weight:600; font-size:12px; border:1px solid #12213b}
.btn{display:inline-block; padding:12px 18px; border-radius:12px; background:linear-gradient(90deg,var(--primary),#7aa8ff); color:#031127; font-weight:700; border:none; box-shadow:var(--shadow)}
.btn.secondary{background:#17243d; color:#d2dff1; border:1px solid #243553}
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media(max-width:920px){ .cards{grid-template-columns:1fr;}}
.card{background:var(--card); border:1px solid #162642; border-radius:var(--radius); padding:20px; box-shadow:var(--shadow)}
.card h3{margin:0 0 6px}
.card p{margin:0; color:#c1ccdc}
.kv{background:linear-gradient(180deg,#0f1a31, #0b1425); border:1px solid #1a2b4a; border-radius:var(--radius); padding:18px}
.kv ul{margin:10px 0 0 18px}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
@media(max-width:920px){ .grid-4{grid-template-columns:1fr 1fr} }
@media(max-width:640px){ .grid-4{grid-template-columns:1fr} }
.small{font-size:13px; color:#aab7c9}
.footer{padding:36px 0; color:#96a7be}
.form{background:var(--bg-soft); border:1px solid #1c2b49; border-radius:var(--radius); padding:22px}
.form .row{display:grid; grid-template-columns:1fr 1fr; gap:16px}
@media(max-width:920px){ .form .row{grid-template-columns:1fr} }
.label{font-weight:600; margin-bottom:6px; color:#cfe0f7}
.input, select, textarea{
  width:100%; padding:12px 14px; border-radius:12px; background:#0c162a; border:1px solid #223555; color:#dbe6f6;
}
.help{color:#8ea0bb; font-size:12px}
.pill{display:inline-flex; align-items:center; gap:8px; border:1px solid #233a61; background:#0f1c33; color:#cfe0f7; border-radius:999px; padding:8px 12px}
.tabbar{display:flex; gap:8px; flex-wrap:wrap}
.pick{display:inline-block; margin-top:10px}
.banner{margin:14px 0; padding:10px 14px; background:#0f1d34; border:1px dashed #284067; border-radius:12px}
.faq details{background:#0f1a2f; border:1px solid #20365c; border-radius:12px; padding:14px; margin:10px 0}
.faq summary{cursor:pointer; font-weight:700}
.sticky-top{position:sticky; top:0; backdrop-filter:saturate(120%) blur(8px); background:rgba(11,18,32,.75); border-bottom:1px solid #172646;}
.nav{display:flex; align-items:center; justify-content:space-between; gap:18px; padding:10px 0}
.nav .brand{display:flex; align-items:center; gap:10px; font-weight:800}
.warn{color:#f6c86a}