/* =========================================================================
   MySaaSLux — Design System v2 (dark tech) · Tokens
   Fuente: DIRECCION_DISENO_2026-07-17.md §2. NUNCA inventar hex/px fuera de aquí.
   ========================================================================= */
:root {
  /* Fondos */
  --bg: #0B0D10;                 /* base near-black, tinte azulado */
  --surface: #12151A;           /* tarjetas/secciones */
  --elevated: #1A1E24;          /* hover/elevado */
  --border: #262B33;            /* bordes sutiles */
  --line: rgba(174,246,57,.12); /* líneas/grid decorativas */

  /* Texto */
  --text: #F2F4F7;
  --text-2: #9BA3AF;
  --text-3: #6B7280;

  /* Marca — el LIMA se mantiene */
  --lima: #AEF639;
  --lima-dark: #8DC92D;
  --lima-glow: rgba(174,246,57,.25);

  /* Acento IA (widget/agente) */
  --ai-violet: #8B5CF6;
  --ai-cyan: #22D3EE;

  --danger: #F87171;

  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 16px;

  /* Escala tipográfica / layout */
  --font-head: 'Space Grotesk', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --shell: 1180px;
  --nav-h: 60px;

  --shadow-card: 0 20px 60px rgba(0,0,0,.45);
  --ease: cubic-bezier(.22,.61,.36,1);
}