/*
 * Theme Name: 321 Child Theme
 * Theme URI: https://www.321webmarketing.com/
 * Author: 321 Web Marketing
 * Author URI: https://www.321webmarketing.com/
 * Description: 321 inspired child theme for the Genesis Framework.
 * Version: 1.0.01
 * License: GPL-3.0-or-later
 * License URI: http://www.gnu.org/licenses/gpl-3.0.html
 * Text Domain: tto-child
 * Domain Path: /languages
 * Template: genesis
 */

@charset 'UTF-8';

/* ## Custom Theme CSS
--------------------------------------------- */

/* =====================================================================
   Composition helpers for REUSED parent blocks
   ===================================================================== */
/* Milestone stats band: tto-success-numbers restyled into the green double-frame panel */
.cmcf-stats-band.success-numbers {
	background: var(--cmcf-primary);
	padding: 0 20px;
	min-height: 269px;
	margin-bottom: 77px;
	/* full-bleed green band behind the framed panel (+77px strip below) */
	box-shadow: 0 0 0 100vmax var(--cmcf-primary);
	clip-path: inset(0 -100vmax -77px -100vmax);
	display: flex;
	flex-wrap: nowrap;     /* parent wraps; keep one row */
	align-items: stretch;  /* parent centers → misaligned number baselines */
	justify-content: center;
	gap: 0;
	position: relative;
	border: 4px solid var(--cmcf-white);
	margin-inline: var(--cmcf-page-padding);
	max-width: var(--cmcf-container);
	margin-left: auto; margin-right: auto;
}
.cmcf-stats-band.success-numbers::before {
	content: "";
	position: absolute;
	inset: 16px;
	border: 4px solid var(--cmcf-white);
	background: var(--cmcf-frost); /* design: inner panel has a frosted fill */
	pointer-events: none;
}
.cmcf-stats-band .success-number { position: relative; z-index: 1; }
.cmcf-stats-band .success-number {
	flex: 1 1 0;
	max-width: none;      /* parent caps at max(150px, 100%/6) */
	text-align: center;
	padding: 40px 20px;
}
/* short center-height dividers per design (not full column) */
.cmcf-stats-band .success-number:not(:last-child)::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 134px;
	width: 1px;
	background: rgba(171,214,125,0.7);
}
.cmcf-stats-band .number-wrap {
	font-family: var(--cmcf-font-heading);
	font-weight: 600;
	font-size: var(--cmcf-fs-stat);
	color: var(--cmcf-white);
	display: block;
	white-space: nowrap;
	line-height: 1.5;
}
.cmcf-stats-band .number-wrap span { display: inline; font-size: inherit; }
.cmcf-stats-band .success-number p { margin: 0; }
.cmcf-stats-band .success-number p { display: block; }
.cmcf-stats-band .label {
	display: block;
	max-width: 340px;
	margin-inline: auto;
	font-family: var(--cmcf-font-heading);
	font-weight: 600;
	font-size: 18px;
	color: var(--cmcf-white);
	margin-top: 8px;
}

/* Stats band intro (eyebrow + heading above the framed panel, same green band) */
.cmcf-stats-intro {
	background: var(--cmcf-primary);
	text-align: center;
	padding: 76px var(--cmcf-page-padding) 62px;
	margin: 0;
}
.cmcf-stats-intro .cmcf-eyebrow { color: var(--cmcf-accent); margin: 0 0 4px; }
.cmcf-stats-intro h2 { color: var(--cmcf-white); font-size: var(--cmcf-fs-h1); margin: 0; }
.cmcf-stats-intro p.cmcf-stats-sub { color: var(--cmcf-white); margin: 12px 0 0; }

/* Success-stories band on lime (home) — panel variant styles live in
   blocks/tto-profile-selector/_block.css (must load after the block base). */
.cmcf-stories-lime.profile-selector {
	background: var(--cmcf-secondary);
	padding: var(--cmcf-section-pad) var(--cmcf-page-padding);
}

/* =====================================================================
   Chrome: header / nav / footer
   ===================================================================== */
/* Design content box = 1240 @ 1440 (x=100). The parent sizes every .wrap with
   --theme-wrap-width: 95% capped at --theme-wrap-max-width: 1300px — retune the
   theme variables to the design box so ALL wraps share one left edge (x=100). */
:root {
	--theme-wrap-width: 100%;
	--theme-wrap-max-width: min(1440px, 100vw);
}
.wrap { padding-inline: var(--cmcf-page-padding); }
.site-header > .wrap,
.cmcf-subnav .wrap {
	max-width: calc(var(--cmcf-container) + 2 * var(--cmcf-page-padding)) !important;
	margin-inline: auto;
	padding-inline: var(--cmcf-page-padding) !important;
}
/* Genesis wraps my custom footer in .site-footer > .wrap — neutralize the cap,
   the footer manages its own container. */
.site-footer > .wrap { max-width: none !important; padding: 0 !important; }

