/* Linea Editorial Q-Ver — design tokens (Sub-1 foundation, 2026-06-08).
   Single source of truth: change here, everything cascades.
   Paleta canon Q-Ver: rojo principal + grises + amarillo acentos. */

:root {
  /* === Paleta Q-Ver (canon) === */
  --c-navy:     #B42A3A;   /* Rojo Q-Ver (principal — usado para titulos/marca) */
  --c-graphite: #3C3C3C;   /* Gris oscuro (fondos oscuros, text body) */
  --c-red:      #B42A3A;   /* Mismo rojo para alerts (coherencia) */
  --c-silver:   #E5E5E5;   /* Gris claro (bordes, fondos secundarios) */
  --c-yellow:   #FFD500;   /* Amarillo Q-Ver (highlights, acentos calidos) */
  --c-bg:       #FFFFFF;   /* Blanco (fondo body) */

  /* Opacidades canonicas — el canon prohibe agregar hex nuevos.
     Si necesitas un tono, usa opacity sobre los 6 base. */
  --c-navy-5:      rgba(180, 42, 58, 0.05);
  --c-navy-10:     rgba(180, 42, 58, 0.10);
  --c-navy-20:     rgba(180, 42, 58, 0.20);
  --c-graphite-60: rgba(60, 60, 60, 0.60);
  --c-red-10:      rgba(180, 42, 58, 0.10);

  /* === Tipografia === */
  --font-sans: "Manrope", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;

  --weight-thin:    200;
  --weight-body:    400;
  --weight-medium:  500;
  --weight-h:       700;
  --weight-label:   700;
  --weight-display: 800;

  /* === Spacing (multiplos de 8px canon) === */
  --s-1:  8px;
  --s-2:  16px;
  --s-3:  24px;
  --s-4:  32px;
  --s-6:  48px;
  --s-12: 96px;

  /* === Reticula === */
  --r12-max:  1200px;
  --r12-cols: 12;
  --r12-gap:  var(--s-3);
  --rv-max:   720px;
}