/**
 * Global chrome (header + footer) — pixel-matched to live enactpartnership.org.
 * Measured from live computed styles (desktop 1440): header = static white bar
 * h96, logo 220x73 at x0, nav Helvetica 16/500 #222 pad 13/12, EN switcher,
 * orange Dashboard button 15/30, search icon; footer = teal #00747A bands.
 * @package astra-child
 */

/* =========================================================
   HEADER — static white bar (live header is NOT sticky)
   ========================================================= */
#masthead { background: #ffffff; }
#masthead .ast-primary-header-bar,
#masthead .ast-mobile-header-wrap .ast-primary-header-bar {
	background: transparent;
	border: none;
}
/* bar height 96 (live container h=96, logo y=11..84) */
#masthead .ast-primary-header-bar { min-height: 96px; }
#masthead .ast-primary-header-bar .site-primary-header-wrap { min-height: 96px; }
/* client request 2026-08-05: full-bleed header — logo far left, language
   switcher + search far right, nav truly centered in the viewport */
#masthead .ast-container {
	max-width: 100% !important;
	padding-left: 20px !important;
	padding-right: 20px !important;
}

/* logo: live 220x73 desktop, ~160/150 below */
@media (min-width: 1024px) {
	#masthead .custom-logo-link img,
	#masthead .custom-logo {
		width: 220px !important;
		max-width: 220px !important;
		height: auto !important;
	}
}
@media (max-width: 1023.9px) {
	#masthead .custom-logo-link img,
	#masthead .custom-logo { width: 160px !important; height: auto !important; }
}
@media (max-width: 767.9px) {
	#masthead .custom-logo-link img,
	#masthead .custom-logo { width: 150px !important; }
}
#masthead .site-branding { padding: 0; }

/* menu sits right of the logo with a 20px gap (live nav x=240) */
#masthead .site-header-primary-section-left > .ast-builder-menu-1 { margin-left: 20px; }

/* menu typography (live: Helvetica 500 16px #222, padding 13/12, no transform) */
#masthead .main-header-menu a,
#masthead .ast-nav-menu a,
#masthead .menu-item a {
	text-transform: none !important;
	font-family: Helvetica, Verdana, Arial, sans-serif !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	color: #222222 !important;
	line-height: 20px;
}
#masthead .main-header-menu > .menu-item > .menu-link {
	padding: 13px 12px !important;
	white-space: nowrap;
	position: relative;
}
#masthead .main-header-menu { flex-wrap: nowrap !important; }
/* nav truly centered in the viewport (client request 2026-08-05) */
@media (min-width: 922px) {
	#masthead .ast-primary-header-bar { position: relative; }
	#masthead .site-header-primary-section-left .ast-builder-menu {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		/* the 20px gap rule above still applies to this element, and on an
		   absolutely-positioned box it shifts the centred menu to the right */
		margin-left: 0;
		/* Astra gives this wrapper padding-left:10px and padding-right:0, which
		   lands the menu 5px right of centre once the box itself is centred */
		padding-left: 0;
		padding-right: 0;
	}
	/* the ul carries Astra's own inline-flex padding; zero it so the visible
	   items centre on the viewport rather than the ul's padded box */
	#masthead .site-header-primary-section-left .ast-builder-menu .main-header-menu {
		padding-left: 0;
		padding-right: 0;
		margin-left: 0;
		margin-right: 0;
	}
}
#masthead .menu-item > .menu-link:hover { color: #00747A !important; }
/* live Elementor pointer: underline on hover/active */
#masthead .main-header-menu > .menu-item > .menu-link::after {
	content: "";
	position: absolute;
	left: 12px; right: 12px; bottom: 8px;
	height: 2px;
	background: #00747A;
	transform: scaleX(0);
	transition: transform .2s ease;
}
#masthead .main-header-menu > .menu-item:hover > .menu-link::after,
#masthead .main-header-menu > .current-menu-item > .menu-link::after,
#masthead .main-header-menu > .current-menu-ancestor > .menu-link::after {
	transform: scaleX(1);
}
/* the Dashboard menu item is a dedicated button on desktop (live hides the li) */
@media (min-width: 922px) {
	#masthead .main-header-menu > .menu-item a[href*="/dashboard"] { display: none; }
	/* hide the whole li, or its empty box skews the centered menu ~25px right */
	#masthead .main-header-menu > .menu-item:has(> a[href*="/dashboard"]) { display: none; }
}
/* dropdown submenu: solid white */
#masthead .main-header-menu .sub-menu { background: #ffffff; }

