/**
 * AI NEXUS GROUP — Design Tokens
 * Holding · NEXUS FINANCE AI · NEXUS HEALTH AI · NEXUS MAPS AI
 * @see docs/brand/AI-NEXUS-GROUP-manual-identidad.md
 */
:root {
  /* ── Fondos y estructura ── */
  --color-bg-main: #08090A;
  --color-bg: #000000;
  --color-bg-elevated: #090A0C;
  --color-bg-card: #16181C;
  --color-surface: #15171A;
  --color-surface-card: #1E2024;
  --color-border: rgba(255, 255, 255, 0.06);
  --color-border-strong: rgba(255, 255, 255, 0.12);

  /* ── Texto ── */
  --color-text: #ffffff;
  --color-text-secondary: #A0A0A0;
  --color-text-muted: #8E9297;

  /* ── Marca: cyan / finanzas / tecnología ── */
  --color-brand-cyan: #00E5FF;
  --color-brand-cyan-alt: #00D2D3;
  --color-brand-teal: #114B5F;
  --color-brand-teal-deep: #022B3A;

  /* ── Marca: violeta / salud / energía ── */
  --color-brand-purple: #A55EEA;
  --color-brand-purple-alt: #9D4EDD;

  /* ── Marca: azul / mapas / navegación ── */
  --color-maps: #2E86C1;
  --color-maps-deep: #1B4F72;

  /* ── Aliases semánticos (compatibilidad) ── */
  --color-accent: var(--color-brand-purple);
  --color-accent-bright: var(--color-brand-purple-alt);
  --color-accent-cyan: var(--color-brand-cyan);
  --color-accent-blue: var(--color-maps);

  /* ── Estados UI / data ── */
  --color-success: #00E676;
  --color-warning: #FF9F43;
  --color-info: #2E86C1;
  --color-danger: #E74C3C;

  --color-recovery: var(--color-success);
  --color-sleep: var(--color-brand-purple);
  --color-strain: var(--color-warning);
  --color-stress-low: var(--color-success);
  --color-stress-mid: var(--color-warning);

  /* ── Gradientes corporativos ── */
  --gradient-nexus: linear-gradient(90deg, #00E5FF 0%, #A55EEA 100%);
  --gradient-nexus-diagonal: linear-gradient(135deg, #00E5FF 0%, #A55EEA 100%);
  --gradient-finance: linear-gradient(135deg, #00E5FF 0%, #114B5F 100%);
  --gradient-health: linear-gradient(135deg, #00D2D3 0%, #A55EEA 100%);
  --gradient-maps: linear-gradient(135deg, #00E5FF 0%, #2E86C1 55%, #A55EEA 100%);

  /* ── Glows ── */
  --glow-cyan: radial-gradient(ellipse 55% 45% at 50% 50%, rgba(0, 229, 255, 0.18), transparent 70%);
  --glow-purple: radial-gradient(ellipse 50% 40% at 50% 50%, rgba(165, 94, 234, 0.14), transparent 70%);
  --glow-blue: var(--glow-cyan);
  --glow-orange: var(--glow-purple);

  /* ── Tipografía ── */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif;

  /* ── Espaciado y forma ── */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  --shadow-phone: 0 40px 80px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06);
  --shadow-card: 0 24px 48px rgba(0, 0, 0, 0.4);

  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  --max-width: 1200px;
  --nav-height: 80px;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --ease-out: linear; }
}