/* Metabolism benefits landing page: patterns/lovable-page-metabolism-benefits.php.
   Loaded only on /metabolism-benefits/, after assets/css/lovable.css. */

/* ---------- Metabolism benefits: patterns/lovable-page-metabolism-benefits.php ---------- */

/* Text sizes come from the design-system layer (.nv-lp-lead / -text /
   -small / -fine / -note / -kicker / -card-title) and the theme h1/h2/h3;
   rules here are layout, surfaces and the page's own components (hero
   caption cycler, fat/lean bar chart, systems map, compare matrix). */

/* Every <figure> is a photo with its caption underneath. acf-blocks.css
   (novos-extended) ships a global figure:not(.wp-block-image){display:flex},
   which lays the caption beside the image; this outranks it. */

.nv-mb .nv-mb__figure { display: block; margin: 0; }

/* Photo frames are the shared .nv-lp-photo; this page's frames keep the
   theme's md radius. The phases photo is a 16:9 crop anchored to its top,
   which no shared modifier expresses. */

.nv-mb .nv-lp-photo { border-radius: var(--nv-radius); }

.nv-mb .nv-mb__figure-frame--wide { aspect-ratio: 16 / 9; }

.nv-mb .nv-mb__figure-frame--wide img { object-position: center top; }

/* Section heads. A head that opens a column (chapters, the science
   callout) sits closer to what follows it than one above a full grid. */

.nv-mb .nv-mb__head--tight { margin-bottom: var(--wp--preset--spacing--30); }

.nv-mb .nv-lp-head > .nv-organic-line + * { margin-top: var(--wp--preset--spacing--20); }

.nv-mb .nv-lp-head + .nv-lp-grid { margin-top: 0; }

.nv-mb :is(.nv-lp-band--ink, .nv-lp-band--warm) .nv-organic-line { color: var(--nv-border-on-dark); }

.nv-mb .nv-disclosure { margin-top: var(--wp--preset--spacing--20); }

.nv-mb .nv-lp-actions { margin-top: var(--wp--preset--spacing--30); }

.nv-mb__card-body { display: flex; flex: 1; flex-direction: column; gap: var(--wp--preset--spacing--10); padding: var(--wp--preset--spacing--30); }

.nv-mb__card-body > h3 { margin: 0; }

.nv-mb__card-body > .nv-lp-small { margin-top: 0; }

.nv-mb__card-body > .nv-lp-chips,
.nv-mb__card-body > .nv-lp-actions { margin-top: auto; padding: var(--wp--preset--spacing--10) 0 0; }

/* Three-item grids: three columns wherever they fit, else one — never a
   2 + 1 row. */

.nv-mb .nv-mb__grid--trio { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 719px) {
	.nv-mb .nv-mb__grid--trio { grid-template-columns: minmax(0, 1fr); }
}

/* Toggle rows are .nv-lp-chips--tight with a margin, not padding, under them. */

.nv-mb .nv-mb__toggle-row { margin-bottom: var(--wp--preset--spacing--30); padding-bottom: 0; }

.nv-mb__bullets { display: grid; gap: var(--wp--preset--spacing--10); padding-left: var(--wp--preset--spacing--30); }

/* ---------- Hero ---------- */

.nv-mb__hero { position: relative; overflow: hidden; }

.nv-mb__hero-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); gap: var(--wp--preset--spacing--60); align-items: start; padding-bottom: var(--wp--preset--spacing--50); }

.nv-mb__hero-title { margin: var(--wp--preset--spacing--20) 0 0; }

.nv-mb__hero-lead { max-width: 44ch; margin-top: var(--wp--preset--spacing--30); }

.nv-mb__hero .nv-lp-chips { margin-top: var(--wp--preset--spacing--30); }

.nv-mb .nv-mb__hero-media { position: relative; }

/* Sits over the lower third of the hero photo, on its own gradient scrim, so
   the layer cycler reads as part of the image rather than a caption under it. */

