:root { color-scheme: light dark; font-family: ui-sans-serif, system-ui, sans-serif; background: #faf7f4; color: #262a30; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 2rem; }
main { width: min(100%, 42rem); border-top: 3px solid #c45e36; padding: 2.5rem 0; }
.eyebrow { color: #8b3b1f; font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
h1 { font-family: ui-serif, Georgia, serif; font-size: clamp(3rem, 10vw, 6rem); line-height: 1; letter-spacing: -.04em; margin: 1.5rem 0; }
p { max-width: 34rem; line-height: 1.6; }
a { color: #8b3b1f; text-underline-offset: .2em; }
.intro { font-size: clamp(1.25rem, 3vw, 1.65rem); }
@media (prefers-color-scheme: dark) { :root { background: #30343a; color: #f8f5f1; } .eyebrow, a { color: #ed986f; } main { border-color: #ed986f; } }