/* ============================================================
   Public Interest Technology — Design Tokens (v3)
   Mercury-inspired: near-white canvas, soft pastel aurora,
   one refined sans, generous space, dark pill CTAs.
   ============================================================ */

:root {
  /* --- Surfaces --- */
  --bg:        #FFFFFF;
  --bg-soft:   #F6F6FB;  /* alternating sections */
  --bg-tint:   #FBFBFE;
  --surface:   #FFFFFF;

  /* --- Ink (cool near-black) --- */
  --ink:    #14161E;  /* headings */
  --ink-2:  #383D4A;  /* strong body */
  --ink-3:  #646B7B;  /* body / muted */
  --ink-4:  #656B79;  /* captions (AA on white & soft) */
  --on-dark:    #F4F4F8;
  --on-dark-2:  #B9BDCB;

  /* --- Lines --- */
  --line:   #ECECF1;
  --line-2: #E1E1EA;

  /* --- Accent: refined iris --- */
  --accent:        #5B5BD6;
  --accent-strong: #4A47C7;
  --accent-soft:   #EDECFC;
  --accent-ink:    #4038B8;  /* text-safe accent on light */

  /* --- Action (dark CTA, Mercury-style) --- */
  --btn:       #15171E;
  --btn-hover: #000000;

  /* --- Pastel families (decorative tiles / gradient stops) --- */
  --lav:  #ECE9FF; --lav-ink:  #4F3FD6;
  --peach:#FFE7D6; --peach-ink:#A6531B;
  --mint: #D8F2E6; --mint-ink: #14774C;
  --sky:  #E2ECFF; --sky-ink:  #2A55C2;
  --butter:#FFF1CC; --butter-ink:#876200;
  --rose: #FFE2EC; --rose-ink: #AE3A63;

  /* Discipline -> pastel mapping */
  --c-build:  var(--sky);   --c-build-ink:  var(--sky-ink);
  --c-train:  var(--peach); --c-train-ink:  var(--peach-ink);
  --c-govern: var(--lav);   --c-govern-ink: var(--lav-ink);
  --c-inform: var(--rose);  --c-inform-ink: var(--rose-ink);
  --c-grow:   var(--mint);  --c-grow-ink:   var(--mint-ink);

  /* --- Typography --- */
  --font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --fs-hero:    clamp(2.6rem, 5.4vw, 4.4rem);
  --fs-h2:      clamp(1.95rem, 3.4vw, 3rem);
  --fs-h3:      clamp(1.25rem, 1.6vw, 1.5rem);
  --fs-lead:    clamp(1.1rem, 1.5vw, 1.35rem);
  --fs-body:    1.0625rem;
  --fs-sm:      0.9375rem;
  --fs-cap:     0.8125rem;
  --lh-body:    1.6;

  /* --- Radii --- */
  --r-sm: 10px;
  --r:    16px;
  --r-lg: 22px;
  --r-xl: 30px;
  --r-pill: 999px;

  /* --- Shadows (soft, premium) --- */
  --shadow-sm: 0 1px 2px rgba(20,22,30,0.05);
  --shadow:    0 10px 34px -14px rgba(20,22,30,0.16), 0 2px 6px -2px rgba(20,22,30,0.06);
  --shadow-lg: 0 40px 80px -32px rgba(20,22,30,0.24), 0 12px 28px -16px rgba(20,22,30,0.12);

  /* --- Spacing --- */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px; --s-11:160px;

  /* --- Layout --- */
  --container: 1160px;
  --container-wide: 1280px;
  --pad: 24px;

  /* --- Motion --- */
  --ease: cubic-bezier(.22,.8,.26,1);
  --dur-1: 160ms;
  --dur-2: 280ms;
  --dur-3: 520ms;

  /* per-page accent default */
  --accent-page: var(--accent);
  --accent-page-ink: var(--accent-ink);
  --accent-page-soft: var(--accent-soft);
}

/* Per-page accent theming */
body[data-accent="build"]  { --accent-page: var(--sky-ink);   --accent-page-ink: var(--sky-ink);   --accent-page-soft: var(--sky); }
body[data-accent="train"]  { --accent-page: var(--peach-ink); --accent-page-ink: var(--peach-ink); --accent-page-soft: var(--peach); }
body[data-accent="govern"] { --accent-page: var(--lav-ink);   --accent-page-ink: var(--lav-ink);   --accent-page-soft: var(--lav); }
body[data-accent="inform"] { --accent-page: var(--rose-ink);  --accent-page-ink: var(--rose-ink);  --accent-page-soft: var(--rose); }
body[data-accent="grow"]   { --accent-page: var(--mint-ink);  --accent-page-ink: var(--mint-ink);  --accent-page-soft: var(--mint); }
