:root { color-scheme:light; --paper:#f7f2e8; --deep:#eee4cf; --ink:#1d1b18; --metric:#175cdb; --proof:#df382d; --linked:#57bd22; --line:#d8cdbb; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:radial-gradient(circle at 78% 4%,#fff 0,transparent 28rem),linear-gradient(180deg,#faf7f0,var(--paper)); font:17px/1.62 ui-rounded,"SF Pro Rounded",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--metric); text-underline-offset:3px; }
header,main,footer { width:min(940px,calc(100% - 40px)); margin:auto; }
header { padding:54px 0 34px; }
nav { display:flex; flex-wrap:wrap; gap:24px; margin-bottom:62px; font-weight:760; }
nav a { color:var(--ink); text-decoration:none; }
.mark { width:82px; height:82px; display:grid; place-items:center; border:1px solid #fff; border-radius:22px; background:#fffdf8; box-shadow:0 13px 30px #28201622,0 2px 7px #28201618; }
.mark span { color:var(--metric); font:58px/1 Georgia,serif; }
.eyebrow,.number { color:var(--metric); font:800 .8rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.14em; }
h1 { max-width:850px; margin:24px 0; font:800 clamp(3rem,9vw,6.6rem)/.94 ui-rounded,"SF Pro Rounded",system-ui,sans-serif; letter-spacing:-.06em; }
h2 { margin:10px 0; font-size:1.85rem; line-height:1.15; letter-spacing:-.035em; }
.lede { max-width:760px; font-size:1.32rem; color:#534c43; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; }
.grid section,.card { border:1px solid #fff; border-radius:24px; background:#fffdf8d9; box-shadow:0 14px 34px #28201618,0 2px 7px #28201610; }
.grid section { min-height:238px; padding:24px; border-top:4px solid var(--metric); }
.grid section:nth-child(2) { border-top-color:var(--linked); }
.grid section:nth-child(3) { border-top-color:var(--proof); }
.grid section:nth-child(4) { border-top-color:var(--ink); }
.card { margin:26px 0; padding:32px; }
.legal { max-width:780px; }
.legal h2 { margin-top:34px; }
footer { padding:58px 0; color:#625a50; border-top:1px solid var(--line); margin-top:58px; }
@media (max-width:520px) { header { padding-top:34px; } nav { margin-bottom:42px; } .grid section { min-height:0; } .card { padding:24px; } }
@media (prefers-reduced-motion:no-preference) { a { transition:color .15s ease; } a:hover { color:var(--proof); } }
