/* variables.css — Design Tokens */

:root {

  /* Colors */
  --color-gold:           #B8915A;
  --color-gold-light:     #F5EEE3;
  --color-gold-mid:       #D4B483;
  --color-sage:           #7A9E8A;
  --color-sage-light:     #EAF2EE;
  --color-sage-mid:       #A8C4B4;
  --color-cream:          #FAF6F0;
  --color-cream-dark:     #EDE8DF;
  --color-charcoal:       #2C2C2A;
  --color-charcoal-mid:   #4A4A47;
  --color-charcoal-light: #8A8A85;
  --color-white:          #FFFFFF;

  /* Typography Scale */
  --text-hero:  clamp(3rem, 7vw, 5.5rem);
  --text-h1:    clamp(2rem, 4vw, 3rem);
  --text-h2:    clamp(1.5rem, 2.5vw, 2rem);
  --text-h3:    1.2rem;
  --text-body:  1rem;
  --text-small: 0.875rem;
  --text-xs:    0.75rem;

  /* Line Heights */
  --leading-body:     1.75;
  --leading-heading:  1.15;

  /* Letter Spacing */
  --tracking-heading: 0.02em;

  /* Font Families */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* Spacing */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  4rem;
  --space-xl:  7rem;
  --space-xxl: 10rem;

  /* Max Widths */
  --max-width:        1200px;
  --max-width-narrow: 760px;

  /* Border Radius */
  --radius-sm:   4px;
  --radius-md:   10px;
  --radius-lg:   20px;
  --radius-pill: 100px;

  /* Shadows */
  --shadow-soft:   0 4px 24px rgba(44, 44, 42, 0.07);
  --shadow-card:   0 8px 40px rgba(44, 44, 42, 0.10);
  --shadow-lifted: 0 16px 60px rgba(44, 44, 42, 0.14);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 400ms ease;
}