/*
 * Male Vitality & Sexual Health — Landing L1 (Phase: Shop by Health Goal)
 * "Dark Forest / Imperial Gold / Cream"  ·  Playfair Display + Nunito Sans
 *
 * Ported from the Claude Design bundle `mv.css`. Strict lane scoping under
 * `.eh-mv` (same approach as journal/our-story). The design's component
 * classes are already self-namespaced `.mv-*` and are kept verbatim. The
 * generic shared classes from the design system (container/section/eyebrow/
 * btn/arrow/gold) are ported with an `mv-` prefix to avoid collisions with
 * the Ecome parent theme. Design tokens (--forest-900 …) are defined ON the
 * `.eh-mv` lane so they resolve only for in-lane descendants and never leak
 * to / clash with the theme's globals. Loaded only on the `male-vitality`
 * page (see functions.php NOVAMIRA_MALE_VITALITY block).
 *
 * Reusable: the herb-accordion markup (.mv-herb*) is rendered by
 * eh_mv_render_herb() and is shared with the planned L2 Women's Wellness page.
 */

.eh-mv {
	--forest-900: #0d2a20;
	--forest-800: #14392c;
	--forest-700: #1b4332;
	--forest-600: #245241;
	--herb-600: #2d6a4f;
	--herb-500: #3b8466;
	--herb-400: #6ba886;
	--gold-600: #b78712;
	--gold-500: #d4a017;
	--gold-400: #e6bf4f;
	--gold-100: #f3e4b6;
	--cream-50: #faf7f1;
	--cream-100: #f8f5f0;
	--cream-200: #efe8d9;
	--cream-300: #ddd3bd;
	--ink-900: #14201a;
	--ink-700: #2f3a32;
	--ink-500: #6b7368;
	--line: rgba(20, 32, 26, 0.12);
	--line-dark: rgba(243, 228, 182, 0.18);
	--font-display: "Playfair Display", "Cormorant Garamond", Georgia, serif;
	--font-body: "Nunito Sans", "Helvetica Neue", Arial, sans-serif;
	--font-mono: "JetBrains Mono", ui-monospace, monospace;

	interpolate-size: allow-keywords;
	font-family: var(--font-body);
	color: var(--ink-700);
	background: var(--cream-50);
}

.eh-mv *,
.eh-mv *::before,
.eh-mv *::after { box-sizing: border-box; }

.eh-mv img { max-width: 100%; height: auto; display: block; }
.eh-mv a { color: inherit; text-decoration: none; }
.eh-mv h1, .eh-mv h2, .eh-mv h3, .eh-mv h4 {
	font-family: var(--font-display); color: var(--forest-900);
	font-weight: 500; line-height: 1.1; margin: 0;
}
.eh-mv p { margin: 0; }

/* === Shared layout / type (mv- prefixed to avoid theme collisions) === */
.eh-mv .mv-container { max-width: 1360px; margin: 0 auto; padding: 0 40px; }
@media (max-width: 720px) { .eh-mv .mv-container { padding: 0 20px; } }

.eh-mv .mv-section { padding: 110px 0; position: relative; }
@media (max-width: 720px) { .eh-mv .mv-section { padding: 70px 0; } }

.eh-mv .mv-eyebrow {
	font-family: var(--font-body); text-transform: uppercase; letter-spacing: 0.28em;
	font-size: 11px; font-weight: 700; color: var(--gold-600);
	display: inline-flex; align-items: center; gap: 12px;
}
.eh-mv .mv-eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--gold-500); }
.eh-mv .mv-eyebrow.center::after { content: ""; width: 28px; height: 1px; background: var(--gold-500); }

/* === Buttons === */
.eh-mv .mv-btn {
	display: inline-flex; align-items: center; gap: 14px;
	padding: 16px 28px; font-size: 12px; font-weight: 700; letter-spacing: 0.18em;
	text-transform: uppercase; border-radius: 0; transition: all 0.25s ease;
	border: 1px solid transparent; white-space: nowrap; cursor: pointer;
}
.eh-mv .mv-btn-gold { background: var(--gold-500); color: var(--forest-900); border-color: var(--gold-500); }
.eh-mv .mv-btn-gold:hover { background: var(--gold-400); border-color: var(--gold-400); transform: translateY(-1px); }
.eh-mv .mv-btn-dark { background: var(--forest-700); color: var(--cream-100); border-color: var(--forest-700); }
.eh-mv .mv-btn-dark:hover { background: var(--forest-900); border-color: var(--forest-900); }
.eh-mv .mv-btn .mv-arrow { width: 18px; height: 1px; background: currentColor; position: relative; transition: width .25s; }
.eh-mv .mv-btn .mv-arrow::after {
	content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px;
	border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg);
}
.eh-mv .mv-btn:hover .mv-arrow { width: 26px; }

