/* ================================ */
/* DESIGN TOKENS / CSS VARIABLES     */
/* ================================ */
:root {
  /* ── Colors ── */
  --color-beige:          #EBE1D5;
  --color-beige-light:    #F4EDE4;
  --color-beige-lighter:  #FCF9F5;
  --color-beige-dark:     #C5A059;
  --color-gold:           #B88645;
  --color-gold-light:     #D4A96A;
  --color-brown:          #5C4B40;
  --color-brown-dark:     #2C2621;
  --color-black:          #1F1A17;
  --color-dark:           #141210;
  --color-dark-overlay:   rgba(20, 18, 16, 0.6);
  --color-white:          #FFFFFF;
  --color-white-soft:     #FAFAF7;
  --color-gray:           #8A8580;
  --color-gray-light:     #B5AFA8;

  /* ── Fonts ── */
  --font-heading:   'Barlow Condensed', 'Inter', sans-serif;
  --font-body:      'Inter', 'Montserrat', sans-serif;
  --font-serif:     'Playfair Display', 'Georgia', serif;

  /* ── Font Sizes ── */
  --fs-xs:     0.7rem;     /* 11px */
  --fs-sm:     0.8rem;     /* 13px */
  --fs-base:   0.925rem;   /* 15px */
  --fs-md:     1.05rem;    /* 17px */
  --fs-lg:     1.15rem;    /* 18px */
  --fs-xl:     1.5rem;     /* 24px */
  --fs-2xl:    2rem;       /* 32px */
  --fs-3xl:    2.5rem;     /* 40px */
  --fs-4xl:    3.5rem;     /* 56px */
  --fs-5xl:    4.5rem;     /* 72px */
  --fs-hero:   clamp(3rem, 8vw, 6rem);

  /* ── Spacing ── */
  --space-xs:    0.5rem;
  --space-sm:    1rem;
  --space-md:    1.5rem;
  --space-lg:    2rem;
  --space-xl:    3rem;
  --space-2xl:   4rem;
  --space-3xl:   5rem;
  --space-4xl:   6rem;
  --space-section: clamp(3rem, 5vw, 5rem);

  /* ── Layout ── */
  --container-max:   1400px;
  --container-pad:   clamp(1rem, 4vw, 3rem);
  --navbar-height:   48px;
  --border-radius:   8px;
  --border-radius-lg: 16px;

  /* ── Transitions ── */
  --ease-out:     cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-in-out:  cubic-bezier(0.42, 0, 0.58, 1);
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-fast:    0.2s;
  --duration-normal:  0.4s;
  --duration-slow:    0.6s;
  --duration-reveal:  0.8s;

  /* ── Shadows ── */
  --shadow-sm:   0 4px 12px rgba(44, 38, 33, 0.06);
  --shadow-md:   0 8px 24px rgba(44, 38, 33, 0.08);
  --shadow-lg:   0 16px 48px rgba(44, 38, 33, 0.12);
  --shadow-gold: 0 8px 24px rgba(184, 134, 69, 0.15);

  /* ── Z-Index ── */
  --z-base:      1;
  --z-sticky:    100;
  --z-overlay:   200;
  --z-modal:     300;
  --z-loader:    1000;
}