/* ==========================================================================
   Homepage sections (front-page.html + ouaaup/* home patterns).
   Loaded on the front page and in the editor only.
   ========================================================================== */

/* --- Hero ----------------------------------------------------------------- */
.ouaaup-hero .ouaaup-eyebrow { margin-top: 0; }
.ouaaup-hero__title {
	margin: 0 0 var(--wp--preset--spacing--5);
	font-weight: 800;
	line-height: 0.98;
	letter-spacing: -0.03em;
}
.ouaaup-hero__title mark { background: none; }
.ouaaup-hero__lead {
	max-width: 44ch;
	margin: 0 0 var(--wp--preset--spacing--6);
}
.ouaaup-hero__cols > .wp-block-column { min-width: 0; }
/* Let the bargaining button + its caption wrap as siblings of "Become a Member",
   so both buttons share a row and the caption drops below (as designed). */
.ouaaup-hero__actions .ouaaup-bb { display: contents; }

/* Core Grid layout uses auto-fill (reserves empty tracks); the design uses auto-fit. */
.ouaaup-pillars.is-layout-grid { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)) !important; }

/* --- What We Defend -------------------------------------------------------- */
.ouaaup-af__source {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-500);
}
.ouaaup-af .ouaaup-sechead h2 { margin-bottom: 2px; }
.ouaaup-af__lede {
	margin: 0;
	line-height: 1.7;
	color: var(--wp--preset--color--ink-700);
}
.ouaaup-af__lede strong { font-weight: 600; color: var(--wp--preset--color--ink-900); }

.ouaaup-elements-card {
	border: 1px solid var(--wp--preset--color--ou-blue-100);
	border-radius: var(--wp--custom--radius--lg);
}
.ouaaup-elements-card .ouaaup-eyebrow { margin: 0; }
.ouaaup-elements {
	list-style: none;
	margin: var(--wp--preset--spacing--4) 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--3);
	font-weight: 600;
	color: var(--wp--preset--color--ink-900);
}
.ouaaup-elements li { display: flex; align-items: center; gap: var(--wp--preset--spacing--3); margin: 0; }
.ouaaup-elements strong {
	min-width: 26px;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--lg);
	color: var(--wp--preset--color--ou-blue);
}
.ouaaup-elements li.is-proposed {
	margin-top: var(--wp--preset--spacing--2);
	padding-top: var(--wp--preset--spacing--4);
	border-top: 1px solid var(--wp--preset--color--ou-blue-100);
	color: var(--wp--preset--color--ink-700);
}
.ouaaup-elements li.is-proposed strong { color: var(--wp--preset--color--ou-gold-600); }
.ouaaup-elements em {
	padding: 4px 10px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--ou-gold-050);
	color: #7A5A2E;
	font-style: normal;
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 600;
	line-height: 1.3;
}

/* Editorial rows: 300px left column | quotes */
/* Only reset vertical margins: the constrained layout centres each row with
   margin-inline:auto !important, and overriding that pushed rows to the left edge. */
.ouaaup-af-row {
	margin-block: 0 !important;
	padding: var(--wp--preset--spacing--7) 0;
	border-top: 1px solid var(--wp--preset--color--warm-200);
	--ouaaup-accent: var(--wp--preset--color--ou-blue);
	--ouaaup-accent-bg: var(--wp--preset--color--ou-blue-050);
}
.ouaaup-af-row.is-proposed {
	--ouaaup-accent: var(--wp--preset--color--ou-gold-600);
	--ouaaup-accent-bg: var(--wp--preset--color--ou-gold-050);
}
.ouaaup-af-row h3 { margin: 0 0 var(--wp--preset--spacing--2); letter-spacing: -0.01em; }

/* Left column: 300px on wide screens, shrinking to 220px before the row stacks. */
.ouaaup-af-row > .wp-block-column:first-child {
	flex: 0 1 clamp(220px, 28%, 300px) !important;
	min-width: 0;
}
.ouaaup-af-row > .wp-block-column:last-child { flex: 1 1 0 !important; min-width: 0; }

/* Stack below 900px (core would wait until 782px, leaving the quotes too narrow). */
@media (max-width: 899px) {
	.ouaaup-af-row { flex-wrap: wrap !important; }
	.ouaaup-af-row > .wp-block-column:first-child,
	.ouaaup-af-row > .wp-block-column:last-child { flex: 1 1 100% !important; }
	.ouaaup-af__frame,
	.ouaaup-af__cite { max-width: 60ch; }
}
.ouaaup-af-row .ouaaup-badge { margin: 0 0 var(--wp--preset--spacing--3); }

