/* ============================================================
   DUBAI HOLIDAY — ARABIAN PEARL EDITION
   ─────────────────────────────────────────────────────────────
   Palette: Warm Ivory + Rich Copper-Bronze + Dusty Terracotta
   Feel: Burj Al Arab · One&Only · Jumeirah · 5-star luxury
   NO dark theme · NO golden-yellow · Light, luminous, premium
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Jost:wght@200;300;400;500;600;700&family=Cinzel:wght@400;500;600&display=swap');

:root {

  /* ═══════════════════════════════════════
     COPPER-BRONZE — Primary Accent
     Rich, warm, premium — not yellow-gold
  ═══════════════════════════════════════ */
  --gold:           #9B6A3E;
  --gold-light:     #B8834F;
  --gold-bright:    #D4A06A;
  --gold-dim:       #7A5230;
  --gold-glow:      rgba(155,106,62,0.10);
  --gold-glow-hard: rgba(155,106,62,0.22);
  --gold-line:      rgba(155,106,62,0.18);

  /* ═══════════════════════════════════════
     IVORY-PEARL — Base Backgrounds
     The creamy luxury of premium hotels
  ═══════════════════════════════════════ */
  --ink:            #FBF7F2;
  --ink2:           #F5EEE4;
  --ink3:           #EDE3D5;
  --ink4:           #E4D7C4;
  --ink5:           #D8C8AE;

  /* ═══════════════════════════════════════
     TEXT — Warm Deep Charcoal
     Not pure black — softer, more elegant
  ═══════════════════════════════════════ */
  --ivory:          #2A1F14;
  --ivory2:         #3C2D1E;
  --ivory-dim:      rgba(42,31,20,0.62);
  --ivory-muted:    rgba(42,31,20,0.42);
  --ivory-ghost:    rgba(42,31,20,0.09);
  --white:          #FEF9F4;

  /* ═══════════════════════════════════════
     TERRACOTTA ACCENT — Desert Warmth
  ═══════════════════════════════════════ */
  --terra:          #C4694A;
  --terra-light:    #D8836A;
  --terra-glow:     rgba(196,105,74,0.12);

  /* ═══════════════════════════════════════
     OASIS TEAL — Contrast Accent (Rare)
  ═══════════════════════════════════════ */
  --azure:          #4A8A96;
  --azure-light:    #62A4B0;

  /* ═══════════════════════════════════════
     BORDERS
  ═══════════════════════════════════════ */
  --border-gold:    rgba(155,106,62,0.18);
  --border-gold2:   rgba(155,106,62,0.34);

  /* ═══════════════════════════════════════
     TYPOGRAPHY — Regal & Modern
  ═══════════════════════════════════════ */
  --font-display:   'Playfair Display', Georgia, serif;
  --font-body:      'Jost', system-ui, sans-serif;
  --font-accent:    'Cinzel', Georgia, serif;

  /* ═══════════════════════════════════════
     SHADOWS
  ═══════════════════════════════════════ */
  --shadow-soft:    0 8px 48px rgba(80,50,20,0.12);
  --shadow-hover:   0 24px 72px rgba(80,50,20,0.20);
  --shadow-gold:    0 0 48px rgba(155,106,62,0.18);
  --shadow-card:    0 4px 32px rgba(80,50,20,0.10);

  /* ═══════════════════════════════════════
     RADIUS
  ═══════════════════════════════════════ */
  --radius-sm:      4px;
  --radius:         8px;
  --radius-md:      16px;
  --radius-lg:      28px;

  /* ═══════════════════════════════════════
     MOTION
  ═══════════════════════════════════════ */
  --ease:           cubic-bezier(0.22, 1, 0.36, 1);
  --trans:          all 0.38s var(--ease);
  --trans-fast:     all 0.22s var(--ease);

  /* ═══════════════════════════════════════
     NAVBAR & HEADER — Arabian Pearl
     Transparent on hero →
     Scrolled: crisp warm ivory solid
     Sub-nav: soft pearl stripe
  ═══════════════════════════════════════ */
  --nav-bg-scrolled:      rgba(252,247,240,0.97);
  --nav-bg-subnav:        rgba(244,237,226,0.96);
  --nav-subnav-border:    rgba(155,106,62,0.16);
  --nav-link-color:       rgba(42,31,20,0.75);
  --nav-link-hover:       #9B6A3E;
  --nav-hamburger:        #9B6A3E;

  /* Trust bar — deep warm bronze stripe */
  --trustbar-bg-from:     #3A2510;
  --trustbar-bg-mid:      #4C3018;
  --trustbar-bg-to:       #3A2510;
  --trustbar-text:        rgba(245,230,210,0.80);
  --trustbar-icon:        #D4A06A;

  /* Logo */
  --logo-mark-bg-from:    #EDE3D5;
  --logo-mark-bg-to:      #E4D7C4;
  --logo-brand-color:     #2A1F14;
  --logo-tagline-color:   rgba(42,31,20,0.44);

  /* Mobile menu */
  --mobilemenu-bg:        #FAF5EE;
  --mobilemenu-text:      rgba(42,31,20,0.82);
  --mobilemenu-border:    rgba(155,106,62,0.14);
}