/* ==========================================================================
   Methodology page (methodology.html)
   Reuses site tokens, home-band eyebrows, methodology spacing, cycle diagram.
   ========================================================================== */

.meth-next-hi {
	color: var(--color-sapphire);
}

.meth-next-hi-bright {
	color: var(--color-bright-blue);
}

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Hero — same gradient treatment as current methodology */
.meth-next-hero {
	background: var(--gradient-brand);
	position: relative;
	overflow: hidden;
}

.meth-next-hero__art {
	position: absolute;
	right: 4%;
	top: 50%;
	transform: translateY(-46%);
	width: clamp(280px, 36vw, 500px);
	aspect-ratio: 1;
	opacity: 0.85;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	pointer-events: none;
}

.meth-next-hero__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 150px 40px 170px;
	box-sizing: border-box;
	position: relative;
}

.meth-next-hero__title {
	margin: 0 0 24px;
	color: var(--color-white);
	font-weight: 300;
	font-size: clamp(32px, 3.6vw, 46px);
	line-height: 1.15;
	max-width: 560px;
}

.meth-next-hero__text {
	margin: 0;
	color: var(--color-white);
	font-size: 18px;
	line-height: 1.55;
	max-width: 680px;
	font-weight: 300;
}

/* Commitment — two-column layout matches Methodology v2 upload */
.meth-next-lede {
	background: var(--color-white);
}

.meth-next-lede__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px;
	box-sizing: border-box;
}

.meth-next-lede__title {
	margin: 0 0 28px;
	max-width: 1040px;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.2;
	color: var(--color-royal-blue);
	text-wrap: pretty;
}

.meth-next-lede__text {
	margin: 0;
	max-width: 1040px;
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

.meth-next-lede__text + .meth-next-lede__text {
	margin-top: 1.25em;
}

/* Cycle — extend existing methodology-cycle look */
.meth-next-cycle {
	background: var(--gradient-midnight-glow);
}

.meth-next-cycle__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 40px 64px;
	align-items: start;
}

.meth-next-cycle__left {
	display: flex;
	flex-direction: column;
	gap: 40px;
	min-width: 0;
}

.meth-next-cycle__intro {
	min-width: 0;
}

.meth-next-cycle__title {
	margin: 0;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.15;
	color: var(--color-white);
}

.meth-next-cycle__card {
	background: rgba(5, 86, 204, 0.22);
	border: 1px solid rgba(110, 180, 247, 0.4);
	border-top: 2px solid var(--color-bright-blue);
	padding: 24px 28px 20px;
	box-sizing: border-box;
	max-width: 480px;
	width: 100%;
}

.meth-next-cycle__num {
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-bright-blue);
	font-variant-numeric: tabular-nums;
	min-width: 4.5em;
	text-align: center;
	opacity: 0;
	transition: opacity 280ms var(--ease-standard);
}

.meth-next-cycle__num.is-in {
	opacity: 1;
}

.meth-next-cycle__footer {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 14px;
	margin-top: 20px;
}

.meth-next-cycle__btn {
	width: 44px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, 0.4);
	background: transparent;
	color: var(--color-white);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	flex: none;
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}

.meth-next-cycle__btn:hover {
	border-color: var(--color-bright-blue);
	color: var(--color-bright-blue);
}

.meth-next-cycle__steps {
	display: grid;
	/* Tallest step body locks height so the card does not jump */
	min-height: 132px;
}

.meth-next-cycle__step {
	grid-area: 1 / 1;
	opacity: 0;
	transition: opacity 280ms var(--ease-standard);
	pointer-events: none;
}

.meth-next-cycle__step.is-in {
	opacity: 1;
	pointer-events: auto;
}

.meth-next-cycle__step-title {
	margin: 0 0 10px;
	font-weight: 300;
	font-size: clamp(22px, 2.2vw, 28px);
	line-height: 1.15;
	color: var(--color-white);
}

.meth-next-cycle__step-body {
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
	color: var(--color-slight-blue);
	font-weight: 300;
}

.meth-next-cycle__diagram {
	display: flex;
	justify-content: center;
	overflow: visible;
	/* Room for curved labels outside the ring */
	padding: 8px 4px 16px;
	box-sizing: border-box;
}

.meth-next-cycle__diagram [data-cyc-meth] {
	cursor: default;
	width: 100%;
	max-width: 540px;
	overflow: visible;
}

