/* ============================================================
   typography.css — fuentes self-host + base tipográfica
   GrindyLow (display/marca) + Montserrat variable (texto/UI).
   ============================================================ */

@font-face {
  font-family: "GrindyLow";
  src: url("../../fonts/grindylow.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Montserrat variable: un solo archivo cubre 400–700 */
@font-face {
  font-family: "Montserrat";
  src: url("../../fonts/montserrat-variable-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

/* --- Base --- */
body {
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, .font-display {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  line-height: var(--lh-heading);
  color: var(--color-heading);
  margin: 0 0 0.4em;
}

h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }

/* h4–h6: sans (UI/secundarios), no display */
h4, h5, h6 {
  font-family: var(--font-body);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-heading);
  color: var(--color-ink);
  margin: 0 0 0.5em;
}
h4 { font-size: 1.25rem; }
h5 { font-size: 1.0625rem; }
h6 { font-size: 1rem; }

p { margin: 0 0 1em; }
.lead { font-size: var(--fs-lead); }
small, .text-small { font-size: var(--fs-small); }

a { color: var(--color-primary); text-decoration: none; }
a:hover { color: var(--color-primary-dark); text-decoration: underline; }

/* a11y: enlaces dentro de texto deben distinguirse sin depender del color */
p a:not(.wp-block-button__link), address a {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

strong, b { font-weight: var(--fw-semibold); }