:root{
  --bg:#0b1020;          /* page background */
  --bg-soft:#0f1630;     /* section background */
  --card:#121a3a;        /* card background */
  --text:#e8ecf8;        /* primary text */
  --muted:#a9b1c7;       /* muted text */
  --brand:#5dd1ff;       /* brand accent */
  --brand-2:#7cffb2;     /* secondary accent */
  --ring:rgba(93,209,255,.45);
  --shadow: 0 10px 30px rgba(8,12,40,.35);
  --radius: 18px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:radial-gradient(1200px 800px at 80% -10%, rgba(124,255,178,.08), transparent 60%),
  radial-gradient(900px 600px at -10% 10%, rgba(93,209,255,.08), transparent 60%), var(--bg);
  color:var(--text); font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  line-height:1.55;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.container{width:min(1200px, 92%); margin-inline:auto}
.pill{display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .7rem; border-radius:999px; border:1px solid rgba(255,255,255,.12); color:var(--muted); font-size:.82rem; background:rgba(255,255,255,.04)}
.btn{display:inline-flex; align-items:center; gap:.6rem; padding:.9rem 1.15rem; border-radius:12px; font-weight:600; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.08); transition:transform .15s ease, box-shadow .15s ease, background .15s ease}
.btn-primary{background:linear-gradient(135deg,var(--brand),#3aa3ff); color:#00142a}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.06); color:var(--text)}
.btn-ghost:hover{background:rgba(255,255,255,.1)}
/* Header */
header{position:sticky; top:0; z-index:50; backdrop-filter: blur(10px); background:linear-gradient(to bottom, rgba(11,16,32,.9), rgba(11,16,32,.6)); border-bottom:1px solid rgba(255,255,255,.06)}
.nav{display:flex; align-items:center; justify-content:space-between; padding:12px 0}
.logo{display:flex; align-items:center; gap:.7rem; font-weight:800}
.logo-mark{width:36px; height:36px; border-radius:10px; background:conic-gradient(from 120deg, var(--brand), var(--brand-2)); box-shadow:0 0 0 3px rgba(93,209,255,.15)}
.nav-links{display:flex; gap:1.2rem; align-items:center}
.nav-links a{color:var(--muted); font-weight:600; padding:.4rem .6rem; border-radius:10px}
.nav-links a:hover{background:rgba(255,255,255,.06); color:var(--text)}
.mobile-toggle{display:none}

/* Section */
.section{padding:72px 0}

/* Footer */
footer{padding:40px 0; border-top:1px solid rgba(255,255,255,.08); color:var(--muted)}
.copyright{border-top:1px solid rgba(255,255,255,.08); margin-top:22px; padding-top:18px; font-size:.9rem}

/* Responsive */
@media (max-width: 980px){
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width: 560px){
  .nav-links{display:none}
  .mobile-toggle{display:inline-flex; gap:.5rem; align-items:center; cursor:pointer; color:var(--muted)}
  .fgrid{grid-template-columns:1fr}
}