/* Variables de Diseño y Sistema de Diseño - SGI Consultoría */
:root {
  /* Paleta de Colores (Corporativo Premium) */
  --primary: #0F172A;          /* Azul Oscuro Slate 900 */
  --primary-light: #1E293B;    /* Azul Slate 800 */
  --primary-accent: #334155;   /* Azul Slate 700 */
  
  --accent: #D4AF37;           /* Oro Metálico */
  --accent-light: #F59E0B;     /* Ámbar */
  --accent-dark: #B45309;      /* Ámbar Oscuro */
  --accent-gradient: linear-gradient(135deg, #F59E0B 0%, #D4AF37 50%, #B45309 100%);
  
  --neutral-dark: #020617;     /* Negro Slate 950 */
  --neutral-light: #F8FAFC;    /* Blanco Hueso Slate 50 */
  --neutral-slate: #64748B;    /* Gris Slate 500 */
  --neutral-border: #E2E8F0;   /* Borde Slate 200 */
  
  /* Estados de Interacción */
  --success: #10B981;          /* Verde ISO 14001 */
  --error: #EF4444;            /* Rojo */
  --info: #0693E3;             /* Azul Info */
  
  /* Glassmorphism */
  --glass-bg: rgba(255, 255, 255, 0.75);
  --glass-border: rgba(226, 232, 240, 0.8);
  --glass-shadow: 0 8px 32px 0 rgba(15, 23, 42, 0.08);
  
  --glass-dark-bg: rgba(15, 23, 42, 0.85);
  --glass-dark-border: rgba(51, 65, 85, 0.5);
  --glass-dark-shadow: 0 8px 32px 0 rgba(2, 6, 23, 0.37);

  /* Sombras Modernas */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  
  /* Fuentes Corporativas */
  --font-title: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  
  /* Espaciados y Grid */
  --container-max-width: 1200px;
  --header-height: 85px;
  
  /* Transiciones */
  --transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* Radios de Borde */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;
}