/* right-section spacing: [EN] 20px [Dashboard] 20px [search] (live: 945|1020|1178) */
#masthead .site-header-primary-section-right > .ast-builder-layout-element { margin-left: 20px; }
/* breathing room between switcher and search icon (client: "squashed") */
#masthead .site-header-primary-section-right .header-widget-area { margin-right: 18px; }

/* TranslatePress switcher: live = plain "EN ⌄" text, no box */
#masthead .header-widget-area { padding: 0; }
#masthead .header-widget-area .widget { margin: 0; }
#masthead .header-widget-area p { margin: 0; }
#masthead .trp-language-switcher {
	background: transparent !important;
	border: none !important;
}
#masthead .trp-language-switcher > div {
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	padding: 0 !important;
}
#masthead .trp-flag-image { display: none !important; }
#masthead .trp-language-switcher a {
	text-transform: uppercase;
	font-family: Helvetica, Verdana, Arial, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #374151 !important;
	background: transparent;
	padding: 2px 4px !important;
}
#masthead .trp-language-switcher .trp-ls-shortcode-current-language a::after {
	content: "";
	display: inline-block;
	margin-left: 6px;
	width: 7px; height: 7px;
	border-right: 1.5px solid #64748b;
	border-bottom: 1.5px solid #64748b;
	transform: rotate(45deg) translateY(-3px);
}
#masthead .trp-language-switcher .trp-ls-shortcode-language {
	background: #fff !important;
	box-shadow: 0 2px 8px rgba(0,0,0,.12);
}

/* TRP 3.2 v2 shortcode switcher (the rules above target the old v1 markup):
   match live — 16px uppercase #374151 text, no pill, white dropdown card.
   TRP writes its --vars INLINE on the wrapper, so overrides need !important. */
.trp-shortcode-switcher__wrapper {
	--text: #374151 !important;
	--text-hover: #00747A !important;
	--bg: transparent !important;
	--bg-hover: transparent !important;
	--border: none !important;
	--border-width: 0px !important;
	--border-radius: 0px !important;
	--font-size: 16px !important;
}
.trp-shortcode-switcher .trp-language-item-name {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-weight: 400;
	text-transform: uppercase;
}
.trp-shortcode-switcher .trp-shortcode-arrow { color: #64748b; }
/* the open dropdown panel renders with background:var(--bg) → force white card */
.trp-shortcode-switcher .trp-switcher-dropdown-list,
.trp-shortcode-overlay .trp-switcher-dropdown-list,
.trp-switcher-dropdown-list {
	background: #fff !important;
	box-shadow: 0 2px 10px rgba(0,0,0,.15);
	border-radius: 0 !important;
	padding: 4px 0 !important;
	margin-top: 2px;
}
.trp-switcher-dropdown-list .trp-language-item {
	padding: 6px 14px !important;
	background: #fff !important;
	border: none !important;
}
.trp-switcher-dropdown-list .trp-language-item:hover { background: #f2f6f7 !important; }

/* ---- search popup (replaces Astra slide-search; matches live Elementor popup:
   input 40px #475569 border r5, orange Search button, suggestions dropdown) ---- */
.enact-search-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.68);
	z-index: 99999;
}
.enact-search-modal {
	width: 640px;
	max-width: 92vw;
	margin: 120px auto 0;
	background: #fff;
	padding: 20px;
	box-sizing: border-box;
}
.enact-search-form { display: flex; gap: 12px; }
.enact-search-field { position: relative; flex: 1; }
.enact-search-field input[type=search] {
	width: 100%;
	height: 40px;
	border: 1px solid #475569;
	border-radius: 5px;
	padding: 12px 40px 12px 16px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 16px;
	color: #475569;
	background: #fff;
	box-sizing: border-box;
	outline: none;
}
.enact-search-field > svg {
	position: absolute;
	right: 13px;
	top: 12px;
	color: #9ca3af;
	pointer-events: none;
}
.enact-search-btn {
	background: #E98300;
	color: #fff;
	border: none;
	border-radius: 5px;
	height: 40px;
	padding: 0 30px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}
