:root { color-scheme: light; --ink:#172033; --muted:#58647a; --line:#dce3ef; --blue:#075ee5; --soft:#f4f7fc; --card:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--blue); }
.site-header { border-bottom:1px solid var(--line); background:rgba(255,255,255,.96); }
.nav { max-width:1080px; margin:auto; padding:18px 24px; display:flex; gap:24px; align-items:center; flex-wrap:wrap; }
.brand { color:var(--ink); font-size:1.25rem; font-weight:750; text-decoration:none; margin-right:auto; }
.nav a:not(.brand) { color:var(--muted); text-decoration:none; font-weight:600; }
main { max-width:860px; margin:auto; padding:64px 24px 88px; }
.wide { max-width:1080px; }
.eyebrow { color:var(--blue); font-weight:750; text-transform:uppercase; letter-spacing:.08em; font-size:.78rem; }
h1 { font-size:clamp(2.25rem,6vw,4.5rem); line-height:1.04; letter-spacing:-.045em; margin:.25em 0; }
h2 { margin-top:2.4em; line-height:1.2; }
h3 { margin-top:1.8em; }
p,li { max-width:76ch; }
.lead { color:var(--muted); font-size:1.2rem; max-width:66ch; }
.meta,.note { background:var(--soft); border:1px solid var(--line); border-radius:16px; padding:18px 20px; }
.note { border-left:4px solid var(--blue); }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin:36px 0; }
.card { border:1px solid var(--line); border-radius:18px; padding:22px; color:inherit; text-decoration:none; background:var(--card); }
.card:hover { border-color:#9ebcf5; box-shadow:0 12px 34px rgba(26,60,120,.08); }
.card h2 { margin:0 0 8px; font-size:1.15rem; }
.card p { color:var(--muted); margin:0; }
table { width:100%; border-collapse:collapse; }
th,td { border-bottom:1px solid var(--line); padding:12px 8px; text-align:left; vertical-align:top; }
footer { border-top:1px solid var(--line); background:var(--soft); }
.footer-inner { max-width:1080px; margin:auto; padding:28px 24px; display:flex; gap:18px; flex-wrap:wrap; color:var(--muted); }
.footer-inner span { margin-right:auto; }
@media (max-width:650px) { main{padding-top:40px}.nav{gap:14px}.nav a:not(.brand){font-size:.92rem} }