/* ═══════════════════════════════════════════
   DESIGN SYSTEM — Navy Progression
   Variables de color, sombras y tokens de diseno
   ═══════════════════════════════════════════ */
:root {
  --navy-950: #111827;
  --navy-900: #1A2640;
  --navy-800: #1E3354;
  --navy-700: #264060;
  --navy-600: #3B6098;
  --navy-500: #4A7AB8;
  --navy-400: #6B9AD4;
  --navy-300: #93B5E1;
  --navy-200: #BACEEE;
  --navy-100: #E0EAF6;
  --navy-50: #F2F6FB;

  --warm-600: #A67C37;
  --warm-500: #C49642;
  --warm-400: #D4AD5E;
  --warm-200: #EDD9A8;
  --warm-50: #FBF6EA;

  --ink: #1A1D23;
  --ink-muted: #353840;
  --ink-soft: #5C6170;
  --ink-faint: #8D929E;
  --surface: #FAFBFC;

  --shadow-xs: 0 1px 4px rgba(11,18,34,0.04);
  --shadow-sm: 0 2px 12px rgba(11,18,34,0.05);
  --shadow-md: 0 8px 30px rgba(11,18,34,0.07);
  --shadow-lg: 0 20px 50px rgba(11,18,34,0.10);
}