/* Meth cycle intro: same timing + stroke weight as home [data-cyc]; then morph to play */
@media (prefers-reduced-motion: no-preference) {
	[data-cyc-meth] .cyc-base {
		opacity: 0.28;
	}

	[data-cyc-meth] .cyc-trail {
		stroke-dasharray: 100 100;
		stroke-dashoffset: 100;
	}

	/* Home cadence: 4.9s draw, nodes every 700ms with the orbiting tip */
	[data-cyc-meth][data-in] .cyc-trail {
		animation: cyc-draw 4.9s linear forwards;
	}

	[data-cyc-meth][data-in] .cyc-dot {
		animation: cyc-orbit 4.9s linear forwards;
	}

	[data-cyc-meth][data-in] .cyc-center {
		transition-delay: 4.7s;
	}

	/* Override home dim (.35) — squares stay invisible until their beat */
	[data-cyc-meth][data-phase='intro'] .cyc-node {
		opacity: 0;
		animation: none;
	}

	[data-cyc-meth][data-phase='intro'][data-in] .cyc-node {
		animation: cyc-meth-node 800ms var(--ease-standard) var(--d) forwards;
	}

	[data-cyc-meth][data-phase='intro'] .cyc-lab {
		opacity: 0;
	}

	[data-cyc-meth][data-phase='intro'][data-in] .cyc-lab {
		opacity: 1;
		transition: opacity 600ms var(--ease-standard);
		transition-delay: var(--d);
	}

	[data-cyc-meth][data-phase='play'] .cyc-base,
	[data-cyc-meth][data-phase='play'] .cyc-trail {
		opacity: 0.16;
		animation: none !important;
		stroke-dashoffset: 0;
		transition: opacity 520ms var(--ease-standard);
	}

	[data-cyc-meth][data-phase='play'] .cyc-dot {
		opacity: 0 !important;
		animation: none !important;
		transition: opacity 320ms var(--ease-standard);
	}

	[data-cyc-meth][data-phase='play'] .cyc-node {
		opacity: 1 !important;
		animation: none !important;
		transform: none !important;
	}

	[data-cyc-meth][data-phase='intro'] .cyc-meth-arc {
		opacity: 0;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-arc {
		opacity: 1;
	}

	/* Intro center stays through full draw; play shell shows after handoff */
	[data-cyc-meth][data-phase='intro'] .cyc-meth-center-play {
		opacity: 0 !important;
		visibility: hidden;
	}

	[data-cyc-meth][data-phase='play'] .cyc-center,
	[data-cyc-meth][data-phase='play'] .cyc-meth-center-intro {
		opacity: 0 !important;
		visibility: hidden;
		transition: none !important;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-center-play {
		visibility: visible;
		opacity: 1;
	}

	/* Only step # / name crossfade — tagline stays put */
	[data-cyc-meth][data-phase='play'] .cyc-meth-center-step {
		opacity: 0;
		transition: opacity 360ms var(--ease-standard);
	}

	[data-cyc-meth][data-phase='play'][data-center-in='1'] .cyc-meth-center-step {
		opacity: 1;
	}

	[data-cyc-meth][data-phase='play'][data-center-in='0'] .cyc-meth-center-step {
		opacity: 0;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-center-tagline {
		opacity: 1;
	}

	[data-cyc-meth][data-phase='play'] .cyc-lab {
		opacity: 1 !important;
		transition: none;
	}
}

@keyframes cyc-meth-node {
	0% {
		opacity: 0;
		transform: scale(0.85);
	}
	40% {
		opacity: 1;
		transform: scale(1.7);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	[data-cyc-meth][data-phase='intro'] .cyc-meth-arc,
	[data-cyc-meth][data-phase='intro'] .cyc-meth-center-play {
		opacity: 0;
		visibility: hidden;
	}

	[data-cyc-meth][data-phase='play'] .cyc-trail,
	[data-cyc-meth][data-phase='play'] .cyc-dot,
	[data-cyc-meth][data-phase='play'] .cyc-meth-center-intro,
	[data-cyc-meth][data-phase='play'] .cyc-center {
		opacity: 0;
		visibility: hidden;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-arc {
		opacity: 1;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-center-play {
		opacity: 1;
		visibility: visible;
	}

	[data-cyc-meth][data-phase='play'][data-center-in='1'] .cyc-meth-center-step {
		opacity: 1;
	}

	[data-cyc-meth][data-phase='play'] .cyc-meth-center-tagline {
		opacity: 1;
	}
}

/* Evaluate */
.meth-next-eval {
	background: var(--color-white);
}

.meth-next-eval__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.meth-next-eval__intro {
	max-width: 960px;
	text-align: center;
	margin-bottom: 24px;
}

.meth-next-eval__label {
	justify-content: center;
}

.meth-next-eval__title {
	margin: 0 0 24px;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.15;
	color: var(--color-royal-blue);
}

.meth-next-eval__text {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

/* Factor lenses — match Factor_Lenses desktop/mobile PNGs */
.meth-next-venn {
	/* ~996px total span at 560; stays inside 1280 container content */
	--venn-size: min(560px, 48vw);
	--venn-shift: calc(var(--venn-size) * 0.22);
	position: relative;
	width: calc(var(--venn-size) * 2 - var(--venn-shift));
	max-width: 100%;
	height: var(--venn-size);
	margin: 56px auto 56px;
}

.meth-next-venn__stage {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 0;
}

.meth-next-venn__disc {
	position: absolute;
	top: 0;
	width: var(--venn-size);
	height: var(--venn-size);
	border-radius: 50%;
	border: 1.5px solid transparent;
	box-sizing: border-box;
	opacity: 0;
	transform: scale(0.96);
	transform-origin: center center;
	transition:
		opacity 900ms var(--ease-standard),
		transform 1100ms var(--ease-standard),
		background-color 480ms var(--ease-standard),
		box-shadow 700ms var(--ease-standard),
		filter 700ms var(--ease-standard);
}

.meth-next-venn.is-in .meth-next-venn__disc--quant {
	opacity: 1;
	transform: scale(1);
	transition-delay: 0ms;
}

.meth-next-venn.is-in .meth-next-venn__disc--qual {
	opacity: 1;
	transform: scale(1);
	transition-delay: 140ms;
}

.meth-next-venn__disc--quant {
	left: 0;
	background: rgba(5, 86, 204, 0.10);
	border-color: var(--color-sapphire);
	z-index: 1;
	color: var(--color-sapphire);
}

.meth-next-venn__disc--qual {
	left: calc(var(--venn-size) - var(--venn-shift));
	background: rgba(2, 201, 181, 0.14);
	border-color: var(--color-turquoise);
	z-index: 1;
	mix-blend-mode: multiply;
	color: var(--color-turquoise);
}

/* Soft light travels along the existing rim — not a second stroke */
.meth-next-venn__ring {
	position: absolute;
	inset: -1px;
	width: calc(100% + 2px);
	height: calc(100% + 2px);
	overflow: visible;
	pointer-events: none;
}

.meth-next-venn__disc--quant .meth-next-venn__ring {
	/* Start at the right (toward Research cycle / overlap) */
	transform: rotate(0deg);
}

.meth-next-venn__disc--qual .meth-next-venn__ring {
	/* Start at the left (toward Research cycle / overlap) */
	transform: rotate(180deg);
}

.meth-next-venn__ring-path {
	fill: none;
	stroke: currentColor;
	/* Hairline rim accent — barely-there edge light */
	stroke-width: 0.9;
	stroke-linecap: round;
	/* Short, fine arc */
	stroke-dasharray: 0.06 0.94;
	stroke-dashoffset: 0;
	opacity: 0;
	filter: blur(0.55px);
}

@keyframes meth-venn-rim-light {
	0% {
		stroke-dashoffset: 0;
		opacity: 0;
	}
	10% {
		opacity: 0.28;
	}
	75% {
		opacity: 0.22;
	}
	100% {
		stroke-dashoffset: -1;
		opacity: 0;
	}
}

.meth-next-venn.is-rim-light .meth-next-venn__disc--quant .meth-next-venn__ring-path {
	animation: meth-venn-rim-light 1.85s cubic-bezier(0.45, 0, 0.2, 1) forwards;
}

.meth-next-venn.is-rim-light .meth-next-venn__disc--qual .meth-next-venn__ring-path {
	animation: meth-venn-rim-light 1.85s cubic-bezier(0.45, 0, 0.2, 1) 0.1s forwards;
}

/* Click focus: solid rim color fill + white type */
.meth-next-venn.is-focus-quant .meth-next-venn__disc--quant {
	background: var(--color-sapphire);
	border-color: var(--color-sapphire);
	z-index: 2;
}

/* Faint partner rim on top — keeps the Research cycle intersection readable */
.meth-next-venn.is-focus-quant .meth-next-venn__disc--qual {
	opacity: 1;
	background: transparent;
	border-color: rgba(2, 201, 181, 0.28);
	mix-blend-mode: normal;
	filter: none;
	box-shadow: none;
	z-index: 3;
}

.meth-next-venn.is-focus-quant .meth-next-venn__pane--qual {
	opacity: 0.34;
}

.meth-next-venn.is-focus-quant .meth-next-venn__pane--quant .meth-next-venn__head,
.meth-next-venn.is-focus-quant .meth-next-venn__pane--quant .meth-next-venn__head-sub,
.meth-next-venn.is-focus-quant .meth-next-venn__pane--quant .meth-next-venn__list li {
	color: #fff;
}

.meth-next-venn.is-focus-qual .meth-next-venn__disc--qual {
	background: var(--color-turquoise);
	border-color: var(--color-turquoise);
	mix-blend-mode: normal;
	z-index: 2;
	opacity: 1;
}

.meth-next-venn.is-focus-qual .meth-next-venn__disc--quant {
	opacity: 1;
	background: transparent;
	border-color: rgba(5, 86, 204, 0.28);
	filter: none;
	box-shadow: none;
	z-index: 3;
}

.meth-next-venn.is-focus-qual .meth-next-venn__pane--quant {
	opacity: 0.34;
}

.meth-next-venn.is-focus-qual .meth-next-venn__pane--qual .meth-next-venn__head,
.meth-next-venn.is-focus-qual .meth-next-venn__pane--qual .meth-next-venn__head-sub,
.meth-next-venn.is-focus-qual .meth-next-venn__pane--qual .meth-next-venn__list li {
	color: #fff;
}

.meth-next-venn.is-focus-quant .meth-next-venn__pane--quant,
.meth-next-venn.is-focus-qual .meth-next-venn__pane--qual {
	opacity: 1;
	z-index: 3;
}

.meth-next-venn.is-focus-quant .meth-next-venn__cycle,
.meth-next-venn.is-focus-qual .meth-next-venn__cycle {
	color: #fff;
}

.meth-next-venn__pane--quant,
.meth-next-venn__pane--qual {
	transition: opacity 420ms var(--ease-standard);
}

.meth-next-venn__pane {
	position: absolute;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	box-sizing: border-box;
}

/* Full-circle panes; shared top padding keeps both headers on one plane */
.meth-next-venn__pane--quant {
	left: 0;
	top: 0;
	width: var(--venn-size);
	height: var(--venn-size);
	justify-content: flex-start;
	padding: 130px calc(var(--venn-shift) * 0.62) 48px 56px;
}

.meth-next-venn__pane--qual {
	left: calc(var(--venn-size) - var(--venn-shift));
	top: 0;
	width: var(--venn-size);
	height: var(--venn-size);
	justify-content: flex-start;
	padding: 130px 56px 48px calc(var(--venn-shift) * 0.62);
}

.meth-next-venn__pane--cycle {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: calc(var(--venn-shift) * 0.9);
	justify-content: center;
	pointer-events: none;
}

.meth-next-venn__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 0 0 28px;
	padding: 0;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.15;
	text-align: center;
	cursor: pointer;
	opacity: 0;
	transform: translateY(10px);
	transition:
		opacity 520ms var(--ease-standard),
		transform 620ms var(--ease-standard),
		filter 320ms var(--ease-standard),
		color 420ms var(--ease-standard);
}

.meth-next-venn__head:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 6px;
	border-radius: 2px;
}

.meth-next-venn__head:hover .meth-next-venn__head-label {
	filter: brightness(1.08);
}

.meth-next-venn__head-label {
	display: block;
}

.meth-next-venn__head-sub {
	display: block;
	font-size: 0.7em;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--color-royal-blue);
	transition: color 420ms var(--ease-standard);
}

.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__head {
	opacity: 1;
	transform: none;
	transition-delay: 280ms;
}

.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__head {
	opacity: 1;
	transform: none;
	transition-delay: 400ms;
}

.meth-next-venn__head--quant {
	color: var(--color-sapphire);
}

.meth-next-venn__head--qual {
	color: var(--color-turquoise);
}

.meth-next-venn__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 17.28px;
	width: 100%;
}

.meth-next-venn__list li {
	margin: 0;
	font-size: clamp(12px, 1.05vw, 14px);
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 1.3;
	max-width: 18em;
	text-align: center;
	color: var(--color-text-muted);
	opacity: 0;
	transform: translateY(8px);
	transition:
		opacity 420ms var(--ease-standard),
		transform 520ms var(--ease-standard),
		color 420ms var(--ease-standard);
}

.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li {
	opacity: 1;
	transform: none;
}

.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li {
	opacity: 1;
	transform: none;
}

.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li:nth-child(1) { transition-delay: 360ms; }
.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li:nth-child(2) { transition-delay: 420ms; }
.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li:nth-child(3) { transition-delay: 480ms; }
.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li:nth-child(4) { transition-delay: 540ms; }
.meth-next-venn.is-in .meth-next-venn__pane--quant .meth-next-venn__list li:nth-child(5) { transition-delay: 600ms; }

.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(1) { transition-delay: 480ms; }
.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(2) { transition-delay: 540ms; }
.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(3) { transition-delay: 600ms; }
.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(4) { transition-delay: 660ms; }
.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(5) { transition-delay: 720ms; }
.meth-next-venn.is-in .meth-next-venn__pane--qual .meth-next-venn__list li:nth-child(6) { transition-delay: 780ms; }

.meth-next-venn__cycle {
	display: block;
	font-size: clamp(10px, 0.8vw, 11px);
	font-weight: 400;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.35;
	color: var(--color-text-muted);
	text-align: center;
	opacity: 0;
	transform: translateY(6px);
	transition:
		opacity 600ms var(--ease-standard),
		transform 700ms var(--ease-standard),
		color 420ms var(--ease-standard);
}

.meth-next-venn.is-in .meth-next-venn__cycle {
	opacity: 1;
	transform: none;
	transition-delay: 720ms;
}

.meth-next-venn__cycle br {
	display: block;
}

@media (prefers-reduced-motion: reduce) {
	.meth-next-venn__disc,
	.meth-next-venn__head,
	.meth-next-venn__list li,
	.meth-next-venn__cycle {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	.meth-next-venn__ring-path {
		opacity: 0 !important;
		animation: none !important;
	}
}

.meth-next-eval__divider {
	position: relative;
	width: 100%;
	max-width: 880px;
	margin: 48px 0 28px;
	text-align: center;
}

.meth-next-eval__divider::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 50%;
	border-top: 1px solid rgba(2, 33, 56, 0.14);
}

.meth-next-eval__divider span {
	position: relative;
	display: inline-block;
	padding: 0 18px;
	background: var(--color-white);
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	font-weight: 400;
}

.meth-next-eval__note {
	margin: 0;
	max-width: 720px;
	text-align: center;
	font-size: 16px;
	line-height: 1.55;
	color: var(--color-text-muted);
	font-weight: 300;
}

/* Desktop: slightly larger evaluate / Venn type (task 130) */
@media (min-width: 961px) {
	.meth-next-eval__title {
		font-size: clamp(32px, 3.2vw, 44px);
	}

	.meth-next-eval__text {
		font-size: 20px;
	}

	.meth-next-venn__head {
		font-size: 22px;
	}

	.meth-next-venn__list li {
		font-size: clamp(13px, 1.15vw, 16px);
	}

	.meth-next-venn__cycle {
		font-size: clamp(11px, 0.9vw, 13px);
	}
}

/* Tablet: keep side-by-side lenses; scale to fit */
@media (max-width: 960px) {
	.meth-next-venn {
		--venn-size: min(450px, 46vw);
	}

	.meth-next-venn__pane--quant {
		padding: 97px calc(var(--venn-shift) * 0.55) 40px 40px;
		justify-content: flex-start;
	}

	.meth-next-venn__pane--qual {
		padding: 97px 40px 40px calc(var(--venn-shift) * 0.55);
		justify-content: flex-start;
	}

	.meth-next-venn__list {
		gap: 14.4px;
	}

	.meth-next-venn__list li {
		font-size: 12px;
	}

	.meth-next-venn__head {
		font-size: 14px;
		margin-bottom: 20px;
	}
}

/* Phone / narrow: stacked lenses */
@media (max-width: 767px) {
	.meth-next-venn {
		--venn-size: min(360px, 92vw);
		--venn-shift: calc(var(--venn-size) * 0.18);
		width: var(--venn-size);
		height: calc(var(--venn-size) * 2 - var(--venn-shift));
		margin-top: 40px;
	}

	.meth-next-venn__disc--quant {
		left: 0;
		top: 0;
	}

	.meth-next-venn__disc--qual {
		left: 0;
		top: calc(var(--venn-size) - var(--venn-shift));
		mix-blend-mode: multiply;
	}

	/* Stacked: start traces at the shared lens (bottom of quant / top of qual) */
	.meth-next-venn__disc--quant .meth-next-venn__ring {
		transform: rotate(90deg);
	}

	.meth-next-venn__disc--qual .meth-next-venn__ring {
		transform: rotate(-90deg);
	}

	.meth-next-venn__pane--quant {
		left: 0;
		top: 0;
		width: 100%;
		/* Clear blue lobe above the lens; vertically center the copy */
		height: calc(var(--venn-size) - var(--venn-shift));
		padding: 14px 30px 18px;
		justify-content: center;
		align-items: center;
		text-align: center;
		transform: none;
	}

	.meth-next-venn__pane--qual {
		left: 0;
		/* Green lobe: lift block so last line clears the narrowing arc */
		top: calc(var(--venn-size) - 10px);
		width: 100%;
		height: calc(var(--venn-size) - var(--venn-shift) + 10px);
		padding: 22px 42px 56px;
		transform: none;
		justify-content: center;
		align-items: center;
		text-align: center;
	}

	.meth-next-venn__pane--cycle {
		left: 50%;
		top: calc(var(--venn-size) - var(--venn-shift) * 0.5);
		width: 80%;
		transform: translate(-50%, -50%);
	}

	.meth-next-venn__list {
		gap: 7.5px; /* +50% vs prior 5px mobile spacing */
		width: 100%;
		max-width: 13.5em;
	}

	/* Same readable size on quant + qual; natural wrap (hide desktop <br> splits) */
	.meth-next-venn__pane--quant .meth-next-venn__list li,
	.meth-next-venn__pane--qual .meth-next-venn__list li {
		font-size: 11px;
		max-width: 100%;
		letter-spacing: 0.035em;
		line-height: 1.22;
	}

	.meth-next-venn__list br {
		display: none;
	}

	.meth-next-venn__head {
		margin-bottom: 16px; /* 2× prior gap under “factors” */
		font-size: 15px;
	}

	.meth-next-venn__cycle {
		font-size: 11px;
		letter-spacing: 0.12em;
		white-space: nowrap;
	}

	.meth-next-venn__cycle br {
		display: none;
	}

	.meth-next-eval__divider {
		margin: 36px 0 20px;
	}

	.meth-next-eval__divider::before {
		top: 0;
	}

	.meth-next-eval__divider span {
		display: block;
		padding: 16px 0 0;
		background: transparent;
	}
}

/* Process */
.meth-next-process {
	background: var(--color-ice-blue);
	position: relative;
	overflow: hidden;
}

.meth-next-process__art {
	position: absolute;
	right: -2%;
	top: 50%;
	transform: translateY(-50%);
	width: min(520px, 46vw);
	aspect-ratio: 1;
	background: rgba(2, 46, 89, 0.14);
	-webkit-mask-image: url('../../assets/icons/assessment-white.svg');
	mask-image: url('../../assets/icons/assessment-white.svg');
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center right;
	mask-position: center right;
	pointer-events: none;
	z-index: 0;
}

.meth-next-process__inner {
	position: relative;
	z-index: 1;
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px;
	box-sizing: border-box;
}

.meth-next-process__copy {
	max-width: 960px;
}

.meth-next-process__title-line {
	display: block;
}

.meth-next-process__title {
	margin: 0 0 28px;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.2;
	color: var(--color-royal-blue);
	text-wrap: pretty;
}

.meth-next-process__text {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	max-width: none;
	color: var(--body-color);
}

/* Verification stats + note (combined under Verifying What We Collect) */
.meth-next-verify__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px 72px;
	margin: 64px 0 48px;
}

.meth-next-verify__col {
	padding-top: 0;
}

.meth-next-verify__label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--color-sapphire);
	margin-bottom: 16px;
}

