/* Layout: lujo nocturno, negro cálido con oro pulido; secciones en bandas a todo el ancho y contenido a 1200px. */
:root {
  color-scheme: dark;

  /* Color: negro y dorado del logo ALUX */
  --ink: #0b0a08;          /* fondo principal */
  --ink-2: #13110d;        /* bandas alternas */
  --panel: #1a1712;        /* tarjetas */
  --line: rgba(214, 173, 96, 0.22);
  --line-strong: rgba(214, 173, 96, 0.5);
  --gold: #d6ad60;         /* acento principal */
  --gold-hi: #f4dfa4;
  --gold-lo: #9c6f2a;
  --gold-grad: linear-gradient(135deg, #f6e1a2 0%, #d8ab55 38%, #a9772b 68%, #e8c674 100%);
  --text: #f4eee3;
  --muted: #b9ae9b;
  --on-gold: #17120a;
  --danger: #ff8a7a;
  --wa: #25d366;

  /* Tipografía: las mismas familias del catálogo */
  --f-brand: 'Cinzel', 'Trajan Pro', 'Times New Roman', serif;
  --f-display: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --f-body: 'Montserrat', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --f-script: 'Satisfy', 'Brush Script MT', cursive;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fs-2xl: clamp(1.75rem, 1.3rem + 1.8vw, 2.5rem);
  --fs-3xl: clamp(2.5rem, 1.6rem + 4vw, 4.5rem);

  /* Espaciado (escala de 4 px) */
  --s-1: 0.25rem; --s-2: 0.5rem; --s-3: 0.75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem; --s-7: 3rem; --s-8: 4rem; --s-9: 6rem;

  --radius: 14px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.8);
  --glow: 0 0 0 1px var(--line), 0 20px 50px -25px rgba(214, 173, 96, 0.35);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 220ms;

  --header-h: 72px;
  --container: 1200px;

  /* Capas */
  --z-header: 40;
  --z-float: 50;
  --z-dialog: 100;
}