/*
 * Noticias CFS Jumilla — Sistema visual 2026/27
 * Fase 7: design tokens
 *
 * Regla: los demás ficheros cfs-*.css consumen estos tokens y no declaran
 * colores literales. Así la identidad puede evolucionar desde un único lugar.
 */

:root {
  /* Marca e identidad */
  --cfs-brand-navy: #0b448d;
  --cfs-brand-blue: #006fb9;
  --cfs-brand-sky: #00a2e8;

  /* Tinta / papel */
  --cfs-ink-950: #071525;
  --cfs-ink-900: #0c1c2e;
  --cfs-ink-800: #14283f;
  --cfs-ink-700: #294057;
  --cfs-ink-600: #506174;
  --cfs-ink-500: #69798a;
  --cfs-paper: #f7f5ef;
  --cfs-paper-muted: #efede6;
  --cfs-paper-strong: #e4e1d8;
  --cfs-white: #ffffff;
  --cfs-rule: #c9ced3;
  --cfs-rule-strong: #8e9baa;

  /* Estados deportivos y editoriales */
  --cfs-live: #bd1f2d;
  --cfs-live-dark: #8e1721;
  --cfs-win: #147a4b;
  --cfs-draw: #8b6508;
  --cfs-loss: #a22a2f;
  --cfs-focus: #00a2e8;
  --cfs-overlay: rgba(7, 21, 37, .92);

  /* Tipografía */
  --cfs-font-display: 'Bebas Neue', 'Arial Narrow', Arial, sans-serif;
  --cfs-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --cfs-font-editorial: Georgia, 'Times New Roman', serif;
  --cfs-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Escala tipográfica editorial */
  --cfs-text-xs: clamp(.72rem, .70rem + .08vw, .78rem);
  --cfs-text-sm: clamp(.82rem, .80rem + .10vw, .9rem);
  --cfs-text-base: clamp(.98rem, .94rem + .16vw, 1.08rem);
  --cfs-text-lg: clamp(1.10rem, 1.02rem + .35vw, 1.30rem);
  --cfs-title-sm: clamp(1.45rem, 1.20rem + 1vw, 2.05rem);
  --cfs-title-md: clamp(2rem, 1.45rem + 2.1vw, 3.4rem);
  --cfs-title-lg: clamp(2.8rem, 1.75rem + 4.5vw, 6rem);
  --cfs-score-lg: clamp(3rem, 2.1rem + 3.8vw, 5.75rem);

  /* Ritmo */
  --cfs-space-1: .25rem;
  --cfs-space-2: .5rem;
  --cfs-space-3: .75rem;
  --cfs-space-4: 1rem;
  --cfs-space-5: 1.5rem;
  --cfs-space-6: 2rem;
  --cfs-space-7: 3rem;
  --cfs-space-8: 4rem;
  --cfs-space-9: 6rem;

  /* Geometría: deliberadamente seca, editorial y poco "app" */
  --cfs-radius-0: 0;
  --cfs-radius-1: 2px;
  --cfs-radius-2: 4px;
  --cfs-rule-thin: 1px;
  --cfs-rule-medium: 2px;
  --cfs-rule-heavy: 4px;

  /* Layout */
  --cfs-wrap: 1240px;
  --cfs-reading: 760px;
  --cfs-gutter: clamp(1rem, 3vw, 2.5rem);
  --cfs-grid-gap: clamp(1rem, 2.2vw, 2rem);

  /* Interacción */
  --cfs-transition-fast: 140ms ease;
  --cfs-transition-base: 220ms ease;
  --cfs-focus-width: 3px;

  /* Capas */
  --cfs-z-sticky: 20;
  --cfs-z-overlay: 40;
}

/*
 * Puente de transición Fase 8.
 * Las vistas legacy aún consumen estos nombres; desaparecerán al migrarse
 * página por página al sistema visual CFS.
 */
:root {
  --primary-blue: var(--cfs-brand-navy);
  --secondary-blue: var(--cfs-brand-blue);
  --light-gray: var(--cfs-paper);
  --white: var(--cfs-white);
  --dark: var(--cfs-ink-900);
  --dark-gray: var(--cfs-ink-600);
  --color-primary: var(--cfs-brand-navy);
  --color-secondary: var(--cfs-brand-blue);
  --color-light: var(--cfs-paper);
  --color-dark: var(--cfs-ink-900);
  --color-gray: var(--cfs-ink-600);
}