.meth-next-verify__label--teal {
	/* Bright teal; weight 500 on base label aids readability */
	color: #00D6C0;
}

.meth-next-verify__stat {
	margin: 0 0 24px;
	font-weight: 300;
	font-size: clamp(48px, 6vw, 72px);
	line-height: 1;
	color: var(--color-royal-blue);
	font-variant-numeric: tabular-nums;
}

.meth-next-verify__plus--sap {
	color: var(--color-sapphire);
}

.meth-next-verify__plus--teal {
	color: #00D6C0;
}

.meth-next-verify__body {
	margin: 0;
	font-size: 17px;
	line-height: 1.6;
	color: var(--body-color);
}

.meth-next-verify__banner {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 32px 56px;
	align-items: start;
	padding: 36px 40px;
	margin: 0 0 24px;
	background: rgba(2, 201, 181, 0.1);
	border-top: 2px solid var(--color-turquoise);
	box-sizing: border-box;
}

.meth-next-verify__banner-lead {
	margin: 0;
	font-size: clamp(20px, 2.2vw, 26px);
	font-weight: 300;
	line-height: 1.35;
	color: var(--color-royal-blue);
}

.meth-next-verify__banner-body {
	margin: 0;
	font-size: 17px;
	line-height: 1.6;
	color: var(--body-color);
	font-weight: 300;
}

