/* ACURE4Moms section — microsite chrome.
   Unlayered on purpose: must beat the theme's @layer yak-* rules. */

:root {
	--acure-green: #4d8b5a;
	--acure-green-dark: #3d7048;
	--acure-navy: #13294b;
	--acure-nav-text: #ffffff;
}

/* ---------- Section nav = the header on ACURE pages ---------- */

.acure-section-nav {
	background: var(--acure-green);
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
}

.acure-section-nav__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 1rem;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.75rem;
}

.acure-section-nav__list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 0.25rem;
}

.acure-section-nav__item {
	margin: 0;
	white-space: nowrap;
}

.acure-section-nav__item a,
.acure-section-nav__brand {
	position: relative;
	display: inline-block;
	padding: 0.9rem 1rem;
	color: var(--acure-nav-text);
	text-decoration: none;
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.2;
	white-space: nowrap;
}

/* Hover: faint version of the current-page bar — no background block,
   so hover and current-page states read as one system. */
.acure-section-nav__item a:hover,
.acure-section-nav__item a:focus-visible,
.acure-section-nav__brand:hover,
.acure-section-nav__brand:focus-visible {
	color: var(--acure-nav-text);
}

.acure-section-nav__item a::after,
.acure-section-nav__brand::after {
	content: "";
	position: absolute;
	left: 1rem;
	right: 1rem;
	bottom: 0.4rem;
	height: 3px;
	border-radius: 2px;
	background: var(--acure-nav-text);
	opacity: 0;
	transition: opacity 0.15s ease;
}

.acure-section-nav__item a:hover::after,
.acure-section-nav__item a:focus-visible::after,
.acure-section-nav__brand:hover::after,
.acure-section-nav__brand:focus-visible::after {
	opacity: 0.45;
}

/* Current-page indicator: solid bar centered under the label text. */
.acure-section-nav__item a[aria-current="page"]::after,
.acure-section-nav__brand[aria-current="page"]::after {
	opacity: 1;
}

.acure-section-nav__brand {
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: 0.01em;
	padding-left: 0;
}

.acure-section-nav__brand::after {
	left: 0;
}

.acure-section-nav__home {
	color: var(--acure-nav-text);
	text-decoration: none;
	font-size: 0.85rem;
	opacity: 0.85;
	white-space: nowrap;
	padding: 0.5rem 0;
	margin-left: auto;
}

.acure-section-nav__home:hover,
.acure-section-nav__home:focus-visible {
	opacity: 1;
	color: var(--acure-nav-text);
	text-decoration: underline;
}

@media (max-width: 900px) {
	/* Two-row header: brand + MomBaby Home on top, page links below —
	   a deliberate mobile menu, never loose wrapping or hidden scroll. */
	.acure-section-nav__inner {
		flex-wrap: wrap;
		padding: 0 0.75rem;
		row-gap: 0;
	}
	.acure-section-nav__brand {
		order: 1;
		padding: 0.6rem 0 0.35rem;
		font-size: 1.05rem;
	}
	.acure-section-nav__home {
		order: 2;
		font-size: 0.78rem;
		padding: 0.6rem 0 0.35rem;
	}
	.acure-section-nav__list {
		order: 3;
		flex-basis: 100%;
		border-top: 1px solid rgba(255, 255, 255, 0.25);
	}
	.acure-section-nav__item a {
		padding: 0.55rem 0.85rem 0.65rem;
		font-size: 0.95rem;
	}
	.acure-section-nav__item:first-child a {
		padding-left: 0;
	}
	.acure-section-nav__item:first-child a::after {
		left: 0;
	}
	.acure-section-nav__item a::after {
		bottom: 0.3rem;
	}
	.acure-section-nav__brand::after {
		display: none;
	}
}

/* ---------- Smaller hero on the landing page ----------
   The "hero" is the first content image block (no featured image on 1207).
   Constrain height so content is visible on load. */

