/* el SEOmanal · tokens de marca (guía de marca v0.4). Solo variables: las fuentes se declaran en base.css (periódico y panel) y en acceso.css. */
:root {
  /* color */
  --sm-tinta: #0C1E47;
  --sm-azul: #1D4FD7;
  --sm-azul-oscuro: #1642B5;
  --sm-azul-claro: #DCE6FB;
  --sm-hielo: #F1F5FD;
  --sm-papel: #FFFFFF;
  --sm-papel-crudo: #F7F8FA;
  --sm-gris-texto: #414B5E;
  --sm-gris-meta: #5F6B7D;
  --sm-linea: #E1E5EC;
  --sm-dorado: #D9A128;
  --sm-dorado-texto: #7A5A0E;
  --sm-ok: #1F7A48;
  --sm-error: #B42318;
  --sm-aviso: #9A6A0A;

  /* tipografía */
  --sm-serif: "Newsreader", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sm-sans: "IBM Plex Sans", "Segoe UI", Roboto, system-ui, sans-serif;
  --sm-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --sm-t-xs: 0.8125rem;   /* 13px meta */
  --sm-t-sm: 0.9375rem;   /* 15px interfaz */
  --sm-t-base: 1.125rem;  /* 18px cuerpo */
  --sm-t-lg: 1.3125rem;   /* 21px entradilla */
  --sm-t-h3: 1.5rem;      /* 24px */
  --sm-t-h2: 2rem;        /* 32px */
  --sm-t-h1: 2.75rem;     /* 44px */
  --sm-t-display: 4rem;   /* 64px */

  /* espacio y forma */
  --sm-s-1: 4px;  --sm-s-2: 8px;  --sm-s-3: 16px; --sm-s-4: 24px;
  --sm-s-5: 32px; --sm-s-6: 48px; --sm-s-7: 64px; --sm-s-8: 96px;
  --sm-radio: 4px;
  --sm-medida: 68ch;
  /* 120 caracteres de la letra del cuerpo (Plex Sans a 18 px = 1.296 px). Va en rem y no en ch porque
     `ch` se resuelve con la letra de cada elemento: la cabecera (13 px) y el pie (15 px) usan el mismo
     contenedor y quedarían más estrechos que el contenido, descuadrando la página. */
  --sm-ancho: 81rem;
  --sm-lateral: 322px;    /* columna lateral: el anuncio 300 × 600 con su marco (10 px de relleno y 1 de borde por lado) */
  --sm-hueco: 32px;       /* separación entre columnas (22-09-2026: de 24 a 32, para que respire) */
}

@media (max-width: 640px) {
  :root { --sm-t-display: 2.75rem; --sm-t-h1: 2.125rem; --sm-t-h2: 1.625rem; --sm-t-h3: 1.3125rem; }
}