.site-header { background: var(--cmcf-white); }
@media (min-width: 981px) {
	.site-header > .wrap {
		/* logo left (both rows) | utility top-right / nav bottom-right */
		display: grid !important;
		grid-template-columns: auto 1fr;
		grid-template-rows: auto auto;
		align-items: center;
		column-gap: 40px;
		padding-block: 12px;
	}
	.site-header > .wrap > .title-area { grid-column: 1; grid-row: 1 / 3; margin: 0; }
	.site-header > .wrap > .cmcf-utility { grid-column: 2; grid-row: 1; }
	.site-header > .wrap > .nav-primary { grid-column: 2; grid-row: 2; width: 100%; }
	.site-header > .wrap > .menu-toggle,
	.site-header > .wrap > .sub-menu-toggle { display: none; }
}
.title-area .custom-logo-link { display: inline-block; }
.title-area img.custom-logo { max-width: 242px; height: auto; }

/* Utility donate link (top-right above nav) */
.cmcf-utility { background: var(--cmcf-white); }
.cmcf-utility .wrap { display: flex; justify-content: flex-end; padding: 0; max-width: none; margin: 0 0 12px; }
.cmcf-utility--link {
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: 14.4px;
	color: var(--cmcf-primary);
	text-decoration: none;
	border-bottom: 1px solid var(--cmcf-primary);
	padding-bottom: 4px;
	display: inline-flex;
	gap: 8px;
	align-items: center;
}
.cmcf-utility--link i { font-size: 0.75em; }

/* Primary nav: right-aligned, green uppercase, active-item box */
.nav-primary { background: var(--cmcf-white); }
@media (min-width: 981px) {
	.nav-primary > .wrap { display: block; padding: 0; max-width: none; margin: 0; }
	.nav-primary .menu {
		display: flex !important;
		flex-wrap: nowrap;
		justify-content: flex-end;
		gap: 44px;
		align-items: center;
		font-family: var(--cmcf-font-body);
		margin: 0;
		padding: 0;
	}
}
.nav-primary .menu-item { position: relative; list-style: none; }
.nav-primary .menu-item > a {
	font-weight: 600;
	font-size: var(--cmcf-fs-nav, 16px);
	text-transform: uppercase;
	color: var(--cmcf-primary);
	letter-spacing: 0.01em;
	text-decoration: none;
}
.nav-primary .current-menu-item > a,
.nav-primary .current-menu-ancestor > a {
	border: 2px solid var(--cmcf-secondary);
	padding: 8px 12px;
}
/* Dropdown panels */
.nav-primary .sub-menu {
	background: var(--cmcf-white);
	box-shadow: 0 8px 24px rgba(0,0,0,0.12);
	padding: 8px 0;
	min-width: 240px;
}
.nav-primary .sub-menu a { text-transform: none; font-weight: 500; padding: 8px 18px; }

/* Section sub-nav — sits under its parent primary-nav item per the design:
   About items start ~x567 (under ABOUT); Scholars items end at the right edge. */
.cmcf-subnav { background: var(--cmcf-white); }
.cmcf-subnav .wrap { display: flex; justify-content: flex-end; gap: 32px; padding-bottom: 12px; }
@media (min-width: 981px) {
	.cmcf-subnav--about .wrap {
		justify-content: flex-start;
		padding-left: calc(var(--cmcf-page-padding) + 467px) !important;
	}
}
.cmcf-subnav--item {
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: 14px;
	color: var(--cmcf-primary);
	text-decoration: none;
	padding-bottom: 4px;
}
.cmcf-subnav--item.is-active { border-bottom: 2px solid var(--cmcf-secondary); }

/* Footer */
.site-footer { background: var(--cmcf-primary); padding: 0; }
.cmcf-footer { background: var(--cmcf-primary); color: var(--cmcf-white); padding-block: 80px; }
.cmcf-footer--inner {
	max-width: calc(var(--cmcf-container) + 2 * var(--cmcf-page-padding));
	margin-inline: auto;
	padding-inline: var(--cmcf-page-padding);
}
.cmcf-footer--cols {
	display: grid;
	grid-template-columns: 1.3fr 1fr 1fr 1.5fr 1fr;
	gap: 24px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--cmcf-accent);
}
.cmcf-footer--col-head,
.cmcf-footer--sub-head {
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: 16px;
	text-transform: uppercase;
	color: var(--cmcf-white);
	margin: 0 0 16px;
	display: inline-block;
	padding-bottom: 4px;
	border-bottom: 1px solid var(--cmcf-accent);
}
.cmcf-footer--col ul { list-style: none; margin: 0; padding: 0; }
.cmcf-footer--col li { list-style: none; }
.cmcf-footer--col li::marker { content: none; }
.cmcf-footer--col li { margin-bottom: 8px; }
.cmcf-footer--col a,
.cmcf-footer--contact a { color: var(--cmcf-white); text-decoration: none; font-size: 14.4px; }
.cmcf-footer--col a:hover { color: var(--cmcf-accent); }