/* ============ HERO ============ */
.eh-mv .mv-hero {
	background: var(--forest-900); color: var(--cream-100);
	position: relative; overflow: hidden; padding: 96px 0 104px;
}
.eh-mv .mv-hero::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(ellipse 70% 60% at 78% 24%, rgba(45, 106, 79, 0.42), transparent 62%),
		radial-gradient(ellipse 60% 80% at 14% 86%, rgba(212, 160, 23, 0.10), transparent 60%),
		linear-gradient(180deg, rgba(13, 42, 32, 0.35), rgba(13, 42, 32, 0.96));
}
.eh-mv .mv-hero-grain {
	position: absolute; inset: 0; opacity: 0.5; mix-blend-mode: overlay; pointer-events: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='0.16'/></svg>");
}
.eh-mv .mv-hero-bot { position: absolute; pointer-events: none; color: var(--gold-500); opacity: 0.06; }
.eh-mv .mv-hero-bot.tr { top: -60px; right: -70px; width: 460px; transform: rotate(8deg); }
.eh-mv .mv-hero-bot.bl { bottom: -90px; left: -80px; width: 380px; transform: rotate(-12deg); }
.eh-mv .mv-hero-bot svg { width: 100%; height: auto; }

.eh-mv .mv-hero-inner {
	position: relative; z-index: 2;
	display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 64px; align-items: center;
}
.eh-mv .mv-hero-copy { max-width: 720px; }
@media (max-width: 960px) {
	.eh-mv .mv-hero-inner { grid-template-columns: 1fr; gap: 44px; }
	.eh-mv .mv-hero-figure { max-width: 420px; }
}

.eh-mv .mv-badge {
	display: inline-flex; align-items: center; gap: 12px; padding: 10px 18px;
	border: 1px solid rgba(212, 160, 23, 0.4);
	font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase; font-weight: 700;
	color: var(--gold-400); margin-bottom: 34px;
}
.eh-mv .mv-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-500); }
.eh-mv .mv-hero h1 { color: var(--cream-100); font-size: clamp(46px, 7vw, 92px); font-weight: 400; line-height: 1.04; }
.eh-mv .mv-hero h1 .mv-gold { color: var(--gold-500); font-style: italic; font-weight: 400; }
.eh-mv .mv-hero .mv-sub {
	font-family: var(--font-display); font-style: italic; font-weight: 400;
	font-size: clamp(18px, 2.2vw, 26px); color: rgba(243, 228, 182, 0.82);
	margin: 26px 0 0; max-width: 720px; line-height: 1.45;
}
.eh-mv .mv-hero .mv-intro {
	font-size: 16px; line-height: 1.8; color: rgba(248, 245, 240, 0.72);
	margin: 34px 0 0; max-width: 64ch;
}
.eh-mv .mv-hero-meta {
	display: flex; gap: 48px; flex-wrap: wrap; margin-top: 50px; padding-top: 34px;
	border-top: 1px solid var(--line-dark);
}
.eh-mv .mv-hero-meta .mi .n {
	font-family: var(--font-display); font-size: 40px; color: var(--gold-500); line-height: 1; display: block;
}
.eh-mv .mv-hero-meta .mi .l {
	font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
	color: rgba(243, 228, 182, 0.6); margin-top: 8px; display: block;
}
@media (max-width: 720px) { .eh-mv .mv-hero { padding: 64px 0 70px; } .eh-mv .mv-hero-meta { gap: 30px; } }

