/* Fontes self-hosted (SPEC §4) */
@font-face { font-family:"Jost"; font-style:normal; font-weight:500; font-display:swap;
  src:url("/assets/fonts/jost-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family:"Jost"; font-style:normal; font-weight:700; font-display:swap;
  src:url("/assets/fonts/jost-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family:"Merriweather"; font-style:normal; font-weight:500; font-display:swap;
  src:url("/assets/fonts/merriweather-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family:"Merriweather"; font-style:normal; font-weight:800; font-display:swap;
  src:url("/assets/fonts/merriweather-latin-800-normal.woff2") format("woff2"); }

/* Reset */
*, *::before, *::after { box-sizing:border-box; }
html, body, h1, h2, h3, p, ul { margin:0; padding:0; }
ul { list-style:none; }
img, picture, svg { display:block; max-width:100%; }
a { color:inherit; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
@media (prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }

body {
  min-width:320px;
  background:var(--surface-background);
  color:var(--text-body);
  font:500 16px/24px var(--font-body);
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}

/* Container (SPEC §3); a grade de 12 colunas é declarada em cada seção */
.container {
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--margin);
}

/* Estilos de texto (SPEC §4) */
.t-title { font:500 var(--title-size)/var(--title-lh) var(--font-heading); letter-spacing:-.01em; }
.t-statement { font:500 var(--statement-size)/var(--statement-lh) var(--font-body); letter-spacing:.01em; }
.t-label { font:500 16px/24px var(--font-heading); letter-spacing:.02em; text-transform:uppercase; }
.t-caption { font:800 14px/24px var(--font-body); letter-spacing:.01em; text-transform:uppercase; }
.t-tag { font:700 12px/24px var(--font-heading); letter-spacing:.02em; }

/* Utilitários */
.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip-link {
  position:absolute; left:var(--margin); top:var(--space-200); z-index:10;
  padding:var(--space-200) var(--space-300);
  background:var(--secundaria); color:var(--base);
  transform:translateY(-200%);
}
.skip-link:focus-visible { transform:none; outline:var(--border-md) solid var(--primaria-450); outline-offset:2px; }