/**
 * mnb.css — consolidated child-theme styles (Sprint 8 Task 3).
 * Order preserved from the previous four requests:
 * tokens → components → header → footer. Section banners mark the
 * former file boundaries. custom.css (legacy Customizer migration)
 * remains separate to keep its late cascade position.
 */

/* ================= FORMER tokens.css ================= */
/**
 * MumsandBubs design tokens (Sprint 4 Task 5).
 *
 * Foundation for the article template v2 and homepage rework ONLY —
 * legacy site elements are not restyled this sprint. Everything here is
 * namespaced (--mnb-* / .mnb-*) and inert until new-module markup uses it.
 *
 * Palette: evolves the existing brand rather than replacing it. The
 * light teal (#7fb3ae, used in table headers since July 2026) stays as
 * the decorative brand anchor; text/UI teal is deepened for contrast.
 * All text combinations below meet WCAG AA:
 *   --mnb-primary  #2d6a64 on white .......... 6.7:1  (AA normal text)
 *   --mnb-ink      #1f2933 on white .......... 14.9:1
 *   --mnb-ink-soft #4b5563 on white .......... 7.6:1
 *   white on --mnb-accent  #c2410c ............ 5.4:1  (AA normal text)
 *   --mnb-ink on --mnb-gold #fcd34d ........... 11.2:1
 *   white on --mnb-primary #2d6a64 ............ 6.7:1
 * Legacy bright orange (#ff6b35) fails AA with white text and is kept
 * for decorative use only (--mnb-accent-bright).
 *
 * Logo/wordmark: out of scope (human designer decision).
 */

:root {
	/* ---- Palette ---- */
	--mnb-primary: #2d6a64;        /* deep teal — links, primary UI, Top Pick */
	--mnb-primary-soft: #7fb3ae;   /* legacy teal — decorative, large shapes */
	--mnb-primary-wash: #f4f9f8;   /* existing light teal wash */
	--mnb-ink: #1f2933;            /* headings, body emphasis */
	--mnb-ink-soft: #4b5563;       /* secondary text, captions */
	--mnb-surface: #ffffff;
	--mnb-surface-tint: #f4f9f8;
	--mnb-accent: #c2410c;         /* CTA buttons (AA with white text) */
	--mnb-accent-bright: #ff6b35;  /* legacy orange — decorative only */
	--mnb-gold: #fcd34d;           /* Editor's Choice badge (ink text) */
	--mnb-line: #dde7e5;           /* borders, dividers */
	--mnb-shadow: 0 4px 12px rgba(31, 41, 51, 0.08);

	/* ---- Type scale (desktop) ---- */
	--mnb-font-body: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--mnb-font-head: 'Lato', 'Open Sans', sans-serif;
	--mnb-text-h1: 36px;
	--mnb-text-h2: 28px;
	--mnb-text-h3: 22px;
	--mnb-text-h4: 19px;
	--mnb-text-body: 18px;
	--mnb-text-small: 16px;
	--mnb-text-caption: 15px;
	--mnb-leading-head: 1.3;
	--mnb-leading-body: 1.7;

	/* ---- Spacing scale ---- */
	--mnb-space-1: 4px;
	--mnb-space-2: 8px;
	--mnb-space-3: 12px;
	--mnb-space-4: 16px;
	--mnb-space-5: 24px;
	--mnb-space-6: 32px;
	--mnb-space-7: 48px;
	--mnb-space-8: 64px;

	/* ---- Radii ---- */
	--mnb-radius: 8px;
	--mnb-radius-sm: 6px;
	--mnb-radius-pill: 999px;
}

/* Tablet ≤921px (existing site breakpoint) */
@media (max-width: 921px) {
	:root {
		--mnb-text-h1: 30px;
		--mnb-text-h2: 24px;
		--mnb-text-h3: 20px;
		--mnb-text-h4: 18px;
		--mnb-text-body: 17px;
	}
}

/* Mobile ≤544px (existing site breakpoint) */
@media (max-width: 544px) {
	:root {
		--mnb-text-h1: 28px;
		--mnb-text-h2: 22px;
		--mnb-text-h3: 18px;
		--mnb-text-h4: 17px;
		--mnb-text-caption: 14px;
	}
}

/* ====================================================================
   BUTTONS (new modules only)
   ==================================================================== */

