/* base.css — reset, element defaults, layout primitives and type helpers.
   Ported from reference/css/base.css: same declarations, same selectors.
   Rules of the reference CSS (enforced by `npm run ref:check`):
   - colors, font families and font sizes come ONLY from tokens.css variables
   - margin / padding / gap use the spacing scale (or 0, 1px, 2px for hairline nudges)
   - two breakpoints only: max-width 1023px (tablet) and max-width 639px (mobile)
   - no text glyphs as icons, no inline style attributes except CSS custom properties */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--wp--preset--color--base);
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--body);
  font-weight: var(--wp--custom--font-weight--regular);
  line-height: var(--wp--custom--line-height--body);
  overflow-x: clip;
}

h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote, address { margin: 0; }
ul, ol { padding: 0; list-style: none; }
address { font-style: normal; }

h1, h2, h3, h4 {
  font-family: var(--wp--preset--font-family--display);
  font-weight: var(--wp--custom--font-weight--medium);
  line-height: var(--wp--custom--line-height--title);
  letter-spacing: var(--wp--custom--letter-spacing--title);
}

a { color: inherit; text-decoration: none; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
em { font-style: normal; }

button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { margin: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: inherit; }

::selection { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }

:focus-visible {
  outline: 2px solid var(--wp--preset--color--accent);
  outline-offset: 3px;
  border-radius: var(--wp--custom--radius--sm);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ---------- layout primitives ---------- */

/* Full-bleed sections carry the background; .lm-container centres the content.
   1440px outer width with a 56 / 32 / 20px gutter = 1328px of content on desktop. */
.lm-container {
  width: 100%;
  max-width: var(--wp--custom--layout--wide);
  margin-inline: auto;
  padding-inline: var(--wp--custom--layout--gutter);
}
.lm-container--narrow { max-width: calc(var(--wp--custom--layout--narrow) + 2 * var(--wp--custom--layout--gutter)); }

.lm-section { padding-block: var(--wp--custom--layout--section-y); }
.lm-section--flush-top { padding-top: 0; }
.lm-section--flush-bottom { padding-bottom: 0; }

.lm-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0;
}

.lm-skip-link {
  position: absolute; left: var(--wp--preset--spacing--40); top: var(--wp--preset--spacing--40);
  z-index: var(--wp--custom--z-index--dialog);
  padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
  background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink);
  border-radius: var(--wp--custom--radius--pill); font-weight: var(--wp--custom--font-weight--bold);
  transform: translateY(-200%);
}
.lm-skip-link:focus { transform: none; }

.lm-icon { flex-shrink: 0; }

/* ---------- type helpers (one class per display size token) ---------- */

.lm-display, .lm-title-lg, .lm-title, .lm-title-sm {
  font-family: var(--wp--preset--font-family--display);
  font-weight: var(--wp--custom--font-weight--medium);
}
.lm-display  { font-size: var(--wp--preset--font-size--display);  line-height: var(--wp--custom--line-height--display); letter-spacing: var(--wp--custom--letter-spacing--display); }
.lm-title-lg { font-size: var(--wp--preset--font-size--title-lg); line-height: var(--wp--custom--line-height--display); letter-spacing: var(--wp--custom--letter-spacing--title); }
.lm-title    { font-size: var(--wp--preset--font-size--title);    line-height: var(--wp--custom--line-height--title);   letter-spacing: var(--wp--custom--letter-spacing--title); }
.lm-title-sm { font-size: var(--wp--preset--font-size--title-sm); line-height: var(--wp--custom--line-height--title);   letter-spacing: var(--wp--custom--letter-spacing--title); }

.lm-eyebrow {
  font-size: var(--wp--preset--font-size--small);
  font-weight: var(--wp--custom--font-weight--bold);
  line-height: var(--wp--custom--line-height--snug);
  letter-spacing: var(--wp--custom--letter-spacing--eyebrow);
  text-transform: uppercase;
  color: var(--wp--preset--color--muted);
}
