/* ─── Home (editorial direction) ───────────────────────── */

/* Premium, immersive, cinematic homepage. Each section owns its own padding;
   sections snap full-bleed and breathe via large negative space.
   Prefix: .home-*. */


/* ─── Shared section primitives ────────────────────────── */

.home-hero, .home-anchor, .home-cinematic, .home-philosophy, .home-education, .home-quote, .home-paths	{	position: relative; isolation: isolate; }

/* Eyebrows use the shared global `.eyebrow` class. The hero overrides it
   to a pill via `.home-hero .eyebrow` below. */







/* ─── 1. Hero ──────────────────────────────────────────── */

/* Full-bleed two-column flex: padded text column on the left, photo flush
   to the viewport right edge. Section-wide subtle 6-column grid lines sit
   behind the dark column (covered by the photo on the right). Tactical
   perimeter overlays — registration plus marks, vertical geo coords, mono
   tag strings — sit absolutely on top. */

.home-hero										{	display: flex; min-height: 60vh;
													background: var(--color-ink-1);
													overflow: hidden;

	/* Layer 0: subtle radial glow + bottom darken */
	&::before								{	content: ""; position: absolute; inset: 0;
													background: radial-gradient(ellipse 80% 60% at 70% 40%, rgba(245, 12, 51, 0.06), transparent 60%), linear-gradient(180deg, transparent 0%, var(--color-ink-0) 100%);
													pointer-events: none; z-index: 0;
	}

	/* Layer 1: 6-column Swiss grid lines (very subtle, hairline whites). */
	&::after									{	content: ""; position: absolute; inset: 0;
													background-image: linear-gradient(to right, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
													background-size: calc(100% / 6) 100%;
													pointer-events: none; z-index: 1;
	}

	/* Both columns sit above the grid + glow layers. */
	> .home-hero-text, > .home-hero-figure{	position: relative; z-index: 2; }

	.home-hero-text							{	flex: 0 1 50%; display: flex; flex-direction: column;
													padding: clamp(5em, 10vw, 10em) clamp(2em, 4vw, 4em) clamp(3em, 6vw, 10em) var(--shell-pad);
	}

	/* Pill eyebrow — overrides the shared global `.eyebrow`. */
	.eyebrow									{	align-self: flex-start;
													margin: 0 0 2em; padding: 0.7em 1.4em;
													background: var(--color-ink-0); border: 1px solid var(--color-rule);
													border-radius: var(--radius-pill);
													color: var(--color-paper);
	}

	h1											{	margin: 0 0 0.7em;
													font-family: var(--font-display); font-size: clamp(3rem, 7.5vw, 8rem);
													font-weight: 500; line-height: 0.95;
													letter-spacing: var(--track-display);

		span, b								{	display: block; }

		b										{	font-weight: inherit; color: var(--color-brand); }
	}

	.home-hero-lede							{	margin: 0 0 2em; max-width: 36ch;
													font-size: var(--fs-4); line-height: 1.55;
													color: var(--color-paper-mute);
	}

	.home-hero-actions						{	display: flex; flex-wrap: wrap; gap: 0.65em; margin: 0; }

	/* Mono tag strings — used for the bottom-of-text-column note and the
	   bottom-of-figure tag overlay. */
	.home-hero-tag							{	display: inline-block;
													font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-brand);
													pointer-events: none;
	}

	.home-hero-tag--text					{	margin-top: auto; padding-top: clamp(3em, 6vw, 5em); }

	.home-hero-figure						{	flex: 1 1 55%; position: relative;
													margin: 0; overflow: hidden;
													background: var(--color-ink-2);

		img									{	position: absolute; inset: 0; width: 100%; height: 100%;
													object-fit: cover; object-position: center 30%;
													filter: contrast(1.05) brightness(0.95);
		}
		&::after								{	content: ""; position: absolute; inset: 0;
													background: linear-gradient(115deg, transparent 35%, rgba(245, 12, 51, 0.10) 100%);
													mix-blend-mode: screen;
													pointer-events: none; z-index: 2;
		}

		.home-hero-coords					{	position: absolute; right: 1em; top: 50%;
													transform: translateY(-50%);
													writing-mode: vertical-rl; margin: 0;
													font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); color: var(--color-brand);
													z-index: 4;
													pointer-events: none;
		}

		.home-hero-tag--figure				{	position: absolute; bottom: 1.5em; left: 1.5em; z-index: 4; }
	}

	/* Holographic plate schematic — large wireframe straddling the seam
	   between the text column and the photo, bridging the two. Hairline
	   strokes + dim colour keep it atmospheric; spins via .cfu-holo. */
	.home-hero-holo							{	--holo-size: clamp(280px, 35vw, 650px);
													--parallax-range: 30px;
													position: absolute; z-index: 3;
													left: calc(46% - var(--holo-size) / 2);
													bottom: -3%;
													width: var(--holo-size);
													color: var(--color-paper-low);
	}

	@media (max-width: 1100px)			{	flex-direction: column; min-height: 0;

		> .home-hero-text					{	flex: 1 1 auto; padding: 4em var(--shell-pad) 3em; }
		> .home-hero-figure					{	flex: 1 1 auto; order: -1; aspect-ratio: 4 / 3; max-height: 60vh; }
		.home-hero-figure .home-hero-coords	{	display: none; }
		.home-hero-holo						{	display: none; }
		.home-hero-tag--text					{	padding-top: 2em; }
	}

	@media (max-width: 700px)			{

		/* Editorial reorder: eyebrow + H1 lead, the photo slots in next,
		   then the lede, CTAs and tag line. The text column dissolves
		   (display: contents) so its children join the section's flex
		   column and can interleave with the figure. */
		> .home-hero-text					{	display: contents; }

		.eyebrow, h1, .home-hero-lede,
		.home-hero-actions,
		.home-hero-tag--text					{	position: relative; z-index: 2;
													margin-inline: var(--shell-pad);
		}

		.eyebrow								{	order: 1; margin-top: 2.5em; margin-bottom: 1.75em; }
		h1										{	order: 2; margin-bottom: 0.55em; }
		> .home-hero-figure					{	order: 3; margin-bottom: 2.25em; }
		.home-hero-lede						{	order: 4; }
		.home-hero-actions					{	order: 5; flex-direction: column; align-items: stretch; }
		.home-hero-actions .btn			{	width: 100%; }
		.home-hero-tag--text					{	order: 6; margin-top: 0; margin-bottom: 2.5em; padding-top: 1.25em; }
	}
}

