/* =============================================================
   Don Cheech — Design tokens
   Derivados de las 2 imágenes de referencia aprobadas.
   ============================================================= */

:root {
  /* Paleta */
  --color-burgundy:        #961F24;  /* botones sólidos, títulos de tarjeta, footer */
  --color-burgundy-dark:   #7A181D;  /* hover */
  --color-black:           #171311;  /* paneles hero, bandas de sección */
  --color-cream:           #F4EEE4;  /* fondo general */
  --color-white-warm:      #FCF9F4;  /* tarjetas, superficies elevadas */
  --color-gold:            #CBA569;  /* eyebrows, outlines, acentos */
  --color-gold-soft:       #E3CBA0;  /* acento suave sobre negro */
  --color-text:            #1D1815;  /* texto principal sobre claro */
  --color-text-muted:      #4A433D;  /* texto secundario */
  --color-text-on-dark:    #F5F0E8;  /* texto sobre negro/borgoña */
  --color-border:          #D8CCBD;  /* bordes suaves */
  --color-error:           #A4262C;
  --color-success:         #3F6C45;

  /* Tipografía
     Display: condensada bold (titulares, logo) — Oswald
     Body: sans humanista legible — Source Sans 3
     Ambas self-hosted en /assets/fonts (sin CDNs externos). */
  --font-display: "Oswald", "Arial Narrow", sans-serif;
  --font-body: "Source Sans 3", "Helvetica Neue", Arial, sans-serif;

  /* Escala tipográfica fluida */
  --text-xs:   clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --text-sm:   clamp(0.875rem, 0.84rem + 0.2vw, 0.9375rem);
  --text-base: clamp(1rem, 0.96rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
  --text-xl:   clamp(1.375rem, 1.2rem + 0.9vw, 1.875rem);
  --text-2xl:  clamp(1.75rem, 1.4rem + 1.8vw, 2.75rem);
  --text-hero: clamp(2.25rem, 1.6rem + 3.5vw, 4.25rem);

  /* Detalles tipográficos */
  --tracking-wide: 0.14em;   /* eyebrows, nav, botones */
  --leading-tight: 1.08;     /* titulares display */
  --leading-body: 1.6;

  /* Espaciado */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6rem;

  /* Layout */
  --container-max: 1240px;
  --container-pad: clamp(1rem, 4vw, 2rem);
  --header-height: 88px;
  --radius-sm: 4px;
  --radius-md: 8px;

  /* Elevación y transición */
  --shadow-card: 0 1px 3px rgba(23, 19, 17, 0.07), 0 4px 14px rgba(23, 19, 17, 0.05);
  --shadow-modal: 0 12px 40px rgba(23, 19, 17, 0.28);
  --transition: 180ms ease;

  /* Accesibilidad */
  --focus-ring: 2px solid var(--color-burgundy);
  --focus-offset: 2px;
  --tap-target: 44px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --transition: 0ms; }
}