/*
Theme Name: mediadisability
Theme URI: https://mediadisability.org
Description: CAMRED / mediadisability.org classic theme — Option B + WPBakery-ready (LBO-style).
Author: Open and Honest
Author URI: https://openandhonest.co.uk
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 8.0
Version: 1.0.189
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mediadisability
Tags: accessibility-ready, custom-menu, featured-images
*/

/**
 * Option B production styles + preference controls.
 */

html {
	font-size: calc(100% * var(--md-font-scale, 1));
	scroll-padding-top: var(--md-scroll-padding, 6rem);
}

/*
 * Classic theme: theme.json should supply these via global styles. Keep
 * fallbacks so fonts/layout still work if global styles are late or missing.
 */
:root {
	--wp--preset--font-family--inclusive-sans: "Inclusive Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--wp--preset--font-family--space-mono: "Space Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--wp--preset--color--base: #ffffff;
	--wp--preset--color--surface: #ffffff;
	--wp--preset--color--contrast: #1c1b1a;
	--wp--preset--color--muted: #1c1b1a;
	--wp--preset--color--border: #d0d0d0;
	--wp--preset--color--primary: #f579f5;
	--wp--preset--color--accent: #34f58c;
	/* Presets follow the fluid scale (FLUID TYPE SCALE block at the end of this file). */
	--wp--preset--font-size--small: var(--md-text-small, 0.875rem);
	--wp--preset--font-size--medium: var(--md-text-body, 1.125rem);
	--wp--preset--font-size--large: var(--md-text-large, 1.5rem);
	--wp--preset--font-size--x-large: var(--md-text-h2, 2.25rem);
	--wp--preset--font-size--huge: var(--md-text-huge, 3.5rem);
	--wp--preset--spacing--50: 1.5rem;
	--wp--style--global--content-size: 1400px;
	--wp--style--global--wide-size: 1400px;
	--wp--style--root--padding-left: var(--wp--preset--spacing--50, 1.5rem);
	--wp--style--root--padding-right: var(--wp--preset--spacing--50, 1.5rem);
	--wp--style--root--padding-top: 0px;
	--wp--style--root--padding-bottom: 0px;
	--md-color-base: var(--wp--preset--color--base);
	--md-color-surface: var(--wp--preset--color--surface);
	--md-color-contrast: var(--wp--preset--color--contrast);
	--md-color-muted: var(--wp--preset--color--muted);
	--md-color-primary: var(--wp--preset--color--primary);
	--md-color-accent: var(--wp--preset--color--accent);
	--md-color-border: var(--wp--preset--color--border);
	--md-color-subtle: #f3f3f3;
}

body {
	font-family: var(--wp--preset--font-family--inclusive-sans);
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--md-body-leading, 1.5);
	color: var(--md-color-contrast, #1c1b1a);
	background-color: var(--md-color-base, #fff);
	margin: 0;
}

/*
 * Jump-nav pages: offset on anchor targets so section bands align flush under
 * the fixed header (html scroll-padding zeroed above to avoid double-counting).
 * Classic + WPBakery: nav may be a direct child or inside .wpb-content-wrapper.
 */
html:has(.entry-content > .md-jump-nav),
html:has(.wp-block-post-content > .md-jump-nav),
html:has(.entry-content > .wpb-content-wrapper > .md-jump-nav),
html:has(.wp-block-post-content > .wpb-content-wrapper > .md-jump-nav) {
	scroll-padding-top: 0;
}

/* Nested anchors clear the fixed header; section bands flush to viewport top. */
.entry-content:has(.md-jump-nav) [id],
.wp-block-post-content:has(.md-jump-nav) [id] {
	scroll-margin-top: var(--md-scroll-offset, var(--md-scroll-padding, 6rem));
}

.entry-content:has(.md-jump-nav) .md-page-section,
.wp-block-post-content:has(.md-jump-nav) .md-page-section {
	scroll-margin-top: 0;
}

/*
 * No-JS / native hash fallback. The anchor id sits on the band's first heading,
 * which is one band padding below the band edge. scroll-margin-top makes native
 * :target scrolling stop with the heading that far below the viewport top, so
 * the BAND edge lands at the very top (heading clear of the header and level
 * with the sidebar panel). The first band after the jump nav has no top padding,
 * so its heading simply lands level with the sidebar panel. md-sticky-nav.js does
 * the same job with smooth scroll, focus and active-link handling.
 * Limit without JS: the last band cannot reach the top if the page ends first.
 */
.entry-content:has(.md-jump-nav) .md-page-section > :is(h2, h3, .wp-block-heading):first-child[id],
.wp-block-post-content:has(.md-jump-nav) .md-page-section > :is(h2, h3, .wp-block-heading):first-child[id] {
	scroll-margin-top: var(--md-section-pad-top, 7.25rem);
}

/* Heading focused by the jump script: no box. Focus still moves to it (see the
 * "focus on non-controls" block at the end of this file). */

/* Shared layout tokens (fallbacks if theme.json CSS is late) */
:root {
	/* colour tokens set above — keep layout/radius here */
	--md-radius: 0.5rem;
	--md-radius-pill: 0.25rem;
	/* Hero / single overlay panels — concentric inner radius from inset */
	--md-card-content-gap: var(--md-radius-pill, 0.25rem);
	--md-radius-inner: max(0px, calc(var(--md-radius, 0.5rem) - var(--md-card-content-gap, 0.25rem)));
	--md-space: 1.5rem;
	/* Gap BELOW the floating header, down to sticky sidebars / jump-nav / filters:
	 * one value, same compact or expanded. 1rem on desktop (half the 2rem column
	 * gutter); <=899px uses --md-space / 2 (see below). */
	--md-header-float-gap: calc(var(--md-gutter, 2rem) / 2);
	/* Gap ABOVE the floating header (viewport top to the pill). Equal to the gap
	 * below at every width, so the pill sits evenly between viewport and sidebar. */
	--md-header-top-gap: var(--md-header-float-gap);
	/* Vertical padding inside the frosted header bar (above/below logo and nav)
	 * at 900px and wider: 0.75rem (= --md-space / 2; was 0.5rem). Phones (≤899px)
	 * use their own --md-mobile-bar-pad-y in the MOBILE BAR HEIGHT block at the end. */
	--md-header-pad-y: calc(var(--md-space, 1.5rem) / 2);
	/* Desktop header bar height (>=1050px; the same expanded or compact): the
	 * 2.25rem menu pill plus the padding above and below = 2.25rem + 2 x 0.75rem
	 * = 3.75rem (60px). Sets the expanded min-height and the band top padding
	 * below, so changing --md-header-pad-y alone keeps them all in step. */
	--md-header-bar-height: calc(2.25rem + 2 * var(--md-header-pad-y));
	/* 900 to 1049px (hamburger): the bar is the same height as the phone bar,
	 * --md-mobile-bar-height (3.25rem = 52px): the 44px hamburger button plus
	 * 4px above and below (--md-mobile-bar-pad-y). Was 4.25rem (68px). */
	--md-header-bar-height-tablet: var(--md-mobile-bar-height, 3.25rem);
	/* Dropdown offset (1.0.82): the Projects submenu and the display-preferences
	 * panel are anchored to the nav pill / prefs button, not to the bar. Raising
	 * --md-header-pad-y moved the bar's bottom edge down by the same amount, so the
	 * panels floated across it. This is that growth (pad-y minus the old 0.5rem =
	 * 0.25rem, 4px), added to their top offset at 1050px and wider only. Phones and
	 * the hamburger tablet bar use their own padding, so it stays 0 there. */
	--md-submenu-pad-offset: 0px;
	/* Universal column / grid gutter (sidebar+main, archive, latest cols, etc.) */
	--md-gutter: 2rem;
	--md-jump-gap: var(--md-gutter);
	--md-space-subheading: 0.75rem;
	--md-space-stack: 3rem;
	--md-space-section: 6rem;
	/* Gap under page / single ledes (and Event details box) into following copy */
	--md-space-lede-after: 1.75rem;
	/* Page h1 band padding — tighter than a full section gap */
	--md-space-title: 4rem;
	/* Jump-nav anchor scroll: 0 = section band flush under fixed header. */
	--md-scroll-gap: 0;
	/*
	 * Top pad inside section bands so the title clears the fixed header when the
	 * band edge is flush with the viewport top (jump links). Equals the sticky
	 * sidebar top once the header is compact: top gap + bar (--md-header-bar-height,
	 * 3.75rem: 2.25rem pill + 0.75rem padding top and bottom) + gap below = 1rem +
	 * 3.75rem + 1rem = 5.75rem, so the heading lines up with the top of the
	 * sidebar panel. 900 to 1049px (hamburger) and phones override this below.
	 */
	--md-section-pad-top: calc(var(--md-header-top-gap, 1rem) + var(--md-header-bar-height, 3.75rem) + var(--md-header-float-gap, 1rem));
	/* Header lockup (expanded) — ~15% under display size so symbol + type read tighter */
	--md-type-brand: clamp(2.35rem, 4.75vw, 3.6rem);
	/* Header logo height, expanded desktop (>=1050px): symbol + logotype scale from this.
	 * 15% under the earlier clamp(2.35rem, 4.75vw, 3.6rem) (58px max). Max 3.06rem = 49px. */
	--md-logo-height: clamp(2rem, 4.04vw, 3.06rem);
	/* Page titles and archive headings */
	--md-type-display: clamp(2.75rem, 5.5vw, 4.25rem);
	/* Home section titles — same scale as Featured / page display */
	--md-type-home-display: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	/* Home vision lede (h2). Between the reduced size and the earlier 2.25rem cap. */
	--md-type-lede: clamp(1.625rem, 2.25vw, 2.125rem);
	/* Body copy leading — was 1.6 via theme.json; tightened site-wide */
	--md-body-leading: 1.5;
	/* Long-form prose measure (soft cap; grid/column stay full width) */
	--md-prose-measure: 66ch;
	/*
	 * Fallback fluid size (vw). Inside .md-page-section this is overridden with
	 * a container-relative clamp so type eases down once the measure fills the column.
	 */
	--md-prose-size: var(--md-text-prose, 1.125rem);
	/* Subtracted from band cqi on jump-nav pages (sidebar + gutter). */
	--md-prose-track-inset: 0rem;
	/* Frosted header panels — shared by compact bar, Projects submenu, prefs */
	--md-frost-surface: rgba(255, 255, 255, 0.94);
	/* Nav shell — compact bar, Projects dropdown, prefs, sidebar panels */
	--md-frost-nav-shell: rgba(255, 255, 255, 0.8);
	--md-frost-blur: saturate(180%) blur(18px);
	/* Partner logo tiles — see partners.css */
	--md-glass-bg: rgba(255, 255, 255, 0.68);
	--md-glass-blur: saturate(160%) blur(14px);
	/* Mobile nav overlay — frosted sheet over page content */
	--md-mobile-nav-overlay: rgba(255, 255, 255, 0.62);
	--md-mobile-nav-blur: saturate(180%) blur(24px);
	/* Two-thirds text measure — from 900px up; full width below (matches hamburger stack) */
	--md-measure-two-thirds-min: 56.25rem;
	/* Keyboard focus — thin ring; cards use shadow lift instead */
	--md-focus-outline: 2px solid color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 70%, transparent);
	--md-focus-outline-offset: 2px;
	/*
	 * Motion tokens — one set of timings for every inactive-to-active change.
	 * Colour and fades 0.2s; movement, lift and shadows 0.28s; open/close panels 0.3s.
	 * Decelerating ease, no overshoot. Reduced motion collapses them (see end of file).
	 * Focus rings are deliberately NOT in these lists so they show immediately.
	 */
	--md-transition-duration: 0.2s;
	--md-transition-duration-move: 0.28s;
	--md-transition-duration-panel: 0.3s;
	--md-transition-duration-slide: 0.35s;
	--md-transition-ease: cubic-bezier(0.2, 0, 0, 1);
	--md-transition-colour:
		color var(--md-transition-duration) var(--md-transition-ease),
		background-color var(--md-transition-duration) var(--md-transition-ease),
		border-color var(--md-transition-duration) var(--md-transition-ease),
		fill var(--md-transition-duration) var(--md-transition-ease),
		stroke var(--md-transition-duration) var(--md-transition-ease),
		text-decoration-color var(--md-transition-duration) var(--md-transition-ease);
	--md-transition-fade: opacity var(--md-transition-duration) var(--md-transition-ease);
	--md-transition-lift:
		transform var(--md-transition-duration-move) var(--md-transition-ease),
		box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
	--md-transition-interactive:
		var(--md-transition-colour),
		var(--md-transition-lift),
		var(--md-transition-fade);
}

/* Dark theme — accessible neutrals; accents kept for brand but used carefully */
html[data-md-theme="dark"] {
	color-scheme: dark;
	--md-color-base: #1c1b1a;
	--md-color-surface: #2a2928;
	--md-color-contrast: #f5f5f4;
	--md-color-muted: #f5f5f4;
	--md-color-primary: #f579f5;
	--md-color-accent: #34f58c;
	--md-color-border: #3f3e3c;
	--md-color-subtle: #3a3938;
	--wp--preset--color--base: var(--md-color-base);
	--wp--preset--color--surface: var(--md-color-surface);
	--wp--preset--color--contrast: var(--md-color-contrast);
	--wp--preset--color--muted: var(--md-color-muted);
	--wp--preset--color--primary: var(--md-color-primary);
	--wp--preset--color--accent: var(--md-color-accent);
	--wp--preset--color--border: var(--md-color-border);
	--md-frost-surface: rgba(42, 41, 40, 0.94);
	--md-frost-nav-shell: rgba(42, 41, 40, 0.8);
	--md-glass-bg: rgba(42, 41, 40, 0.72);
	--md-mobile-nav-overlay: rgba(28, 27, 26, 0.78);
}

html[data-md-theme="dark"] body,
html[data-md-theme="dark"] .has-base-background-color,
html[data-md-theme="dark"] .has-surface-background-color {
	background-color: var(--md-color-base) !important;
	color: var(--md-color-contrast);
}

html[data-md-theme="dark"] .md-header-shell,
html[data-md-theme="dark"] .wp-block-template-part:has(.md-header),
html[data-md-theme="dark"] .md-header {
	background-color: transparent !important;
}

html[data-md-theme="dark"] .md-header__tools {
	background: transparent;
	border: none;
}

/* Frost tint comes from --md-frost-nav-shell on ::before; only the shadow differs. */
html[data-md-theme="dark"] .md-header.is-compact .md-header__inner {
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

html[data-md-theme="dark"] .md-prefs__panel {
	background-color: var(--md-frost-nav-shell);
	background: var(--md-frost-nav-shell);
	backdrop-filter: var(--md-frost-blur);
	-webkit-backdrop-filter: var(--md-frost-blur);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

html[data-md-theme="dark"] .md-prefs__btn {
	background: var(--md-color-subtle, #3a3938);
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-prefs__btn:hover {
	background: #454443;
}

html[data-md-theme="dark"] .md-prefs__btn[data-md-theme-cycle][aria-pressed="true"] {
	background: #fff;
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-prefs__btn[data-md-theme-cycle][aria-pressed="true"]:hover,
html[data-md-theme="dark"] .md-prefs__btn[data-md-theme-cycle][aria-pressed="true"]:focus-visible {
	background: color-mix(in srgb, #fff 94%, #000);
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-prefs__btn[data-md-font][aria-pressed="true"] {
	background: var(--md-color-contrast, #f5f5f4);
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-prefs__btn[data-md-font][aria-pressed="true"]:hover,
html[data-md-theme="dark"] .md-prefs__btn[data-md-font][aria-pressed="true"]:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 94%, #000);
	color: #1c1b1a;
}

.md-skip-link__anchor {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Left-align page copy (headings + body) */
.wp-block-post-title,
.entry-content,
.wp-block-post-content,
.entry-content :is(h1, h2, h3, h4, h5, h6, p, ul:not(.md-partners__grid), ol),
.wp-block-post-content :is(h1, h2, h3, h4, h5, h6, p, ul:not(.md-partners__grid), ol) {
	text-align: left;
}

.md-skip-link__anchor:focus {
	position: static;
	left: auto;
	width: auto;
	height: auto;
	overflow: visible;
	display: inline-block;
	padding: 0.5rem 1rem;
	background: var(--md-color-contrast, #1c1b1a);
	color: var(--md-color-surface, #fff);
	z-index: 100000;
}

/* Mouse click: no focus ring. Keyboard: ring on plain links; pills use fill/shadow. */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible) {
	outline: none;
}

.wp-block-post-title a:focus-visible,
.wp-block-site-title a:focus-visible,
.md-header__logo-link:focus-visible,
a:focus-visible,
button:focus-visible {
	outline: var(--md-focus-outline);
	outline-offset: var(--md-focus-outline-offset);
}

/* Pill nav, buttons, cards — background or shadow shows focus; no outline ring */
.wp-block-navigation :is(a, .wp-block-navigation-item__content, .wp-block-navigation-submenu__toggle):focus-visible,
.md-jump-nav__link:focus-visible,
.wp-block-button__link:focus-visible,
.md-prefs__btn:focus-visible,
.md-prefs__toggle:focus-visible,
.md-team__card:focus-visible,
.md-home-projects__card:focus-visible,
.md-archive__card-link:focus-visible,
.md-latest__card-link:focus-visible,
.md-hero__slide-link:focus-visible,
.md-partners__link:focus-visible {
	outline: none;
}

/* Never use neon magenta/green as text colour alone — AA failure on light backgrounds */
a:not(.wp-block-button__link):not(.md-meta__button):not(.md-toolkit-download__button):not(.md-prefs__btn):not(.md-prefs__toggle):not(.md-home-latest__cta-link):not(.md-partners__link):not(.wp-block-navigation-item__content):not(.md-post-terms__pill--kenya):not(.md-post-terms__pill--uk):not(.md-cookie-consent__link):not([data-md-cookie-settings]) {
	color: var(--md-color-contrast, #1c1b1a);
}

/* —— Header (fixed; sticky fails inside short FSE template-parts) —— */

/*
 * Band shells (About / projects / archives) break out of .wp-site-blocks root
 * pad with negative margins (same pattern as the footer), then re-apply that
 * pad so title/content still share the header column. Avoid 100vw + translateX:
 * 100vw includes the scrollbar gutter and shifted jump-nav / filters off the
 * fixed header edge. Decorative ::before bands may still use 100vw for paint
 * only. Clip overflow — not overflow-x: hidden, which creates a scroll
 * container and can break sticky descendants.
 */
html,
body {
	overflow-x: clip;
}

/*
 * Shared full-bleed band shell — background to viewport edges, content inset.
 * width must grow by the root pads: width:100% + negative margins alone only
 * covers the left gutter (border-box stays content-wide).
 * body-prefixed so regional band rules cannot leave a leftover width:100%.
 */
body main.wp-block-group:has(.md-archive),
body main.wp-block-group:has(.md-jump-nav),
body.md-page-contact main.wp-block-group {
	--md-root-pad-x-start: var(--wp--style--root--padding-left, 1.5rem);
	--md-root-pad-x-end: var(--wp--style--root--padding-right, 1.5rem);
	width: calc(100% + var(--md-root-pad-x-start) + var(--md-root-pad-x-end)) !important;
	max-width: none !important;
	margin-left: calc(-1 * var(--md-root-pad-x-start));
	margin-right: calc(-1 * var(--md-root-pad-x-end));
	padding-left: var(--md-root-pad-x-start);
	padding-right: var(--md-root-pad-x-end);
	box-sizing: border-box;
}

body {
	background-color: var(--md-color-base, #fff);
	line-height: var(--md-body-leading, 1.5);
}

/*
 * Body leading for prose. Skip Lead-in classes and pull-quote paragraphs
 * (both use Home vision leading 1.35 / 1.4). The :not(:is(blockquote…)) is
 * required: two :not() classes on p otherwise beat the quote rule on specificity.
 */
:is(.entry-content, .wp-block-post-content) :is(
	p:not(.md-page__lede):not(.is-style-lede),
	.wp-block-paragraph:not(.md-page__lede):not(.is-style-lede),
	ul,
	ol,
	li
):not(:is(blockquote, .wp-block-quote) *),
.wp-block-details .md-details__inner,
.wp-block-details > :not(summary):not(.md-details__panel) {
	line-height: var(--md-body-leading, 1.5);
}

/*
 * Band is a size container (cards use cqi). Prose size is no longer taken from
 * the band: it follows the viewport-driven --md-text-prose token (FLUID TYPE
 * SCALE block at the end of this file), so it keeps growing on large screens.
 */
.md-page-section {
	container-type: inline-size;
	container-name: md-band;
}

/* cqi only resolves on descendants of the container (not the band itself). */
.md-page-section > * {
	--md-prose-size: var(--md-text-prose, 1.125rem);
}

/*
 * Soft prose measure + fluid size. Keeps the grid/column full width;
 * only long-form paragraphs and lists shorten (~66ch). Skips people tables,
 * partner grids, cards, team, archives, etc.
 */
.md-page-section > :is(p:not(.md-page__lede):not(.is-style-lede), .wp-block-paragraph:not(.md-page__lede):not(.is-style-lede), ul:not(.md-people-list):not(.md-partners__grid), ol, .wp-block-list),
:is(.entry-content, .wp-block-post-content) > :is(p:not(.md-page__lede):not(.is-style-lede), .wp-block-paragraph:not(.md-page__lede):not(.is-style-lede), ul:not(.md-people-list):not(.md-partners__grid), ol, .wp-block-list),
.md-page-section .wp-block-details .md-details__inner > :is(p, ul:not(.md-people-list), ol, .wp-block-list),
.md-page-section .wp-block-details > :not(summary):not(.md-details__panel):is(p, ul:not(.md-people-list), ol, .wp-block-list),
.md-main--single :is(.entry-content, .wp-block-post-content) > :is(p:not(.md-page__lede):not(.is-style-lede), .wp-block-paragraph:not(.md-page__lede):not(.is-style-lede), ul:not(.md-people-list):not(.md-partners__grid), ol, .wp-block-list) {
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
}

/*
 * Soft measure + core constrained layout. `.is-layout-constrained > *` centres
 * every direct child (margin-inline: auto !important). Headings stay at
 * content-size (~1400px); paragraphs at 66ch then inset on both sides
 * (Privacy Policy stagger; same bug class as mid-width singles before the
 * wrapper measure). Pin the soft measure to the content-size left edge so
 * body shares the heading / hr left edge; shorten only on the right.
 * When the parent is already ≤ content-size (single-post prose column),
 * the inset resolves to 0 and singles stay unchanged.
 */
:is(.entry-content, .wp-block-post-content).is-layout-constrained > :is(
	p:not(.md-page__lede):not(.is-style-lede),
	.wp-block-paragraph:not(.md-page__lede):not(.is-style-lede),
	ul:not(.md-people-list):not(.md-partners__grid),
	ol,
	.wp-block-list
) {
	margin-left: max(
		0px,
		calc((100% - min(100%, var(--wp--style--global--content-size, 1400px))) / 2)
	) !important;
	margin-right: auto !important;
}

/*
 * Body text element (WPBakery "CAMRED Body text" renders <div class="md-vc-text">).
 * The child selectors above (.md-page-section > p, .entry-content > p) cannot see
 * paragraphs inside that wrapper, so the same measure and size are attached to the
 * wrapper's own children here. One rule for every Body text element, on any page,
 * in any band or outside one (Privacy). The wrapper itself is not constrained, so
 * there is no double cap and `ch` is always resolved at the paragraph's own size.
 * Left out on purpose: designed lists (people, partners, objectives) and the Home
 * Latest button paragraph. Lede (.md-page__lede / .md-lede Text Block) keeps its
 * own two-thirds measure.
 */
.md-vc-text > :is(
	p:not(.md-home-latest__cta),
	ul:not(.md-people-list):not(.md-partners__grid):not(.md-objectives),
	ol:not(.md-objectives),
	.wp-block-paragraph,
	.wp-block-list:not(.md-objectives)
),
/*
 * Native WPBakery Text Block on CPT singles (Impact / Output / Resource).
 * Same measure as .md-vc-text so Catalin’s Backend Editor content matches
 * the previous block-editor look. Skip .md-lede Text Blocks (lead-in type).
 */
.md-main--single .wpb_text_column:not(.md-lede) .wpb_wrapper > :is(
	p:not(.md-page__lede):not(.is-style-lede):not(.md-page__meta-line):not(.is-style-meta-line):not(.md-event-details__title):not(.md-event-details__line),
	ul:not(.md-people-list):not(.md-partners__grid),
	ol,
	.wp-block-paragraph:not(.md-page__lede):not(.is-style-lede),
	.wp-block-list
) {
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
}

/*
 * Body-copy links only — paragraphs, Gutenberg lists, Contact lede.
 * Skips jump-nav / other md-* UI lists that already have their own states.
 * Also skip CTA / button classes: their lift+shadow transition must not lose
 * to this underline-only transition (Home “View all Impact” lives in a <p>).
 */
:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)),
:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)),
:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a,
.md-contact-details__lede a {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.12em;
	text-decoration-color: color-mix(in srgb, currentColor 50%, transparent);
	transition:
		text-underline-offset var(--md-transition-duration-move) var(--md-transition-ease),
		text-decoration-color var(--md-transition-duration) var(--md-transition-ease),
		color var(--md-transition-duration) var(--md-transition-ease);
}

:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):hover,
:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):focus-visible,
:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):hover,
:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):focus-visible,
:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a:hover,
:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a:focus-visible,
.md-contact-details__lede a:hover,
.md-contact-details__lede a:focus-visible {
	text-underline-offset: 0.45em;
	text-decoration-color: transparent;
}

@media (prefers-reduced-motion: reduce) {
	:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)),
	:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)),
	:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a,
	.md-contact-details__lede a {
		transition: none;
	}

	:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):hover,
	:is(.entry-content, .wp-block-post-content) :is(p, .wp-block-paragraph) a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):focus-visible,
	:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):hover,
	:is(.entry-content, .wp-block-post-content) :is(ul, ol).wp-block-list a:not(:where(.wp-element-button, .wp-block-button__link, .md-home-latest__cta-link, .md-meta__button, .md-toolkit-download__button, .vc_general, .vc_btn3)):focus-visible,
	:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a:hover,
	:is(.entry-content, .wp-block-post-content) :is(ul, ol):not([class]) > li > a:focus-visible,
	.md-contact-details__lede a:hover,
	.md-contact-details__lede a:focus-visible {
		text-underline-offset: 0.12em;
		text-decoration-color: color-mix(in srgb, currentColor 50%, transparent);
		opacity: 0.75;
	}
}

