/* ============================================================
   tokens.css — THE THEME SURFACE
   This is the only file you re-skin to repurpose the flagship
   template for a new client. Swap the palette + fonts here,
   change the copy in index.html, and you have a new premium site.
   ============================================================ */
:root{
  /* ---- Brand palette · AM PM Care (sunset) ---- */
  --sun-1:#f8e9bd;  --sun-2:#f4cfa3;  --sun-3:#efc0ad;
  --sun-4:#e3a7a1;  --sun-5:#d98f93;
  --clay:#b1623a;   --clay-deep:#874627;      /* CTAs / accents — AA on white */
  --ink:#382a22;    --ink-soft:#5f4d43;  --ink-faint:#917f73;
  --cream:#fdf7ee;  --surface:#ffffff;  --surface-2:#fbf0e4;
  --frame:rgba(255,255,255,.74);
  --good:#6f9a5e;
  --line:rgba(56,42,34,.12);  --line-2:rgba(56,42,34,.2);

  /* ---- Typography ---- */
  --font-display:"Newsreader", Georgia, "Times New Roman", serif;
  --font-body:"Mulish", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Fluid type scale (Utopia-style clamp, 320 → 1240) */
  --step--1:clamp(.84rem, .81rem + .14vw, .92rem);
  --step-0 :clamp(1rem, .96rem + .2vw, 1.13rem);
  --step-1 :clamp(1.2rem, 1.1rem + .5vw, 1.5rem);
  --step-2 :clamp(1.45rem, 1.25rem + .95vw, 2.1rem);
  --step-3 :clamp(1.95rem, 1.55rem + 1.95vw, 3.1rem);
  --step-4 :clamp(2.5rem, 1.85rem + 3.1vw, 4.4rem);
  --step-5 :clamp(3.1rem, 2rem + 5.4vw, 6.6rem);

  /* ---- Space & layout ---- */
  --section:clamp(4.5rem, 3rem + 7vw, 9.5rem);
  --gutter:clamp(1.2rem, 4vw, 2.4rem);
  --maxw:1200px;
  --measure:64ch;

  /* ---- Radius / shadow ---- */
  --r-sm:12px; --r:20px; --r-lg:34px; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(56,42,34,.05), 0 10px 28px rgba(135,70,39,.07);
  --shadow-2:0 26px 60px rgba(135,70,39,.14);
  --shadow-3:0 44px 96px rgba(135,70,39,.2);

  /* ---- Motion ---- */
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur:.6s;
}