.cmcf-footer--mid {
	display: grid;
	grid-template-columns: 1fr 1.5fr;
	gap: 44px;
	padding-block: 32px;
	border-bottom: 1px solid var(--cmcf-accent);
	position: relative;
}
.cmcf-footer--sub-head { color: var(--cmcf-accent); border-color: var(--cmcf-white); }
.cmcf-footer--contact a.cmcf-footer--email { display: block; color: var(--cmcf-accent) !important; font-size: 22px; margin-bottom: 12px; }
.cmcf-footer--line { margin: 4px 0; font-size: 14.4px; }
.cmcf-footer--line span { color: var(--cmcf-accent); }
.cmcf-footer--cmo { position: relative; }
.cmcf-footer--donate { position: absolute; top: 0; right: 0; }
.cmcf-footer--blurb { font-size: 13.6px; line-height: 1.4; margin-top: 12px; }

.cmcf-footer--bottom {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding-top: 32px;
}
.cmcf-footer--logo { max-width: 167px; height: auto; }
.cmcf-footer--legal { text-align: right; font-size: 11.2px; color: rgba(255,255,255,0.6); }
.cmcf-footer--legal a { color: rgba(255,255,255,0.6); text-decoration: none; }
.cmcf-footer--legal span { color: var(--cmcf-accent); }

@media (max-width: 980px) {
	.cmcf-footer--cols { grid-template-columns: 1fr 1fr; }
	.cmcf-footer--mid { grid-template-columns: 1fr; }
	.cmcf-footer--donate { position: static; margin-bottom: 16px; }
	.nav-primary .menu { gap: 20px; flex-wrap: wrap; }
	.cmcf-footer--bottom { flex-direction: column; align-items: flex-start; gap: 16px; }
	.cmcf-footer--legal { text-align: left; }
}

/* =====================================================================
   CMCF Design Tokens (see build-artifacts/token-map.json)
   ===================================================================== */
:root {
	--cmcf-primary:       #0E6A38;
	--cmcf-secondary:     #85C443;
	--cmcf-accent:        #ABD67D;
	--cmcf-deep:          #094122;
	--cmcf-forest:        #276642;
	--cmcf-white:         #FFFFFF;
	--cmcf-black:         #000000;
	--cmcf-grey-panel:    #EEEEEE;
	--cmcf-frost:         rgba(255,255,255,0.10);
	--cmcf-overlay-green: rgba(14,106,56,0.85);

	--cmcf-font-heading: 'Noto Serif', Georgia, 'Times New Roman', serif;
	--cmcf-font-body:    'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

	--cmcf-fs-stat:      clamp(44px, 4.78vw, 68.85px);
	--cmcf-fs-h1:        clamp(28px, 2.78vw, 40px);
	--cmcf-fs-h2:        clamp(24px, 2.23vw, 32px);
	--cmcf-fs-name:      clamp(22px, 2.09vw, 30px);
	--cmcf-fs-cardtitle: clamp(20px, 1.67vw, 24px);
	--cmcf-fs-eyebrow:   18px;
	--cmcf-fs-body:      16px;
	--cmcf-fs-btn:       14px;
	--cmcf-fs-small:     12px;
	--cmcf-fs-legal:     10px;

	--cmcf-ls-eyebrow:   0.09em;
	--cmcf-ls-tight:    -0.011em;
	--cmcf-lh-body:      1.5;

	--cmcf-container:     1240px;
	--cmcf-page-padding:  clamp(20px, 6.94vw, 100px);
	--cmcf-gap:           20px;
	--cmcf-col-gap:       clamp(40px, 7.6vw, 110px);
	--cmcf-radius-pill:   79.04px;
	--cmcf-shadow-frame:  0 4px 73.4px rgba(0,0,0,0.17);
	--cmcf-shadow-arrow:  0 2.65px 48.59px rgba(0,0,0,0.17);
	--cmcf-section-pad:   clamp(48px, 5.5vw, 80px);
}

/* =====================================================================
   Base typography & layout
   ===================================================================== */
body {
	font-family: var(--cmcf-font-body);
	color: var(--cmcf-black);
	font-size: var(--cmcf-fs-body);
	line-height: var(--cmcf-lh-body);
	letter-spacing: var(--cmcf-ls-tight);
}
h1, h2, h3, h4, .cmcf-heading {
	font-family: var(--cmcf-font-heading);
	color: var(--cmcf-primary);
	letter-spacing: var(--cmcf-ls-tight);
	font-weight: 400;
}

/* Shared container: content box x=100 / 1240 wide at 1440 */
.cmcf-container {
	max-width: calc(var(--cmcf-container) + 2 * var(--cmcf-page-padding));
	margin-inline: auto;
	padding-inline: var(--cmcf-page-padding);
}

/* Section vertical rhythm + background variants */
.cmcf-section { padding-block: var(--cmcf-section-pad); }
.cmcf-bg-white  { background: var(--cmcf-white); }
.cmcf-bg-lime   { background: var(--cmcf-secondary); }
.cmcf-bg-green  { background: var(--cmcf-primary); color: var(--cmcf-white); }
.cmcf-bg-grey   { background: var(--cmcf-grey-panel); }
.cmcf-bg-lime  .cmcf-heading,
.cmcf-bg-lime  h2 { color: var(--cmcf-deep); }
.cmcf-bg-green .cmcf-heading,
.cmcf-bg-green h2 { color: var(--cmcf-white); }