/* Hero entrance choreography — split-line mask rise on the headline
   (the one place the design system sanctions it), staggered fade-up on the
   supporting copy, slow settle on the photo. CSS-only, runs once on load. */

@media (prefers-reduced-motion: no-preference)	{

	.home-hero .eyebrow							{	animation: home-hero-rise 420ms var(--ease-out) both; }

	.home-hero h1 > *							{	animation: home-hero-line 640ms var(--ease-out) 100ms both; }
	.home-hero h1 > :nth-child(2)				{	animation-delay: 230ms; }

	.home-hero .home-hero-lede					{	animation: home-hero-rise 420ms var(--ease-out) 380ms both; }
	.home-hero .home-hero-actions				{	animation: home-hero-rise 420ms var(--ease-out) 480ms both; }
	.home-hero .home-hero-tag--text			{	animation: home-hero-rise 420ms var(--ease-out) 600ms both; }

	.home-hero-figure img						{	animation: home-hero-photo 1100ms var(--ease-out) both; }
	.home-hero-figure .home-hero-tag--figure	{	animation: home-hero-rise 420ms var(--ease-out) 650ms both; }

	/* Coords keep their translateY(-50%) centring — fade only. */
	.home-hero-figure .home-hero-coords		{	animation: home-hero-fade 600ms var(--ease-out) 650ms both; }
}

@keyframes home-hero-fade					{
	from											{	opacity: 0; }
	to												{	opacity: 1; }
}

@keyframes home-hero-line					{
	from											{	opacity: 0; transform: translateY(0.45em); clip-path: inset(0 -0.2em 95% -0.2em); }
	to												{	opacity: 1; transform: none; clip-path: inset(-0.2em -0.2em -0.3em -0.2em); }
}

@keyframes home-hero-rise					{
	from											{	opacity: 0; transform: translateY(14px); }
	to												{	opacity: 1; transform: none; }
}

