*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header) + 1rem); overflow-x: clip; }
body { margin: 0; min-width: 20rem; background: var(--ivory); color: var(--charcoal); font: 400 var(--step-0)/1.68 var(--font-body); text-rendering: optimizeLegibility; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .2em; }
h1, h2, h3, p, ul, ol { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); line-height: .99; letter-spacing: -.047em; }
h1 { font-size: var(--step-5); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-1); }
p { max-width: 64ch; }
ul, ol { padding-left: 1.25rem; }
::selection { background: var(--pistachio); color: var(--forest-1000); }
.skip-link { position: fixed; left: 1rem; top: -6rem; z-index: 100; padding: .8rem 1.1rem; background: var(--paper); color: var(--forest-900); border-radius: var(--radius-sm); box-shadow: var(--shadow-soft); }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