.enact-search-btn:hover { background: #00747A; }
.enact-search-results {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	background: #fff;
	box-shadow: 0 8px 18px rgba(0,0,0,.18);
	max-height: 300px;
	overflow-y: auto;
	z-index: 2;
}
.enact-search-results li { border-bottom: 1px solid #e5e5e5; }
.enact-search-results li:last-child { border-bottom: none; }
.enact-search-results a {
	display: block;
	padding: 14px 16px;
	font-family: 'IBM Plex Serif', serif;
	font-size: 17px;
	line-height: 1.35;
	color: #0274be;
	text-decoration: none;
}
.enact-search-results a:hover { background: #f4f8f9; }

/* Dashboard button hidden per client request 2026-07-16 (delete this rule to restore) */
#masthead .ast-header-button-1 { display: none !important; }

/* Dashboard button: exact live styles (orange #E98300, square, 15/30) */
#masthead .ast-header-button-1 .ast-custom-button {
	background: #E98300;
	color: #fff;
	border-radius: 0;
	padding: 15px 30px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
}
#masthead .ast-header-button-1 .ast-custom-button:hover { background: #00747A; color: #fff; }

/* search dropdown field: plain white box like live SearchWP input */
#masthead .ast-search-menu-icon .search-form,
#masthead .ast-search-menu-icon.ast-dropdown-active .search-form {
	background: #fff;
	border: 1px solid #c9c9c9 !important;
	border-radius: 3px;
	box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
#masthead .ast-search-menu-icon .search-field,
#masthead .ast-search-menu-icon .search-field:focus {
	background: #fff;
	border: none !important;
	outline: none;
	box-shadow: none;
}

/* search icon (live: 15px dark) */
#masthead .astra-search-icon { color: #222; font-size: 16px; }
#masthead .ast-header-search { position: relative; }
#masthead .ast-search-menu-icon .search-form { top: 56px; right: 0; }

/* mobile trigger: plain dark ☰ */
#masthead .menu-toggle,
#masthead .ast-mobile-menu-trigger-minimal,
#masthead .ast-mobile-menu-trigger-outline,
#masthead .ast-mobile-menu-trigger-fill {
	background: transparent !important;
	border: none !important;
	color: #222 !important;
	font-size: 24px;
	padding: 0 !important;
}
#ast-mobile-header .ast-container { padding-left: 15px !important; padding-right: 20px !important; }
#ast-mobile-header .site-header-primary-section-right > * { margin-left: 16px; }

/* =========================================================
   FOOTER — native reproduction of live Elementor footer #7430
   teal #00747A: [logo|mail|subscribe ┃ partner logos] / [rule,
   Follow us + social | copyright]
   ========================================================= */
/* hide the Astra builder footer entirely */
#colophon { display: none !important; }

/* body text: live Astra palette color #364151 (staging has no palette set,
   Astra default #334155 was 3 units off live) */