@keyframes home-hero-photo					{
	from											{	opacity: 0; transform: scale(1.04); }
	to												{	opacity: 1; transform: none; }
}








/* ─── 1.5 Today's classes (timetable strip) ────────────── */

/* Full-bleed band directly under the hero — top/bottom rules form a hard
   horizontal divide. Today's sessions run left-to-right, AM to PM, on a row
   that scrolls horizontally if it overflows. Data: timetable.json. */

.home-today										{	position: relative; isolation: isolate;
													background: var(--color-ink-0);
													border-top: 1px solid var(--color-rule-strong);
													border-bottom: 1px solid var(--color-rule-strong);

	.home-today-bar								{	display: flex; align-items: center; gap: clamp(1.5rem, 4vw, 3.5rem);
													max-width: var(--layout-wide); margin-inline: auto;
													padding: clamp(1.1rem, 2.5vw, 1.75rem) var(--shell-pad);
	}

	.home-today-head							{	flex: 0 0 auto; }

	.home-today-title							{	margin: 0.5em 0 0;
													font-family: var(--font-display);
													font-size: clamp(1.05rem, 1.6vw, 1.4rem); font-weight: 700;
													line-height: 1; letter-spacing: -0.01em; text-transform: uppercase;
													color: var(--color-paper);
	}

	.home-today-rest							{	margin: 0;
													font-family: var(--font-mono); font-size: 12px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-mute);

		a										{	color: var(--color-brand); }
	}

	/* Class row — scrolls horizontally when it overflows */
	.home-today-list							{	flex: 1 1 auto; min-width: 0;
													display: flex; align-items: stretch; gap: 0;
													margin: 0; padding: 0; list-style: none;
													overflow-x: auto; -webkit-overflow-scrolling: touch;
													scrollbar-width: none;
		&::-webkit-scrollbar					{	display: none; }
	}

	.home-today-class							{	flex: 0 0 auto;
													display: flex; flex-direction: column; gap: 0.5em;
													padding: 0 clamp(1rem, 2vw, 1.75rem);
													border-left: 1px solid var(--color-rule);
		&:first-child							{	padding-left: 0; border-left: none; }
	}

	.home-today-time							{	font-family: var(--font-mono); font-size: 11px; font-weight: 500;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-low); line-height: 1;
	}

	/* Next upcoming class — brand-red time line with a pulsing square
	   swatch and a mono "next" label. Marked server-side (Sydney time). */
	.home-today-class--next .home-today-time	{	display: inline-flex; align-items: center; gap: 0.6em;
													color: var(--color-brand);

		&::before								{	content: ""; flex: 0 0 auto; width: 6px; height: 6px;
													background: currentColor;
													animation: home-today-pulse 1.6s ease-in-out infinite;
		}

		&::after								{	content: "next"; }
	}

	/* Class name keeps its .class-type-* accent colour (set in global.css) */
	.home-today-name							{	font-family: var(--font-display);
													font-size: clamp(1rem, 1.5vw, 1.35rem); font-weight: 600;
													line-height: 1; letter-spacing: -0.01em; white-space: nowrap;
	}

	.home-today-coach							{	font-family: var(--font-mono); font-size: 10px; font-weight: 500;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													line-height: 1; color: var(--color-paper-quiet); white-space: nowrap;

		b										{	color: var(--color-paper-low); }
	}

	.home-today-all								{	flex: 0 0 auto;
													font-family: var(--font-mono); font-size: 11px; font-weight: 500;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-mute); text-decoration: none;
													transition: color var(--dur-fast) var(--ease-out);
		&:hover									{	color: var(--color-paper); }
	}

	@media (max-width: 900px)					{

		.home-today-bar							{	flex-direction: column; align-items: stretch; gap: 1.25em; }

		.home-today-list						{	padding-bottom: 0.25em; }

		.home-today-all							{	align-self: flex-start; }
	}
}

@keyframes home-today-pulse					{
	0%, 100%									{	opacity: 1; }
	50%											{	opacity: 0.2; }
}

@media (prefers-reduced-motion: reduce)		{
	.home-today .home-today-class--next .home-today-time::before	{	animation: none; }
}


/* ─── 2. Emotional anchor ──────────────────────────────── */

