/* =========================================================
   M.Beauty — Design Tokens
   Luxury dark theme: onyx / gold / neon-rose / metallic teal
   ========================================================= */

:root {
  /* --- Surfaces --- */
  --bg-void: #06060a;
  --bg-primary: #0b0b12;
  --bg-secondary: #121220;
  --bg-elevated: #191927;
  --glass-bg: rgba(255, 255, 255, 0.045);
  --glass-bg-strong: rgba(255, 255, 255, 0.08);
  --glass-border: rgba(212, 175, 130, 0.18);
  --glass-border-strong: rgba(212, 175, 130, 0.35);

  /* --- Brand accents --- */
  --gold: #d4af37;
  --gold-soft: #f4e2a8;
  --gold-deep: #9c7a22;
  --rose-neon: #ff3d81;
  --rose-neon-soft: #ff8ab8;
  --teal-neon: #00f5d4;
  --teal-neon-soft: #7dfff0;
  --violet-neon: #8a5cff;

  /* --- Gradients --- */
  --grad-gold: linear-gradient(135deg, #f4e2a8 0%, #d4af37 45%, #9c7a22 100%);
  --grad-women: linear-gradient(135deg, #ff3d81 0%, #b23a6f 50%, #2a0f1e 100%);
  --grad-men: linear-gradient(135deg, #00f5d4 0%, #1c6e63 50%, #0b1f1c 100%);
  --grad-hero: radial-gradient(circle at 30% 20%, rgba(255, 61, 129, 0.18), transparent 55%),
    radial-gradient(circle at 75% 70%, rgba(0, 245, 212, 0.14), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(212, 175, 55, 0.12), transparent 60%);
  --grad-card-hover: linear-gradient(135deg, rgba(212, 175, 55, 0.15), rgba(255, 61, 129, 0.08));

  /* --- Text --- */
  --text-primary: #f6f2e9;
  --text-secondary: #b9b4c9;
  --text-muted: #726e85;
  --text-on-gold: #1a1406;

  /* --- Typography --- */
  --font-fa: "Vazirmatn", "Vazirmatn FD", Tahoma, sans-serif;

  /* --- Shadows / glow --- */
  --shadow-soft: 0 8px 30px rgba(0, 0, 0, 0.45);
  --shadow-deep: 0 20px 60px rgba(0, 0, 0, 0.6);
  --glow-gold: 0 0 24px rgba(212, 175, 55, 0.35);
  --glow-rose: 0 0 28px rgba(255, 61, 129, 0.4);
  --glow-teal: 0 0 28px rgba(0, 245, 212, 0.4);

  /* --- Radii / spacing --- */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 7rem;

  /* --- Motion --- */
  --ease-lux: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 0.25s;
  --dur-med: 0.5s;
  --dur-slow: 0.9s;

  /* --- Layout --- */
  --container-max: 1400px;
  --header-h: 84px;
}