.mnb-btn,
a.mnb-btn {
	display: inline-block;
	font-family: var(--mnb-font-head);
	font-size: var(--mnb-text-small);
	font-weight: 700;
	line-height: 1.4;
	padding: 13px 26px;
	border-radius: var(--mnb-radius-sm);
	background: var(--mnb-accent);
	color: #fff !important;
	text-decoration: none !important;
	border: 2px solid var(--mnb-accent);
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
	cursor: pointer;
}
.mnb-btn:hover,
a.mnb-btn:hover {
	background: #a33608;
	border-color: #a33608;
	/* must re-assert: the legacy global `a:hover{color:#1a365d!important}`
	   otherwise wins and yields 1.79:1 navy-on-orange (WCAG fail).
	   White on #a33608 = 6.80:1; rest state #fff on #c2410c = 5.18:1. */
	color: #fff !important;
	transform: translateY(-1px);
	box-shadow: var(--mnb-shadow);
}

.mnb-btn--outline,
a.mnb-btn--outline {
	background: transparent;
	color: var(--mnb-primary) !important;
	border: 2px solid var(--mnb-primary);
}
.mnb-btn--outline:hover,
a.mnb-btn--outline:hover {
	background: var(--mnb-primary);
	color: #fff !important;
}

.mnb-btn--small,
a.mnb-btn--small {
	padding: 8px 16px;
	font-size: var(--mnb-text-caption);
}

/* ====================================================================
   BADGES
   ==================================================================== */

.mnb-badge {
	display: inline-block;
	font-family: var(--mnb-font-head);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1;
	padding: 6px 12px;
	border-radius: var(--mnb-radius-pill);
	background: var(--mnb-primary);
	color: #fff;
}
.mnb-badge--budget {
	background: transparent;
	color: var(--mnb-primary);
	box-shadow: inset 0 0 0 2px var(--mnb-primary);
}
.mnb-badge--choice {
	background: var(--mnb-gold);
	color: var(--mnb-ink);
}

/* ================= FORMER components.css ================= */
/**
 * Article template v2 + homepage rework components (Sprint 4 Tasks 3-4).
 * Consumes tokens.css. All selectors namespaced .mnb-* — no legacy impact.
 */

/* ====================================================================
   BYLINE BAR
   ==================================================================== */

.mnb-byline {
	display: flex;
	align-items: center;
	gap: var(--mnb-space-3);
	padding: var(--mnb-space-3) 0;
	margin-bottom: var(--mnb-space-4);
	border-bottom: 1px solid var(--mnb-line);
}
.mnb-byline__avatar {
	border-radius: 50%;
	width: 44px;
	height: 44px;
}
.mnb-byline__meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.mnb-byline__author {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-small);
	color: var(--mnb-ink);
}
.mnb-byline__dates,
.mnb-byline__reviewer {
	font-size: var(--mnb-text-caption);
	color: var(--mnb-ink-soft);
}
.mnb-byline__reviewer {
	color: var(--mnb-primary);
	font-weight: 600;
}

/* ====================================================================
   VERDICT BOX + PICK CARDS
   ==================================================================== */

.mnb-verdict {
	background: var(--mnb-surface-tint);
	border: 1px solid var(--mnb-line);
	border-radius: var(--mnb-radius);
	padding: var(--mnb-space-5);
	margin: var(--mnb-space-6) 0;
}
.mnb-verdict__title {
	font-family: var(--mnb-font-head);
	font-size: var(--mnb-text-h3) !important;
	color: var(--mnb-primary) !important;
	margin: 0 0 var(--mnb-space-4) !important;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.mnb-verdict__secondary {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--mnb-space-4);
	margin-top: var(--mnb-space-4);
}
@media (max-width: 767px) {
	.mnb-verdict__secondary { grid-template-columns: 1fr; }
	.mnb-verdict { padding: var(--mnb-space-4); }
}

.mnb-pick-card {
	background: var(--mnb-surface);
	border: 1px solid var(--mnb-line);
	border-radius: var(--mnb-radius);
	padding: var(--mnb-space-4);
	box-shadow: var(--mnb-shadow);
}
.mnb-pick-card--lead {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: var(--mnb-space-5);
	align-items: start;
	border: 2px solid var(--mnb-primary);
}
@media (max-width: 767px) {
	.mnb-pick-card--lead { grid-template-columns: 1fr; }
}
.mnb-pick-card .mnb-badge {
	margin-bottom: var(--mnb-space-3);
}
.mnb-pick-card__img {
	border-radius: var(--mnb-radius-sm);
	object-fit: cover;
	max-width: 100%;
	height: auto;
	box-shadow: none !important;
	margin: 0 !important;
}
.mnb-pick-card__name {
	font-size: var(--mnb-text-h3) !important;
	margin: 0 0 var(--mnb-space-2) !important;
	color: var(--mnb-ink) !important;
}
.mnb-pick-card__specs {
	font-size: var(--mnb-text-caption) !important;
	color: var(--mnb-ink-soft) !important;
	margin: 0 0 var(--mnb-space-2) !important;
}
.mnb-pick-card__why {
	font-size: var(--mnb-text-small) !important;
	line-height: 1.55 !important;
	margin: 0 0 var(--mnb-space-3) !important;
}
.mnb-pick-card__pc {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--mnb-space-4);
	margin: var(--mnb-space-3) 0;
}
@media (max-width: 544px) {
	.mnb-pick-card__pc { grid-template-columns: 1fr; }
}
.mnb-pick-card__pc-col h4 {
	font-size: var(--mnb-text-caption) !important;
	text-transform: uppercase;
	letter-spacing: .05em;
	margin: 0 0 var(--mnb-space-2) !important;
}
.mnb-pick-card__pc-col--pros h4 { color: var(--mnb-primary) !important; }
.mnb-pick-card__pc-col--cons h4 { color: var(--mnb-accent) !important; }
.mnb-pick-card__pc-col ul {
	margin: 0 !important;
	padding-left: 1.1em !important;
}
.mnb-pick-card__pc-col li {
	font-size: var(--mnb-text-caption) !important;
	margin-bottom: 4px !important;
	line-height: 1.5 !important;
}
.mnb-pick-card__cta {
	display: flex;
	align-items: center;
	gap: var(--mnb-space-4);
	margin-top: var(--mnb-space-3);
}
.mnb-pick-card__price {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	color: var(--mnb-ink);
	font-size: var(--mnb-text-small);
}

