/* Fuentes servidas desde el propio sitio (assets/fonts, licencia SIL OFL 1.1): sin pedidos a Google Fonts. */
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/bricolage-grotesque-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/bricolage-grotesque-latin-700-normal.woff2') format('woff2'); }
/* Monitor Brasil «desde cero» · tokens del sistema visual.
   v2 (3-nov): colores y tipografía iguales al sitio de bancos (sitio_bancos/site/assets/css/tokens.css):
   paleta del Monitor suavizada + IBM Plex Sans / Bricolage Grotesque / IBM Plex Mono.
   Fuente de verdad: los HTML AMx_*.html y SPEC_WEB_00_GENERAL.md §5. No inventar colores fuera de esta lista. */
:root {
  /* Superficies y texto */
  --fondo: #F6F7F8;          /* fondo de la página */
  --tarjeta: #FFFFFF;        /* fondo de tarjetas y cabecera */
  --borde: #E1E6EC;          /* borde de tarjetas (1 px) */
  --borde-fuerte: #C9D2DC;   /* pestañas, línea del cierre */
  --regla: #E6EAEF;          /* líneas de grilla, separadores de fila */
  --texto: #24324A;          /* texto principal; también la línea de 2 px entre secciones */
  --texto-2: #5B6573;        /* subtítulos, rótulos */
  --texto-3: #606C7A;        /* fuentes, notas, ejes */

  /* Serie (categóricos, en este orden; nunca cobre ni arena para una categoría) */
  --navy: #2E5C8A;
  --petroleo: #2F7A86;
  --acero: #6C819B;
  --ciruela: #7B5E8C;
  --acero-claro: #A9B8CB;

  /* Signo y referencia */
  --mejor: #2F7A86;          /* navy = mejora (qué es «mejora» depende de la página, §5.4) */
  --peor: #A85E24;           /* cobre-texto = deterioro */
  --cobre: #C2773A;          /* cobre de relleno (barras/áreas de deterioro cuando el texto va en --peor) */
  --arena: #EDC9A6;          /* relleno suave «falta / peor» */
  --referencia: #8A8F96;     /* meta, promedio, contrafactual: siempre discontinua */

  /* Tipografía */
  --fuente: 'IBM Plex Sans', 'Segoe UI', system-ui, Arial, sans-serif;
  --fuente-display: 'Bricolage Grotesque', 'IBM Plex Sans', Arial, sans-serif;
  --fuente-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
  --suave-activo: #E8EEF5;  /* fondo de selección (banco activo, página activa) */
  --rail: 224px;
  --t-min: 10px;             /* nunca menos */
  --t-nota: 11px;
  --t-sub: 12px;
  --t-cuerpo: 16px;
  --t-titulo-tarjeta: 14px;  /* semibold 600 */
  --t-seccion: 22px;         /* nombre de la sección, 600 */
  --t-kpi: 28px;             /* «dato de la sección», 600, tabular-nums */
  --t-pagina: 30px;          /* nombre de la página en la cabecera, 300 */
  --t-titular: 40px;         /* titular de la apertura, 300 */

  /* Grilla */
  --ancho-max: 1920px;
  --margen: 32px;
  --gap: 16px;
  --alto-fila: 372px;        /* alto estándar de tarjeta en filas 5 + 4 */
  --radio: 2px;
}