/* Full-bleed split: text column left (padded), photo flush right.
   Flex with default `align-items: stretch` lets the figure scale
   to the text column's natural height. */

.home-anchor									{	display: flex;
													background: var(--color-ink-0);

	> *										{	flex: 1 1 50%; min-width: 0; }

	.home-anchor-text						{	padding: clamp(5em, 12vw, 9em) clamp(2em, 5vw, 5em) clamp(5em, 12vw, 9em) var(--shell-pad);
	}

	h2											{	margin: 0 0 clamp(2.5em, 6vw, 4em); max-width: 18ch;
													font-family: var(--font-display);
													font-size: clamp(2.25rem, 5.5vw, 4.75rem); font-weight: 500;
													line-height: 1; letter-spacing: var(--track-display);
													color: var(--color-paper);

		b										{	display: block; margin-top: 0.18em;
													font-weight: inherit; color: var(--color-brand);
		}
	}

	.home-anchor-values						{	display: flex; flex-wrap: wrap; gap: 2.5em 3em;
													margin: 0; padding: 0;
													list-style: none;

		li										{	flex: 1 1 calc(50% - 1.5em); min-width: 22ch;
													padding-top: 1.5em;
													border-top: 1px solid var(--color-rule);
		}

		span									{	display: block; margin-bottom: 1em;
													font-family: var(--font-mono); font-size: 12px;
													letter-spacing: var(--track-mono); color: var(--color-brand);
		}

		h3										{	margin: 0 0 0.6em;
													font-family: var(--font-display);
													font-size: clamp(1.25rem, 2vw, 1.625rem); font-weight: 600;
													line-height: 1.15; letter-spacing: -0.015em; color: var(--color-paper);
		}

		p										{	margin: 0; max-width: 32ch;
													font-size: var(--fs-4); line-height: 1.55;
													color: var(--color-paper-mute);
		}
	}

	.home-anchor-figure						{	position: relative;
													margin: 0; overflow: hidden;
													background: var(--color-ink-2);

		img									{	position: absolute; inset: 0; width: 100%; height: 100%;
													object-fit: cover; object-position: center;
													filter: contrast(1.05) brightness(0.95);
		}
		&::after								{	content: "";
													position: absolute; inset: 0;
													background: linear-gradient(180deg, transparent 60%, rgba(5, 6, 6, 0.5) 100%);
													pointer-events: none;
		}
	}

	@media (max-width: 1100px)			{	flex-direction: column;
		.home-anchor-text					{	padding: clamp(3em, 9vw, 5em) var(--shell-pad); }
		.home-anchor-figure					{	order: -1; aspect-ratio: 16 / 10; }
	}

	@media (max-width: 700px)			{
		.home-anchor-values					{	gap: 2em;
			li									{	flex: 1 1 100%; min-width: 0; }
		}
	}
}







/* ─── 3. Offerings (paths) ─────────────────────────────── */

/* The offerings chooser is now the shared `.cfu-offerings` component in
   global.css (markup: core/includes/cfu-offerings.php), used here and on the
   What We Offer detail pages. No home-specific styles needed. */







/* ─── 4. Cinematic break ───────────────────────────────── */

/* Full-bleed image as background layer, centered text overlay above it. */

.home-cinematic								{	min-height: clamp(420px, 70vh, 760px);
													display: flex; align-items: center; justify-content: center;
													overflow: hidden;
													background: var(--color-ink-0);

	.home-cinematic-image					{	position: absolute; inset: 0; z-index: 0;
		img									{	width: 100%; height: 100%;
													object-fit: cover; object-position: center;
													filter: grayscale(0.85) contrast(1.1) brightness(0.55);
		}
		&::after								{	content: "";
													position: absolute; inset: 0;
													background: radial-gradient(ellipse 70% 60% at 50% 50%, transparent 0%, rgba(0, 0, 0, 0.45) 70%, rgba(0, 0, 0, 0.85) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, transparent 30%, transparent 70%, rgba(0, 0, 0, 0.4) 100%);
													pointer-events: none;
		}
	}

	.home-cinematic-text					{	position: relative; z-index: 1; max-width: var(--layout-wide);
													padding: 5em var(--shell-pad);
													text-align: center;
	}

	h2											{	margin: 0 0 0.5em;
													font-family: var(--font-display); font-size: clamp(3rem, 9vw, 8rem);
													font-weight: 700; line-height: 0.92; letter-spacing: -0.035em;
													text-transform: uppercase; color: var(--color-paper);
		span, b								{	display: block; }
		b										{	font-weight: inherit; color: var(--color-brand); }
	}

	.home-cinematic-text p					{	margin: 1em 0 0;
													font-family: var(--font-mono); font-size: 12px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-mute);
	}
}


