/* Tailwise brand tokens — built on the Serenity skill (Bilvo), re-branded.
   Variable NAMES are kept from the skill so base.css keeps working; VALUES are Tailwise's.
   Fonts: <link href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght,SOFT@0,9..144,400..700,0..100;1,9..144,400..700,0..100&family=Figtree:wght@400;500;600;700;800&display=swap" rel="stylesheet"> */
:root {
  /* Neutrals */
  --cream: #FFFBF3;        /* page — warm white */
  --cream-btn: #FFFFFF;    /* text on the tangerine button */
  --sand: #FFF2D6;         /* soft sun panels, inner-page heroes, open FAQ */
  --cocoa: #4A5068;        /* body copy (slate) */
  --ink: #14213D;          /* headings, outlines, dark band, footer */
  --white: #FFFFFF;
  --line: rgba(20, 33, 61, 0.16);
  --line-soft: rgba(20, 33, 61, 0.09);

  /* Brand colours */
  --peach: #FF5A36;        /* TANGERINE — the one action colour + italic accent words */
  --peach-soft: rgba(255, 90, 54, 0.13);
  --butter: #FFC933;       /* SUN — marker swashes, big colour blocks, CTA band */
  --sage: #FF5A36;         /* primary button = tangerine */
  --sky: #7CC8FF;          /* sticky tags, chips */
  --mint: #8EE3BE;
  --lilac: #C8B6FF;
  --navy: #14213D;
  --tang-dark: #E8431F;

  /* Type */
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Figtree", system-ui, -apple-system, sans-serif;

  --fs-display: 76px;  --lh-display: 1.02; --ls-display: -2.6px;
  --fs-h1: 68px;       --lh-h1: 1.04;      --ls-h1: -2.2px;
  --fs-h2: 56px;       --lh-h2: 1.08;      --ls-h2: -1.8px;
  --fs-h2s: 46px;      --lh-h2s: 1.15;     --ls-h2s: -1.2px;
  --fs-h3: 40px;       --lh-h3: 1.15;      --ls-h3: -1px;
  --fs-h3s: 34px;      --lh-h3s: 1.18;     --ls-h3s: -.8px;
  --fs-h4: 24px;       --lh-h4: 1.3;       --ls-h4: -.4px;
  --lh-body: 1.65;

  /* Radii — rounder, friendlier than the skill */
  --r-xl: 36px;
  --r-lg: 28px;
  --r-md: 20px;
  --r-pill: 999px;

  /* Signature: crisp ink outline + offset shadow */
  --outline: 2px solid var(--ink);
  --pop: 6px 6px 0 var(--ink);
  --pop-sm: 4px 4px 0 var(--ink);

  --content: 1280px;
  --gutter: 24px;
  --section-gap: 140px;
  --glass: blur(14px);
  --ease: cubic-bezier(.2, .7, .2, 1);
}
@media (max-width: 1024px) {
  :root { --fs-display: 60px; --fs-h1: 54px; --fs-h2: 44px; --fs-h2s: 38px; --fs-h3: 34px; --fs-h3s: 30px; --section-gap: 104px; }
}
@media (max-width: 640px) {
  :root { --fs-display: 46px; --ls-display: -1.4px; --fs-h1: 42px; --ls-h1: -1.3px; --fs-h2: 36px; --ls-h2: -1px; --fs-h2s: 32px; --fs-h3: 28px; --fs-h3s: 26px; --fs-h4: 21px; --gutter: 16px; --section-gap: 80px; --pop: 4px 4px 0 var(--ink); }
}
