/* ==========================================================================
   JOYERÍA MONARCA - LUXURY DESIGN SYSTEM TOKENS
   Paleta cromática de alta orfebrería, tipografías y variables maestras
   ========================================================================== */

:root {
  /* --- PALETA DE FONDOS Y OSCUROS PROFUNDOS --- */
  --bg-deep: #060606;           /* Negro obsidiana puro */
  --bg-surface: #0c0c0c;        /* Superficie elevada base */
  --bg-card: #121212;           /* Fondo de tarjetas y paneles */
  --bg-card-hover: #171717;     /* Hover de tarjetas */
  --bg-elevated: #1a1a1a;       /* Superficie flotante / modales */
  --bg-glass: rgba(12, 12, 12, 0.78); /* Glassmorphism oscuro */
  --bg-glass-card: rgba(18, 18, 18, 0.65);

  /* --- ORO METÁLICO Y MATICES DORADOS (18K) --- */
  --gold-primary: #d4af37;      /* Oro 18K clásico */
  --gold-light: #f7e6a2;        /* Brillo de reflejo oro pulido */
  --gold-champagne: #e8d08d;    /* Oro champaña suave */
  --gold-deep: #aa771c;         /* Sombra y profundidad de oro */
  --gold-rich: #c59b27;         /* Tono oro orfebre */
  --gold-dark: #664610;         /* Acento oscuro de oro */

  /* Degradados dorados metálicos multicapa */
  --gold-gradient: linear-gradient(135deg, #bf953f 0%, #fcf6ba 25%, #b38728 50%, #fbf5b7 75%, #aa771c 100%);
  --gold-gradient-subtle: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(247, 230, 162, 0.05) 50%, rgba(170, 119, 28, 0.15) 100%);
  --gold-gradient-sheen: linear-gradient(90deg, transparent 0%, rgba(247, 230, 162, 0.35) 50%, transparent 100%);
  --gold-gradient-radial: radial-gradient(circle at center, rgba(212, 175, 55, 0.22) 0%, transparent 70%);

  /* --- BORDES Y SEPARADORES DE PRECISIÓN --- */
  --border-gold-subtle: rgba(212, 175, 55, 0.18);
  --border-gold-medium: rgba(212, 175, 55, 0.38);
  --border-gold-highlight: rgba(247, 230, 162, 0.65);
  --border-dark: rgba(255, 255, 255, 0.08);

  /* --- TIPOGRAFÍAS DE ALTO VALOR --- */
  --font-serif-display: 'Cinzel', 'Playfair Display', Georgia, serif;
  --font-serif-editorial: 'Cormorant Garamond', Garamond, 'Times New Roman', serif;
  --font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  /* --- COLORES DE TEXTO --- */
  --text-white: #ffffff;
  --text-primary: #f2f2f2;
  --text-secondary: #a3a3a3;
  --text-muted: #6e6e6e;
  --text-gold: #e2c069;
  --text-gold-light: #f7e6a2;

  /* --- SOMBRAS Y RESPLANDOR (GLOW) --- */
  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.8);
  --shadow-gold-glow: 0 0 35px rgba(212, 175, 55, 0.18);
  --shadow-gold-bright: 0 0 25px rgba(212, 175, 55, 0.35);

  /* --- ESPACIADOS Y RADIOS --- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-full: 9999px;

  /* --- TRANSICIONES Y MOVIMIENTO --- */
  --transition-fast: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 0.75s cubic-bezier(0.16, 1, 0.3, 1);

  /* --- CONTENEDORES --- */
  --container-max: 1340px;
  --header-height: 82px;
}