/* ====================================================================
   ARTICLE GRID + STICKY SIDEBAR
   ==================================================================== */

.mnb-article-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--mnb-space-6);
}
@media (min-width: 1100px) {
	.mnb-article-grid { grid-template-columns: minmax(0, 1fr) 300px; }
}
.mnb-sidebar__inner {
	position: sticky;
	top: 96px;
	display: flex;
	flex-direction: column;
	gap: var(--mnb-space-5);
	padding: var(--mnb-space-4);
	background: var(--mnb-surface-tint);
	border: 1px solid var(--mnb-line);
	border-radius: var(--mnb-radius);
}
.mnb-sidebar h4 {
	font-size: var(--mnb-text-caption) !important;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--mnb-ink-soft) !important;
	margin: 0 0 var(--mnb-space-2) !important;
}
.mnb-sidebar__toc ol {
	margin: 0 !important;
	padding-left: 1.2em !important;
}
.mnb-sidebar__toc li {
	font-size: var(--mnb-text-caption) !important;
	margin-bottom: 6px !important;
	line-height: 1.45 !important;
}
.mnb-sidebar__toc a,
.mnb-sidebar__related a {
	color: var(--mnb-primary) !important;
	text-decoration: none !important;
}
.mnb-sidebar__toc a:hover,
.mnb-sidebar__related a:hover { text-decoration: underline !important; }
.mnb-sidebar__how {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-caption);
	color: var(--mnb-primary) !important;
	text-decoration: none !important;
}
.mnb-sidebar__related ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.mnb-sidebar__related li {
	font-size: var(--mnb-text-caption) !important;
	margin-bottom: var(--mnb-space-2) !important;
	line-height: 1.45 !important;
}

/* ====================================================================
   UPDATES LOG
   ==================================================================== */

.mnb-updates {
	margin: var(--mnb-space-6) 0 0;
	border: 1px solid var(--mnb-line);
	border-radius: var(--mnb-radius-sm);
	padding: var(--mnb-space-3) var(--mnb-space-4);
	background: var(--mnb-surface);
}
.mnb-updates summary {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-caption);
	color: var(--mnb-ink-soft);
	cursor: pointer;
}
.mnb-updates ul {
	margin: var(--mnb-space-3) 0 0 !important;
	padding-left: 1.2em !important;
}
.mnb-updates li {
	font-size: var(--mnb-text-caption) !important;
	color: var(--mnb-ink-soft) !important;
	margin-bottom: 4px !important;
}
.mnb-updates time { font-weight: 700; color: var(--mnb-ink); }

/* ====================================================================
   HOMEPAGE PREVIEW (Task 4)
   ==================================================================== */

.mnb-home {
	font-family: var(--mnb-font-body);
	color: var(--mnb-ink);
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--mnb-space-5) var(--mnb-space-4) var(--mnb-space-8);
}
.mnb-home a { text-decoration: none; }

.mnb-home__lead {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: var(--mnb-space-6);
	align-items: center;
	padding-bottom: var(--mnb-space-6);
	border-bottom: 2px solid var(--mnb-ink);
}
@media (max-width: 921px) {
	.mnb-home__lead { grid-template-columns: 1fr; }
}
.mnb-home__lead img {
	width: 100%;
	aspect-ratio: 3/2;
	object-fit: cover;
	border-radius: var(--mnb-radius);
}
.mnb-home__kicker {
	font-family: var(--mnb-font-head);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--mnb-accent);
	display: block;
	margin-bottom: var(--mnb-space-2);
}
.mnb-home__lead h2 {
	font-family: var(--mnb-font-head);
	font-size: var(--mnb-text-h1) !important;
	line-height: 1.15 !important;
	margin: 0 0 var(--mnb-space-3) !important;
}
.mnb-home__lead h2 a { color: var(--mnb-ink) !important; }
.mnb-home__lead p { color: var(--mnb-ink-soft); font-size: var(--mnb-text-body); margin: 0 0 var(--mnb-space-3); }