.nv-mb__hero-caption { position: absolute; bottom: 0; inset-inline: 0; display: flex; flex-direction: column; gap: 4px; margin: 0; padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--30) var(--wp--preset--spacing--30); border-radius: 0 0 var(--nv-radius) var(--nv-radius); background: linear-gradient(to top, color-mix(in srgb, var(--nv-ink) 94%, transparent) 0%, color-mix(in srgb, var(--nv-ink) 82%, transparent) 52%, transparent 100%); pointer-events: none; }

.nv-mb__hero-caption span { font-family: var(--nv-mono); font-size: var(--nv-fs-mono); letter-spacing: 0.02em; color: color-mix(in srgb, var(--nv-white) 55%, transparent); transition: color var(--nv-dur) var(--nv-ease); }

.nv-mb__hero-caption span.is-active { color: var(--nv-orange-soft); }

.nv-mb__hero-foot { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20); padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--nv-border-on-dark); }

.nv-mb__hero-foot-title { font-family: var(--nv-serif); font-size: var(--nv-fs-h3); font-weight: 600; color: var(--nv-white); }

/* ---------- Trust strip ---------- */

/* Each claim carries its own leading dot, so a wrapped line never starts
   with a stray separator. */

.nv-mb__trust { border-top: 1px solid var(--nv-border-on-dark); }

.nv-mb__trust-row { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30); margin: 0; padding: 0; list-style: none; font-family: var(--nv-mono); font-size: var(--wp--preset--font-size--small); letter-spacing: 0.03em; color: var(--nv-on-dark-muted); }

.nv-mb__trust-row li { display: inline-flex; align-items: baseline; gap: var(--wp--preset--spacing--10); }

.nv-mb__trust-row li::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--nv-orange-soft); transform: translateY(-1px); }

.nv-mb__trust-row--secondary { margin-top: var(--wp--preset--spacing--20); color: color-mix(in srgb, var(--nv-white) 60%, transparent); }

/* Phones: a left-aligned list, so two-line claims don't zigzag. */

@media (max-width: 619px) {
	.nv-mb__trust-row { flex-direction: column; align-items: flex-start; }

	.nv-mb__trust-row--secondary { margin-top: var(--wp--preset--spacing--10); }
}

/* ---------- Science callout: dash list + fat/lean bar chart ---------- */

.nv-mb__science-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); gap: var(--wp--preset--spacing--60); align-items: end; }

.nv-mb__dash-list { display: grid; gap: var(--wp--preset--spacing--10); padding: 0; list-style: none; }

.nv-mb__dash-list li { display: flex; gap: var(--wp--preset--spacing--10); }

.nv-mb__dash-list li > span:first-child { color: var(--nv-orange-soft); }

/* One bar, always full width: the two segments are shares of the same weight
   lost, so shrinking the fat share visibly grows the muscle share. Two
   separate bars read as "shorter is better", which is the opposite here.
   The widths below are the first state; lovable.js swaps them on toggle. */

.nv-mb__barchart { display: grid; gap: var(--wp--preset--spacing--20); }

.nv-mb__barchart-title { margin: 0; font-family: var(--nv-mono); font-size: var(--nv-fs-mono); letter-spacing: 0.04em; text-transform: uppercase; color: var(--nv-on-dark-muted); }

.nv-mb__barchart-stack { display: flex; height: 46px; overflow: hidden; border-radius: var(--nv-radius-pill); background: color-mix(in srgb, var(--nv-white) 14%, transparent); }

.nv-mb__barchart-seg { display: flex; align-items: center; justify-content: center; overflow: hidden; font-family: var(--nv-mono); font-size: var(--wp--preset--font-size--small); font-weight: 700; transition: width var(--nv-dur-slow) var(--nv-ease); }

.nv-mb__barchart-seg--fat { width: 82%; background: var(--nv-orange); color: var(--nv-white); }