body { color: #364151; }

.enact-footer {
	background: #00747A;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	color: #fff;
}
.enact-footer__inner {
	max-width: 1280px;
	margin: 0 auto;
}

/* --- main band: brand col | partners col (live: inner 1280 @ x65, divider x514,
   logos 578..1335 center dy≈182, rule dy≈352, band+meta 479 total) --- */
.enact-footer__main { padding: 30px 50px 20px 20px; box-sizing: border-box; min-height: 333px; display: flex; flex-direction: column; justify-content: flex-start; }
.enact-footer__main .enact-footer__inner {
	width: 100%; /* column-flex parent: without this, margin:0 auto shrinks it to fit-content (1156px, was 62px off live) */
	display: flex;
	align-items: stretch;
}
.enact-footer__brand {
	flex: 0 0 448px;
	text-align: center;
	padding-right: 40px;
	border-right: 1px solid rgba(255,255,255,.78);
	box-sizing: border-box;
}
.enact-footer__logo {
	width: 350px; max-width: 100%; height: auto;
	margin: 30px auto 0;
	filter: brightness(0) invert(1);
	display: inline-block;
}
.enact-footer__mail { margin: 35px 0 0; }
.enact-footer__mail a {
	color: #fff;
	font-size: 19.2px;
	text-decoration: none;
}
.enact-footer__mail a:hover { text-decoration: underline; }
.enact-footer__signup {
	display: block;
	background: #fff;
	color: #222 !important;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	padding: 10px;
	margin: 30px auto 0;
	max-width: 363px;
	text-align: center;
	text-decoration: none;
}
.enact-footer__signup:hover { background: #f0f6f6; }

/* partner logos: single row [moe 64 | bmukn 220 | iucn 64 | danida 196],
   all rendered white via filter (live crop: x 577..1335, vertically centered) */
.enact-footer__partners {
	flex: 1 1 65%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 38px 10px 0 64px; /* live logo-row center dy≈182 */
	box-sizing: border-box;
}
.enact-footer__partners-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
}
.enact-plogo { height: auto; filter: brightness(0) invert(1); }
.enact-plogo--moe    { width: 78px; }
.enact-plogo--bmukn  { width: 268px; }
.enact-plogo--iucn   { width: 78px; }
.enact-plogo--danida { width: 238px; }

/* --- meta band: h≈101, rule + follow/social | copyright --- */
.enact-footer__meta { padding: 10px 70px 0 50px; min-height: 91px; }
.enact-footer__rule {
	border: none;
	border-top: 1px solid rgba(255,255,255,.78);
	margin: 10px 0 0;
}
.enact-footer__metarow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 0 60px; /* live: ~86px below Follow-us top to page end */
}
.enact-footer__social { display: flex; align-items: center; }
.enact-footer__followlabel {
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	margin-right: 30px;
}
.enact-footer__social a {
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 50px; height: 50px;
	border-radius: 10%;
	margin-right: 10px;
}
.enact-footer__social a:last-child { margin-right: 0; }
.enact-footer__social svg { display: block; }
.enact-footer__copyright {
	font-size: 12.8px;
	color: #fff;
}

