:root { color-scheme: light; --ink:#202923; --muted:#647168; --line:#cbd5c9; --paper:#f4f4e9; --accent:#667e5d; }
* { box-sizing:border-box; }
html { background:var(--paper); }
body { max-width:1200px; min-height:100vh; margin:0 auto; padding:0 5vw; color:var(--ink); font-family:Georgia,"Times New Roman",serif; display:flex; flex-direction:column; }
a { color:inherit; }
.masthead { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:2rem 0; border-bottom:1px solid var(--line); }
.brand { font-family:Arial,sans-serif; font-size:1.28rem; font-weight:700; letter-spacing:-.05em; text-decoration:none; }
.mark { margin-left:.3rem; color:var(--accent); font-size:.55rem; vertical-align:top; }
nav { display:flex; gap:1.6rem; font: .85rem Arial,sans-serif; }
nav a { text-decoration:none; color:var(--muted); }
nav a:hover, nav a[aria-current="page"] { color:var(--ink); text-decoration:underline; text-underline-offset:.35em; }
main { flex:1; }
.hero { padding:10vh 0 11vh; max-width:900px; }
.eyebrow, .number { color:var(--accent); font:700 .73rem Arial,sans-serif; letter-spacing:.18em; }
h1 { margin:1.4rem 0 1.5rem; font-size:clamp(3.7rem,9vw,8.5rem); letter-spacing:-.075em; line-height:.93; font-weight:400; }
h1 em { color:var(--accent); font-weight:400; }
.lead { max-width:37rem; font-size:clamp(1.18rem,2.3vw,1.65rem); line-height:1.5; color:#44524a; }
.text-link { display:inline-block; margin-top:1.25rem; font:700 .88rem Arial,sans-serif; text-decoration:none; border-bottom:1px solid var(--ink); padding-bottom:.4rem; }
.text-link:hover { color:var(--accent); border-color:var(--accent); }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:2.5rem; border-top:1px solid var(--line); padding:2.4rem 0 5rem; }
.cards article { max-width:20rem; }
h2 { font-size:1.5rem; font-weight:400; margin:1.2rem 0 .7rem; }
.cards p, .prose p { line-height:1.65; color:#4b594e; font-size:1.04rem; }
.page { padding:9vh 0 12vh; max-width:800px; }
.page h1 { font-size:clamp(3.2rem,7vw,6.4rem); }
.prose { margin:4rem 0 2rem; border-top:1px solid var(--line); }
.prose h2 { margin-top:2.5rem; }
footer { display:flex; justify-content:space-between; gap:1rem; border-top:1px solid var(--line); padding:1.6rem 0 2rem; color:var(--muted); font:.72rem Arial,sans-serif; letter-spacing:.02em; }
@media (max-width:700px) { .masthead { align-items:flex-start; flex-direction:column; gap:1.3rem; } .hero { padding:9vh 0; } .cards { grid-template-columns:1fr; gap:1.2rem; } .cards article { max-width:31rem; } footer { flex-direction:column; } }