:root { --bg:#0b1020; --panel:#141a30; --border:#222a44; --fg:#e8ecf5; --accent:#5b8cff; --muted:#9aa4bf; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--fg); line-height:1.5; }
.hero { text-align:center; padding:5rem 1.5rem 3rem; }
.brand { font-weight:700; letter-spacing:.08em; color:var(--accent); text-transform:uppercase; font-size:.85rem; }
.hero h1 { font-size:2.5rem; margin:1rem 0 .5rem; }
.hero .sub { color:var(--muted); font-size:1.15rem; max-width:640px; margin:0 auto; }
main { max-width:900px; margin:0 auto; padding:0 1.5rem 4rem; }
.features { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin:1rem 0 3rem; }
.feature { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:1.25rem; }
.feature h3 { margin:.25rem 0 .5rem; color:var(--accent); }
.feature p { color:var(--muted); margin:0; }
.capture { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:2rem; max-width:520px; margin:0 auto; }
.capture label { display:block; margin:.75rem 0 .35rem; font-weight:600; }
.capture input, .capture select { width:100%; padding:.7rem .8rem; border-radius:8px; border:1px solid #2c3455; background:#0d1428; color:var(--fg); font-size:1rem; }
.row { display:flex; gap:.5rem; align-items:flex-end; }
.row input { flex:1; }
button { background:var(--accent); color:#fff; border:0; border-radius:8px; padding:.75rem 1.1rem; font-weight:600; cursor:pointer; font-size:1rem; white-space:nowrap; }
button:hover { filter:brightness(1.08); }
footer { text-align:center; color:var(--muted); padding:2rem; font-size:.9rem; }
@media (max-width:640px){ .features{grid-template-columns:1fr;} .hero h1{font-size:2rem;} }