/* style.css */
:root { --fg:#0f172a; --muted:#475569; --bg:#ffffff; --card:#f8fafc; --line:#e2e8f0; }
*{ box-sizing:border-box; }
body{ margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; color:var(--fg); background:var(--bg); }
.wrap{ max-width: 980px; margin:0 auto; padding:18px 16px; }
header{ display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); position:sticky; top:0; background:rgba(255,255,255,.9); backdrop-filter: blur(8px); }
.brand{ font-weight:800; letter-spacing:.2px; }
nav a{ margin-left:14px; color:var(--muted); text-decoration:none; font-weight:600; }
nav a:hover{ color:var(--fg); }
.hero{ padding:30px 0; }
h1{ font-size: 38px; line-height:1.1; margin:0 0 12px; }
p{ color:var(--muted); font-size: 16px; line-height:1.6; }
.card{ background:var(--card); border:1px solid var(--line); border-radius:16px; padding:18px; margin:14px 0; }
.btn{ display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid var(--line); text-decoration:none; font-weight:700; }
.ctaRow{ display:flex; align-items:center; gap:12px; }
.muted{ color:var(--muted); font-size: 14px; }
.footer{ border-top:1px solid var(--line); display:flex; gap:14px; align-items:center; justify-content:space-between; flex-wrap:wrap; }