/* ============================================
   CHOCOMELLOS — Variables de diseño
   Paleta oficial de la guía de marca
   ============================================ */

:root {
  /* --- Colores principales --- */
  --cafe-chocolate:    #3F2414;
  --rosa-coral:        #F0908B;
  --crema-suave:       #FFF7EC;
  --beige-calido:      #F4E5D1;
  --dorado-sutil:      #D8A75F;
  --negro-auxiliar:    #1A0F08;
  --cafe-medio:        #7A4F3A;
  --blanco-calido:     #FFFAF5;

  /* --- Colores de apoyo --- */
  --rosa-claro:        #FDE8E7;
  --rosa-medio:        #F5B8B4;
  --cafe-claro:        #C49A7A;
  --crema-oscura:      #EDD9C0;
  --dorado-claro:      #F2DFB0;

  /* --- Tipografías --- */
  --fuente-titulo:     'Playfair Display', Georgia, serif;
  --fuente-acento:     'Dancing Script', cursive;
  --fuente-cuerpo:     'DM Sans', system-ui, sans-serif;

  /* --- Tamaños de fuente --- */
  --texto-xs:          0.75rem;    /* 12px */
  --texto-sm:          0.875rem;   /* 14px */
  --texto-base:        1rem;       /* 16px */
  --texto-md:          1.125rem;   /* 18px */
  --texto-lg:          1.25rem;    /* 20px */
  --texto-xl:          1.5rem;     /* 24px */
  --texto-2xl:         2rem;       /* 32px */
  --texto-3xl:         2.5rem;     /* 40px */
  --texto-4xl:         3.25rem;    /* 52px */
  --texto-5xl:         4rem;       /* 64px */

  /* --- Espaciados --- */
  --espacio-xs:        0.25rem;
  --espacio-sm:        0.5rem;
  --espacio-md:        1rem;
  --espacio-lg:        1.5rem;
  --espacio-xl:        2rem;
  --espacio-2xl:       3rem;
  --espacio-3xl:       4rem;
  --espacio-4xl:       6rem;
  --espacio-5xl:       8rem;

  /* --- Bordes redondeados --- */
  --radio-sm:          8px;
  --radio-md:          16px;
  --radio-lg:          24px;
  --radio-xl:          36px;
  --radio-redondo:     9999px;

  /* --- Sombras cálidas (café, no gris) --- */
  --sombra-sm:         0 2px 8px rgba(63, 36, 20, 0.06);
  --sombra-md:         0 4px 20px rgba(63, 36, 20, 0.10);
  --sombra-lg:         0 8px 40px rgba(63, 36, 20, 0.14);
  --sombra-hover:      0 12px 48px rgba(63, 36, 20, 0.18);
  --sombra-rosa:       0 8px 32px rgba(240, 144, 139, 0.25);

  /* --- Transiciones --- */
  --transicion-rapida:    150ms ease;
  --transicion-normal:    280ms ease;
  --transicion-suave:     420ms cubic-bezier(0.25, 0.46, 0.45, 0.94);

  /* --- Ancho máximo del contenido --- */
  --ancho-maximo:      1200px;
  --ancho-angosto:     800px;

  /* --- Encabezado --- */
  --alto-encabezado:   72px;
}

/* Modo oscuro mínimo — por si acaso */
@media (prefers-color-scheme: dark) {
  :root {
    /* Chocomellos es una marca cálida, no se adapta a dark mode agresivo */
    /* Se mantiene la paleta clara como decisión de marca */
  }
}