/* Hallmark · tokens.css — Eproject · dark atmospheric rebuild
 * Portable token set. WCAG AAA Compliant. Neuroaesthetic OKLCH Palette.
 * Ecosistema de Inteligencia Empresarial: BI + IA + Automatización
 */
:root {
  /* — Surface: near-black canvas + semi-transparent card films — */
  --color-paper:      oklch(14% 0.008 265);        /* #0b0c10 deepest space canvas */
  --color-paper-deep: oklch(10% 0.006 265);        /* deepest core canvas */
  --color-surface:    oklch(100% 0 0 / 0.045);     /* translucent card film */
  --color-surface-2:  oklch(100% 0 0 / 0.075);     /* elevated / inner tile */
  --color-surface-3:  oklch(100% 0 0 / 0.12);      /* modal / hover card */
  --color-surface-glow: oklch(74% 0.17 52 / 0.06); /* subtle amber radiance */

  --color-hairline:   oklch(100% 0 0 / 0.11);
  --color-hairline-2: oklch(100% 0 0 / 0.06);
  --color-hairline-accent: oklch(74% 0.17 52 / 0.35);
  --color-nav-bg:     oklch(16% 0.008 265 / 0.78); /* translucent dark nav */

  /* — Ink — */
  --color-ink:        oklch(98% 0.004 265);        /* pure readable white */
  --color-ink-dim:    oklch(78% 0.01 265);         /* secondary readable */
  --color-ink-faint:  oklch(68% 0.012 265);        /* ≥5.5:1 on paper (WCAG AAA compliant) */

  /* — Accent: Warm Vibrant Orange (Eproject Core Saliency) — */
  --color-accent:         oklch(74% 0.17 52);      /* Saliencia atencional primaria */
  --color-accent-strong:  oklch(70% 0.18 46);      /* Hover state */
  --color-accent-ink:     oklch(16% 0.03 52);      /* Dark high-contrast text on orange fill (>8:1) */
  --color-accent-soft:    oklch(74% 0.17 52 / 0.15);
  --color-accent-line:    oklch(74% 0.17 52 / 0.35);
  --color-accent-2:       oklch(82% 0.13 72);       /* Amber chart secondary */
  --color-focus:          oklch(80% 0.15 55);

  /* — Concept colours: BI / IA / RPA (Coherent Neuro-Triad) — */
  --color-bi:        oklch(74% 0.17 52);           /* Naranja cálido — Business Intelligence */
  --color-ia:        oklch(68% 0.19 305);          /* Violeta neural — Inteligencia Artificial */
  --color-rpa:       oklch(76% 0.12 205);          /* Cian cibernético — Automatización RPA */
  
  --color-bi-soft:   oklch(74% 0.17 52 / 0.14);
  --color-ia-soft:   oklch(68% 0.19 305 / 0.16);
  --color-rpa-soft:  oklch(76% 0.12 205 / 0.16);
  --color-bi-line:   oklch(74% 0.17 52 / 0.36);
  --color-ia-line:   oklch(68% 0.19 305 / 0.38);
  --color-rpa-line:  oklch(76% 0.12 205 / 0.38);

  /* — Emotional & Diagnostic Feedback (Cortisol vs Oxitocina) — */
  --color-pain:           oklch(63% 0.19 27);      /* Rojo dolor / Cortisol / Inacción */
  --color-pain-soft:      oklch(63% 0.19 27 / 0.12);
  --color-pain-line:      oklch(63% 0.19 27 / 0.35);
  --color-relief:         oklch(75% 0.16 150);     /* Verde alivio / Oxitocina / Certeza */
  --color-relief-soft:    oklch(75% 0.16 150 / 0.14);
  --color-relief-line:    oklch(75% 0.16 150 / 0.38);

  /* — WhatsApp Contact CTA — */
  --color-wa:         oklch(72% 0.19 150);         /* WhatsApp green */
  --color-wa-strong:  oklch(66% 0.19 150);
  --color-wa-ink:     oklch(20% 0.05 155);         /* WCAG AAA text on green */
  --shadow-wa: 0 6px 22px oklch(72% 0.19 150 / 0.35);

  /* — Chart Performance Zones — */
  --color-zone-crit:       oklch(63% 0.19 27);     /* Rojo · crítico */
  --color-zone-mid:        oklch(74% 0.17 52);     /* Naranja · aceptable */
  --color-zone-opt:        oklch(76% 0.15 152);    /* Verde · óptimo */
  --color-zone-crit-soft:  oklch(63% 0.19 27 / 0.10);
  --color-zone-mid-soft:   oklch(74% 0.17 52 / 0.07);
  --color-zone-opt-soft:   oklch(76% 0.15 152 / 0.12);

  /* — Typography — */
  --font-display: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  --text-display:    clamp(2.6rem, 6.2vw + 0.5rem, 5.25rem);
  --text-display-s:  clamp(2rem, 3.6vw + 1rem, 3.25rem);
  --text-2xl: clamp(1.5rem, 1.6vw + 1rem, 2.1rem);
  --text-xl:   1.35rem;
  --text-lg:   1.12rem;
  --text-base: 1rem;
  --text-sm:   0.9rem;
  --text-xs:   0.78rem;

  /* — Space (8pt modular scale) — */
  --space-3xs: 4px;
  --space-2xs: 8px;
  --space-xs:  12px;
  --space-sm:  16px;
  --space-md:  24px;
  --space-lg:  36px;
  --space-xl:  56px;
  --space-2xl: 88px;
  --space-3xl: 128px;

  /* — Radius — */
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-pill: 999px;

  /* — Elevation & Glows — */
  --shadow-sm:     0 1px 3px oklch(0% 0 0 / 0.4);
  --shadow-md:     0 12px 40px oklch(0% 0 0 / 0.5);
  --shadow-lg:     0 24px 60px oklch(0% 0 0 / 0.65);
  --shadow-accent: 0 8px 30px oklch(74% 0.17 52 / 0.38);
  --shadow-glow:   0 0 50px oklch(74% 0.17 52 / 0.18);

  /* — Motion & Spring Curves — */
  --dur-short: 160ms;
  --dur-med:   320ms;
  --dur-long:  600ms;
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* — Z-index Governance — */
  --z-base:  1;
  --z-nav:   100;
  --z-modal: 1000;
  --z-toast: 2000;
}