/* Roboto alojada en el propio sitio (más rápido y sin depender de Google Fonts) */
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/roboto-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/roboto-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/roboto-latin-700-normal.woff2') format('woff2')}

/* SICGBOR — sistema tipográfico único para TODA la plataforma.
   Una sola fuente (Roboto). Cada rol tiene UN tamaño y UN color; solo cambia el grosor.
   Para ajustar la tipografía de todo el sitio, se cambia aquí y en ningún otro lugar. */
:root{
  /* Contenedor general: el contenido nunca se estira más allá de este ancho */
  --container:2200px;
  --gutter:44px;
  --font:'Roboto',system-ui,-apple-system,'Segoe UI',sans-serif;

  /* Tamaños (iguales en todas las páginas) */
  --fs-title:1.75rem;      /* Títulos      28px  */
  --fs-subtitle:1.125rem;  /* Subtítulos   18px  */
  --fs-text:1rem;          /* Texto        16px  */
  --fs-small:.875rem;      /* Etiquetas, datos y botones  14px */

  /* Colores de texto (solo la paleta oficial) */
  --c-title:#231F20;
  --c-subtitle:#2C3337;
  --c-text:#2C3337;

  /* Grosores */
  --fw-regular:400; --fw-medium:500; --fw-bold:700;
}
body{font-family:var(--font);font-size:var(--fs-text);font-weight:var(--fw-regular);color:var(--c-text);line-height:1.6}
:where(h1,h2){font-family:var(--font);font-size:var(--fs-title);font-weight:var(--fw-bold);line-height:1.25;color:var(--c-title)}
:where(h3){font-family:var(--font);font-size:var(--fs-subtitle);font-weight:var(--fw-medium);line-height:1.35;color:var(--c-subtitle)}
:where(p){font-size:var(--fs-text)}
:where(small){font-size:var(--fs-small)}