/* ---- image slots (editorial placeholders — real photos pending, D7) ---- */
.eh-mv .mv-img-slot {
	aspect-ratio: 4/5;
	background: repeating-linear-gradient(135deg, var(--cream-100) 0 14px, var(--cream-200) 14px 28px);
	border: 1px dashed var(--gold-500); position: relative; overflow: hidden;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	color: var(--herb-600); padding: 30px 26px 0; margin: 0;
}
.eh-mv .mv-img-slot.dark {
	border-color: rgba(212, 160, 23, 0.45); color: var(--gold-400);
	background: repeating-linear-gradient(135deg, rgba(45,106,79,0.20) 0 14px, rgba(13,42,32,0.45) 14px 28px);
}
.eh-mv .mv-img-slot.dark .placehold { color: rgba(243, 228, 182, 0.72); }
.eh-mv .mv-img-slot.dark .mv-slot-badge { background: rgba(13,42,32,0.6); color: rgba(243,228,182,0.7); border-color: var(--line-dark); }
.eh-mv .mv-hero-figure { aspect-ratio: 3/4; }
.eh-mv .mv-why-figure { margin-top: 64px; }
@media (max-width: 900px) { .eh-mv .mv-why-figure { margin-top: 36px; } }

.eh-mv .mv-slot-ratio {
	position: absolute; top: 14px; left: 14px; background: var(--forest-900); color: var(--gold-400);
	font-family: var(--font-mono); font-size: 10px; font-weight: 500; letter-spacing: 0.06em; padding: 5px 10px;
}
.eh-mv .mv-slot-badge {
	position: absolute; top: 14px; right: 14px;
	font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--ink-500); border: 1px solid var(--line); padding: 4px 8px; background: var(--cream-50);
}
.eh-mv .mv-img-slot .illu { width: 50%; max-width: 150px; opacity: 0.85; margin-bottom: 14px; }
.eh-mv .mv-img-slot .illu svg { width: 100%; height: 100%; }
.eh-mv .mv-img-slot .placehold {
	font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--herb-600); font-weight: 500; margin-bottom: 18px;
}
.eh-mv .mv-slot-what {
	margin-top: auto; align-self: stretch; background: var(--forest-900); color: var(--cream-100);
	margin: 0 -26px; padding: 13px 18px; text-align: left;
}
.eh-mv .mv-slot-what .k {
	display: block; font-family: var(--font-mono); font-size: 8.5px; letter-spacing: 0.2em;
	text-transform: uppercase; color: var(--gold-400); margin-bottom: 5px;
}
.eh-mv .mv-slot-what .v { display: block; font-size: 12px; line-height: 1.5; color: var(--cream-100); }
.eh-mv .mv-slot-what .dim {
	display: block; font-family: var(--font-mono); font-size: 10px; color: rgba(243,228,182,0.7);
	margin-top: 6px; letter-spacing: 0.03em;
}
.eh-mv .mv-figure-cap { margin-top: 12px; font-size: 12px; color: var(--ink-500); font-family: var(--font-display); font-style: italic; line-height: 1.5; }

/* ---- real herb photo present: fill the 4:5 slot, hide placeholder scaffolding ---- */
.eh-mv .mv-img-slot.has-img { padding: 0; border-style: solid; border-color: var(--line); background: var(--cream-100); }
.eh-mv .mv-img-slot.has-img > *:not(.mv-slot-img) { display: none; }
.eh-mv .mv-img-slot .mv-slot-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eh-mv .mv-why-figure.has-img { aspect-ratio: 3/4; } /* matches the 900×1200 editorial photo — no crop */

/* ============ EDITORIAL "WHY" ============ */
.eh-mv .mv-why { background: var(--cream-50); }
.eh-mv .mv-why-inner { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 70px; align-items: start; }
@media (max-width: 900px) { .eh-mv .mv-why-inner { grid-template-columns: 1fr; gap: 30px; } }
.eh-mv .mv-why h2 { font-size: clamp(34px, 4vw, 52px); }
.eh-mv .mv-why h2 .mv-gold { color: var(--gold-500); font-style: italic; font-weight: 400; }
.eh-mv .mv-prose { max-width: 70ch; }
.eh-mv .mv-prose p { font-size: 17px; line-height: 1.85; color: var(--ink-700); margin: 0 0 1.3em; }
.eh-mv .mv-prose p:last-child { margin-bottom: 0; }
.eh-mv .mv-prose .lead {
	font-family: var(--font-display); font-weight: 400; font-size: 22px; line-height: 1.5; color: var(--forest-900);
}
.eh-mv .mv-prose strong { color: var(--forest-900); font-weight: 700; }

