/* Reset, typography, focus, skip-link, reduced-motion. Shared by every page. */

* { box-sizing: border-box; }
body { overflow-x: hidden; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: "DM Sans", Arial, sans-serif; font-size: 15px; line-height: 1.5; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
.skip-link { position: absolute; z-index: 99; top: -80px; left: 20px; padding: 10px 16px; color: var(--white); background: var(--green-dark); border-radius: 6px; }
.skip-link:focus { top: 12px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* Section eyebrow: shared by the homepage, route pages and the 404. */
.eyebrow { margin: 0 0 12px; color: var(--green); font-size: 10px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.eyebrow.light { color: var(--yellow); }
.eyebrow span { display: inline-block; width: 23px; height: 2px; margin: 0 8px 3px 0; background: currentColor; }