/* =====================
   VARIABLES CSS
===================== */
:root {
  /* Nueva paleta de colores basada en el logo */
  --primary-color: #D7361A;        /* Naranja-rojo principal */
  --primary-dark: #C1171E;         /* Rojo oscuro para variaciones */
  --accent-color: #D8C4A9;         /* Beige claro para acentos */
  --background-color: #000000;     /* Negro para fondos principales */
  --background-color2: #00000010;  /* Negro con transparencia */
  --text-color: #D8C4A9;           /* Beige claro para texto principal */
  --text-secondary: #C1171E;       /* Rojo oscuro para texto secundario */
  --grey: #D8C4A9;                 /* Beige claro para elementos grises */
  --white: #D8C4A9;                /* Beige claro en lugar de blanco puro */
  --black: #000000;                /* Negro puro */
  
  /* Colores adicionales para variaciones */
  --primary-light: rgba(215, 54, 26, 0.8);
  --primary-dark: rgba(193,23,30,0.8); /* Naranja-rojo con transparencia */
  --accent-light: rgba(216, 196, 169, 0.8); /* Beige con transparencia */
  --dark-overlay: rgba(0, 0, 0, 0.7);       /* Negro con transparencia para overlays */
}