/* ============================================
   GABRIEL TOUR — Design Tokens
   ============================================ */

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

:root {
  /* ---- Primary: Dark luxury base ---- */
  --color-midnight:     #0B1623;
  --color-charcoal:     #1A2332;
  --color-slate:        #2D3A4A;

  /* ---- Accent: Evolved teal + luxury gold ---- */
  --color-teal:         #0D9488;
  --color-teal-light:   #14B8A6;
  --color-teal-dark:    #0A7A70;
  --color-teal-soft:    rgba(13, 148, 136, 0.12);
  --color-gold:         #C9A84C;
  --color-gold-light:   #DFC06B;
  --color-gold-soft:    rgba(201, 168, 76, 0.12);

  /* ---- Surfaces ---- */
  --color-white:        #FFFFFF;
  --color-ivory:        #F8F6F1;
  --color-pearl:        #EDE9E1;
  --color-mist:         #D5CFC5;

  /* ---- Text ---- */
  --color-text-primary:   #0B1623;
  --color-text-secondary: #5A6577;
  --color-text-muted:     #8A94A3;
  --color-text-inverse:   #F8F6F1;

  /* ---- Functional ---- */
  --color-whatsapp:     #25D366;
  --color-whatsapp-dark:#1DA851;
  --color-price:        #0D9488;
  --color-badge-hot:    #E85D3A;
  --color-success:      #10B981;
  --color-warning:      #F59E0B;

  /* ---- Typography ---- */
  --font-display:   'Playfair Display', Georgia, serif;
  --font-body:      'DM Sans', system-ui, sans-serif;
  --font-accent:    'Cormorant Garamond', Georgia, serif;

  /* ---- Type Scale (fluid) ---- */
  --text-xs:    clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
  --text-sm:    clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
  --text-base:  clamp(0.938rem, 0.875rem + 0.25vw, 1rem);
  --text-lg:    clamp(1.05rem, 0.95rem + 0.5vw, 1.25rem);
  --text-xl:    clamp(1.2rem, 1rem + 1vw, 1.5rem);
  --text-2xl:   clamp(1.5rem, 1.2rem + 1.5vw, 2rem);
  --text-3xl:   clamp(1.8rem, 1.4rem + 2vw, 2.75rem);
  --text-4xl:   clamp(2.2rem, 1.6rem + 3vw, 3.75rem);
  --text-hero:  clamp(2.8rem, 2rem + 4vw, 5rem);

  /* ---- Spacing ---- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* ---- Layout ---- */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1280px;
  --container-max: 1440px;

  /* ---- Border Radius ---- */
  --radius-sm:   0.375rem;
  --radius-md:   0.625rem;
  --radius-lg:   1rem;
  --radius-xl:   1.5rem;
  --radius-full: 9999px;

  /* ---- Shadows ---- */
  --shadow-sm:    0 1px 2px rgba(11, 22, 35, 0.06);
  --shadow-md:    0 4px 12px rgba(11, 22, 35, 0.08);
  --shadow-lg:    0 8px 30px rgba(11, 22, 35, 0.12);
  --shadow-xl:    0 20px 60px rgba(11, 22, 35, 0.16);
  --shadow-glow:  0 0 40px rgba(13, 148, 136, 0.15);

  /* ---- Transitions ---- */
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:  cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:   150ms;
  --duration-normal: 300ms;
  --duration-slow:   600ms;

  /* ---- Z-index ---- */
  --z-base:      1;
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-header:    300;
  --z-overlay:   400;
  --z-modal:     500;
  --z-floating:  600;
}