.nv-mb__barchart-seg--lean { width: 18%; background: var(--nv-white); color: var(--nv-ink); }

.nv-mb__barchart-key { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--30); font-family: var(--nv-mono); font-size: var(--nv-fs-mono); color: var(--nv-on-dark-muted); }

.nv-mb__barchart-key-item { display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--10); }

.nv-mb__barchart-key-item::before { content: ""; width: 12px; height: 12px; border-radius: var(--nv-radius-tile); }

.nv-mb__barchart-key-item--fat::before { background: var(--nv-orange); }

.nv-mb__barchart-key-item--lean::before { background: var(--nv-white); }

.nv-mb__chart-note { margin-top: var(--wp--preset--spacing--30); }

/* ---------- Systems map ---------- */

.nv-mb__systems-layout { display: grid; gap: var(--wp--preset--spacing--30); }

.nv-mb__systems-tabs { display: flex; gap: var(--wp--preset--spacing--10); overflow-x: auto; }

.nv-mb__systems-summary { padding-top: var(--wp--preset--spacing--30); border-top: 1px solid var(--nv-border-on-dark); }

.nv-mb__systems-title { max-width: 36ch; margin: var(--wp--preset--spacing--20) 0 0; }

.nv-mb__systems-why { max-width: 62ch; margin-top: var(--wp--preset--spacing--20); }

.nv-mb__systems-why strong { color: var(--nv-white); }

/* Four products, so the columns divide evenly at every width rather than
   leaving a lone tile on its own row. */

.nv-mb__systems-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--30); }

.nv-mb__systems-role { padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--10); border-radius: var(--nv-radius); background: color-mix(in srgb, var(--nv-white) 6%, transparent); text-align: center; }

.nv-mb__systems-role.is-direct { background: color-mix(in srgb, var(--nv-orange) 22%, transparent); }

.nv-mb__systems-role img { display: block; width: min(140px, 100%); height: auto; aspect-ratio: 1 / 1; margin-inline: auto; border-radius: var(--nv-radius-sm); object-fit: cover; }

.nv-mb__systems-role p { margin: var(--wp--preset--spacing--10) 0 0; font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--nv-white); }

.nv-mb__systems-role .nv-mb__systems-role-level { margin: 2px 0 0; font-family: var(--nv-mono); font-size: var(--nv-fs-mono); font-weight: 400; color: var(--nv-on-dark-muted); }

.nv-mb__systems-role.is-direct .nv-mb__systems-role-level { color: var(--nv-orange-soft); }

.nv-mb__systems-note { margin-top: var(--wp--preset--spacing--20); }

@media (min-width: 900px) {
	.nv-mb__systems-layout { grid-template-columns: minmax(220px, 290px) minmax(0, 1fr); gap: var(--wp--preset--spacing--40); align-items: start; }

	.nv-mb__systems-tabs { flex-direction: column; overflow-x: visible; }

	.nv-mb__systems-tabs .nv-filter-pill { justify-content: flex-start; text-align: left; white-space: normal; }

	.nv-mb__systems-panels { padding: var(--wp--preset--spacing--40); border: 1px solid var(--nv-border-on-dark); border-radius: var(--nv-radius-lg); background: color-mix(in srgb, var(--nv-white) 4%, transparent); }

	.nv-mb__systems-panels .nv-mb__systems-summary { padding-top: 0; border-top: 0; }
}

@media (min-width: 1280px) {
	.nv-mb__systems-roles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- Product system tabs ---------- */

.nv-mb__tabs { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--10); }

.nv-mb__product-grid { display: grid; grid-template-columns: minmax(0, min(26rem, 40%)) minmax(0, 1fr); gap: var(--wp--preset--spacing--50); align-items: center; margin-top: var(--wp--preset--spacing--40); }

.nv-mb__product-copy > h3 { margin: var(--wp--preset--spacing--10) 0 var(--wp--preset--spacing--20); }