.acure-section-root .entry-content > .wp-block-image:first-child {
	margin-top: 0;
	margin-bottom: 2.5rem;
	text-align: center;
}

/* The banner is a designed graphic (logo + tagline) — never crop it.
   Constrain width so it reads as a compact masthead and content is
   visible on first load. */
.acure-section-root .entry-content > .wp-block-image:first-child img {
	width: min(100%, 680px);
	height: auto;
	margin: 0 auto;
	display: block;
}

/* Yak pulls this image up over the title area (data-yak-pull);
   neutralize so the nav bar stays the topmost element. */
.acure-section-root .entry-content > .wp-block-image:first-child[data-yak-pull] {
	transform: none !important;
	margin-top: 0 !important;
}

/* ---------- Readable content measure on desktop ---------- */

.acure-section .entry-content {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Section accents ---------- */

.acure-section .entry-content a:not(.wp-block-button__link):not(.wp-element-button) {
	color: var(--acure-green-dark);
}

.acure-section .wp-block-button__link {
	background-color: var(--acure-green);
}

.acure-section .wp-block-button__link:hover,
.acure-section .wp-block-button__link:focus-visible {
	background-color: var(--acure-green-dark);
}

/* Collapse panels: unify on ACURE green across the section (the Team page's
   original panels carry a navy background in their block attributes — CSS
   override beats the inline style without touching content bytes). */
.acure-section .tdsc-collapse {
	margin-bottom: 1rem;
}

.acure-section .tdsc-collapse__toggle {
	background-color: var(--acure-green) !important;
	color: #ffffff !important;
}

.acure-section .tdsc-collapse__toggle:hover,
.acure-section .tdsc-collapse__toggle:focus-visible {
	background-color: var(--acure-green-dark) !important;
}

/* ctd-tabs TOC: active tab picks up the theme accent (blue) — repaint the
   whole tab list in section colors. */
.acure-section .ctd-tabs__toc [role="tab"] {
	color: inherit;
}

.acure-section .ctd-tabs__toc [role="tab"][aria-selected="true"] {
	background: var(--acure-green) !important;
	color: #ffffff !important;
	border-left-color: var(--acure-green-dark) !important;
}

.acure-section .ctd-tabs__toc [role="tab"]:hover:not([aria-selected="true"]) {
	background: rgba(77, 139, 90, 0.14);
	border-left-color: var(--acure-green) !important;
}

/* ---------- PCORI funding disclaimer ----------
   Sits directly above the site's pre-footer band. Quiet by design: smaller
   than body copy, muted, hairline rule aligned to the content measure —
   legal attribution, not a content section. */

/* Gutter lives on the outer element so the inner's 1140px measure lines up
   with the theme's own footer wraps at every width (70px at 1280, 24px at 800). */
.acure-funding-note {
	background: #ffffff;
	margin-top: 3rem;
	padding: 0 1.5rem;
}

.acure-funding-note__inner {
	max-width: 1140px;
	margin: 0 auto;
	padding: 1.75rem 0 0;
	border-top: 1px solid rgba(19, 41, 75, 0.14);
}

.acure-funding-note__inner p {
	margin: 0;
	max-width: 90ch;
	font-size: 0.85em; /* em, not rem — sits just under the 18px body copy */
	line-height: 1.65;
	color: #5a6068;
}

/* The note is editable (Settings -> ACURE Section) and may run to several
   paragraphs; blank lines in the field become <p>s via wpautop(). */
.acure-funding-note__inner p + p {
	margin-top: 0.9em;
}

.acure-funding-note__inner a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.acure-funding-note__inner a:hover,
.acure-funding-note__inner a:focus {
	color: #13294b;
}

@media (max-width: 900px) {
	.acure-funding-note {
		margin-top: 2rem;
	}
	.acure-funding-note__inner {
		padding-top: 1.5rem;
	}
	.acure-funding-note__inner p {
		font-size: 0.8em;
	}
}