/*
 * Plaza CNC — Design tokens (dirección A, «Hoja de corte»)
 * Fuente de la verdad del estilo. Estos valores alimentan theme.json y los bloques.
 * No inventes colores ni tipografías fuera de esta lista.
 */

:root {
  /* ---- Color ---- */
  --tr-acento: #E0312B;          /* rojo de corte: botones principales, sellos, acentos */
  --tr-acento-hover: #B3261F;    /* rojo oscuro: hover y texto rojo sobre fondos claros (derivado: #E0312B no llega a AA sobre crema) */
  --tr-azul: #2747D8;            /* azul de grabado: líneas e ilustraciones, enlaces secundarios */
  --tr-tinta: #1F1A17;           /* texto principal, fondos oscuros, botón secundario */
  --tr-texto-2: #4A403A;         /* párrafos y descripciones */
  --tr-fondo: #FFFFFF;           /* fondo base */
  --tr-fondo-claro: #F5F3EF;     /* secciones alternas (se conserva; la dirección A no define otro) */
  --tr-borde: #E8E1D8;           /* tarjetas y divisores */

  /* Sello "Probado" */
  --tr-probado-texto: #1E6B3A;
  --tr-probado-fondo: #E8F3EC;

  /* Texto sobre fondo oscuro */
  --tr-texto-inverso: #FFFFFF;
  --tr-texto-inverso-2: #D8CFC6;

  /* ---- Tipografía ---- */
  --tr-fuente-titulos: "Barlow Condensed", "Arial Narrow", sans-serif;
  --tr-fuente-principal: "Barlow", system-ui, sans-serif;
  --tr-fuente-tecnica: "Barlow", system-ui, sans-serif; /* etiquetas y cifras: mismo tipo que el texto */

  /* Escala tipográfica */
  --tr-fs-display: 96px;   /* título de portada (en pantallas chicas baja a 56px) */
  --tr-fs-h2: 48px;
  --tr-fs-h3: 28px;
  --tr-fs-cuerpo: 18px;
  --tr-fs-small: 15px;
  --tr-fs-mono: 13px;      /* etiquetas y cifras técnicas */

  --tr-fw-regular: 400;
  --tr-fw-medium: 500;
  --tr-fw-semibold: 600;
  --tr-fw-bold: 700;
  --tr-fw-extrabold: 800;

  /* ---- Espaciado (escala base 8) ---- */
  --tr-space-1: 8px;
  --tr-space-2: 16px;
  --tr-space-3: 24px;
  --tr-space-4: 32px;
  --tr-space-5: 48px;
  --tr-space-6: 64px;
  --tr-space-7: 80px;

  /* ---- Radios ---- */
  --tr-radio-boton: 4px;
  --tr-radio-tarjeta: 6px;

  /* ---- Layout ---- */
  --tr-ancho-max: 1200px;
  --tr-gutter: 24px;
  --tr-ease-out: cubic-bezier(0.23, 1, 0.32, 1); /* salida fuerte para movimiento de interfaz */

  /* ---- Toque mínimo ---- */
  --tr-touch-min: 44px;
}