/* ============================================================
   tokens.css — ANCLA · HTML navegable Universo IA Centro Digital PRS
   Dalí, Genio Audiovisual de AIONOVA · 2026-08-20 · CDP-001
   ------------------------------------------------------------
   Piel CDPRS: BLANCO editorial dominante + CYAN y MAGENTA fundidos
   como acento vivo + NEGRO obsidiana silueteando. Amarillo CDPRS como
   chispa puntual, SIEMPRE con texto oscuro encima. Cero fondos oscuros
   con texto claro — dirección de arte firmada por David 2026-08-20.
   Cuatricromía extraída directa del logo (cdprs_logo_color_1/2.svg):
   cyan #0AADED · magenta #EA268D · amarillo #FDF014 · negro #000.
   Los nombres de variables se conservan: interactivo.css se re-viste
   sin tocarse (contrato de clases/ids heredado del molde Perdomo).
   ============================================================ */

:root{
  /* ---------- Papel / lienzo — blanco editorial, cero fondo oscuro ---------- */
  --paper:      #FAFBFC;   /* lienzo principal */
  --paper-2:    #FFFFFF;   /* tarjetas / capas elevadas */
  --paper-3:    #F1F5F8;   /* zonas de reposo / bandeja (azulado muy claro, guiño cyan) */

  /* ---------- Tinta — negro obsidiana sobre claro ---------- */
  --ink:        #14161A;   /* texto principal (negro casi puro, contraste CDPRS) */
  --ink-soft:   #414650;   /* leads, cuerpo secundario */
  --ink-mute:   #7C818B;   /* labels, notas — NUNCA texto de lectura */

  /* ---------- Estructura (antes "navy") — negro obsidiana ---------- */
  --navy:       #12151A;   /* estructura, cenefas, bordes-top de tarjeta */
  --navy-deep:  #0A0C0F;   /* labels/eyebrow (texto near-black, NUNCA como fondo) */

  /* ---------- ACENTO primario memorable — CYAN CDPRS ---------- */
  --accent:     #0AADED;   /* cyan · reglas de sección, marcadores, CTA */
  --accent-ink: #0A6E9E;   /* cyan apto para texto sobre claro (AA) */
  --accent-tint:rgba(10,173,237,.10);

  /* ---------- Fusión de la casa — cyan → magenta (marca CDPRS) ---------- */
  --grad:       linear-gradient(100deg, var(--accent) 0%, var(--mag) 100%);
  --grad-soft:  linear-gradient(100deg, rgba(10,173,237,.10) 0%, rgba(234,38,141,.10) 100%);

  /* ---------- ACENTO secundario — MAGENTA CDPRS (mapeado a "gold") ---------- */
  --gold:       #EA268D;   /* magenta · segundo acento, fusiones con cyan */
  --gold-tint:  rgba(234,38,141,.09);
  --mag:        #EA268D;
  --mag-ink:    #B01466;   /* magenta apto para texto sobre claro */
  --mag-tint:   rgba(234,38,141,.09);

  /* ---------- Amarillo CDPRS — chispa puntual, texto oscuro encima ---------- */
  --brand-yellow:     #FDF014;
  --brand-yellow-soft:#FEF7A6;   /* banda suave para más área sin cansar */
  --brand-yellow-ink: #5E5A00;   /* texto/etiqueta sobre amarillo (AA) */

  /* ---------- Datos — grafito neutro (números, diagramas) ---------- */
  --data:       #4E5058;
  --data-tint:  rgba(78,80,88,.08);

  /* ---------- Semáforo de riesgo — controlado ---------- */
  --ok:         #0A6E9E;   /* checkmark = disco cyan (dentro de paleta) */
  --warn:       #B01466;   /* fuera de alcance / baranda = magenta */
  --risk-bajo:  #4E5058;   /* grafito */
  --risk-medio: #9A7A00;   /* ámbar CDPRS oscurecido, único guiño cálido legible */
  --risk-alto:  #B01466;   /* magenta */

  /* ---------- Co-marca ---------- */
  --aion-blue:  #0A6E9E;

  /* ---------- Líneas ---------- */
  --rule:       #E1E6EB;
  --rule-soft:  #EDF1F4;

  /* ---------- Acento por sección — alternancia cyan / magenta ---------- */
  --sc-01: var(--accent);      /* Hero              */
  --sc-02: var(--data);        /* Contexto          */
  --sc-03: var(--mag);         /* Dolor             */
  --sc-04: var(--accent);      /* Oportunidad       */
  --sc-05: var(--mag);         /* Piloto            */
  --sc-06: var(--accent);      /* Economía / cierre */

  /* ---------- Tipografía — DM Sans (marca activa CDPRS) ---------- */
  --display: "DM Sans", system-ui, -apple-system, Segoe UI, sans-serif;
  --sans:    "DM Sans", system-ui, -apple-system, Segoe UI, sans-serif;
  --mono:    "DM Mono", ui-monospace, SFMono-Regular, monospace;

  /* Escala tipográfica */
  --fs-eyebrow: .72rem;
  --fs-body:    1rem;
  --fs-lead:    1.24rem;
  --fs-h2:      clamp(1.5rem, 2.4vw, 2rem);
  --fs-h1:      clamp(2.2rem, 4.2vw, 3.1rem);

  /* ---------- Sistema editorial ---------- */
  --ed-accent:       var(--accent);
  --ed-air:          clamp(1.4rem, 3.2vw, 2.4rem);
  --ed-foto-max:     980px;
  --ed-hair:         1px solid var(--rule);
  --ed-hair-soft:    1px solid var(--rule-soft);
  --ed-measure:      64ch;
  --ed-measure-tight:46ch;

  /* ---------- Geometría / sombra (tintadas en obsidiana) ---------- */
  --radius:   10px;
  --wrap:     1120px;
  --shadow-1: 0 1px 2px rgba(10,12,15,.05), 0 1px 1px rgba(10,12,15,.04);
  --shadow-2: 0 6px 20px rgba(10,12,15,.09);

  /* ---------- Movimiento ---------- */
  --dur:      .42s;
  --dur-fast: .2s;
  --ease:     cubic-bezier(.22,.61,.36,1);
}