@layer reset, base;
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html, body, h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
  ul, ol { padding: 0; list-style: none; }
  img, svg, video { display: block; max-width: 100%; }
  a { color: inherit; text-decoration: none; }
  button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
}
@layer base {
  html { background: var(--c-bg); color: var(--c-fg); scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
  body { font-family: var(--f-body); font-size: var(--t-s); line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: clip; }
  body[data-locked] { overflow: hidden; }
  ::selection { background: var(--c-forge); color: var(--c-bg); }
  :focus-visible { outline: 2px solid var(--c-forge); outline-offset: 3px; }
  h1, h2, h3, h4 { font-family: var(--f-display); font-weight: 600; line-height: 1.05; letter-spacing: -.02em; text-wrap: balance; }
  .eyebrow { font-family: var(--f-mono); font-size: var(--t-xs); letter-spacing: .18em; text-transform: uppercase; color: var(--c-forge); }
  .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
}