/* ═══════════════════════════════════════════════════════════════
   RAINORA V2 — DESIGN SYSTEM
   "Warm Luxury" Palette & Complete Token System
═══════════════════════════════════════════════════════════════ */

:root {
  /* ─── Color: Gold (Primary) ─── */
  --gold-50:  #FDF8F0;
  --gold-100: #F9EDDA;
  --gold-200: #F0D9A8;
  --gold-300: #E0C080;
  --gold-400: #D4A95C;
  --gold-500: #C49A4B;
  --gold-600: #A87D3E;
  --gold-700: #8B6530;
  --gold-800: #6E4F25;
  --gold-900: #523B1C;

  /* ─── Color: Rose (Accent) ─── */
  --rose-50:  #FDF2F5;
  --rose-100: #FCE4EA;
  --rose-200: #F9C5D3;
  --rose-300: #F0A0B5;
  --rose-400: #E07898;
  --rose-500: #CF5E80;
  --rose-600: #B54468;
  --rose-700: #943555;
  --rose-800: #7A2C47;
  --rose-900: #5E2238;

  /* ─── Color: Neutral ─── */
  --gray-50:  #FAFAF9;
  --gray-100: #F5F3F0;
  --gray-200: #E8E4DE;
  --gray-300: #D4CEC4;
  --gray-400: #A8A090;
  --gray-500: #7A7268;
  --gray-600: #5C554C;
  --gray-700: #3E3832;
  --gray-800: #2A2420;
  --gray-900: #1A1614;

  /* ─── Color: Semantic ─── */
  --success:    #2D8F6F;
  --success-bg: #E8F5EE;
  --warning:    #D4A95C;
  --warning-bg: #FFF8E1;
  --danger:     #C4534A;
  --danger-bg:  #FDECEA;
  --info:       #5B7CC4;
  --info-bg:    #EBF0FA;

  /* ─── Gradients ─── */
  --gradient-luxury:   linear-gradient(135deg, #C49A4B, #A87D3E);
  --gradient-cta:      linear-gradient(120deg, #C49A4B 0%, #D4A95C 50%, #E0C080 100%);
  --gradient-hero:     linear-gradient(160deg, #1A1614 0%, #2A2420 50%, #3E3832 100%);
  --gradient-gold-soft: linear-gradient(135deg, rgba(196,154,75,.08), rgba(212,169,92,.04));
  --gradient-rose-soft: linear-gradient(135deg, rgba(207,94,128,.08), rgba(224,120,152,.04));
  --gradient-footer:   linear-gradient(180deg, #1A1614 0%, #0F0D0B 100%);
  --gradient-glass:    linear-gradient(135deg, rgba(255,255,255,.72), rgba(255,255,255,.48));

  /* ─── Typography ─── */
  --font-sans:  'Vazirmatn', ui-sans-serif, system-ui, sans-serif;
  --font-serif: 'Vazirmatn', Georgia, serif;
  --font-display: 'Vazirmatn', Georgia, serif;

  /* ─── Type Scale ─── */
  --text-display-1: clamp(42px, 7vw, 80px);
  --text-display-2: clamp(32px, 5vw, 56px);
  --text-h1:        clamp(26px, 4vw, 44px);
  --text-h2:        clamp(22px, 3vw, 34px);
  --text-h3:        clamp(18px, 2vw, 24px);
  --text-body-lg:   18px;
  --text-body:      16px;
  --text-body-sm:   14px;
  --text-caption:   12px;
  --text-overline:  11px;

  /* ─── Line Heights ─── */
  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.6;
  --leading-relaxed: 1.75;

  /* ─── Spacing Scale ─── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* ─── Border Radius ─── */
  --radius-xs:   6px;
  --radius-sm:   10px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 999px;

  /* ─── Shadows ─── */
  --shadow-xs:   0 1px 2px rgba(26,22,20,.05);
  --shadow-sm:   0 2px 8px rgba(26,22,20,.07);
  --shadow-md:   0 4px 16px rgba(26,22,20,.10);
  --shadow-lg:   0 8px 32px rgba(26,22,20,.14);
  --shadow-xl:   0 16px 64px rgba(26,22,20,.18);
  --shadow-glow: 0 0 40px rgba(196,154,75,.25);
  --shadow-card: 0 2px 12px rgba(26,22,20,.06);
  --shadow-card-hover: 0 12px 40px rgba(26,22,20,.14);

  /* ─── Transitions ─── */
  --ease:        cubic-bezier(.2,.75,.2,1);
  --ease-spring: cubic-bezier(.18,.89,.32,1.28);
  --ease-bounce: cubic-bezier(.34,1.56,.64,1);
  --duration-fast:   150ms;
  --duration-normal: 250ms;
  --duration-slow:   400ms;
  --duration-slower: 600ms;

  /* ─── Layout ─── */
  --container:    1280px;
  --container-sm: 960px;
  --nav-h:        72px;
  --bottom-nav-h: 64px;

  /* ─── Semantic Tokens (Light) ─── */
  --bg:            #FDFBF8;
  --bg-secondary:  #F5F3F0;
  --surface:       #FFFFFF;
  --surface-2:     #FAFAF9;
  --border:        rgba(26,22,20,.08);
  --border-strong: rgba(26,22,20,.15);
  --text:          #1A1614;
  --text-secondary: #5C554C;
  --text-muted:    #7A7268;
  --text-inverse:  #FDFBF8;
  --accent:        var(--gold-500);
  --accent-light:  var(--gold-400);
  --accent-dark:   var(--gold-600);
  --cta:           var(--gradient-cta);
  --blur:          blur(16px) saturate(1.2);
  --glass-bg:      rgba(255,255,255,.65);
  --glass-border:  rgba(255,255,255,.7);
  --nav-bg:        rgba(253,251,248,.82);
}

/* ═══ DARK MODE ═══ */
[data-theme="dark"] {
  --bg:            #0F0D0B;
  --bg-secondary:  #1A1614;
  --surface:       #1E1A16;
  --surface-2:     #2A2420;
  --border:        rgba(245,240,232,.08);
  --border-strong: rgba(245,240,232,.15);
  --text:          #F5F0E8;
  --text-secondary: #B8B0A4;
  --text-muted:    #8A8278;
  --text-inverse:  #1A1614;
  --accent:        var(--gold-400);
  --accent-light:  var(--gold-300);
  --accent-dark:   var(--gold-500);
  --shadow-xs:   0 1px 2px rgba(0,0,0,.2);
  --shadow-sm:   0 2px 8px rgba(0,0,0,.25);
  --shadow-md:   0 4px 16px rgba(0,0,0,.3);
  --shadow-lg:   0 8px 32px rgba(0,0,0,.35);
  --shadow-xl:   0 16px 64px rgba(0,0,0,.4);
  --shadow-card: 0 2px 12px rgba(0,0,0,.2);
  --shadow-card-hover: 0 12px 40px rgba(0,0,0,.35);
  --glass-bg:      rgba(30,26,22,.7);
  --glass-border:  rgba(255,255,255,.06);
  --nav-bg:        rgba(15,13,11,.85);
  --gradient-glass: linear-gradient(135deg, rgba(30,26,22,.8), rgba(30,26,22,.6));
  --success-bg: rgba(45,143,111,.12);
  --warning-bg: rgba(212,169,92,.12);
  --danger-bg:  rgba(196,83,74,.12);
  --info-bg:    rgba(91,124,196,.12);
}

/* ═══ RESPONSIVE CONTAINER ═══ */
@media (min-width:1800px) {
  :root { --container: 1480px; --nav-h: 80px; }
}