/* Variables CSS para MELBA Insumos Industriales */
:root {
  /* Colores corporativos */
  --color-primario: #1377B2;
  --color-secundario: #9ED8EE;
  --color-bg: #FFFFFF;
  --color-texto: #222831;
  --color-gris-claro: #F5F6FA;
  --color-gris-oscuro: #393E46;
  --color-acento: #1377B2;
  
  /* Tipografía */
  --font-principal: 'Montserrat', sans-serif;
  --font-secundaria: 'Open Sans', sans-serif;
  
  /* Espaciado */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-xxl: 3rem;
  
  /* Bordes y sombras */
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 16px;
  --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  --box-shadow-hover: 0 6px 12px rgba(0, 0, 0, 0.15);
  
  /* Transiciones */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* Contenedores */
  --container-max-width: 1200px;
  --container-padding: 1rem;
  
  /* Breakpoints */
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
}