:root { --bg:#0b1220; --panel:#0f1623; --ink:#e5e7eb; --muted:#9aa3b2; --accent:#8b5cf6; --accent2:#22d3ee; }
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,"Apple Color Emoji","Segoe UI Emoji";}
a{color:var(--accent2);text-decoration:none} a:hover{text-decoration:underline}
header{background:transparent;border-bottom:1px solid #1d2738}
.nav{width:min(1100px,92vw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.9rem .25rem;}
.brand{font-weight:800;letter-spacing:.3px}
nav a{color:var(--ink);opacity:.9;margin-left:1rem}
.container{width:min(1100px,92vw);margin:0 auto;padding:1.25rem;}
.hero{display:grid;gap:1rem;padding:2rem 0}
.cta{display:flex;gap:.75rem;flex-wrap:wrap}
.btn{cursor:pointer;display:inline-block;padding:.7rem 1rem;border-radius:12px;border:none;font-weight:700}
.btn.primary{background:var(--accent);color:#0b0f14}
.btn.secondary{background:transparent;color:var(--ink);border:1px solid #243041}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.card{background:var(--panel);border:1px solid #1f2a3b;border-radius:14px;padding:1rem}
.card h3{margin:.25rem 0 .4rem;font-size:1rem}
.card p{margin:.25rem 0 .5rem;color:var(--muted);font-size:.95rem}
footer{border-top:1px solid #1d2738;margin-top:2rem}
footer .row{width:min(1100px,92vw);margin:0 auto;padding:1rem .25rem;color:var(--muted);font-size:.9rem}
input, textarea{width:100%;padding:.7rem .8rem;border-radius:10px;border:1px solid #243041;background:#0f1623;color:var(--ink)}
label{font-size:.95rem;opacity:.9}
form .row{display:grid;gap:1rem;grid-template-columns:1fr 1fr}
form .row > div{display:grid;gap:.35rem}
small.hint{color:var(--muted)}
.badge{display:inline-block;background:#192234;border:1px solid #243041;color:#a9b4c4;padding:.2rem .5rem;border-radius:999px;font-size:.8rem}