/* Eyebrow */
.cmcf-eyebrow {
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: var(--cmcf-fs-eyebrow);
	letter-spacing: var(--cmcf-ls-eyebrow);
	text-transform: uppercase;
	line-height: 1.5;
	margin: 0 0 8px;
	color: var(--cmcf-black);
}
.cmcf-bg-green .cmcf-eyebrow { color: var(--cmcf-accent); }

/* =====================================================================
   Button / pill system (spec-chrome.md — 3 variants, trailing chevron)
   ===================================================================== */
.cmcf-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: var(--cmcf-fs-btn);
	letter-spacing: var(--cmcf-ls-tight);
	line-height: 1;
	padding: 15px 30px;
	border-radius: var(--cmcf-radius-pill);
	border: 1px solid var(--cmcf-primary);
	background: transparent;
	color: var(--cmcf-primary);
	text-decoration: none;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, padding .2s ease;
}
.cmcf-btn i, .cmcf-btn svg { font-size: 0.85em; }
/* Variant 1: outline on white → hover fills green */
.cmcf-btn--outline:hover { background: var(--cmcf-primary); color: var(--cmcf-accent); }
/* Variant 2: outline on green bg (accent border/text) → hover lime fill */
.cmcf-btn--on-green { border-color: var(--cmcf-accent); color: var(--cmcf-accent); }
.cmcf-btn--on-green:hover { background: var(--cmcf-secondary); color: var(--cmcf-deep); border-color: var(--cmcf-accent); }
/* Variant 3: solid donate pill */
.cmcf-btn--donate {
	background: var(--cmcf-secondary);
	color: var(--cmcf-deep);
	border: none;
	padding: 12px 26px;
	border-radius: var(--cmcf-radius-pill);
}
.cmcf-btn--donate:hover { background: var(--cmcf-white); color: var(--cmcf-deep); }

/* Map parent tto-custom-button onto the pill system */
.custom-button .button { border-radius: var(--cmcf-radius-pill); font-family: var(--cmcf-font-body); font-weight: 600; }

/* =====================================================================
   Double-frame frosted panel (hero / stats / quote signature)
   ===================================================================== */
.cmcf-frame {
	position: relative;
	border: 4px solid var(--cmcf-white);
	padding: 24px;
}
.cmcf-frame::before {
	content: "";
	position: absolute;
	inset: 20px;
	border: 4px solid var(--cmcf-white);
	pointer-events: none;
}

/* =====================================================================
   Block: framed-band (heroes + quote/CTA bands)
   ===================================================================== */
.framed-band {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.framed-band--inner {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: var(--fb-min-height, 658px);
}
.framed-band--plain { min-height: var(--fb-min-height, 575px); }
@media (max-width: 860px) { .framed-band--plain { min-height: 300px; } }
.framed-band--panel {
	width: min(876px, 100%);
	min-height: 279px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	backdrop-filter: blur(4px);
}
.framed-band--content { position: relative; z-index: 1; padding: 24px clamp(20px, 5vw, 90px); }
.framed-band--logo { max-width: 430px; width: 60%; height: auto; }
.framed-band--title {
	font-family: var(--cmcf-font-heading);
	font-size: var(--cmcf-fs-h2);
	line-height: 1.33;
	margin: 0;
}
.framed-band--attribution {
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: var(--cmcf-ls-eyebrow);
	margin: 16px 0 0;
	font-size: var(--cmcf-fs-btn);
}
/* Hero: light frosted panel, green title */
.framed-band--hero .framed-band--panel { background: rgba(255,255,255,0.72); }
.framed-band--hero .framed-band--eyebrow { color: var(--cmcf-black); }
.framed-band--hero .framed-band--title { color: var(--cmcf-primary); }
/* Quote / CTA: translucent dark-green panel, white text */
.framed-band--quote .framed-band--inner { min-height: var(--fb-min-height, 658px); }
.framed-band--quote .framed-band--panel { background: var(--cmcf-overlay-green); width: min(1240px, 100%); min-height: 296px; }
/* Card style: plain grey band, white bordered card (Past Trustees) */
.framed-band--card { background: var(--cmcf-grey-panel); }
.framed-band--card .framed-band--inner { min-height: var(--fb-min-height, 451px); }
.framed-band--card .framed-band--panel {
	background: var(--cmcf-white);
	border: 1px solid rgba(0,0,0,0.10);
	box-shadow: 0 6px 30px rgba(0,0,0,0.10);
	width: min(1240px, 100%);
	backdrop-filter: none;
}
.framed-band--card .framed-band--panel::before { border: 1px solid rgba(0,0,0,0.12); inset: 12px; }
.framed-band--card .framed-band--title { color: var(--cmcf-primary); font-size: var(--cmcf-fs-h1); line-height: 1.4; }
.framed-band--card .framed-band--attribution {
	color: var(--cmcf-black);
	text-transform: none;
	letter-spacing: var(--cmcf-ls-tight);
	font-weight: 400;
	font-size: 18px;
	font-family: var(--cmcf-font-body);
}
.framed-band--quote .framed-band--title { color: var(--cmcf-white); }
.framed-band--quote .framed-band--attribution { color: var(--cmcf-accent); }

/* =====================================================================
   Block: media-text (two-column image + text)
   ===================================================================== */
.media-text--inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: var(--cmcf-col-gap);
}
.media-text--media img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 660px;
	object-fit: cover;
}
/* Non-bleed images: natural aspect at the design column width */
.media-text:not(.media-text--bleed) .media-text--media img {
	width: 100%;
	max-width: 510px;
	height: auto;
	max-height: none;
	margin-inline: auto;
}
.media-text--text { max-width: 560px; }
/* Any media-text with an explicit min_height honors it (non-bleed sections too) */
@media (min-width: 861px) {
	.media-text[style*="--mt-min-height"] {
		min-height: var(--mt-min-height);
		display: flex;
		align-items: center;
	}
	.media-text[style*="--mt-min-height"] > .media-text--inner { width: 100%; }
}
/* Text-only bands (design: label+heading left col, paragraphs right col) */
@media (min-width: 861px) {
	.media-text--textonly { min-height: var(--mt-min-height, auto); display: flex; align-items: center; }
	.media-text--textonly .media-text--inner {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: var(--cmcf-col-gap);
		align-items: start;
		width: 100%;
	}
	.media-text--textonly .media-text--headcol,
	.media-text--textonly .media-text--bodycol { max-width: none; }
}
.media-text--logo { max-width: 200px; height: auto; margin-bottom: 16px; }
.media-text--heading {
	font-size: var(--cmcf-fs-h1);
	margin: 0 0 16px;
}
.media-text--body p { margin: 0 0 16px; }
.media-text--body ul { margin: 0 0 16px; padding-left: 1.1em; }
.media-text--body li { margin-bottom: 5.6px; }
.media-text--body strong { color: var(--cmcf-primary); }
.cmcf-bg-green .media-text--body strong { color: var(--cmcf-accent); }
.media-text--cta { margin-top: 20px; }

