/**
 * DESIGN TOKENS
 * Palette pulled from the clinic's own brand: the promo-banner gradient
 * (cream → olive) and the gold ribbon used behind their "Book Now" CTAs.
 * Change a value here to re-theme the entire site.
 */
:root{
  /* Brand palette */
  --color-cream:        #FFF6DE;   /* warm cream — hero backdrop */
  --color-cream-deep:    #F4E9BE;
  --color-olive:         #585D55;  /* deep olive-charcoal — backdrop / text on cream */
  --color-olive-deep:    #3B3F38;
  --color-gold:           #ECC31F; /* signature accent — CTAs, ribbons, active states */
  --color-gold-deep:      #C9A417;
  --color-clay:            #B65C3D; /* secondary accent for links/hover, warm skin tone */
  --color-ink:               #21231F;  /* body text */
  --color-paper:              #FFFDF7;  /* card/page background */
  --color-line:                 #E7E0CC;  /* hairlines, borders */
  --color-muted:                  #6E6A5B;  /* secondary text */

  /* Type */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Lora", Georgia, serif;
  --font-ui: "Arimo", "Helvetica Neue", Arial, sans-serif;

  --fs-h1: clamp(2.2rem, 1.4rem + 3.2vw, 3.6rem);
  --fs-h2: clamp(1.7rem, 1.2rem + 2vw, 2.6rem);
  --fs-h3: clamp(1.2rem, 1rem + 0.8vw, 1.5rem);
  --fs-eyebrow: 0.8rem;
  --fs-body: 1.05rem;
  --fs-small: 0.9rem;

  /* Spacing / layout */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 2rem;
  --space-lg: 4rem;
  --space-xl: 6rem;
  --radius: 14px;
  --radius-lg: 26px;
  --max-width: 1220px;
  --shadow-soft: 0 18px 40px -20px rgba(33,35,31,0.35);
  --shadow-card: 0 8px 24px -12px rgba(33,35,31,0.25);

  --ease: cubic-bezier(.4,0,.2,1);
}