/* Number + 40px icon tile to its right */
.ouaaup-af__num {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: fit-content;
	margin: 0 0 var(--wp--preset--spacing--3);
	padding-right: calc(40px + var(--wp--preset--spacing--3));
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: var(--wp--preset--font-size--4-xl);
	line-height: 1;
	color: var(--ouaaup-accent);
}
.ouaaup-af__num::before,
.ouaaup-af__num::after {
	content: "";
	position: absolute;
	top: 50%;
}
.ouaaup-af__num::before {
	right: 0;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	border-radius: var(--wp--custom--radius--md);
	background: var(--ouaaup-accent-bg);
}
.ouaaup-af__num::after {
	right: 10px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: var(--ouaaup-accent);
	-webkit-mask: var(--ouaaup-ico) center / contain no-repeat;
	mask: var(--ouaaup-ico) center / contain no-repeat;
}
.ouaaup-af__frame {
	max-width: 36ch;
	margin: 0;
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.65;
	color: var(--wp--preset--color--ink-700);
}
.ouaaup-af__cite {
	max-width: 40ch;
	margin: var(--wp--preset--spacing--3) 0 0;
	font-size: var(--wp--preset--font-size--xs);
	line-height: 1.5;
	color: var(--wp--preset--color--ink-500);
}
.ouaaup-af__quotes { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--5); }
.ouaaup-af__quote,
.ouaaup-af__prose {
	margin: 0 !important;
	padding-left: var(--wp--preset--spacing--5);
	border-left: 3px solid var(--ouaaup-accent);
}
.ouaaup-af__quote p,
.ouaaup-af__prose {
	font-family: var(--wp--preset--font-family--heading);
	/* 20px on phones → 28px (design) from ~1100px up */
	font-size: clamp(1.25rem, 0.9rem + 0.95vw, 1.75rem);
	font-weight: 400;
	line-height: 1.42;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink-900);
}
.ouaaup-af__quote p { margin: 0; font-style: italic; }
.ouaaup-af__prose { line-height: 1.45; }
.ouaaup-af__quote cite {
	display: block;
	margin-top: var(--wp--preset--spacing--3);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--xs);
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ou-blue-700);
}
.ouaaup-af__contact p { margin: 0; color: var(--wp--preset--color--ink-700); }

/* --- Who We Are ------------------------------------------------------------- */
.ouaaup-who__photo { margin: 0; }
.ouaaup-who__photo img {
	display: block;
	width: 100%;
	height: 340px;
	object-fit: cover;
	border-radius: var(--wp--custom--radius--lg);
}
.ouaaup-who h2 { margin: 0 0 var(--wp--preset--spacing--4); }
.ouaaup-who .ouaaup-eyebrow { margin: 0; }
.ouaaup-who .ouaaup-body-lg { margin: 0 0 var(--wp--preset--spacing--4); }
.ouaaup-who .ouaaup-body-lg:last-child { margin-bottom: 0; }

.ouaaup-pillar__title {
	margin: 0;
	letter-spacing: -0.01em;
}
.ouaaup-pillar__title::before {
	content: "";
	display: block;
	width: 26px;
	height: 26px;
	margin-bottom: var(--wp--preset--spacing--3);
	background: var(--wp--preset--color--union-red);
	-webkit-mask: var(--ouaaup-ico) center / contain no-repeat;
	mask: var(--ouaaup-ico) center / contain no-repeat;
}
.ouaaup-pillar p {
	margin: 0;
	line-height: 1.65;
	color: var(--wp--preset--color--ink-500);
}

/* --- Around the Chapter ------------------------------------------------------ */
.ouaaup-chapter__cols > .wp-block-column { min-width: 0; }
.ouaaup-chapter__events .ouaaup-eyebrow { margin: 0; }
.ouaaup-chapter .ouaaup-note {
	border-color: var(--wp--preset--color--warm-100);
	box-shadow: none;
}

/* --- Stay Connected ------------------------------------------------------------ */
.ouaaup-social-section .ouaaup-row-label::before { width: 18px; height: 18px; }
/* Smash Balloon feed: square tiles with rounded corners to match the design */
.ouaaup-social-row #sb_instagram { padding-bottom: 0 !important; }
.ouaaup-social-row #sb_instagram #sbi_images { padding: 0 !important; }
.ouaaup-social-row #sb_instagram .sbi_photo_wrap,
.ouaaup-social-row #sb_instagram .sbi_photo { border-radius: var(--wp--custom--radius--md); overflow: hidden; }