/* Bellverton: base, tokens y tipografía */
/* bloque de assets.py tal cual; únicamente la ruta sube un nivel desde css/ */
@font-face {
  font-family: 'Chivo';
  src: url('../fonts/chivo-var.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Chivo Fallback';
  src: local('Arial');
  size-adjust: 105.99%;
}
@font-face {
  font-family: 'Merriweather';
  src: url('../fonts/merriweather-var.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Merriweather Fallback';
  src: local('Georgia');
  size-adjust: 107.34%;
}
:root {
  --pn0: #FFFFFF;
  --pn1: #F3F4F7;
  --pn2: #E4E6EB;
  --pn3: #C9CDD6;
  --pn4: #6B7080;
  --pn5: #14161A;
  --pn6: #23262D; /* fondo de la franja oscura, un punto por encima del texto */
  --cr1: oklch(0.36 0.12 330); /* ciruela #5B2160: números, filetes, marca de agua */
  --cr2: color-mix(in oklch, var(--cr1) 9%, var(--pn0)); /* tinte de ciruela por color, nunca por opacidad */
  --sn1: oklch(0.50 0.17 25); /* señal #B4232A, únicamente CTA y errores */
  --sn2: oklch(0.43 0.16 25);
  --ff1: 'Chivo', 'Chivo Fallback', Arial, sans-serif;
  --ff2: 'Merriweather', 'Merriweather Fallback', Georgia, serif;
  --ffm: Consolas, 'Liberation Mono', Menlo, monospace;
  --rd1: 3px;
  --rd2: 8px;
  --wd1: 1200px;
  --gp1: 24px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--pn0); color: var(--pn5); font-family: var(--ff2); font-weight: 400; font-size: 1.0625rem; line-height: 1.72; }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { font-family: var(--ff1); font-weight: 300; line-height: 1.12; margin: 0 0 0.5em; color: var(--pn5); }
h1 { font-size: clamp(2.3rem, 5vw, 3rem); }
h2 { font-size: clamp(1.75rem, 3.1vw, 2.6rem); }
h3 { font-size: 1.3rem; font-weight: 400; }
p { margin: 0 0 1em; }
a { color: var(--cr1); text-underline-offset: 3px; }
a:hover { color: var(--pn5); }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid var(--cr1); outline-offset: 2px; }
table { border-collapse: collapse; width: 100%; }
button, input, textarea { font: inherit; color: inherit; }
dl, dd { margin: 0; }
.label-mono { display: block; font-family: var(--ffm); font-size: 0.8125rem; line-height: 1.4; text-transform: uppercase; color: var(--cr1); margin: 0 0 14px; }
.skip-to-content-link { position: absolute; left: 16px; top: 8px; z-index: 700; padding: 12px 18px; background: var(--pn5); color: var(--pn0); text-decoration: none; transform: translateY(-160%); } /* sube fuera de la vista hasta recibir foco */
.skip-to-content-link:focus { transform: none; color: var(--pn0); }
