/* ==========================================================================
   VICTORIA SALÓN — DESIGN TOKENS (FASE 2)
   Paleta cálida de gama alta: dorado (principal, a juego con el logo),
   burdeos y rosa empolvado (acentos), negro y crema (bases neutras).
   Tipografía: serif elegante en títulos, sans-serif limpia en cuerpo/UI.

   Contraste verificado (WCAG AA, ratio mínimo 4.5:1 texto normal / 3:1
   texto grande y UI):
   - Negro sobre dorado (--color-gold):            5.0:1  ✔ (texto normal)
   - Crema/blanco sobre burdeos (--color-burgundy): 10.3:1 ✔ (texto normal)
   - Crema sobre negro (--color-black):             16.4:1 ✔ (texto normal)
   - --color-gold-deep sobre crema (--color-bg):     4.6:1 ✔ (texto normal)
   - --color-gold (tal cual) sobre crema:            3.3:1 → solo para uso
     decorativo/gráfico o texto grande, nunca para texto de cuerpo pequeño.
   - Blanco sobre vino casi negro (--color-wine):    20.1:1 ✔ (texto normal,
     fondo del header)
   - Dorado sobre vino casi negro (--color-wine):     6.5:1 ✔ (texto normal,
     "Salón" junto al logo)
   - Blanco sobre vino-lila (--color-plum):          14.6:1 ✔ (texto normal,
     CTA "Reservar por WhatsApp" del header)
   - Crema sobre ceniza fría (--color-ash-cool):     16.5:1 ✔ (texto normal,
     fondo de "Colores a tu Medida" y de Opiniones, sin isla)
   - Dorado claro sobre ceniza fría:                 11.5:1 ✔ (acentos y
     etiquetas de "Colores a tu Medida" y de Opiniones)
   - Crema sobre vino-lila extremo (--color-plum-deep): 16.9:1 ✔ (texto
     normal, fondo de Productos)
   - Dorado claro sobre vino-lila extremo:               11.7:1 ✔ (acentos
     de Productos)
   - Crema sobre vino-lila (--color-plum):               13.4:1 ✔ (texto
     normal, fondo de Contacto — color base de la familia)
   - Dorado claro sobre vino-lila:                        9.3:1 ✔ (acentos
     de Contacto)
   - Crema sobre negro puro (--color-obsidian, #000000):  19.3:1 ✔ (texto
     normal, fondo de Servicios)
   - Dorado claro sobre negro puro:                        13.4:1 ✔ (precios
     y acentos de Servicios)
   ========================================================================== */

:root {
  /* ---------- Paleta base ---------- */
  --color-cream:        #FAF5EC;
  --color-cream-soft:   #F1E8D6;
  --color-black:        #1C1712;
  --color-black-soft:   #241C17;

  --color-gold:         #B08D3F; /* dorado principal (logo) */
  --color-gold-light:   #E4CD8D; /* dorado claro, para texto sobre fondos oscuros */
  --color-gold-deep:    #8A6A2E; /* dorado oscurecido, accesible como texto sobre crema */
  --color-gold-soft:    #F3E9D2; /* dorado muy claro, fondos de chip/etiqueta */

  --color-burgundy:      #6E1E2B;
  --color-burgundy-dark: #4A141D;
  --color-burgundy-soft: #F3E2E3;

  --color-blush:      #D9A9A8; /* rosa empolvado, uso decorativo */
  --color-blush-deep: #8C4F52; /* rosa empolvado oscurecido, uso como texto/acento */
  --color-blush-soft: #F6E9E7;

  --color-wine:        #0D0509; /* vino muy profundo casi negro, fondo del header */
  --color-plum:        #3D1F32; /* vino-lila: CTA de WhatsApp del header/hero, y fondo de Contacto — color original de Contacto, restaurado tras las pruebas de paleta */
  --color-plum-light:  #5F304E; /* hover del CTA plum */
  --color-plum-deep:   #1F1019; /* variación más oscura de --color-plum: fondo de Productos */

  --color-ash-cool: #15171B; /* ceniza fría: fondo de "Colores a tu Medida" (Esmaltes/Tintes) y de Opiniones — mismo tono reutilizado tal cual en ambas secciones (no son contiguas en el scroll) — a propósito con matiz azulado, para distinguirse con claridad del ceniza cálido de Galería (--color-black-soft, #241C17). Sin la isla marfil que envolvía antes los carruseles de Esmaltes/Tintes. */

  --color-obsidian: #000000; /* negro absoluto: fondo de Servicios, a pedido explícito de la clienta — sin ningún matiz (ni cálido/café ni frío), para que se distinga sin ambigüedad de cualquier otro negro del sitio. Los dos intentos anteriores (#110E12, casi idéntico al ceniza frío de "Colores a tu Medida"; luego #160E0C, con matiz cálido/rojizo) seguían leyéndose como "un color", no como negro puro */

  /* ---------- Roles semánticos ---------- */
  --color-bg:            var(--color-cream);
  --color-bg-alt:        var(--color-cream-soft);
  --color-surface:       #FFFFFF;

  --color-text:          var(--color-black);
  --color-text-muted:    #5C5148;
  --color-text-inverse:  var(--color-cream);
  --color-text-inverse-muted: rgba(250, 245, 236, 0.75);

  --color-primary:        var(--color-gold-deep); /* texto/enlaces sobre claro */
  --color-primary-strong: var(--color-gold);       /* decorativo/bordes/hover */
  --color-accent:         var(--color-burgundy);   /* precios, CTA principal */
  --color-accent-soft:    var(--color-blush);

  --color-border:      #E3D7BC;
  --color-border-dark: rgba(250, 245, 236, 0.25);

  /* ---------- Tipografía ---------- */
  --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body: 'Montserrat', 'Segoe UI', Arial, sans-serif;

  --fs-h1: clamp(2.5rem, 6vw, 4.5rem);
  --fs-h2: clamp(1.9rem, 3.6vw, 2.75rem);
  --fs-h3: clamp(1.2rem, 2vw, 1.4rem);

  /* ---------- Otros ---------- */
  --radius-sm: 2px;
  --transition-base: 0.25s ease;
}