/* ============================================================
   Design tokens
   ============================================================ */
:root {
  /* Color */
  --c-bg:           #F6F2EA;   /* warm cream page */
  --c-bg-2:         #EFE9DC;   /* slightly deeper cream */
  --c-surface:      #FFFFFF;   /* cards */
  --c-ink:          #20271F;   /* primary text */
  --c-ink-soft:     #3A4237;
  --c-muted:        #5E665A;   /* secondary text */
  --c-primary:      #2C4A38;   /* evergreen */
  --c-primary-deep: #1C3024;
  --c-primary-soft: #E3EAE2;
  --c-accent:       #B0573B;   /* terracotta */
  --c-accent-deep:  #8F4530;
  --c-accent-soft:  #E8D7C5;
  --c-line:         #E4DCCF;   /* hairlines on cream */
  --c-line-dark:    rgba(255,255,255,.16);
  --c-focus:        #B0573B;
  --c-panel:        #1C3024;   /* dark section / page-head / CTA background */

  /* Typography */
  --font-serif: "Cormorant Garamond", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-sans:  "Mulish", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Fluid type scale (min 320px → max ~1180px) */
  --step--1: clamp(0.83rem, 0.80rem + 0.15vw, 0.92rem);
  --step-0:  clamp(1.00rem, 0.96rem + 0.20vw, 1.0625rem);
  --step-1:  clamp(1.20rem, 1.12rem + 0.40vw, 1.40rem);
  --step-2:  clamp(1.45rem, 1.30rem + 0.75vw, 1.95rem);
  --step-3:  clamp(1.80rem, 1.55rem + 1.25vw, 2.75rem);
  --step-4:  clamp(2.20rem, 1.80rem + 2.00vw, 3.75rem);
  --step-5:  clamp(2.70rem, 2.00rem + 3.40vw, 5.00rem);

  /* Spacing scale */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;   --sp-6: 2rem;     --sp-7: 3rem;     --sp-8: 4rem;
  --sp-9: 6rem;     --sp-10: 8rem;

  /* Radius */
  --r-sm: 4px;  --r-md: 10px;  --r-lg: 18px;  --r-pill: 999px;

  /* Shadow (soft, low) */
  --sh-1: 0 1px 2px rgba(28,48,36,.05), 0 6px 18px rgba(28,48,36,.06);
  --sh-2: 0 10px 40px rgba(28,48,36,.14);

  /* Layout */
  --w-page: 1180px;
  --w-text: 66ch;
  --gutter: clamp(1.1rem, 4vw, 3rem);
  --header-h: 76px;

  /* Motion */
  --ease: cubic-bezier(.2,.7,.2,1);
  --t-fast: .18s;
  --t-med: .35s;
}