/* Full-width under both stats; white panel on ice-blue section */
.meth-next-verify__note {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 36px 40px;
	margin: 0;
	background: var(--color-white);
	border-top: 3px solid var(--color-sapphire);
	box-sizing: border-box;
}

.meth-next-verify__subhead {
	margin: 0;
	font-weight: 300;
	font-size: clamp(20px, 2.2vw, 26px);
	line-height: 1.35;
	color: var(--color-royal-blue);
}

.meth-next-verify__note .meth-next-verify__body {
	font-weight: 300;
	max-width: none;
}

@media (max-width: 960px) {
	.meth-next-verify__banner,
	.meth-next-verify__note {
		padding: 28px 24px;
	}
}

/* Eligibility */
.meth-next-elig {
	background: var(--color-white);
	position: relative;
	overflow: hidden;
}

.meth-next-elig__art {
	position: absolute;
	right: 2%;
	top: 52%;
	transform: translateY(-50%);
	width: min(400px, 34vw);
	height: auto;
	color: rgba(5, 86, 204, 0.28);
	pointer-events: none;
	z-index: 0;
}

/* Wide desktop: shift left to fill space once copy + art have clear room */
@media (min-width: 1440px) {
	.meth-next-elig__art {
		right: 8%;
		width: min(460px, 40vw);
	}
}