.mnb-home__secondary {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--mnb-space-5);
	padding: var(--mnb-space-6) 0;
	border-bottom: 1px solid var(--mnb-line);
}
@media (max-width: 921px) {
	.mnb-home__secondary { grid-template-columns: 1fr; }
}
.mnb-home__secondary article img {
	width: 100%;
	aspect-ratio: 3/2;
	object-fit: cover;
	border-radius: var(--mnb-radius-sm);
	margin-bottom: var(--mnb-space-3);
}
.mnb-home__secondary h3 {
	font-size: var(--mnb-text-h4) !important;
	line-height: 1.3 !important;
	margin: 0 !important;
}
.mnb-home__secondary h3 a { color: var(--mnb-ink) !important; }

.mnb-home__river { padding: var(--mnb-space-6) 0; border-bottom: 1px solid var(--mnb-line); }
.mnb-home__river-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--mnb-space-4);
}
.mnb-home__river-head h2 {
	font-size: var(--mnb-text-h3) !important;
	margin: 0 !important;
	color: var(--mnb-ink) !important;
}
.mnb-home__pill {
	font-family: var(--mnb-font-head);
	font-size: var(--mnb-text-caption);
	font-weight: 700;
	color: var(--mnb-primary) !important;
	border: 1.5px solid var(--mnb-primary);
	border-radius: var(--mnb-radius-pill);
	padding: 8px 20px;
	transition: all .2s ease;
}
.mnb-home__pill:hover { background: var(--mnb-primary); color: #fff !important; }
.mnb-home__river-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--mnb-space-5);
}
@media (max-width: 921px) {
	.mnb-home__river-grid { grid-template-columns: 1fr; }
}
.mnb-home__river-grid article img {
	width: 100%;
	aspect-ratio: 3/2;
	object-fit: cover;
	border-radius: var(--mnb-radius-sm);
	margin-bottom: var(--mnb-space-2);
}
.mnb-home__river-grid h3 {
	font-size: var(--mnb-text-small) !important;
	line-height: 1.35 !important;
	margin: 0 !important;
}
.mnb-home__river-grid h3 a { color: var(--mnb-ink) !important; }

.mnb-home__trust {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--mnb-space-4);
	background: var(--mnb-primary);
	color: #fff;
	border-radius: var(--mnb-radius);
	padding: var(--mnb-space-5);
	margin: var(--mnb-space-6) 0;
}
.mnb-home__trust p { margin: 0; font-size: var(--mnb-text-small); color: #fff; max-width: 640px; }
.mnb-home__trust a {
	color: #fff !important;
	font-weight: 700;
	text-decoration: underline !important;
}
.mnb-home__trust-count {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-h3);
	white-space: nowrap;
}

/* ====================================================================
   AUTO-DISCLOSURE BOX (Sprint 8 Task 1)
   ==================================================================== */

.mnb-disclosure {
	background: var(--mnb-surface-tint);
	border-left: 3px solid var(--mnb-primary);
	border-radius: 0 var(--mnb-radius-sm) var(--mnb-radius-sm) 0;
	padding: var(--mnb-space-3) var(--mnb-space-4);
	margin: var(--mnb-space-4) 0 !important;
	font-size: var(--mnb-text-caption) !important;
	line-height: 1.55 !important;
	color: var(--mnb-ink-soft);
}
.mnb-disclosure a { color: var(--mnb-primary) !important; }

/* ====================================================================
   HOMEPAGE V2 (Sprint 5 Task 3)
   ==================================================================== */

.mnb-hero {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: var(--mnb-space-6);
	align-items: center;
	padding-bottom: var(--mnb-space-6);
	border-bottom: 2px solid var(--mnb-ink);
}
@media (max-width: 921px) {
	.mnb-hero { grid-template-columns: 1fr; gap: var(--mnb-space-4); }
}
.mnb-hero__media img {
	width: 100%;
	aspect-ratio: 16/10;
	object-fit: cover;
	border-radius: var(--mnb-radius);
}
.mnb-hero__title {
	font-family: var(--mnb-font-head);
	font-size: calc(var(--mnb-text-h1) * 1.15) !important;
	line-height: 1.12 !important;
	margin: var(--mnb-space-2) 0 var(--mnb-space-3) !important;
}
.mnb-hero__title a { color: var(--mnb-ink) !important; text-decoration: none !important; }
.mnb-hero__title a:hover { color: var(--mnb-primary) !important; }
.mnb-hero__dek {
	color: var(--mnb-ink-soft);
	font-size: var(--mnb-text-body);
	margin: 0 0 var(--mnb-space-4);
}
.mnb-hero__byline {
	display: flex;
	align-items: center;
	gap: var(--mnb-space-2);
	font-size: var(--mnb-text-caption);
	color: var(--mnb-ink-soft);
}
.mnb-hero__byline img { border-radius: 50%; width: 28px; height: 28px; }
.mnb-hero__date::before { content: "·"; margin-right: var(--mnb-space-2); }