/* tablet: live KEEPS the desktop two-column footer, just compressed (~0.55×) */
@media (max-width: 1023.9px) {
	.enact-footer__brand { flex: 0 0 35%; }
	.enact-footer__logo { width: 162px; margin-top: 20px; }
	.enact-footer__mail { margin-top: 20px; }
	.enact-footer__mail a { font-size: 14px; }
	.enact-footer__signup { max-width: 180px; font-size: 13px; margin-top: 20px; }
	.enact-footer__partners { padding: 20px 10px 0 30px; }
	.enact-footer__partners-row { gap: 16px; }
	.enact-plogo--moe    { width: 40px; }
	.enact-plogo--bmukn  { width: 134px; }
	.enact-plogo--iucn   { width: 40px; }
	.enact-plogo--danida { width: 120px; }
}
/* mobile: stacked + centered, partner logos row ABOVE the brand block (live order) */
@media (max-width: 767.9px) {
	.enact-footer__main { padding: 30px 20px 20px; }
	.enact-footer__main .enact-footer__inner { flex-direction: column; }
	.enact-footer__brand { flex: 0 0 auto; border-right: none; padding-right: 0; }
	.enact-footer__partners { order: -1; padding: 0; }
	.enact-footer__logo { width: 220px; margin-top: 30px; }
	.enact-footer__mail a { font-size: 16px; }
	.enact-footer__signup { max-width: 300px; font-size: 14px; }
	.enact-footer__partners-row { flex-wrap: nowrap; justify-content: center; gap: 12px; }
	.enact-plogo--moe    { width: 46px; }
	.enact-plogo--bmukn  { width: 144px; }
	.enact-plogo--iucn   { width: 46px; }
	.enact-plogo--danida { width: 132px; }
	.enact-footer__meta { padding: 10px 20px 0; }
	.enact-footer__metarow { flex-direction: column; gap: 14px; }
}
/* live header OVERLAYS the page on desktop: absolute bar, white @ .85 opacity
   (Elementor ::before) — heroes/cards show faintly through it. Content on
   pages without a hero gets 96px top padding to clear the floating bar. */
@media (min-width: 1024px) {
	#masthead {
		position: fixed;          /* was absolute — prod's header is sticky on every page */
		top: 0; left: 0; right: 0;
		z-index: 30;
		background: transparent;
	}
	#masthead .ast-primary-header-bar {
		background: rgba(255,255,255,.85) !important;
		box-shadow: none;
	}
	#content { padding-top: 96px; }
	/* any layout that clears the fixed header itself must not get it twice */
	#content:has(.enact-pagehero), #content:has(.enact-hero),
	#content:has(.enact-newshero), #content:has(.enact-newsfit), #content:has(.enact-newshead),
	body.blog #content, body.archive #content { padding-top: 0; }
}

/* mobile/tablet header: live bar is 60px (Astra default was 96) with a 170px logo */
@media (max-width: 921.9px) {
	#masthead .ast-primary-header-bar { min-height: 60px; }
	#masthead .site-branding img, #masthead .site-logo-img img { max-width: 170px; height: auto; }
}

/* --- newsletter modal (hidden by default — no pixel impact) --- */
/* --- newsletter: non-blocking slide-up panel (bottom-right desktop,
   full-width sheet on mobile). Never overlays the page content flow;
   no backdrop, no focus trap, no scroll lock. --- */