/* Mid widths: shrink before colliding with copy */
@media (max-width: 1280px) {
	.meth-next-elig__art {
		width: min(280px, 26vw);
		right: 0;
	}
}

/* Too tight for copy + graphic clearance — remove art */
@media (max-width: 1100px) {
	.meth-next-elig__art,
	main section.meth-next-elig > svg.meth-next-elig__art:not([data-vt-reveal]),
	main section.meth-next-elig > svg.meth-next-elig__art[data-vt-reveal] {
		display: none;
	}
}

/* Unlayered override — motion.css hides section > svg at opacity 0 until reveal runs */
main section.meth-next-elig > svg.meth-next-elig__art:not([data-vt-reveal]) {
	opacity: 1;
}

.meth-next-elig__inner {
	position: relative;
	z-index: 1;
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px 56px;
	box-sizing: border-box;
}

.meth-next-elig__copy {
	max-width: 720px;
}

.meth-next-elig__title {
	margin: 0 0 32px;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.15;
	color: var(--color-royal-blue);
}

/* Keep “considered.” on its own line (survives mobile h2 br hide) */
.meth-next-elig__title-line {
	display: block;
}

.meth-next-elig__text {
	margin: 0 0 20px;
	font-size: 18px;
	line-height: 1.6;
	max-width: 640px;
	color: var(--body-color);
}