/* ─── 5. Coaching philosophy ───────────────────────────── */

/* Header on top, figure + themes share a flex row below, coaches band closes.
   Figure stretches to themes column height via flex's default `align-items: stretch`. */

.home-philosophy								{	padding: clamp(5em, 12vw, 9em) var(--shell-pad);
													background: var(--color-ink-1);
													display: flex; flex-direction: column; gap: clamp(3em, 6vw, 5em);

	.home-philosophy-head					{	max-width: 1280px; }

	h2											{	margin: 0 0 0.6em; max-width: 16ch;
													font-family: var(--font-display);
													font-size: clamp(2.25rem, 5vw, 4.5rem); font-weight: 500;
													line-height: 1.02; letter-spacing: var(--track-display);
													color: var(--color-paper);

		b										{	display: block; font-weight: inherit; color: var(--color-brand); }
	}

	.home-philosophy-lede					{	margin: 0; max-width: 52ch;
													font-size: var(--fs-4); line-height: 1.55;
													color: var(--color-paper-mute);
	}

	.home-philosophy-body					{	display: flex; gap: clamp(3em, 5vw, 5em);

		> *									{	flex: 1 1 50%; min-width: 0; }
	}

	.home-philosophy-figure				{	position: relative; margin: 0; overflow: hidden;
													background: var(--color-ink-2);
		img									{	position: absolute; inset: 0;
													width: 100%; height: 100%;
													object-fit: cover; object-position: center;
													filter: grayscale(0.15) contrast(1.05) brightness(0.95);
		}
		&::after								{	content: ""; position: absolute; inset: 0;
													background: linear-gradient(180deg, transparent 65%, rgba(5, 6, 6, 0.55) 100%);
													pointer-events: none;
		}
	}

	.home-philosophy-themes				{	margin: 0;
		div									{	display: flex; flex-wrap: wrap; gap: 0.5em 2em;
													padding: 1.4em 0;
													border-top: 1px solid var(--color-rule);
													align-items: baseline;
			&:last-child						{	border-bottom: 1px solid var(--color-rule); }
		}
		dt										{	flex: 0 0 9em; margin: 0;
													font-family: var(--font-display);
													font-size: clamp(1.125rem, 1.6vw, 1.5rem); font-weight: 600;
													letter-spacing: -0.01em; color: var(--color-paper);
		}
		dd										{	flex: 1 1 18ch; margin: 0;
													font-size: var(--fs-4); line-height: 1.5;
													color: var(--color-paper-mute);
		}
	}

	.home-philosophy-coaches				{	display: flex; flex-wrap: wrap; align-items: end; gap: 2.5em 4em;
													padding-top: 3.5em;
													border-top: 1px solid var(--color-rule);

		> span								{	flex: 0 0 auto; margin: 0;
													font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-low);
		}

		ul										{	flex: 1 1 auto; display: flex; flex-wrap: wrap; gap: 2em 4em;
													margin: 0; padding: 0; list-style: none;
		}

		li										{	flex: 1 1 calc(50% - 2em); min-width: 18ch;
													display: flex; flex-direction: column; gap: 0.35em;
			b									{	font-family: var(--font-display);
													font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 600;
													letter-spacing: -0.02em; line-height: 1; color: var(--color-paper);
			}
			span								{	font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-brand);
			}
			small								{	font-size: var(--fs-5); line-height: 1.4;
													color: var(--color-paper-mute);
			}
		}

		> a									{	flex: 0 0 auto;
													font-family: var(--font-display); font-size: 13px; font-weight: 700;
													letter-spacing: var(--track-eyebrow); text-transform: uppercase;
													text-decoration: none;
													border-bottom: 1px solid var(--color-paper-quiet);
													padding-bottom: 0.4em;
													white-space: nowrap;
													transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);

			&, &:visited					{	color: var(--color-paper); }
			&:hover, &:visited:hover	{	color: var(--color-brand); border-color: var(--color-brand); }
		}
	}

	@media (max-width: 1100px)			{
		.home-philosophy-body				{	flex-direction: column; }
		.home-philosophy-figure			{	aspect-ratio: 16 / 10; max-height: 60vh; }
		.home-philosophy-coaches			{	align-items: stretch; }
	}

	@media (max-width: 700px)			{
		.home-philosophy-themes div		{	gap: 0.4em; padding: 1.2em 0; }
		.home-philosophy-themes dt		{	flex: 1 1 100%; }
		.home-philosophy-coaches li		{	flex: 1 1 100%; }
	}
}