.enact-nl {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 9998;
	width: 360px;
	max-width: calc(100vw - 40px);
	box-sizing: border-box;
	background: #00747A;
	color: #fff;
	padding: 26px 28px 22px;
	border-radius: 6px;
	box-shadow: 0 12px 34px rgba(0,0,0,.28);
	transform: translateY(calc(100% + 40px));
	opacity: 0;
	visibility: hidden;
	transition: transform .45s cubic-bezier(.16,.84,.44,1), opacity .35s ease, visibility 0s linear .45s;
}
.enact-nl[data-state="shown"] {
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
	transition: transform .45s cubic-bezier(.16,.84,.44,1), opacity .35s ease, visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
	.enact-nl { transition: opacity .2s ease, visibility 0s linear .2s; transform: none; }
	.enact-nl[data-state="shown"] { transition: opacity .2s ease, visibility 0s; transform: none; }
}
.enact-nl__close {
	position: absolute;
	top: 8px; right: 8px;
	width: 30px; height: 30px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	padding: 0;
	opacity: .8;
}
.enact-nl__close:hover { opacity: 1; background: rgba(255,255,255,.15); }
.enact-nl__close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.enact-nl__title {
	font-family: 'IBM Plex Serif', serif;
	font-weight: 300;
	font-size: 22px;
	line-height: 1.25;
	color: #fff;
	margin: 0 26px 8px 0;
}
.enact-nl__text {
	font-size: 14px;
	line-height: 1.5;
	color: rgba(255,255,255,.9);
	margin: 0 0 16px;
}
/* MC4WP fields: stacked pills, matching the footer signup button */
.enact-nl__form input[type=email],
.enact-nl__form input[type=text] {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 16px;
	margin: 0 0 10px;
	border: none;
	border-radius: 18px;
	font-size: 14px;
}
.enact-nl__form input[type=submit],
.enact-nl__form button[type=submit] {
	width: 100%;
	background: #fff;
	color: #00747A;
	border: none;
	border-radius: 18px;
	padding: 11px 24px;
	margin-top: 2px;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .4px;
	text-transform: uppercase;
	cursor: pointer;
}
.enact-nl__form input[type=submit]:hover,
.enact-nl__form button[type=submit]:hover { background: #eaf4f4; }
.enact-nl__form label { display: block; }
.enact-nl__form .mc4wp-alert { font-size: 13px; margin-top: 8px; }
.enact-nl__form .mc4wp-success { color: #d8f5d0; }
.enact-nl__form .mc4wp-error { color: #ffd7d7; }
.enact-nl__form p { margin: 0; }

@media (max-width: 767.9px) {
	/* full-width sheet flush to the bottom edge on phones */
	.enact-nl {
		right: 0; bottom: 0; left: 0;
		width: auto;
		max-width: none;
		border-radius: 12px 12px 0 0;
		padding: 22px 20px 18px;
	}
	.enact-nl__title { font-size: 20px; }
}

/* --- TranslatePress 3.2.x (new markup): match production "EN ⌄" text switcher --- */
.trp-floating-switcher { display: none !important; }  /* no floater on live */
#masthead .trp-shortcode-switcher { background: transparent !important; border: none !important; }
#masthead .trp-shortcode-switcher .trp-language-item {
	font-family: Helvetica, Verdana, Arial, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #374151 !important;
	text-transform: uppercase;
	background: transparent;
}
#masthead .trp-language-switcher-inner { box-shadow: 0 2px 8px rgba(0,0,0,.12); background: #fff; }

/* footer legal links (privacy + cookie settings) sit beside the copyright */
.enact-footer__legal {
	color: #fff;
	font-size: 12.8px;
	text-decoration: none;
	margin-right: 18px;
	opacity: .92;
	border-bottom: 1px solid rgba(255,255,255,.45);
}
.enact-footer__legal:hover { opacity: 1; border-bottom-color: #fff; }
@media (max-width: 767.9px) {
	.enact-footer__copyright { display: flex; flex-wrap: wrap; gap: 8px 14px; justify-content: center; }
	.enact-footer__legal { margin-right: 0; }
}

/* =========================================================
   STICKY HEADER — production keeps the whole header pinned on
   every page (Elementor sticky:top on the header container).
   Desktop is `fixed` in the overlay block above; tablet/mobile
   pin here, where the bar is opaque rather than overlaying.
   ========================================================= */
@media (max-width: 1023.9px) {
	#masthead {
		position: sticky;
		top: 0;
		z-index: 30;
		background: #fff;
	}
	/* Astra's own mobile wrapper must not clip the sticky bar */
	#masthead .ast-mobile-header-wrap { background: #fff; }
}
/* a hairline once scrolled, so the bar separates from content behind it */
#masthead::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: rgba(0,0,0,.10);
	opacity: 0;
	transition: opacity .25s ease;
	pointer-events: none;
}
body.enact-scrolled #masthead::after { opacity: 1; }
@media (min-width: 1024px) {
	/* the overlay bar gains a touch more solidity once it is floating over content */
	body.enact-scrolled #masthead .ast-primary-header-bar {
		background: rgba(255,255,255,.96) !important;
		box-shadow: 0 2px 10px rgba(0,0,0,.06);
	}
}