.meth-next-elig__text:last-of-type {
	margin-bottom: 0;
}

.meth-next-elig__callout {
	margin: 56px 0 0;
	max-width: 640px;
	border-left: 4px solid var(--color-sapphire);
	padding: 2px 0 2px 28px;
}

.meth-next-elig__callout-line {
	display: block;
}

.meth-next-elig__callout p {
	margin: 0;
	font-weight: 300;
	font-size: clamp(22px, 2.4vw, 32px);
	line-height: 1.3;
	color: var(--color-royal-blue);
	text-wrap: pretty;
}

/* Scoring */
.meth-next-score {
	background: var(--color-white);
}

/* Who we rank — ice-blue band between Our Approach and What we evaluate */
.meth-next-rank {
	background: var(--color-ice-blue);
	position: relative;
	overflow: hidden;
}

.meth-next-rank__art {
	position: absolute;
	right: 1%;
	top: 0;
	bottom: 0;
	margin-top: auto;
	margin-bottom: auto;
	width: min(440px, 38vw);
	aspect-ratio: 1;
	background: rgba(2, 46, 89, 0.14);
	-webkit-mask-image: url('../../assets/icons/benchmarks-white.svg');
	mask-image: url('../../assets/icons/benchmarks-white.svg');
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center right;
	mask-position: center right;
	pointer-events: none;
	z-index: 0;
}