.mnb-home--v2 .mnb-home__trust { margin: var(--mnb-space-5) 0; }

.mnb-band {
	display: grid;
	grid-template-columns: 3fr 2fr;
	gap: var(--mnb-space-6);
	padding: var(--mnb-space-5) 0 var(--mnb-space-6);
	border-bottom: 1px solid var(--mnb-line);
}
@media (max-width: 921px) {
	.mnb-band { grid-template-columns: 1fr; }
}
.mnb-band__head {
	font-family: var(--mnb-font-head);
	font-size: var(--mnb-text-h3) !important;
	color: var(--mnb-ink) !important;
	margin: 0 0 var(--mnb-space-4) !important;
	padding-bottom: var(--mnb-space-2);
	border-bottom: 2px solid var(--mnb-primary);
	display: inline-block;
}
.mnb-latest {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	gap: var(--mnb-space-3);
}
.mnb-latest li {
	display: flex;
	gap: var(--mnb-space-3);
	align-items: center;
	margin: 0 !important;
}
.mnb-latest__thumb img,
.mnb-thumb-fallback--sq {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: var(--mnb-radius-sm);
	aspect-ratio: 1;
	margin: 0 !important;
	flex-shrink: 0;
}
.mnb-latest__title {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-small);
	line-height: 1.35;
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
	display: block;
}
.mnb-latest__title:hover { color: var(--mnb-primary) !important; }
.mnb-latest__date {
	font-size: var(--mnb-text-caption);
	color: var(--mnb-ink-soft);
}
.mnb-pickrow {
	display: flex;
	align-items: flex-start;
	gap: var(--mnb-space-3);
	padding: var(--mnb-space-3) 0;
	border-bottom: 1px solid var(--mnb-line);
}
.mnb-pickrow .mnb-badge { flex-shrink: 0; margin-top: 2px; }
.mnb-pickrow a {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-small);
	line-height: 1.4;
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
}
.mnb-pickrow a:hover { color: var(--mnb-primary) !important; }

.mnb-home__river-intro {
	margin: 2px 0 0 !important;
	font-size: var(--mnb-text-caption);
	color: var(--mnb-ink-soft);
}

/* The mid-page homepage newsletter section was removed in Sprint 9
   Task 3 (duplicate wpforms-19 IDs vs the footer form) — its
   .mnb-home__newsletter rules went with it. */

/* Fallback tile for posts without a featured image (Sprint 5 Task 1) */
.mnb-thumb-fallback {
	width: 100%;
	aspect-ratio: 3/2;
	border-radius: var(--mnb-radius-sm);
	background: linear-gradient(135deg, var(--mnb-primary-wash), var(--mnb-primary-soft));
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--mnb-space-2);
}
.mnb-thumb-fallback span {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-caption);
	color: var(--mnb-primary);
	text-transform: uppercase;
	letter-spacing: .06em;
}

/* ================= RELATED ARTICLES (Sprint 9 Task 1) =================
   The single template's "More articles you may like" uses the ekit
   post widget; its styling shipped in widget-styles.css, dequeued in
   Sprint 8 (the coverage sample never scrolled that deep — root cause
   owned in the changelog). Rather than restore 455KB for one widget,
   the block is restyled here with tokens: arrows dropped (v2 pattern),
   read-more as a text link, tidy card body. */

/* the bootstrap column widths (col-lg-4 etc.) were also in the
   dequeued bundle — restore the 3-across grid for the related row */
.row.post-items {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--mnb-space-5);
}
@media (max-width: 921px) {
	.row.post-items { grid-template-columns: 1fr; }
}
.row.post-items > [class*="col-"] {
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
}