.nv-mb__product-media,
.nv-mb__chapter-media,
.nv-mb__start-media { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; background: var(--nv-white); }

.nv-mb__product-media,
.nv-mb__chapter-media { border-radius: var(--nv-radius-sm); }

.nv-mb .nv-lp-band--white :is(.nv-mb__product-media, .nv-mb__chapter-media) { border: 1px solid var(--nv-ink-10); }

.nv-mb__product-media img,
.nv-mb__start-media img { width: 88%; height: 88%; object-fit: contain; }

.nv-mb__chapter-media img { width: 82%; height: 82%; object-fit: contain; }

@media (max-width: 779px) {
	.nv-mb__product-grid { grid-template-columns: minmax(0, 1fr); }

	.nv-mb__product-media { max-width: 26rem; }
}

/* ---------- Chapters (Bar / Core / Vital / Boost) ---------- */

/* Copy and photo share one row; the photo column is capped so it sits
   next to the copy instead of floating in half the page. --flip puts the
   photo first (Core, Boost) without changing the reading order. */

.nv-mb__chapter-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, min(28rem, 42%)); gap: var(--wp--preset--spacing--60); align-items: start; }

.nv-mb__chapter-grid--flip { grid-template-columns: minmax(0, min(28rem, 42%)) minmax(0, 1fr); }

.nv-mb__chapter-grid--flip > .nv-mb__chapter-media { order: -1; }

.nv-mb__chapter-media--wide { aspect-ratio: 4 / 3; }

.nv-mb__bar-media { display: grid; gap: var(--wp--preset--spacing--20); align-content: start; }

@media (max-width: 979px) {
	.nv-mb__chapter-grid,
	.nv-mb__chapter-grid--flip { grid-template-columns: minmax(0, 1fr); gap: var(--wp--preset--spacing--40); }

	.nv-mb__chapter-media,
	.nv-mb__bar-media { max-width: 28rem; }
}

.nv-mb .nv-mb__chapter-label--vital { display: flex; align-items: center; gap: var(--wp--preset--spacing--10); color: var(--nv-ink-80); }

.nv-mb .nv-mb__chapter-label--vital::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--nv-clinical-green); }

.nv-mb__chapter-more { padding-top: 0; }

.nv-mb__chapter-more > h3 { margin: 0; }

.nv-mb__chapter-more > .nv-lp-text { max-width: 70ch; margin-top: var(--wp--preset--spacing--10); }

.nv-mb__chapter-more > .nv-lp-grid { margin-top: var(--wp--preset--spacing--30); }

.nv-mb__ing-title { margin: 0; font-size: var(--wp--preset--font-size--body); }

.nv-mb__ing-body .nv-lp-small { margin-top: var(--wp--preset--spacing--10); }

.nv-mb .nv-mb__chapter-cta { margin-top: var(--wp--preset--spacing--40); }

/* BenefitList: checkmarked bullets. */

.nv-mb__benefit-list { display: grid; gap: var(--wp--preset--spacing--10); margin: 0 0 var(--wp--preset--spacing--10); padding: 0; list-style: none; }

.nv-mb__benefit-list li { display: flex; gap: var(--wp--preset--spacing--10); color: var(--nv-ink-80); }

.nv-mb__benefit-list svg { flex: none; width: 18px; height: 18px; margin-top: 2px; color: var(--nv-orange-deep); }

/* Boost: five-step flow and two illustrations. Five steps in one row
   where they fit, otherwise a single column — never a 4 + 1 or 2 + 2 + 1. */

/* The panel is a large dark card; its steps set their own colours, so it
   keeps the band's text colour rather than the card's muted one. */

.nv-mb .nv-mb__boost-panel { color: inherit; }

.nv-mb .nv-evidence-step-row { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.nv-mb .nv-evidence-step__title { font-size: var(--nv-fs-lead); letter-spacing: -0.01em; line-height: 1.18; }

.nv-mb__boost-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--40); }