/* ============ SECTION HEADERS ============ */
.eh-mv .mv-shead { margin-bottom: 56px; }
.eh-mv .mv-shead.center { text-align: center; }
.eh-mv .mv-shead h2 { font-size: clamp(34px, 4.4vw, 58px); margin-top: 16px; }
.eh-mv .mv-shead h2 .mv-gold { color: var(--gold-500); font-style: italic; font-weight: 400; }
.eh-mv .mv-shead p { font-size: 16px; color: var(--ink-500); margin: 18px auto 0; max-width: 60ch; line-height: 1.7; }
.eh-mv .mv-shead.center p { margin-left: auto; margin-right: auto; }

/* ============ HERB ACCORDION ============ */
.eh-mv .mv-herbs { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.eh-mv .mv-herb { border-bottom: 1px solid var(--line); scroll-margin-top: 96px; transition: background .3s; }
.eh-mv .mv-herb[open] { background: var(--cream-100); }
.eh-mv .mv-herb[target-flash] { background: var(--cream-200); }

.eh-mv .mv-herb-head {
	list-style: none; cursor: pointer;
	display: grid; grid-template-columns: 74px 1fr auto; gap: 28px; align-items: center;
	padding: 32px 30px; transition: padding .25s ease;
}
.eh-mv .mv-herb-head::-webkit-details-marker { display: none; }
.eh-mv .mv-herb-head:hover { padding-left: 38px; }
.eh-mv .mv-herb[open] .mv-herb-head:hover { padding-left: 30px; }

.eh-mv .mv-herb-num {
	font-family: var(--font-display); font-style: italic; font-weight: 400;
	font-size: 30px; color: var(--gold-600); font-variant-numeric: tabular-nums;
}
.eh-mv .mv-herb-id { min-width: 0; }
.eh-mv .mv-herb-id h3 {
	font-family: var(--font-display); font-size: clamp(24px, 2.6vw, 32px); font-weight: 500;
	color: var(--forest-900); line-height: 1.12; margin: 0;
}
.eh-mv .mv-herb-common {
	font-family: var(--font-body); font-weight: 600; font-size: 0.62em;
	color: var(--ink-500); letter-spacing: 0.02em;
}
.eh-mv .mv-herb-sci {
	font-family: var(--font-display); font-style: italic; font-weight: 400;
	font-size: 15px; color: var(--gold-600); margin-top: 4px; display: block;
}
.eh-mv .mv-herb-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.eh-mv .mv-form-badge {
	font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 700;
	padding: 5px 11px; white-space: nowrap;
}
.eh-mv .mv-form-badge.liquid { background: var(--forest-900); color: var(--gold-400); }
.eh-mv .mv-form-badge.powder { background: var(--cream-200); color: var(--forest-700); }
.eh-mv .mv-form-badge.capsule { background: var(--herb-600); color: var(--cream-100); }
.eh-mv .mv-chip-mini {
	font-size: 11px; letter-spacing: 0.04em; font-weight: 600; padding: 5px 12px;
	color: var(--herb-600); border: 1px solid var(--line); background: var(--cream-50);
}

.eh-mv .mv-herb-toggle {
	width: 46px; height: 46px; flex-shrink: 0; border: 1px solid var(--forest-700); border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--forest-700); position: relative; transition: all .3s;
}
.eh-mv .mv-herb-toggle::before, .eh-mv .mv-herb-toggle::after {
	content: ""; position: absolute; background: currentColor; transition: transform .3s, opacity .3s;
}
.eh-mv .mv-herb-toggle::before { width: 14px; height: 1.5px; }
.eh-mv .mv-herb-toggle::after { width: 1.5px; height: 14px; }
.eh-mv .mv-herb[open] .mv-herb-toggle { background: var(--gold-500); border-color: var(--gold-500); color: var(--forest-900); }
.eh-mv .mv-herb[open] .mv-herb-toggle::after { transform: scaleY(0); opacity: 0; }

/* expandable content — kept in DOM, animated via interpolate-size + ::details-content */
.eh-mv .mv-herb-body { overflow: hidden; }
.eh-mv .mv-herb::details-content {
	block-size: 0; overflow: clip; opacity: 0;
	transition: block-size .45s ease, opacity .45s ease, content-visibility .45s allow-discrete;
}
.eh-mv .mv-herb[open]::details-content { block-size: auto; opacity: 1; }
@media (prefers-reduced-motion: reduce) { .eh-mv .mv-herb::details-content { transition: none; } }

