:root { --ink:#1f2328; --muted:#5b636e; --bg:#faf8f5; --card:#fff; --line:#e7e2da; --accent:#6b4f2a; }
* { box-sizing:border-box; }
body { margin:0; font:17px/1.6 Georgia, "Times New Roman", serif; color:var(--ink); background:var(--bg); }
header, main, footer { max-width:860px; margin:0 auto; padding:24px 20px; }
header { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px; }
header a.brand { font-size:24px; color:var(--ink); text-decoration:none; letter-spacing:.5px; }
nav a { color:var(--muted); margin-left:18px; text-decoration:none; font:15px system-ui, sans-serif; }
nav a:hover { color:var(--accent); }
.hero { padding:40px 0 16px; }
.hero h1 { font-size:36px; line-height:1.2; margin:0 0 12px; }
.lead { color:var(--muted); max-width:580px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; margin:28px 0; }
.card { background:var(--card); border:1px solid var(--line); padding:20px; border-radius:6px; }
.card h3 { margin:0 0 6px; font-size:19px; }
.card p { margin:0; color:var(--muted); font-size:15px; }
table { border-collapse:collapse; width:100%; font:15px system-ui, sans-serif; margin:16px 0; }
td, th { border-bottom:1px solid var(--line); padding:8px 6px; text-align:left; }
a.btn { display:inline-block; background:var(--accent); color:#fff; padding:10px 18px; border-radius:4px;
        text-decoration:none; font:15px system-ui, sans-serif; }
footer { color:var(--muted); font:14px system-ui, sans-serif; border-top:1px solid var(--line); }
