/* ========================================
   CAVALIER AGADIR - Design Tokens
   Moroccan Atlantic & Desert Luxury Palette
   ======================================== */

:root {
  /* Backgrounds */
  --bg-sand:         #F7F3EC;
  --bg-cream:        #FFFAF2;
  --bg-warm:         #EDE5D8;
  --bg-dark:         #111F19;
  --bg-dark-card:    #162820;

  /* Primary - Deep Atlantic & Desert Green */
  --desert:          #1E3A2F;
  --desert-light:    #2C5243;
  --desert-pale:     #DCEBE3;
  --desert-subtle:   #EDF5F1;
  --desert-dark:     #132620;
  --desert-deep:     #0D1A15;

  /* Accent - Warm Moroccan Amber & Gold */
  --amber:           #C27B2C;
  --amber-light:     #DF9638;
  --amber-dark:      #9E5E18;
  --amber-glow:      rgba(194, 123, 44, 0.22);
  --gold:            #D4A24C;
  --gold-light:      #F5C87A;
  --gold-pale:       #FBF3E3;

  /* Neutrals & Text */
  --ink:             #141A17;
  --ink-soft:        #2E3B35;
  --muted:           #62736A;
  --muted-light:     #8C9C93;
  --ghost:           rgba(20, 26, 23, 0.05);

  /* UI & Borders */
  --white:           #FFFFFF;
  --line:            rgba(30, 58, 47, 0.09);
  --line-strong:     rgba(30, 58, 47, 0.16);
  --overlay:         rgba(13, 26, 21, 0.78);

  /* Glassmorphism Tokens */
  --glass-bg:        rgba(255, 255, 255, 0.12);
  --glass-bg-hover:  rgba(255, 255, 255, 0.20);
  --glass-border:    rgba(255, 255, 255, 0.24);
  --glass-dark:      rgba(13, 26, 21, 0.65);
  --glass-dark-border: rgba(255, 255, 255, 0.12);

  /* Typography */
  --serif:           'Playfair Display', Georgia, serif;
  --sans:            'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Spacing */
  --space-2xs:       0.25rem;
  --space-xs:        0.5rem;
  --space-sm:        1rem;
  --space-md:        1.5rem;
  --space-lg:        2.5rem;
  --space-xl:        4.5rem;
  --space-2xl:       7rem;

  /* Radius */
  --radius-xs:       4px;
  --radius-sm:       8px;
  --radius:          14px;
  --radius-lg:       20px;
  --radius-xl:       28px;
  --radius-full:     9999px;

  /* Shadows */
  --shadow-xs:       0 1px 3px rgba(13, 26, 21, 0.04);
  --shadow-sm:       0 2px 10px rgba(13, 26, 21, 0.06);
  --shadow-md:       0 8px 24px rgba(13, 26, 21, 0.09);
  --shadow-lg:       0 18px 44px rgba(13, 26, 21, 0.13);
  --shadow-xl:       0 28px 64px rgba(13, 26, 21, 0.18);
  --shadow-glow:     0 8px 30px rgba(194, 123, 44, 0.35);
  --shadow-glow-lg:  0 14px 44px rgba(194, 123, 44, 0.45);
  --shadow-card:     0 10px 30px -6px rgba(13, 26, 21, 0.09), 0 0 0 1px rgba(30, 58, 47, 0.06);
  --shadow-card-hover: 0 20px 48px -10px rgba(13, 26, 21, 0.18), 0 0 0 1px rgba(194, 123, 44, 0.32);

  /* Gradients */
  --gradient-desert:  linear-gradient(135deg, #1E3A2F 0%, #11221B 100%);
  --gradient-gold:    linear-gradient(135deg, #C27B2C 0%, #E29E43 100%);
  --gradient-gold-warm: linear-gradient(135deg, #C27B2C 0%, #D4A24C 50%, #EFC278 100%);
  --gradient-glass:   linear-gradient(135deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.06) 100%);
  --gradient-card-overlay: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(13,26,21,0.85) 100%);

  /* Transitions */
  --ease-out:        cubic-bezier(0.22, 1, 0.36, 1);
  --duration:        0.35s;
}