*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: 400 var(--fs-body)/1.6 var(--font-text); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 500; margin: 0; text-wrap: balance; }
h1 { font-size: var(--fs-h1); line-height: 1.04; letter-spacing: -0.02em; font-weight: 600; }
h2 { font-size: var(--fs-h2); line-height: 1.1; letter-spacing: -0.01em; }
h3 { font-size: var(--fs-h3); line-height: 1.2; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: var(--link); text-underline-offset: 3px; }
button, input, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
small, .small { font-size: var(--fs-small); }
.lead { font-size: 1.1875rem; line-height: 1.55; color: var(--text-muted); max-width: 52ch; }
.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
.section { padding: var(--section-y) 0; }
.section--alt { background: var(--bg-alt); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 12px; top: -80px; z-index: 100; background: var(--text); color: var(--text-inverse); padding: 10px 16px; border-radius: var(--r-btn); }
.skip-link:focus { top: 12px; }
.icon { width: 20px; height: 20px; flex: none; }
.icon--natural { color: var(--accent-natural); }

:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 28px; border: 2px solid var(--btn-bg); border-radius: var(--r-btn); background: var(--btn-bg); color: var(--btn-text); font-weight: 600; font-size: 1rem; text-decoration: none; transition: background-color .15s, border-color .15s, color .15s; }
.btn:hover { background: var(--btn-bg-hover); border-color: var(--btn-bg-hover); }
.btn--sm { min-height: 44px; padding: 0 22px; font-size: 0.9375rem; }
.btn--block { width: 100%; }
.btn--secondary { background: transparent; color: var(--action); }
.btn--secondary:hover { background: var(--bg-alt); color: var(--action-hover); border-color: var(--action-hover); }
.btn[disabled] { opacity: .7; cursor: progress; }
.link-underline { color: var(--link); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1.5px; display: inline-flex; align-items: center; min-height: 44px; }
.link-underline:hover { text-decoration-thickness: 2.5px; }
.link-btn { background: none; border: 0; padding: 0 8px; min-height: 44px; color: var(--link); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.btn--text { background: transparent; border-color: transparent; color: var(--link); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.btn--text:hover { background: var(--bg-alt); border-color: transparent; color: var(--link); }
.icon-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; border-radius: 50%; color: var(--text); }
.icon-btn:hover { background: var(--bg-alt); }

/* chips */
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.chip { min-height: 44px; padding: 0 22px; border: 1.5px solid var(--field-border); border-radius: var(--r-chip); background: var(--bg); color: var(--chip-text); font-weight: 500; transition: background-color .15s, color .15s, border-color .15s; }
.chip:hover { background: var(--chip-bg); }
.chip[aria-pressed="true"] { background: var(--chip-active-bg); color: var(--chip-active-text); border-color: var(--chip-active-bg); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}