/* Full-bleed sections (design: image fills half the viewport edge-to-center,
   full section height 658px; text centered in the other half's content box) */
@media (min-width: 861px) {
	.media-text--bleed { position: relative; min-height: var(--mt-min-height, 658px); display: flex; align-items: center; }
	.media-text--bleed.cmcf-tall { min-height: 783px; } /* CMO section */
	.media-text--bleed .media-text--inner { display: block; width: 100%; }
	.media-text--bleed .media-text--media {
		position: absolute;
		top: 0; bottom: 0;
		width: 50%;
		margin: 0;
	}
	.media-text--bleed.media-text--img-right .media-text--media { right: 0; }
	.media-text--bleed.media-text--img-left  .media-text--media { left: 0; }
	.media-text--bleed .media-text--media img {
		width: 100%; height: 100%;
		max-height: none;
		object-fit: cover;
	}
	.media-text--bleed.media-text--img-right .media-text--text { margin-right: 50%; max-width: 520px; }
	/* img-left mirrors img-right: text right-aligned to the content box so it sits
	   in the right half with a ~100px gutter from the image, not hugging it (design
	   text col ≈ 828–1334). margin-left:auto pushes the 520 box to the content edge. */
	.media-text--bleed.media-text--img-left  .media-text--text { margin-left: auto; margin-right: 0; max-width: 520px; }
}

@media (max-width: 860px) {
	.media-text--inner { grid-template-columns: 1fr; }
	.media-text--text { max-width: none; order: 2; }
	.media-text--media { order: 1; }
	.framed-band--inner { min-height: 380px; }
}


/* =====================================================================
   REUSE: tto-faq-accordion → white rounded grant-types card (Our Giving)
   ===================================================================== */
.faq-accordion-items {
	max-width: var(--cmcf-container);
	margin: 40px auto;
	padding-inline: var(--cmcf-page-padding);
}
.faq-accordion-items .accordion {
	background: var(--cmcf-white);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 6px 24px rgba(0,0,0,0.08);
}
.faq-accordion-items .accordion-item { border: none; border-bottom: 1px solid var(--cmcf-grey-panel); }
.faq-accordion-items .accordion-item:last-child { border-bottom: none; }
.faq-accordion-items .accordion-button {
	font-family: var(--cmcf-font-heading);
	font-size: 26px;
	color: var(--cmcf-primary);
	background: var(--cmcf-white);
	padding: 24px 28px;
	box-shadow: none;
}
.faq-accordion-items .accordion-button:not(.collapsed) { background: var(--cmcf-white); color: var(--cmcf-primary); }
.faq-accordion-items .accordion-button i,
.faq-accordion-items .accordion-button svg { color: var(--cmcf-primary); }
.faq-accordion-items .accordion-body {
	font-family: var(--cmcf-font-body);
	font-size: 16px;
	line-height: 1.5;
	color: var(--cmcf-black);
	padding: 0 28px 24px;
}

/* Lime band context (Our Giving §3): pull the accordion onto the lime section */
.cmcf-accordion-lime .faq-accordion-items { margin: 0 auto; }

/* =====================================================================
   Per-page composition variants (design heights — full-site tune-up)
   ===================================================================== */
/* Our Giving: white accordion card pulled INTO the lime initiatives band
   (design: text col left, accordion card x=797 w=543 starting ~112 below band top) */