@media (max-width: 979px) {
	.nv-mb .nv-evidence-step-row { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 619px) {
	.nv-mb .nv-mb__boost-panel { padding: var(--wp--preset--spacing--30); }

	.nv-mb__boost-figures { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Loss vs. maintenance ---------- */

.nv-mb__phases-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); }

.nv-mb__phases-panel { transition: opacity var(--nv-dur) var(--nv-ease); }

.nv-mb__phases-panel.is-dim { opacity: 0.42; }

.nv-mb__phases-panel > h3 { margin: var(--wp--preset--spacing--10) 0 0; }

.nv-mb__phases-panel > .nv-mb__bullets { margin-top: var(--wp--preset--spacing--20); }

.nv-mb .nv-mb__phases-figure { margin-top: var(--wp--preset--spacing--40); }

.nv-mb__phases-note { max-width: 70ch; margin-top: var(--wp--preset--spacing--30); }

@media (max-width: 719px) {
	.nv-mb__phases-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Compare matrix ---------- */

.nv-mb__compare-scroll { overflow-x: auto; }

.nv-mb__compare-table { width: 100%; border-collapse: collapse; }

.nv-mb__compare-table caption { padding-bottom: var(--wp--preset--spacing--20); text-align: left; }

.nv-mb__compare-table th,
.nv-mb__compare-table td { padding: var(--wp--preset--spacing--10); border-bottom: 1px solid var(--nv-ink-10); }

.nv-mb__compare-table thead th { border-bottom-color: var(--nv-ink-20); text-align: center; vertical-align: bottom; }

.nv-mb__compare-table tbody th,
.nv-mb__compare-table tfoot th { font-size: var(--wp--preset--font-size--small); font-weight: 600; text-align: left; color: var(--nv-ink); }

.nv-mb__compare-table td { text-align: center; }

.nv-mb__compare-col-link { display: flex; flex-direction: column; align-items: center; gap: var(--wp--preset--spacing--10); text-decoration: none; }

.nv-mb__compare-col-link img { width: 48px; height: 48px; border-radius: var(--wp--custom--radius--thumb); object-fit: cover; }

.nv-mb__compare-col-link span { font-size: var(--wp--preset--font-size--small); font-weight: 700; color: var(--nv-ink); }

.nv-mb__compare-link { display: inline-flex; align-items: center; min-height: 32px; padding-inline: var(--wp--preset--spacing--10); font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--nv-orange-deep); text-decoration: none; }

.nv-mb__compare-link:hover,
.nv-mb__compare-link:focus-visible { color: var(--nv-ink); text-decoration: underline; text-underline-offset: 0.2em; }

/* Role tags with every tier legible: Indirect and No
   Role were ink-60 / ink-40 on a tinted ground (about 3:1 and 1.9:1). No
   Role keeps the weakest look through a dashed outline, not faint text. */

.nv-mb .nv-role-tag--indirect { border-color: var(--nv-ink-40); color: var(--nv-ink-80); }

.nv-mb .nv-role-tag--none { border: 1px dashed var(--nv-ink-40); font-weight: 400; color: var(--nv-ink-80); }

/* Phones: one block per system, the four products as a 2 x 2 of
   name + role, instead of a 640px table in a sideways scroller. */

@media (max-width: 719px) {
	.nv-mb__compare-table,
	.nv-mb__compare-table caption,
	.nv-mb__compare-table tbody,
	.nv-mb__compare-table tfoot { display: block; }

	.nv-mb__compare-table thead { display: none; }

	.nv-mb__compare-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20); padding: var(--wp--preset--spacing--20) 0; border-bottom: 1px solid var(--nv-ink-10); }

	.nv-mb__compare-table tbody tr:first-child { border-top: 1px solid var(--nv-ink-20); }

	.nv-mb__compare-table th,
	.nv-mb__compare-table td { padding: 0; border: 0; }

	.nv-mb__compare-table tr > th { grid-column: 1 / -1; }

	.nv-mb__compare-table td { display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--10); text-align: left; }

	.nv-mb__compare-table td[data-label]::before { content: attr(data-label); font-size: var(--wp--preset--font-size--small); font-weight: 600; color: var(--nv-ink); }

	.nv-mb__compare-table tfoot td { justify-content: flex-start; }
}