@media (min-width: 1440px) {
	.meth-next-rank__art {
		right: 5%;
		width: min(520px, 46vw);
	}
}

@media (max-width: 1280px) {
	.meth-next-rank__art {
		width: min(300px, 28vw);
		right: -2%;
	}
}

@media (max-width: 1100px) {
	.meth-next-rank__art {
		display: none;
	}
}

.meth-next-rank__inner {
	position: relative;
	z-index: 1;
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 112px 40px;
	box-sizing: border-box;
}

.meth-next-rank__copy {
	max-width: 720px;
}

.meth-next-rank__title {
	margin: 0 0 28px;
	font-weight: 300;
	font-size: clamp(28px, 3vw, 40px);
	line-height: 1.2;
	color: var(--color-royal-blue);
	text-wrap: pretty;
}

.meth-next-rank__text {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

.meth-next-rank__text + .meth-next-rank__text {
	margin-top: 1.25em;
}

.meth-next-score__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 32px 40px 112px;
	box-sizing: border-box;
}

.meth-next-score__card {
	background: var(--color-ice-blue);
	border-top: 3px solid var(--color-sapphire);
	padding: 44px 48px;
	box-sizing: border-box;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
	gap: 24px 56px;
	align-items: start;
}

.meth-next-score__title-line {
	display: block;
}