@media (min-width: 981px) {
	.cmcf-giving-initiatives.media-text--textonly .media-text--inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
	}
	.cmcf-giving-initiatives .media-text--headcol,
	.cmcf-giving-initiatives .media-text--bodycol { max-width: 560px; }
	/* Parent faq-accordion drops className — target by adjacency to the band */
	.cmcf-giving-initiatives + .faq-accordion-items {
		position: relative;
		z-index: 2;
		/* pull into the band so card top = band top + 112 (design); measured seam:
		   flow-restore margin makes the next band start flush at the lime band bottom */
		margin: -468px auto 101px;
		display: flex;
		justify-content: flex-end;
	}
	.cmcf-giving-initiatives + .faq-accordion-items .accordion { width: min(543px, 100%); }
}
/* Giving/History video band heights (design: giving 1000, history 808) */
.cmcf-video-tall.cmcf-bg-green { padding-block: 150px; }
/* Edu+Support tabs: panel with 728px-tall side image */
.cmcf-tabs-tall .segmented-tabs--panel { min-height: 760px; }
.cmcf-tabs-tall .panel-cols img { width: 100%; max-width: 472px; height: auto; margin-left: auto; display: block; }
/* Grey stories band: design card ~620 tall, generous band padding */
.cmcf-stories-grey.profile-selector { padding-block: 96px 50px; }
.cmcf-stories-grey .profile-selector--panel { min-height: 560px; }
/* News search band (design: 180 tall lime band) */
.cmcf-news-search.search-widget {
	background: var(--cmcf-secondary);
	padding: 48px var(--cmcf-page-padding);
	box-shadow: 0 0 0 100vmax var(--cmcf-secondary);
	clip-path: inset(0 -100vmax);
}
/* Region map band breathing room (design section ~900) */
.region-map.cmcf-bg-green { padding-block: 95px 82px; }

/* Loudoun bare logo rows: design band 568 tall */
.logo-cards--style-bare.cmcf-bg-white { padding-block: 100px; }


/* =====================================================================
   Mobile (≤980px) — per the Figma mobile designs + spec-chrome mobile menu
   ===================================================================== */
@media (max-width: 980px) {
	/* Header: logo + hamburger only (design: no utility link, no sub-nav row) */
	.cmcf-utility { display: none; }
	.cmcf-subnav { display: none; }
	.site-header > .wrap { display: flex; align-items: center; justify-content: space-between; padding-block: 16px; }
	.title-area img.custom-logo { max-width: 118px; }
	.menu-toggle { display: inline-flex; color: var(--cmcf-primary); }

	/* Mobile menu: full-screen lime accordion zone (design 26:2543) */
	.nav-primary { background: var(--cmcf-secondary); }
	.nav-primary .menu { display: block; padding: 12px 28px; }
	.nav-primary .menu-item { border-bottom: 1px solid var(--cmcf-white); }
	.nav-primary .menu-item > a {
		display: block;
		padding: 14px 0;
		color: var(--cmcf-deep);
		font-weight: 700;
	}
	.nav-primary .sub-menu { box-shadow: none; background: transparent; padding: 0 0 8px 15px; }
	.nav-primary .sub-menu a { color: var(--cmcf-deep); text-transform: none; font-weight: 500; padding: 6px 0; }
	.nav-primary .current-menu-item > a,
	.nav-primary .current-menu-ancestor > a { border: none; padding: 14px 0; }

	/* Stats band: stack vertically (desktop is a nowrap 3-up row) */
	.cmcf-stats-band.success-numbers { flex-direction: column; align-items: stretch; min-height: 0; }
	.cmcf-stats-band .number-wrap { white-space: normal; }
	.cmcf-stats-band .success-number { padding: 24px 12px; }
	.cmcf-stats-band .success-number:not(:last-child)::after {
		top: auto; bottom: 0; right: auto; left: 50%;
		transform: translateX(-50%);
		height: 1px; width: 134px;
	}
	.cmcf-stats-intro { padding: 48px var(--cmcf-page-padding) 24px; }

	/* Text-only bands stack naturally (grid rule is desktop-only); tune padding */
	.media-text--textonly { padding-block: 40px; }

	/* Framed bands: quote/card panels breathe on small screens */
	.framed-band--quote .framed-band--inner,
	.framed-band--card .framed-band--inner { min-height: 0; padding-block: 48px; }
	.framed-band--plain { min-height: 300px; }

	/* Footer donate pill: static above blurb (design mobile menu zone B) */
	.cmcf-footer--donate { position: static; display: inline-flex; margin-bottom: 16px; }
}

/* Mobile menu Zone B (green contact block per design 26:2543) */
.cmcf-mobile-contact { display: none; }
@media (max-width: 980px) {
	.cmcf-mobile-contact {
		display: block;
		background: var(--cmcf-primary);
		margin: 24px -28px -12px;
		padding: 40px 28px 48px;
		border-bottom: none !important;
	}
	.cmcf-mobile-contact--head {
		color: var(--cmcf-secondary);
		font-weight: 600;
		text-transform: uppercase;
		display: inline-block;
		border-bottom: 1px solid var(--cmcf-white);
		padding-bottom: 4px;
		margin: 0 0 16px;
	}
	.cmcf-mobile-contact--email { display: block; color: var(--cmcf-secondary); font-size: 19px; margin-bottom: 12px; text-decoration: none; }
	.cmcf-mobile-contact--line { color: var(--cmcf-white); font-size: 14px; margin: 4px 0 12px; }
	.cmcf-mobile-contact--line span { color: var(--cmcf-accent); }
	.cmcf-mobile-contact .cmcf-btn--donate { margin-top: 12px; }
}

