* { box-sizing: border-box; }
body { margin: 0; background: #faf9f6; color: #262626; font: 16px/1.75 system-ui, sans-serif; overflow-wrap: break-word; }
header, main, footer { max-width: 820px; margin: auto; padding: 24px; }
header { border-bottom: 1px solid #ddd8cf; font-size: 22px; font-weight: 700; }
main { padding-top: 36px; padding-bottom: 48px; }
h1 { font-size: clamp(30px, 6vw, 42px); line-height: 1.2; margin-top: 0; }
h2 { font-size: 22px; line-height: 1.4; margin-top: 36px; }
p, ul { margin: 16px 0; }
ul { padding-left: 24px; }
a { color: #663c35; text-underline-offset: 3px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
footer { border-top: 1px solid #ddd8cf; display: flex; flex-wrap: wrap; gap: 12px 24px; padding-bottom: 36px; }