/* Goal picker */

.nv-mb__goal { margin-top: var(--wp--preset--spacing--60); }

.nv-mb__goal-result > h3 { margin: var(--wp--preset--spacing--10) 0 0; }

.nv-mb__goal-result > .nv-lp-text { margin-top: var(--wp--preset--spacing--20); }

.nv-mb__goal-products { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20); margin-top: var(--wp--preset--spacing--20); }

.nv-mb__goal-products a { display: flex; align-items: center; gap: var(--wp--preset--spacing--10); font-weight: 600; color: var(--nv-ink); text-decoration: none; }

.nv-mb__goal-products a:hover { color: var(--nv-orange-deep); }

.nv-mb__goal-products img { width: 88px; height: 88px; padding: var(--wp--preset--spacing--10); box-sizing: border-box; border-radius: var(--nv-radius-xs); background: var(--nv-white); object-fit: contain; }

/* ---------- Where to start / science transparency / scientists ---------- */

.nv-mb__finder { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--30); margin-top: var(--wp--preset--spacing--30); }

.nv-mb__finder h3 { margin: 0; }

.nv-mb__finder .nv-lp-text { margin-top: var(--wp--preset--spacing--10); }

.nv-mb__evidence-card > .nv-lp-small { margin-top: var(--wp--preset--spacing--10); }

/* Advisor cards: novos_lp_person() in this page's card shape — the
   .nv-lp-card border, a 120px portrait, the name at card-title size over a
   mono role line, and the bio last, one mono line-height below the role. */

.nv-mb .nv-mb__scientist-card { gap: 0; border: 1px solid var(--nv-ink-10); }

.nv-mb__scientist-card .nv-lp-person__avatar { width: 120px; height: 120px; }

.nv-mb__scientist-card .nv-lp-person__foot { gap: var(--wp--preset--spacing--10); margin-top: var(--wp--preset--spacing--20); padding-top: 0; border-top: 0; }

.nv-mb__scientist-card .nv-lp-person__name { font-size: var(--nv-fs-lead); line-height: 1.2; letter-spacing: -0.01em; }

.nv-mb__scientist-card .nv-lp-person__role { font-family: var(--nv-mono); line-height: inherit; }

.nv-mb__scientist-card .nv-lp-person__bio { flex: none; order: 1; margin-top: var(--nv-fs-mono); }

/* ---------- Health note ---------- */

.nv-mb__health { border-block: 1px solid var(--nv-ink-10); }

.nv-mb__health .nv-lp-small { max-width: 80ch; }

/* ---------- Final CTA ---------- */

/* A flush dark card that is a link: keeps the band's text colour and lifts on hover. */

.nv-mb .nv-mb__final-card { color: inherit; text-decoration: none; transition: border-color var(--nv-dur) var(--nv-ease), background var(--nv-dur) var(--nv-ease); }

.nv-mb__final-card:hover,
.nv-mb__final-card:focus-visible { border-color: var(--nv-orange-soft); background: color-mix(in srgb, var(--nv-white) 10%, transparent); color: inherit; }

.nv-mb__final-media { display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; background: color-mix(in srgb, var(--nv-white) 6%, transparent); }

.nv-mb__final-media img { width: 88%; height: 88%; object-fit: contain; }

.nv-mb__final-body { padding: var(--wp--preset--spacing--20); }

.nv-mb__final-body > .nv-lp-note { margin-top: var(--wp--preset--spacing--10); }