:root{
  --blue:#0ea5e9; --indigo:#6366f1; --green:#22c55e;
  --slate:#0f172a; --slate-800:#1f2937; --fg:#e2e8f0; --muted:#94a3b8;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background:var(--slate);color:var(--fg);line-height:1.6}
a{color:inherit;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:24px}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;border:1px solid #334155;background:linear-gradient(135deg,var(--blue),var(--indigo));color:#fff;font-weight:700;box-shadow:0 8px 20px rgba(2,6,23,.3)}
.btn.secondary{background:#0b1324;border-color:#1f2937}
.btn:hover{transform:translateY(-1px)}
header.hero{position:relative;overflow:hidden;border-bottom:1px solid #1f2937;background:#0b1324}
header.hero .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;align-items:center}
header.hero h1{font-size:56px;line-height:1.1;margin:10px 0}
header.hero p{color:#cbd5e1;margin:12px 0 20px}
header.hero .art{display:flex;justify-content:center}
.card{background:#111827;border:1px solid #1f2937;border-radius:16px;padding:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
section h2{font-size:32px;margin:24px 0 12px}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid #334155;color:#e5e7eb;background:#0b1324;font-size:12px;margin-right:6px}
footer{padding:24px;color:#94a3b8;text-align:center;border-top:1px solid #1f2937;margin-top:40px}
@media (max-width:900px){
  header.hero .wrap{grid-template-columns:1fr}
  .grid3{grid-template-columns:1fr}
  header.hero h1{font-size:42px}
}
@media (prefers-reduced-motion:no-preference){
  .glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px circle at 80% 10%, rgba(34,197,94,.25), transparent 60%);filter:blur(10px)}
}