.eh-mv .mv-herb-inner {
	display: grid; grid-template-columns: 340px 1fr; gap: 48px;
	padding: 8px 30px 52px 102px; align-items: start;
}
@media (max-width: 900px) { .eh-mv .mv-herb-inner { grid-template-columns: 1fr; gap: 28px; padding: 8px 24px 40px; } }

.eh-mv .mv-figure { position: sticky; top: 96px; }
@media (max-width: 900px) { .eh-mv .mv-figure { position: static; } }

/* description side */
.eh-mv .mv-herb-desc p { font-size: 16px; line-height: 1.8; color: var(--ink-700); margin: 0 0 1.2em; }
.eh-mv .mv-herb-desc p:last-of-type { margin-bottom: 0; }

.eh-mv .mv-subhead {
	font-family: var(--font-body); font-size: 10px; font-weight: 700;
	letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-600);
	margin: 34px 0 16px; display: flex; align-items: center; gap: 12px;
}
.eh-mv .mv-subhead::after { content: ""; flex: 1; height: 1px; background: var(--line); }

.eh-mv .mv-benefits { display: flex; flex-wrap: wrap; gap: 10px; }
.eh-mv .mv-chip {
	font-size: 12px; font-weight: 600; letter-spacing: 0.02em; padding: 8px 14px;
	color: var(--forest-800); background: rgba(45, 106, 79, 0.08); border: 1px solid rgba(45, 106, 79, 0.22);
}

.eh-mv .mv-who {
	margin-top: 26px; background: var(--cream-50);
	border: 1px solid var(--line); border-left: 2px solid var(--gold-500); padding: 22px 26px;
}
.eh-mv .mv-who .lbl {
	font-size: 10px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase;
	color: var(--forest-900); display: flex; align-items: center; gap: 10px; margin-bottom: 10px;
}
.eh-mv .mv-who .lbl svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--gold-600); }
.eh-mv .mv-who p { margin: 0; font-size: 15px; line-height: 1.7; color: var(--ink-700); }