.elementskit-post-image-card .elementskit-btn svg,
.elementskit-post-image-card .btn-wraper svg {
	display: none !important;
}
.elementskit-post-image-card .elementskit-btn {
	display: inline-block;
	background: none !important;
	border: none !important;
	padding: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	font-family: var(--mnb-font-head) !important;
	font-size: var(--mnb-text-caption) !important;
	font-weight: 700 !important;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--mnb-primary) !important;
	text-decoration: none !important;
}
.elementskit-post-image-card .elementskit-btn::after {
	content: " \2192"; /* → */
}
.elementskit-post-image-card .elementskit-btn:hover {
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
}
.elementskit-post-image-card .elementskit-post-body {
	padding: var(--mnb-space-4) 0 var(--mnb-space-5);
}
.elementskit-post-image-card .btn-wraper {
	margin-top: var(--mnb-space-2);
}
/* related-card titles: keep readable card scale (they're h2 on singles) */
.elementskit-post-image-card h2.entry-title,
.elementskit-post-image-card h3.entry-title {
	font-size: var(--mnb-text-h4) !important;
	line-height: 1.35 !important;
	margin: 0 0 var(--mnb-space-2) !important;
}
.elementskit-post-image-card .entry-title a {
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
}
.elementskit-post-image-card .entry-title a:hover {
	color: var(--mnb-primary) !important;
}

/* Single-template post-info meta (date/categories): the widget's
   #66b2b0 on white measured 2.45:1 (axe, Sprint 9 T2). Deep teal
   token = 6.70:1; presentation-layer override, template untouched. */
.elementor-post-info__item,
.elementor-post-info__item a,
.elementor-icon-list-text.elementor-post-info__item {
	color: var(--mnb-primary) !important;
}

/* ================= FORMER header.css ================= */
/**
 * Rebuilt media-brand header (Sprint 5 Task 2). Token-based.
 *
 * CLS safety: .mnb-header-wrap reserves a FIXED height per breakpoint
 * (utility strip + main bar). The main bar is position:sticky; the
 * compact state shrinks only its internals, never the reserved space.
 */

.mnb-header-wrap {
	height: 116px; /* 36 utility + 80 main */
	font-family: var(--mnb-font-body);
}
@media (max-width: 921px) {
	.mnb-header-wrap { height: 100px; } /* 36 + 64 */
}

