/* =========================================================================
   AthenaCalm - colour scheme (per theme; the Athena family's shared theme.css
   reads only these names. Source: the handoff's tokens.css, "SCHEME
   Athena-Calm")

   Athena - Calm: the same green and yellow as Athena, with soft tints and
   deep-shade numbers (8:1 or better) instead of saturated fills.

   BRAND LOOK sets four values (Site Admin > Brand Look); the platform injects
   them as --cs-brand-primary / --cs-brand-secondary (+ -text, its readable
   black or white partner) / --cs-font-heading / --cs-font-body. Everything is
   derived here, in CSS, so the live site, the Sections preview and the Pages
   editor agree.
     Stock (Brand Look colour unset): the hand-tuned values after the commas.
     Brand (the client set a colour): every "-bl" value below - tints and
     deep shades of the client's colours, keeping the soft-tint, deep-number
     look. A "-bl" value references a --cs-brand-* token with NO fallback, so
     it is invalid while that token is unset, and var(--x-bl, stock) falls
     back to the stock value (THEME_BUILD_GUIDE gotcha 13). The primary and
     the secondary switch independently.
   --primary-ink: the brand primary with its OKLCH lightness capped at 0.55,
   so white text on it (buttons) and the primary as small text both reach
   4.5:1. The raw primary is used only for large fills.
   ========================================================================= */
:root {
	--brand-primary: var(--cs-brand-primary, #167A4C);
	--brand-secondary: var(--cs-brand-secondary, #FFC107);
	--primary-ink-bl: oklch(from var(--cs-brand-primary) min(l, 0.55) c h);
	--primary-ink: var(--primary-ink-bl, #167A4C);
	--on-primary: var(--cs-brand-primary-text, #fff);
	--on-secondary: var(--cs-brand-secondary-text, #212529);

	/* Brand Look versions of the tints and deep shades */
	--soft-bl: color-mix(in srgb, var(--primary-ink-bl) 14%, #fff);
	--deep-bl: color-mix(in srgb, var(--primary-ink-bl) 62%, #000);
	--accent-1-bl: color-mix(in srgb, var(--cs-brand-primary) 72%, #000);
	--accent-2-bl: color-mix(in srgb, var(--cs-brand-secondary) 35%, #1B1F23);

	/* Impact tiles: bg / number / label (tiles 1-3 are also the "Ways to get involved" circles) */
	--t1-bg: var(--soft-bl, #DEECE6);  --t1-num: var(--deep-bl, #0E4C2F);  --t1-fg: #212529;   /* 8.24:1 */
	--t2-bg: var(--t2-bg-bl, #F8E2E4); --t2-num: var(--t2-num-bl, #801D26); --t2-fg: #212529;  /* 8.01:1 */
	--t3-bg: var(--t3-bg-bl, #DDE9FB); --t3-num: var(--t3-num-bl, #073D8D); --t3-fg: #212529;  /* 8.31:1 */
	--t4-bg: var(--t4-bg-bl, #FFECB5); --t4-num: #212529;                   --t4-fg: #212529;  /* 13.16:1 */
	--t2-bg-bl: color-mix(in srgb, var(--accent-1-bl) 14%, #fff);
	--t2-num-bl: color-mix(in srgb, var(--accent-1-bl) 62%, #000);
	--t3-bg-bl: color-mix(in srgb, var(--accent-2-bl) 14%, #fff);
	--t3-num-bl: color-mix(in srgb, var(--accent-2-bl) 62%, #000);
	--t4-bg-bl: color-mix(in srgb, var(--cs-brand-secondary) 30%, #fff);

	--mission-bg: var(--soft-bl, #DEECE6); --mission-fg: var(--deep-bl, #0E4C2F); --mission-eyebrow: var(--deep-bl, #0E4C2F);
	--quotes-bg: var(--t2-bg);  --quotes-fg: #212529;  --quotes-eyebrow: var(--t2-num);
	--card-edge: var(--primary-ink-bl, #0C63E4);  --card-link: var(--primary-ink-bl, #0C63E4);  --cause-eyebrow: var(--primary-ink-bl, #0C63E4);   /* 5.36:1 */
	--date-bg: var(--primary-soft); --date-fg: var(--primary-deep);

	--band: #F8F9FA;
	--footer: #212529;  --footer-text: #C4C9CE;      /* text 9.25:1 */
	--footer-mark: var(--footer-mark-bl, #8BBFA6);
	--footer-mark-bl: color-mix(in srgb, var(--cs-brand-primary) 45%, #fff);
	--footer-rule: rgb(255 255 255 / .14);  --footer-ring: rgb(255 255 255 / .28);
	--fh1: var(--fh1-bl, #FFC107);  --fh2: var(--fh2-bl, #E9A1A8);  --fh3: var(--fh3-bl, #92B9F3);   /* 9.46 / 7.44 / 7.68 */
	--fh1-bl: color-mix(in srgb, var(--cs-brand-secondary) 45%, #fff);
	--fh2-bl: color-mix(in srgb, var(--accent-1-bl) 45%, #fff);
	--fh3-bl: color-mix(in srgb, var(--accent-2-bl) 45%, #fff);
	--stripe-1: var(--brand-primary); --stripe-2: var(--fh2); --stripe-3: var(--fh3); --stripe-4: var(--brand-secondary);
}