:root{
  --text:#eef1fb; --muted:#b9c1d9; --muted2:#9aa3c2;
  --bg1:#0b0e1c; --bg2:#0a0d18;
  --card:rgba(18,22,40,.86); --card2:rgba(16,20,36,.78);
  --border:#2a2f46;
  --accent1:#6aa9ff; --accent2:#8b6aff;
  --radius:22px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;line-height:1.7;
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(136,106,255,.25), transparent 60%),
    radial-gradient(1000px 500px at 100% 0%, rgba(106,169,255,.18), transparent 60%),
    linear-gradient(180deg,var(--bg1),var(--bg2) 60%, #090c16);}
.container{max-width:1080px;margin:0 auto;padding:28px 20px}
.nav{display:flex;align-items:center;justify-content:space-between;background:var(--card2);border:1px solid var(--border);
  border-radius:16px;padding:10px 16px}
.brand{display:flex;gap:12px;align-items:center}
.brand img{width:38px;height:38px}
.brand .title{font-weight:900;letter-spacing:.6px}
.nav a{color:var(--muted);margin-left:16px;text-decoration:none}
.nav a:hover{color:#fff}
.hero{margin-top:16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:40px 30px;
  box-shadow:0 28px 70px rgba(0,0,0,.45)}
.badge{display:inline-block;background:#1b2142;border:1px solid var(--border);color:#dbe0ff;border-radius:999px;padding:6px 12px;font-size:12px}
h1{font-size:clamp(30px,5.4vw,56px);margin:16px 0 10px;letter-spacing:.9px;text-transform:uppercase}
.lead{color:var(--muted);max-width:760px}
.cta{margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}
.button{display:inline-block;background:linear-gradient(135deg,var(--accent1),var(--accent2));color:#fff;padding:12px 18px;border-radius:14px;
  font-weight:800;text-decoration:none}
.button.secondary{background:#1f2546;border:1px solid var(--border)}
.section{margin:24px 0}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--card2);border:1px solid var(--border);border-radius:16px;padding:18px}
footer{margin:40px 0 12px;color:var(--muted2);text-align:center}
.main{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:22px}
.main h2{text-transform:uppercase;letter-spacing:.5px}
ul{margin-top:0}
.small{color:var(--muted2);font-size:13px}