/* ---- utility strip ---- */
.mnb-utility {
	background: var(--mnb-primary);
	color: #fff;
	height: 36px;
	font-size: 13px;
}
.mnb-utility__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 var(--mnb-space-4);
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--mnb-space-4);
}
.mnb-utility__line { opacity: .92; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mnb-utility__links { display: flex; align-items: center; gap: var(--mnb-space-4); flex-shrink: 0; }
.mnb-utility a { color: #fff !important; text-decoration: none !important; font-weight: 600; }
.mnb-utility a:hover { text-decoration: underline !important; }
.mnb-utility__social { display: inline-flex; align-items: center; opacity: .9; }
@media (max-width: 544px) {
	.mnb-utility__line { font-size: 12px; }
	.mnb-utility__links a:not(.mnb-utility__social) { display: none; } /* keep socials, drop text link */
}

/* ---- main bar ---- */
.mnb-mainbar {
	position: sticky;
	top: 0;
	z-index: 980;
	background: var(--mnb-surface);
	border-bottom: 1px solid var(--mnb-line);
	height: 80px;
	transition: height .18s ease, box-shadow .18s ease;
}
.mnb-mainbar.is-compact {
	height: 60px;
	box-shadow: var(--mnb-shadow);
}
.mnb-mainbar__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 var(--mnb-space-4);
	height: 100%;
	display: flex;
	align-items: center;
	gap: var(--mnb-space-5);
}
.mnb-mainbar__brand { flex-shrink: 0; display: flex; align-items: center; height: 100%; }
.mnb-mainbar__brand img {
	width: auto;
	height: 52px;
	transition: height .18s ease;
}
.mnb-mainbar.is-compact .mnb-mainbar__brand img { height: 40px; }

.mnb-mainbar__nav { flex: 1; min-width: 0; }
.mnb-nav {
	display: flex;
	gap: var(--mnb-space-5);
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
/* Sprint 10 Task 4: pin nav metrics. custom.css's legacy single-post
   rules (`body.single-post li { margin-bottom:.5em; line-height:1.1em }`
   AND `body.single-post ul { margin-bottom:1em; padding-left:0 }`, all
   !important, specificity (0,1,2)/(0,1,1)) otherwise restyle the header
   menu on articles only — the UL's phantom bottom margin threw the
   flex-centering 9px high vs the homepage. The homepage rendering is
   the reference; assert it on every template at (0,2,x) for both the
   list and its items, covering the drawer menu too. */
.mnb-header-wrap .mnb-nav,
.mnb-header-wrap .mnb-drawer__nav {
	margin: 0 !important;
	padding: 0 !important;
}
.mnb-header-wrap .mnb-nav li,
.mnb-header-wrap .mnb-drawer__nav li {
	margin: 0 !important;
	line-height: 1.7 !important;
}
.mnb-nav a {
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-small);
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
	padding: 6px 0;
	border-bottom: 2px solid transparent;
}
/* the border-bottom IS the hover indicator — suppress the legacy
   global a:hover underline or menu items show a double line */
.mnb-nav a:hover,
.mnb-nav a:focus {
	color: var(--mnb-primary) !important;
	border-bottom-color: var(--mnb-primary);
	text-decoration: none !important;
}
.mnb-nav .current-menu-item > a { color: var(--mnb-primary) !important; border-bottom-color: var(--mnb-primary); }

.mnb-mainbar__actions {
	display: flex;
	align-items: center;
	gap: var(--mnb-space-3);
	flex-shrink: 0;
	/* right-justify even when the nav (the flex spacer) is hidden on
	   mobile — without this the icons huddle next to the logo */
	margin-left: auto;
}
/* !important guards: the legacy global `button` rules (Astra customizer
   pink background + custom.css padding/hover-lift) must not style the
   icon toggles. */
.mnb-search-toggle {
	background: none !important;
	border: none !important;
	color: var(--mnb-ink) !important;
	cursor: pointer;
	padding: 8px !important;
	display: inline-flex;
	border-radius: var(--mnb-radius-sm) !important;
	box-shadow: none !important;
	transform: none !important;
}
.mnb-search-toggle:hover { background: var(--mnb-surface-tint) !important; color: var(--mnb-primary) !important; }

.mnb-searchbar {
	position: absolute;
	left: 0; right: 0;
	background: var(--mnb-surface);
	border-bottom: 1px solid var(--mnb-line);
	box-shadow: var(--mnb-shadow);
	padding: var(--mnb-space-4);
}
.mnb-searchbar form { max-width: 640px; margin: 0 auto; display: flex; gap: var(--mnb-space-3); }
.mnb-searchbar input[type="search"] {
	flex: 1;
	padding: 10px 14px;
	border: 2px solid var(--mnb-line);
	border-radius: var(--mnb-radius-sm);
	font-size: var(--mnb-text-small);
}
.mnb-searchbar input[type="search"]:focus { border-color: var(--mnb-primary); outline: none; }

/* hamburger hidden on desktop */
.mnb-drawer-toggle { display: none; }

@media (max-width: 921px) {
	.mnb-mainbar { height: 64px; }
	.mnb-mainbar.is-compact { height: 56px; }
	.mnb-mainbar__brand img { height: 42px; }
	.mnb-mainbar.is-compact .mnb-mainbar__brand img { height: 36px; }
	.mnb-mainbar__nav, a.mnb-mainbar__cta { display: none !important; }
	.mnb-drawer-toggle {
		display: inline-flex !important;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		background: none !important;
		border: none !important;
		padding: 10px !important;
		box-shadow: none !important;
		transform: none !important;
		cursor: pointer;
	}
	.mnb-drawer-toggle span {
		display: block;
		width: 22px;
		height: 2px;
		background: var(--mnb-ink);
		border-radius: 2px;
	}
}

/* ---- mobile drawer ---- */
.mnb-drawer {
	position: fixed;
	inset: 0;
	z-index: 990;
	background: rgba(31, 41, 51, .5);
	opacity: 0;
	transition: opacity .2s ease;
}
.mnb-drawer.is-open { opacity: 1; }
.mnb-drawer__panel {
	position: absolute;
	top: 0; right: 0; bottom: 0;
	width: min(320px, 85vw);
	background: var(--mnb-surface);
	padding: var(--mnb-space-6) var(--mnb-space-5);
	display: flex;
	flex-direction: column;
	gap: var(--mnb-space-5);
	transform: translateX(100%);
	transition: transform .2s ease;
	overflow-y: auto;
}
.mnb-drawer.is-open .mnb-drawer__panel { transform: translateX(0); }
.mnb-drawer__close {
	position: absolute;
	top: 10px; right: 14px;
	background: none;
	border: none;
	font-size: 30px;
	line-height: 1;
	color: var(--mnb-ink-soft);
	cursor: pointer;
}
.mnb-drawer__search { display: flex; gap: var(--mnb-space-2); margin-top: var(--mnb-space-4); }
.mnb-drawer__search input {
	flex: 1;
	padding: 10px 12px;
	border: 2px solid var(--mnb-line);
	border-radius: var(--mnb-radius-sm);
}
.mnb-drawer__nav {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	gap: var(--mnb-space-2);
}
.mnb-drawer__nav a {
	display: block;
	font-family: var(--mnb-font-head);
	font-weight: 700;
	font-size: var(--mnb-text-h4);
	color: var(--mnb-ink) !important;
	text-decoration: none !important;
	padding: 10px 0;
	border-bottom: 1px solid var(--mnb-line);
}
.mnb-drawer__nav a:hover,
.mnb-drawer__nav a:focus {
	color: var(--mnb-primary) !important;
	text-decoration: none !important; /* rows use the divider, not underline */
}
.mnb-drawer__cta { text-align: center; }

/* ================= FORMER footer.css ================= */
/**
 * Rebuilt media-brand footer (Sprint 7 Task 2). Token-based; dark teal
 * surface with white text (all combinations ≥ AA on --mnb-primary).
 */

.mnb-footer {
	background: var(--mnb-primary);
	color: #fff;
	font-family: var(--mnb-font-body);
	margin-top: var(--mnb-space-8);
}
.mnb-footer a {
	color: #fff !important;
	text-decoration: none !important;
	opacity: .92;
}
.mnb-footer a:hover,
.mnb-footer a:focus {
	opacity: 1;
	text-decoration: underline !important;
	color: #fff !important;
}
.mnb-footer__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: var(--mnb-space-7) var(--mnb-space-4) var(--mnb-space-5);
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr 2fr;
	gap: var(--mnb-space-6);
}
.mnb-footer__brand img {
	width: 135px;
	height: auto;
	margin-bottom: var(--mnb-space-3);
}
.mnb-footer__mission {
	font-size: var(--mnb-text-caption);
	line-height: 1.6;
	opacity: .92;
	margin: 0;
	max-width: 260px;
}
.mnb-footer .mnb-footer__col h4,
.mnb-footer .mnb-footer__news h4 {
	/* .mnb-footer prefix beats the legacy .elementor-kit-659 h4 color
	   rule (equal specificity, later file) — axe measured #222 on teal */
	font-family: var(--mnb-font-head);
	font-size: 13px !important;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #fff !important;
	opacity: 1; /* was .75 — computed 2.07:1, axe fail (Sprint 9 T2) */
	margin: 0 0 var(--mnb-space-3) !important;
}
.mnb-footer__col ul {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}
.mnb-footer__col li {
	margin: 0 0 var(--mnb-space-2) !important;
	font-size: var(--mnb-text-caption);
	line-height: 1.5;
}
/* tap-friendly targets on touch layouts */
@media (max-width: 921px) {
	.mnb-footer__col li { margin-bottom: 0 !important; }
	.mnb-footer__col a { display: block; padding: 10px 0; }
}

