:root{--bg:#0b0f14;--card:#111922;--text:#e5e7eb;--muted:#94a3b8;--primary:#7c3aed;--primary-dark:#6d28d9;--accent:#22d3ee}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{color:var(--accent);text-decoration:none}
.container{width:min(1100px,92%);margin:0 auto}
header{background:var(--card);border-bottom:1px solid #1f2937;position:sticky;top:0}
.nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.logo{font-weight:800;color:#fff}
.nav-links{display:flex;gap:1.25rem}
.hero{padding:4rem 0;text-align:center;background:linear-gradient(180deg,#0b0f14,#0f172a)}
.hero h1{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:.5rem}
.hero p{color:var(--muted);max-width:700px;margin:0 auto 1.5rem}
.btn{display:inline-block;background:var(--primary);color:#fff;padding:.75rem 1.25rem;border-radius:.5rem;font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin:2rem 0}
.card{background:var(--card);border:1px solid #1f2937;border-radius:1rem;padding:1rem}
section{padding:3rem 0}
footer{background:var(--card);padding:2rem 0;margin-top:3rem;text-align:center;color:var(--muted)}