/* Base: reset, typography, layout primitives. Uses tokens only. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; interpolate-size: allow-keywords; }
body { margin: 0; background: var(--paper); color: var(--ink-text); font-family: var(--font-body); font-size: var(--fs-base); line-height: var(--lh-body); -webkit-tap-highlight-color: transparent; overflow-x: clip; }
h1, h2, h3, p, ul, ol, dl, figure { margin: 0; }
h1, h2, h3 { font-family: var(--font-heading); font-weight: 900; line-height: var(--lh-tight); letter-spacing: var(--track-tight); text-wrap: balance; }
p { text-wrap: pretty; }
img, video, svg { display: block; max-width: 100%; }
img, video { height: auto; }
a { color: inherit; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
:focus-visible { outline: 3px solid var(--focus-light); outline-offset: 3px; }
.on-dark :focus-visible, .site-header :focus-visible, .site-footer :focus-visible, .sticky-cta :focus-visible { outline-color: var(--focus); }
.container { max-width: var(--container); margin: 0 auto; padding-inline: var(--gutter); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: var(--sp-2); top: -4rem; background: var(--accent); color: var(--on-accent); padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-s); z-index: 100; font-weight: 700; }
.skip:focus { top: var(--sp-2); }