/* Tokens — the Medic 128 system (measured), recoloured from the Netram logo.
   Palette (client, 26 Sep 2026): lavender page ground #E6E6FA, lavender-purple brand, and the client's "happy colours"
   (orange, yellow, aqua, lilac, mint) as accents. Happy colours are light: they always carry --ink text/icons, never white. */
:root {
  /* colour */
  --ink: #383434;                 /* headings, footer ground  (Medic #223645); 10:1 on --ground */
  --grey: #5A5566;                /* paragraphs: purple-grey, 5.8:1 on --ground, 7.2:1 on white */
  --link: #222222;                /* nav links                (Medic #222222) */
  --rose: #6F52A0;                /* brand: lavender purple; white text on it 6.2:1, as text on --ground 5.0:1 */
  --rose-tint: rgba(111, 82, 160, .14);
  --rose-light: #F1EEFA;          /* button hover text on lavender */
  --plum: #4F3A80;                /* deep block: deep lavender; 9.3:1 with white */
  --amber: #FF9A54;               /* accent: happy orange; --ink on it 5.9:1 — never white text (2.1:1) */
  --gold: #FFEA6B;                /* happy yellow for lines and headings on the lavender bands (5.1:1 on --rose) */
  --amber-text: #A04608;          /* deep orange for small icons and tags on white (6.2:1) and on --ground (5.1:1) */
  --paper: #F4F3FD;               /* light lavender wash for panels inside white cards */
  --white: #FFFFFF;
  --ground: #E6E6FA;              /* page ground: lavender (client's colour, 26 Sep 2026) */

  /* happy colours (client, 26 Sep 2026) — fills for chips, rings, icons, cards; pair with --ink */
  --happy-orange: #FF9A54;
  --happy-yellow: #FFEA6B;
  --happy-aqua: #54FEFB;
  --happy-lilac: #E7B2FF;
  --happy-mint: #89FFCB;
  --amber-tint: rgba(255, 154, 84, .25);   /* soft orange glow (map pin ring) */
  --wash: #F1E7FD;                /* the big decorative circle: a soft lilac highlight on the lavender ground */
  --line-nav: rgba(0, 0, 0, .2);
  --line-row: rgba(56, 52, 52, .2);
  --line-input: #8C8899;          /* form field borders: 3.4:1 on white (WCAG 1.4.11 needs 3:1) */
  --line-card: rgba(0, 0, 0, .1);

  /* type */
  --font: "Poppins", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --deva: "Noto Sans Devanagari", "Nirmala UI", "Kohinoor Devanagari", sans-serif;
  --h1: 76px; --h1-lh: 91.2px;
  --h2: 46px; --h2-lh: 59.8px;
  --h3: 24px; --h3-lh: 28.8px;
  --h3-lg: 26px; --h3-lg-lh: 31.2px;
  --num: 40px; --num-lh: 52px;
  --p: 16px; --p-lh: 24px;
  --nav: 18px;
  --btn: 18px;
  --eyebrow: 14px;
  --small: 14px;

  /* layout */
  --container: 1200px;
  --gutter: 15px;
  --sec: 120px;                   /* section padding-bottom */
  --sec-band-top: 120px; --sec-band-bottom: 200px;
  --footer-top: 80px; --footer-bottom: 40px;
  --hero-top: 40px;

  /* radii */
  --r-card: 10px; --r-block: 20px; --r-btn: 50px; --r-row: 80px;

  /* shadows — Medic has three */
  --sh-card: 0 0 20px -1px rgba(0, 0, 0, .1);
  --sh-float: 0 20px 40px rgba(0, 0, 0, .1);
  --sh-btn: 0 5px 30px rgba(111, 82, 160, .3);
  --sh-amber: 0 5px 30px rgba(255, 154, 84, .35);

  /* motion — Save a Child's Heart recipes */
  --ease-sach: cubic-bezier(0, 0, 0, 1);       /* their (0,.003,0,1.003): instant start, long settle */
  --ease-out: cubic-bezier(.25, 1, .5, 1);     /* outQuart */
  --ease-outsine: cubic-bezier(.61, 1, .88, 1);
  --rv-move: 1200ms; --rv-fade: 1000ms;
  --ui: 300ms;
}
@media (max-width: 991px) {
  :root { --h1: 50px; --h1-lh: 60px; --h2: 40px; --h2-lh: 52px; --sec: 60px; --sec-band-top: 60px; --sec-band-bottom: 130px; --footer-top: 60px; }
}
/* the smallest phones (≤380px): a step down in heading size so long words fit */
@media (max-width: 380px) {
  :root { --h1: 40px; --h1-lh: 48px; --h2: 32px; --h2-lh: 40px; }
}