/* ─── 6. Movement & education ──────────────────────────── */

/* Right-anchored head (asymmetric), then a flex-wrap grid of items.
   List border-top is the strong rule; per-item bottom + right hairlines
   form the rest of the matrix. */

.home-education								{	padding: clamp(5em, 12vw, 9em) var(--shell-pad);
													background: var(--color-ink-0);

	/* Plate schematic as compositional counterweight to the right-anchored
	   head — sits in the deliberately empty top-left. */
	.home-education-plate					{	position: absolute; top: clamp(3em, 7vw, 5em); left: var(--shell-pad);
													width: clamp(220px, 24vw, 380px);
	}

	.home-education-head					{	margin: 0 0 5em auto; max-width: 720px; text-align: right; }

	h2											{	margin: 0 0 0.8em auto; max-width: 18ch;
													font-family: var(--font-display); font-size: clamp(2rem, 5vw, 4.5rem);
													font-weight: 500; line-height: 1.02;
													letter-spacing: var(--track-display); color: var(--color-paper);

		b										{	display: block; font-weight: inherit; color: var(--color-brand); }
	}

	.home-education-lede					{	margin: 0 0 0 auto; max-width: 38ch;
													font-size: var(--fs-4); line-height: 1.55;
													color: var(--color-paper-mute);
	}

	.home-education-list					{	display: flex; flex-wrap: wrap;
													margin: 0; padding: 0;
													list-style: none;
													border-top: 1px solid var(--color-rule-strong);

		li										{	flex: 1 1 33.333%; min-width: 22ch; padding: 2em;
													border-right: 1px solid var(--color-rule);
													border-bottom: 1px solid var(--color-rule);
			&:nth-child(3n)				{	border-right: none; }
		}

		span									{	display: block; margin-bottom: 1.5em;
													font-family: var(--font-mono); font-size: 12px;
													letter-spacing: var(--track-mono); color: var(--color-brand);
		}

		h3										{	margin: 0 0 0.5em;
													font-family: var(--font-display);
													font-size: clamp(1.25rem, 1.9vw, 1.75rem); font-weight: 600;
													letter-spacing: -0.015em; line-height: 1.1; color: var(--color-paper);
		}

		p										{	margin: 0; max-width: 32ch;
													font-size: var(--fs-4); line-height: 1.5;
													color: var(--color-paper-mute);
		}
	}

	@media (max-width: 1100px)			{
		.home-education-plate				{	display: none; }
		.home-education-head				{	margin-left: 0; text-align: left; }
		h2, .home-education-lede			{	margin-inline: 0; }
		.home-education-list				{
			li									{	flex: 1 1 50%; border-right: 1px solid var(--color-rule); }
			li:nth-child(3n)				{	border-right: 1px solid var(--color-rule); }
			li:nth-child(2n)				{	border-right: none; }
		}
	}

	@media (max-width: 700px)			{
		.home-education-list li, .home-education-list li:nth-child(3n), .home-education-list li:nth-child(2n)	{	flex: 1 1 100%; border-right: none; padding: 1.75em 0; }
	}
}








/* ─── 7. Editorial quote (social proof) ────────────────── */

/* Centred testimonial over a full-bleed member photo — same backdrop
   grammar as .home-cinematic: cover image, B&W grade, radial scrim
   keeping the quote legible. */

