/* =========================================================================
   EVOLUZIONE — VARIABLES DE DISEÑO
   -------------------------------------------------------------------------
   Este archivo concentra TODO lo que define la identidad visual del sitio:
   colores, tipografías, espaciados, radios y sombras.

   ⚠️ PALETA PROVISIONAL: Evoluzione no proporcionó códigos HEX oficiales.
   Los valores de abajo son una propuesta profesional de partida (azul
   petróleo + turquesa + morado suave) pensada para transmitir confianza,
   movimiento y calidez. Si la marca ya tiene o define colores oficiales,
   SOLO hace falta cambiar los valores dentro de :root — el resto del sitio
   se actualiza automáticamente porque todo el CSS usa estas variables.
   ========================================================================= */

:root {
  /* ---- COLOR: MARCA PRINCIPAL --------------------------------------- */
  --color-azul-profundo: #123B4F;      /* Azul petróleo — confianza, profesionalismo */
  --color-azul-profundo-700: #0D2C3B;
  --color-azul-profundo-100: #E4EDF1;

  --color-turquesa: #2FA8A0;           /* Movimiento, crecimiento */
  --color-turquesa-700: #1F7B75;
  --color-turquesa-100: #E3F5F3;

  --color-morado: #8A7CC7;             /* Complementario, suave */
  --color-morado-700: #6C5DA8;
  --color-morado-100: #EFECFA;

  /* ---- COLOR: ACENTO (botones / CTA) -----------------------------------
     Ajustado para cumplir contraste WCAG 2.2 AA (texto blanco ≥ 4.5:1). */
  --color-acento: #A8532E;             /* Cálido, visible, accesible */
  --color-acento-700: #863F21;
  --color-acento-100: #F7E3D8;

  /* Verde de WhatsApp ajustado a un tono más oscuro que el oficial para
     asegurar contraste AA con texto blanco. */
  --color-whatsapp: #1B6F4C;
  --color-whatsapp-700: #124F36;

  /* ---- COLOR: NEUTROS / FONDOS ---------------------------------------- */
  --color-fondo: #FBFAF7;              /* Fondo general cálido y limpio */
  --color-fondo-alterno: #F3F1EC;
  --color-superficie: #FFFFFF;
  --color-texto: #1E2B32;
  --color-texto-suave: #4B5B63;
  --color-borde: #DDE3E1;

  /* ---- COLOR: ESTADOS --------------------------------------------------- */
  --color-exito: #276B4D;
  --color-error: #A03D29;
  --color-foco: #1F7B75;

  /* ---- IDENTIDAD NEUROENTRENA® (acento propio dentro del mismo sistema) */
  --color-neuroentrena: #6C5DA8;
  --color-neuroentrena-700: #4F4283;
  --color-neuroentrena-100: #EFECFA;

  /* ---- TIPOGRAFÍA -------------------------------------------------------
     Se usa una pila de fuentes del sistema: carga instantánea, sin
     peticiones externas, excelente legibilidad y disponible en todos los
     dispositivos (iOS, Android, Windows, macOS, Linux). Si más adelante
     Evoluzione define una tipografía de marca, se sustituye aquí. */
  --fuente-titulos: "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --fuente-texto: "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;

  --tamano-base: 17px;
  --interlineado-texto: 1.65;
  --interlineado-titulos: 1.2;

  /* ---- ESPACIADO (escala consistente) ----------------------------------- */
  --espacio-xs: 0.5rem;
  --espacio-sm: 1rem;
  --espacio-md: 1.5rem;
  --espacio-lg: 2.5rem;
  --espacio-xl: 4rem;
  --espacio-2xl: 6rem;

  --ancho-contenido: 1180px;
  --ancho-texto: 68ch;

  /* ---- BORDES Y SOMBRAS -------------------------------------------------- */
  --radio-sm: 8px;
  --radio-md: 16px;
  --radio-lg: 28px;
  --radio-pill: 999px;

  --sombra-sm: 0 2px 8px rgba(18, 59, 79, 0.08);
  --sombra-md: 0 8px 24px rgba(18, 59, 79, 0.12);
  --sombra-lg: 0 16px 40px rgba(18, 59, 79, 0.16);

  /* ---- TRANSICIONES -------------------------------------------------------- */
  --transicion-rapida: 150ms ease;
  --transicion-media: 280ms ease;
}

/* Respeta la preferencia del sistema por reducir movimiento */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