/* product block (v1: real product image + price + View product; no qty/AJAX cart) */
.eh-mv .mv-products { margin-top: 38px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.eh-mv .mv-products.single { grid-template-columns: 1fr; max-width: 440px; }
@media (max-width: 620px) { .eh-mv .mv-products { grid-template-columns: 1fr; } }

.eh-mv .mv-prod {
	border: 1px solid var(--line); background: var(--cream-50);
	display: flex; flex-direction: column; transition: border-color .25s;
}
.eh-mv .mv-prod:hover { border-color: var(--gold-500); }
.eh-mv .mv-prod-top { display: flex; gap: 16px; padding: 18px; align-items: flex-start; }
.eh-mv .mv-prod-thumb {
	width: 84px; height: 84px; flex-shrink: 0; overflow: hidden;
	border: 1px solid var(--line); background: var(--cream-100);
}
.eh-mv .mv-prod-thumb img { width: 100%; height: 100%; object-fit: cover; }
.eh-mv .mv-prod-info { min-width: 0; flex: 1; }
.eh-mv .mv-prod-info .fmt {
	font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 700;
	color: var(--gold-600); display: block; margin-bottom: 6px;
}
.eh-mv .mv-prod-info h4 {
	font-family: var(--font-display); font-size: 16px; font-weight: 500; color: var(--forest-900);
	line-height: 1.22; margin: 0;
}
.eh-mv .mv-prod-price {
	font-family: var(--font-display); font-size: 22px; color: var(--forest-900);
	margin-top: 8px; font-variant-numeric: tabular-nums;
}
.eh-mv .mv-prod-price .currency { font-size: 13px; color: var(--ink-500); margin-right: 1px; vertical-align: 2px; }
.eh-mv .mv-prod-price .unit { font-size: 11px; color: var(--ink-500); font-family: var(--font-body); letter-spacing: 0.06em; margin-left: 4px; }

.eh-mv .mv-prod-foot { margin-top: auto; display: flex; flex-direction: column; }
.eh-mv .mv-prod-cart {
	display: flex; align-items: center; justify-content: center; gap: 9px;
	padding: 14px 18px; border-top: 1px solid var(--line);
	background: var(--forest-900); color: var(--cream-100);
	font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700;
	cursor: pointer; transition: background .25s, color .25s; text-align: center;
}
.eh-mv .mv-prod-cart svg { width: 15px; height: 15px; flex-shrink: 0; }
.eh-mv .mv-prod-cart:hover { background: var(--gold-500); color: var(--forest-900); }
.eh-mv .mv-prod-cart.loading { opacity: .65; pointer-events: none; }
.eh-mv .mv-prod-cart.added { background: var(--gold-500); color: var(--forest-900); }
/* WC appends a "View cart" link after AJAX success — drawer already opens, so hide it. */
.eh-mv .mv-prod-foot > .added_to_cart { display: none; }
.eh-mv .mv-prod-link {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 15px 18px; border-top: 1px solid var(--line);
	font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700;
	color: var(--forest-700); transition: background .25s, color .25s;
}
.eh-mv .mv-prod-link:hover { background: var(--forest-900); color: var(--cream-100); }
.eh-mv .mv-prod-link .mv-arrow { width: 16px; height: 1px; background: currentColor; position: relative; transition: width .2s; }
.eh-mv .mv-prod-link .mv-arrow::after {
	content: ""; position: absolute; right: 0; top: -3px; width: 6px; height: 6px;
	border-top: 1px solid currentColor; border-right: 1px solid currentColor; transform: rotate(45deg);
}
.eh-mv .mv-prod-link:hover .mv-arrow { width: 24px; }

/* ============ HOW TO CHOOSE ============ */
.eh-mv .mv-choose-section { background: var(--cream-100); }
.eh-mv .mv-choose { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .eh-mv .mv-choose { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .eh-mv .mv-choose { grid-template-columns: 1fr; } }

.eh-mv .mv-pick {
	background: var(--cream-50); border: 1px solid var(--line);
	padding: 32px 28px 28px; display: flex; flex-direction: column; gap: 14px;
	transition: border-color .25s, transform .25s;
}
.eh-mv .mv-pick:hover { border-color: var(--gold-500); transform: translateY(-3px); }
.eh-mv .mv-pick .goal-ic {
	width: 48px; height: 48px; color: var(--gold-600);
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--line); border-radius: 50%;
}
.eh-mv .mv-pick .goal-ic svg { width: 24px; height: 24px; }
.eh-mv .mv-pick h3 {
	font-family: var(--font-display); font-size: 22px; font-weight: 500; color: var(--forest-900);
	line-height: 1.2; margin: 0;
}
.eh-mv .mv-pick .picks { display: flex; flex-direction: column; gap: 0; margin-top: 4px; }
.eh-mv .mv-pick .picks a {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 12px 0; border-top: 1px solid var(--line);
	font-size: 14px; color: var(--ink-700); transition: color .2s, padding .2s;
}
.eh-mv .mv-pick .picks a:hover { color: var(--gold-600); padding-left: 5px; }
.eh-mv .mv-pick .picks a em { font-family: var(--font-display); font-style: italic; color: var(--forest-900); }
.eh-mv .mv-pick .picks a:hover em { color: var(--gold-600); }
.eh-mv .mv-pick .picks a .jump {
	width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line);
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all .25s;
}
.eh-mv .mv-pick .picks a .jump svg { width: 11px; height: 11px; }
.eh-mv .mv-pick .picks a:hover .jump { background: var(--gold-500); border-color: var(--gold-500); color: var(--forest-900); transform: rotate(-45deg); }
.eh-mv .mv-pick.dark { background: var(--forest-900); border-color: var(--forest-900); }
.eh-mv .mv-pick.dark .goal-ic { color: var(--gold-400); border-color: var(--line-dark); }
.eh-mv .mv-pick.dark h3 { color: var(--cream-100); }
.eh-mv .mv-pick.dark p { font-size: 14px; color: rgba(243,228,182,0.7); margin: 0; line-height: 1.6; }
.eh-mv .mv-pick.dark .mv-btn { margin-top: auto; align-self: flex-start; }

.eh-mv .mv-choose-cta { text-align: center; margin-top: 56px; }