/* History green band: design split = narrow heading col (327px) + wide body col */
@media (min-width: 861px) {
	.cmcf-split-narrow.media-text--textonly .media-text--inner { grid-template-columns: 327px minmax(0, 1fr); }
}

/* History video band: design foliage bg + frameless letterboxed player (exact overlay) */
.cmcf-video-history.video-embed {
	background-image: url(http://claude-moore-foundation.local/wp-content/uploads/2026/07/history-video-band.png);
	background-size: cover;
	background-position: center;
	padding-block: 100px;
}
.cmcf-video-history .cmcf-frame { border: none; padding: 0; }
.cmcf-video-history .cmcf-frame::before { display: none; }

/* Giving video band: design foliage bg + frameless player (exact overlay) */
.cmcf-video-giving.video-embed {
	background-image: url(http://claude-moore-foundation.local/wp-content/uploads/2026/07/band-giving-video.png);
	background-size: cover;
	background-position: center;
	padding-block: 97px;
}
.cmcf-video-giving .cmcf-frame { border: none; padding: 0; }
.cmcf-video-giving .cmcf-frame::before { display: none; }

/* =====================================================================
   Round-7 fidelity audit fixes (per-band decomposition, 2026-07-07)
   ===================================================================== */
/* Giving stats band variant: full-height dividers (design: rules span the
   inner frame, not the 134px center stubs used on home) + 101px bottom strip */
@media (min-width: 981px) {
	.cmcf-stats-full .success-number:not(:last-child)::after {
		height: auto;
		top: 20px;
		bottom: 20px;
		transform: none;
	}
}
.cmcf-stats-strip-101.success-numbers {
	margin-bottom: 101px;
	clip-path: inset(0 -100vmax -101px -100vmax);
}

/* Giving grant-types accordion: items live in ONE card (kill per-item card look),
   chevron points right when collapsed / down when open (design) */
.faq-accordion-items .accordion-item {
	margin: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.faq-accordion-items .accordion-button i { transition: transform .2s ease; }
.faq-accordion-items .accordion-button.collapsed i { transform: rotate(-90deg); }

/* Giving stats intro occupies 281px per design (frame top = band top + 281) */
.cmcf-stats-intro--tall { min-height: 281px; }

/* ---------------- News page per-band geometry (round-7 audit) ---------------- */
/* Search strip: lime band 179 tall — label left (262px), pill input (70px, r35)
   with the magnifier inside its left edge */
.cmcf-news-search {
	background: var(--cmcf-secondary);
	padding: 55px var(--cmcf-page-padding) 54px;
}
.cmcf-news-search .search-widget--form { max-width: var(--cmcf-container); margin-inline: auto; }
.cmcf-news-search .search-form {
	display: flex;
	align-items: center;
	gap: 78px;
	position: relative;
	margin-inline: 68px;
}
.cmcf-news-search .search-form-label {
	flex: 0 0 262px;
	font-family: var(--cmcf-font-body);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.45;
	color: var(--cmcf-deep);
}
.cmcf-news-search .search-form-input {
	flex: 1;
	height: 70px;
	border: 0;
	border-radius: 35px;
	background: var(--cmcf-white);
	padding: 0 30px 0 92px;
	font-family: var(--cmcf-font-body);
	font-size: 16px;
	color: var(--cmcf-black);
}
.cmcf-news-search .search-form-input:focus { outline: 2px solid var(--cmcf-primary); }
.cmcf-news-search .submit-container {
	position: absolute;
	left: calc(262px + 78px + 28px);
	top: 50%;
	transform: translateY(-50%);
	width: 28px; height: 28px;
}
.cmcf-news-search .search-form-cta { color: var(--cmcf-primary); font-size: 22px; pointer-events: none; }
.cmcf-news-search .search-form-submit {
	position: absolute; inset: 0;
	opacity: 0; cursor: pointer; width: 100%; height: 100%;
}
@media (max-width: 980px) {
	.cmcf-news-search .search-form { flex-direction: column; align-items: stretch; gap: 16px; margin-inline: 0; }
	.cmcf-news-search .search-form-label { flex: none; }
	.cmcf-news-search .search-form-input { padding-left: 60px; }
	.cmcf-news-search .submit-container { left: 22px; top: auto; bottom: 21px; transform: none; }
}

@media (min-width: 981px) {
	/* Press Releases: small 283px cards with wide gutters, inset 33px */
	.cmcf-press-cards.cmcf-section { padding-block: 61px 45px; }
	.cmcf-press-cards .article-cards--grid {
		grid-template-columns: repeat(3, 283px);
		justify-content: space-between;
		margin-inline: 33px;
		gap: 57px 100px;
	}
	.cmcf-press-cards .article-cards--title { font-size: 19px; }
	.cmcf-press-cards .article-cards--pager { margin-top: 69px; }

	/* Community Resources: 548x249 cards, 140px image tile, pager below */
	.cmcf-resource-cards.cmcf-section { padding-block: 100px 53px; }
	.cmcf-resource-cards .article-cards--header { margin-bottom: 42px; }
	.cmcf-resource-cards .article-cards--grid { gap: 29px 77px; }
	.cmcf-resource-cards .article-cards--card { min-height: 249px; }
	.cmcf-resource-cards .article-cards--pager { margin-top: 52px; }

	/* Podcast band: 558px square art at container edge, text col right */
	.cmcf-podcast-band .media-text--inner {
		grid-template-columns: 558px 1fr;
		gap: 100px;
	}
	.cmcf-podcast-band .media-text--media img { width: 558px; height: 558px; object-fit: cover; }

	/* Episode cards: 347x205 thumbs, green hairline divider above the section */
	.cmcf-episode-cards.cmcf-section { padding-block: 0 102px; }
	.cmcf-episode-cards .cmcf-container { border-top: 1px solid var(--cmcf-secondary); padding-top: 61px; }
	.cmcf-episode-cards .article-cards--grid {
		grid-template-columns: repeat(3, 347px);
		justify-content: space-between;
		gap: 57px 0;
	}
	.cmcf-episode-cards .article-cards--media { aspect-ratio: 347 / 205; }
	.cmcf-episode-cards .article-cards--title { font-size: 21px; }
	.cmcf-episode-cards .article-cards--link {
		border: 1px solid var(--cmcf-primary);
		border-radius: var(--cmcf-radius-pill);
		padding: 9px 22px;
		margin-top: 16px;
		align-self: flex-start;
	}
	.cmcf-episode-cards .article-cards--link:hover { background: var(--cmcf-primary); color: var(--cmcf-white); text-decoration: none; }
	.cmcf-episode-cards .article-cards--pager { margin-top: 60px; }

	/* Events in Action: design masonry — 400px tall row set:
	   [large 400][2x2 of 190][large 402], 18px gaps, View More pill below */
	.cmcf-events-gallery .photo-gallery--grid {
		grid-template-columns: 400px 190px 190px 402px;
		grid-auto-rows: 191px;
		gap: 18px;
		justify-content: center;
	}
	.cmcf-events-gallery .photo-gallery--tile { aspect-ratio: auto; height: 100%; }
	.cmcf-events-gallery .photo-gallery--tile:nth-child(1) { grid-area: 1 / 1 / 3 / 2; }
	.cmcf-events-gallery .photo-gallery--tile:nth-child(4) { grid-area: 1 / 4 / 3 / 5; }
	.cmcf-events-gallery.cmcf-section { padding-block: 50px 65px; }
	.cmcf-events-gallery .photo-gallery--header { margin-bottom: 30px; }
	.cmcf-events-gallery .photo-gallery--more-wrap { margin-top: 45px; }
}

/* ---------------- Loudoun page per-band geometry (round-7 audit) ---------------- */
@media (min-width: 981px) {
	/* Summary band: design heading col 520px, wide gutter to body col */
	.cmcf-split-loudoun.media-text--textonly .media-text--inner {
		grid-template-columns: 520px 1fr;
		gap: 210px;
	}
	/* Top Funding Recipients: centered flex rows (6 + 5), logos at design scale */
	.cmcf-recipients .logo-cards--grid {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 55px 65px;
	}
	.cmcf-recipients .logo-cards--bare { min-height: 0; }
	.cmcf-recipients .logo-cards--bare .logo-cards--logo { max-height: 110px; max-width: 250px; }
}
.cmcf-recipients .logo-cards--eyebrow { text-align: center; margin: 0 0 10px; }

/* Focus-bars body copy under the heading (design shows two paragraphs) */
.focus-bars--body {
	font-family: var(--cmcf-font-body);
	font-size: 15px;
	line-height: 1.5;
	color: var(--cmcf-black);
	margin-top: 18px;
	max-width: 380px;
}

/* Segmented-tabs panel org logos (design: logo above each column) */
.segmented-tabs .panel-logo {
	display: block;
	height: 72px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
	margin: 0 0 36px;
}

/* Loudoun fine-tune to design rhythm (round-7) */
@media (min-width: 981px) {
	.cmcf-recipients .logo-cards--grid { gap: 25px 48px; }
	.cmcf-recipients.logo-cards { padding-bottom: 97px; }
	/* Key Examples + Outcomes (Loudoun instance only): design spacing —
	   heading→pills 52, pills→panel 75, panel→band end 111 */
	.cmcf-tabs-loudoun .segmented-tabs--heading { margin-bottom: 52px; }
	.cmcf-tabs-loudoun .segmented-tabs--nav { margin-bottom: 75px; }
	.cmcf-tabs-loudoun.segmented-tabs { padding-bottom: 111px; }
}
.cmcf-stats-intro--mid { min-height: 256px; }

@media (max-width: 980px) {
	.article-cards--pager { flex-wrap: wrap; }
}