.meth-next-score__title {
	margin: 0;
	font-weight: 300;
	font-size: clamp(24px, 2.4vw, 32px);
	line-height: 1.2;
	color: var(--color-royal-blue);
}

.meth-next-score__exclude {
	list-style: none;
	margin: 20px 0 0;
	padding: 0;
	display: grid;
	gap: 10px;
}

.meth-next-score__exclude-item {
	display: grid;
	grid-template-columns: 1.1em minmax(0, 1fr);
	column-gap: 10px;
	align-items: start;
}

.meth-next-score__exclude-mark {
	display: block;
	width: 1.1em;
	text-align: center;
	font-size: 18px;
	line-height: 1.6;
	font-weight: 500;
	color: var(--color-sapphire);
	user-select: none;
	pointer-events: none;
}

.meth-next-score__exclude-text {
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

.meth-next-score__support {
	margin: 18px 0 0;
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

.meth-next-score__text {
	margin: 0;
	padding-top: 4px;
	font-size: 18px;
	line-height: 1.6;
	color: var(--body-color);
}

/* Responsive */
@media (max-width: 960px) {
	.meth-next-verify__grid,
	.meth-next-score__card {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	/* Mobile/tablet: intro → circle → description card */
	.meth-next-cycle__inner {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			'intro'
			'diagram'
			'card';
		gap: 36px;
	}

	.meth-next-cycle__left {
		display: contents;
	}

	.meth-next-cycle__intro {
		grid-area: intro;
	}

	.meth-next-cycle__diagram {
		grid-area: diagram;
	}

	.meth-next-cycle__card {
		grid-area: card;
		max-width: none;
	}

	.meth-next-hero__inner,
	.meth-next-lede__inner,
	.meth-next-cycle__inner,
	.meth-next-eval__inner,
	.meth-next-process__inner,
	.meth-next-elig__inner {
		padding-block: 80px 40px;
	}

	.meth-next-score__inner {
		padding-block: 24px 80px;
	}

	.meth-next-rank__inner {
		padding-block: 80px;
	}

	/* Single-column tablet: soften side art so it doesn't compete with copy */
	.meth-next-process__art {
		opacity: 0.4;
		right: -12%;
	}

}

@media (max-width: 640px) {
	.meth-next-hero__inner,
	.meth-next-lede__inner,
	.meth-next-cycle__inner,
	.meth-next-eval__inner,
	.meth-next-process__inner,
	.meth-next-elig__inner,
	.meth-next-score__inner,
	.meth-next-rank__inner {
		padding-left: 24px;
		padding-right: 24px;
	}

	.meth-next-elig__inner {
		padding-block: 64px 32px;
	}

	.meth-next-score__inner {
		padding-block: 20px 64px;
	}

	.meth-next-rank__inner {
		padding-block: 64px;
	}

	.meth-next-hero__inner {
		padding-top: 120px;
		padding-bottom: 100px;
	}

	.meth-next-cycle__card,
	.meth-next-score__card {
		padding: 28px 24px;
	}

	.meth-next-cycle__inner {
		gap: 36px;
	}

	.meth-next-cycle__diagram {
		/* Bleed into side padding so the ring reads larger; labels stay on-screen */
		width: min(calc(100% + 48px), calc(100vw - 12px));
		max-width: none;
		margin-left: 50%;
		transform: translateX(-50%);
		padding: 4px 0 20px;
		overflow: visible;
	}

	.meth-next-cycle__diagram [data-cyc-meth] {
		width: 100%;
		max-width: none;
	}

	.meth-next-elig__callout {
		padding-left: 24px;
		margin-top: 48px;
	}

	/* Keep decorative art behind copy; don't crowd body text */
	.meth-next-process__art {
		width: min(280px, 72vw);
		right: -28%;
		opacity: 0.28;
	}

	.meth-next-process__copy {
		max-width: 100%;
	}

	.meth-next-verify__stat {
		font-size: clamp(40px, 12vw, 56px);
	}

	.meth-next-hero__art {
		opacity: 0.35;
		right: -8%;
		width: min(280px, 70vw);
	}
}

/* Narrow phones — hide side art so copy stays crisp */
@media (max-width: 420px) {
	.meth-next-process__art {
		opacity: 0.18;
		right: -36%;
	}

}