:root { color-scheme: light dark; font: 17px/1.65 system-ui, sans-serif; color: #202c36; background: #f4f5ef; }
body { margin: 0; }
main { max-width: 760px; margin: 12vh auto; padding: 0 24px; }
.label { font-size: 12px; font-weight: 650; letter-spacing: .18em; color: #647564; }
h1 { font-size: clamp(38px, 7vw, 68px); line-height: 1.08; letter-spacing: -.04em; margin: 28px 0; }
p { max-width: 600px; }
nav { display: flex; flex-wrap: wrap; gap: 12px 24px; margin: 32px 0; }
a { color: inherit; text-underline-offset: 5px; }
footer { border-top: 1px solid #bfc8be; margin-top: 72px; padding-top: 20px; font-size: 14px; color: #647564; }
@media (prefers-color-scheme: dark) { :root { color: #e8ede5; background: #18211d; } .label, footer { color: #acbcaa; } footer { border-color: #425247; } }