:root { --bg:#0b0f16; --fg:#f1f5ff; --muted:#9fb0d0; --card:#141c2b; --brand:#77a7ff; --line:#23314d; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,system-ui,Arial,sans-serif; background:var(--bg); color:var(--fg); }
.wrap { width:min(1050px,92%); margin:0 auto; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); }
.brand { font-weight:700; }
nav a { color:var(--muted); margin-left:16px; text-decoration:none; }
.hero { padding:64px 0 28px; }
.eyebrow { color:var(--brand); font-weight:600; }
h1 { font-size:clamp(2rem,4.5vw,3.2rem); line-height:1.1; max-width:850px; }
.sub { color:var(--muted); max-width:760px; }
.cta-row { margin-top:18px; display:flex; gap:12px; }
.btn { display:inline-block; background:var(--brand); color:#081127; padding:11px 16px; border-radius:10px; text-decoration:none; font-weight:700; border:0; cursor:pointer; }
.btn.ghost { background:transparent; color:var(--fg); border:1px solid var(--line); }
.section { padding:34px 0; }
.grid { display:grid; gap:14px; }
.grid.three { grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }
article, .card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px; }
.featured { outline:2px solid var(--brand); }
.price { font-size:1.3rem; font-weight:700; color:var(--brand); }
ol { color:var(--muted); line-height:1.8; }
.form { display:grid; gap:10px; max-width:640px; }
label { display:grid; gap:6px; color:var(--muted); }
input, textarea, select { background:#0f1726; color:var(--fg); border:1px solid var(--line); border-radius:9px; padding:10px; }
.note { color:var(--muted); margin-top:10px; }
.footer { border-top:1px solid var(--line); padding:22px 0 36px; color:var(--muted); margin-top:30px; }