/* ═══════════════════════════════════════════════════════════════
   CubicApp Landing — Design Tokens
   Herencia LUMNIA + acento forestal reforzado
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* ── Primario: Teal profundo (herencia LUMNIA) ── */
  --color-primary-900: #0D3D52;
  --color-primary-800: #0F4D66;
  --color-primary-700: #1E6280;
  --color-primary-600: #2A7D9C;
  --color-primary-400: #3B9BBE;
  --color-primary-100: #D6EEF7;
  --color-primary-50:  #EDF7FC;

  /* ── Acento: Verde bosque (contexto forestal) ── */
  --color-accent-800: #1B4332;
  --color-accent-700: #2D6A4F;
  --color-accent-600: #40916C;
  --color-accent-500: #52B788;
  --color-accent-400: #74C69D;
  --color-accent-100: #D8F3DC;
  --color-accent-50:  #F0FDF4;

  /* ── Neutros cálidos ── */
  --color-surface:     #FAFAF8;
  --color-white:       #FFFFFF;
  --color-neutral-50:  #F8F8F6;
  --color-neutral-100: #F0EFED;
  --color-neutral-200: #E2E1DE;
  --color-neutral-300: #C8C7C4;
  --color-neutral-400: #9E9D9A;
  --color-neutral-500: #6E6D6A;
  --color-neutral-600: #4A4A48;
  --color-neutral-700: #333331;
  --color-neutral-800: #222220;
  --color-neutral-900: #1A1A18;

  /* ── Semánticos ── */
  --color-success: #2D6A4F;
  --color-warning: #B45309;
  --color-error:   #B91C1C;

  /* ── Tipografía ── */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'Fira Code', 'Consolas', monospace;

  /* ── Escala tipográfica ── */
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  32px;
  --text-3xl:  40px;
  --text-4xl:  48px;
  --text-5xl:  56px;

  /* ── Pesos tipográficos ── */
  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;

  /* ── Espaciado (múltiplos de 4px) ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ── Layout ── */
  --max-width:   1120px;
  --max-width-lg: 1240px;
  --nav-height:  72px;
  --border-radius: 8px;
  --border-radius-lg: 12px;
  --border-radius-xl: 16px;

  /* ── Transiciones ── */
  --transition: 180ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);

  /* ── Sombras ── */
  --shadow-sm:  0 1px 2px rgba(13, 61, 82, 0.06);
  --shadow-md:  0 4px 12px rgba(13, 61, 82, 0.08);
  --shadow-lg:  0 8px 24px rgba(13, 61, 82, 0.10);
  --shadow-xl:  0 12px 36px rgba(13, 61, 82, 0.12);
}