/*
 * Design tokens from final-concept-3.0.
 *
 * Every colour has one job, everywhere on the site:
 *   ink    ground (page background)
 *   paper  reading surfaces and text on ink
 *   cyan   the welcome: hero, primary interaction
 *   green  happening now / today
 *   pink   space that is free and could be yours
 *   lavender  together: the café, volunteers, the Together kind of activity
 *
 * The short names (--ink, --m…) match the concept CSS so sections can be
 * ported directly; the semantic names are for shared components.
 */

:root {
	/* Palette */
	--ink: #111c1d;
	--ink-2: #18282a;
	--ink-3: #203437;
	--paper: #f5f3e9;
	--paper-2: #e9e6d8;
	--cyan: #80e4e9;
	--pink: #ff76b4;
	--green: #bbef65;
	--lavender: #c8a8ff;
	--mute: #8fa3a4;
	--soft: #b6c0bb;
	--rule: rgb(245 243 233 / 0.17);
	--rule-2: rgb(245 243 233 / 0.34);
	--ink-rule: rgb(17 28 29 / 0.22);
	--ink-mute: #4a5350;

	/* Semantic */
	--color-bg: var(--ink);
	--color-text: var(--paper);
	--color-text-muted: var(--mute);
	--color-surface: var(--ink-2);
	--color-primary: var(--cyan);
	--color-primary-contrast: var(--ink);
	--color-accent: var(--pink);
	--color-now: var(--green);
	--color-border: var(--rule);
	--color-focus: currentColor;

	/* The cookie banner (braw-core's consent module), shown while Site Kit's Analytics is on */
	--braw-consent-bg: var(--ink-2);
	--braw-consent-fg: var(--paper);
	--braw-consent-border: var(--rule-2);
	--braw-consent-accent: var(--color-primary);
	--braw-consent-accent-fg: var(--color-primary-contrast);
	--braw-consent-radius: 0;
	--braw-consent-button-radius: 0;
	--braw-consent-z: 58; /* under the full menu and the phone menu (59) */

	/* Type: Google Sans (voice, and labels and numbers through --g), Newsreader (pull-quotes) */
	--m: "Google Sans", Arial, sans-serif;
	--g: var(--m);
	--n: "Newsreader", Georgia, serif;
	--font-body: var(--m);
	--font-heading: var(--m);
	--font-label: var(--g);

	/* Layout */
	--pad: clamp(1.25rem, 5vw, 4.5rem);
	--container: 101.25rem;
	--header: 4.3125rem;
}