.wp-site-blocks {
	/* Clear the fixed header, plus a little breathing room before content.
	 * Solid base colour so the clearance stays white (or dark-mode base).
	 * Use --md-header-clearance (tallest measured offset) so padding does not
	 * shrink when the scrolled compact bar is shorter than the tall lockup.
	 * !important: global-styles sets padding-top via --wp--style--root--padding-top
	 * (0). On Contact, Ninja Forms re-enqueues this sheet before global-styles, so
	 * without !important the clearance collapses and the page title meets the logo. */
	padding-top: calc(var(--md-header-clearance, var(--md-header-height, 5.5rem)) + var(--md-space, 1.5rem)) !important;
	padding-left: var(--wp--style--root--padding-left, 1.5rem);
	padding-right: var(--wp--style--root--padding-right, 1.5rem);
	background-color: var(--md-color-base, #fff);
}

/*
 * Compact header widths (matches md-sticky-nav.js COMPACT_MQ ≤1049px) —
 * no white band above content; the frosted nav pill floats over the page
 * so regional / archive / About band colours show through. Text-led pages
 * keep clearance on main or the page title instead.
 */
@media (max-width: 1049px) {
	.wp-site-blocks {
		padding-top: 0 !important;
	}

	.md-main--home {
		/* Header clearance (site-blocks padding is 0 here) + section rhythm. */
		padding-top: calc(var(--md-header-height, 5.5rem) + var(--md-space-section, 6rem));
	}

	/* Contact title clearance is on .md-page-band > h1 (matches About). */

	/* Single posts without a hero image — panel is in-flow, not full-bleed.
	 * Clearance uses the tallest measured header offset so the simple card
	 * sits below the sticky nav with a clear gap on narrow screens.
	 * body.md-page--grey main.wp-block-group { padding-top: 0 } is more
	 * specific, so match that chain here. */
	.md-main--single:has(> .md-single-hero:first-child:not(:has(.wp-block-post-featured-image img, .md-single-hero__figure img))),
	.md-main--single.md-main--single-simple,
	body.md-page--grey main.wp-block-group.md-main--single.md-main--single-simple {
		padding-top: calc(
			var(--md-header-clearance, var(--md-header-height, 5.5rem))
			+ var(--md-header-float-gap, 0.75rem)
			+ var(--md-space, 1.5rem)
		);
	}
}

/* Phone: tighter clearance (no extra 1.5rem) so grey above the card is modest. */
@media (max-width: 899px) {
	.md-main--single:has(> .md-single-hero:first-child:not(:has(.wp-block-post-featured-image img, .md-single-hero__figure img))),
	.md-main--single.md-main--single-simple,
	body.md-page--grey main.wp-block-group.md-main--single.md-main--single-simple {
		padding-top: calc(
			var(--md-header-clearance, var(--md-header-height, 5.5rem))
			+ var(--md-header-float-gap, 0.75rem)
		);
	}
}

/* Header is fixed — site blocks keep a top offset so content clears the nav.
 * Single CPT heroes match the home Featured hero (in-grid, below the menu). */

/*
 * Fixed shell. Classic theme: JS adds .md-header-shell onto the same
 * <header class="md-header"> (no FSE template-part wrapper). That must stay
 * fixed — a later .md-header { position: relative } must not win.
 * --md-header-top-gap is the gap above the bar and --md-header-float-gap the
 * gap below it, down to jump-nav / archive filters (via md-sticky-nav.js and
 * the sticky tops). They are equal: 1rem desktop, 0.75rem on mobile (half of
 * --md-space) to save screen height. Same values compact or expanded.
 */
@media (max-width: 899px) {
	:root {
		--md-header-float-gap: calc(var(--md-space, 1.5rem) / 2);
	}
}

/*
 * 900 to 1049px: the always-compact hamburger bar is --md-header-bar-height-tablet,
 * which equals the phone bar (--md-mobile-bar-height, 3.25rem = 52px).
 * Keep the band padding equal to the sticky sidebar top: 1rem + 3.25rem + 1rem =
 * 5.25rem.
 */
@media (min-width: 900px) and (max-width: 1049px) {
	:root {
		--md-section-pad-top: calc(var(--md-header-top-gap, 1rem) + var(--md-header-bar-height-tablet, 3.25rem) + var(--md-header-float-gap, 1rem));
	}
}

.md-header-shell,
.md-header.md-header-shell,
.wp-block-template-part:has(.md-header) {
	position: fixed !important;
	top: var(--md-header-top-gap, var(--md-header-float-gap, var(--md-space, 1.5rem)));
	left: 0;
	right: 0;
	z-index: 200;
	width: 100%;
	box-sizing: border-box;
	/*
	 * Same root horizontal pad as .wp-site-blocks so the frosted bar, jump-nav
	 * submenu, and main/footer share one width (desktop and mobile).
	 */
	padding-left: var(--wp--style--root--padding-left, 1.5rem);
	padding-right: var(--wp--style--root--padding-right, 1.5rem);
	background: transparent;
	pointer-events: none;
}

/* Mobile: keep root side inset; drop the alignwide max-width cap only. */
@media (max-width: 899px) {
	.md-header-shell,
	.md-header.md-header-shell,
	.wp-block-template-part:has(.md-header),
	.md-header-shell:has(.md-header.is-compact),
	.md-header.md-header-shell.is-compact,
	.wp-block-template-part:has(.md-header.is-compact) {
		top: var(--md-header-top-gap, var(--md-header-float-gap, 0.5rem));
	}

	.md-header.is-compact .md-header__inner,
	.md-header:not(.is-compact) .md-header__inner {
		max-width: none !important;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}

.md-header-shell > *,
.md-header.md-header-shell > *,
.wp-block-template-part:has(.md-header) > * {
	pointer-events: auto;
}

.md-header:not(.md-header-shell) {
	position: relative;
	z-index: 1;
}

.md-header {
	border-bottom: 0 !important;
	background: transparent !important;
	box-shadow: none;
	/* Top gap comes from .md-header-shell top (matches page left padding).
	 * Bottom was spacing--40 (12px) — removed site-wide (tall + compact). */
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.md-header__inner {
	display: flex !important;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	column-gap: var(--md-space, 1.5rem);
	row-gap: 0;
	box-sizing: border-box;
	width: 100%;
	/*
	 * Expanded: max-width + auto margins match content inside padded
	 * .wp-site-blocks (no extra horizontal pad here — that would double-inset).
	 * Compact: full-bleed frosted bar (overrides below).
	 */
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
	padding-top: 0;
	padding-bottom: 0;
	/* No padding transition — animating 8px→0 after compact left a taller
	 * measured clearance and a permanent white gap under the nav. */
	transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
}

/*
 * Scrolled compact: keep the same max-width as the expanded nav (alignwide /
 * content column). Mobile drops the max-width cap but keeps root side inset.
 */

/* Classic theme: alignwide / constrained layout without relying on FSE alone */
.alignwide {
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-left: auto;
	margin-right: auto;
}

/* Desktop expanded: keep horizontal root pad; only clear vertical pad. */
@media (min-width: 900px) {
	.md-header:not(.is-compact) .md-header__inner {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
}

/*
 * Expanded desktop header: keep menu vertically centered with the brand in
 * the white bar (.md-header__inner align-items: center). An earlier optical
 * nudge (--md-header-nav-nudge) pulled tools up for the tall wordmark+tagline
 * lockup; with the logo mark that left extra space under the pills.
 */

.md-header__brand {
	flex: 0 1 auto;
	min-width: 0;
	max-width: none;
	display: flex;
	align-items: center;
}

.md-header__tools {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-end;
	gap: 0.2rem 0.35rem;
	flex: 0 0 auto;
	margin-left: auto;
	padding: 0;
	background: transparent;
	border: none;
	border-radius: 0;
	box-shadow: none;
	transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease), background-color var(--md-transition-duration) var(--md-transition-ease);
}

.md-header__brand .wp-block-site-title,
.md-header__title,
.md-header__brand .wp-block-site-title a {
	font-size: var(--md-type-brand, clamp(2rem, 4vw, 3.25rem));
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-decoration: none;
	color: var(--md-color-contrast, #1c1b1a);
	margin: 0;
	transition: font-size 0.2s ease;
}

/*
 * Static brand logo — lockup (symbol + logotype) in the tall header;
 * on compact/scroll the symbol fades and the word slides left + scales down.
 * Symbol/word ratios from Identity Assets 03 Lockup (833.99 × 143.14).
 * Gap = internal clear-band / pill-thickness unit (lockup SVG: 48.43 ÷ 143.14).
 */
.md-brand-logo {
	--md-brand-h: var(--md-logo-height, clamp(2rem, 4.04vw, 3.06rem));
	--md-brand-word-h: calc(var(--md-brand-h) * 0.691);
	--md-brand-gap: calc(var(--md-brand-h) * 0.3383);
	--md-brand-symbol-w: calc(var(--md-brand-h) * 1.778);
	display: inline-flex;
	align-items: center;
	gap: var(--md-brand-gap);
	height: var(--md-brand-h);
	max-width: 100%;
	line-height: 0;
	text-decoration: none;
	color: inherit;
	/* Size snaps quickly on compact so the tall lockup does not linger over content. */
	transition: height 0.15s ease, gap 0.15s ease;
}

/*
 * Logo sits inside a <p class="md-header__title">. Keep that paragraph a flex
 * row with no text strut — inline-flex + font-size/line-height on the <p> leaves
 * baseline gap below the mark, so CAMRED looks top-heavy in the frosted pill.
 */
.md-header__title--logo {
	display: flex;
	align-items: center;
	line-height: 0;
	font-size: 0;
}

.md-header__logo-link {
	display: flex;
	align-items: center;
	line-height: 0;
	text-decoration: none;
}

.md-brand-logo__symbol,
.md-brand-logo__word {
	position: relative;
	display: block;
	flex: 0 0 auto;
	overflow: hidden;
	line-height: 0;
}

.md-brand-logo__symbol {
	width: var(--md-brand-symbol-w);
	height: 100%;
	transition: opacity 0.15s ease, width 0.15s ease, margin 0.15s ease;
}

.md-brand-logo__word {
	height: var(--md-brand-word-h);
	width: calc(var(--md-brand-word-h) * 5.37);
	max-width: min(100%, 22rem);
	transition: height 0.15s ease, width 0.15s ease;
}

/* Entering compact: collapse size immediately; keep a short fade on the symbol. */
.md-header.is-compact .md-brand-logo,
.md-header.is-compact .md-brand-logo__symbol,
.md-header.is-compact .md-brand-logo__word {
	transition-duration: 0.12s;
}

.md-brand-logo__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: left center;
}

.md-brand-logo__img--dark {
	display: none;
}

html[data-md-theme="dark"] .md-brand-logo__img--light {
	display: none;
}

html[data-md-theme="dark"] .md-brand-logo__img--dark {
	display: block;
}

.md-header__logo {
	display: block;
	height: auto;
	width: auto;
	max-height: 4rem;
	max-width: min(100%, 18rem);
	transition: max-height 0.2s ease;
}

.md-header__tagline,
.md-header__brand .wp-block-site-tagline,
.md-header__tagline.has-small-font-size,
.md-header__brand .wp-block-site-tagline.has-small-font-size,
.md-header__meta .wp-block-site-tagline {
	grid-column: 1;
	min-width: 0;
	margin: 0;
	max-width: none;
	font-size: 0.9375rem;
	font-weight: 400;
	letter-spacing: 0em;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 0.28rem 0;
	color: var(--md-color-contrast, #1c1b1a);
	transition: opacity var(--md-transition-duration) ease, max-height var(--md-transition-duration) ease, margin var(--md-transition-duration) ease, color var(--md-transition-duration) var(--md-transition-ease);
}

.md-header__nav {
	--md-nav-pill-height: 2.25rem;
	/* Tighter than jump-nav inset — primary bar was reading too spaced */
	--md-nav-pill-pad-x: 0.6rem;
	--md-nav-pill-pad-y: 0.85rem;
	/*
	 * Slightly wider than submenu / jump-nav (0.2rem): the same absolute gap
	 * reads tighter between short side-by-side pills than between stacked ones.
	 */
	--md-nav-item-gap: 0.35rem;
	--md-submenu-gap: var(--md-space, 1.5rem);
	justify-content: flex-end;
	flex: 0 0 auto;
	display: flex;
	align-items: center;
}

.md-header__nav .wp-block-navigation__container {
	justify-content: flex-end;
	align-items: center;
}

/* Compact after scroll — shorter frosted pill, vertically centred */
.md-header.is-compact {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	transition: none;
}

/*
 * Frosted bar: background + blur live on ::before, never on .md-header__inner.
 * backdrop-filter on an element makes it a "backdrop root", so any descendant
 * that also uses backdrop-filter (Projects submenu, prefs panel) can only sample
 * the header instead of the page behind it — i.e. no visible blur. Keeping the
 * blur on a pseudo-element leaves the ancestor chain clean.
 * Do not add backdrop-filter, filter, opacity < 1, transform, will-change, mask
 * or contain:paint to .md-header__inner, .md-header__tools or .md-header__nav.
 */
.md-header.is-compact .md-header__inner {
	position: relative;
	display: flex !important;
	flex-wrap: nowrap;
	align-items: center !important;
	justify-content: space-between;
	gap: 0.5rem 0.85rem;
	/*
	 * Frost inset: side pad matches the visual top/bottom clearance around the
	 * logo (0.5rem felt tight on the sides next to the rounded bar edge).
	 */
	--md-header-frost-inset: 0.85rem;
	--md-header-pad-x-start: var(--md-header-frost-inset);
	--md-header-pad-x-end: var(--md-header-frost-inset);
	padding: var(--md-header-pad-y, 0.25rem) var(--md-header-pad-x-end) var(--md-header-pad-y, 0.25rem) var(--md-header-pad-x-start);
	min-height: 0;
	background-color: transparent;
	background: transparent;
	border-radius: var(--md-radius, 0.5rem);
	/* visible so Projects submenu can escape the frosted bar */
	overflow: visible;
	box-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
	/* Padding and size stay instant (see the note on .md-header__inner); only the
	 * shadow fades, which never changes the layout box the sticky JS measures. */
	transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
}

.md-header.is-compact .md-header__inner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	border-radius: inherit;
	background: var(--md-frost-nav-shell);
	backdrop-filter: var(--md-frost-blur);
	-webkit-backdrop-filter: var(--md-frost-blur);
	pointer-events: none;
}

/* Brand and tools paint above the frosted pseudo-layer */
.md-header.is-compact .md-header__inner > * {
	position: relative;
	z-index: 1;
}

/* Kill block-layout vertical margins that push brand/nav off-centre */
.md-header.is-compact .md-header__inner > *,
.md-header.is-compact .md-header__tools > *,
.md-header.is-compact .md-header__brand > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

.md-header.is-compact .md-header__brand {
	flex: 0 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	align-self: center;
}

.md-header.is-compact .md-header__brand > *,
.md-header.is-compact .md-header__title {
	margin: 0;
}

.md-header.is-compact .md-header__brand .wp-block-site-title:not(.md-header__title--logo),
.md-header.is-compact .md-header__title:not(.md-header__title--logo),
.md-header.is-compact .md-header__brand .wp-block-site-title:not(.md-header__title--logo) a {
	font-size: clamp(1.55rem, 3vw, 1.85rem);
	line-height: 1;
	letter-spacing: 0em;
	transition: none;
}

.md-header.is-compact .md-header__title--logo {
	display: flex;
	align-items: center;
	align-self: center;
	line-height: 0;
	font-size: 0;
}

.md-header.is-compact .md-brand-logo {
	--md-brand-h: clamp(1.55rem, 3vw, 1.85rem);
	--md-brand-word-h: var(--md-brand-h);
	--md-brand-gap: 0;
	gap: 0;
	align-self: center;
}

.md-header.is-compact .md-brand-logo__symbol {
	opacity: 0;
	width: 0;
	margin: 0;
	pointer-events: none;
}

/* Compact logotype: 80% of the word slot, centred in the frosted pill. */
.md-header.is-compact .md-brand-logo__word {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.md-header.is-compact .md-brand-logo__word .md-brand-logo__img {
	width: 80%;
	height: 80%;
	object-fit: contain;
	object-position: left center;
}

.md-header.is-compact .md-header__logo {
	max-height: 2rem;
	transition: none;
}

.md-header.is-compact .md-header__tools {
	display: flex;
	flex: 0 0 auto;
	margin-left: auto;
	margin-top: 0 !important;
	align-items: center;
	align-self: center !important;
	transform: none;
	overflow: visible;
}

/* Same nav type + pill metrics as the expanded header */
.md-header.is-compact .md-header__nav,
.md-header.is-compact .md-header__nav .wp-block-navigation,
.md-header.is-compact .md-header__nav .wp-block-navigation__container {
	display: flex;
	align-items: center;
	flex-wrap: nowrap !important;
	margin: 0;
	padding: 0;
}

.md-header.is-compact .md-header__nav .wp-block-navigation-item {
	display: flex;
	align-items: center;
	margin: 0;
}

.md-header.is-compact .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content {
	min-height: 0 !important;
	height: auto !important;
	padding: 0 !important;
}

.md-header.is-compact .md-prefs,
.md-header.is-compact .md-prefs__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--md-nav-pill-height, 2.5rem);
	height: var(--md-nav-pill-height, 2.5rem);
	margin: 0;
}

.md-header__nav .wp-block-navigation__container {
	gap: var(--md-nav-item-gap) !important;
	column-gap: var(--md-nav-item-gap) !important;
}

.md-header__nav .wp-block-navigation-item {
	margin: 0;
}

.md-header__nav .wp-block-navigation__container,
.md-header__nav .wp-block-navigation-item a {
	font-weight: 400;
	font-size: var(--md-text-body, 1.125rem);
	letter-spacing: 0em;
}

/* Top-level pills only — submenu items use the fuller pad rule below */
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:not(.wp-block-navigation-submenu__toggle) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: var(--md-nav-pill-height, 2.5rem);
	height: var(--md-nav-pill-height, 2.5rem);
	padding: 0 var(--md-nav-pill-pad-x, 1.35rem);
	line-height: 1;
	border-radius: var(--md-radius-pill, 0.25rem);
	text-decoration: none;
	color: var(--md-color-contrast, #1c1b1a);
	background-color: transparent;
	border: none;
	box-shadow: none;
	transition: var(--md-transition-colour);
}

.md-header__nav .wp-block-navigation-item a:hover,
.md-header__nav .wp-block-navigation-item a:focus-visible,
.md-header__nav .wp-block-navigation-item__content:hover,
.md-header__nav .wp-block-navigation-item__content:focus-visible {
	background-color: var(--md-color-subtle, #f3f3f3) !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
	text-decoration: none;
}

.md-header__nav .wp-block-navigation-item a:active,
.md-header__nav .wp-block-navigation-item a:focus {
	outline: none;
	box-shadow: none;
	border: none;
}

.md-header__nav .wp-block-navigation-item a:focus-visible,
.md-header__nav .wp-block-navigation-item__content:focus-visible {
	outline: none;
}

.md-header__nav .wp-block-navigation__container > .current-menu-item > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item > [aria-current="page"] {
	background: var(--md-color-contrast, #1c1b1a) !important;
	color: #fff !important;
	text-decoration: none;
	min-height: var(--md-nav-pill-height, 2.5rem);
	height: var(--md-nav-pill-height, 2.5rem);
	padding: 0 var(--md-nav-pill-pad-x, 1.35rem);
}

.md-header__nav .wp-block-navigation__container > .current-menu-item > a:hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > a:hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item > [aria-current="page"]:hover,
.md-header__nav .wp-block-navigation__container > .current-menu-item > a:focus-visible,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > a:focus-visible,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item > [aria-current="page"]:focus-visible {
	background: #2e2d2c !important;
	color: #fff !important;
}

/*
 * Submenu parents: one pill around label + caret (better as a single control).
 * Only top-level items — not links inside the dropdown.
 */
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child {
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	box-sizing: border-box;
	gap: 0.45rem;
	min-height: var(--md-nav-pill-height, 2.5rem);
	height: var(--md-nav-pill-height, 2.5rem);
	padding: 0 0.7rem 0 var(--md-nav-pill-pad-x, 0.85rem);
	border-radius: var(--md-radius-pill, 0.25rem);
	color: var(--md-color-contrast, #1c1b1a);
	background-color: transparent;
	transition: var(--md-transition-colour);
}

/* Keep :hover while the pointer crosses the visual gap into the submenu */
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: calc(var(--md-submenu-gap, 1.5rem) + var(--md-submenu-pad-offset, 0px) + 0.2rem);
	z-index: 299;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content {
	padding: 0 !important;
	min-height: 0 !important;
	height: auto !important;
	border-radius: 0;
	background: transparent !important;
	color: inherit;
	line-height: 1;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content:hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content:focus-visible {
	background: transparent !important;
	color: inherit;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child > .wp-block-navigation-submenu__toggle {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	color: inherit;
	line-height: 0;
	cursor: pointer;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child .wp-block-navigation__submenu-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 0.55em;
	height: 0.55em;
	margin-left: 0;
	padding: 0;
	color: inherit;
	line-height: 0;
	pointer-events: none;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child .wp-block-navigation__submenu-icon svg {
	display: block;
	width: 100%;
	height: 100%;
	stroke: currentColor;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):focus-within {
	background-color: var(--md-color-subtle, #f3f3f3);
	color: var(--md-color-contrast, #1c1b1a) !important;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):hover > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):focus-within > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):hover > .wp-block-navigation-submenu__toggle,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):focus-within > .wp-block-navigation-submenu__toggle {
	color: var(--md-color-contrast, #1c1b1a) !important;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor {
	background: var(--md-color-contrast, #1c1b1a) !important;
	color: #fff !important;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover {
	background: transparent !important;
	color: #fff !important;
}

.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
	background: #2e2d2c !important;
	color: #fff !important;
}

/* Projects dropdown — frosted panel matching header tools */
.md-header__nav,
.md-header__nav .wp-block-navigation,
.md-header__nav .wp-block-navigation__container {
	overflow: visible;
}

.md-header__nav .wp-block-navigation__container,
.md-header__nav .wp-block-navigation__submenu-container,
.md-header__nav .wp-block-navigation-item {
	list-style: none;
	margin: 0;
	padding: 0;
}

.md-header__nav .wp-block-navigation-item.has-child {
	position: relative;
}

/*
 * Classic theme: block-navigation CSS may not load. Hide flyouts by default;
 * show on hover / focus-within (same behaviour as core navigation block).
 */
.md-header__nav .wp-block-navigation__submenu-container {
	--md-submenu-pad: 0.55rem;
	--md-radius-submenu: calc(var(--md-radius-pill, 0.25rem) + var(--md-submenu-pad, 0.55rem));
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	flex-direction: column;
	position: absolute !important;
	gap: 0.2rem;
	padding: var(--md-submenu-pad);
	/* No margin gap (that breaks hover). Visual gap via top; bridge on parent ::after. */
	margin-top: 0 !important;
	top: calc(100% + var(--md-submenu-gap, 1.5rem) + var(--md-submenu-pad-offset, 0px)) !important;
	/* Left-align with Projects (core right-justified nav uses right: 0). */
	left: 0 !important;
	right: auto !important;
	border: none !important;
	/* Concentric outer shell: pill radius + container padding gap */
	border-radius: var(--md-radius-submenu, 1.05rem) !important;
	/* overflow:visible — hidden breaks backdrop-filter (same as compact nav + prefs panel) */
	overflow: visible;
	z-index: 300;
	width: max-content;
	min-width: max-content;
	max-width: min(28rem, calc(100vw - 2rem));
}

.md-header__nav .has-child:hover > .wp-block-navigation__submenu-container,
.md-header__nav .has-child:focus-within > .wp-block-navigation__submenu-container,
.md-header__nav .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
	display: flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
}

/*
 * Desktop Projects dropdown — same 80% frost as the nav bar (--md-frost-nav-shell).
 * The blur is what makes it legible over article text, so the whole ancestor chain
 * (.md-header__inner, .md-header__tools, .md-header__nav) must stay free of
 * backdrop-filter, filter, opacity < 1, transform, will-change, mask and
 * contain:paint. Any of those forms a backdrop root: this element would then blur
 * the header instead of the page, and the panel turns into flat translucent wash.
 * That is why the header bar's own frost lives on .md-header__inner::before.
 * Core sets background-color:#fff on :not(.has-background) submenus; override below.
 */
@media (min-width: 900px) {
	.md-header__nav.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container,
	.md-header__nav .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container,
	.md-header__nav .wp-block-navigation .has-child .wp-block-navigation__submenu-container,
	.md-header__nav .wp-block-navigation__submenu-container {
		background-color: var(--md-frost-nav-shell) !important;
		background: var(--md-frost-nav-shell) !important;
		border: none !important;
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
		box-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
	}

	.md-header__nav .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container,
	.md-header__nav .has-child.open-on-hover-click:hover > .wp-block-navigation__submenu-container,
	.md-header__nav .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container,
	.md-header__nav .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container,
	.md-header__nav .has-child.open-on-hover-click:focus-within > .wp-block-navigation__submenu-container {
		background-color: var(--md-frost-nav-shell) !important;
		background: var(--md-frost-nav-shell) !important;
		overflow: visible;
	}
}

.md-header__nav .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container,
.md-header__nav .has-child.open-on-hover-click:hover > .wp-block-navigation__submenu-container,
.md-header__nav .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container,
.md-header__nav .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container,
.md-header__nav .has-child.open-on-hover-click:focus-within > .wp-block-navigation__submenu-container {
	width: max-content;
	min-width: max-content;
	max-width: min(28rem, calc(100vw - 2rem));
	overflow: visible;
}

.md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item {
	position: relative;
	z-index: 1;
	width: 100%;
	/* Core uses background-color: inherit — stacks opaque white over the frosted panel. */
	background: transparent !important;
	background-color: transparent !important;
}

/*
 * Submenu pills — full width; pad matches jump-nav text inset.
 * Specificity must beat core `.wp-block-navigation .has-child .…__submenu-container > …`
 * (0.5em 1em) from global styles.
 */
.md-header__nav.wp-block-navigation .has-child .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content,
.md-header__nav.wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.md-header__nav.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	box-sizing: border-box;
	width: 100%;
	min-height: 0 !important;
	height: auto !important;
	padding: var(--md-nav-pill-pad-y, 0.85rem) var(--md-nav-pill-pad-x, 0.85rem) !important;
	border-radius: var(--md-radius-pill, 0.25rem);
	white-space: nowrap;
	font-weight: 400;
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1;
	text-align: left;
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
	background: transparent;
	background-color: transparent;
}

.md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
.md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:focus-visible,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-subtle, #f3f3f3);
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
}

.md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
.md-header__nav .wp-block-navigation__submenu-container [aria-current="page"],
.md-header__nav .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-contrast, #1c1b1a) !important;
	color: #fff !important;
}

@media (min-width: 900px) {
	html[data-md-theme="dark"] .md-header__nav.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .wp-block-navigation .has-child .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container {
		background-color: var(--md-frost-nav-shell) !important;
		background: var(--md-frost-nav-shell) !important;
		border: none !important;
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
		box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
	}

	html[data-md-theme="dark"] .md-header__nav .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .has-child.open-on-hover-click:hover > .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container,
	html[data-md-theme="dark"] .md-header__nav .has-child.open-on-hover-click:focus-within > .wp-block-navigation__submenu-container {
		background-color: var(--md-frost-nav-shell) !important;
		background: var(--md-frost-nav-shell) !important;
	}
}

html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item a:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-subtle, #3a3938);
}

/*
 * Dark mode — active nav pills use --md-color-contrast (light) as background;
 * base rules keep color: #fff, which is invisible on the light pill.
 * Regional project pages override separately with accent fills.
 */
html[data-md-theme="dark"] .md-header__nav .current-menu-item > a,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] .md-header__nav [aria-current="page"],
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"],
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-header__nav .current-menu-item > a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation-item.current-menu-item > a:hover,
html[data-md-theme="dark"] .md-header__nav [aria-current="page"]:hover,
html[data-md-theme="dark"] .md-header__nav .current-menu-item > a:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation-item.current-menu-item > a:focus-visible,
html[data-md-theme="dark"] .md-header__nav [aria-current="page"]:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 94%, #000) !important;
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor {
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > .wp-block-navigation-submenu__toggle,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > .wp-block-navigation-submenu__toggle {
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 94%, #000) !important;
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:hover,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content:focus-visible,
html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 94%, #000) !important;
	color: #1c1b1a !important;
}

/*
 * Main-to-footer gap — page templates set margin-bottom: spacing--70 on main.
 * That margin sits outside main's background, so the white body shows through
 * above the grey footer. Zero it globally; section/archive shells keep their
 * own bottom padding where needed.
 *
 * Classic theme: header shell + main + footer are siblings in .wp-site-blocks.
 * Core block-gap would add ~1.5rem above main (extra space under the heading
 * band) and above the footer — kill it.
 */
.wp-site-blocks > * {
	margin-block-start: 0 !important;
}

.wp-site-blocks > main.wp-block-group,
.wp-site-blocks > main {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.wp-block-template-part:has(.md-footer),
.wp-site-blocks > footer.md-footer {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/*
 * WPBakery defaults: row margin -15px + column pad 15px. FSE pages had neither.
 * Zero both so classic content aligns with the header/footer column.
 */
.entry-content .vc_row,
.wp-block-post-content .vc_row,
.entry-content .wpb_row,
.wp-block-post-content .wpb_row {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.entry-content .vc_column-inner,
.wp-block-post-content .vc_column-inner {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Migrate / wpautop often leaves an empty <p> above the first heading (~1em gap). */
.entry-content .wpb_wrapper > p:empty,
.wp-block-post-content .wpb_wrapper > p:empty,
.entry-content > p:empty,
.wp-block-post-content > p:empty {
	display: none !important;
}

/*
 * Root horizontal padding lives on .wp-site-blocks (theme.json + classic).
 * Drop has-global-padding on the content shell so it does not double-inset.
 */
.wp-site-blocks > main .entry-content.has-global-padding,
.wp-site-blocks > main .wp-block-post-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/*
 * Sticky footer — pages shorter than the window put the footer at the bottom
 * of the viewport instead of leaving dead space below it.
 *
 * Done with sticky rather than flex/grid on .wp-site-blocks so the wrapper
 * keeps its block formatting context: root block gap, margin collapsing,
 * and the root-padding alignfull negative margins all stay as WordPress
 * generated them, and nothing new becomes a containing block for the fixed
 * header or a backdrop root for its frosted blur.
 *
 * The footer only moves when the wrapper is taller than the content, so long
 * pages are untouched: sticky offset is clamped to the wrapper's content box.
 * Admin bar height is subtracted so logged-in views do not gain a scrollbar.
 */
.wp-site-blocks {
	box-sizing: border-box;
	min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 0px));
}

.wp-site-blocks > .wp-block-template-part:has(.md-footer),
.wp-site-blocks > footer.md-footer {
	position: sticky;
	/* Any offset past the wrapper wins; the clamp lands the footer flush at its bottom. */
	top: 100vh;
}

/* —— Footer —— */

footer.md-footer {
	/* Meta + “Funded by”: design-system small (labels/tags), not body. */
	--md-footer-link-size: var(--md-text-small, 0.875rem);
	/* Match body / card excerpt leading at the same font size (was 1.4). */
	--md-footer-link-leading: var(--md-body-leading, 1.5);
	background-color: var(--md-color-surface, #fff);
	/*
	 * Footer padding (rem-based, follows root text size). Top stays 2rem; bottom
	 * is slightly tighter (1.5rem) after meta type shrank to --md-text-small, so
	 * the band does not look hollow under the copyright / logos.
	 * The --md-footer-content-end / -text-inset / -logo-inset / -text-bottom-inset
	 * tokens below are no longer used for padding; left in place, harmless.
	 * !important beats a stale inline padding if one is ever added.
	 */
	--md-footer-pad-y: 2rem;
	--md-footer-pad-bottom: 1.5rem;
	--md-footer-lh: calc(var(--md-footer-link-size) * var(--md-footer-link-leading));
	/* Width of the Funded by column (one of three), which sizes the logos. */
	--md-footer-funders-w: calc((100vw - 2 * var(--wp--style--root--padding-left, 1.5rem) - 2 * var(--md-gutter, 2rem)) / 3);
	/*
	 * Space between the logo card's bottom edge and the lowest logo pixels: the
	 * 0.475rem centring gap at full logo height, growing as the column narrows
	 * and the logos shrink inside their fixed-height cards. Dark mode shows the
	 * white cards themselves, so their edge is the lowest visible content (0).
	 */
	--md-footer-logo-inset: calc(0.475rem + max(0px, (21.75rem - var(--md-footer-funders-w)) * 0.0727));
	/* Space between the last text line's box bottom and its descenders. */
	--md-footer-text-bottom-inset: calc(var(--md-footer-link-size) * (var(--md-footer-link-leading) / 2 - 0.52));
	/* Column heights: three text lines | label + gap + 3.25rem logo card (+ 0.4rem pad). */
	--md-footer-meta-h: calc(3 * var(--md-footer-lh));
	--md-footer-funders-h: calc(var(--md-footer-lh) + 0.3rem + 3.65rem);
	/*
	 * Space from the footer's bottom padding edge up to the lowest visible
	 * content: whichever column ends lower (text descenders or logos).
	 */
	--md-footer-content-end: calc(
		max(var(--md-footer-meta-h), var(--md-footer-funders-h)) +
		min(
			var(--md-footer-logo-inset) - var(--md-footer-funders-h),
			var(--md-footer-text-bottom-inset) - var(--md-footer-meta-h)
		)
	);
	/* Space between the top of the first line box and the top of its glyphs. */
	--md-footer-text-inset: calc(var(--md-footer-link-size) * (var(--md-footer-link-leading) * 1.5 - 1.83));
	padding-top: var(--md-footer-pad-y) !important;
	padding-bottom: var(--md-footer-pad-bottom) !important;
	/*
	 * Full-bleed band: pull out of .wp-site-blocks root pad so the surface
	 * colour reaches the viewport edges; re-apply the same pad so
	 * .md-footer__inner still shares the content column with header/main.
	 */
	margin-left: calc(-1 * var(--wp--style--root--padding-left, 1.5rem));
	margin-right: calc(-1 * var(--wp--style--root--padding-right, 1.5rem));
	padding-left: var(--wp--style--root--padding-left, 1.5rem);
	padding-right: var(--wp--style--root--padding-right, 1.5rem);
	box-sizing: border-box;
}

html[data-md-theme="dark"] footer.md-footer {
	background-color: var(--md-color-surface, #2a2928) !important;
	--md-footer-logo-inset: 0px;
}

.md-footer__inner {
	display: grid;
	/* Match site three-column rhythm: meta (2 columns) | Funded by (1 column) */
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
	width: 100%;
	gap: var(--md-gutter, 2rem);
}

/* Kill WP flow-layout sibling gap — it drops the funders column below the others. */
.md-footer__inner > * {
	margin-block-start: 0 !important;
	margin-top: 0 !important;
	align-self: start;
}

.md-footer__meta {
	order: 1;
	/* Two thirds wide (columns 1 and 2) so lines wrap later; funders stay in column 3. */
	grid-column: 1 / span 2;
}

.md-footer__funders {
	order: 3;
	grid-column: 3;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	justify-self: start;
	text-align: left;
	gap: 0.3rem;
	margin: 0;
	min-width: 0;
}

.md-footer__funders-label {
	margin: 0;
	font-size: var(--md-footer-link-size, 0.875rem);
	font-weight: 400;
	letter-spacing: 0;
	line-height: var(--md-footer-link-leading, 1.4);
	color: var(--md-color-contrast, #1c1b1a);
}

.md-footer__funders-list {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.75rem;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.md-footer__funder {
	display: flex;
	flex: 0 1 auto;
	align-items: center;
	justify-content: center;
	min-width: 0;
	margin: 0;
	height: 3.25rem;
	padding: 0.2rem 0.65rem;
	background: #fff;
	border-radius: var(--md-radius, 0.5rem);
}

.md-footer__funder a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.md-footer__funder img {
	display: block;
	width: auto;
	max-width: min(11rem, 100%);
	max-height: 2.7rem;
	object-fit: contain;
}

.md-footer__meta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	min-width: 0;
	margin-block: 0;
	padding: 0;
	/* Vertical rhythm from line-height; socials are the first row. */
	--wp--style--block-gap: 0rem;
	gap: 0;
}

.md-footer__inner > .wp-block-group {
	margin-block: 0;
}

.md-footer__meta > :is(p, .wp-block-paragraph),
.md-footer__legal > :is(p, .wp-block-paragraph) {
	margin: 0;
	font-size: var(--md-footer-link-size, 0.875rem);
	font-weight: 400;
	letter-spacing: 0em;
	line-height: var(--md-footer-link-leading, 1.4);
	color: var(--md-color-contrast, #1c1b1a);
}

footer.md-footer a,
footer.md-footer .wp-block-navigation-item a,
footer.md-footer .wp-block-navigation-item__content {
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
	transition: var(--md-transition-colour), var(--md-transition-fade);
}

footer.md-footer a:hover,
footer.md-footer .wp-block-navigation-item a:hover,
footer.md-footer .wp-block-navigation-item__content:hover {
	text-decoration: none;
	opacity: 0.5;
}

footer.md-footer a:focus-visible,
footer.md-footer .wp-block-navigation-item a:focus-visible,
footer.md-footer .wp-block-navigation-item__content:focus-visible {
	text-decoration: none;
}

/*
 * Meta column rows:
 * 1. LinkedIn • Facebook • X
 * 2. Privacy Policy • Website by Open & Honest
 * 3. © year CAMRED All rights reserved
 */
.md-footer__social,
.md-footer__legal {
	width: auto;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.md-footer__legal {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-start;
	gap: 0;
	--wp--style--block-gap: 0rem;
}

.md-footer__legal > :is(p, .wp-block-paragraph) {
	display: inline-flex;
	align-items: baseline;
}

.md-footer__legal > :is(p, .wp-block-paragraph):not(:last-child)::after {
	content: "•";
	margin: 0 0.45em;
	color: var(--md-color-contrast, #1c1b1a);
	pointer-events: none;
	speak: never;
}

.md-footer__social.is-layout-flex,
.md-footer__social.is-content-justification-right,
.md-footer__social.is-content-justification-left {
	justify-content: flex-start;
	align-items: baseline;
}

.md-footer__social .wp-block-navigation__responsive-container-open {
	display: none;
}

.md-footer__social .wp-block-navigation__container,
.md-footer__social.is-layout-flex,
.md-footer__social .wp-block-navigation__container.is-layout-flex {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: flex-start;
	gap: 0;
	width: auto;
	margin: 0;
	padding: 0;
	list-style: none;
}

.md-footer__social .wp-block-navigation-item {
	display: inline-flex;
	align-items: baseline;
	margin: 0;
	padding: 0;
}

.md-footer__social .wp-block-navigation-item:not(:last-child)::after {
	content: "•";
	margin: 0 0.45em;
	color: var(--md-color-contrast, #1c1b1a);
	pointer-events: none;
	speak: never;
}

footer .wp-block-navigation__container,
footer .wp-block-navigation-item,
footer .wp-block-navigation-item a,
footer .wp-block-navigation-item__content,
.md-footer__social .wp-block-navigation__container,
.md-footer__social .wp-block-navigation-item,
.md-footer__social .wp-block-navigation-item a,
.md-footer__social .wp-block-navigation-item__content {
	font-size: var(--md-footer-link-size, 0.875rem);
	font-weight: 400;
	letter-spacing: 0em;
	line-height: var(--md-footer-link-leading, 1.4);
}

@media (max-width: 899px) {
	footer.md-footer {
		/* Same --md-text-small token; tighter leading when stacked. */
		--md-footer-link-size: var(--md-text-small, 0.875rem);
		--md-footer-link-leading: 1.35;
	}
}

@media (max-width: 700px) {
	footer.md-footer {
		/* Columns stack: the logos get the full content width. */
		--md-footer-funders-w: calc(100vw - 2 * var(--wp--style--root--padding-left, 1.5rem));
		--md-footer-content-end: var(--md-footer-logo-inset);
	}

	.md-footer__inner {
		grid-template-columns: 1fr;
		gap: 1.125rem;
	}

	.md-footer__meta,
	.md-footer__funders {
		grid-column: 1;
		justify-self: start;
	}
}

/*
 * Band shells — full-width grey from the page title through content (not behind header).
 * Triggered by .md-archive (Impact / Outputs / Resources). Contact uses the same grey
 * via body.md-page-contact (see below). White header clearance comes from
 * .wp-site-blocks padding-top + base background.
 */
main.wp-block-group:has(.md-archive) {
	overflow: visible;
	position: relative;
	left: auto;
	transform: none;
	/* width / horizontal pad: shared full-bleed band rule above */
	max-width: none !important;
	box-sizing: border-box;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0;
	padding-bottom: var(--md-space-section, 6rem);
	background: var(--md-color-subtle, #f3f3f3);
}

.entry-content:has(.md-archive),
.wp-block-post-content:has(.md-archive) {
	overflow: visible;
}

/*
 * h1 — light by default; bold only via strong/b or explicit editor weight.
 * Excludes CPT hero titles (.md-hero__title keeps its own weight in camred-core).
 */
:is(h1, h1.wp-block-heading):not(.md-hero__title):not(.md-single-hero__title):not(.md-single-header__title) {
	font-weight: 300;
}

h1 :is(strong, b),
h1.wp-block-heading :is(strong, b) {
	font-weight: 700;
}

/*
 * Page titles (Outputs, About, Contact, etc.) — match home section display
 * headings, and sit on the same alignwide 1400 grid as the header brand /
 * footer / constrained entry-content children (not full main width).
 */
main > .wp-block-post-title {
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-left: auto;
	margin-right: auto;
}

/*
 * Page h1 vertical rhythm — padding (not margin) so band backgrounds fill the title box.
 * !important on margins: first-child margin collapses out of main on band pages, leaving
 * a white strip above regional/archive shells (0.8.56 margin regression on project pages).
 * Excludes single CPT hero (.md-single-hero__title).
 */
main > .wp-block-post-title:not(.md-single-hero__title) {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding-top: var(--md-space-title, 4rem);
	padding-bottom: var(--md-space-title, 4rem);
}

/* Band shells (project, About, archive pages) — higher specificity than layout flow / h1 defaults */
main.wp-block-group:has(.md-jump-nav) > .wp-block-post-title:not(.md-single-hero__title),
main.wp-block-group:has(.md-archive) > .wp-block-post-title:not(.md-single-hero__title) {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding-top: var(--md-space-title, 4rem) !important;
	padding-bottom: var(--md-space-title, 4rem) !important;
}

/*
 * Compact-header page h1 — sit below the floating nav pill (must follow band
 * title rules above so !important wins over the 4rem wide-desktop padding).
 * Same ≤1049px band as COMPACT_MQ / site-blocks bleed.
 */
@media (max-width: 1049px) {
	main > .wp-block-post-title:not(.md-single-hero__title),
	main.wp-block-group:has(.md-jump-nav) > .wp-block-post-title:not(.md-single-hero__title),
	main.wp-block-group:has(.md-archive) > .wp-block-post-title:not(.md-single-hero__title) {
		padding-top: calc(var(--md-header-height, 5.5rem) + var(--md-space, 1.5rem) + 0.75rem) !important;
		padding-bottom: var(--md-space, 1.5rem) !important;
	}
}

.entry-content > .md-archive,
.wp-block-post-content > .md-archive,
.wp-block-shortcode:has(> .md-archive) > .md-archive {
	position: relative !important;
	left: auto !important;
	transform: none !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	background: transparent;
	padding-top: 0;
}

/*
 * Band pages — match header alignwide: one horizontal inset from main only.
 * Post content also has global padding, which stacked with archive layout padding.
 */
main.wp-block-group:has(.md-archive) > .wp-block-post-content.has-global-padding,
main.wp-block-group:has(.md-archive) > .entry-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/*
 * Contact (.md-page-band) — same double-inset fix as archive pages.
 * Without this, has-global-padding's own root-padding-left would stack with
 * .md-page-band's margin-left below, indenting the form column twice as far
 * as the page title.
 */
main.wp-block-group:has(.md-page-band) > .wp-block-post-content.has-global-padding,
main.wp-block-group:has(.md-page-band) > .entry-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

html[data-md-theme="dark"] main.wp-block-group:has(.md-archive) {
	background: var(--md-color-subtle, #3a3938);
}

html[data-md-theme="dark"] .wp-site-blocks {
	background-color: var(--md-color-base, #1c1b1a);
}

/*
 * Measure pages (Contact) — form column at two-thirds of the content band,
 * left-aligned flush with the header logo / footer content (not the page
 * title). Page is plain white (Home model), not a full-bleed grey shell —
 * do not center this block in the viewport.
 *
 * Why margin-left is 0, not a padding-left fallback (0.9.30 regression):
 * main here is a normal constrained block (not full-bleed like .md-archive
 * or the jump-nav shell), so it is centred to content-size within
 * .wp-site-blocks exactly like .md-header__inner is — both share the same
 * margin-left from core's auto-centring. The earlier `max(padding-left, …)`
 * formula re-added has-global-padding's own root padding on top of that
 * centring, which matches the *page title* (title keeps its own
 * has-global-padding) but sits one root-padding step to the right of the
 * header logo and footer content. Since post-content's has-global-padding
 * is already zeroed below for band pages, 0 here lines the band up with
 * post-content's own (already correctly centred) edge — i.e. the header/
 * footer edge — instead of re-adding the title's extra inset.
 *
 * Mobile uses the same margin-left: 0 — post-content padding is already
 * zeroed for band pages, so a mobile-only root-padding margin here stacked
 * a second inset and misaligned Contact with the footer and nav gutter.
 *
 * !important + descendant-qualified selector: WordPress core's constrained-
 * layout support outputs `.is-layout-constrained > :where(:not(.alignleft)
 * :not(.alignright):not(.alignfull))` with max-width/margin-left/margin-right
 * all `!important`, and post-content picks up `.is-layout-constrained`
 * automatically. Without matching !important + specificity here, that core
 * rule always wins and the band renders at full content width regardless of
 * source order (the 0.9.29 regression).
 */
.entry-content .md-page-band,
.wp-block-post-content .md-page-band {
	--md-single-measure: calc((var(--wp--style--global--content-size, 1400px) - var(--md-gutter, 2rem)) * 2 / 3);
	box-sizing: border-box;
	width: 100%;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: auto !important;
	padding: 0;
	background: transparent;
}

@media (min-width: 900px) {
	.entry-content .md-page-band,
	.wp-block-post-content .md-page-band {
		max-width: var(--md-single-measure) !important;
	}
}

/*
 * Contact page measure band — page title matches About post-title spacing;
 * forms sit in collapsed panels below.
 */
body.md-page-contact .md-page-band > h1 {
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.2;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding-top: var(--md-space-title, 4rem);
	padding-bottom: var(--md-space-title, 4rem);
	border-top: none;
}

@media (max-width: 1049px) {
	body.md-page-contact .md-page-band > h1 {
		padding-top: calc(var(--md-header-height, 5.5rem) + var(--md-space, 1.5rem) + 0.75rem) !important;
		padding-bottom: var(--md-space, 1.5rem) !important;
	}

	body.md-page-contact main.wp-block-group {
		padding-top: 0;
	}
}

/*
 * Contact page panels only — larger CTA-style toggles with fuller closed copy.
 * Does not change About / project .wp-block-details accordions.
 */
.md-page-band .md-contact-details {
	--md-contact-pad-x: clamp(1.75rem, 3.5vw, 2.75rem);
	--md-contact-pad-y: clamp(1.75rem, 3.5vw, 2.75rem);
	--md-contact-gap: var(--md-contact-pad-x);
	--md-contact-title-size: clamp(1.35rem, 0.6vw + 1.2rem, 1.75rem);
	--md-contact-title-line: calc(var(--md-contact-title-size) * 1.2);
	/* Same marker size as About / project panels; indent tracks site marker. */
	--md-contact-indent: calc(var(--md-contact-pad-x) + var(--md-details-marker) + var(--md-contact-gap));
	margin-bottom: var(--md-space-stack, 3rem);
	box-shadow: 0 4px 16px rgba(28, 27, 26, 0.08);
}

.md-page-band .md-contact-details:last-child {
	margin-bottom: 0;
}

.md-page-band > h1 + .md-contact-details {
	margin-top: 0;
}

.md-page-band .md-contact-details:hover,
.md-page-band .md-contact-details[open]:not(.md-details--animated),
.md-page-band .md-contact-details[open].md-details--revealed {
	box-shadow: 0 8px 24px rgba(28, 27, 26, 0.14);
}

.md-page-band .md-contact-details summary {
	align-items: flex-start;
	gap: 1rem var(--md-contact-gap);
	padding: var(--md-contact-pad-y) var(--md-contact-pad-x);
}

.md-page-band .md-contact-details[open] > summary {
	padding-bottom: 1.15rem;
}

.md-page-band .md-contact-details summary::before {
	/* Sit on the title line, not centred on the whole summary stack. */
	align-self: flex-start;
	margin-top: calc((var(--md-contact-title-line) - var(--md-details-marker)) / 2);
}

/* Form / panel body aligns with title + lede, not the +/- marker. */
.md-page-band .md-contact-details .md-details__inner,
.md-page-band .md-contact-details > :not(summary):not(.md-details__panel) {
	padding-left: var(--md-contact-indent);
	padding-right: var(--md-contact-pad-x);
}

.md-contact-details__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.65rem;
	min-width: 0;
	flex: 1 1 auto;
}

.md-contact-details__title {
	display: block;
	font-size: var(--md-contact-title-size);
	line-height: 1.2;
}

.md-contact-details__lede {
	display: block;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: clamp(1.0625rem, 0.2vw + 1rem, 1.1875rem);
	font-weight: 400;
	line-height: 1.5;
	color: #4a4846;
}

/* Tighter Ninja Forms spacing inside Contact panels only. */
.md-contact-details .nf-field-container {
	margin-bottom: 1.25rem;
}

.md-contact-details .nf-field-label,
.md-contact-details .nf-field-label label {
	margin-bottom: 0.35rem;
}

.md-contact-details .nf-field-container.submit-container {
	margin-top: 0.15rem;
	margin-bottom: 0;
}

html[data-md-theme="dark"] .md-page-band .md-contact-details {
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28);
}

html[data-md-theme="dark"] .md-page-band .md-contact-details:hover,
html[data-md-theme="dark"] .md-page-band .md-contact-details[open]:not(.md-details--animated),
html[data-md-theme="dark"] .md-page-band .md-contact-details[open].md-details--revealed {
	box-shadow: 0 8px 26px rgba(0, 0, 0, 0.4);
}

html[data-md-theme="dark"] .md-contact-details__lede {
	color: #d5d3d0;
}

@media (max-width: 899px) {
	.md-page-band .md-contact-details {
		--md-contact-pad-x: 1.25rem;
		--md-contact-pad-y: 1.35rem;
		--md-contact-title-size: 1.2rem;
		margin-bottom: var(--md-space, 1.5rem);
	}

	.md-contact-details__lede {
		font-size: 1rem;
	}
}

/* Project pages (Kenya / UK) — full-width regional band from below header (Impact-style shell) */
body.md-region-kenya main.wp-block-group:has(.md-jump-nav),
body.md-region-uk main.wp-block-group:has(.md-jump-nav) {
	position: relative;
	left: auto;
	transform: none;
	/* width / horizontal pad: shared full-bleed band rule above */
	max-width: none !important;
	box-sizing: border-box;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0;
	padding-bottom: 0;
	overflow: visible;
	background: var(--md-project-hero-bg, var(--md-color-subtle, #f3f3f3));
}

body.md-region-kenya main.wp-block-group:has(.md-jump-nav) {
	--md-project-hero-bg: color-mix(in srgb, var(--md-color-accent, #34f58c) 16%, #f3f3f3);
}

body.md-region-uk main.wp-block-group:has(.md-jump-nav) {
	--md-project-hero-bg: color-mix(in srgb, var(--md-color-primary, #f579f5) 16%, #f3f3f3);
}

body.md-region-kenya main.wp-block-group:has(.md-jump-nav) > .wp-block-post-content.has-global-padding,
body.md-region-kenya main.wp-block-group:has(.md-jump-nav) > .entry-content.has-global-padding,
body.md-region-uk main.wp-block-group:has(.md-jump-nav) > .wp-block-post-content.has-global-padding,
body.md-region-uk main.wp-block-group:has(.md-jump-nav) > .entry-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

html[data-md-theme="dark"] body.md-region-kenya main.wp-block-group:has(.md-jump-nav),
html[data-md-theme="dark"] body.md-region-uk main.wp-block-group:has(.md-jump-nav) {
	--md-project-hero-bg: var(--md-color-subtle, #3a3938);
	background: var(--md-project-hero-bg);
}

/* Jump-nav pages without regional tint (About) — band background behind title */
body:not(.md-region-kenya):not(.md-region-uk) main.wp-block-group:has(.md-jump-nav) {
	position: relative;
	left: auto;
	transform: none;
	/* width / horizontal pad: shared full-bleed band rule above */
	max-width: none !important;
	box-sizing: border-box;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0;
	padding-bottom: 0;
	overflow: visible;
	background: var(--md-color-subtle, #f3f3f3);
}

body:not(.md-region-kenya):not(.md-region-uk) main.wp-block-group:has(.md-jump-nav) > .wp-block-post-content.has-global-padding,
body:not(.md-region-kenya):not(.md-region-uk) main.wp-block-group:has(.md-jump-nav) > .entry-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

html[data-md-theme="dark"] body:not(.md-region-kenya):not(.md-region-uk) main.wp-block-group:has(.md-jump-nav) {
	background: var(--md-color-subtle, #3a3938);
}

/* —— In-page jump nav (sticky left column, like archive filters) —— */

/*
 * Jump-nav (“On this page”) — fixed column width. Archive filters keep their
 * wider clamp in archive-filters.css (--md-archive-sidebar).
 */
main:has(.md-jump-nav) {
	--md-jump-sidebar: 15rem;
	/* Sidebar track + column gap — so prose cqi matches the text column. */
	--md-prose-track-inset: calc(var(--md-jump-sidebar) + var(--md-jump-gap));
	/*
	 * Distance from viewport edges → content column (WPBakery nest). Must include
	 * the alignwide 1400 centering inset. Use 100vw (not cqi): sections are also
	 * size containers (md-band), so inherited 100cqi would resolve against the
	 * section width and collapse the inset.
	 */
	--md-section-alignwide-inset: max(
		var(--md-root-pad-x-start, var(--wp--style--root--padding-left, 1.5rem)),
		calc((100vw - var(--wp--style--global--wide-size, 1400px)) / 2)
	);
	--md-section-bleed-x: calc(
		var(--md-section-alignwide-inset)
		+ var(--md-jump-sidebar, 15rem)
		+ var(--md-jump-gap, var(--md-gutter, 2rem))
	);
	--md-section-bleed-right: var(--md-section-alignwide-inset);
}

/*
 * Desktop jump-nav grid: fixed sidebar | content.
 * Direct-child form = FSE / plain markup. Wrapper form = WPBakery
 * (.wpb-content-wrapper holds nav + vc_row as siblings).
 */
.entry-content:has(> .md-jump-nav),
.wp-block-post-content:has(> .md-jump-nav),
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav),
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) {
	display: grid;
	grid-template-columns: var(--md-jump-sidebar, 13rem) minmax(0, 1fr);
	column-gap: var(--md-jump-gap, var(--md-gutter, 2rem));
	row-gap: 0;
	align-items: start;
	overflow: visible;
}

.entry-content:has(> .md-jump-nav) > .md-jump-nav,
.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav,
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav {
	grid-column: 1;
	grid-row: 1 / -1;
	justify-self: stretch;
	align-self: start;
	width: 100%;
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
	text-align: left;
}

/*
 * Jump nav spans column 1 for all rows — without an explicit row, the first
 * full-width section (or WPBakery vc_row) auto-places on row 2.
 */
.entry-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + *,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + * {
	grid-row: 1;
	padding-top: 0;
}

/*
 * First band sits level with the jump-nav. Later sections keep --md-section-pad-top
 * so headings clear the sticky header when scrolled flush. WPBakery nests the
 * section inside vc_row, so zero the first .md-page-section explicitly.
 */
/*
 * WPBakery wraps every band in its own .vc_row > .wpb_wrapper, so a bare
 * `.wpb_wrapper > .md-page-section:first-of-type` matched EVERY band and zeroed
 * all the top padding. Limit it to the row directly after the jump nav.
 * :first-of-type — WPBakery often leaves an empty <p> before the first section.
 */
.entry-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + .vc_row .wpb_wrapper > .md-page-section:first-of-type,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + .vc_row .wpb_wrapper > .md-page-section:first-of-type {
	padding-top: 0;
}

.entry-content:has(> .md-jump-nav) > *:not(.md-jump-nav),
.wp-block-post-content:has(> .md-jump-nav) > *:not(.md-jump-nav),
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > *:not(.md-jump-nav),
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > *:not(.md-jump-nav) {
	grid-column: 2;
	min-width: 0;
	width: 100%;
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
	justify-self: stretch;
	text-align: left;
}

/*
 * Shared frosted sidebar shell (structure only).
 * Pill hover/active states are reserved for project jump-nav links (.md-jump-nav__link).
 * Archive filters use checkbox form controls (.md-archive__checkbox) — see archive-filters.css.
 */
.md-sidebar-panel,
.md-jump-nav,
.md-archive__filters {
	position: sticky;
	/* Gap under the header = --md-header-float-gap, equal to the header's own gap
	 * above it (--md-header-top-gap): 1rem desktop, 0.75rem phones. */
	top: calc(var(--md-sticky-nav-offset, 5rem) + var(--md-header-float-gap, 0.5rem));
	z-index: 40;
	margin: 0;
	box-sizing: border-box;
	/*
	 * Inner inset so active/hover pills clear the frosted shell edges (top and
	 * bottom). Prefer padding here over margin on the nav — margin would only
	 * push neighbouring content, not separate pills from the panel chrome.
	 */
	padding: 0.85rem;
	background-color: var(--md-frost-nav-shell);
	background: var(--md-frost-nav-shell);
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	--md-sidebar-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
	box-shadow: none;
	transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
	text-align: left;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
}

.md-sidebar-panel--lifted {
	box-shadow: var(--md-sidebar-shadow);
}

@media (prefers-reduced-motion: reduce) {
	.md-sidebar-panel,
	.md-jump-nav,
	.md-archive__filters {
		transition: none;
	}
}

/* Jump nav — pill metrics only; shell padding from shared .md-sidebar-panel */
.md-jump-nav {
	/*
	 * Full-width pills read thinner than compact header pills at the same height.
	 * Use the same inline pad as .md-header__nav, with matching block pad so the
	 * text inset matches the About / Projects buttons.
	 */
	--md-nav-pill-pad-x: 0.85rem;
	/* Equal to header --md-nav-pill-pad-x — vertical inset around label text */
	--md-nav-pill-pad-y: 0.85rem;
}

.md-sidebar-panel__title,
.md-archive__filters-title {
	margin: 0 0 0.85rem;
	padding: 0 var(--md-nav-pill-pad-x, 0.85rem);
	font-weight: 700;
	/* Same size as jump-nav / header submenu items */
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1;
	text-align: left;
	color: var(--md-color-contrast, #1c1b1a);
}

/* Desktop sidebar: title is redundant beside the page heading. */
.md-jump-nav__title {
	display: none;
}

/* Mobile dropdown chrome — hidden on desktop; activated ≤899px. */
.md-jump-nav__toggle {
	display: none;
}

/* Transparent wrapper on desktop so the list keeps participating in the sticky panel. */
.md-jump-nav__panel {
	display: contents;
}

.md-jump-nav__list {
	position: relative;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	/* Match Projects header submenu gap */
	gap: 0.2rem;
	align-items: stretch;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: visible;
	text-align: left;
}

/*
 * Sliding active pill — JS positions via transform/size; colour tokens match
 * the old .is-active fills (neutral / regional / dark).
 */
.md-jump-nav__indicator {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 0;
	height: 0;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-contrast, #1c1b1a);
	pointer-events: none;
	opacity: 0;
	transform: translate(0, 0);
	will-change: transform, width, height;
	transition:
		transform var(--md-transition-duration-slide) cubic-bezier(0.65, 0, 0.35, 1),
		width var(--md-transition-duration-slide) cubic-bezier(0.65, 0, 0.35, 1),
		height var(--md-transition-duration-slide) cubic-bezier(0.65, 0, 0.35, 1),
		opacity var(--md-transition-duration) var(--md-transition-ease),
		filter var(--md-transition-duration) var(--md-transition-ease),
		background-color var(--md-transition-duration) var(--md-transition-ease);
}

.md-jump-nav__indicator.is-visible {
	opacity: 1;
}

.md-jump-nav__indicator.is-instant {
	transition: none;
}

.md-jump-nav:has(.md-jump-nav__link.is-active:hover) .md-jump-nav__indicator,
.md-jump-nav:has(.md-jump-nav__link.is-active:focus-visible) .md-jump-nav__indicator {
	filter: brightness(0.92);
}

.md-jump-nav__item {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0;
	flex: 0 0 auto;
	width: 100%;
	text-align: left;
}

.md-jump-nav__link {
	display: flex;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	/* Full width of the panel; pad matches header nav pill text inset */
	min-height: 0;
	height: auto;
	padding: var(--md-nav-pill-pad-y, 0.85rem) var(--md-nav-pill-pad-x, 0.85rem);
	border-radius: var(--md-radius-pill, 0.25rem);
	font-weight: 400;
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1;
	text-align: left;
	text-decoration: none !important;
	text-decoration-thickness: initial;
	text-decoration-color: transparent;
	color: var(--md-color-contrast, #1c1b1a);
	background: transparent;
	white-space: normal;
	outline: none;
	box-shadow: none;
}

.md-jump-nav__link:hover {
	background: var(--md-color-subtle, #f3f3f3);
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
}

/* Keyboard only — no thick ring after mouse click */
.md-jump-nav__link:focus:not(:focus-visible) {
	outline: none;
	box-shadow: none;
}

.md-jump-nav__link:focus-visible:not(.is-active) {
	outline: none;
	background: var(--md-color-subtle, #f3f3f3);
}

/* Fill lives on .md-jump-nav__indicator — keep text contrast here only */
.md-jump-nav__link.is-active {
	background: transparent !important;
	color: #fff !important;
	font-weight: 400;
	outline: none !important;
	box-shadow: none !important;
}

.md-jump-nav__link.is-active:hover,
.md-jump-nav__link.is-active:focus,
.md-jump-nav__link.is-active:focus-visible {
	background: transparent !important;
	color: #fff !important;
	outline: none !important;
	box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.md-jump-nav__indicator {
		transition: none;
	}
}

/*
 * Static pages — section dividers above major h2 headings (Privacy, Toolkit,
 * Contact, and other flat Gutenberg bodies). Match single-post h2 tokens.
 * Do not require [id]: Privacy only anchors Cookies, so other h2s were skipping
 * the rule. Include the first content h2 (e.g. Who we are) so Privacy matches
 * the rest of the page. H3s stay without this divider (Cookie subsections keep
 * plain hierarchy). Project-page section titles keep their own :first-of-type
 * skip under .md-page-section.
 */
.entry-content > :is(h2, h2.wp-block-heading),
.wp-block-post-content > :is(h2, h2.wp-block-heading) {
	margin-top: var(--md-space-stack, 3rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--md-color-contrast, #1c1b1a);
}

/*
 * Home top spacing must be padding (not first-child margin).
 * Core block styles zero margin-block-start on the first content block,
 * which is why raising .md-home__vision margin-top never showed.
 * Matches --md-space-section (Featured / Projects / Latest / .md-page-section).
 * ≤1049px: header clearance is added in the compact .wp-site-blocks bleed block
 * above (that rule must win over this one — keep it after this block if reordering).
 */
.md-main--home {
	padding-top: var(--md-space-section, 6rem);
	overflow: visible;
}

/*
 * Programme / page lede — same type as Home vision (--md-type-lede).
 *
 * Preferred (CPT singles):
 *   Text Block with Extra class name md-lede (on .wpb_text_column).
 *   Put the lead-in paragraph alone in that Text Block; no Formats menu.
 *   Event name / date / venue: CAMRED Event details element (.md-event-details).
 * Also styled: .md-page__lede / .is-style-lede (legacy), Intro lede (.md-vc-lede).
 *
 * Spacing: Home vision keeps a full section gap before Featured.
 * Page / single ledes use a short lead-in gap (--md-space-lede-after).
 */
.md-home__vision,
.md-page__lede,
.is-style-lede,
.md-vc-lede,
.wpb_text_column.md-lede .wpb_wrapper > p,
:is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
.md-vc-lede > :is(p, .wp-block-paragraph) {
	margin-top: 0 !important;
	margin-left: 0 !important;
	margin-right: auto;
	padding-block-start: 0;
	font-size: var(--md-type-lede, clamp(1.625rem, 2.25vw, 2.125rem));
	/* Page / single Lead-in + VC lede (regular); Home vision overridden to 300 below. */
	font-weight: 400;
	line-height: 1.35;
	letter-spacing: 0;
	max-width: none;
	text-align: left;
}

.md-home__vision {
	/* Keep programme vision lighter than page / post Lead-in. */
	font-weight: 300;
	margin-bottom: var(--md-space-section, 6rem) !important;
}

.md-page__lede,
.is-style-lede,
.md-vc-lede,
.wpb_text_column.md-lede,
:is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede) {
	/* Lead-in into following copy; was --md-space-section (6rem). */
	margin-bottom: var(--md-space-lede-after, 1.75rem) !important;
}

/* Nested paragraphs inside the VC wrapper inherit the lede; only the wrapper spaces. */
.md-vc-lede > :is(p, .wp-block-paragraph),
.wpb_text_column.md-lede .wpb_wrapper > p {
	margin-bottom: 0 !important;
}

@media (max-width: 899px) {
	.md-home__vision,
	.md-page__lede,
	.is-style-lede,
	.md-vc-lede,
	.wpb_text_column.md-lede .wpb_wrapper > p,
	:is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
	.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
	.md-vc-lede > :is(p, .wp-block-paragraph) {
		font-size: clamp(1.125rem, 3.5vw, 1.375rem);
		/* Weight stays at the desktop values (lede 400 / Home vision 300). */
		line-height: 1.4;
	}

	.md-home__vision {
		/* Same token as desktop; mobile page-section uses 4rem but home
		 * Featured/Projects keep --md-space-section. */
		margin-bottom: var(--md-space-section, 6rem) !important;
	}

	.md-page__lede,
	.is-style-lede,
	.md-vc-lede,
	.wpb_text_column.md-lede,
	:is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
	.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede) {
		margin-bottom: var(--md-space-lede-after, 1.75rem) !important;
	}

	.md-vc-lede > :is(p, .wp-block-paragraph),
	.wpb_text_column.md-lede .wpb_wrapper > p {
		margin-bottom: 0 !important;
	}
}

/* Re-assert home clearance wherever the compact header bleeds (≤1049). */
@media (max-width: 1049px) {
	.md-main--home {
		padding-top: calc(var(--md-header-height, 5.5rem) + var(--md-space-section, 6rem));
	}
}

@media (min-width: 900px) {
	.md-home__vision,
	.md-page__lede,
	.is-style-lede,
	.md-vc-lede,
	.wpb_text_column.md-lede .wpb_wrapper > p,
	:is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
	.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__lede, .is-style-lede),
	.md-main--single .wpb_text_column .wpb_wrapper > :is(.md-page__lede, .is-style-lede) {
		max-width: calc(var(--wp--style--global--content-size, 1400px) * 2 / 3);
	}
}

/*
 * Event details box (CAMRED WPBakery element .md-event-details).
 * Surface panel like pull quotes; Space Mono lines; title in Inclusive Sans.
 * Same soft prose measure as body paragraphs (.md-objectives pattern): font-size on
 * the box so `ch` resolves to the same px width as .wpb_wrapper > p. Children keep
 * their own type sizes. Avoids mid-width mismatch where boxes outrun shortened copy.
 * Legacy one-line meta (.md-page__meta-line / .is-style-meta-line) kept for old markup.
 * Italic-only second paragraphs are no longer auto-styled as meta lines.
 */
.md-event-details {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
	margin: 0 0 var(--md-space-lede-after, 1.75rem);
	padding: var(--md-space, 1.5rem);
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-surface, #ffffff);
	color: var(--md-color-contrast, #1c1b1a);
}

.md-main--single .vc_row:first-child .wpb_text_column:first-of-type + .wpb_raw_code .md-event-details,
.md-main--single .vc_row:first-child .wpb_wrapper > .md-event-details,
.md-main--single .vc_row:first-child .wpb_wrapper > .wpb_content_element:has(.md-event-details) {
	margin-top: 0;
}

/*
 * Title is an h3 for heading order (after post H1 / body H2s). Reset generic
 * heading size, borders, and padding so it keeps the compact box-title look.
 */
.md-event-details__title,
.md-event-details > h3.md-event-details__title {
	margin: 0 0 var(--md-space-subheading, 0.75rem);
	padding: 0;
	border: none;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
	font-weight: 600;
	line-height: var(--md-body-leading, 1.5);
	letter-spacing: normal;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-event-details__lines {
	margin: 0;
	padding: 0;
}

/* Space Mono at caption / meta size (same as figcaptions). */
.md-event-details__line {
	margin: 0;
	padding: 0;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-meta, 0.9375rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: 0.02em;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-event-details__line + .md-event-details__line {
	margin-top: 0.35rem;
}

html[data-md-theme="dark"] .md-event-details {
	background: var(--md-color-surface, #2a2928);
}

.md-page__meta-line,
.is-style-meta-line,
:is(.entry-content, .wp-block-post-content) > :is(.md-page__meta-line, .is-style-meta-line),
.md-main--single :is(.entry-content, .wp-block-post-content) > :is(.md-page__meta-line, .is-style-meta-line) {
	margin-top: 0 !important;
	margin-bottom: var(--md-space-lede-after, 1.75rem) !important;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
	font-weight: 400;
	line-height: var(--md-body-leading, 1.5);
	letter-spacing: normal;
	color: var(--md-color-contrast, #1c1b1a);
	max-width: var(--md-prose-measure, 66ch);
}

:is(.md-page__lede, .is-style-lede) + :is(.md-page__meta-line, .is-style-meta-line) {
	/* Sit close under the lede; cancel lede bottom, keep a short gap. */
	margin-top: calc(-1 * var(--md-space-lede-after, 1.75rem) + 0.85rem) !important;
}

/*
 * WPBakery Button (vc_btn3) — match site CTAs (.wp-block-button__link).
 * Flat sides via --md-radius (overrides vc_btn3-shape-round pill). Inclusive Sans
 * 700 + shared padding. VC colour classes / inline onmouseenter stay intact.
 * Transform lives on the button itself so md-reveal--settled wrappers can keep
 * transform: none (crisp type) without killing hover lift.
 */
.vc_general.vc_btn3,
a.vc_general.vc_btn3,
button.vc_general.vc_btn3 {
	display: inline-block;
	padding: 0.55rem 1.15rem !important;
	border-radius: var(--md-radius, 0.5rem) !important;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif) !important;
	font-size: var(--md-text-body, 1.125rem) !important;
	font-weight: 700 !important;
	letter-spacing: 0;
	line-height: 1.25;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	text-decoration: none !important;
	box-shadow: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.vc_general.vc_btn3.vc_btn3-shape-round,
.vc_general.vc_btn3.vc_btn3-shape-rounded,
.vc_general.vc_btn3.vc_btn3-shape-square {
	border-radius: var(--md-radius, 0.5rem) !important;
}

.vc_general.vc_btn3:hover,
.vc_general.vc_btn3:focus-visible,
a.vc_general.vc_btn3:hover,
a.vc_general.vc_btn3:focus-visible,
button.vc_general.vc_btn3:hover,
button.vc_general.vc_btn3:focus-visible {
	text-decoration: none !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

/* Button containers inherit spacing from the preceding paragraph margin;
 * do not add extra padding-top (that stacked into a double gap). */
.md-main--single .wpb_wrapper .vc_btn3-container {
	padding-top: 0;
	margin-top: 0;
}

/* CPT singles — solid contrast fill like Gutenberg Button blocks on Resources. */
.md-main--single .wpb_wrapper .vc_general.vc_btn3 {
	background: var(--md-color-contrast, #1c1b1a) !important;
	color: var(--md-color-surface, #fff) !important;
	border-color: transparent !important;
}

.md-main--single .wpb_wrapper .vc_general.vc_btn3:hover,
.md-main--single .wpb_wrapper .vc_general.vc_btn3:focus-visible {
	background: #2e2d2c !important;
	color: var(--md-color-surface, #fff) !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

html[data-md-theme="dark"] .md-main--single .wpb_wrapper .vc_general.vc_btn3 {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
}

html[data-md-theme="dark"] .md-main--single .wpb_wrapper .vc_general.vc_btn3:hover,
html[data-md-theme="dark"] .md-main--single .wpb_wrapper .vc_general.vc_btn3:focus-visible {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

/*
 * Default static pages (Privacy Policy, etc.) — title top spacing via
 * .wp-block-post-title; bottom breathing room before the footer matches
 * singles without Related / Contact / archive shells (--md-space-section;
 * 4rem on small screens). Home, singles, archives, and jump-nav pages are
 * excluded (they have their own section or main padding). Contact also sets
 * the same token later for its grey shell.
 */
main.wp-block-group:not(.md-main--home):not(.md-main--single):not(:has(.md-archive)):not(:has(.md-jump-nav)) {
	margin-top: 0 !important;
	padding-bottom: var(--md-space-section, 6rem);
}

@media (max-width: 899px) {
	main.wp-block-group:not(.md-main--home):not(.md-main--single):not(:has(.md-archive)):not(:has(.md-jump-nav)) {
		padding-bottom: 4rem;
	}
}

/*
 * Contact — same grey shell as About (jump-nav pages). Template post-title is
 * removed, so the in-content h1 carries About’s title padding rhythm.
 *
 * Short viewports: flex-grow main so the grey band reaches the footer (site-wide
 * sticky-footer is position-based and leaves white dead space under a short main).
 * Scoped to Contact only — does not change the global sticky-footer approach.
 */
body.md-page-contact .wp-site-blocks {
	display: flex;
	flex-direction: column;
}

body.md-page-contact .wp-site-blocks > .wp-block-template-part:has(.md-footer),
body.md-page-contact .wp-site-blocks > footer.md-footer {
	position: static;
	top: auto;
	flex-shrink: 0;
	margin-top: 0;
}

body.md-page-contact main.wp-block-group {
	position: relative;
	left: auto;
	transform: none;
	/* width / horizontal pad: shared full-bleed band rule above */
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0;
	padding-bottom: var(--md-space-section, 6rem);
	overflow: visible;
	background: var(--md-color-subtle, #f3f3f3);
	flex: 1 0 auto;
}

html[data-md-theme="dark"] body.md-page-contact main.wp-block-group {
	background: var(--md-color-subtle, #3a3938);
}

body.md-page-contact main.wp-block-group > .wp-block-post-content.has-global-padding,
body.md-page-contact main.wp-block-group > .entry-content.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/*
 * Projects parent page — breathing room before the footer. Section margin on
 * .md-home-projects can collapse through post-content; padding on main is reliable.
 */
main.wp-block-group:has(.md-home-projects):not(.md-main--home) {
	padding-bottom: var(--md-space-section, 6rem);
}

main.wp-block-group:has(.md-home-projects):not(.md-main--home) .md-home-projects {
	margin-bottom: 0;
}

@media (max-width: 899px) {
	main.wp-block-group:has(.md-home-projects):not(.md-main--home) {
		padding-bottom: 4rem;
	}
}

/*
 * Project objectives. Large index numbers, with the statement a step above body copy.
 * Dividers use the project accent (Kenya green / UK magenta).
 */
.md-objectives {
	--md-objective-num-size: var(--md-text-objective-num, clamp(4.5rem, 9.5vw, 8.5rem));
	list-style: none;
	margin: 2rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.md-objectives li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: 2rem;
	align-items: start;
	margin: 0;
	padding: 2.25rem 0;
	border-bottom: 1px solid var(--md-region-accent, var(--md-color-primary, #f579f5));
}

.md-objectives li:first-child {
	border-top: 1px solid var(--md-region-accent, var(--md-color-primary, #f579f5));
}

.md-objectives__num {
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-objective-num-size);
	font-weight: 400;
	line-height: 0.85;
	letter-spacing: -0.04em;
	color: var(--md-region-accent, var(--md-color-primary, #f579f5));
}

.md-objectives__text {
	/* Drop the cap-height onto the top of the numeral. Ratios follow Space Mono at line-height 0.85 and Inclusive Sans at 1.4. */
	margin-top: calc(0.105 * var(--md-objective-num-size) - 0.345em);
	/* Floor eases down on narrow viewports; still a step above body on desktop. */
	font-size: var(--md-text-objective, clamp(1.125rem, 0.55vw + 1rem, 1.625rem));
	font-weight: 400;
	line-height: 1.4;
	color: var(--md-color-contrast, #1c1b1a);
}

/* Home Projects section — cards sit on the page (no band) */
.md-home-projects {
	margin: var(--md-space-section, 6rem) 0;
	padding: 0;
	background: transparent;
	border-radius: 0;
}

.md-home-projects__title {
	margin: 0 0 var(--md-space-stack, 3rem);
	font-size: var(--md-type-home-display, clamp(2rem, 3.2vw, 3rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-home-projects__list {
	display: grid;
	/* min(18rem, 100%): at large text or 400% zoom the column shrinks to the
	 * container instead of forcing the card wider than the screen. */
	grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr));
	align-items: stretch;
	gap: var(--md-gutter, 2rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

.md-home-projects__list > li {
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
}

.md-home-projects__card {
	--md-grad-x: 50%;
	--md-grad-y: 50%;
	container-type: inline-size;
	display: flex;
	flex: 1 1 auto;
	align-items: stretch;
	align-self: stretch;
	justify-content: flex-start;
	gap: 0;
	width: 100%;
	height: auto;
	/* Minimum 16:9; box grows taller if the copy needs more room. The li is a
	 * column flex container so height is the card's main axis, where the
	 * automatic minimum size (content height) applies; border-box makes the
	 * 16:9 the visible coloured box, padding included. */
	box-sizing: border-box;
	aspect-ratio: 16 / 9;
	overflow: visible;
	padding: clamp(1.5rem, 4cqi, 2.75rem);
	color: #1c1b1a !important;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	text-decoration: none !important;
	font-weight: 700;
	font-size: 1.15rem;
	line-height: 1.3;
	box-shadow: none;
	transition:
		box-shadow var(--md-transition-duration-move) var(--md-transition-ease),
		filter var(--md-transition-duration) var(--md-transition-ease),
		--md-grad-x var(--md-transition-duration-move) var(--md-transition-ease),
		--md-grad-y var(--md-transition-duration-move) var(--md-transition-ease);
}

.md-home-projects__card-body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: flex-start;
	gap: clamp(0.85rem, 2.5cqi, 1.35rem);
	min-width: 0;
	width: 100%;
}

.md-home-projects__card-title {
	display: block;
	font-size: clamp(1.85rem, 7.5cqi, 3.15rem);
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -0.02em;
	max-width: 18ch;
}

.md-home-projects__card-text {
	display: block;
	max-width: 75%;
	font-size: clamp(1.15rem, 3.4cqi, 1.5rem);
	font-weight: 400;
	line-height: 1.4;
}

/* Tinted white (10% project colour) → full project colour; origin follows pointer */
.md-home-projects__card--kenya {
	/* Pale centre starts bottom-right; pointer tracking can override. */
	--md-grad-x: 100%;
	--md-grad-y: 100%;
	background: radial-gradient(
		circle at var(--md-grad-x) var(--md-grad-y),
		color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff) 0%,
		color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff) 32%,
		var(--md-color-accent, #34f58c) 100%
	);
}

.md-home-projects__card--uk {
	/* Pale centre starts top-left; pointer tracking can override. */
	--md-grad-x: 0%;
	--md-grad-y: 0%;
	background: radial-gradient(
		circle at var(--md-grad-x) var(--md-grad-y),
		color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff) 0%,
		color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff) 30%,
		var(--md-color-primary, #f579f5) 100%
	);
}

.md-home-projects__card:hover,
.md-home-projects__card:focus-visible {
	text-decoration: none !important;
	filter: brightness(0.98);
}

.md-home-projects__card--kenya:hover,
.md-home-projects__card--kenya:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 45%, transparent);
}

.md-home-projects__card--uk:hover,
.md-home-projects__card--uk:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 45%, transparent);
}

html[data-md-theme="dark"] .md-home-projects__card--kenya:hover,
html[data-md-theme="dark"] .md-home-projects__card--kenya:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 50%, transparent);
}

html[data-md-theme="dark"] .md-home-projects__card--uk:hover,
html[data-md-theme="dark"] .md-home-projects__card--uk:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 50%, transparent);
}

/* Dark mode — the project cards keep their light-mode pale gradients and dark
 * text exactly (no dark tint, no opacity mix) so they stay matched to the logo
 * green and magenta; the base .md-home-projects__card--kenya/--uk rules above
 * apply in both themes. Only the keyboard focus ring needs a dark-mode rule:
 * cards use outline: none (glow only), which is too faint on the dark page, so
 * add a pale ring offset from the card (>= 3:1 against the dark page). */
html[data-md-theme="dark"] .md-home-projects__card:focus-visible {
	outline: 3px solid var(--md-color-contrast, #f5f5f4);
	outline-offset: 3px;
}

html[data-md-theme="dark"] .md-home-projects__title {
	color: var(--md-color-contrast, #f5f5f4);
}

/* Home Latest News & Events — full-bleed grey; content matches nav / projects */
.md-main--home .md-home-latest {
	position: relative;
	isolation: isolate;
	left: auto;
	transform: none;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 1400px);
	box-sizing: border-box;
	margin: var(--md-space-section, 6rem) auto 0 !important;
	padding: var(--md-space-section, 6rem) 0;
	background: transparent;
}

.md-main--home .md-home-latest::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
	background: var(--md-color-subtle, #f3f3f3);
	z-index: -1;
	pointer-events: none;
}

.md-main--home .md-home-latest > * {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

/*
 * Gap between the Home project cards and the Latest band, all widths.
 * Two 6rem margins stack (Projects margin-bottom + Latest margin-top) because
 * WPBakery's row/column clearfix stops them collapsing, which left the cards
 * 12rem (192px) above the grey band. One --md-space gap instead.
 * Space above the cards and the band's own inner padding are unchanged.
 */
.md-main--home .md-home-projects {
	margin-bottom: 0;
}

.md-main--home .md-home-latest {
	margin-top: var(--md-space, 1.5rem) !important;
}

.md-home-latest__title,
.md-home-latest > .wp-block-heading:first-child {
	margin-top: 0;
	margin-bottom: var(--md-space-stack, 3rem);
	font-size: var(--md-type-home-display, clamp(2rem, 3.2vw, 3rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
}

/*
 * Keep a fixed two-column track so one card stays half-width (auto-fit on
 * .md-latest__list--cards collapses to a single full-width column).
 */
.md-home-latest .md-latest__list {
	margin-bottom: 0;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 700px) {
	.md-home-latest .md-latest__list {
		grid-template-columns: 1fr;
	}
}

.md-main--home .md-home-latest > .md-home-latest__cta,
.md-main--home .md-home-latest .md-vc-text > .md-home-latest__cta,
.md-main--home .md-home-latest > .wp-block-paragraph:last-child {
	width: fit-content;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.md-home-latest__cta,
.md-home-latest > .wp-block-paragraph:last-child {
	display: block;
	margin-top: var(--md-space-stack, 3rem);
	margin-bottom: 0;
	text-align: center;
}

.md-home-latest__cta-link,
.md-home-latest > .wp-block-paragraph:last-child a,
:is(.entry-content, .wp-block-post-content) a.md-home-latest__cta-link {
	display: inline-block;
	padding: 0.85rem 1.75rem;
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	font-size: var(--md-text-body, 1.125rem);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.25;
	box-shadow: none;
	/* Higher specificity than body-copy <p> a transition so lift + shadow animate. */
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-home-latest__cta-link:hover,
.md-home-latest__cta-link:focus-visible,
.md-home-latest > .wp-block-paragraph:last-child a:hover,
.md-home-latest > .wp-block-paragraph:last-child a:focus-visible {
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

html[data-md-theme="dark"] .md-home-latest,
html[data-md-theme="dark"] .md-main--home .md-home-latest::before {
	background: var(--md-color-subtle, #3a3938);
}

html[data-md-theme="dark"] .md-home-latest__title,
html[data-md-theme="dark"] .md-home-latest > .wp-block-heading:first-child {
	color: var(--md-color-contrast, #f5f5f4);
}

/* Project pages — regional accent (Option B Kenya green / UK magenta) */
body.md-region-kenya {
	--md-region-accent: var(--md-color-accent, #34f58c);
	--md-region-nav-hover: color-mix(in srgb, var(--md-region-accent) 22%, var(--md-color-subtle, #f3f3f3));
}

body.md-region-uk {
	--md-region-accent: var(--md-color-primary, #f579f5);
	--md-region-nav-hover: color-mix(in srgb, var(--md-region-accent) 22%, var(--md-color-subtle, #f3f3f3));
}

body.md-region-kenya .md-jump-nav__indicator,
body.md-region-uk .md-jump-nav__indicator {
	background: var(--md-region-accent);
}

body.md-region-kenya .md-jump-nav__link.is-active,
body.md-region-uk .md-jump-nav__link.is-active,
body.md-region-kenya .md-jump-nav__link.is-active:hover,
body.md-region-kenya .md-jump-nav__link.is-active:focus-visible,
body.md-region-uk .md-jump-nav__link.is-active:hover,
body.md-region-uk .md-jump-nav__link.is-active:focus-visible {
	background: transparent !important;
	color: #1c1b1a !important;
	filter: none;
}

body.md-region-kenya .md-jump-nav__link:hover:not(.is-active),
body.md-region-kenya .md-jump-nav__link:focus-visible:not(.is-active),
body.md-region-uk .md-jump-nav__link:hover:not(.is-active),
body.md-region-uk .md-jump-nav__link:focus-visible:not(.is-active) {
	background: var(--md-region-nav-hover);
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
}

/* Project pages — regional header nav pills (matches jump-nav active pattern) */
body.md-region-kenya .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > a:focus-visible,
body.md-region-kenya .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > a:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:hover,
body.md-region-uk .md-header__nav .wp-block-navigation-item:not(.current-menu-item):not(.current-menu-ancestor) > .wp-block-navigation-item__content:focus-visible {
	background-color: var(--md-region-nav-hover) !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
}

body.md-region-kenya .md-header__nav .current-menu-item > a,
body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a,
body.md-region-kenya .md-header__nav [aria-current="page"],
body.md-region-uk .md-header__nav .current-menu-item > a,
body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a,
body.md-region-uk .md-header__nav [aria-current="page"] {
	background: var(--md-region-accent) !important;
	color: #1c1b1a !important;
}

body.md-region-kenya .md-header__nav .current-menu-item > a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a:hover,
body.md-region-kenya .md-header__nav [aria-current="page"]:hover,
body.md-region-kenya .md-header__nav .current-menu-item > a:focus-visible,
body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a:focus-visible,
body.md-region-kenya .md-header__nav [aria-current="page"]:focus-visible,
body.md-region-uk .md-header__nav .current-menu-item > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a:hover,
body.md-region-uk .md-header__nav [aria-current="page"]:hover,
body.md-region-uk .md-header__nav .current-menu-item > a:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a:focus-visible,
body.md-region-uk .md-header__nav [aria-current="page"]:focus-visible {
	background: var(--md-region-accent) !important;
	filter: brightness(0.94);
	color: #1c1b1a !important;
}

body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):focus-within,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):hover,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor):focus-within {
	background-color: var(--md-region-nav-hover);
	color: var(--md-color-contrast, #1c1b1a) !important;
}

body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor {
	background: var(--md-region-accent) !important;
	color: #1c1b1a !important;
}

body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover {
	background: transparent !important;
	color: #1c1b1a !important;
}

/*
 * Darken via color-mix, not filter: brightness(). This <li> is the submenu's
 * parent, and a filtered ancestor forms a backdrop root that kills the dropdown's
 * backdrop-filter. color-mix(… 94%, #000) matches brightness(0.94) exactly.
 */
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
	background: color-mix(in srgb, var(--md-region-accent) 94%, #000) !important;
	color: #1c1b1a !important;
}

body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item:not(.current-menu-item) > .wp-block-navigation-item__content:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item:not(.current-menu-item) > .wp-block-navigation-item__content:focus-visible,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item:not(.current-menu-item) a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item:not(.current-menu-item) a:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item:not(.current-menu-item) > .wp-block-navigation-item__content:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container > .wp-block-navigation-item:not(.current-menu-item) > .wp-block-navigation-item__content:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item:not(.current-menu-item) a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item:not(.current-menu-item) a:focus-visible {
	background: var(--md-region-nav-hover);
	color: var(--md-color-contrast, #1c1b1a);
}

body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:hover,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:focus-visible,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:focus-visible,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:hover,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a:focus-visible,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"]:focus-visible {
	background: var(--md-region-accent) !important;
	filter: brightness(0.94);
	color: #1c1b1a !important;
}

body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"],
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"] {
	background: var(--md-region-accent) !important;
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] body.md-region-kenya,
html[data-md-theme="dark"] body.md-region-uk {
	--md-region-nav-hover: color-mix(in srgb, var(--md-region-accent) 28%, var(--md-color-subtle, #3a3938));
}

html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .current-menu-item > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav [aria-current="page"],
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"],
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .current-menu-item > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav [aria-current="page"],
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .current-menu-item > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__submenu-container [aria-current="page"] {
	background: var(--md-region-accent) !important;
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav [aria-current="page"]:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .current-menu-item > a:focus-visible,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation-item.current-menu-item > a:focus-visible,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav [aria-current="page"]:focus-visible,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav [aria-current="page"]:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .current-menu-item > a:focus-visible,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation-item.current-menu-item > a:focus-visible,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav [aria-current="page"]:focus-visible {
	background: var(--md-region-accent) !important;
	filter: brightness(0.94);
	color: #1c1b1a !important;
}

/* Submenu parent <li> — color-mix, not filter (backdrop root; see light mode above). */
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
	background: color-mix(in srgb, var(--md-region-accent) 94%, #000) !important;
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover {
	color: #1c1b1a !important;
}

/* Project page section bands — full viewport width, behind jump nav.
 * Extra top pad so titles clear the fixed header when the band is
 * scrolled flush to the viewport top. */
.md-page-section {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	/*
	 * Vertical pad only. Horizontal inset comes from main / the jump-nav grid
	 * so the page title, “On this page” bar, and section copy share one edge.
	 * Band/soft colour still full-bleeds via ::before.
	 */
	padding: var(--md-section-pad-top, 7.25rem) 0 var(--md-space-section, 6rem);
	margin: 0;
	border-radius: 0;
}

/*
 * Span both columns; mirror the jump-nav grid so the gutter beside the sidebar
 * matches the card grid gap (--md-jump-gap = --md-gutter). Full-bleed colour via ::before.
 */
.entry-content:has(> .md-jump-nav) > .md-page-section,
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section {
	grid-column: 1 / -1;
	position: relative;
	isolation: isolate;
	z-index: 0;
	display: grid;
	grid-template-columns: var(--md-jump-sidebar, 13rem) minmax(0, 1fr);
	column-gap: var(--md-jump-gap, var(--md-gutter, 2rem));
	row-gap: 0;
	align-items: start;
	width: 100%;
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0;
	padding-right: 0;
	background: transparent;
}

.entry-content:has(> .md-jump-nav) > .md-page-section::before,
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
	z-index: -1;
	pointer-events: none;
	background: var(--md-section-bg, transparent);
}

.entry-content:has(> .md-jump-nav) > .md-page-section > *,
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section > * {
	grid-column: 2;
	min-width: 0;
	max-width: none;
}

/* Re-assert prose measure after the grid child max-width: none above. */
.entry-content:has(> .md-jump-nav) > .md-page-section > :is(p, .wp-block-paragraph, ul:not(.md-people-list):not(.md-partners__grid), ol, .wp-block-list),
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section > :is(p, .wp-block-paragraph, ul:not(.md-people-list):not(.md-partners__grid), ol, .wp-block-list) {
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
}

/* Name/role tables and partner logo grids keep the full content column. */
.entry-content:has(> .md-jump-nav) > .md-page-section > :is(ul.md-people-list, ul.md-partners__grid),
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section > :is(ul.md-people-list, ul.md-partners__grid),
.md-page-section > :is(ul.md-people-list, ul.md-partners__grid) {
	max-width: none;
}

/* Non-banded content also aligns to the same sidebar/content grid. */
.entry-content:has(> .md-jump-nav) > *:not(.md-jump-nav):not(.md-page-section),
.wp-block-post-content:has(> .md-jump-nav) > *:not(.md-jump-nav):not(.md-page-section) {
	padding-right: 0;
}

.md-page-section--band {
	--md-section-bg: var(--md-color-subtle, #f3f3f3);
	background: var(--md-section-bg);
}

.md-page-section--soft {
	--md-section-bg: color-mix(in srgb, var(--md-color-subtle, #f3f3f3) 55%, #fff);
	background: var(--md-section-bg);
}

body.md-region-kenya .md-page-section--band {
	--md-section-bg: color-mix(in srgb, var(--md-color-accent, #34f58c) 16%, #f3f3f3);
	background: var(--md-section-bg);
}

body.md-region-uk .md-page-section--band {
	--md-section-bg: color-mix(in srgb, var(--md-color-primary, #f579f5) 16%, #f3f3f3);
	background: var(--md-section-bg);
}

/* FSE: direct-child sections span the jump grid — paint via ::before only. */
.entry-content:has(> .md-jump-nav) > .md-page-section--band,
.entry-content:has(> .md-jump-nav) > .md-page-section--soft,
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section--band,
.wp-block-post-content:has(> .md-jump-nav) > .md-page-section--soft {
	background: transparent;
}

/*
 * WPBakery: sections already sit in the jump-grid content column. Drop the
 * default .md-page-section side padding so the sidebar→content gap matches
 * --md-jump-gap / card gutters, and content shares the header’s right edge.
 * Full-bleed band/soft colour paints on ::before using --md-section-bleed-*.
 */
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}

.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--band,
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--soft,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--band,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--soft {
	position: relative;
	isolation: isolate;
	z-index: 0;
	background: transparent !important;
}

.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--band::before,
.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--soft::before,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--band::before,
.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) .md-page-section--soft::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(-1 * var(--md-section-bleed-x, 0px));
	width: calc(100% + var(--md-section-bleed-x, 0px) + var(--md-section-bleed-right, 0px));
	z-index: -1;
	pointer-events: none;
	background: var(--md-section-bg, transparent);
}

.md-page-section > :is(h1, h2, h3, h4, h5, h6, .wp-block-heading, .wp-block-post-title, .md-page-section__title):first-child {
	margin-top: 0;
}

/* Heading-to-body gap within page sections — h2 titles (~1.5rem, not stack spacing). */
.md-page-section > :is(h2, .wp-block-post-title, .md-page-section__title) {
	margin-bottom: var(--md-space, 1.5rem);
}

/* Partners follows the team grid inside the same section, at the same size as Team. */
.md-page-section > h2#partners {
	margin-top: var(--md-space-stack, 3rem);
}

/* Partners in its own band: title sits at the band padding like every other band. */
.md-page-section > h2#partners:first-child {
	margin-top: 0;
}

/* h3 subsection labels — tighter gap to following copy (~0.75rem). */
.md-page-section > :is(h3, h3.wp-block-heading) {
	margin-bottom: var(--md-space-subheading, 0.75rem);
}

/*
 * Section grid items do not collapse margins; cancel WP block gap on the
 * immediate sibling so h3→body spacing is not doubled.
 */
.md-page-section > :is(h3, h3.wp-block-heading) + * {
	margin-block-start: 0;
	margin-top: 0;
}

@media (max-width: 899px) {
	.md-page-section > :is(h2, h2.wp-block-heading, .wp-block-post-title, .md-page-section__title) {
		margin-bottom: var(--md-space-subheading, 0.75rem);
	}

	/* Flow layout adds block gap — cancel so h2→body matches h3 tightness */
	.md-page-section > :is(h2, h2.wp-block-heading) + * {
		margin-block-start: 0;
		margin-top: 0;
	}

	:root {
		/*
		 * Gap + header bar + gap + sticky "On this page" bar + gap
		 * = 3 gaps (0.75rem) + 2 bars (3.25rem) = 8.75rem.
		 */
		--md-section-pad-top: calc(var(--md-header-float-gap, 0.75rem) * 3 + var(--md-mobile-bar-height, 3.25rem) * 2);
	}

	.md-page-section {
		padding-top: var(--md-section-pad-top, 5.5rem);
		padding-bottom: 4rem;
	}
}

/* Project page sections — h2 divider when not the first h2 in the section */
.md-page-section > h2:not(:first-of-type) {
	margin-top: var(--md-space-stack, 3rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--md-color-contrast, #1c1b1a);
}

/*
 * All flat h3 blocks within a section get the same top divider (e.g. UK/Kenya
 * under Advisory, Methodology/Work packages under Methods). Partners keeps
 * --divider class in markup for clarity; styling is consolidated here.
 */
.md-page-section > :is(h3, h3.wp-block-heading),
.md-page-section > .md-page-section__subheading--divider {
	margin-top: var(--md-space-stack, 3rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--md-color-contrast, #1c1b1a);
}

/*
 * h3 labels immediately above tables or people lists — drop the top divider;
 * the table or list carries its own row borders (e.g. Stakeholders on project
 * pages; Collaborators / Advisory board Kenya/UK on About).
 */
.md-page-section > :is(
		h3,
		h3.wp-block-heading,
		.md-page-section__subheading--divider
	):is(
		:has(+ table),
		:has(+ .wp-block-table),
		:has(+ figure.wp-block-table),
		:has(+ .wp-block-html table),
		:has(+ ul.md-people-list),
		:has(+ .md-people-list),
		:has(+ .wp-block-html .md-people-list)
	) {
	padding-top: 0;
	border-top: none;
}

/* h3-led subsections — inset bands alternating with parent section background */
.md-page-subsection {
	box-sizing: border-box;
	padding: var(--md-space, 1.5rem);
	margin-top: var(--md-space-stack, 3rem);
	border-radius: var(--md-radius, 0.5rem);
}

.md-page-subsection--band {
	background: var(--md-color-subtle, #f3f3f3);
}

.md-page-subsection--soft {
	background: color-mix(in srgb, var(--md-color-subtle, #f3f3f3) 55%, #fff);
}

body.md-region-kenya .md-page-subsection--band {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 16%, #f3f3f3);
}

body.md-region-uk .md-page-subsection--band {
	background: color-mix(in srgb, var(--md-color-primary, #f579f5) 16%, #f3f3f3);
}

.md-page-subsection > :is(h3, h3.wp-block-heading):first-child {
	margin-top: 0;
	margin-bottom: var(--md-space-subheading, 0.75rem);
}

.md-page-subsection > :is(h4, h5, h6, h4.wp-block-heading, h5.wp-block-heading, h6.wp-block-heading):first-child {
	margin-top: 0;
	margin-bottom: var(--md-space, 1.5rem);
}

.md-page-subsection > :is(h3, h3.wp-block-heading):first-child + * {
	margin-block-start: 0;
	margin-top: 0;
}

html[data-md-theme="dark"] .md-page-subsection--band {
	background: var(--md-color-subtle, #3a3938);
}

html[data-md-theme="dark"] .md-page-subsection--soft {
	background: color-mix(in srgb, var(--md-color-subtle, #3a3938) 70%, #1c1b1a);
}

html[data-md-theme="dark"] body.md-region-kenya .md-page-subsection--band,
html[data-md-theme="dark"] body.md-region-uk .md-page-subsection--band {
	background: var(--md-color-subtle, #3a3938);
}

.md-page-section .md-latest__list {
	margin-bottom: 0;
	gap: var(--md-jump-gap, var(--md-gutter, 2rem));
}

/* Project Latest — footer gap matches card grid row spacing (list margin-bottom is 0 above). */
.md-page-section .md-latest--paged .md-latest__footer {
	margin-top: var(--md-jump-gap, var(--md-gutter, 2rem));
}

.md-page-latest .wp-block-post-template {
	display: flex;
	flex-direction: column;
	gap: var(--md-gutter, 2rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.md-page-latest {
	padding: var(--md-space, 1.5rem);
	background: var(--md-color-subtle, #f3f3f3);
	border-radius: var(--md-radius, 0.5rem);
}

.md-page-latest .wp-block-post-template > li {
	box-sizing: border-box;
	padding: var(--md-space, 1.5rem);
	background: #fff;
	border-radius: var(--md-radius, 0.5rem);
}

html[data-md-theme="dark"] .md-page-section--band {
	--md-section-bg: var(--md-color-subtle, #3a3938);
	background: var(--md-section-bg);
}

html[data-md-theme="dark"] .md-page-section--soft {
	--md-section-bg: color-mix(in srgb, var(--md-color-subtle, #3a3938) 70%, #1c1b1a);
	background: var(--md-section-bg);
}

html[data-md-theme="dark"] .md-page-latest {
	background: var(--md-color-subtle, #3a3938);
}

html[data-md-theme="dark"] .md-page-latest .wp-block-post-template > li {
	background: var(--md-color-surface, #2a2928);
}

/* Home Featured block — section title + hero slider */
.md-home-featured {
	margin: 0 0 var(--md-space-section, 6rem);
}

.md-home-featured__title {
	margin: 0 0 var(--md-space-stack, 3rem);
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
}

html[data-md-theme="dark"] .md-home-featured__title {
	color: var(--md-color-contrast, #f5f5f4);
}

/*
 * Home section titles (Featured, Projects, Latest News & Events) — smaller on
 * phones. Page H1s (About, Contact, archives) keep --md-type-display.
 * min() with the desktop token means no jump: this curve meets the existing
 * size at ~676px and desktop (>=900px) is unchanged. rem + vw so browser
 * zoom still scales the text. Phone floor 2rem stays above the project card
 * titles (1.85rem min).
 */
@media (max-width: 899px) {
	.md-home-featured__title,
	.md-home-projects__title,
	.md-home-latest__title,
	.md-home-latest > .wp-block-heading:first-child {
		font-size: min(var(--md-type-home-display, clamp(2.75rem, 5.5vw, 4.25rem)), max(2rem, calc(4.2vw + 0.975rem)));
	}
}

/* Home hero — same content width as vision / projects (not full-bleed) */
.md-main--home .entry-content,
.md-main--home .wp-block-post-content {
	overflow: visible;
}

.md-main--home .entry-content > .md-home-featured,
.md-main--home .wp-block-post-content > .md-home-featured,
.md-main--home .entry-content > .md-hero.alignfull,
.md-main--home .wp-block-post-content > .md-hero.alignfull,
.md-main--home .entry-content > .md-hero,
.md-main--home .wp-block-post-content > .md-hero,
.md-main--home .entry-content > .wp-block-shortcode:has(.md-hero),
.md-main--home .wp-block-post-content > .wp-block-shortcode:has(.md-hero),
.md-main--home .entry-content > .wp-block-shortcode:has(.md-home-featured),
.md-main--home .wp-block-post-content > .wp-block-shortcode:has(.md-home-featured) {
	position: relative !important;
	left: auto !important;
	transform: none !important;
	width: 100% !important;
	max-width: var(--wp--style--global--content-size, 1400px) !important;
	margin-top: 0 !important;
	margin-bottom: var(--md-space-section, 6rem) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.md-main--home .md-home-featured {
	margin-bottom: 0;
}

.md-main--home .md-home-featured .md-hero {
	margin-bottom: 0 !important;
}

/* Single Related — full-bleed grey; content matches header / home Latest */
.md-main--single .md-related-wrap:has(.md-related) {
	position: relative;
	isolation: isolate;
	left: auto;
	transform: none;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 1400px);
	box-sizing: border-box;
	margin: var(--md-space-section, 6rem) auto 0 !important;
	padding: var(--md-space-section, 6rem) 0;
	background: transparent;
}

.md-main--single .md-related-wrap:has(.md-related)::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
	background: var(--md-color-subtle, #f3f3f3);
	z-index: -1;
	pointer-events: none;
}

.md-main--single .md-related-wrap:has(.md-related) > * {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

html[data-md-theme="dark"] .md-main--single .md-related-wrap:has(.md-related),
html[data-md-theme="dark"] .md-main--single .md-related-wrap:has(.md-related)::before {
	background: var(--md-color-subtle, #3a3938);
}

/* Single CPT: hero is full-bleed; main stays overflow-visible for breakout */
.md-main--single {
	/*
	 * 2/3 of the same content band as the simple header (percentage, not a
	 * fixed px/ch). Desktop image at 5/6 then shares the 1/6 left edge.
	 */
	--md-single-measure: 66.666%;
	overflow: visible;
}

.md-main--single > .md-single-hero:first-child {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-top: 0 !important;
	margin-bottom: var(--md-space-stack, 3rem) !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	border-radius: 0;
}

/*
 * Single CPT — body and post terms: full width below 900px; two-thirds measure
 * from tablet landscape / desktop up (layout breakpoint; hamburger is ≤1049).
 */
.md-single__main {
	box-sizing: border-box;
	min-width: 0;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 1400px);
	margin-inline: auto;
	padding: 0;
}

.md-single__main > :is(.entry-content, .wp-block-post-content, .md-single__terms) {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	/* Desktop: 2/3 measure centred (1/6 + 2/3 + 1/6). Was left-aligned. */
	margin-inline: auto;
}

/*
 * Single post body = one column (2/3 on desktop, 66ch on small screens).
 * Font-size on the wrapper for fluid prose. Nested 66ch caps are cleared
 * below so paragraphs, quotes, Event details, hrs, and images all fill this
 * column (no staircase of different widths).
 */
.md-single__main > :is(.entry-content, .wp-block-post-content) {
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
}

/* Space below body / external CTA before Project · Theme · Type · Share. */
.md-single__main > :is(.entry-content, .wp-block-post-content) {
	padding-bottom: var(--md-space, 1.5rem);
}

@media (min-width: 900px) {
	.md-single__main > :is(.entry-content, .wp-block-post-content) {
		max-width: var(--md-single-measure);
	}

	.md-single__main > .md-single__terms {
		max-width: var(--md-single-measure);
	}
}

/*
 * Fill the single column — override soft 66ch / mid-width caps that otherwise
 * leave body copy shorter than headings, pull quotes, and images.
 * border-box + max-width: 100% on descendants only (not the column itself —
 * the column keeps --md-single-measure / 66ch).
 */
.md-main--single :is(.entry-content, .wp-block-post-content) {
	box-sizing: border-box;
}

.md-main--single :is(.entry-content, .wp-block-post-content) :is(
	.wpb-content-wrapper,
	.vc_row,
	.wpb_column,
	.vc_column-inner,
	.wpb_wrapper,
	.wpb_text_column,
	.wpb_single_image,
	.md-vc-text,
	.md-event-details,
	.md-objectives,
	p,
	h1, h2, h3, h4, h5, h6,
	ul, ol, li,
	hr,
	blockquote,
	figure,
	img,
	table,
	.wp-block-paragraph,
	.wp-block-list,
	.wp-block-quote,
	.wp-block-image,
	.wp-block-table
) {
	box-sizing: border-box;
	max-width: 100%;
}

.md-main--single :is(.entry-content, .wp-block-post-content) > :is(
	p:not(.md-page__lede):not(.is-style-lede),
	.wp-block-paragraph:not(.md-page__lede):not(.is-style-lede),
	ul:not(.md-people-list):not(.md-partners__grid),
	ol,
	.wp-block-list
),
.md-main--single .wpb_text_column:not(.md-lede) .wpb_wrapper > :is(
	p:not(.md-page__lede):not(.is-style-lede):not(.md-page__meta-line):not(.is-style-meta-line):not(.md-event-details__title):not(.md-event-details__line),
	ul:not(.md-people-list):not(.md-partners__grid),
	ol,
	.wp-block-paragraph:not(.md-page__lede):not(.is-style-lede),
	.wp-block-list
),
.md-main--single .md-vc-text > :is(
	p:not(.md-home-latest__cta),
	ul:not(.md-people-list):not(.md-partners__grid):not(.md-objectives),
	ol:not(.md-objectives),
	.wp-block-paragraph,
	.wp-block-list:not(.md-objectives)
),
.md-main--single :is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote),
.md-main--single .wpb_text_column .wpb_wrapper > :is(blockquote, .wp-block-quote),
.md-main--single :is(.entry-content, .wp-block-post-content) hr,
.md-main--single .wpb_text_column .wpb_wrapper > hr,
.md-main--single .md-event-details,
.md-main--single .md-objectives {
	width: 100%;
	max-width: 100%;
}

.md-single__terms {
	margin-top: var(--md-space-stack, 3rem);
}

/* Shortcode returns nothing when a post has no terms — drop the empty band. */
.md-single__terms:not(:has(.md-post-terms)) {
	display: none;
}

/*
 * Single CPT — breathing room before the footer when Related is absent
 * (Share / meta rows otherwise sit flush against the footer). Matches
 * Contact / Projects parent (--md-space-section; 4rem on small screens).
 * When Related is present it already carries section padding.
 */
.md-main--single:not(:has(.md-related)) {
	padding-bottom: var(--md-space-section, 6rem);
}

@media (max-width: 899px) {
	.md-main--single:not(:has(.md-related)) {
		padding-bottom: 4rem;
	}
}

/*
 * Default single layout (simple) — half-width title card over a right-aligned
 * 5/6-width 16:9 image (desktop; left edge aligns with the 1/6 body inset).
 * Image sits behind the text card. Mobile: stacked, full width. Hero overlay
 * (.md-single-hero) unchanged.
 */
.md-single-header--simple {
	--md-simple-header-radius: var(--md-radius, 0.5rem);
	--md-simple-header-gap: var(--md-space, 1.5rem);
	--md-simple-header-pad: clamp(1.25rem, 3vw, 2rem);
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 1400px);
	margin: 0 auto 0;
	padding: 1rem var(--md-space, 1.5rem);
}

@media (min-width: 900px) {
	.md-single-header--simple {
		padding-top: var(--md-space-stack, 3rem);
		padding-bottom: var(--md-space-stack, 3rem);
		padding-left: 0;
		padding-right: 0;
	}
}

.md-single-header--simple .md-single-header__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--md-simple-header-gap);
	overflow: visible;
	border-radius: 0;
	background: transparent;
	position: relative;
}

.md-single-header__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--md-space, 1.5rem);
	min-width: 0;
	flex: 0 1 auto;
	box-sizing: border-box;
	padding: var(--md-space-stack, 3rem) var(--md-space, 1.5rem);
	background: transparent;
	height: auto;
}

.md-single-header--simple .md-single-header__text {
	/* Same frost as jump-nav / archive filter panels. */
	background-color: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	background: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	border-radius: var(--md-simple-header-radius);
	/* Equal inset on all sides — height follows title + meta. */
	padding: var(--md-simple-header-pad);
	position: relative;
	z-index: 2;
	height: auto;
	align-self: flex-start;
}

.md-single-header__title {
	margin: 0;
	padding: 0;
	max-width: none;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.15;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-single-header--simple .md-single-header__title {
	font-size: var(--md-text-h2, clamp(2.25rem, calc(1.914rem + 0.597 * var(--md-vw, 1vw)), 2.75rem));
	padding-block: 0;
}

.md-single-header__meta {
	width: 100%;
}

.md-single-header__meta > .wp-block-shortcode {
	display: contents;
}

.md-single-header__date {
	margin: 0;
}

.md-single-header__scroll {
	--md-details-font-size: var(--md-text-details, clamp(1.125rem, 0.35vw + 1.05rem, 1.3125rem));
	--md-details-marker: 1.425em;
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	box-sizing: border-box;
	width: 2rem;
	height: 2rem;
	margin: 0;
	padding: 0;
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: transparent;
	color: var(--md-color-contrast, #1c1b1a);
	font: inherit;
	line-height: 0;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: var(--md-transition-colour), var(--md-transition-fade);
}

.md-single-header__scroll:hover {
	background: transparent;
	opacity: 0.75;
	text-decoration: none;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-single-header__scroll:focus-visible {
	outline: var(--md-focus-outline);
	outline-offset: var(--md-focus-outline-offset, 2px);
}

.md-single-header__scroll-icon {
	display: block;
	flex-shrink: 0;
	width: var(--md-details-marker);
	height: var(--md-details-marker);
	font-size: var(--md-details-font-size);
	overflow: visible;
	pointer-events: none;
	color: inherit;
	animation: md-single-header-scroll-nudge 3.2s ease-in-out infinite;
	will-change: transform;
}

@keyframes md-single-header-scroll-nudge {
	0%,
	36%,
	100% {
		transform: translateY(0);
	}

	10% {
		transform: translateY(0.25rem);
	}

	20% {
		transform: translateY(0);
	}

	28% {
		transform: translateY(0.14rem);
	}
}

@media (prefers-reduced-motion: reduce) {
	.md-single-header__scroll-icon {
		animation: none;
		will-change: auto;
	}
}

.md-single-header__figure {
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 100%;
	border-radius: 0;
	overflow: hidden;
	display: flex;
	align-items: stretch;
	justify-content: stretch;
	background: transparent;
}

.md-single-header--simple .md-single-header__figure {
	aspect-ratio: 16 / 9;
	border-radius: var(--md-simple-header-radius);
	overflow: hidden;
	min-height: 0;
	align-self: stretch;
	position: relative;
	z-index: 0;
	background: var(--md-color-base, #e5e5e5);
}

.md-single-header__figure img,
.md-single-header__img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	object-fit: cover;
	object-position: center center;
	border-radius: 0;
}

.md-single-header--simple .md-single-header__figure img,
.md-single-header--simple .md-single-header__img {
	width: 100%;
	height: 100%;
	min-height: 0;
	max-height: none;
	object-fit: cover;
	object-position: center center;
}

/* Mobile: text above image; match body column width so image left = copy left. */
@media (max-width: 899px) {
	.md-single-header--simple {
		/* Tighter above the title; keep stack space below into the body. */
		padding-top: 1rem;
		padding-bottom: var(--md-space-stack, 3rem);
		padding-left: 0;
		padding-right: 0;
		/* Same measure + font-size as .md-single__main > .entry-content (66ch). */
		max-width: var(--md-prose-measure, 66ch);
		width: 100%;
		margin-inline: auto;
		font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
	}

	.md-single-header--simple .md-single-header__inner:has(.md-single-header__figure) {
		flex-direction: column;
	}

	.md-single-header--simple .md-single-header__text {
		width: 100%;
		position: relative;
		transform: none;
		order: 1;
	}

	.md-single-header--simple .md-single-header__figure {
		width: 100%;
		order: 2;
	}
}

@media (min-width: 900px) {
	/* Image defines the band height; text card overlays and centres on it. */
	.md-single-header--simple .md-single-header__inner:has(.md-single-header__figure) {
		display: block;
		position: relative;
	}

	.md-single-header--simple .md-single-header__inner:has(.md-single-header__figure) .md-single-header__figure {
		/* 5/6 wide, right-aligned → left edge at 1/6 (matches body column). */
		width: 83.333%;
		max-width: 83.333%;
		margin-left: auto;
		margin-right: 0;
		position: relative;
		z-index: 1;
		align-self: auto;
	}

	.md-single-header--simple .md-single-header__inner:has(.md-single-header__figure) .md-single-header__text {
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		width: 50%;
		max-width: 50%;
		margin: 0;
		z-index: 2;
		flex: none;
	}

	.md-single-header--simple .md-single-header__inner:not(:has(.md-single-header__figure)) .md-single-header__text {
		width: 50%;
		max-width: 50%;
	}
}

html[data-md-theme="dark"] .md-single-header__title {
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-single-header--simple .md-single-header__inner {
	background: transparent;
}

html[data-md-theme="dark"] .md-single-header--simple .md-single-header__text {
	background-color: var(--md-frost-nav-shell, rgba(42, 41, 40, 0.8));
	background: var(--md-frost-nav-shell, rgba(42, 41, 40, 0.8));
}

html[data-md-theme="dark"] .md-single-header--simple .md-single-header__figure {
	background: var(--md-color-base, #1c1b1a);
}

html[data-md-theme="dark"] .md-single-header__scroll {
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-single-header__scroll:hover {
	color: var(--md-color-contrast, #f5f5f4);
}

/* Simple layout: header bottom padding is the only gap into body copy. */
.md-main--single-simple .md-single__main {
	margin-top: 0;
}

/*
 * Continue-to-article and hash land: content top under the sticky nav, with the
 * same float gap used between the bar and in-flow page content (site-blocks /
 * simple-header start). Live --md-header-height alone undershot a little once
 * the bar was compact; adding --md-header-float-gap scrolls less so the band
 * sits cleanly under the nav. Prefer this over html scroll-padding on singles.
 */
html:has(#md-single-content) {
	scroll-padding-top: 0;
}

#md-single-content {
	scroll-margin-top: calc(
		var(--md-header-height, 5.5rem) + var(--md-header-float-gap, 1rem)
	);
}

/*
 * #md-single-content is a scroll / screen-reader target (tabindex="-1"), not a
 * control. Hide click and programmatic focus rings on the wrapper; links and
 * buttons inside keep their own :focus-visible styles.
 */
#md-single-content:focus,
#md-single-content:focus-visible {
	outline: none;
}

/* Simple single header: keep the rise reveal; no scroll fade. */
.md-single-header.md-reveal.md-reveal--in {
	transition: transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
	.md-single-header.md-reveal.md-reveal--in {
		transition: none;
	}
}

/* On grey singles the related band matches the page shell; drop the duplicate wash. */
body.md-page--grey .md-main--single .md-related-wrap:has(.md-related)::before {
	background: transparent;
}

html[data-md-theme="dark"] body.md-page--grey .md-main--single .md-related-wrap:has(.md-related),
html[data-md-theme="dark"] body.md-page--grey .md-main--single .md-related-wrap:has(.md-related)::before {
	background: transparent;
}

/*
 * Single CPT posts (Impact, Output, Resource) — h2 subsection dividers in flat
 * post body. Matches .md-page-section h3 divider tokens; scoped to md-main--single
 * so static pages keep h2[id] dividers only. h3 dividers remain on .md-page-section.
 * Weight 600 matches Home latest card titles; theme.json h2 stays 700 globally.
 * Line width follows the entry-content prose column (see .md-single__main rules).
 */
.md-main--single :is(.entry-content, .wp-block-post-content) > :is(h2, h2.wp-block-heading),
.md-main--single .wpb_text_column .wpb_wrapper > :is(h2, h2.wp-block-heading) {
	margin-top: var(--md-space-stack, 3rem);
	margin-bottom: var(--md-space, 1.5rem);
	padding-top: 1.5rem;
	border-top: 1px solid var(--md-color-contrast, #1c1b1a);
	font-weight: 600;
}

.md-main--single :is(.entry-content, .wp-block-post-content) > :is(h2, h2.wp-block-heading) + *,
.md-main--single .wpb_text_column .wpb_wrapper > :is(h2, h2.wp-block-heading) + * {
	margin-block-start: 0;
	margin-top: 0;
}

/*
 * Single CPT body h2s — smaller on phones so long titles do not dominate.
 * Desktop (≥900px) keeps --md-text-h2 (36px+). Weight stays 600; colour and
 * border-top divider are unchanged. Size sits just above --md-text-h3 (~21–28px).
 */
@media (max-width: 899px) {
	.md-main--single :is(.entry-content, .wp-block-post-content) > :is(h2, h2.wp-block-heading),
	.md-main--single .wpb_text_column .wpb_wrapper > :is(h2, h2.wp-block-heading) {
		font-size: clamp(1.5rem, calc(1.2rem + 1.5 * var(--md-vw, 1vw)), 1.75rem);
	}
}

/*
 * Pull quotes — white surface panel with sharper corners (matches post image radius).
 * Scoped to post and page body content, not team modals or archive cards.
 * On single CPT posts, match the soft prose measure (same as Event details /
 * .md-objectives) so mid-widths stay aligned with body paragraphs. Other pages
 * keep full column width. Inner p/cite set their own font sizes.
 */
:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) {
	box-sizing: border-box;
	margin: var(--md-space-stack, 3rem) 0;
	padding: var(--md-space, 1.5rem);
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-surface, #ffffff);
	color: var(--md-color-contrast, #1c1b1a);
	box-shadow: none;
}

.md-main--single :is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote),
.md-main--single .wpb_text_column .wpb_wrapper > :is(blockquote, .wp-block-quote) {
	width: 100%;
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
}

.md-main--single :is(.entry-content, .wp-block-post-content) hr,
.md-main--single .wpb_text_column .wpb_wrapper > hr {
	box-sizing: border-box;
	width: 100%;
	font-size: var(--md-prose-size, clamp(1.125rem, 0.65vw + 1.05rem, 1.375rem));
	margin-inline: 0;
}

:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) > :is(p, .wp-block-paragraph),
:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) :is(p, .wp-block-paragraph) {
	margin: 0;
	padding: 0;
	/* Lede size; weight 300. Leading matches .md-home__vision (1.35 / 1.4). Cite stays meta/mono. */
	font-size: var(--md-type-lede, clamp(1.625rem, 2.25vw, 2.125rem));
	font-weight: 300;
	line-height: 1.35;
}

@media (max-width: 899px) {
	:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) > :is(p, .wp-block-paragraph),
	:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) :is(p, .wp-block-paragraph) {
		font-size: clamp(1.125rem, 3.5vw, 1.375rem);
		line-height: 1.4;
	}
}

:is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) cite {
	display: block;
	margin-top: var(--md-space-subheading, 0.75rem);
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-meta, 0.9375rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: 0.02em;
	color: var(--md-color-muted, #5c5c5c);
}

html[data-md-theme="dark"] :is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) {
	background: var(--md-color-surface, #2a2928);
	box-shadow: none;
}

html[data-md-theme="dark"] :is(.entry-content, .wp-block-post-content) :is(blockquote, .wp-block-quote) cite {
	color: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 72%, transparent);
}

/*
 * Single CPT — post body images fill the text column; rounded corners on all
 * Image and Gallery block photos (hero featured image is separate).
 * Margin-bottom: core figcaption clearance (~1em) plus one body baseline
 * (--md-space / 1.5rem) so copy sits a clear line below the caption.
 *
 * WPBakery default: .vc_figure and .vc_single_image-wrapper are inline-block
 * and shrink-wrap the intrinsic image width (plus vc_align_left). Force the
 * whole chain to block + 100% of the prose column; keep aspect ratio (no
 * object-fit: cover). Inline width attrs lose to width: 100% on the img.
 */
.md-main--single :is(.entry-content, .wp-block-post-content) :is(.wp-block-image, .wp-block-gallery, .wpb_single_image) {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: 100%;
	margin-inline: 0;
	margin-bottom: calc(1em + var(--md-space, 1.5rem));
	text-align: left;
}

.md-main--single :is(.entry-content, .wp-block-post-content) .wpb_single_image :is(figure.vc_figure, .wpb_wrapper.vc_figure, .vc_single_image-wrapper) {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0;
}

.md-main--single :is(.entry-content, .wp-block-post-content) :is(.wp-block-image, .wp-block-gallery, .wpb_single_image) :is(a, img) {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	height: auto;
}

.md-main--single :is(.entry-content, .wp-block-post-content) :is(.wp-block-image, .wp-block-gallery, .wpb_single_image) img {
	height: auto;
	object-fit: contain;
	border-radius: var(--md-radius-pill, 0.25rem);
}

:is(.entry-content, .wp-block-post-content) :is(.wp-block-image, .wp-block-gallery, .wp-block-audio, .wp-block-embed, .wp-block-video) figcaption,
:is(.entry-content, .wp-block-post-content) .wp-element-caption,
:is(.entry-content, .wp-block-post-content) .vc_figure-caption {
	margin-top: 0.5rem;
	/* Bottom clearance owned by the figure's margin-bottom (see above). */
	margin-bottom: 0;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-meta, 0.9375rem);
	line-height: 1.45;
	letter-spacing: 0.02em;
	color: var(--md-color-muted, #5c5c5c);
}

html[data-md-theme="dark"] :is(.entry-content, .wp-block-post-content) :is(.wp-block-image, .wp-block-gallery, .wp-block-audio, .wp-block-embed, .wp-block-video) figcaption,
html[data-md-theme="dark"] :is(.entry-content, .wp-block-post-content) .wp-element-caption,
html[data-md-theme="dark"] :is(.entry-content, .wp-block-post-content) .vc_figure-caption {
	color: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 72%, transparent);
}

html[data-md-theme="dark"] .md-header-shell,
html[data-md-theme="dark"] .wp-block-template-part:has(.md-header) {
	background: transparent !important;
}

html[data-md-theme="dark"] .md-sidebar-panel__title,
html[data-md-theme="dark"] .md-archive__filters-title {
	color: var(--md-color-contrast);
}

html[data-md-theme="dark"] .md-sidebar-panel,
html[data-md-theme="dark"] .md-jump-nav,
html[data-md-theme="dark"] .md-archive__filters {
	background-color: var(--md-frost-nav-shell);
	background: var(--md-frost-nav-shell);
	--md-sidebar-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
}

html[data-md-theme="dark"] .md-jump-nav__link:hover,
html[data-md-theme="dark"] .md-jump-nav__link:focus-visible:not(.is-active) {
	background: var(--md-color-subtle, #3a3938);
}

/* Active pill fill is the light contrast token in dark mode — text must
 * flip to dark, otherwise the base rule's white text is illegible on it.
 * This is the default (non-regional) treatment — e.g. About page jump-nav. */
html[data-md-theme="dark"] .md-jump-nav__indicator {
	background: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-jump-nav__link.is-active,
html[data-md-theme="dark"] .md-jump-nav__link.is-active:hover,
html[data-md-theme="dark"] .md-jump-nav__link.is-active:focus,
html[data-md-theme="dark"] .md-jump-nav__link.is-active:focus-visible {
	background: transparent !important;
	color: #1c1b1a !important;
}

/* Project pages (Kenya/UK) — keep the regional brand accent in dark mode
 * instead of the neutral contrast fill above; --md-region-accent is the
 * same green/magenta in both themes, black text keeps AA contrast. */
html[data-md-theme="dark"] body.md-region-kenya .md-jump-nav__indicator,
html[data-md-theme="dark"] body.md-region-uk .md-jump-nav__indicator {
	background: var(--md-region-accent);
}

html[data-md-theme="dark"] body.md-region-kenya .md-jump-nav__link.is-active,
html[data-md-theme="dark"] body.md-region-uk .md-jump-nav__link.is-active,
html[data-md-theme="dark"] body.md-region-kenya .md-jump-nav__link.is-active:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-jump-nav__link.is-active:focus,
html[data-md-theme="dark"] body.md-region-kenya .md-jump-nav__link.is-active:focus-visible,
html[data-md-theme="dark"] body.md-region-uk .md-jump-nav__link.is-active:hover,
html[data-md-theme="dark"] body.md-region-uk .md-jump-nav__link.is-active:focus,
html[data-md-theme="dark"] body.md-region-uk .md-jump-nav__link.is-active:focus-visible {
	background: transparent !important;
	color: #1c1b1a !important;
	filter: none;
}

/* —— Display preferences (collapsible; not a third-party a11y overlay) —— */

/*
 * Hamburger / always-compact widths (≤1049): wordmark-only at scrolled size
 * (matches md-sticky-nav.js COMPACT_MQ). Tall lockup from ≥1050 when not
 * scrolled. Nested hamburger rules below restore a scaled symbol+word lockup.
 */
@media (max-width: 1049px) {
	/* Pre-JS / always-compact widths: logotype only at scrolled size. */
	.md-brand-logo {
		--md-brand-h: clamp(1.55rem, 3vw, 1.85rem);
		--md-brand-word-h: var(--md-brand-h);
		--md-brand-gap: 0;
		gap: 0;
	}

	.md-brand-logo__symbol {
		opacity: 0;
		width: 0;
		margin: 0;
		pointer-events: none;
	}

	.md-brand-logo__word {
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}

	.md-brand-logo__word .md-brand-logo__img {
		width: 80%;
		height: 80%;
		object-fit: contain;
		object-position: left center;
	}
}

/*
 * WP Navigation "mobile" overlay defaults to 600px — too late once Toolkit
 * joins the bar. Force the hamburger by ≤1049px so items never crowd the logo
 * (matches md-sticky-nav.js MOBILE_NAV_MQ). Open menu: frosted dropdown under
 * the header bar (seed.com-style), not a full-page overlay.
 */
@media (max-width: 1049px) {
	/*
	 * Hamburger widths always show symbol + logotype, scaled to fit the frosted pill.
	 * Overrides mid-width wordmark-only and .is-compact symbol-hide rules.
	 * Keep height modest so the lockup cannot overlap band titles.
	 */
	.md-brand-logo,
	.md-header.is-compact .md-brand-logo {
		--md-brand-h: clamp(1.25rem, 5.5vw, 1.55rem);
		--md-brand-word-h: calc(var(--md-brand-h) * 0.691);
		--md-brand-gap: calc(var(--md-brand-h) * 0.3383);
		--md-brand-symbol-w: calc(var(--md-brand-h) * 1.778);
		gap: var(--md-brand-gap);
		height: var(--md-brand-h);
		align-self: center;
	}

	.md-brand-logo__symbol,
	.md-header.is-compact .md-brand-logo__symbol {
		opacity: 1;
		width: var(--md-brand-symbol-w);
		margin: 0;
		pointer-events: auto;
	}

	.md-brand-logo__word,
	.md-header.is-compact .md-brand-logo__word {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: var(--md-brand-word-h);
		width: calc(var(--md-brand-word-h) * 5.37);
		max-width: min(100%, 12rem);
	}

	.md-brand-logo__word .md-brand-logo__img,
	.md-header.is-compact .md-brand-logo__word .md-brand-logo__img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		object-position: left center;
	}

	/* Always compact bar on hamburger widths (JS also forces .is-compact). */
	.md-header:not(.is-compact) {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	/* Pre-JS fallback bar — frost on ::before, same backdrop-root rule as above. */
	.md-header:not(.is-compact) .md-header__inner {
		position: relative;
		align-items: center !important;
		gap: 0.5rem 0.85rem;
		--md-header-pad-x-start: var(--wp--style--root--padding-left, 1.5rem);
		--md-header-pad-x-end: var(--wp--style--root--padding-right, 1.5rem);
		padding: var(--md-header-pad-y, 0.25rem) var(--md-header-pad-x-end) var(--md-header-pad-y, 0.25rem) var(--md-header-pad-x-start);
		background-color: transparent;
		background: transparent;
		border-radius: var(--md-radius, 0.5rem);
		overflow: visible;
		box-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
	}

	.md-header:not(.is-compact) .md-header__inner::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		border-radius: inherit;
		background: var(--md-frost-nav-shell);
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
		pointer-events: none;
	}

	.md-header:not(.is-compact) .md-header__inner > * {
		position: relative;
		z-index: 1;
	}

	.md-header:not(.is-compact) .md-prefs__panel {
		right: calc(-1 * var(--md-header-pad-x-end, 1rem));
	}

	.md-header:not(.is-compact) .md-header__tools {
		margin-top: 0 !important;
		align-self: center !important;
		transform: none;
	}

	.md-header:not(.is-compact) .md-header__brand .wp-block-site-title:not(.md-header__title--logo),
	.md-header:not(.is-compact) .md-header__title:not(.md-header__title--logo),
	.md-header:not(.is-compact) .md-header__brand .wp-block-site-title:not(.md-header__title--logo) a {
		font-size: clamp(1.55rem, 3vw, 1.85rem);
		line-height: 1;
	}

	.md-header:not(.is-compact) .md-header__title--logo {
		display: flex;
		align-items: center;
		line-height: 0;
		font-size: 0;
	}

	html[data-md-theme="dark"] .md-header:not(.is-compact) .md-header__inner {
		box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
	}

	.md-header__inner {
		align-items: center;
	}

	.md-header__tools {
		align-items: center;
		flex: 0 0 auto;
		width: auto;
		max-width: none;
		margin-left: auto;
	}

	/*
	 * Hamburger bar: Search, Prefs, then menu open/close on the far right.
	 * Markup stays nav → search → prefs so desktop Contact→search gap is unchanged.
	 */
	.md-header__tools > .md-search-toggle {
		order: 1;
	}

	.md-header__tools > .md-prefs {
		order: 2;
	}

	.md-header__tools > .md-header__nav {
		order: 3;
	}

	.md-header__nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 2.75rem;
		height: 2.75rem;
		flex-shrink: 0;
		padding: 0;
		cursor: pointer;
		border-radius: var(--md-radius-pill, 0.25rem);
		/* .md-header__nav sets colour to white for the desktop bar; the icon must follow the pill text colour. */
		color: var(--md-color-contrast, #1c1b1a) !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container-open .md-nav-toggle__icon {
		display: block;
		overflow: visible;
		pointer-events: none;
	}

	.md-header__nav .wp-block-navigation__responsive-container-open:hover {
		opacity: 0.75;
	}

	.md-header__nav .wp-block-navigation__responsive-container-open:focus-visible {
		outline: 2px solid var(--md-color-contrast, #1c1b1a);
		outline-offset: 2px;
	}

	/*
	 * Mobile menu — frosted dropdown panel aligned to .md-header__inner (not a
	 * full-page overlay). Position vars are set in md-sticky-nav.js.
	 */
	html.has-modal-open,
	html.has-modal-open body {
		overflow: auto !important;
	}

	.md-header__nav .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
		position: fixed !important;
		top: var(--md-mobile-nav-top, var(--md-header-height, 5.5rem)) !important;
		left: var(--md-mobile-nav-left, var(--md-gutter, 1.5rem)) !important;
		right: auto !important;
		bottom: auto !important;
		width: var(--md-mobile-nav-width, calc(100% - 2 * var(--md-gutter, 1.5rem))) !important;
		max-width: none !important;
		height: auto !important;
		max-height: calc(100dvh - var(--md-mobile-nav-top, var(--md-header-height, 5.5rem)) - var(--md-space, 1rem));
		margin: 0 !important;
		padding: 0 !important;
		box-sizing: border-box;
		z-index: 199 !important;
		background: transparent !important;
		background-color: transparent !important;
		color: var(--md-color-contrast, #1c1b1a) !important;
		overflow: visible !important;
		animation: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
		width: 100%;
		max-width: none;
		padding: 0;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
		position: relative;
		width: 100%;
		max-width: none;
		margin: 0;
		background: var(--md-frost-nav-shell);
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
		border-radius: var(--md-radius, 0.5rem);
		box-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
		overflow: hidden;
	}

	html[data-md-theme="dark"] .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
		box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
	}

	/* Hamburger in the header bar closes the menu — hide duplicate core close button */
	.md-header__nav .wp-block-navigation__responsive-container-close {
		display: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-container-content {
		padding: var(--md-header-pad-x-start, 1.35rem) !important;
		width: 100%;
		max-width: none;
		overflow: visible;
		display: flex !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: flex-start !important;
		justify-content: flex-start !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation__container,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-navigation-item,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .wp-block-page-list {
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		justify-content: flex-start !important;
		width: 100%;
		gap: 0.15rem !important;
	}

	/*
	 * Reset desktop submenu-parent pill row — stack label + nested links.
	 * Never paint the <li> (hover/current would flood the whole nested submenu).
	 * Fills belong only on the link pills below.
	 */
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:hover,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:focus-within,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:hover,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:focus-within,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:focus-within,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
		position: static !important;
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		align-self: stretch !important;
		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		padding: 0 !important;
		gap: 0.15rem !important;
		background: transparent !important;
		background-color: transparent !important;
		color: var(--md-color-contrast, #1c1b1a) !important;
		filter: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child::after {
		display: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
		display: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .has-child > .wp-block-navigation__submenu-container,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open:where(:not(.disable-default-overlay)) .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
		display: flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		position: static !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 0 0 0.75rem !important;
		/* Hamburger panel: keep the 0.75rem indent inside the 100% width so child pills stop at the same right edge as the parent pill (was content-box, so they overflowed by the indent). */
		box-sizing: border-box !important;
		height: auto !important;
		overflow: visible !important;
		background: transparent !important;
		background-color: transparent !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
		box-shadow: none !important;
		border: none !important;
		gap: 0.15rem !important;
	}

	/* Mobile dropdown — left-aligned pill links (top-level + nested submenu) */
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > .wp-block-navigation-item__content:not(.wp-block-navigation-submenu__toggle),
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .current-menu-item > a,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container [aria-current="page"] {
		box-sizing: border-box;
		display: inline-flex !important;
		justify-content: flex-start !important;
		align-items: center !important;
		width: 100%;
		max-width: none;
		height: auto !important;
		/* 1.0.85: same height for every hamburger pill (parent and children). Child links carry the 0.85rem block padding; the parent had none, so it sat at 2.25rem and looked shorter. Both now use one tap height (2 x block pad + one line, about 45px, above the 44px target). */
		--md-nav-tap-height: calc(2 * var(--md-nav-pill-pad-y, 0.85rem) + var(--md-text-body, 1.125rem));
		min-height: var(--md-nav-tap-height) !important;
		text-align: left;
		white-space: normal;
		border-radius: var(--md-radius-pill, 0.25rem);
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content {
		padding: 0 var(--md-nav-pill-pad-x, 0.6rem) !important;
		/* 1.0.85: match the child pills (see --md-nav-tap-height above) */
		min-height: var(--md-nav-tap-height) !important;
		height: auto !important;
		background: transparent !important;
		color: var(--md-color-contrast, #1c1b1a) !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content:hover,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content:focus-visible {
		background: var(--md-color-subtle, #f3f3f3) !important;
		color: var(--md-color-contrast, #1c1b1a) !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover {
		background: var(--md-color-contrast, #1c1b1a) !important;
		color: #fff !important;
		filter: none !important;
	}

	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor) > a.wp-block-navigation-item__content:hover,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor) > a.wp-block-navigation-item__content:focus-visible,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor) > a.wp-block-navigation-item__content:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:not(.current-menu-item):not(.current-menu-ancestor) > a.wp-block-navigation-item__content:focus-visible {
		background: var(--md-region-nav-hover) !important;
		color: var(--md-color-contrast, #1c1b1a) !important;
	}

	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
	body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a:hover,
	body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a:hover,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item > a,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor > a {
		background: var(--md-region-accent) !important;
		color: #1c1b1a !important;
		filter: none !important;
	}

	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:hover,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:focus-within,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
	html[data-md-theme="dark"] body.md-region-kenya .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:hover,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child:focus-within,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-item:hover,
	html[data-md-theme="dark"] body.md-region-uk .md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item.has-child.current-menu-ancestor:hover {
		background: transparent !important;
		background-color: transparent !important;
		color: var(--md-color-contrast, #f5f5f4) !important;
		filter: none !important;
	}
}

@media (min-width: 1050px) {
	/*
	 * Classic theme: block-navigation overlay chrome is not loaded. Force the
	 * panel into an inline horizontal bar and hide open/close controls.
	 */
	.md-header__nav .wp-block-navigation__responsive-container,
	.md-header__nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open),
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open {
		display: block !important;
		position: static !important;
		inset: auto !important;
		width: auto !important;
		height: auto !important;
		max-width: none !important;
		max-height: none !important;
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		overflow: visible !important;
		pointer-events: auto !important;
	}

	.md-header__nav .wp-block-navigation__responsive-container-open,
	.md-header__nav .wp-block-navigation__responsive-container-open:not(.always-shown),
	.md-header__nav .wp-block-navigation__responsive-close,
	.md-header__nav .wp-block-navigation__responsive-container-close {
		display: none !important;
	}

	.md-header__nav .wp-block-navigation__responsive-dialog,
	.md-header__nav .wp-block-navigation__responsive-container-content {
		display: contents;
	}

	.md-header__nav .wp-block-navigation__container {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-end;
		gap: var(--md-nav-item-gap, 0.35rem);
		list-style: none;
		margin: 0;
		padding: 0;
	}
}

.md-prefs {
	--md-nav-pill-height: 2.25rem;
	--md-nav-pill-pad-x: 0.85rem;
	--md-nav-item-gap: 0.15rem;
	position: relative;
	flex-shrink: 0;
}

/*
 * Hover bridge across the gap into the panel.
 * Width stays with the button. A panel-width bridge sat over Resources and Contact
 * and opened the panel while the pointer was still on those menu items.
 */
.md-prefs::after {
	content: "";
	position: absolute;
	top: 100%;
	right: 0;
	width: 100%;
	height: calc(var(--md-submenu-gap, 1.5rem) + var(--md-submenu-pad-offset, 0px) + 0.2rem);
	z-index: 99;
}

.md-header.is-compact .md-prefs::after {
	right: calc(-1 * var(--md-header-pad-x-end, 1rem));
	width: calc(100% + var(--md-header-pad-x-end, 1rem));
}

.md-prefs__toggle {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--md-color-contrast, #1c1b1a);
	border-radius: var(--md-radius-pill, 0.25rem);
	font: inherit;
	line-height: 0;
	cursor: pointer;
}

.md-prefs__icon {
	display: block;
	flex-shrink: 0;
}

.md-prefs__toggle:hover {
	background: transparent;
	opacity: 0.75;
}

.md-prefs__toggle[aria-expanded="true"] {
	background: transparent;
	color: var(--md-color-contrast, #1c1b1a);
	opacity: 1;
}

.md-prefs__toggle[aria-expanded="true"]:hover {
	background: transparent;
	opacity: 0.75;
}

.md-prefs__panel {
	position: absolute;
	top: calc(100% + var(--md-submenu-gap, 1.5rem) + var(--md-submenu-pad-offset, 0px));
	right: 0;
	left: auto;
	z-index: 100;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	min-width: 12.5rem;
	padding: var(--md-space, 1.5rem);
	background-color: var(--md-frost-nav-shell);
	background: var(--md-frost-nav-shell);
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	backdrop-filter: var(--md-frost-blur);
	-webkit-backdrop-filter: var(--md-frost-blur);
	box-shadow: 0 4px 18px rgba(28, 27, 26, 0.12);
}

/* Compact frosted bar: sit flush with the bar’s right edge (same as site content). */
.md-header.is-compact .md-prefs__panel {
	right: calc(-1 * var(--md-header-pad-x-end, 1rem));
}

.md-prefs__panel[hidden] {
	display: none;
}

.md-prefs__cluster {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem;
}

/* Text-size row — label full width, three equal pills on the row below */
.md-prefs__cluster:has([data-md-font]) {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	row-gap: 0.35rem;
	column-gap: var(--md-nav-item-gap, 0.15rem);
	align-items: center;
}

.md-prefs__cluster:has([data-md-font]) .md-prefs__label {
	grid-column: 1 / -1;
	flex: none;
}

.md-prefs__cluster:has([data-md-font]) .md-prefs__btn {
	flex: none;
	min-width: 0;
	width: 100%;
}

.md-prefs__label {
	flex: 1 0 100%;
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 700;
	margin: 0 0 0.1rem;
}

.md-prefs__btn {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: var(--md-nav-pill-height, 2.25rem);
	height: var(--md-nav-pill-height, 2.25rem);
	padding: 0 var(--md-nav-pill-pad-x, 0.85rem);
	border: none;
	background: var(--md-color-subtle, #f3f3f3);
	color: var(--md-color-contrast, #1c1b1a);
	border-radius: var(--md-radius-pill, 0.25rem);
	font: inherit;
	font-size: var(--md-text-body, 1.125rem);
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	transition: var(--md-transition-colour);
}

.md-prefs__btn:hover {
	background: #e8e8e8;
}

.md-prefs__btn[data-md-theme-cycle][aria-pressed="true"] {
	background: #fff;
	color: #1c1b1a;
}

.md-prefs__btn[data-md-theme-cycle][aria-pressed="true"]:hover,
.md-prefs__btn[data-md-theme-cycle][aria-pressed="true"]:focus-visible {
	background: color-mix(in srgb, #fff 94%, #000);
	color: #1c1b1a;
}

.md-prefs__btn[data-md-font][aria-pressed="true"] {
	background: var(--md-color-contrast, #1c1b1a);
	color: #fff;
}

.md-prefs__btn[data-md-font][aria-pressed="true"]:hover,
.md-prefs__btn[data-md-font][aria-pressed="true"]:focus-visible {
	background: #2e2d2c;
	color: #fff;
}

/* —— Components —— */

.wp-block-details {
	box-sizing: border-box;
	margin: 0 0 var(--md-space, 1.5rem);
	padding: 0;
	background: var(--md-color-surface, #fff);
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	overflow: hidden;
	box-shadow: none;
	transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
}

.wp-block-details:last-child {
	margin-bottom: 0;
}

/* Extra gap before the first accordion after prose; stacked accordions unchanged. */
:is(p, ul, ol, h2, h3, h4, h5, h6, .wp-block-paragraph, .wp-block-list, .wp-block-heading) + .wp-block-details {
	margin-top: var(--md-space, 1.5rem);
}

.wp-block-details:hover,
.wp-block-details[open]:not(.md-details--animated),
.wp-block-details[open].md-details--revealed {
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

body.md-region-kenya .wp-block-details:hover,
body.md-region-kenya .wp-block-details[open]:not(.md-details--animated),
body.md-region-kenya .wp-block-details[open].md-details--revealed {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 45%, transparent);
}

body.md-region-uk .wp-block-details:hover,
body.md-region-uk .wp-block-details[open]:not(.md-details--animated),
body.md-region-uk .wp-block-details[open].md-details--revealed {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 45%, transparent);
}

.wp-block-details summary {
	display: flex;
	align-items: center;
	/* Match left padding so space either side of the +/- is equal. */
	gap: var(--md-space, 1.5rem);
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: var(--md-space, 1.5rem);
	list-style: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-details-font-size);
	font-weight: 400;
	line-height: 1.25;
	color: var(--md-color-contrast, #1c1b1a);
}

.wp-block-details[open] > summary {
	padding-bottom: 0.65rem;
}

.wp-block-details > :not(summary):not(.md-details__panel) {
	margin: 0;
	padding: 0 var(--md-space, 1.5rem) calc(var(--md-space, 1.5rem) * 1.5);
}

.wp-block-details > :not(summary):not(.md-details__panel):first-of-type {
	padding-top: 0;
}

.wp-block-details .md-details__panel {
	display: block;
}

.wp-block-details .md-details__inner {
	min-height: 0;
	padding: 0 var(--md-space, 1.5rem) calc(var(--md-space, 1.5rem) * 1.5);
}

.wp-block-details .md-details__inner > :first-child {
	margin-top: 0;
}

.wp-block-details .md-details__inner > :last-child {
	margin-bottom: 0;
}

.wp-block-details.md-details--animated .md-details__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--md-transition-duration-panel) var(--md-transition-ease);
}

.wp-block-details.md-details--animated.md-details--revealed .md-details__panel {
	grid-template-rows: 1fr;
}

.wp-block-details.md-details--animated .md-details__inner {
	overflow: hidden;
	opacity: 0;
	transition: opacity var(--md-transition-duration-panel) var(--md-transition-ease);
}

.wp-block-details.md-details--animated.md-details--revealed .md-details__inner {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-details,
	.wp-block-details .md-details__panel,
	.wp-block-details .md-details__inner {
		transition: none;
	}
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::marker {
	content: "";
}

/* Drawn +/- so the vertical stem can morph away (text content swap cannot animate). */
.wp-block-details,
.md-jump-nav__toggle,
.md-header__nav .wp-block-navigation__responsive-container-open,
.md-prefs__toggle {
	--md-details-font-size: var(--md-text-details, clamp(1.125rem, 0.35vw + 1.05rem, 1.3125rem));
	--md-details-marker: 1.425em;
	--md-details-marker-stroke: 1px;
}

/* Mobile jump-nav toggle icon shares the accordion marker (same drawn +/-). */
.wp-block-details summary::before,
.md-jump-nav__toggle-icon {
	content: "";
	flex: 0 0 auto;
	box-sizing: border-box;
	width: var(--md-details-marker);
	height: var(--md-details-marker);
	margin: 0;
	background:
		linear-gradient(currentColor, currentColor) center / 100% var(--md-details-marker-stroke) no-repeat,
		linear-gradient(currentColor, currentColor) center / var(--md-details-marker-stroke) 100% no-repeat;
	transform: rotate(0deg);
	transition:
		background-size var(--md-transition-duration-move) var(--md-transition-ease),
		transform var(--md-transition-duration-move) var(--md-transition-ease);
}

/* The toggle label is a fixed size; size the icon from the accordion's font size so the em-based marker matches. */
.md-jump-nav__toggle-icon {
	font-size: var(--md-details-font-size);
}

.wp-block-details[open] > summary::before,
.md-jump-nav__toggle[aria-expanded="true"] .md-jump-nav__toggle-icon {
	background-size:
		100% var(--md-details-marker-stroke),
		var(--md-details-marker-stroke) 0%;
	transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-details summary::before,
	.md-jump-nav__toggle-icon {
		transition: none;
	}
}

/* Keyboard only — no ring after mouse click */
.wp-block-details summary:focus:not(:focus-visible) {
	outline: none;
}

.wp-block-details summary:focus-visible {
	outline: 2px solid var(--md-color-contrast, #1c1b1a);
	outline-offset: 2px;
}

html[data-md-theme="dark"] .wp-block-details:hover,
html[data-md-theme="dark"] .wp-block-details[open]:not(.md-details--animated),
html[data-md-theme="dark"] .wp-block-details[open].md-details--revealed {
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}

html[data-md-theme="dark"] body.md-region-kenya .wp-block-details:hover,
html[data-md-theme="dark"] body.md-region-kenya .wp-block-details[open]:not(.md-details--animated),
html[data-md-theme="dark"] body.md-region-kenya .wp-block-details[open].md-details--revealed {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 50%, transparent);
}

html[data-md-theme="dark"] body.md-region-uk .wp-block-details:hover,
html[data-md-theme="dark"] body.md-region-uk .wp-block-details[open]:not(.md-details--animated),
html[data-md-theme="dark"] body.md-region-uk .wp-block-details[open].md-details--revealed {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 50%, transparent);
}

html[data-md-theme="dark"] .wp-block-details summary {
	color: var(--md-color-contrast);
}

@media (max-width: 899px) {
	.wp-block-details {
		margin-bottom: var(--md-space-subheading, 0.75rem);
		border-radius: var(--md-radius, 0.5rem);
	}

	:is(p, ul, ol, h2, h3, h4, h5, h6, .wp-block-paragraph, .wp-block-list, .wp-block-heading) + .wp-block-details {
		margin-top: var(--md-space-subheading, 0.75rem);
	}

	.wp-block-details summary {
		padding: 0.875rem 1rem;
		font-size: 0.9375rem;
		line-height: 1.3;
	}

	.wp-block-details[open] > summary {
		padding-bottom: 0.45rem;
	}

	.wp-block-details > :not(summary):not(.md-details__panel) {
		padding: 0 1rem 1.25rem;
	}

	.wp-block-details .md-details__inner {
		padding: 0 1rem 1.25rem;
	}
}

.wp-block-query .wp-block-post-title {
	margin-bottom: 0.25rem;
}

.wp-block-query .wp-block-post-excerpt {
	color: var(--md-color-contrast, #1c1b1a);
}

.md-meta {
	margin: 0 0 var(--md-space, 1.5rem);
}

/* External CTA sits after entry content on Resource singles. */
.md-meta--external {
	margin-top: var(--md-space, 1.5rem);
	margin-bottom: 0;
}

.md-meta__button,
.md-toolkit-download__button,
.wp-block-button__link {
	display: inline-block;
	padding: 0.55rem 1.15rem;
	background: #fff !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
	text-decoration: none;
	border: none !important;
	border-radius: var(--md-radius, 0.5rem) !important;
	/* Match cookie Accept / Contact submit: real Inclusive Sans 700, crisp on dark fills. */
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-weight: 700;
	letter-spacing: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	box-shadow: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-meta__button:hover,
.md-meta__button:focus-visible,
.md-toolkit-download__button:hover,
.md-toolkit-download__button:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
	background: #fff !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
	text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

/*
 * Single CPT post body — one extra baseline (--md-space / 1.5rem) above Button
 * groups so CTAs sit further from the paragraph above.
 * Use padding-top, not margin-top: adjacent paragraph margin-bottom (~1em) and
 * margin-top collapse, so a 1.5rem margin added no visible gap (Resource #715).
 */
.md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-buttons {
	padding-top: var(--md-space, 1.5rem);
}

/*
 * Single CPT post body — Button block matches contact form submit (solid contrast
 * fill on the light page background). Patterns and static-page CTAs stay white.
 */
.md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link {
	background: var(--md-color-contrast, #1c1b1a) !important;
	color: var(--md-color-surface, #fff) !important;
}

.md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link:hover,
.md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link:focus-visible {
	background: #2e2d2c !important;
	color: var(--md-color-surface, #fff) !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

html[data-md-theme="dark"] .md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
}

html[data-md-theme="dark"] .md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link:hover,
html[data-md-theme="dark"] .md-main--single :is(.entry-content, .wp-block-post-content) .wp-block-button__link:focus-visible {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

/* Project pages — keep white/black buttons; accent only via region context elsewhere */
body.md-region-kenya .md-home-latest__cta-link,
body.md-region-kenya .md-home-latest > .wp-block-paragraph:last-child a,
body.md-region-kenya .md-meta__button,
body.md-region-kenya .md-toolkit-download__button,
body.md-region-kenya .wp-block-button__link,
body.md-region-uk .md-home-latest__cta-link,
body.md-region-uk .md-home-latest > .wp-block-paragraph:last-child a,
body.md-region-uk .md-meta__button,
body.md-region-uk .md-toolkit-download__button,
body.md-region-uk .wp-block-button__link {
	background: #fff !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
	border: none !important;
}

body.md-region-kenya .md-home-latest__cta-link:hover,
body.md-region-kenya .md-home-latest__cta-link:focus-visible,
body.md-region-kenya .md-home-latest > .wp-block-paragraph:last-child a:hover,
body.md-region-kenya .md-home-latest > .wp-block-paragraph:last-child a:focus-visible,
body.md-region-kenya .md-meta__button:hover,
body.md-region-kenya .md-meta__button:focus-visible,
body.md-region-kenya .md-toolkit-download__button:hover,
body.md-region-kenya .md-toolkit-download__button:focus-visible,
body.md-region-kenya .wp-block-button__link:hover,
body.md-region-kenya .wp-block-button__link:focus-visible,
body.md-region-uk .md-home-latest__cta-link:hover,
body.md-region-uk .md-home-latest__cta-link:focus-visible,
body.md-region-uk .md-home-latest > .wp-block-paragraph:last-child a:hover,
body.md-region-uk .md-home-latest > .wp-block-paragraph:last-child a:focus-visible,
body.md-region-uk .md-meta__button:hover,
body.md-region-uk .md-meta__button:focus-visible,
body.md-region-uk .md-toolkit-download__button:hover,
body.md-region-uk .md-toolkit-download__button:focus-visible,
body.md-region-uk .wp-block-button__link:hover,
body.md-region-uk .wp-block-button__link:focus-visible {
	background: #fff !important;
	color: var(--md-color-contrast, #1c1b1a) !important;
	border: none !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

/*
 * Project pages — the Latest "Load more" sits on a tinted regional band, where a
 * neutral hover shadow reads as flat. Rest stays flat like every other button;
 * hover matches the regional card glow.
 */
body.md-region-kenya .md-latest__load-more:hover,
body.md-region-kenya .md-latest__load-more:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 45%, transparent);
}

body.md-region-uk .md-latest__load-more:hover,
body.md-region-uk .md-latest__load-more:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 45%, transparent);
}

html[data-md-theme="dark"] body.md-region-kenya .md-latest__load-more:hover,
html[data-md-theme="dark"] body.md-region-kenya .md-latest__load-more:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 50%, transparent);
}

html[data-md-theme="dark"] body.md-region-uk .md-latest__load-more:hover,
html[data-md-theme="dark"] body.md-region-uk .md-latest__load-more:focus-visible {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 50%, transparent);
}

html[data-md-theme="dark"] .md-home-latest__cta-link,
html[data-md-theme="dark"] .md-home-latest > .wp-block-paragraph:last-child a,
html[data-md-theme="dark"] .md-meta__button,
html[data-md-theme="dark"] .md-toolkit-download__button,
html[data-md-theme="dark"] .wp-block-button__link {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
	border: none !important;
}

html[data-md-theme="dark"] .md-home-latest__cta-link:hover,
html[data-md-theme="dark"] .md-home-latest__cta-link:focus-visible,
html[data-md-theme="dark"] .md-home-latest > .wp-block-paragraph:last-child a:hover,
html[data-md-theme="dark"] .md-home-latest > .wp-block-paragraph:last-child a:focus-visible,
html[data-md-theme="dark"] .md-meta__button:hover,
html[data-md-theme="dark"] .md-meta__button:focus-visible,
html[data-md-theme="dark"] .md-toolkit-download__button:hover,
html[data-md-theme="dark"] .md-toolkit-download__button:focus-visible,
html[data-md-theme="dark"] .wp-block-button__link:hover,
html[data-md-theme="dark"] .wp-block-button__link:focus-visible {
	background: var(--md-color-surface, #2a2928) !important;
	color: var(--md-color-contrast, #f5f5f4) !important;
	border: none !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

/*
 * Button text is never underlined (all states, both colour modes).
 * Why this block exists: Home "View all Impact", Toolkit download and external
 * meta buttons are <a> elements inside <p> in the page content, so the body-copy
 * link rule (underline) out-ranks their own text-decoration: none. These
 * selectors rank higher. Running-text links, footer text links and the text-style
 * "Clear filters" control are NOT listed here and keep their underline.
 * Cues without underline: lift + shadow on hover/focus (above), and a visible
 * focus ring below (some pill rules removed the ring; keep keyboard focus clear).
 */
html body a.md-home-latest__cta-link:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body .md-home-latest > .wp-block-paragraph:last-child a:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body a.md-meta__button:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body a.md-toolkit-download__button:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body a.wp-block-button__link:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body a.wp-element-button:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body a.vc_general.vc_btn3:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html[data-md-theme="dark"] body a.md-home-latest__cta-link:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html[data-md-theme="dark"] body a.md-meta__button:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html[data-md-theme="dark"] body a.md-toolkit-download__button:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html[data-md-theme="dark"] body a.wp-block-button__link:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html[data-md-theme="dark"] body a.vc_general.vc_btn3:is(:link, :visited, :hover, :focus, :focus-visible, :active),
html body .nf-form-cont .nf-form-content :is(input[type="submit"], input[type="button"], button):is(:hover, :focus, :focus-visible, :active) {
	text-decoration: none;
	text-decoration-line: none;
}

html body a.md-home-latest__cta-link:focus-visible,
html body .md-home-latest > .wp-block-paragraph:last-child a:focus-visible,
html body a.md-meta__button:focus-visible,
html body a.md-toolkit-download__button:focus-visible,
html body a.wp-block-button__link:focus-visible,
html body a.wp-element-button:focus-visible {
	outline: var(--md-focus-outline, 2px solid #1c1b1a);
	outline-offset: var(--md-focus-outline-offset, 2px);
}

html[data-md-theme="dark"] body a.md-home-latest__cta-link:focus-visible,
html[data-md-theme="dark"] body a.md-meta__button:focus-visible,
html[data-md-theme="dark"] body a.md-toolkit-download__button:focus-visible,
html[data-md-theme="dark"] body a.wp-block-button__link:focus-visible {
	outline-color: var(--md-color-contrast, #f5f5f4);
}

.md-toolkit-download__lede {
	margin: 0 0 1rem;
}

.md-toolkit-download__note {
	margin: 0.75rem 0 0;
	font-size: var(--md-text-meta, 0.95rem);
	font-style: italic;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-toolkit-download--pending .md-toolkit-download__button {
	opacity: 0.55;
	cursor: not-allowed;
	pointer-events: none;
	transform: none !important;
	box-shadow: none !important;
}

@media (max-width: 781px) {
	.md-header__inner {
		flex-wrap: nowrap;
		align-items: center;
		row-gap: 0;
	}

	.md-header__brand {
		min-width: 0;
		flex: 1 1 auto;
	}

	.md-header__tools,
	.md-header:not(.is-compact) .md-header__tools,
	.md-header.is-compact .md-header__tools {
		flex: 0 0 auto;
		width: auto;
		max-width: none;
		margin-left: auto;
		justify-content: flex-end;
		align-items: center;
	}

	.md-prefs__panel {
		right: 0;
		left: auto;
	}
}

/*
 * ≤899px: jump-nav becomes a fixed dropdown under the header (matches archive
 * filter drawer breakpoint). Sidebar grid stacks to one column.
 */
@media (max-width: 899px) {
	main:has(.md-jump-nav) {
		--md-prose-track-inset: 0rem;
		/* Stacked layout: section starts after root pad only (no sidebar). */
		--md-section-bleed-x: var(--md-root-pad-x-start, var(--wp--style--root--padding-left, 1.5rem));
		--md-section-bleed-right: var(--md-root-pad-x-end, var(--wp--style--root--padding-right, 1.5rem));
	}

	.entry-content:has(> .md-jump-nav),
	.wp-block-post-content:has(> .md-jump-nav),
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav),
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) {
		grid-template-columns: 1fr;
		row-gap: 1.25rem;
	}

	.entry-content:has(> .md-jump-nav) > .md-jump-nav,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav {
		grid-column: 1;
		grid-row: auto;
	}

	.entry-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav + .md-page-section,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + *,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav + * {
		grid-row: auto;
	}

	.entry-content:has(> .md-jump-nav) > *:not(.md-jump-nav),
	.wp-block-post-content:has(> .md-jump-nav) > *:not(.md-jump-nav),
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > *:not(.md-jump-nav),
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > *:not(.md-jump-nav) {
		grid-column: 1;
		width: 100%;
		max-width: none;
		margin-left: 0 !important;
		margin-right: 0 !important;
		text-align: left;
	}

	.entry-content:has(> .md-jump-nav) > .md-page-section,
	.wp-block-post-content:has(> .md-jump-nav) > .md-page-section {
		grid-column: 1;
		grid-template-columns: minmax(0, 1fr);
		column-gap: 0;
		width: 100%;
		max-width: none;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0;
		padding-right: 0;
	}

	.entry-content:has(> .md-jump-nav) > .md-page-section > *,
	.wp-block-post-content:has(> .md-jump-nav) > .md-page-section > * {
		grid-column: 1;
	}

	/*
	 * Sticky “On this page” dropdown: sits in flow under the page title, then
	 * pins beneath the header on scroll. Collapsed bar shows the active section.
	 */
	.entry-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced {
		position: sticky;
		top: var(--md-jump-bar-top, calc(var(--md-header-height, 5.5rem) + 6px));
		z-index: 190;
		width: 100%;
		max-width: none;
		margin: 0 0 0.75rem;
		padding: 0.35rem;
		box-sizing: border-box;
		/* Stronger than sidebar frost so page titles do not show through. */
		background: var(--md-frost-surface, rgba(255, 255, 255, 0.94));
		box-shadow: var(--md-sidebar-shadow, 0 4px 18px rgba(28, 27, 26, 0.12));
	}

	.md-jump-nav__title {
		display: none;
	}

	.md-jump-nav__toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem;
		width: 100%;
		min-height: 2.75rem;
		margin: 0;
		padding: 0.65rem 0.85rem;
		border: none;
		border-radius: var(--md-radius-pill, 0.25rem);
		background: transparent;
		color: var(--md-color-contrast, #1c1b1a);
		font: inherit;
		font-size: 1.125rem;
		/* Section name in the sticky bar is regular weight (Inclusive Sans variable 300-700 is loaded, so 400 is a true face). */
		font-weight: 400;
		line-height: 1.2;
		text-align: left;
		cursor: pointer;
	}

	.md-jump-nav__toggle:focus-visible {
		outline: var(--md-focus-outline, 2px solid #1c1b1a);
		outline-offset: var(--md-focus-outline-offset, 2px);
	}

	.md-jump-nav__toggle-label {
		flex: 1 1 auto;
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.md-jump-nav__panel {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: calc(100% + 0.35rem);
		z-index: 1;
		max-height: min(70vh, 22rem);
		overflow: auto;
		padding: 0.35rem;
		box-sizing: border-box;
		background: var(--md-frost-surface, rgba(255, 255, 255, 0.94));
		border-radius: var(--md-radius, 0.5rem);
		backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
		-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
		box-shadow: var(--md-sidebar-shadow, 0 4px 18px rgba(28, 27, 26, 0.12));
	}

	.md-jump-nav__panel[hidden] {
		display: none !important;
	}

	.md-jump-nav__list {
		flex-direction: column;
		flex-wrap: nowrap;
	}

	.md-archive__filters {
		position: static;
	}
}

/*
 * MOBILE BAR HEIGHT (≤899px) — one shared height for the floating header pill,
 * the jump-nav toggle bar (About / project pages) and the archive filters
 * summary bar (Impact / Outputs / Resources; see camred-core archive-filters.css).
 * Height = 44px target (hamburger, jump toggle, filters summary) + equal
 * vertical padding derived from the variable, so the bars cannot drift apart.
 * Desktop (≥900px), --md-header-float-gap, --md-header-top-gap and horizontal padding are untouched.
 * Keep this block last among the mobile header / jump-nav rules so it wins.
 */
/* Shared bar tokens, global so the 900 to 1049px tablet bar uses the same values. */
:root {
	--md-mobile-bar-height: 3.25rem;
	--md-mobile-bar-target: 2.75rem;
	--md-mobile-bar-pad-y: calc((var(--md-mobile-bar-height) - var(--md-mobile-bar-target)) / 2);
}

@media (max-width: 899px) {
	:root {
		/* Pre-JS estimate only (top gap + bar); md-sticky-nav.js sets the live value inline. */
		--md-header-height: calc(var(--md-header-top-gap, 0.75rem) + var(--md-mobile-bar-height));
	}

	.md-header.is-compact .md-header__inner,
	.md-header:not(.is-compact) .md-header__inner {
		box-sizing: border-box;
		height: var(--md-mobile-bar-height);
		min-height: var(--md-mobile-bar-height);
		padding-top: var(--md-mobile-bar-pad-y);
		padding-bottom: var(--md-mobile-bar-pad-y);
	}

	.entry-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced {
		box-sizing: border-box;
		height: var(--md-mobile-bar-height);
		min-height: var(--md-mobile-bar-height);
		padding-top: var(--md-mobile-bar-pad-y);
		padding-bottom: var(--md-mobile-bar-pad-y);
	}

	.md-jump-nav__toggle {
		box-sizing: border-box;
		height: var(--md-mobile-bar-target);
		min-height: var(--md-mobile-bar-target);
		padding-top: 0;
		padding-bottom: 0;
	}

	/*
	 * Archive filters bar (Impact / Outputs / Resources). Rules live in the
	 * camred-core plugin CSS; the extra `.md-archive__layout >` keeps this
	 * override ahead of it regardless of stylesheet order. Closed = exactly the
	 * shared bar height; open keeps the plugin's comfortable bottom padding.
	 * Same shadow as the header and jump-nav bars.
	 */
	.md-archive__layout > .md-archive__filters.md-sidebar-panel {
		box-sizing: border-box;
		min-height: var(--md-mobile-bar-height);
		padding-top: var(--md-mobile-bar-pad-y);
		box-shadow: var(--md-sidebar-shadow, 0 4px 18px rgba(28, 27, 26, 0.12));
	}

	.md-archive__layout > .md-archive__filters.md-sidebar-panel:not(:has(.md-archive__filters-drawer[open])) {
		height: var(--md-mobile-bar-height);
		padding-bottom: var(--md-mobile-bar-pad-y);
	}

	.md-archive__layout > .md-archive__filters.md-sidebar-panel .md-archive__filters-summary {
		height: var(--md-mobile-bar-target);
		min-height: var(--md-mobile-bar-target);
	}
}

/* Desktop (>=1050px): panels follow the taller bar (see --md-submenu-pad-offset). */
@media (min-width: 1050px) {
	:root {
		--md-submenu-pad-offset: calc(var(--md-header-pad-y, 0.5rem) - 0.5rem);
	}
}

/*
 * PANEL GAP (1.0.84): one visible gap from the header bar's bottom edge to every
 * floating panel under it: the desktop Projects dropdown, the display-preferences
 * panel and the hamburger menu panel (md-sticky-nav.js places that one at bar
 * bottom + --md-header-float-gap). Dropdown and prefs panel are anchored to the nav
 * pill / prefs button, not the bar, so --md-submenu-pad-offset (used by both) is
 * derived from this token: panel gap minus the 24px submenu gap plus the space
 * between the button's bottom and the bar's bottom. Result: 16px at 900px and
 * wider (12px on phones, 15/20px at 125% text), the same for both panels.
 */
:root {
	--md-header-panel-gap: var(--md-header-float-gap, 1rem);
}

@media (min-width: 1050px) {
	:root {
		--md-submenu-pad-offset: calc(var(--md-header-panel-gap) - var(--md-submenu-gap, 1.5rem) + var(--md-header-pad-y, 0.75rem));
	}
}

/* Hamburger widths: the prefs button sits --md-mobile-bar-pad-y above the bar's bottom. */
@media (max-width: 1049px) {
	:root {
		--md-submenu-pad-offset: calc(var(--md-header-panel-gap) - var(--md-submenu-gap, 1.5rem) + var(--md-mobile-bar-pad-y, 0.25rem));
	}
}

/*
 * TABLET BAR HEIGHT (900 to 1049px, hamburger) = PHONE BAR HEIGHT.
 * Same 52px bar as the block above: the 44px hamburger button plus equal padding
 * above and below (--md-mobile-bar-pad-y, 4px). The logo (clamp in the hamburger
 * block) and button are centred by the flex row. Desktop (>=1050px) is untouched.
 * Sticky tops, the first band offset (--md-section-pad-top above) and the menu,
 * prefs and jump anchors follow: md-sticky-nav.js measures the bar live, and the
 * CSS fallbacks use --md-header-bar-height-tablet.
 */
@media (min-width: 900px) and (max-width: 1049px) {
	.md-header.is-compact .md-header__inner,
	.md-header:not(.is-compact) .md-header__inner {
		box-sizing: border-box;
		height: var(--md-header-bar-height-tablet);
		min-height: var(--md-header-bar-height-tablet);
		padding-top: var(--md-mobile-bar-pad-y);
		padding-bottom: var(--md-mobile-bar-pad-y);
	}
}

html[data-md-theme="dark"] .md-jump-nav__toggle {
	color: var(--md-color-contrast, #f5f5f4);
}

/*
 * STICKY SUBMENU BARS = HEADER GLASS.
 * The floating header pill is painted with --md-frost-nav-shell (background,
 * 80% white in light, 80% charcoal in dark) and --md-frost-blur (saturate 180%,
 * blur 18px), with the shadow 0 4px 18px (= --md-sidebar-shadow). Those same
 * variables now drive the mobile jump-nav bar and its dropdown, and the
 * archive Filter bar (which already uses them via .md-sidebar-panel), so the
 * bars cannot drift apart. Change the glass once in :root and all follow.
 * Colour comes from the page showing through the blur; there is no extra tint.
 *
 * Jump-nav bar: the frost sits on ::before (as on the header pill) so the
 * bar is not a backdrop root, which lets the open dropdown blur the real page
 * behind it instead of only the bar. Desktop sidebar panels are not touched.
 */
@media (max-width: 899px) {
	.entry-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced {
		background: transparent;
		background-color: transparent;
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}

	.entry-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced::before,
	.wp-block-post-content:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced::before,
	.entry-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced::before,
	.wp-block-post-content > .wpb-content-wrapper:has(> .md-jump-nav) > .md-jump-nav.md-jump-nav--enhanced::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		border-radius: inherit;
		background: var(--md-frost-nav-shell);
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
		pointer-events: none;
	}

	.md-jump-nav__panel {
		background: var(--md-frost-nav-shell);
		backdrop-filter: var(--md-frost-blur);
		-webkit-backdrop-filter: var(--md-frost-blur);
	}
}

/*
 * No backdrop-filter support: frosted bars would show page text through an
 * unblurred 80% layer, so every shared frost surface falls back to the near
 * solid 94% colour. Browsers with blur are unaffected.
 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	:root {
		--md-frost-nav-shell: var(--md-frost-surface);
	}

	html[data-md-theme="dark"] {
		--md-frost-nav-shell: var(--md-frost-surface);
	}
}

@media (prefers-reduced-motion: reduce) {
	* {
		scroll-behavior: auto !important;
	}

	.md-header__brand .wp-block-site-title,
	.md-header__title,
	.md-header__brand .wp-block-site-title a,
	.md-brand-logo,
	.md-brand-logo__symbol,
	.md-brand-logo__word,
	.md-header__logo,
	.md-header__tagline,
	.md-header__brand .wp-block-site-tagline,
	.md-header__nav .wp-block-navigation-item a,
	.md-header__nav .wp-block-navigation__container > .wp-block-navigation-item.has-child {
		transition: none !important;
	}

	.md-home-latest__cta-link:hover,
	.md-home-latest__cta-link:focus-visible,
	.md-home-latest > .wp-block-paragraph:last-child a:hover,
	.md-home-latest > .wp-block-paragraph:last-child a:focus-visible,
	.md-meta__button:hover,
	.md-meta__button:focus-visible,
	.md-toolkit-download__button:hover,
	.md-toolkit-download__button:focus-visible,
	.wp-block-button__link:hover,
	.wp-block-button__link:focus-visible,
	.vc_general.vc_btn3:hover,
	.vc_general.vc_btn3:focus-visible {
		transform: none;
		box-shadow: none;
	}

	.md-reveal {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}
}

/* —— Scroll reveals (fade + rise, one animation per section) —— */
.md-reveal {
	opacity: 0;
	transform: translate3d(0, 1.75rem, 0);
	transition: none;
}

.md-reveal.md-reveal--in {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition:
		opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

/*
 * Drop the compositor layer after the rise finishes. A lingering
 * transform: translate3d(0,0,0) softens Inclusive Sans 700 (same lesson as the
 * cookie bar: avoid persistent transform on text ancestors).
 * Only the reveal wrapper clears transform — child CTAs keep their own
 * translateY hover lift (do not put translate3d on whole content wrappers).
 */
.md-reveal.md-reveal--settled {
	transform: none;
}

/*
 * Dynamic shortcode hosts — stay visible if reveal ran before plugin output
 * (Ninja Forms, team grid, latest cards, archive, hero carousel).
 */
.md-reveal:has(.nf-form-cont),
.md-reveal:has(.ninja-forms-form-wrap),
.md-reveal:has(.md-team),
.md-reveal:has(.md-latest),
.md-reveal:has(.md-archive),
.md-reveal:has(.md-hero),
.md-reveal:has(.md-home-projects),
.md-reveal:has(.md-home-featured),
.wp-block-shortcode:has(.nf-form-cont),
.wp-block-shortcode:has(.md-team),
.wp-block-shortcode:has(.md-latest),
.wp-block-shortcode:has(.md-archive),
.wp-block-shortcode:has(.md-hero),
.wp-block-shortcode:has(.md-home-projects),
.wp-block-shortcode:has(.md-home-featured) {
	opacity: 1 !important;
	transform: none !important;
}

/* —— Toolkit pages —— */

.md-toolkit-placeholder {
	color: #4a4846;
	font-style: italic;
}

.md-toolkit-summary {
	margin: var(--md-space, 1.5rem) 0 0;
	background: #fff;
	color: #1c1b1a;
	border-radius: var(--md-radius, 0.5rem);
	overflow: auto;
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.08);
}

.md-toolkit-summary table,
.md-toolkit-summary .tablepress {
	width: 100%;
	min-width: 46rem;
	margin: 0;
	border-collapse: collapse;
	border: 0;
	--text-color: #1c1b1a;
	--head-text-color: #1c1b1a;
	--head-bg-color: transparent;
	--odd-bg-color: transparent;
	--even-bg-color: transparent;
	--hover-bg-color: transparent;
	--border-color: #e4e2df;
	--padding: 1rem 1.15rem;
}

.md-toolkit-summary caption {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.md-toolkit-summary :is(th, td),
.md-toolkit-summary .tablepress :is(th, td) {
	padding: 1rem 1.15rem;
	text-align: left;
	vertical-align: top;
	border: 0;
	border-bottom: 1px solid #e4e2df;
	background: transparent;
	color: #1c1b1a;
	/* One step below body (medium) → theme Small */
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	font-weight: 400;
	line-height: 1.5;
}

.md-toolkit-summary thead th,
.md-toolkit-summary .tablepress thead th {
	font-family: var(--wp--preset--font-family--space-mono);
	font-size: 0.8125rem;
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1.4;
	background: transparent;
	border-bottom: 2px solid #1c1b1a;
}

.md-toolkit-summary tbody th,
.md-toolkit-summary .tablepress tbody td:first-child {
	font-weight: 700;
	width: 22%;
}

.md-toolkit-summary tbody td:nth-child(2),
.md-toolkit-summary .tablepress tbody td:nth-child(2) {
	width: 40%;
}

.md-toolkit-summary a {
	display: inline-block;
	margin: 0.15rem 0;
	color: #1c1b1a;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.12em;
	text-decoration-color: color-mix(in srgb, currentColor 50%, transparent);
	transition:
		text-underline-offset var(--md-transition-duration-move) var(--md-transition-ease),
		text-decoration-color var(--md-transition-duration) var(--md-transition-ease),
		color var(--md-transition-duration) var(--md-transition-ease);
}

.md-toolkit-summary a:hover,
.md-toolkit-summary a:focus-visible {
	text-underline-offset: 0.45em;
	text-decoration-color: transparent;
}

@media (prefers-reduced-motion: reduce) {
	.md-toolkit-summary a {
		transition: none;
	}

	.md-toolkit-summary a:hover,
	.md-toolkit-summary a:focus-visible {
		text-underline-offset: 0.12em;
		text-decoration-color: color-mix(in srgb, currentColor 50%, transparent);
		opacity: 0.75;
	}
}

.md-toolkit-summary tr:last-child :is(th, td) {
	border-bottom: 0;
}

html[data-md-theme="dark"] .md-toolkit-summary {
	background: #fff;
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-toolkit-placeholder {
	color: #d5d3d0;
}

/* ==========================================================================
 * MOTION — inactive-to-active transitions (added 1.0.48)
 *
 * Timing tokens (--md-transition-*) are defined once in :root near the top of
 * this file. Rules here ADD transitions where a component had none, and
 * re-assert the shared tokens over plugin CSS (camred-core loads after this
 * file, so those selectors carry an `html body` prefix to win on specificity
 * without !important). Every transition sits on the BASE rule so the element
 * eases back out as well as in. Only named properties are listed (never `all`)
 * and focus rings are never transitioned, so they show immediately.
 * ========================================================================== */

/* Project cards: typed origin so the pointer-follow gradient glides, not snaps. */
@property --md-grad-x {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 50%;
}

@property --md-grad-y {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 50%;
}

/* —— Header: frosted bar fades in on scroll (shadow is handled on __inner) —— */
.md-header.is-compact .md-header__inner::before {
	transition: opacity var(--md-transition-duration) var(--md-transition-ease);
}

@starting-style {
	.md-header.is-compact .md-header__inner::before {
		opacity: 0;
	}
}

/* —— Primary nav: Projects submenu links (mobile menu uses the same links) —— */
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.md-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	transition: var(--md-transition-colour);
}

/* —— Desktop Projects dropdown panel: fade + small drop; display switches at the end —— */
@media (min-width: 1050px) {
	.md-header__nav.wp-block-navigation .has-child > .wp-block-navigation__submenu-container {
		transform: translateY(-0.35rem);
		transition:
			opacity var(--md-transition-duration) var(--md-transition-ease),
			transform var(--md-transition-duration-move) var(--md-transition-ease),
			visibility var(--md-transition-duration-move) var(--md-transition-ease);
		transition:
			opacity var(--md-transition-duration) var(--md-transition-ease),
			transform var(--md-transition-duration-move) var(--md-transition-ease),
			visibility var(--md-transition-duration-move) var(--md-transition-ease),
			display var(--md-transition-duration-move) allow-discrete;
	}

	.md-header__nav.wp-block-navigation .has-child:hover > .wp-block-navigation__submenu-container,
	.md-header__nav.wp-block-navigation .has-child:focus-within > .wp-block-navigation__submenu-container,
	.md-header__nav.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
		transform: none;
	}

	@starting-style {
		.md-header__nav.wp-block-navigation .has-child:hover > .wp-block-navigation__submenu-container,
		.md-header__nav.wp-block-navigation .has-child:focus-within > .wp-block-navigation__submenu-container,
		.md-header__nav.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
			opacity: 0 !important;
			transform: translateY(-0.35rem);
		}
	}
}

/* —— Hamburger: menu panel fades + drops (the icon bars morph into an X: see HEADER ICONS block) —— */
@media (max-width: 1049px) {
	.md-header__nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		transition: var(--md-transition-colour), var(--md-transition-fade);
	}

	/* The frosted sheet is the dialog; md-mobile-nav.js keeps .is-menu-open for one beat on close. */
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
		transition:
			opacity var(--md-transition-duration-panel) var(--md-transition-ease),
			transform var(--md-transition-duration-panel) var(--md-transition-ease);
	}

	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open.is-menu-closing .wp-block-navigation__responsive-dialog {
		opacity: 0;
		transform: translateY(-0.5rem);
		pointer-events: none;
	}

	@starting-style {
		.md-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
			opacity: 0;
			transform: translateY(-0.5rem);
		}
	}
}

/* —— Display preferences: toggle, panel (opens/closes via [hidden]) —— */
.md-prefs__toggle {
	transition: var(--md-transition-colour), var(--md-transition-fade);
}

.md-prefs__panel {
	opacity: 1;
	transform: none;
	transition:
		opacity var(--md-transition-duration) var(--md-transition-ease),
		transform var(--md-transition-duration-move) var(--md-transition-ease);
	transition:
		opacity var(--md-transition-duration) var(--md-transition-ease),
		transform var(--md-transition-duration-move) var(--md-transition-ease),
		display var(--md-transition-duration-move) allow-discrete;
}

.md-prefs__panel[hidden] {
	opacity: 0;
	transform: translateY(-0.35rem);
}

@starting-style {
	.md-prefs__panel:not([hidden]) {
		opacity: 0;
		transform: translateY(-0.35rem);
	}
}

/* —— Jump nav (About, projects, Toolkit): links, mobile toggle, mobile dropdown —— */
.md-jump-nav__link {
	transition: var(--md-transition-colour);
}

@media (max-width: 899px) {
	.md-jump-nav__toggle {
		transition: var(--md-transition-colour);
	}

	.md-jump-nav--enhanced .md-jump-nav__panel {
		opacity: 1;
		transform: none;
		transition:
			opacity var(--md-transition-duration) var(--md-transition-ease),
			transform var(--md-transition-duration-move) var(--md-transition-ease);
		transition:
			opacity var(--md-transition-duration) var(--md-transition-ease),
			transform var(--md-transition-duration-move) var(--md-transition-ease),
			display var(--md-transition-duration-move) allow-discrete;
	}

	.md-jump-nav--enhanced .md-jump-nav__panel[hidden] {
		opacity: 0;
		transform: translateY(-0.35rem);
	}

	@starting-style {
		.md-jump-nav--enhanced .md-jump-nav__panel:not([hidden]) {
			opacity: 0;
			transform: translateY(-0.35rem);
		}
	}

	/* Archive filters drawer (plugin markup): shared panel timing and shadow. */
	html body .md-archive__filters.md-sidebar-panel {
		transition:
			padding-bottom var(--md-transition-duration-panel) var(--md-transition-ease),
			box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
	}

	html body .md-archive__filters-drawer.md-details--animated .md-details__panel {
		transition: grid-template-rows var(--md-transition-duration-panel) var(--md-transition-ease);
	}

	html body .md-archive__filters-drawer.md-details--animated .md-details__inner {
		transition: opacity var(--md-transition-duration-panel) var(--md-transition-ease);
	}
}

/* —— Plugin components (camred-core): align to the shared tokens —— */

/* Cards in Impact / Outputs / Resources, Latest cards, related posts */
html body .md-archive__card,
html body .md-latest__card {
	transition: var(--md-transition-lift);
}

/* Archive Apply / Load more, Latest Load more */
html body .md-archive__apply,
html body .md-archive__load-more,
html body .md-latest__load-more {
	transition: var(--md-transition-interactive);
}

/* Filter checkbox control: box fill and border ease; focus ring stays immediate */
html body .md-archive__checkbox {
	transition:
		background-color var(--md-transition-duration) var(--md-transition-ease),
		border-color var(--md-transition-duration) var(--md-transition-ease);
}

/* Clear filters, term pills, share links, hero dots, dialog close buttons */
html body .md-archive__clear,
html body .md-post-terms__pill,
html body .md-post-terms__share-link,
html body .md-hero__dot,
html body .md-team__modal-close,
html body .md-lightbox__close {
	transition: var(--md-transition-colour);
}

/* Results dim and restore while filters reload */
html body .md-archive__results {
	transition: var(--md-transition-fade);
}

/* Hero slides cross-fade */
html body .md-hero__slide {
	transition:
		opacity var(--md-transition-duration-slide) var(--md-transition-ease),
		visibility var(--md-transition-duration-slide) var(--md-transition-ease);
}

/* Team cards (hover rules in the plugin repeat their own transition, so list them too) */
html body .md-team__card,
html body .md-team__card:hover,
html body .md-team__card:focus-visible,
html body .md-team__card.md-reveal.md-reveal--in:hover,
html body .md-team__card.md-reveal.md-reveal--in:focus-visible {
	transition: var(--md-transition-lift);
}

/* Partner / funder logo tiles and the About theme-still buttons */
html body .md-partners__link,
html body .entry-content .md-theme-gallery__button,
html body .wp-block-post-content .md-theme-gallery__button {
	transition: var(--md-transition-lift);
}

/* —— Light/dark switch: short colour fade, only after the user presses the toggle —— */
html.md-theme-transition,
html.md-theme-transition *,
html.md-theme-transition *::before,
html.md-theme-transition *::after {
	transition-property: color, background-color, border-color, fill, stroke, box-shadow, text-decoration-color !important;
	transition-duration: 0.3s !important;
	transition-delay: 0s !important;
	transition-timing-function: var(--md-transition-ease) !important;
}

/* —— Reduced motion (WCAG 2.3.3) ——
 * Tokens collapse: movement, lift, shadow and panel timings become instant and
 * colour/opacity changes shorten to 0.08s. Everything above that uses the
 * tokens follows automatically; existing component blocks that set
 * `transition: none` stay as they are. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--md-transition-duration: 0.08s;
		--md-transition-duration-move: 0.01ms;
		--md-transition-duration-panel: 0.01ms;
		--md-transition-duration-slide: 0.01ms;
	}

	html.md-theme-transition,
	html.md-theme-transition *,
	html.md-theme-transition *::before,
	html.md-theme-transition *::after {
		transition: none !important;
	}

	.md-header__nav.wp-block-navigation .has-child > .wp-block-navigation__submenu-container,
	.md-prefs__panel[hidden],
	.md-jump-nav--enhanced .md-jump-nav__panel[hidden],
	.md-header__nav .wp-block-navigation__responsive-container.is-menu-open.is-menu-closing .wp-block-navigation__responsive-dialog {
		transform: none;
	}
}

/*
 * HEADER ICONS = ACCORDION '+' MARKER.
 * The hamburger/cross and the display-preferences icon use the same box
 * (--md-details-marker, 1.425 x --md-details-font-size) and the same 1px
 * stroke (--md-details-marker-stroke) as the accordion and jump-nav '+', so
 * they stay equal as the clamp-based font size changes. Square ends and
 * currentColor, like the '+'.
 * Button hit targets are not shrunk: 44px on mobile, the existing pill height
 * on desktop (the icon may overflow a 32px button by under 2px; it is visual only).
 */
.md-header__nav .wp-block-navigation__responsive-container-open .md-nav-toggle__icon {
	position: relative;
	width: var(--md-details-marker);
	height: var(--md-details-marker);
	font-size: var(--md-details-font-size);
	/* Bar spacing from the middle bar, snapped to whole pixels so the 1px lines stay crisp and equally spaced. */
	--md-nav-bar-gap: calc(var(--md-details-marker) * 0.29);
	--md-nav-bar-mid: calc((var(--md-details-marker) - var(--md-details-marker-stroke)) / 2);
	overflow: visible;
}

@supports (top: round(nearest, 1.5px, 1px)) {
	.md-header__nav .wp-block-navigation__responsive-container-open .md-nav-toggle__icon {
		--md-nav-bar-gap: round(nearest, calc(var(--md-details-marker) * 0.29), 1px);
		--md-nav-bar-mid: round(down, calc((var(--md-details-marker) - var(--md-details-marker-stroke)) / 2), 1px);
	}
}

/*
 * Hamburger = three 1px bars. Open (aria-expanded="true", set by md-mobile-nav.js):
 * the middle bar fades and shrinks to the centre; the top and bottom bars move to
 * the centre and rotate +/-45deg, lengthened by sqrt(2) so the X runs corner to
 * corner of the icon box. scaleX only changes length, so thickness stays 1px.
 * Closing reverses it. Reduced motion: no transition (instant).
 */
.md-nav-toggle__bar {
	position: absolute;
	left: 0;
	width: 100%;
	height: var(--md-details-marker-stroke);
	background: currentColor;
	transform-origin: center;
	transition:
		transform var(--md-transition-duration-move) var(--md-transition-ease),
		opacity calc(var(--md-transition-duration) * 0.6) var(--md-transition-ease);
}

.md-nav-toggle__bar--top {
	top: calc(var(--md-nav-bar-mid) - var(--md-nav-bar-gap));
}

.md-nav-toggle__bar--mid {
	top: var(--md-nav-bar-mid);
}

.md-nav-toggle__bar--bottom {
	top: calc(var(--md-nav-bar-mid) + var(--md-nav-bar-gap));
}

.wp-block-navigation__responsive-container-open[aria-expanded="true"] .md-nav-toggle__bar--top {
	transform: translateY(var(--md-nav-bar-gap)) rotate(45deg) scaleX(1.4142);
}

.wp-block-navigation__responsive-container-open[aria-expanded="true"] .md-nav-toggle__bar--mid {
	opacity: 0;
	transform: scaleX(0);
}

.wp-block-navigation__responsive-container-open[aria-expanded="true"] .md-nav-toggle__bar--bottom {
	transform: translateY(calc(-1 * var(--md-nav-bar-gap))) rotate(-45deg) scaleX(1.4142);
}

@media (prefers-reduced-motion: reduce) {
	.md-nav-toggle__bar {
		transition: none;
	}
}

.md-prefs__icon {
	box-sizing: border-box;
	width: var(--md-details-marker);
	height: var(--md-details-marker);
	font-size: var(--md-details-font-size);
	border: var(--md-details-marker-stroke) solid currentColor;
	border-radius: 50%;
	background: linear-gradient(90deg, transparent 50%, currentColor 50%) border-box;
}

/* Preferences toggle had no visible keyboard focus (outline: none above, no background). */
.md-prefs__toggle:focus-visible {
	outline: var(--md-focus-outline);
	outline-offset: var(--md-focus-outline-offset);
}

@media (max-width: 899px) {
	.md-header.md-header .md-prefs,
	.md-header.md-header .md-prefs .md-prefs__toggle {
		width: var(--md-mobile-bar-target, 2.75rem);
		height: var(--md-mobile-bar-target, 2.75rem);
	}
}

/*
 * ARCHIVE FILTER BAR — STICKY ON MOBILE (≤899px; Impact / Outputs / Resources)
 * Same mechanism as the "On this page" jump-nav bar: pinned at
 * --md-jump-bar-top (header bottom + --md-header-float-gap, set by
 * md-sticky-nav.js), same bar height, frosted surface, shadow and z-index,
 * and --md-scroll-padding already includes the bar so focused results are
 * never hidden behind it (WCAG 2.4.11).
 * Why it used to scroll away: the layout is a grid, so a sticky item can only
 * move within its own grid row (one bar high), and a rule set it to
 * position: static. Block layout makes the whole results column its
 * containing block. Rules below need the plugin's .md-archive--enhanced class
 * (set by archive-filters.js); without JS the filters stay an open static form.
 * The open drawer is a panel beneath the bar (like the jump-nav dropdown), so
 * the bar never changes height and the results never jump.
 * Desktop (≥900px) is untouched: sidebar sticky rules above still apply.
 */
@media (max-width: 899px) {
	html body .md-archive__layout {
		display: block;
	}

	html body .md-archive__layout > .md-archive__filters + .md-archive__main {
		margin-top: var(--md-gutter, 2rem);
	}

	html body .md-archive--enhanced .md-archive__layout > .md-archive__filters.md-sidebar-panel {
		position: sticky;
		top: var(--md-jump-bar-top, calc(var(--md-header-height, 5.5rem) + var(--md-header-float-gap, 0.75rem)));
		z-index: 190;
		width: 100%;
		height: var(--md-mobile-bar-height, 3.25rem);
		min-height: var(--md-mobile-bar-height, 3.25rem);
		padding-block: var(--md-mobile-bar-pad-y, 0.25rem);
		/* Stronger than the sidebar frost so cards scrolling underneath do not show through. */
		background: var(--md-frost-surface, rgba(255, 255, 255, 0.94));
		box-shadow: var(--md-sidebar-shadow, 0 4px 18px rgba(28, 27, 26, 0.12));
		transition: box-shadow var(--md-transition-duration-move) var(--md-transition-ease);
	}

	/* Open drawer = dropdown panel under the bar; inner scroll when taller than the room left. */
	html body .md-archive--enhanced .md-archive__filters-drawer .md-details__panel {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		top: calc(100% + 0.35rem);
		z-index: 1;
		box-sizing: border-box;
		/* Fallback assumes the bar is stuck; JS refines it from the live bar position. */
		max-height: calc(100vh - var(--md-jump-bar-top, 5rem) - var(--md-mobile-bar-height, 3.25rem) - 0.35rem - var(--md-header-float-gap, 0.75rem));
		max-height: var(--md-archive-panel-max, calc(100dvh - var(--md-jump-bar-top, 5rem) - var(--md-mobile-bar-height, 3.25rem) - 0.35rem - var(--md-header-float-gap, 0.75rem)));
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		padding: 1rem 0.5rem 1.25rem;
		/* Solid surface: a long checkbox list must not show results ghosting through. */
		background: var(--md-color-surface, #fff);
		border-radius: var(--md-radius, 0.5rem);
		box-shadow: var(--md-sidebar-shadow, 0 4px 18px rgba(28, 27, 26, 0.12));
		text-align: left;
	}

	html body .md-archive--enhanced .md-archive__filters-drawer .md-details__inner,
	html body .md-archive--enhanced .md-archive__filters-drawer[open] .md-details__inner {
		margin-top: 0;
		overflow: visible;
		opacity: 1;
		transition: none;
	}

	/* Open/close: same fade and slight drop as the jump-nav dropdown (tokens collapse for reduced motion). */
	html body .md-archive--enhanced .md-archive__filters-drawer.md-details--animated .md-details__panel {
		grid-template-rows: none;
		opacity: 0;
		transform: translateY(-0.35rem);
		transition:
			opacity var(--md-transition-duration-panel) var(--md-transition-ease),
			transform var(--md-transition-duration-panel) var(--md-transition-ease);
	}

	html body .md-archive--enhanced .md-archive__filters-drawer.md-details--animated.md-details--revealed .md-details__panel {
		opacity: 1;
		transform: none;
	}

	/* The bar keeps its closed height and padding whether the drawer is open or not. */
	html body .md-archive--enhanced .md-archive__layout > .md-archive__filters.md-sidebar-panel:has(.md-archive__filters-drawer[open]) {
		padding-bottom: var(--md-mobile-bar-pad-y, 0.25rem);
	}
}

/*
 * FLUID TYPE SCALE (1.0.62). One place for every text size.
 *
 * Phones and tablets (under 900px) keep the sizes they had. From 900px the
 * main text styles grow smoothly with the viewport and stop growing at
 * 2240px, so ultra-wide screens do not keep enlarging. Heading styles that
 * already scaled with vw keep their existing curve and only add growth after
 * it ends, so nothing changes at small widths.
 *
 * Every size is clamp(min, rem + vw, max) with a rem part, so browser zoom and
 * the browser's own font-size setting still scale the text (WCAG 1.4.4, 1.4.10).
 * --md-vw is 1vw times the text-size preference (md-prefs.js sets
 * --md-font-scale and html font-size). Rem sizes scale with html, vw sizes scale
 * through --md-vw, so the preference multiplies the whole scale. html font-size
 * itself is untouched (header height, sticky offsets and the accordion marker
 * are rem based and tuned together).
 *
 * Token            phone   1440    1920    cap (2240px+)
 * --md-text-small    14     15.2    16.3    17      (labels, tags, dates)
 * --md-text-meta     15     16.3    17.5    18.3    (captions, notes, filter text)
 * --md-text-body     18     19.6    21.0    22      (body, nav, buttons, cards)
 * --md-text-prose    18     21.2    24.1    26      (long-form copy, 66ch column)
 * --md-text-h4       18     19.6    21.0    22
 * --md-text-h3       21.1   23.9    26.3    28
 * --md-text-h2       36     39.2    42.1    44
 * --md-text-h1       44     71.6    80.2    86      (page titles, Home section titles)
 * --md-text-lead     26     34      38.4    42      (Home vision, page lede)
 * --md-text-details  18.2   21.7    23.1    24      (accordion summary; marker is 1.425em of it)
 * Effect on the 66ch measure: the column is in ch of --md-text-prose,
 * so it widens in px as the type grows (840px at 1440 up to about 1090px at 2240).
 */
:root {
	--md-vw: calc(1vw * var(--md-font-scale, 1));

	--md-text-small: clamp(0.875rem, calc(0.7491rem + 0.2239 * var(--md-vw)), 1.0625rem);
	--md-text-meta: clamp(0.9375rem, calc(0.799rem + 0.2463 * var(--md-vw)), 1.1438rem);
	--md-text-body: clamp(1.125rem, calc(0.9571rem + 0.2985 * var(--md-vw)), 1.375rem);
	--md-text-prose: clamp(1.125rem, calc(0.7892rem + 0.597 * var(--md-vw)), 1.625rem);
	--md-text-h4: var(--md-text-body);
	--md-text-h3: clamp(1.3163rem, calc(1.025rem + 0.5179 * var(--md-vw)), 1.75rem);
	--md-text-h2: clamp(2.25rem, calc(1.914rem + 0.597 * var(--md-vw)), 2.75rem);
	--md-text-large: clamp(1.5rem, calc(1.248rem + 0.4478 * var(--md-vw)), 1.875rem);
	--md-text-huge: clamp(3.5rem, calc(2.828rem + 1.194 * var(--md-vw)), 4.5rem);

	/* Page titles: existing 5.5vw curve (44px to 68px at 1236px), then growth to +18px. */
	--md-type-display: calc(
		clamp(2.75rem, 5.5vw, 4.25rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 77.5rem) * 0.018), 1.125rem)
	);
	--md-text-h1: var(--md-type-display);
	/* Home vision lede: existing curve (caps at 34px), then growth to +8px. */
	--md-type-lede: calc(
		clamp(1.625rem, 2.25vw, 2.125rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 95rem) * 0.01111), 0.5rem)
	);
	--md-text-lead: var(--md-type-lede);
	/* Accordion summary: existing curve (18 to 21px), then growth to +3px. The marker stays 1.425em of this. */
	--md-text-details: calc(
		clamp(1.125rem, 0.35vw + 1.05rem, 1.3125rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 75rem) * 0.002885), 0.1875rem)
	);
	/* Card and list titles (team names, partners, Latest cards, pop-up bio title). */
	--md-text-card-title: calc(
		clamp(1.35rem, 2vw, 1.55rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 77.5rem) * 0.004), 0.25rem)
	);
	--md-text-quote: calc(
		clamp(1.35rem, 2.25vw, 1.625rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 72.5rem) * 0.0037), 0.25rem)
	);
	--md-text-hero-title: calc(
		clamp(1.45rem, 3vw, 2.25rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 75rem) * 0.005769), 0.375rem)
	);
	/* Objectives: big numerals and statements keep their step above the body text. */
	--md-text-objective-num: calc(
		clamp(4.5rem, 9.5vw, 8.5rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 90rem) * 0.03), 1.5rem)
	);
	--md-text-objective: calc(
		clamp(1.125rem, 0.55vw + 1rem, 1.625rem)
		+ clamp(0px, calc((100 * var(--md-vw) - 113.75rem) * 0.009524), 0.25rem)
	);
}

/* Slightly tighter body leading as the type grows (1.5 on phones and laptops). Headings keep their own. */
@media (min-width: 1400px) {
	:root {
		--md-body-leading: 1.47;
	}
}

@media (min-width: 1800px) {
	:root {
		--md-body-leading: 1.44;
	}
}

/* Headings below h2 had no size of their own (browser default em). Zero specificity so any component class still wins. */
:where(h3) {
	font-size: var(--md-text-h3);
}

:where(h4) {
	font-size: var(--md-text-h4);
}

/*
 * OBJECTIVES LIST = TEXT COLUMN WIDTH.
 * The numbered 1 to 4 list sat in .md-vc-text, which is not capped, so it and
 * its divider lines ran the full band width while the paragraphs above stopped
 * at the 66ch measure. Same measure, set at the same font size as the paragraphs
 * (ch is relative to the element's own font size), so both compute the same px
 * width at every viewport. On narrow screens the column is narrower than the
 * measure, so the list is full width there. The numerals and statements set
 * their own sizes, so only the column width changes.
 */
.md-objectives {
	max-width: var(--md-prose-measure, 66ch);
	font-size: var(--md-prose-size, var(--md-text-prose, 1.125rem));
}

/*
 * Jump-nav column grows a little with the type (15rem at 900px up to 17.5rem at
 * 2240px) so the labels, e.g. "Aims and objectives", stay on one line. Every
 * bleed/inset calculation reads --md-jump-sidebar, so they follow.
 */
main:has(.md-jump-nav) {
	--md-jump-sidebar: clamp(15rem, calc(13.3214rem + 2.985 * var(--md-vw)), 17.5rem);
}

/*
 * DESKTOP DISPLAY-PREFERENCES ICON (1050px and up only).
 * The contrast icon was the accordion marker size (1.425em of the details font,
 * about 31px at 1440), well above the nav text. On desktop it is now 1.2 x the
 * nav text size (--md-text-body already includes the text-size preference and
 * the fluid type), so it is only a little taller than the menu text. The button
 * stays 32px (36px when the header is compact), so the hit area, focus ring and
 * panel anchor do not shrink. 1px stroke, half fill and currentColor are
 * unchanged. At 1049px and below (hamburger/compact layout) none of this applies.
 * The .md-prefs wrapper was a block whose line box left the button about 3.7px
 * above the nav link centre; as a flex box the same height as the nav pill, the
 * button centre now matches the link centre, and the panel sits under the pill
 * edge like the submenus.
 */
@media (min-width: 1050px) {
	.md-header .md-prefs__icon {
		width: calc(var(--md-text-body, 1.125rem) * 1.2);
		height: calc(var(--md-text-body, 1.125rem) * 1.2);
	}

	.md-header:not(.is-compact) .md-prefs {
		display: flex;
		align-items: center;
		min-height: var(--md-nav-pill-height, 2.25rem);
	}
}

/*
 * FOCUS ON NON-CONTROLS: NO BOX.
 * md-sticky-nav.js moves focus to the jump target (a heading, set to
 * tabindex="-1") so screen readers follow a jump link. Browsers match
 * :focus-visible for that scripted focus (always after a keyboard jump, and
 * after a mouse click in Safari, where links do not take focus), so a pale box
 * was drawn round the heading. Elements with tabindex="-1" are not operable and
 * not reachable with Tab, so they never show an outline. Focus still moves to
 * them (screen reader behaviour is unchanged). Real controls (links, buttons,
 * summaries, inputs, cards) are not tabindex="-1" and keep their rings.
 */
[tabindex="-1"]:focus,
[tabindex="-1"]:focus-visible {
	outline: none;
}

/*
 * Cards as the first block under the page title (Projects and Toolkit pages).
 * .md-home-projects carries a 6rem top margin for the Home page, where it follows
 * the featured carousel. Here WPBakery's column clearfix stops that margin
 * collapsing out of the column, so it sat inside the column as an empty strip
 * on top of the title's own bottom padding. Drop it so the cards start at the
 * top of their column; the title padding is the only gap above them.
 */
.wpb_wrapper > .md-home-projects:first-child {
	margin-top: 0;
}

/*
 * EXPANDED HEADER: EQUAL SPACE ABOVE AND BELOW THE LOGO AND MENU (>=1050px).
 * At the top of the page the header has no bar of its own, so the white space
 * under the logo is the clearance the page leaves before its first band (grey
 * main, project bands). That clearance was the measured header height plus
 * --md-space (24px), while the gap above the logo is --md-header-top-gap (16px),
 * so the logo sat about 8px high. Using --md-header-float-gap (the same 16px token
 * as the top gap and as the gap under the compact bar) makes both gaps equal and
 * puts the first band level with the expanded sticky sidebar top. The compact
 * bar, its height and --md-header-clearance (measured by md-sticky-nav.js) are
 * untouched. 900 to 1049px and phones are always compact and set their own clearance.
 */
@media (min-width: 1050px) {
	.wp-site-blocks {
		padding-top: calc(var(--md-header-clearance, var(--md-header-height, 5.5rem)) + var(--md-header-float-gap, 1rem)) !important;
	}
}

/*
 * PAGE BACKGROUND RUNS DOWN TO THE FOOTER ON SHORT PAGES.
 * The sticky footer (earlier in this file) pushes the footer to the bottom of
 * the window, but main kept its natural height. On a short page (Outputs
 * filtered to two results, Resources, Impact, Contact) that left a strip of
 * the white page background between the grey main and the footer. The site
 * wrapper is now a flex column and main grows into the spare height
 * (flex: 1 0 auto), so main's own background (the grey band, the regional
 * tint, or plain white on Home and Privacy) reaches the footer's top edge. The
 * footer keeps its own surface colour and padding. Long pages are unchanged:
 * main is already taller than the window, so nothing grows. Contact already
 * did this; this applies it everywhere and replaces the sticky offset.
 * The wrapper's min-height (earlier) already subtracts the admin bar height.
 * html gets the page base colour too, so overscroll matches in light and dark.
 */
html {
	background-color: var(--md-color-base, #fff);
}

.wp-site-blocks {
	display: flex;
	flex-direction: column;
}

.wp-site-blocks > main {
	flex: 1 0 auto;
	/* Constrained-layout children use auto side margins; in a flex column that
	 * would shrink them to their content, so keep them full width (max-width and
	 * the band shells' own !important widths still apply). */
	width: 100%;
	box-sizing: border-box;
}

.wp-site-blocks > .wp-block-template-part:has(.md-footer),
.wp-site-blocks > footer.md-footer {
	position: static;
	top: auto;
	flex: 0 0 auto;
}

/*
 * EXPANDED HEADER NEVER SHORTER THAN THE COMPACT BAR (>=1050px).
 * The expanded logo is now 15% smaller (--md-logo-height, 49px at most), so the
 * tall header on its own (logo height) would be shorter than the 60px compact
 * bar (2.25rem pill + 0.75rem padding top and bottom). The page offset would then
 * jump a few px down when scrolling into compact and back. A 60px minimum keeps
 * both states the same height: the logo stays centred in it with the menu pills
 * and prefs icon, the space above and below the logo stays equal, and the first
 * band, sticky sidebars and jump links line up with the compact bar. The offset
 * is still measured live by md-sticky-nav.js; this only sets the floor.
 */
@media (min-width: 1050px) {
	.md-header:not(.is-compact) .md-header__inner {
		min-height: var(--md-header-bar-height, 3.75rem);
	}
}

/*
 * HOME: EQUAL WHITE SPACE BELOW THE PROJECT CARDS AND BELOW THE FEATURED SLIDER.
 * Below the slider the gap is the Projects block's top margin (--md-space-section,
 * 6rem, the same at every width) plus the heading's own line-height leading, so the
 * "Projects" glyphs sit about 6rem + 0.23em under the slider. Below the cards the
 * gap to the grey Latest band was only the Latest band's 24px top margin (the
 * earlier "Home gap" rule above removed the Projects margin-bottom on request).
 * It is now deliberate and mirrors the gap above: one token, --md-home-section-gap,
 * plus the same heading leading (0.23 of the heading size) so the two white spaces
 * look equal. The margin sits on the Projects block, so it has equal space above
 * and below wherever it lands mid-page; the Latest band's own top margin is zeroed
 * so the two do not add up. Scoped to Home (.md-main--home): the Projects and
 * Toolkit pages (cards followed by the footer, not a band) are unchanged. The
 * heading size below must match the .md-home-projects__title font-size rules.
 * To get the plain 6rem box gap instead, set --md-home-gap-lead to 0px.
 */
:root {
	--md-home-section-gap: var(--md-space-section, 6rem);
}

.md-main--home .md-home-projects {
	--md-home-title-size: var(--md-type-home-display, clamp(2rem, 3.2vw, 3rem));
	--md-home-gap-lead: calc(0.23 * var(--md-home-title-size));
	margin-top: var(--md-home-section-gap);
	margin-bottom: calc(var(--md-home-section-gap) + var(--md-home-gap-lead));
}

@media (max-width: 899px) {
	.md-main--home .md-home-projects {
		--md-home-title-size: min(var(--md-type-home-display, clamp(2.75rem, 5.5vw, 4.25rem)), max(2rem, calc(4.2vw + 0.975rem)));
	}
}

.md-main--home .md-home-latest {
	margin-top: 0 !important;
}

/*
 * PROJECTS AND TOOLKIT PARENT PAGES SHARE CONTACT'S GREY PAGE BACKGROUND.
 * Contact's grey is main's own background (--md-color-subtle, #f3f3f3 light and
 * #3a3938 dark) on a full-bleed main with no top padding, so it starts at the
 * first-band edge under the header and, with the sticky-footer flex rule above,
 * runs down to the footer on short pages. functions.php adds body.md-page--grey
 * (by slug: contact, projects, toolkit; plus is_search(); plus Impact / Output /
 * Resource singulars), so this block gives those pages and CPT singles the same
 * shell with the same token and the same dark equivalent. Layout offsets are not
 * touched: the page title keeps its own padding and the wrapper keeps its
 * header clearance. Cards sit on top of the grey; the Kenya / UK child pages
 * keep their regional tints and no other page is affected. The password form
 * view uses the same page template, so it is covered too. Contact already
 * matches these values (no visible change there). Main already flex-grows in
 * .wp-site-blocks, so short singles reach the footer on the grey band.
 */
body.md-page--grey main.wp-block-group {
	--md-root-pad-x-start: var(--wp--style--root--padding-left, 1.5rem);
	--md-root-pad-x-end: var(--wp--style--root--padding-right, 1.5rem);
	position: relative;
	left: auto;
	transform: none;
	width: calc(100% + var(--md-root-pad-x-start) + var(--md-root-pad-x-end)) !important;
	max-width: none !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	margin-left: calc(-1 * var(--md-root-pad-x-start));
	margin-right: calc(-1 * var(--md-root-pad-x-end));
	padding-top: 0;
	padding-left: var(--md-root-pad-x-start);
	padding-right: var(--md-root-pad-x-end);
	box-sizing: border-box;
	overflow: visible;
	background: var(--md-color-subtle, #f3f3f3);
}

/* Compact widths: grey shell must not cancel simple-single nav clearance. */
@media (max-width: 1049px) {
	body.md-page--grey main.wp-block-group.md-main--single.md-main--single-simple {
		padding-top: calc(
			var(--md-header-clearance, var(--md-header-height, 5.5rem))
			+ var(--md-header-float-gap, 0.75rem)
			+ var(--md-space, 1.5rem)
		);
	}
}

/* Phone: match the tighter clearance (no extra 1.5rem). */
@media (max-width: 899px) {
	body.md-page--grey main.wp-block-group.md-main--single.md-main--single-simple {
		padding-top: calc(
			var(--md-header-clearance, var(--md-header-height, 5.5rem))
			+ var(--md-header-float-gap, 0.75rem)
		);
	}
}

html[data-md-theme="dark"] body.md-page--grey main.wp-block-group {
	background: var(--md-color-subtle, #3a3938);
}

/*
 * Home "Featured" title only: about 20% smaller than the shared Home section
 * display size. Still an h1; Projects, Latest and page H1s are unchanged.
 * Scales with --md-type-display (and so the fluid type tokens and text-size
 * preference). Phones keep the existing small-screen curve, scaled by the
 * same 0.8 with a 1.7rem floor so it stays comfortably readable.
 */
.md-home-featured__title {
	font-size: calc(var(--md-type-home-display, var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem))) * 0.8);
}

@media (max-width: 899px) {
	.md-home-featured__title {
		font-size: max(1.7rem, calc(min(var(--md-type-home-display, clamp(2.75rem, 5.5vw, 4.25rem)), max(2rem, calc(4.2vw + 0.975rem))) * 0.8));
	}
}


/* ==========================================================================
 * SITE SEARCH (header icon → /?s=, results page with live updates, 404 form)
 *
 * Header control: a 1px line magnifying glass next to the display preferences
 * icon (same box sizes and the same 1px line as the prefs and hamburger icons).
 * It is a plain link to the search page (no overlay). Results sit inside the
 * normal content measure (has-global-padding), not a full-bleed archive band.
 * Cards reuse md-archive__* from camred-core archive-filters.css. Live typing
 * updates via camred/v1/search (assets/js/md-search.js). Markup: header.php,
 * searchform.php, search.php, 404.php, includes/search.php.
 * ========================================================================== */

/* Visually hidden text (was only defined inside some plugin stylesheets). */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* --- Header icon -------------------------------------------------------- */

.md-search-toggle {
	--md-details-font-size: var(--md-text-details, clamp(1.125rem, 0.35vw + 1.05rem, 1.3125rem));
	--md-details-marker: 1.425em;
	--md-details-marker-stroke: 1px;
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	box-sizing: border-box;
	width: 2rem;
	height: 2rem;
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--md-color-contrast, #1c1b1a);
	border-radius: var(--md-radius-pill, 0.25rem);
	font: inherit;
	line-height: 0;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: var(--md-transition-colour), var(--md-transition-fade);
}

.md-search-toggle:hover {
	background: transparent;
	opacity: 0.75;
	text-decoration: none;
}

.md-search-toggle:focus-visible {
	outline: var(--md-focus-outline);
	outline-offset: var(--md-focus-outline-offset);
}

.md-search-toggle__icon {
	display: block;
	flex-shrink: 0;
	width: var(--md-details-marker);
	height: var(--md-details-marker);
	font-size: var(--md-details-font-size);
	overflow: visible;
	pointer-events: none;
	/* Outline lens + handle: 1px currentColor strokes (black in light, light in dark). */
	color: inherit;
}

.md-search-toggle__lens {
	fill: none;
	stroke: currentColor;
	stroke-width: 1;
}

.md-search-toggle__handle {
	fill: none;
	stroke: currentColor;
	stroke-width: 1;
}

/* Compact bar (scrolled, and always at hamburger widths): same 36px box as the prefs button. */
.md-header.is-compact .md-search-toggle {
	width: 2.25rem;
	height: 2.25rem;
}

/*
 * Desktop expanded menu: clear gap between the last nav pill (Contact) and
 * the search icon. Extra margin on the toggle only — tools gap stays so
 * search–prefs spacing is unchanged. Hamburger widths (≤1049) skip this.
 */
@media (min-width: 1050px) {
	.md-header .md-search-toggle {
		margin-left: 1rem;
	}

	/* Desktop: icon is 1.2 x body text, like the prefs icon. */
	.md-header .md-search-toggle__icon {
		width: calc(var(--md-text-body, 1.125rem) * 1.2);
		height: calc(var(--md-text-body, 1.125rem) * 1.2);
	}
}

/* 125% text: hamburger through 1330 — do not inflate hamburger→search gap. */
@media (min-width: 1050px) and (max-width: 1330px) {
	html[data-md-font-scale="1.25"] .md-header .md-search-toggle {
		margin-left: 0;
	}

	/* Same icon order as ≤1049 when the 125% scale forces the hamburger. */
	html[data-md-font-scale="1.25"] .md-header__tools > .md-search-toggle {
		order: 1;
	}

	html[data-md-font-scale="1.25"] .md-header__tools > .md-prefs {
		order: 2;
	}

	html[data-md-font-scale="1.25"] .md-header__tools > .md-header__nav {
		order: 3;
	}
}

/* Phones: 44px tap target, like the hamburger and prefs buttons. */
@media (max-width: 899px) {
	.md-header.md-header .md-search-toggle {
		width: var(--md-mobile-bar-target, 2.75rem);
		height: var(--md-mobile-bar-target, 2.75rem);
	}
}

/* --- Shared form -------------------------------------------------------- */

.md-search-form {
	margin: 0;
	color: var(--md-color-contrast, #1c1b1a);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
}

.md-search-form__label {
	display: block;
	margin: 0 0 0.75rem;
	font-size: var(--md-text-body, 1.125rem);
	font-weight: 400;
	line-height: 1.3;
	color: inherit;
}

.md-search-form__row {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 0.75rem;
	width: 100%;
}

.md-search-form__input {
	appearance: none;
	-webkit-appearance: none;
	flex: 1 1 auto;
	min-width: 0;
	box-sizing: border-box;
	margin: 0;
	border-radius: 0;
	color: inherit;
	font-family: inherit;
	/* Never under 16px, so iOS Safari does not zoom the page on focus. */
	font-size: max(1rem, var(--md-text-h3, clamp(1.3125rem, 1.4vw + 1rem, 1.75rem)));
	line-height: 1.3;
}

.md-search-form__input::-webkit-search-decoration,
.md-search-form__input::-webkit-search-cancel-button {
	-webkit-appearance: none;
	appearance: none;
}

.md-search-form__submit {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	box-sizing: border-box;
	min-height: 3.75rem;
	margin: 0;
	padding: 0.75rem 1.75rem;
	border: 2px solid transparent;
	border-radius: var(--md-radius, 0.5rem);
	background: var(--md-color-contrast, #1c1b1a);
	color: var(--md-color-surface, #fff);
	font-family: inherit;
	font-size: max(1rem, var(--md-text-h3, clamp(1.3125rem, 1.4vw + 1rem, 1.75rem)));
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	cursor: pointer;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-search-form__submit:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-search-form__submit:focus-visible {
	outline: none;
	border-color: var(--md-color-accent, #34f58c);
	box-shadow: none;
	transform: none;
}

html[data-md-theme="dark"] .md-search-form__submit:hover {
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

html[data-md-theme="dark"] .md-search-form__submit:focus-visible {
	border-color: var(--md-color-accent, #34f58c);
	box-shadow: none;
}

/* On the results page and the 404 page: prominent white field on grey. */
.md-search-form--page {
	width: 100%;
	max-width: 100%;
}

.md-search-form--page .md-search-form__row {
	align-items: stretch;
	gap: 0.75rem;
}

.md-search-form--page .md-search-form__input {
	min-height: 3.75rem;
	padding: 0.85rem 1.25rem;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	background: var(--md-color-surface, #fff);
	color: var(--md-color-contrast, #1c1b1a);
	box-shadow: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-search-form--page .md-search-form__input::placeholder {
	/* Darker than browser defaults so the hint stays readable on white. */
	color: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 68%, var(--md-color-surface, #fff));
	opacity: 1;
}

/*
 * Borderless on focus too (Jimmy). Soft lift instead of a border box so
 * keyboard focus is still visible without reading as chrome.
 */
.md-search-form--page .md-search-form__input:focus,
.md-search-form--page .md-search-form__input:focus-visible {
	outline: none;
	border: none;
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
	background: var(--md-color-surface, #fff);
}

html[data-md-theme="dark"] .md-search-form--page .md-search-form__input {
	background: var(--md-color-surface, #1c1b1a);
	border: none;
	color: var(--md-color-contrast, #f3f3f3);
}

html[data-md-theme="dark"] .md-search-form--page .md-search-form__input::placeholder {
	color: color-mix(in srgb, var(--md-color-contrast, #f3f3f3) 68%, var(--md-color-surface, #1c1b1a));
}

html[data-md-theme="dark"] .md-search-form--page .md-search-form__input:focus,
html[data-md-theme="dark"] .md-search-form--page .md-search-form__input:focus-visible {
	border: none;
	outline: none;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
	background: var(--md-color-surface, #1c1b1a);
}

@media (max-width: 600px) {
	.md-search-form__row {
		flex-direction: column;
		align-items: stretch;
	}

	.md-search-form__submit {
		width: 100%;
		min-height: 2.75rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.md-search-toggle,
	.md-search-form__submit {
		transition: none;
	}
}

/* --- Results page and 404 (within content margins; not full-bleed) ----- */

/*
 * Search uses body.md-page--grey (same --md-color-subtle shell as Contact /
 * Projects / Toolkit). Keep the form and card grid on the content measure
 * (has-global-padding), not the archive full-bleed band.
 */
.md-main--search {
	background: transparent;
}

.md-main--search .entry-content.has-global-padding,
.md-main--search .wp-block-post-content.has-global-padding {
	/* Keep root padding — do not zero it the way archive bands do. */
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-left: auto;
	margin-right: auto;
}

.md-search {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0 0 var(--md-space-section, 6rem);
	background: transparent;
}

.md-search__title {
	overflow-wrap: anywhere;
}

.md-search__tools {
	margin: 0 0 var(--md-space-stack, 3rem);
	max-width: 100%;
}

.md-search__status {
	margin: var(--md-space, 1.5rem) 0 0;
	font-size: var(--md-text-body, 1.125rem);
	line-height: var(--md-body-leading, 1.5);
	color: var(--md-color-contrast, #1c1b1a);
}

.md-search__status:empty {
	display: none;
}

.md-search__panel {
	min-width: 0;
}

.md-search__list.md-archive__list {
	width: 100%;
	max-width: 100%;
	margin: 0;
}

.md-search__empty-title,
.md-search__sections-title {
	margin: 0 0 var(--md-space, 1.5rem);
	font-size: var(--md-text-card-title, clamp(1.35rem, 2vw, 1.55rem));
	font-weight: 600;
	line-height: 1.25;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-search__empty-text {
	margin: 0 0 var(--md-space-stack, 3rem);
	font-size: var(--md-text-body, 1.125rem);
	line-height: var(--md-body-leading, 1.5);
}

.md-search__sections-title {
	margin-top: var(--md-space-stack, 3rem);
}

.md-search__empty .md-search__sections-title:first-child,
.md-search__empty .md-search__empty-text + .md-search__sections-title {
	margin-top: 0;
}

.md-search__sections {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin: 0 0 var(--md-space-stack, 3rem);
	padding: 0;
	list-style: none;
}

.md-search__sections li {
	margin: 0;
}

.md-search__section-link {
	display: inline-flex;
	align-items: center;
	box-sizing: border-box;
	min-height: 2.75rem;
	padding: 0.4rem 1.15rem;
	border: 1px solid currentColor;
	border-radius: var(--md-radius, 0.5rem);
	color: var(--md-color-contrast, #1c1b1a);
	font-size: var(--md-text-body, 1.125rem);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-search__section-link:hover,
.md-search__section-link:focus-visible {
	transform: translateY(-1px);
	text-decoration: none;
}

.md-search--404 > p {
	margin: 0 0 var(--md-space, 1.5rem);
	font-size: var(--md-text-body, 1.125rem);
}

/* Pagination as pills (the page band is grey, so the pills are white). */
.md-search .navigation.pagination {
	margin-top: var(--md-space-stack, 3rem);
}

.md-search .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.md-search .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0.35rem 0.85rem;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-surface, #fff);
	color: var(--md-color-contrast, #1c1b1a);
	font-weight: 700;
	text-decoration: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-search .page-numbers.current {
	background: var(--md-color-contrast, #1c1b1a);
	color: var(--md-color-surface, #fff);
}

.md-search .page-numbers.dots {
	background: transparent;
}

.md-search a.page-numbers:hover,
.md-search a.page-numbers:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
	text-decoration: none;
}

html[data-md-theme="dark"] .md-search a.page-numbers:hover,
html[data-md-theme="dark"] .md-search a.page-numbers:focus-visible {
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

@media (prefers-reduced-motion: reduce) {
	.md-search__section-link,
	.md-search .page-numbers,
	.md-search-form--page .md-search-form__input {
		transition: none;
	}

	.md-search__section-link:hover,
	.md-search__section-link:focus-visible,
	.md-search a.page-numbers:hover,
	.md-search a.page-numbers:focus-visible,
	.md-search-form__submit:hover,
	.md-search-form__submit:focus-visible {
		transform: none;
	}
}

/* --- Header fit with the search icon added (1.0.88) -------------------- */

/*
 * The search icon adds ~38px to the tools group. Keep the logo clear of the
 * hamburger / search / prefs cluster on phones, and clear of the first menu
 * item at the start of the desktop band. Tap targets stay at the 44px mobile
 * target; only gaps and the lockup scale down on very narrow widths.
 */

/* Hamburger widths: let the lockup shrink instead of overflowing into tools. */
@media (max-width: 1049px) {
	.md-header.is-compact .md-header__title--logo,
	.md-header.is-compact .md-header__logo-link,
	.md-header.is-compact .md-brand-logo {
		min-width: 0;
		max-width: 100%;
	}

	.md-header.is-compact .md-brand-logo__symbol,
	.md-header.is-compact .md-brand-logo__word {
		flex: 0 1 auto;
		min-width: 0;
	}
}

/* 320–390px: zero tools gap + slightly smaller lockup (buttons stay 44px). */
@media (max-width: 390px) {
	.md-header.md-header .md-header__inner {
		column-gap: 0.5rem;
		gap: 0.5rem;
	}

	.md-header.md-header .md-header__tools,
	.md-header.md-header.is-compact .md-header__tools {
		column-gap: 0;
		gap: 0;
	}

	.md-header.md-header .md-header__brand {
		min-width: 0;
		flex: 1 1 auto;
	}

	.md-header.md-header .md-brand-logo,
	.md-header.md-header.is-compact .md-brand-logo {
		--md-brand-h: clamp(1.05rem, 4.6vw, 1.35rem);
	}

	.md-header.md-header .md-brand-logo__word,
	.md-header.md-header.is-compact .md-brand-logo__word {
		max-width: min(100%, 8.75rem);
	}
}

/*
 * Desktop 1050–1099px: a little less logo height plus tighter nav pills so
 * About clears the wordmark once the search icon is in the tools group.
 */
@media (min-width: 1050px) and (max-width: 1099px) {
	:root {
		--md-logo-height: clamp(1.8rem, 3.4vw, 3.06rem);
	}

	.md-header__nav {
		--md-nav-pill-pad-x: 0.5rem;
		--md-nav-item-gap: 0.2rem;
	}
}

/*
 * 125% text size: rem scales with --md-font-scale, so the full desktop menu
 * overlaps the logo from 1050px through roughly 1330px. Force the hamburger
 * in that band (matches md-sticky-nav.js when scale is 1.25).
 */
@media (min-width: 1050px) and (max-width: 1330px) {
	html[data-md-font-scale="1.25"] .md-header__nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}

	html[data-md-font-scale="1.25"] .md-header__nav .wp-block-navigation__responsive-container-open,
	html[data-md-font-scale="1.25"] .md-header__nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: var(--md-nav-pill-height, 2.25rem);
		height: var(--md-nav-pill-height, 2.25rem);
		flex-shrink: 0;
		padding: 0;
		cursor: pointer;
		border-radius: var(--md-radius-pill, 0.25rem);
		color: var(--md-color-contrast, #1c1b1a) !important;
	}

	html[data-md-font-scale="1.25"] .md-header__nav .wp-block-navigation__responsive-container.is-menu-open {
		display: block !important;
	}
}

/* END SITE SEARCH */

/* ==========================================================================
 * Cookie consent — bottom-centre frosted bar (Option B card radius)
 * ========================================================================== */

.md-cookie-consent {
	position: fixed;
	z-index: 10050;
	/*
	 * Centre with left/right 0 + margin auto, not translateX(-50%). A persistent
	 * transform on this shell (plus frost blur on the inner) softens bold
	 * Inclusive Sans on Accept/Reject vs crisp primary CTAs / nav.
	 */
	left: 0;
	right: 0;
	bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
	width: min(
		calc(
			100% - var(--wp--style--root--padding-left, 1.5rem) - var(--wp--style--root--padding-right, 1.5rem)
		),
		36rem
	);
	margin-inline: auto;
	pointer-events: none;
}

.md-cookie-consent[hidden] {
	display: none !important;
}

/*
 * Frost sheet (.md-cookie-consent__frost) mirrors compact-nav ::before: tint +
 * blur on a dedicated layer; __inner stays transparent so the sheet is visible.
 * Copy/actions sit above with opaque Accept/Reject chips. No opacity/transform
 * animation on ancestors (those suppress backdrop-filter).
 */
.md-cookie-consent__inner {
	position: relative;
	pointer-events: auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1rem;
	padding: 0.65rem 0.75rem 0.65rem 1.1rem;
	border-radius: var(--md-radius, 0.5rem);
	color: var(--md-color-contrast, #1c1b1a);
	background-color: transparent;
	background: transparent;
	overflow: visible;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-text-small, 0.875rem);
	line-height: 1.35;
}

.md-cookie-consent__frost {
	position: absolute;
	inset: 0;
	z-index: 0;
	border-radius: inherit;
	/* Same tokens as .md-header.is-compact .md-header__inner::before */
	background-color: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	background: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	pointer-events: none;
}

.md-cookie-consent__inner > :not(.md-cookie-consent__frost) {
	position: relative;
	z-index: 1;
}

.md-cookie-consent__copy {
	margin: 0;
	flex: 1 1 10rem;
	min-width: 0;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-cookie-consent__link {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.md-cookie-consent__link:hover {
	opacity: 0.7;
}

.md-cookie-consent__actions {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.4rem;
	flex: 0 0 auto;
}

/* Equal-weight Accept / Reject — filled like .md-meta__button / .wp-block-button__link */
.md-cookie-consent__btn {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	isolation: isolate;
	min-width: 5.5rem;
	min-height: 44px;
	padding: 0.45rem 1rem;
	margin: 0;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	/* Opaque chip so 700 type paints above the frost sheet, not inside it. */
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-text-small, 0.875rem);
	font-style: normal;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	cursor: pointer;
	box-shadow: none;
	transition: var(--md-transition-lift), var(--md-transition-colour);
}

.md-cookie-consent__btn:hover {
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-cookie-consent__btn:focus-visible {
	outline: var(--md-focus-outline);
	outline-offset: var(--md-focus-outline-offset, 2px);
}

html[data-md-theme="dark"] .md-cookie-consent__inner {
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}

/* Keep filled white + dark type on the frost shell (surface fill would vanish). */
html[data-md-theme="dark"] .md-cookie-consent__btn {
	background: #fff;
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-cookie-consent__btn:hover {
	background: #fff;
	color: #1c1b1a;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

@media (max-width: 480px) {
	/*
	 * Column stack: the desktop copy rule `flex: 1 1 10rem` becomes a 10rem
	 * *height* basis (~160px empty gap). Hug content; keep desktop row intact.
	 */
	.md-cookie-consent__inner {
		border-radius: var(--md-radius, 0.5rem);
		padding: 0.75rem 0.9rem;
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0.75rem;
		height: auto;
		min-height: 0;
		text-align: center;
	}

	.md-cookie-consent__copy {
		flex: 0 1 auto;
		width: 100%;
	}

	.md-cookie-consent__actions {
		justify-content: stretch;
		width: 100%;
		flex: 0 0 auto;
	}

	.md-cookie-consent__btn {
		flex: 1 1 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.md-cookie-consent__btn:hover {
		transform: none;
		box-shadow: none;
	}
}

/* END COOKIE CONSENT */