:root {
  /* Palette — Cream + ink + coral + sage */
  --c-bg:          #FAF6F0;   /* cream */
  --c-bg-soft:     #F4EEE2;   /* warm hover/zone shade */
  --c-cream-deep:  #F0E6D0;   /* deep cream for photo placeholders */
  --c-ink:         #1F2937;   /* deep charcoal */
  --c-ink-soft:    rgba(31, 41, 55, 0.65);
  --c-ink-faint:   rgba(31, 41, 55, 0.14);
  --c-accent:      #FF8B75;   /* warm coral */
  --c-accent-deep: #E06B54;   /* deep coral — hover, deeper emphasis */
  --c-secondary:   #86B04A;   /* muted sage */
  --c-secondary-deep: #678538;

  /* Typography */
  --ff-display: "Fraunces", ui-serif, Georgia, serif;
  --ff-body:    "Inter Tight", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

  /* Fluid type scale */
  --fs-hero:       clamp(4.5rem, 15vw, 12rem);
  --fs-display-xl: clamp(2.8rem, 7vw, 5.5rem);
  --fs-display-lg: clamp(2rem, 4.5vw, 3.25rem);
  --fs-display-md: clamp(1.4rem, 2.5vw, 2rem);
  --fs-body-lg:    clamp(1.05rem, 1.3vw, 1.2rem);
  --fs-body:       1rem;
  --fs-small:      0.9rem;
  --fs-kicker:     0.8rem;

  /* Spacing */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.25rem;
  --space-xl:  3.5rem;
  --space-2xl: 5rem;
  --space-section: clamp(4rem, 10vw, 8rem);

  /* Layout */
  --container:       75rem;
  --container-narrow: 42rem;
  --gutter:          clamp(1rem, 3vw, 2rem);
  --radius:          4px;
  --radius-sm:       2px;

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 180ms;
  --dur:      320ms;
  --dur-slow: 520ms;

  /* Breakpoints (reference only; use in @media) */
  --bp-tablet: 48rem;
  --bp-desk:   64rem;

  /* Z */
  --z-nav:      20;
  --z-overlay:  90;
  --z-lightbox: 100;

  color-scheme: light;
}