/* compact newsletter (WPForms 19) */
.mnb-footer__news .wpforms-container { margin: 0 !important; max-width: 320px; }
.mnb-footer__news .wpforms-form { display: flex; gap: var(--mnb-space-2); }
.mnb-footer__news .wpforms-field-container { flex: 1; }
.mnb-footer__news .wpforms-field { padding: 0 !important; }
.mnb-footer__news .wpforms-field-label { display: none !important; }
.mnb-footer__news input[type="email"],
.mnb-footer__news input[type="text"] {
	width: 100%;
	padding: 10px 12px !important;
	border: 0 !important;
	border-radius: var(--mnb-radius-sm) !important;
	font-size: var(--mnb-text-caption) !important;
	color: var(--mnb-ink) !important;
	background: #fff !important;
}
.mnb-footer__news .wpforms-submit-container { padding: 0 !important; }
.mnb-footer__news button[type="submit"] {
	background: var(--mnb-accent) !important;
	border: 2px solid var(--mnb-accent) !important;
	color: #fff !important;
	border-radius: var(--mnb-radius-sm) !important;
	font-family: var(--mnb-font-head) !important;
	font-weight: 700 !important;
	font-size: var(--mnb-text-caption) !important;
	padding: 10px 16px !important;
}

.mnb-footer__base {
	border-top: 1px solid rgba(255, 255, 255, .18);
}
/* Sprint 10 Task 3: margin needs !important at (0,2,1) — custom.css's
   legacy `p { margin-bottom:1.6em !important }` (and the single-post
   1em variant) otherwise wins, and that bottom margin on the footer's
   last paragraph escapes the footer box and extends the scrollable
   area 13-21px past the teal — the "white bar" (grey body background)
   below the footer on every page. */
.mnb-footer .mnb-footer__base p {
	max-width: 1200px;
	margin: 0 auto !important;
	padding: var(--mnb-space-2) var(--mnb-space-4);
	font-size: 13px;
	opacity: .85;
	color: #fff;
}
/* Sprint 10 Task 2: the Amazon Associates line was removed — the copy
   line now carries both paddings. */
.mnb-footer__base .mnb-footer__copy {
	padding-top: var(--mnb-space-4);
	padding-bottom: var(--mnb-space-4);
}

@media (max-width: 921px) {
	.mnb-footer__inner {
		grid-template-columns: 1fr;
		gap: var(--mnb-space-5);
	}
	.mnb-footer__news .wpforms-form { flex-direction: column; }
	.mnb-footer__news .wpforms-container { max-width: 100%; }
}
