/* ==================== EQUIPO: DISEÑO UX/UI ==================== */
/* Variables CSS personalizadas para el ecosistema COZUMEL.LAT
   Inspiración: Caribe Mexicano, Diseño Editorial, Premium
   Preparado para integración con Dark Mode y temas futuros */

:root {
  /* === PALETA DE COLORES PRINCIPAL === */
  --color-blue-coral: #006680;    /* Azul profundo, elegante, principal */
  --color-turquoise: #40C9A2;    /* Turquesa vibrante pero sofisticado */
  --color-coral: #FF7F50;        /* Coral suave para acentos y CTAs */
  --color-mangrove: #5D6D3A;     /* Verde manglar, naturaleza */
  --color-white-sand: #FDFBF7;   /* Blanco arena cálido para fondos */
  --color-cream: #F4F1EA;        /* Crema para variaciones de fondo */
  --color-dark-blue: #0A1C2A;    /* Casi negro, para texto principal y fondos oscuros */

  /* === VARIABLES BOOTSTRAP MAPEADAS === */
  --bs-primary: var(--color-blue-coral);
  --bs-primary-rgb: 0, 102, 128;
  --bs-secondary: var(--color-turquoise);
  --bs-secondary-rgb: 64, 201, 162;
  --bs-success: var(--color-mangrove);
  --bs-info: var(--color-turquoise);
  --bs-warning: #FFC107;
  --bs-danger: var(--color-coral);
  --bs-light: var(--color-white-sand);
  --bs-dark: var(--color-dark-blue);
  --bs-body-bg: var(--color-white-sand);
  --bs-body-color: var(--color-dark-blue);
  --bs-link-color: var(--color-blue-coral);
  --bs-link-hover-color: #004d60;

  /* === TIPOGRAFÍA === */
  --font-family-sans-serif: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-family-serif: 'Georgia', 'Times New Roman', serif; /* Para citas o títulos editoriales */
  --font-size-base: 1rem;
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-bold: 700;

  /* === ESPACIADO Y DISEÑO === */
  --border-radius-sm: 8px;
  --border-radius: 16px;
  --border-radius-lg: 24px;
  --box-shadow-sm: 0 4px 6px rgba(0, 0, 0, 0.05);
  --box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.1);
  --box-shadow-lg: 0 20px 50px -15px rgba(0, 0, 0, 0.15);
  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: 1px solid rgba(255, 255, 255, 0.3);
  --glass-blur: blur(10px);

  /* === TRANSICIONES === */
  --transition-base: all 0.3s ease-in-out;
  --transition-smooth: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
}