:root { color-scheme: light dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; background: #f5f6f3; color: #172018; }
* { box-sizing: border-box; }
body { margin: 0; }
main, footer { max-width: 980px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }
header { display: flex; align-items: center; justify-content: space-between; padding-top: 28px; }
a { color: inherit; text-underline-offset: 3px; }
.brand { font-size: 1.2rem; font-weight: 760; letter-spacing: -.04em; text-decoration: none; }
nav { display: flex; gap: 20px; font-size: .94rem; }
.hero { padding: 112px 0 72px; max-width: 760px; }
.eyebrow { color: #54745a; font-size: .82rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 14px 0 24px; font-size: clamp(2.5rem, 7vw, 5.7rem); line-height: .98; letter-spacing: -.065em; }
.lead { max-width: 620px; font-size: 1.18rem; line-height: 1.55; color: #435047; }
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; padding-bottom: 108px; }
article { border-top: 1px solid #b9c2ba; padding-top: 18px; }
h2 { font-size: 1rem; margin: 0 0 10px; }
article p, .page p { color: #526057; line-height: 1.55; }
.page { max-width: 700px; padding: 90px 0 108px; }
.page h1 { font-size: clamp(2.3rem, 5vw, 4.2rem); }
footer { border-top: 1px solid #d8ded8; padding-top: 24px; padding-bottom: 36px; color: #667269; font-size: .86rem; }
@media (max-width: 650px) { .grid { grid-template-columns: 1fr; } .hero { padding-top: 72px; } }
@media (prefers-color-scheme: dark) { :root { background: #172018; color: #edf3ed; } .lead, article p, .page p, footer { color: #bdc9be; } article { border-color: #526057; } footer { border-color: #344036; } .eyebrow { color: #9dc69f; } }