/* ============ FAQ ============ */
.eh-mv .mv-faq-section { background: var(--forest-900); color: var(--cream-100); position: relative; overflow: hidden; }
.eh-mv .mv-faq-section::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse 60% 70% at 82% 18%, rgba(45,106,79,0.4), transparent 60%);
}
.eh-mv .mv-faq-section .mv-shead { position: relative; z-index: 2; }
.eh-mv .mv-faq-section .mv-shead h2 { color: var(--cream-100); }
.eh-mv .mv-faq-section .mv-shead p { color: rgba(243, 228, 182, 0.65); }
.eh-mv .mv-faq-section .mv-eyebrow { color: var(--gold-400); }
.eh-mv .mv-faq-section .mv-eyebrow::before, .eh-mv .mv-faq-section .mv-eyebrow.center::after { background: var(--gold-400); }

.eh-mv .mv-faq { position: relative; z-index: 2; max-width: 860px; margin: 0 auto; border-top: 1px solid var(--line-dark); }
.eh-mv .mv-q { border-bottom: 1px solid var(--line-dark); }
.eh-mv .mv-q-head { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 24px; padding: 28px 8px; }
.eh-mv .mv-q-head::-webkit-details-marker { display: none; }
.eh-mv .mv-q-num {
	font-family: var(--font-display); font-style: italic; font-size: 18px; color: var(--gold-500);
	flex-shrink: 0; font-variant-numeric: tabular-nums;
}
.eh-mv .mv-q-head h3 {
	font-family: var(--font-display); font-size: clamp(19px, 2.1vw, 25px); font-weight: 500;
	color: var(--cream-100); line-height: 1.3; margin: 0; flex: 1;
}
.eh-mv .mv-q[open] .mv-q-head h3 { color: var(--gold-400); }
.eh-mv .mv-q-toggle {
	width: 38px; height: 38px; flex-shrink: 0; border: 1px solid var(--line-dark); border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center; position: relative;
	color: var(--gold-400); transition: all .3s;
}
.eh-mv .mv-q-toggle::before, .eh-mv .mv-q-toggle::after { content:""; position:absolute; background: currentColor; transition: transform .3s, opacity .3s; }
.eh-mv .mv-q-toggle::before { width: 12px; height: 1.5px; }
.eh-mv .mv-q-toggle::after { width: 1.5px; height: 12px; }
.eh-mv .mv-q[open] .mv-q-toggle { background: var(--gold-500); border-color: var(--gold-500); color: var(--forest-900); }
.eh-mv .mv-q[open] .mv-q-toggle::after { transform: scaleY(0); opacity: 0; }

.eh-mv .mv-q::details-content {
	block-size: 0; overflow: clip; opacity: 0;
	transition: block-size .4s ease, opacity .4s ease, content-visibility .4s allow-discrete;
}
.eh-mv .mv-q[open]::details-content { block-size: auto; opacity: 1; }
@media (prefers-reduced-motion: reduce) { .eh-mv .mv-q::details-content { transition: none; } }
.eh-mv .mv-q-body { padding: 0 8px 32px 66px; }
@media (max-width: 600px) { .eh-mv .mv-q-body { padding-left: 8px; } }
.eh-mv .mv-q-body p { margin: 0; font-size: 16px; line-height: 1.85; color: rgba(243, 228, 182, 0.78); }
.eh-mv .mv-q-body p + p { margin-top: 1em; }
.eh-mv .mv-q-body strong { color: var(--cream-100); font-weight: 700; }
.eh-mv .mv-q-body em { font-family: var(--font-display); font-style: italic; color: var(--gold-400); }

/* ============ CLOSING / DISCLAIMER ============ */
.eh-mv .mv-closing { background: var(--cream-50); text-align: center; }
.eh-mv .mv-closing-inner { max-width: 720px; margin: 0 auto; }
.eh-mv .mv-closing h2 { font-size: clamp(30px, 3.6vw, 46px); }
.eh-mv .mv-closing h2 .mv-gold { color: var(--gold-500); font-style: italic; font-weight: 400; }
.eh-mv .mv-closing p { font-size: 17px; line-height: 1.75; color: var(--ink-500); margin: 22px auto 36px; max-width: 56ch; }
.eh-mv .mv-disclaimer {
	max-width: 760px; margin: 70px auto 0; padding-top: 26px; border-top: 1px solid var(--line);
	font-size: 12px; line-height: 1.7; color: var(--ink-500); text-align: center;
}
.eh-mv .mv-disclaimer strong { color: var(--ink-700); font-weight: 700; letter-spacing: 0.02em; }