.home-quote									{	padding: clamp(5em, 14vw, 11em) var(--shell-pad);
													background: var(--color-ink-1);
													overflow: hidden;

	.home-quote-image						{	position: absolute; inset: 0; z-index: 0;
		img									{	width: 100%; height: 100%;
													object-fit: cover; object-position: center 30%;
													filter: grayscale(0.85) contrast(1.08) brightness(0.5);
		}
		&::after								{	content: "";
													position: absolute; inset: 0;
													background: radial-gradient(ellipse 75% 70% at 50% 50%, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.55) 65%, rgba(0, 0, 0, 0.85) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, transparent 30%, transparent 70%, rgba(0, 0, 0, 0.45) 100%);
													pointer-events: none;
		}
	}

	figure									{	position: relative; z-index: 1;
													max-width: 1280px; margin: 0 auto; text-align: center;
	}
	.eyebrow									{	margin: 0 0 2em; }
	blockquote								{	margin: 0; padding: 0; border: 0; }
	h2											{	margin: 0;
													font-family: var(--font-display); font-size: clamp(2rem, 6.5vw, 5.5rem);
													font-weight: 500; line-height: 1.05; letter-spacing: -0.025em;
													color: var(--color-paper);
		span									{	color: var(--color-brand); font-weight: 600; }
	}
	figcaption								{	margin: 2.5em 0 0;
													font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-low);
	}
}









/* ─── 8. Choose your path ──────────────────────────────── */

/* 2-up flex-wrap grid; each item keeps its own border-bottom + right
   border on odd items. At narrow widths items go single column. */

.home-paths									{	padding: clamp(5em, 12vw, 9em) var(--shell-pad);
													background: var(--color-ink-0);
	.home-paths-head							{	max-width: var(--layout-wide); margin: 0 auto 4em; }
	h2											{	margin: 0;
													font-family: var(--font-display);
													font-size: clamp(2.25rem, 5.5vw, 5rem); font-weight: 500;
													line-height: 1; letter-spacing: var(--track-display);
													color: var(--color-paper);
		b										{	font-weight: inherit; color: var(--color-brand); }
	}

	.home-paths-list							{	display: flex; flex-wrap: wrap; max-width: var(--layout-wide);
													margin: 0 auto; padding: 0;
													list-style: none; border-top: 1px solid var(--color-rule);

		li										{	flex: 1 1 50%; min-width: 22ch;
													border-bottom: 1px solid var(--color-rule);
		}

		li:nth-child(odd)					{	border-right: 1px solid var(--color-rule); }
	}

	.home-paths-list a						{	display: flex; align-items: center; gap: 2em;
													padding: 2.2em 1.5em 2.2em 1em;
													text-decoration: none;
													transition: background var(--dur-base) var(--ease-out), padding-left var(--dur-base) var(--ease-out);

		&, &:visited						{	color: var(--color-paper); }

		/* label + sub group */
		> div									{	flex: 1 1 0; min-width: 0;
													display: flex; flex-direction: column; gap: 0.4em;
		}

		b										{	font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 2.5rem);
													font-weight: 600; letter-spacing: -0.02em; line-height: 1.05;
													color: var(--color-paper);
													transition: color var(--dur-base) var(--ease-out);
		}

		div span								{	font-family: var(--font-mono); font-size: 11px;
													letter-spacing: var(--track-mono); text-transform: uppercase;
													color: var(--color-paper-low);
		}

		/* arrow */
		> span								{	flex: 0 0 auto;
													font-family: var(--font-display); font-size: 1.5em;
													color: var(--color-paper-low);
													transition: transform var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out);
		}
		&:hover, &:focus-visible		{	background: rgba(245, 12, 51, 0.06);
													padding-left: 2em; outline: none;
			b									{	color: var(--color-brand); }
			> span							{	transform: translateX(0.4em); color: var(--color-brand); }
		}
	}

	@media (max-width: 700px)			{
		.home-paths-list li, .home-paths-list li:nth-child(odd)	{	border-right: none; }
		.home-paths-list a					{	padding: 1.7em 1em;
			&:hover, &:focus-visible	{	padding-left: 1.5em; }
		}
	}
}

/* (Final closing CTA renders via core/includes/cfu-cta-band.php — see global.css.) */