/*
 * Destination pages (Phase 5; docs/PAGES.md). New selectors only: the frozen homepage CSS
 * (home.css) is not touched. The template "destination" (templates/destination.html) puts the
 * page content in main.fct-destination without an automatic title: each page's H1 is in its opener.
 *
 * "Wat we doen" (approved 2026-10-06): the opener (text block + fct/system-print, side by side
 * from 960 px, stacked below; the separate phone composition is in the block), "Wanneer helpt FCT?",
 * the work-form rows, the Sage bridge, the optional evidence (fct/curated-cards) and the closing
 * contact band. Sizes are fluid and meet the approved values at the review widths
 * (qa/tools/lib/wwd-page.mjs). Margins follow the homepage: 6.5 % from 900 px, the root padding
 * below.
 */

.fct-destination {
	--m: clamp(16px, 5vw, 32px);
	--pad: clamp(56px, calc(40px + 5.33vw), 72px);
	--h2: clamp(28px, calc(18.7px + 2.22vw), 32px);
	--when: clamp(18px, calc(15.2px + 0.82vw), 20px);
	--bridge: clamp(30px, calc(14px + 3.6vw), 36px);
	--copy: clamp(17px, calc(15px + 0.5vw), 18px);
}

/* 600–959 px: the approved tablet values (88 px sections, H2 36 at 768). */
@media (min-width: 600px) {
	.fct-destination {
		--pad: clamp(72px, calc(72px + (100vw - 600px) * 0.0952), 88px);
		--h2: clamp(32px, calc(17.7px + 2.38vw), 38px);
		--when: clamp(20px, calc(12.86px + 1.19vw), 23px);
		--bridge: clamp(36px, calc(14.6px + 3.57vw), 44px);
	}
}

@media (min-width: 900px) {
	.fct-destination {
		--m: 6.5vw;
	}
}

@media (min-width: 960px) {
	.fct-destination {
		--pad: clamp(96px, calc(48px + 5vw), 120px);
		--h2: clamp(38px, calc(26px + 1.25vw), 44px);
		--when: clamp(23px, calc(17px + 0.625vw), 26px);
		--bridge: clamp(44px, calc(28px + 1.667vw), 52px);
	}
}

/* Sections meet edge to edge; each sets its own spacing. */
.fct-destination .wp-block-post-content > *,
.fct-destination .is-layout-flow > * {
	margin-block: 0;
}

.fct-destination :is(.fct-wwd-opener, .fct-wwd-sec, .fct-wwd-bridge, .fct-wwd-band) {
	box-sizing: border-box;
	padding-inline: var(--m);
}

.fct-destination :is(.fct-wwd-row, .fct-wwd-band__inner, .fct-curated__inner) {
	max-width: 1252px;
	margin-inline: auto;
}

.fct-destination .fct-wwd-line {
	display: block;
}

.fct-destination .fct-wwd-h2 {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--h2);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.015em;
}

/* Provisional copy stays visibly provisional (docs/FCT_CONTENT_BRIEF.md §13). */
.fct-destination .fct-tbd {
	padding: 0 0.25em;
	border-radius: 3px;
	background: var(--wp--preset--color--sage);
	color: var(--wp--preset--color--forest);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* A quiet text link with the theme's arrow. */
.fct-destination .fct-wwd-link {
	margin-top: 24px;
}

.fct-destination .fct-wwd-link a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--wp--preset--color--forest);
	font-weight: 600;
	text-decoration: none;
	text-underline-offset: 4px;
}

.fct-destination .fct-wwd-link a::after {
	content: "";
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: var(--fct-button-arrow) center / contain no-repeat;
	mask: var(--fct-button-arrow) center / contain no-repeat;
	transition: transform 180ms ease;
}

.fct-destination .fct-wwd-link a:hover {
	text-decoration: underline;
}

.fct-destination .fct-wwd-link a:hover::after {
	transform: translateX(2px);
}

/* --- opener --------------------------------------------------------------------------------------- */

.fct-destination .fct-wwd-opener {
	--t: clamp(52px, calc(4px + 5vw), 76px);

	container-type: inline-size;
	display: grid;
	grid-template-areas: "o";
	align-items: start;
	padding-top: clamp(48px, calc(32px + 1.667vw), 56px);
	padding-bottom: clamp(18px, calc(40px - (100vw - 1024px) * 0.053), 46px);
}

.fct-destination .fct-wwd-opener > * {
	grid-area: o;
}

.fct-destination .fct-wwd-opener__text {
	position: relative;
	z-index: 1;
	justify-self: start;
	width: clamp(360px, calc(50vw - 120px), 600px);
}

.fct-destination .fct-wwd-opener .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-wwd-opener__title {
	color: var(--wp--preset--color--forest);
	font-size: var(--t);
	line-height: 1.02;
	letter-spacing: -0.02em;
}

.fct-destination .fct-wwd-opener__body {
	max-width: clamp(360px, calc(80px + 29.17vw), 500px);
	margin-top: calc(0.53 * var(--t));
	font-size: clamp(17px, calc(15px + 0.2083vw), 18px);
	line-height: 1.6;
}

.fct-destination .fct-wwd-opener__actions {
	margin-top: 28px;
}

/* The print: right-aligned to the margin, its photo on the eyebrow's line (−16 px at 1440). */
.fct-destination .fct-wwd-opener .fct-print {
	justify-self: end;
	margin-top: calc(4px - (var(--u) - 0.53px) * 42.55 - 22 * var(--u));
}

@media (min-width: 1280px) {
	.fct-destination .fct-wwd-opener__actions {
		margin-top: 36px;
	}

	/*
	 * WCAG 1.4.12 (Phase 6C): up to about 1500 px the print's Echt werk ring lies within the text column's width,
	 * below the text. With the test's text spacing the text runs down into it, so the text is then 70 px narrower
	 * and ends left of the ring (its label moves under the ring, blocks/system-print). Switched on any change of the
	 * text's designed line height (1.6; the test sets 1.5): at 1.6 the measure is exactly the frozen one.
	 */
	.fct-destination .fct-wwd-opener__body {
		--fct-spaced: calc(max(1lh - 1.6em, 1.6em - 1lh) - 0.5px);

		max-width: clamp(
			calc(clamp(360px, calc(80px + 29.17vw), 500px) - 70px),
			calc(clamp(360px, calc(80px + 29.17vw), 500px) - var(--fct-spaced) * 1000),
			clamp(360px, calc(80px + 29.17vw), 500px)
		);
	}
}

@media (max-width: 959.98px) {
	.fct-destination .fct-wwd-opener {
		--t: clamp(36px, calc(24.6px + 3.57vw), 52px);

		grid-template-areas: "t" "a";
		padding-top: clamp(24px, calc(14px + 3.15vw), 44px);
		padding-bottom: 24px;
	}

	.fct-destination .fct-wwd-opener__text {
		grid-area: t;
		width: auto;
		max-width: 640px;
	}

	.fct-destination .fct-wwd-opener__body {
		max-width: 560px;
		font-size: clamp(16px, calc(14.75px + 0.3vw), 17px);
	}

	.fct-destination .fct-wwd-opener .fct-print {
		grid-area: a;
		margin-top: 33px;
	}
}

@media (max-width: 767.98px) {
	.fct-destination .fct-wwd-opener__body {
		max-width: 500px;
	}
}

@media (max-width: 600px) {
	.fct-destination .fct-wwd-opener .fct-print {
		margin-top: 28px;
	}
}

/* --- rows: heading left, content right from 960 px ------------------------------------------------- */

.fct-destination .fct-wwd-sec {
	padding-top: var(--pad);
}

.fct-destination .fct-wwd-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 20px;
}

@media (min-width: 960px) {
	.fct-destination .fct-wwd-row {
		grid-template-columns: clamp(280px, calc(80px + 20.83vw), 380px) minmax(0, 1fr);
		column-gap: clamp(36px, calc(16px + 2.083vw), 46px);
		row-gap: 0;
	}
}

/* Wanneer helpt FCT? */
.fct-destination .fct-wwd-when__list {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.fct-destination .fct-wwd-when__list li {
	margin: 0;
	padding: 16px 0 18px;
	border-top: 1px solid rgb(18 56 61 / 22%);
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--when);
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -0.005em;
}

.fct-destination .fct-wwd-when__list li:last-child {
	border-bottom: 1px solid rgb(18 56 61 / 22%);
}

@media (min-width: 600px) {
	.fct-destination .fct-wwd-when__list li {
		padding: 22px 0 24px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-wwd-when__list {
		margin-top: 0;
	}

}

/* Werkvormen */
.fct-destination .fct-wwd-forms__lead {
	max-width: 560px;
	margin-top: 4px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-wwd-form {
	padding: 28px 0 32px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

/* Below 1200 px a work form is one stacked unit: title and subtitle, then the lead and the
   labelled details directly below them (a two-column row there left a tall empty column under
   the title). The two-column row returns from 1200 px (approved 1440 composition). */
.fct-destination .fct-wwd-row.fct-wwd-form {
	grid-template-columns: minmax(0, 1fr);
	row-gap: 16px;
}

@media (min-width: 1200px) {
	.fct-destination .fct-wwd-row.fct-wwd-form {
		grid-template-columns: clamp(280px, calc(80px + 20.83vw), 380px) minmax(0, 1fr);
		column-gap: clamp(36px, calc(16px + 2.083vw), 46px);
		row-gap: 0;
	}
}

.fct-destination .fct-wwd-forms__head + .fct-wwd-form {
	margin-top: 36px;
}

.fct-destination .fct-wwd-form__title {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(24px, calc(17px + 1.5vw), 28px);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.01em;
}

.fct-destination .fct-wwd-form__sub {
	margin-top: 10px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--body);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fct-destination .fct-wwd-form__lead {
	max-width: 680px;
	color: var(--wp--preset--color--charcoal);
	font-size: clamp(16px, calc(15px + 0.33vw), 18px);
	line-height: 1.55;
}

.fct-destination .fct-wwd-form__cols {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	max-width: 760px;
	margin-top: 24px;
}

.fct-destination .fct-wwd-form__label {
	margin-bottom: 8px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--body);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fct-destination .fct-wwd-form__cols p {
	font-size: 16px;
	line-height: 1.6;
}

/* A work form without labelled details (Workshops) has one paragraph: it spans both columns at a
   reading measure, instead of a narrow first column beside an empty one (optimisation 1). */
.fct-destination .fct-wwd-form__cols > p:only-child {
	grid-column: 1 / -1;
	max-width: 66ch;
}

@media (min-width: 600px) {
	.fct-destination .fct-wwd-form {
		padding: 40px 0 44px;
	}

	.fct-destination .fct-wwd-forms__head + .fct-wwd-form {
		margin-top: 56px;
	}

	.fct-destination .fct-wwd-form__sub {
		font-size: 14px;
	}

	.fct-destination .fct-wwd-form__cols {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 32px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-wwd-forms__lead {
		align-self: end;
		margin-top: 20px;
	}

	.fct-destination .fct-wwd-form__title {
		font-size: clamp(28px, calc(20px + 0.833vw), 32px);
	}

	.fct-destination .fct-wwd-form__lead {
		font-size: clamp(18px, calc(14px + 0.417vw), 20px);
	}
}

/* The Sage bridge to Onze aanpak. */
.fct-destination .fct-wwd-bridge {
	margin-top: var(--pad);
	padding-block: calc(0.86 * var(--pad));
	background-color: var(--wp--preset--color--sage);
}

.fct-destination .fct-wwd-bridge__statement {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--bridge);
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: -0.02em;
}

.fct-destination .fct-wwd-bridge__body {
	max-width: 560px;
	font-size: var(--copy);
	line-height: 1.6;
}

/* A second paragraph (begeleiding, 2026-10-31): the paragraph gap of the homepage's "Wat we doen". */
.fct-destination .fct-wwd-bridge__body + .fct-wwd-bridge__body {
	margin-top: 16px;
}

@media (min-width: 960px) {
	.fct-destination .fct-wwd-bridge .fct-wwd-row {
		grid-template-columns: min(560px, calc(50% - 28px)) minmax(0, 1fr);
		column-gap: clamp(56px, calc(-56px + 9.44vw), 80px);
	}

	.fct-destination .fct-wwd-bridge__body {
		margin-top: 6px;
	}
}

/* The optional evidence (fct/curated-cards; absent without published items). */
.fct-destination .fct-wwd-proof {
	padding-top: var(--pad);
}

.fct-destination .fct-wwd-proof .is-style-eyebrow {
	margin-bottom: 14px;
}

/* The closing contact band (no collage). */
.fct-destination .fct-wwd-band {
	padding-top: var(--pad);
	padding-bottom: calc(1.07 * var(--pad));
}

.fct-destination .fct-wwd-band__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 28px;
	align-items: end;
	padding-top: 40px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-wwd-band__body {
	max-width: 520px;
	margin-top: 16px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-wwd-band__mail {
	margin-top: 14px;
	font-size: 16px;
}

/* The public address (Settings → FCT) is one unbreakable word: a long one breaks inside rather than overflow. */
.fct-destination .fct-wwd-band__mail a {
	overflow-wrap: anywhere;
}

@media (min-width: 600px) {
	.fct-destination .fct-wwd-band__inner {
		padding-top: 56px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-wwd-band__inner {
		grid-template-columns: minmax(0, 1fr) auto;
		column-gap: 64px;
	}

	.fct-destination .fct-wwd-band__aside {
		text-align: right;
	}

	.fct-destination .fct-wwd-band__aside .wp-block-buttons {
		justify-content: flex-end;
	}
}

/* =====================================================================================================
 * "Onze aanpak" (Phase 5d, approved 2026-10-06; docs/PAGES.md "Onze aanpak — 1440-voorstel" and
 * "Responsieve regels"). The opener (text + fct/movement-index), Hoe we werken (four movements, the
 * devices fct/work-gap and fct/moment-boundary), Hoe we kijken (five principles), Van reflex naar
 * betere vraag (Sage), the shared evidence and contact band. Compositions: ≥ 960 the 1440
 * composition scaled (k = content width / 1252), 768–959 stacked, ≤ 767 phone; body rows in two
 * columns only from 1200 px. Sizes are fluid and meet the approved values at the review widths
 * (qa/tools/lib/oa-page.mjs).
 * ===================================================================================================== */

.fct-destination .fct-oa-line {
	display: block;
}

.fct-destination :is(.fct-oa-opener, .fct-oa-reflex) {
	box-sizing: border-box;
	padding-inline: var(--m);
}

/* --- opener --------------------------------------------------------------------------------------- */

.fct-destination .fct-oa-opener {
	/* Inside the opener 100cqw is the content width (the page minus its margins). */
	--k: calc(100cqw / 1252);
	--s: calc(100cqw / 865);
	--t: clamp(52px, calc(56px + (100cqw - 890.8px) * 0.0554), 76px);
	--cta-gap: clamp(30px, calc(30px + (100cqw - 1104px) * 0.04), 36px);
	/* The index moves 0–5 px below the gesture's own position so the brush clears its text by ≥ 20 px. */
	--di: clamp(0px, calc((1440px - 100vw) * 0.0105), 5px);

	container-type: inline-size;
	overflow-x: clip;
}

.fct-destination .fct-oa-opener .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-oa-opener__title {
	color: var(--wp--preset--color--forest);
	font-size: var(--t);
	line-height: 1.02;
	letter-spacing: -0.02em;
}

.fct-destination .fct-oa-opener__intro {
	margin-top: calc(0.5 * var(--t) + (100cqw - 890.8px) * 0.0055);
	line-height: 1.6;
}

.fct-destination .fct-oa-opener__actions {
	margin-top: var(--cta-gap);
}

/* The in-page button points down. */
.fct-destination .fct-oa-down .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 3v12.5M4.5 10.5 10 16l5.5-5.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 3v12.5M4.5 10.5 10 16l5.5-5.5' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.fct-destination .fct-oa-down .wp-block-button__link:hover::after {
	transform: translateY(2px);
}

/*
 * ≥ 960 px: the 1440 composition. The text block's bottom edge sets where the index (and with it the
 * gesture, drawn above the index) begins: never higher than in the 1440 drawing (616 art units), and
 * at least the approved distance below the intro (141 px at 960 rising to 160 px at 1440), so the
 * brush stays ≥ 20 px from the text and the index ≥ 32 px below the intro whatever the copy.
 */
@media (min-width: 960px) {
	.fct-destination .fct-oa-opener {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		padding-bottom: max(57.6px, 5vw);
	}

	.fct-destination .fct-oa-opener__text {
		position: relative;
		z-index: 1;
		box-sizing: border-box;
		width: clamp(440px, calc(470px + (100cqw - 890.8px) * 0.36), 600px);
		min-height: calc(616 * var(--k));
		padding-top: clamp(44px, calc(48px + (100cqw - 890.8px) * 0.0221), 56px);
		padding-bottom: calc(103px + 4.552cqw - var(--cta-gap) - 52px);
	}

	.fct-destination .fct-oa-opener__title .fct-oa-line {
		white-space: nowrap;
	}

	.fct-destination .fct-oa-opener__intro {
		max-width: clamp(360px, calc(380px + (100cqw - 890.8px) * 0.3322), 500px);
		font-size: clamp(17px, calc(17px + (100cqw - 890.8px) * 0.00277), 18px);
	}
}

/* 768–959 px: stacked. */
@media (min-width: 768px) and (max-width: 959.98px) {
	.fct-destination .fct-oa-opener {
		--t: 52px;

		padding-top: clamp(40px, calc(40px + (100vw - 768px) * 0.021), 44px);
		padding-bottom: 80px;
	}

	.fct-destination .fct-oa-opener__intro {
		max-width: clamp(540px, calc(540px + (100vw - 768px) * 0.105), 560px);
		font-size: 17px;
	}

	.fct-destination .fct-oa-opener__title .fct-oa-line {
		white-space: nowrap;
	}
}

/* ≤ 767 px: phone. */
@media (max-width: 767.98px) {
	.fct-destination .fct-oa-opener {
		--t: calc(36px + (100vw - 390px) * 0.0371);
		--cta-gap: 26px;

		padding-top: clamp(24px, calc(10px + 4.4vw), 40px);
		padding-bottom: 64px;
	}

	.fct-destination .fct-oa-opener__intro {
		margin-top: calc(0.5 * var(--t));
		font-size: clamp(16px, calc(14.75px + 0.3vw), 17px);
	}
}

@media (max-width: 389.98px) {
	.fct-destination .fct-oa-opener {
		--t: calc(30px + (100vw - 320px) * 0.0857);
	}
}

@media (min-width: 600px) and (max-width: 767.98px) {
	.fct-destination .fct-oa-opener__title .fct-oa-line {
		white-space: nowrap;
	}
}

/* --- shared rows: heading left, text right only from 1200 px ------------------------------------------ */

.fct-destination .fct-oa-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 18px;
}

.fct-destination .fct-oa-row .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-oa-lead {
	max-width: 640px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-oa-h2-lines .fct-oa-line {
	white-space: nowrap;
}

@media (max-width: 479.98px) {
	.fct-destination .fct-oa-h2-lines .fct-oa-line {
		white-space: normal;
	}
}

@media (min-width: 1200px) {
	.fct-destination .fct-oa-row {
		grid-template-columns: 380px minmax(0, 1fr);
		column-gap: 46px;
		row-gap: 0;
	}

	.fct-destination .fct-oa-lead {
		align-self: end;
		max-width: 600px;
	}

	/* WCAG 1.4.12 (Phase 6C): a heading line may break when larger letter and word spacing would carry it past the
	   column gap into the lead beside it. The approved lines may reach into the gap (up to 388 of 380 px), so the
	   line's measure is the column plus the gap: at normal spacing every line fits it and nothing changes. */
	.fct-destination .fct-oa-h2-lines .fct-oa-line {
		margin-inline-end: -46px;
		white-space: normal;
	}
}

/* --- Hoe we werken: the four movements -------------------------------------------------------------- */

.fct-destination .fct-oa-moves {
	/* The devices scale with the content width (k = 100cqw / 1252). */
	container-type: inline-size;
}

.fct-destination .fct-oa-move {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 20px;
	padding: 36px 0 44px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-oa-move:first-child {
	margin-top: calc(0.53 * var(--pad));
}

.fct-destination .fct-oa-move__head {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	column-gap: 18px;
	align-items: center;
}

/* The step mark of the R4 notation (S-nb4), one per movement. */
.fct-destination .fct-oa-move__head::before {
	content: "";
	grid-row: 1 / span 3;
	width: 64px;
	height: 64px;
	background-color: var(--wp--preset--color--charcoal);
	-webkit-mask: var(--fct-oa-mark) center / contain no-repeat;
	mask: var(--fct-oa-mark) center / contain no-repeat;
}

.fct-destination .fct-oa-move--1 { --fct-oa-mark: url("../masks/r4-mark-1-64.svg?v=5b46d016054d"); }
.fct-destination .fct-oa-move--2 { --fct-oa-mark: url("../masks/r4-mark-2-64.svg?v=898ad4864da0"); }
.fct-destination .fct-oa-move--3 { --fct-oa-mark: url("../masks/r4-mark-3-64.svg?v=bc79779c8e3d"); }
.fct-destination .fct-oa-move--4 { --fct-oa-mark: url("../masks/r4-mark-4-64.svg?v=08766e71caf1"); }

.fct-destination .fct-oa-move__n {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

.fct-destination .fct-oa-move__label {
	position: relative;
	width: fit-content;
	margin-top: 4px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(26px, calc(20.6px + 1.82vw), 30px);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.01em;
}

/* Handelen: the one Gold accent in the page body (action), a short dry-brush underline. */
.fct-destination .fct-oa-move--4 .fct-oa-move__label::after {
	content: "";
	position: absolute;
	left: -6px;
	bottom: -14px;
	width: calc(100% + 18px);
	height: 22px;
	background-color: var(--wp--preset--color--gold);
	-webkit-mask: url("../masks/oa-underline.svg?v=c8d1eb56f520") 0 0 / 100% 100% no-repeat;
	mask: url("../masks/oa-underline.svg?v=c8d1eb56f520") 0 0 / 100% 100% no-repeat;
}

.fct-destination .fct-oa-move__q {
	margin-top: 6px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(18px, calc(15.4px + 0.66vw), 19px);
	font-weight: 500;
	line-height: 1.3;
}

.fct-destination .fct-oa-move--4 .fct-oa-move__q {
	margin-top: 18px;
}

.fct-destination .fct-oa-move__lead {
	max-width: 680px;
	color: var(--wp--preset--color--charcoal);
	font-size: clamp(17px, calc(14.5px + 0.64vw), 18px);
	line-height: 1.55;
}

/* A second paragraph (Begrijpen, 2026-10-31): the paragraph distance of the reading text elsewhere (1em). */
.fct-destination .fct-oa-move__lead + .fct-oa-move__lead {
	margin-top: 1em;
}

.fct-destination .fct-oa-move__return {
	max-width: 680px;
	margin-top: 32px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(19px, calc(16.4px + 0.66vw), 20px);
	font-weight: 500;
	line-height: 1.35;
}

/* The devices span the movement. */
.fct-destination .fct-oa-move > .fct-work-gap,
.fct-destination .fct-oa-move > .fct-moment {
	grid-column: 1 / -1;
}

@media (min-width: 768px) {
	.fct-destination .fct-oa-move {
		row-gap: 24px;
		padding: 44px 0 52px;
	}

	.fct-destination .fct-oa-move__head {
		column-gap: 22px;
	}
}

/* ≥ 1200 px: head left, body right (the approved 1440 row). */
@media (min-width: 1200px) {
	.fct-destination .fct-oa-move {
		grid-template-columns: 380px minmax(0, 1fr);
		column-gap: 46px;
		row-gap: 0;
		padding: 56px 0 64px;
	}

	.fct-destination .fct-oa-move__head {
		display: block;
	}

	.fct-destination .fct-oa-move__head::before {
		display: block;
		width: 82px;
		height: 82px;
	}

	.fct-destination .fct-oa-move--1 { --fct-oa-mark: url("../masks/r4-mark-1-82.svg?v=63d57d15437a"); }
	.fct-destination .fct-oa-move--2 { --fct-oa-mark: url("../masks/r4-mark-2-82.svg?v=9ee704dd6fcc"); }
	.fct-destination .fct-oa-move--3 { --fct-oa-mark: url("../masks/r4-mark-3-82.svg?v=e69a719d4c58"); }
	.fct-destination .fct-oa-move--4 { --fct-oa-mark: url("../masks/r4-mark-4-82.svg?v=e57df278ef92"); }

	.fct-destination .fct-oa-move__n {
		margin-top: 22px;
		font-size: 16px;
	}

	.fct-destination .fct-oa-move__label {
		margin-top: 8px;
		font-size: clamp(30px, calc(30px + (100vw - 1200px) * 0.025), 36px);
	}

	.fct-destination .fct-oa-move__q {
		margin-top: 12px;
		font-size: clamp(19px, calc(19px + (100vw - 1200px) * 0.0125), 22px);
	}

	.fct-destination .fct-oa-move--4 .fct-oa-move__q {
		margin-top: 26px;
	}

	.fct-destination .fct-oa-move__lead {
		font-size: clamp(18px, calc(18px + (100vw - 1200px) * 0.0083), 20px);
	}

	.fct-destination .fct-oa-move__return {
		font-size: clamp(20px, calc(20px + (100vw - 1200px) * 0.0083), 22px);
	}
}

/* --- Hoe we kijken: the five principles (a perspective layer: no numbers, no marks) ----------------- */

.fct-destination .fct-oa-lens-list {
	margin-top: 36px;
}

.fct-destination .fct-oa-lens {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 10px;
	padding: 24px 0 26px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-oa-lens:last-child {
	border-bottom: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-oa-lens__term {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(21px, calc(18.4px + 0.66vw), 22px);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.005em;
}

.fct-destination .fct-oa-lens__text {
	font-size: 16px;
	line-height: 1.6;
}

.fct-destination .fct-oa-lens__q-label {
	margin-bottom: 6px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--body);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fct-destination .fct-oa-lens__question {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(17px, calc(14.4px + 0.66vw), 18px);
	font-weight: 500;
	line-height: 1.4;
}

@media (max-width: 767.98px) {
	.fct-destination .fct-oa-lens__q {
		margin-top: 6px;
	}
}

@media (min-width: 768px) {
	.fct-destination .fct-oa-lens-list {
		margin-top: 48px;
	}

	.fct-destination .fct-oa-lens {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 40px;
		row-gap: 14px;
		padding: 28px 0 30px;
	}

	.fct-destination .fct-oa-lens__term {
		grid-column: 1 / -1;
	}
}

@media (min-width: 1200px) {
	.fct-destination .fct-oa-lens {
		grid-template-columns: clamp(300px, calc(300px + (100vw - 1200px) / 3), 380px) minmax(0, 1fr) clamp(340px, calc(340px + (100vw - 1200px) / 4), 400px);
		column-gap: clamp(40px, calc(40px + (100vw - 1200px) * 0.025), 46px);
		row-gap: 0;
	}

	.fct-destination .fct-oa-lens__term {
		grid-column: auto;
		font-size: clamp(22px, calc(22px + (100vw - 1200px) * 0.0083), 24px);
	}

	.fct-destination .fct-oa-lens__text {
		font-size: clamp(16px, calc(16px + (100vw - 1200px) * 0.0042), 17px);
	}

	.fct-destination .fct-oa-lens__question {
		font-size: clamp(18px, calc(18px + (100vw - 1200px) * 0.0042), 19px);
	}
}

@media (min-width: 1440px) {
	.fct-destination .fct-oa-lens-list {
		margin-top: 56px;
	}

	.fct-destination .fct-oa-lens {
		padding: 30px 0 32px;
	}
}

/* --- Van reflex naar betere vraag (Sage) ------------------------------------------------------------- */

.fct-destination .fct-oa-reflex {
	margin-top: var(--pad);
	padding-block: calc(0.87 * var(--pad));
	background-color: var(--wp--preset--color--sage);
}

.fct-destination .fct-oa-reflex > * {
	max-width: 1252px;
	margin-inline: auto;
}

.fct-destination .fct-oa-reflex__head {
	display: none;
}

.fct-destination .fct-oa-reflex__list {
	margin-top: 32px;
}

.fct-destination .fct-oa-reflex__item {
	display: flex;
	flex-direction: column;
	padding: 22px 0 24px;
	border-top: 1px solid rgb(18 56 61 / 26%);
}

.fct-destination .fct-oa-reflex__item:last-child {
	border-bottom: 1px solid rgb(18 56 61 / 26%);
}

/* The arrow from the reflex to the better question (down when stacked, right in the grid). */
.fct-destination .fct-oa-reflex__item::before {
	content: "";
	order: 2;
	width: 18px;
	height: 18px;
	margin: 12px 0 10px;
	background-color: var(--wp--preset--color--forest);
	-webkit-mask: var(--fct-button-arrow) center / contain no-repeat;
	mask: var(--fct-button-arrow) center / contain no-repeat;
	transform: rotate(90deg);
}

.fct-destination .fct-oa-reflex__from {
	order: 1;
}

.fct-destination .fct-oa-reflex__to {
	order: 3;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(18px, calc(15.4px + 0.66vw), 19px);
	font-weight: 500;
	line-height: 1.38;
}

/* The reflex stays readable; a hand-drawn strike per line says "not as a final conclusion". */
.fct-destination .fct-oa-reflex__quote {
	color: var(--wp--preset--color--charcoal);
	font-size: clamp(18px, calc(15.4px + 0.66vw), 19px);
	line-height: 1.4;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 18' preserveAspectRatio='none'%3E%3Cpath d='M0 9.5C120 7.4 240 10.6 360 8.6S540 7.6 600 9.2' fill='none' stroke='%231E2E2F' stroke-width='2' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 55% / 100% 12px no-repeat;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

@media (min-width: 768px) {
	.fct-destination .fct-oa-reflex__head {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
		margin-top: 44px;
		padding-bottom: 14px;
	}

	.fct-destination .fct-oa-reflex__head p {
		color: var(--wp--preset--color--forest);
		font-family: var(--wp--preset--font-family--body);
		font-size: 12px;
		font-weight: 600;
		line-height: 1.3;
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}

	.fct-destination .fct-oa-reflex__head p:last-child {
		grid-column: 3;
	}

	.fct-destination .fct-oa-reflex__list {
		margin-top: 0;
	}

	.fct-destination .fct-oa-reflex__item {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr);
		align-items: center;
		padding: 26px 0 28px;
	}

	.fct-destination .fct-oa-reflex__item::before {
		grid-row: 1;
		grid-column: 2;
		width: 30px;
		height: 18px;
		margin: 0;
		transform: none;
	}

	.fct-destination .fct-oa-reflex__from {
		grid-row: 1;
		grid-column: 1;
	}

	.fct-destination .fct-oa-reflex__to {
		grid-row: 1;
		grid-column: 3;
	}
}

@media (min-width: 1440px) {
	.fct-destination .fct-oa-reflex__head,
	.fct-destination .fct-oa-reflex__item {
		grid-template-columns: 560px 80px minmax(0, 1fr);
	}

	.fct-destination .fct-oa-reflex__head {
		margin-top: 56px;
	}

	.fct-destination .fct-oa-reflex__quote {
		font-size: 20px;
	}

	.fct-destination .fct-oa-reflex__to {
		font-size: 21px;
	}
}

/* Block spacing inside flow groups (the page's flow rule resets child margins). */
.fct-destination .fct-oa-move > :is(.fct-work-gap, .fct-moment) {
	margin-top: 36px;
}

@media (min-width: 768px) {
	.fct-destination .fct-oa-move > :is(.fct-work-gap, .fct-moment) {
		margin-top: 48px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-oa-move > :is(.fct-work-gap, .fct-moment) {
		margin-top: clamp(48px, calc(48px + (100vw - 960px) * 0.0333), 64px);
	}
}

@media (max-width: 959.98px) {
	.fct-destination .fct-oa-opener > .fct-movements {
		margin-top: 44px;
	}
}

@media (max-width: 767.98px) {
	.fct-destination .fct-oa-opener > .fct-movements {
		margin-top: 36px;
	}
}

/* =====================================================================================================
 * "Verder lezen" (fct/related) on the resource pages. These rules were part of the Cases page family
 * (Phase 5e) and stay for Inzichten; Cases went with D-030 (2026-10-13; the earlier styles are in the
 * Git history). The class names are historical.
 * ===================================================================================================== */

.fct-destination .fct-cs-related .is-style-eyebrow {
	margin-bottom: 14px;
}

/* --- related reading --------------------------------------------------------------------------------- */

/* Server-rendered (fct/related): outside the flow layout, so no theme margins. (The resource band is the
   shared band's own block structure, fct/case-band, so it needs nothing here.) */
.fct-destination .fct-cs-related :is(h2, .is-style-eyebrow) {
	margin-top: 0;
}

.fct-destination .fct-cs-related h2 {
	margin-bottom: 0;
}

.fct-destination .fct-cs-related {
	padding-top: var(--sec, var(--pad));
}

.fct-destination .fct-cs-related__cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	margin: 48px 0 0;
	padding: 0;
	list-style: none;
}

.fct-destination .fct-cs-related__cards > li {
	display: flex;
	margin: 0;
}

.fct-destination .fct-cs-related .fct-card__body {
	gap: 10px;
	padding: 26px 26px 28px;
}

.fct-destination .fct-cs-related .fct-card__title {
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
}

@media (max-width: 1199.98px) {

	.fct-destination .fct-cs-related .fct-card__body {
		padding: 22px 20px 24px;
	}

	.fct-destination .fct-cs-related .fct-card__title {
		font-size: 20px;
	}

}

@media (max-width: 959.98px) {

	.fct-destination .fct-cs-related__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 599.98px) {

	.fct-destination .fct-cs-related__cards {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
		margin-top: 32px;
	}
}

/* =====================================================================================================
 * "Inzichten" and the resource detail (Phase 5f, approved 2026-10-07; docs/PAGES.md "Inzichten en
 * resourcedetail" and "Responsieve regels (Inzichten)"). Overview /inzichten/: the R6 opener (the action
 * slot empty, D3) with R6's own Gold plate ("Kijk nog eens."), the resources as R6 cards in a Query Loop
 * (9 per page; the type class from inc/insights.php gives the video its play disc and the tool its sheet;
 * 1 resource a wide row and 2 two columns from 960), the Sage band, the contact band. Resource detail
 * (templates/single-fct_resource.html): a reading page — text opener, the media zone and the reading
 * column shifted from 960. 1440 the approved composition; 960–1439 fluid; 600–959 one landscape card per
 * row; < 600 the editorial index (qa/tools/lib/insights-page.mjs).
 * ===================================================================================================== */

.fct-destination .fct-in-line {
	display: block;
	white-space: nowrap;
}

/* --- overview opener -------------------------------------------------------------------------------- */

.fct-destination .fct-in-opener {
	position: relative;
	box-sizing: border-box;
	min-height: calc(130px + 20.8vw);
	padding: calc(32px + 4.444vw) var(--m) 0;
}

.fct-destination .fct-in-opener__text {
	width: 760px;
	max-width: 100%;
}

.fct-destination .fct-in-opener .is-style-eyebrow {
	margin-bottom: 14px;
}

.fct-destination .fct-in-h1 {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(52px, calc(4px + 5vw), 76px);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.02em;
}

.fct-destination .fct-in-intro {
	max-width: min(560px, 45vw);
	margin-top: 36px;
	font-size: 18px;
	line-height: 1.6;
	text-wrap: pretty;
}

/* R6's own Gold plate (traced, D2) with the handwriting on it: top right from 960, after the intro below. */
.fct-destination .fct-in-plate {
	--pw: 28.47vw;
	--pf: 4.72vw;

	position: absolute;
	top: calc(8px + 2.222vw);
	right: calc(var(--m) - 8px);
	display: grid;
	place-items: center;
	isolation: isolate;
	width: var(--pw);
	aspect-ratio: 1.2619;
	margin: 0;
}

@media (min-width: 1440px) {
	.fct-destination .fct-in-opener {
		min-height: 430px;
		padding-top: 96px;
	}

	.fct-destination .fct-in-h1 {
		font-size: 76px;
	}

	.fct-destination .fct-in-intro {
		max-width: 560px;
	}

	.fct-destination .fct-in-plate {
		--pw: 410px;
		--pf: 68px;

		top: 40px;
	}
}

.fct-destination .fct-in-plate::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wp--preset--color--gold);
	-webkit-mask: url("../masks/in-plate.svg?v=bc66306b85cb") 0 0 / 100% 100% no-repeat;
	mask: url("../masks/in-plate.svg?v=bc66306b85cb") 0 0 / 100% 100% no-repeat;
}

.fct-destination .fct-in-plate__text {
	display: block;
	transform: rotate(-11deg) translate(4px, 2px);
	color: var(--wp--preset--color--charcoal);
	font-family: var(--wp--preset--font-family--note);
	font-size: var(--pf);
	font-weight: 500;
	line-height: 1.02;
	text-align: center;
}

.fct-destination .fct-in-plate__text .fct-in-line + .fct-in-line {
	padding-left: 1.1em;
}

/* --- the resources ------------------------------------------------------------------------------------ */

.fct-destination .fct-in-list {
	box-sizing: border-box;
	padding: calc(16px + 3.333vw) calc(var(--m) * 0.6915) 0;
}

.fct-destination .fct-in-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 48px 22px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fct-destination .fct-in-cards > li {
	display: flex;
	margin: 0;
}

.fct-destination .fct-in-card {
	--fct-card-ratio: 2.4;
}

.fct-destination .fct-in-card .fct-card__image {
	position: relative;
}

.fct-destination .fct-in-card .fct-card__body {
	gap: 10px;
	padding: 24px 26px 28px;
}

.fct-destination .fct-in-card .fct-card__title {
	font-size: 23px;
	font-weight: 600;
	line-height: 1.22;
	letter-spacing: -0.005em;
	hyphens: manual;
}

.fct-destination .fct-in-teaser p {
	margin: 2px 0 0;
	font-size: 16px;
	line-height: 1.5;
}

.fct-destination .fct-in-file {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.06em;
}

.fct-destination .fct-in-card .fct-card__more {
	padding-top: 12px;
}

/* The video's still carries the Gold play disc (as on the homepage); in related reading on resource pages
   too (the case pages of Phase 5e stay as approved). Disc and triangle stack above the still, also where the
   still is positioned (the landscape cards at 600–959), and let clicks through to the card's link. */
.fct-resource-detail .fct-cs-related__cards > .fct-type-video .fct-card__image {
	position: relative;
}

.fct-resource-detail .fct-cs-related .fct-card__title {
	hyphens: manual;
}

.fct-destination .fct-in-cards > .fct-type-video .fct-card__image::before,
.fct-resource-detail .fct-cs-related__cards > .fct-type-video .fct-card__image::before {
	content: "";
	position: absolute;
	z-index: 1;
	pointer-events: none;
	top: 50%;
	left: 50%;
	width: 64px;
	height: 64px;
	margin: -32px 0 0 -32px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
}

.fct-destination .fct-in-cards > .fct-type-video .fct-card__image::after,
.fct-resource-detail .fct-cs-related__cards > .fct-type-video .fct-card__image::after {
	content: "";
	position: absolute;
	z-index: 1;
	pointer-events: none;
	top: 50%;
	left: 50%;
	margin: -12px 0 0 -6px;
	border-style: solid;
	border-width: 12px 0 12px 19px;
	border-color: transparent transparent transparent var(--wp--preset--color--charcoal);
}

/* The tool's card shows the file, not a photo: a printed sheet on Sage. */
.fct-destination .fct-in-cards > .fct-type-tool .fct-card__image {
	display: grid;
	place-items: center;
	aspect-ratio: 2.4;
	background: var(--wp--preset--color--sage);
}

.fct-destination .fct-in-cards > .fct-type-tool .fct-card__image img {
	display: none;
}

.fct-destination .fct-in-cards > .fct-type-tool .fct-card__image::before {
	content: "";
	width: 22%;
	aspect-ratio: 0.72;
	background:
		repeating-linear-gradient(to bottom, rgb(18 56 61 / 45%) 0 2px, transparent 2px 9px) 16% 18% / 68% 46% no-repeat,
		var(--wp--preset--color--warm-white);
	box-shadow: 0 1px 0 rgb(18 56 61 / 18%);
	transform: rotate(-3deg);
}

/* One resource: one wide row, picture left. Two: two wide cards. */
.fct-destination .fct-in-cards:has(> li:only-child) {
	grid-template-columns: minmax(0, 1fr);
}

.fct-destination .fct-in-cards:has(> li:only-child) .fct-in-card {
	display: grid;
	grid-template-columns: 58% minmax(0, 1fr);
}

.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__image {
	min-height: 340px;
}

.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
}

.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__body {
	justify-content: center;
	padding: 48px 56px;
}

.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__title {
	font-size: 30px;
}

.fct-destination .fct-in-cards:has(> li:nth-child(2):last-child) {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fct-destination .fct-in-list .wp-block-query-pagination {
	margin-top: 48px;
	padding-left: calc(var(--m) * 0.3085);
}

.fct-destination .fct-in-empty {
	max-width: 1252px;
	margin-left: calc(var(--m) * 0.3085);
	padding: 36px 0 8px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-in-empty__text {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 26px;
	font-weight: 500;
}

/* --- Sage band: Om verder te kijken (until 2026-10-18: Elke bril laat iets zien) ------------------------ */

.fct-destination .fct-in-lens {
	box-sizing: border-box;
	margin-top: calc(40px + 5.556vw);
	padding: calc(40px + 3.333vw) var(--m) calc(44px + 3.333vw);
	background: var(--wp--preset--color--sage);
}

.fct-destination .fct-in-lens__inner {
	display: grid;
	grid-template-columns: clamp(280px, calc(80px + 20.83vw), 380px) minmax(0, 1fr);
	column-gap: clamp(36px, calc(16px + 2.083vw), 46px);
	max-width: 1252px;
	margin: 0 auto;
}

.fct-destination .fct-in-lens .is-style-eyebrow {
	margin-bottom: 14px;
}

.fct-destination .fct-in-lens__h2 {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(36px, calc(16px + 1.944vw), 44px);
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -0.015em;
	text-wrap: balance;
}

.fct-destination .fct-in-lens__h2 .fct-in-line {
	white-space: normal;
}

.fct-destination .fct-in-lens__body {
	max-width: 620px;
	margin-top: 6px;
	font-size: 20px;
	line-height: 1.6;
}

/* A second paragraph (2026-10-18): the paragraph distance of the reading text elsewhere (1em). */
.fct-destination .fct-in-lens__body + .fct-in-lens__body {
	margin-top: 1em;
}

@media (min-width: 1440px) {
	.fct-destination .fct-in-list {
		padding-top: 64px;
	}

	.fct-destination .fct-in-lens {
		margin-top: 120px;
		padding: 88px var(--m) 92px;
	}
}

/* --- resource detail: a reading page ---------------------------------------------------------------- */

.fct-resource-detail {
	--shift: calc(var(--m) + clamp(280px, calc(80px + 20.83vw), 380px) + clamp(36px, calc(16px + 2.083vw), 46px));
}

.fct-destination .fct-in-dopener {
	box-sizing: border-box;
	padding: calc(24px + 4.444vw) var(--m) 0;
}

.fct-destination .fct-in-dopener__text {
	max-width: 860px;
}

.fct-destination .fct-in-dopener .fct-in-eyebrow {
	margin-bottom: 16px;
}

.fct-destination .fct-in-dh1 {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(44px, calc(44px + (100vw - 960px) * 0.0333), 60px);
	font-weight: 700;
	line-height: 1.04;
	letter-spacing: -0.02em;
	hyphens: manual;
}

.fct-destination .fct-in-dek {
	max-width: 640px;
	margin-top: 28px;
}

.fct-destination .fct-in-dek p {
	margin: 0;
	font-size: 22px;
	line-height: 1.5;
}

.fct-destination .fct-in-meta {
	margin-top: 24px;
	font-size: 15px;
}

/* The media zone: from the shifted reading column to the margin (the tool's panel: the column's width). */
.fct-resource-detail .fct-in-media {
	box-sizing: border-box;
	margin: 56px var(--m) 0 var(--shift);
}

.fct-destination .fct-in-media__img {
	overflow: hidden;
	aspect-ratio: 2.4;
	border-radius: 10px;
}

.fct-destination .fct-in-media__img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.fct-destination .fct-in-figure figcaption {
	max-width: 620px;
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.45;
}

/* An image marked "Do not crop" in Media (fct_full_frame, Optimalisatie 3): its own proportions at every width
   instead of the 2.4 : 1 (16 : 10 below 600) crop. Only the article page's media zone; cards keep their crop. */
.fct-destination .fct-in-media__img.fct-in-media__img--full {
	aspect-ratio: auto;
}

.fct-destination .fct-in-media__img--full img {
	height: auto;
}

/* A diagram in an article (Image style "Diagram"): the quiet caption of the featured image, not body text. */
.fct-resource-detail .fct-in-article > .wp-block-image.is-style-diagram figcaption {
	max-width: 620px;
	margin: 12px 0 28px;
	font-size: 14px;
	line-height: 1.45;
}

.fct-destination .fct-in-video__still {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	background: var(--wp--preset--color--forest);
}

.fct-destination :is(.fct-in-video__img, .fct-in-video__frame) {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
}

.fct-destination .fct-in-video__play {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	background: rgb(18 56 61 / 18%);
	cursor: pointer;
	text-decoration: none;
}

.fct-destination .fct-in-play {
	position: relative;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	background: var(--wp--preset--color--gold);
}

.fct-destination .fct-in-play::after {
	content: "";
	position: absolute;
	top: 27px;
	left: 36px;
	border-style: solid;
	border-width: 17px 0 17px 26px;
	border-color: transparent transparent transparent var(--wp--preset--color--charcoal);
}

.fct-destination .fct-in-video__label {
	position: absolute;
	bottom: 16px;
	left: 20px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--wp--preset--color--warm-white);
	color: var(--wp--preset--color--forest);
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
}

.fct-destination .fct-in-video__play:focus-visible {
	outline: 3px solid var(--wp--preset--color--gold);
	outline-offset: -6px;
}

.fct-destination .fct-in-video__meta {
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.5;
}

.fct-resource-detail .fct-in-media.fct-in-tool {
	max-width: 680px;
	padding: 30px 32px 32px;
	border-radius: 10px;
	background: var(--wp--preset--color--sage);
}

.fct-destination .fct-in-tool__cap,
.fct-destination .fct-in-example__cap,
.fct-destination .fct-in-question__cap {
	margin-bottom: 10px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.fct-destination .fct-in-tool__h {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.15;
}

.fct-destination .fct-in-tool__what {
	margin-top: 12px;
	font-size: 17px;
	line-height: 1.55;
}

.fct-destination .fct-in-tool__facts {
	display: grid;
	grid-template-columns: repeat(3, auto);
	justify-content: start;
	gap: 6px 28px;
	margin-top: 18px;
	margin-bottom: 22px;
}

.fct-destination .fct-in-tool__facts dt {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fct-destination .fct-in-tool__facts dd {
	margin: 2px 0 0;
	font-size: 15px;
}

/* The reading column: shifted from 960 (negative space left), the margin right. */
.fct-resource-detail .fct-in-article {
	box-sizing: border-box;
	max-width: calc(680px + var(--shift) + var(--m));
	margin-top: 64px;
	padding: 0 var(--m) 0 var(--shift);
}

.fct-resource-detail .fct-in-article > p {
	margin-bottom: 20px;
	font-size: 18px;
	line-height: 1.7;
}

.fct-resource-detail .fct-in-article > h2:not(.fct-in-sources__h) {
	margin: 44px 0 16px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.01em;
	hyphens: manual;
}

/* A subheading inside a section (post-5f, for real articles): the H2's family, clearly smaller. */
.fct-resource-detail .fct-in-article > h3 {
	margin: 32px 0 10px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.005em;
	hyphens: manual;
}

.fct-resource-detail .fct-in-article > :is(ul, ol) {
	margin: 0 0 20px;
	font-size: 18px;
	line-height: 1.65;
}

.fct-resource-detail .fct-in-article > details {
	margin: 28px 0 0;
	padding: 16px 0;
	border-top: 1px solid rgb(18 56 61 / 22%);
	border-bottom: 1px solid rgb(18 56 61 / 22%);
}

.fct-resource-detail .fct-in-article > details summary {
	display: flex;
	align-items: center;
	min-height: 44px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
}

.fct-destination .fct-in-example {
	margin: 36px 0;
	padding: 22px 0 24px;
	border-top: 1px solid rgb(18 56 61 / 22%);
	border-bottom: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-in-example__text {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 21px;
	font-weight: 500;
	line-height: 1.45;
}

.fct-destination .fct-in-question {
	margin-top: 56px;
}

/* "Een betere vraag": the one Gold moment of a resource page. */
.fct-destination .fct-in-question__text {
	position: relative;
	width: fit-content;
	padding-bottom: 18px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 30px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.fct-destination .fct-in-question__text::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: -4px;
	width: 180px;
	height: 14px;
	background: var(--wp--preset--color--gold);
	-webkit-mask: url("../masks/marker-stroke.svg?v=e8543023ce30") center / 100% 100% no-repeat;
	mask: url("../masks/marker-stroke.svg?v=e8543023ce30") center / 100% 100% no-repeat;
}

.fct-destination .fct-in-sources {
	margin-top: 56px;
	padding-top: 22px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-in-sources__h {
	margin-bottom: 12px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.fct-destination .fct-in-sources ol {
	margin: 0;
	padding-left: 1.4em;
	font-size: 15px;
	line-height: 1.55;
}

.fct-destination .fct-in-sources li {
	margin: 0 0 8px;
}

.fct-destination :is(.fct-in-sources, .fct-in-example, .fct-in-question) li:empty {
	display: none;
}

@media (min-width: 1440px) {
	.fct-destination .fct-in-dopener {
		padding-top: 88px;
	}

	.fct-destination .fct-in-dh1 {
		font-size: 60px;
	}
}

/* --- responsive -------------------------------------------------------------------------------------- */

@media (max-width: 1199.98px) {
	.fct-destination .fct-in-cards {
		gap: 40px 18px;
	}

	.fct-destination .fct-in-card .fct-card__body {
		padding: 22px 20px 24px;
	}

	.fct-destination .fct-in-card .fct-card__title {
		font-size: 20px;
	}

	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__title {
		font-size: 28px;
	}
}

@media (max-width: 959.98px) {
	.fct-destination .fct-in-opener {
		min-height: 0;
		padding-top: 64px;
	}

	.fct-destination .fct-in-opener__text {
		width: auto;
	}

	.fct-destination .fct-in-h1 {
		font-size: clamp(36px, calc(24.6px + 3.57vw), 52px);
	}

	.fct-destination .fct-in-intro {
		max-width: 560px;
	}

	.fct-destination .fct-in-plate {
		--pw: 300px;
		--pf: 50px;

		position: relative;
		top: auto;
		right: auto;
		margin: 24px -8px 0 auto;
	}

	.fct-destination .fct-in-list {
		padding: 48px var(--m) 0;
	}

	.fct-destination .fct-in-cards,
	.fct-destination .fct-in-cards:has(> li:nth-child(2):last-child) {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	/* one landscape card per row: picture 42 % left, text right */
	.fct-destination .fct-in-card,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-in-card {
		display: grid;
		grid-template-columns: 42% minmax(0, 1fr);
	}

	.fct-destination .fct-in-card .fct-card__image,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__image {
		min-height: 190px;
	}

	.fct-destination .fct-in-cards > .fct-type-tool .fct-card__image {
		aspect-ratio: auto;
	}

	.fct-destination .fct-in-card .fct-card__image img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
	}

	.fct-destination .fct-in-card .fct-card__body,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__body {
		justify-content: flex-start;
		padding: 22px 24px 24px;
	}

	.fct-destination .fct-in-card .fct-card__title,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__title {
		font-size: 22px;
	}

	.fct-destination .fct-in-list .wp-block-query-pagination {
		padding-left: 0;
	}

	.fct-destination .fct-in-empty {
		margin-left: 0;
	}

	.fct-destination .fct-in-lens {
		margin-top: 88px;
		padding: 64px var(--m) 72px;
	}

	.fct-destination .fct-in-lens__inner {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 20px;
	}

	.fct-destination .fct-in-lens__h2 {
		font-size: var(--h2);
	}

	.fct-resource-detail {
		--shift: var(--m);
	}

	.fct-destination .fct-in-dopener {
		padding-top: 56px;
	}

	.fct-destination .fct-in-dh1 {
		font-size: 40px;
	}

	.fct-destination .fct-in-dek p {
		font-size: 20px;
	}

	.fct-resource-detail .fct-in-media {
		margin-top: 40px;
	}

	.fct-resource-detail .fct-in-article {
		max-width: none;
		margin-top: 48px;
	}

	.fct-resource-detail .fct-in-article > * {
		max-width: 680px;
	}
}

@media (max-width: 599.98px) {
	.fct-destination .fct-in-opener {
		padding-top: 44px;
	}

	.fct-destination .fct-in-h1 {
		font-size: min(46px, calc(30px + (100vw - 320px) * 0.0857));
	}

	.fct-destination .fct-in-intro {
		font-size: 17px;
	}

	.fct-destination .fct-in-plate {
		--pw: min(250px, 72vw);
		--pf: min(41px, 11.8vw);

		margin-top: 20px;
	}

	.fct-destination .fct-in-list {
		padding-top: 40px;
	}

	/* phone: the editorial index — hairlines, type label, title, summary, link; only the video keeps its
	   still with the Gold play disc, the tool its file facts; article and tool images drop out */
	.fct-destination .fct-in-cards {
		gap: 0;
	}

	.fct-destination .fct-in-card,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-in-card {
		display: flex;
		flex-direction: column;
		border-top: 1px solid rgb(18 56 61 / 22%);
		border-radius: 0;
		background: none;
	}

	.fct-destination .fct-in-cards > li:last-child .fct-in-card {
		border-bottom: 1px solid rgb(18 56 61 / 22%);
	}

	.fct-destination .fct-in-cards > :not(.fct-type-video) .fct-card__image {
		display: none;
	}

	.fct-destination .fct-in-cards > .fct-type-video .fct-card__image,
	.fct-destination .fct-in-cards:has(> li:only-child) > .fct-type-video .fct-card__image {
		min-height: 0;
		margin-top: 20px;
		overflow: hidden;
		border-radius: 10px;
	}

	.fct-destination .fct-in-cards > .fct-type-video .fct-card__image img {
		position: static;
		height: auto;
		aspect-ratio: 2.4;
	}

	.fct-destination .fct-in-card .fct-card__body,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__body {
		gap: 8px;
		padding: 20px 0 22px;
	}

	.fct-destination .fct-in-card .fct-card__title,
	.fct-destination .fct-in-cards:has(> li:only-child) .fct-card__title {
		font-size: 20px;
	}

	.fct-destination .fct-in-lens {
		margin-top: 72px;
		padding: 52px var(--m) 60px;
	}

	.fct-destination .fct-in-lens__body {
		font-size: 18px;
	}

	.fct-destination .fct-in-dopener {
		padding-top: 40px;
	}

	.fct-destination .fct-in-dh1 {
		font-size: min(34px, calc(28px + (100vw - 320px) * 0.0286));
	}

	.fct-destination .fct-in-dek {
		margin-top: 20px;
	}

	.fct-destination .fct-in-dek p {
		font-size: 18px;
	}

	.fct-resource-detail .fct-in-media {
		margin-top: 32px;
	}

	.fct-destination .fct-in-media__img {
		aspect-ratio: 16 / 10;
	}

	.fct-resource-detail .fct-in-article {
		margin-top: 36px;
	}

	.fct-resource-detail .fct-in-article > p {
		font-size: 17px;
		line-height: 1.65;
	}

	.fct-resource-detail .fct-in-article > h2:not(.fct-in-sources__h) {
		margin-top: 36px;
		font-size: 26px;
	}

	.fct-resource-detail .fct-in-article > h3 {
		margin-top: 28px;
		font-size: 20px;
	}

	.fct-destination .fct-in-example__text {
		font-size: 19px;
	}

	.fct-destination .fct-in-question__text {
		font-size: 24px;
	}

	.fct-destination .fct-in-sources ol {
		font-size: 16px;
	}

	.fct-resource-detail .fct-in-media.fct-in-tool {
		padding: 24px 20px 26px;
	}

	.fct-destination .fct-in-tool__facts {
		grid-template-columns: minmax(0, 1fr);
	}

	.fct-destination .fct-in-play {
		width: 68px;
		height: 68px;
	}

	.fct-destination .fct-in-play::after {
		top: 21px;
		left: 27px;
		border-width: 13px 0 13px 20px;
	}
}

/* =====================================================================================================
 * Over FCT (Phase 5g; docs/PAGES.md, approved 2026-10-09: ovr-08, ovr-09, ovr-11). The opener is pure
 * statement: eyebrow, H1, the handwritten note, the lead and one open Gold sweep under "bomen." (never
 * enclosing the word); no CTA. Then "Over FCT" (one editorial row), "De mensen achter de vis" (four people,
 * each one editorial unit; the portrait is optional) and the shared contact band.
 * ===================================================================================================== */

/* --- opener: composed per breakpoint, not scaled ------------------------------------------------------
   < 600     four lines (Vissen / klimmen / niet in / bomen.), the compact sweep, the note right of "niet in"
   600–959   three lines, "bomen." under "klimmen", the compact sweep, the note right of "niet in"
   ≥ 960     two lines with the indent, the full sweep, the note top right; all in units of the H1 (--f)
   The lines never wrap on their own at normal spacing (the sizes fit every width from 320 px). */
.fct-destination .fct-ab-opener {
	--f: clamp(56px, calc(11.4vw + 19.5px), 84px);

	position: relative;
	box-sizing: border-box;
	padding: 48px var(--m);
}

.fct-destination .fct-ab-opener .is-style-eyebrow {
	margin: 0 0 18px;
}

.fct-destination .fct-ab-opener__type {
	position: relative;
	width: fit-content;
}

.fct-destination .fct-ab-opener__title {
	position: relative;
	z-index: 2;
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--f);
	font-weight: 700;
	line-height: 0.96;
	letter-spacing: -0.035em;
	/* The lines fit every width from 320 px, so they do not wrap at normal spacing; with a reader's larger text spacing
	   (WCAG 1.4.12) they may, instead of running out of the page (Phase 6A; was nowrap). */
	white-space: normal;
}

.fct-destination .fct-ab-opener__title :is(.fct-ab-l1, .fct-ab-l2),
.fct-destination .fct-ab-opener__title :is(.fct-ab-l1, .fct-ab-l2) > .fct-ab-w:first-child {
	display: block;
}

/* A little air above the "bomen." line, so the sweep's flick never touches "niet in". */
.fct-destination .fct-ab-opener__title .fct-ab-l2 > .fct-ab-w:first-child {
	margin-bottom: 0.12em;
}

/* The Gold sweep: the review's bristle strokes as a mask on the word itself (qa/tools/build-ab-runtime.mjs),
   behind the letters; its box in em of the word follows every size and line break. */
.fct-destination .fct-ab-bomen {
	position: relative;
}

.fct-destination .fct-ab-bomen::after {
	content: "";
	position: absolute;
	z-index: -1;
	left: var(--ab-sweep-x);
	top: var(--ab-sweep-y);
	width: var(--ab-sweep-w);
	height: var(--ab-sweep-h);
	background-color: var(--wp--preset--color--gold);
	-webkit-mask: url("../masks/ab-sweep-compact.svg?v=95e804a1bffd") 0 0 / 100% 100% no-repeat;
	mask: url("../masks/ab-sweep-compact.svg?v=95e804a1bffd") 0 0 / 100% 100% no-repeat;
	pointer-events: none;
}

/* ab-sweep geometry: generated by qa/tools/build-ab-runtime.mjs, do not edit */
.fct-destination .fct-ab-bomen { --ab-sweep-x: 0.3864em; --ab-sweep-y: -0.1932em; --ab-sweep-w: 3.8485em; --ab-sweep-h: 1.803em; }
@media (min-width: 960px) {
	.fct-destination .fct-ab-bomen { --ab-sweep-x: -0.0985em; --ab-sweep-y: -0.0568em; --ab-sweep-w: 4.4091em; --ab-sweep-h: 1.697em; }
}
/* /ab-sweep geometry */

.fct-destination .fct-ab-opener__note {
	position: absolute;
	z-index: 3;
	top: calc(var(--f) * 1.92 + 6px);
	left: calc(var(--f) * 2.79 + 14px);
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--note);
	font-size: clamp(22px, calc(5.71vw + 3.7px), 26px);
	line-height: 1.05;
	text-align: right;
	transform: rotate(-4deg);
	transform-origin: left center;
}

.fct-destination .fct-ab-opener__note > span {
	display: block;
}

/* WCAG 1.4.12 (Phase 6A): the note's box is its text (max-content; its longest line is 4.88em at normal spacing, the
   lines never wrap: below 600 px the box was narrower than its text, which overflowed from the box's start edge — the
   same position). With a reader's larger text spacing the lines wrap only where the room up to the content edge runs
   out (the opener is the query container; 8 px for the rotation), so the note stays on the page. */
.fct-destination .fct-ab-opener {
	container-type: inline-size;
}

.fct-destination .fct-ab-opener__note {
	width: max-content;
	max-width: calc(100cqw - var(--f) * 2.79 - 22px);
}

/* WCAG 1.4.12 below 600 px (Phase 6A, final round): with a reader's larger line height the four lines grow from 0.96 to
   1.5 × the H1 and no line leaves room for the note, so it moves under the H1 and the lead moves down to make room.
   The switch is the note's (and the lead's) own line height against its designed one: 1lh − 1.05em (1.25em for the
   lead) is exactly 0 at normal spacing, so clamp() keeps the designed position there; from 1 px more it takes the
   other bound. The normal composition is unchanged. */
.fct-destination .fct-ab-opener__note {
	top: clamp(calc(var(--f) * 1.92 + 6px), calc(var(--f) * 1.92 + 6px + (1lh - 1.05em - 1px) * 1000), calc(100% + var(--f) * 0.2));
}

.fct-destination .fct-ab-opener__lead {
	position: relative;
	z-index: 2;
	max-width: 300px;
	margin: 44px 0 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.25;
	/* Below 600 px with larger line height: room for the note above (up to three lines, ≤ 130 px under the H1). */
	margin-top: clamp(44px, calc(44px + (1lh - 1.25em - 1px) * 1000), 160px);
}

@media (min-width: 600px) {
	.fct-destination .fct-ab-opener {
		--f: clamp(70px, calc(10.7vw + 6px), 92px);

		padding-top: 72px;
		padding-bottom: 64px;
	}

	.fct-destination .fct-ab-opener .is-style-eyebrow {
		margin-bottom: 20px;
	}

	.fct-destination .fct-ab-opener__title .fct-ab-l1 > .fct-ab-w:first-child {
		display: inline;
	}

	.fct-destination .fct-ab-opener__title .fct-ab-l2 > .fct-ab-w:first-child {
		margin-bottom: 0.18em;
	}

	.fct-destination .fct-ab-bomen {
		margin-left: 3.134em;
	}

	.fct-destination .fct-ab-opener__note {
		top: calc(var(--f) * 0.96 + 12px);
		left: calc(var(--f) * 3.45);
		max-width: calc(100cqw - var(--f) * 3.45 - 8px);
		font-size: clamp(26px, calc(1.2vw + 19px), 30px);
	}

	.fct-destination .fct-ab-opener__lead {
		max-width: 340px;
		margin-top: 48px;
		font-size: 22px;
	}
}

@media (min-width: 960px) {
	/* WCAG 1.4.12 (Phase 6A): with larger text spacing the H1 wraps and the title box would fill the content width,
	   carrying the right-anchored note out of the page. At normal spacing the box is 84 px or more narrower than the content width. */
	.fct-destination .fct-ab-opener__type {
		max-width: calc(100% - 32px);
	}

	.fct-destination .fct-ab-opener {
		--f: clamp(88px, 9.1667vw, 132px);

		min-height: clamp(540px, 52.78vw, 760px);
		padding-top: clamp(80px, 7.222vw, 104px);
		padding-bottom: 0;
	}

	.fct-destination .fct-ab-opener .is-style-eyebrow {
		margin-bottom: 22px;
	}

	.fct-destination .fct-ab-opener__title .fct-ab-l2 {
		margin-left: 2.15em;
	}

	.fct-destination .fct-ab-opener__title .fct-ab-l2 > .fct-ab-w:first-child {
		display: inline;
		margin-bottom: 0;
	}

	.fct-destination .fct-ab-bomen {
		margin-left: 0;
	}

	.fct-destination .fct-ab-bomen::after {
		-webkit-mask-image: url("../masks/ab-sweep-full.svg?v=96bb09ade66d");
		mask-image: url("../masks/ab-sweep-full.svg?v=96bb09ade66d");
	}

	.fct-destination .fct-ab-opener__note {
		top: calc(var(--f) * -0.2038);
		right: calc(var(--f) * -0.8706);
		left: auto;
		/* Right-anchored, it would grow leftwards over the H1: at most its normal width (4.88em), wrapping instead. */
		max-width: 4.95em;
		font-size: clamp(30px, 2.778vw, 40px);
		transform-origin: right center;
	}

	.fct-destination .fct-ab-opener__lead {
		max-width: 360px;
		margin-top: clamp(40px, 3.889vw, 56px);
		font-size: 24px;
	}
}

/* --- Over FCT: one editorial row, the reading column on the right; one reading column below 960 ------- */
.fct-destination .fct-ab-about {
	box-sizing: border-box;
	padding: var(--pad) var(--m) 0;
}

.fct-destination .fct-ab-about > .fct-wwd-row {
	padding-top: 28px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ab-about .is-style-eyebrow {
	margin: 0 0 14px;
}

/* The heading keeps the space of the approved review above and below it (0.83em, a heading's default). */
.fct-destination .fct-ab-about .fct-wwd-h2 {
	margin-block: 0.83em;
}

.fct-destination .fct-ab-read {
	max-width: 640px;
}

.fct-destination .fct-ab-read p {
	margin: 0 0 18px;
	font-size: var(--copy);
	line-height: 1.65;
}

.fct-destination .fct-ab-read .fct-ab-turn {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(20px, calc(18.4px + 0.42vw), 22px);
	font-weight: 600;
	line-height: 1.35;
}

.fct-destination .fct-ab-read .fct-ab-notbut {
	margin: 34px 0 0;
	padding-top: 22px;
	border-top: 1px solid rgb(18 56 61 / 22%);
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(22px, calc(19.4px + 0.69vw), 26px);
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.fct-destination .fct-ab-not,
.fct-destination .fct-ab-but {
	display: block;
}

.fct-destination .fct-ab-not {
	margin-bottom: 6px;
	opacity: 0.62;
}

/* --- De mensen achter de vis --------------------------------------------------------------------------
   Each person is one editorial unit (portrait, name, line, bio), never a card. The portrait is optional:
   an Image block as the person's first block; without an image (an empty Image block renders nothing) the
   unit is text only: name, line and bio in one reading column. With a portrait:
   ≥ 1200    two columns, the right one set lower; the portrait beside the text
   600–1199  one column; the portrait beside the text (held to a reading measure)
   < 600     the portrait (4 : 5) with the name and the line beside it, the full bio under both */
.fct-destination .fct-ab-team {
	box-sizing: border-box;
	max-width: calc(1252px + 2 * var(--m));
	margin: 0 auto;
	padding: calc(1.0667 * var(--pad)) var(--m) 0;
}

.fct-destination .fct-ab-team__head {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 20px;
	padding-bottom: clamp(40px, calc(28px + 2vw), 56px);
}

.fct-destination .fct-ab-team__h2 {
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(36px, calc(26.24px + 2.9vw), 68px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.025em;
}

.fct-destination .fct-ab-team__intro {
	max-width: 420px;
	margin: 0;
	font-size: var(--copy);
	line-height: 1.55;
}

.fct-destination .fct-ab-people {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: clamp(56px, calc(40px + 3vw), 72px);
}

.fct-destination .fct-ab-person {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 22px;
}

.fct-destination .fct-ab-person__text {
	max-width: 34em;
}

.fct-destination .fct-ab-person > .wp-block-image {
	margin: 6px 0 0;
}

.fct-destination .fct-ab-person > .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: 10px;
}

.fct-destination .fct-ab-person__name {
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fct-destination .fct-ab-person__line {
	margin: 10px 0 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(21px, calc(19.5px + 0.38vw), 24px);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.fct-destination .fct-ab-person__bio {
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.6;
}

.fct-destination .fct-ab-together {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 16px;
	margin-top: clamp(64px, calc(0.8 * var(--pad)), 96px);
	padding-top: 32px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ab-together__h {
	max-width: 520px;
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--h2);
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -0.015em;
}

.fct-destination .fct-ab-together__p {
	max-width: 560px;
	margin: 6px 0 0;
	font-size: var(--copy);
	line-height: 1.65;
}

.fct-destination .fct-ab-team + .fct-wwd-band {
	margin-top: var(--pad);
}

@media (max-width: 599.98px) {
	.fct-destination .fct-ab-person:has(> .wp-block-image) {
		grid-template-columns: clamp(105px, calc(28.57vw + 18.6px), 140px) minmax(0, 1fr);
		grid-template-rows: auto 1fr auto;
		grid-template-areas: "photo name" "photo line" "bio bio";
		column-gap: clamp(14px, 4.6vw, 20px);
		row-gap: 0;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) .fct-ab-person__text {
		display: contents;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) > .wp-block-image {
		grid-area: photo;
		margin: 0;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) .fct-ab-person__name {
		grid-area: name;
		margin-top: 2px;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) .fct-ab-person__line {
		grid-area: line;
		align-self: start;
		margin-top: 8px;
		font-size: clamp(18px, calc(2.857vw + 8.86px), 21px);
		line-height: 1.22;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) .fct-ab-person__bio {
		grid-area: bio;
		margin-top: 20px;
	}
}

@media (min-width: 600px) {
	.fct-destination .fct-ab-person:has(> .wp-block-image) {
		grid-template-columns: clamp(180px, calc(108px + 12vw), 240px) minmax(0, 34em);
		column-gap: clamp(28px, calc(16px + 2vw), 40px);
		align-items: start;
	}
}

@media (min-width: 960px) {
	/* "Stop asking fish" is 7.56 em: in the heading column of 960–1022 px (280–293 px) it would break as
	   Stop / asking fish; its two lines stay whole (≤ 7 px into the 36 px column gap). */
	.fct-destination .fct-ab-about .fct-wwd-h2 .fct-wwd-line {
		white-space: nowrap;
	}

	.fct-destination .fct-ab-team__head {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: 64px;
		row-gap: 0;
		align-items: end;
	}

	.fct-destination .fct-ab-team__intro {
		margin-bottom: 8px;
		font-size: 19px;
	}

	.fct-destination .fct-ab-together {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: 64px;
		row-gap: 0;
	}

	.fct-destination .fct-ab-together__p {
		font-size: 18px;
	}
}

@media (min-width: 1200px) {
	.fct-destination .fct-ab-people {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: calc(10vw - 56px);
		row-gap: 80px;
	}

	.fct-destination .fct-ab-person:has(> .wp-block-image) {
		grid-template-columns: calc(11.667vw + 8px) minmax(0, 1fr);
		column-gap: calc(1.667vw + 4px);
	}

	.fct-destination .fct-ab-person:nth-child(even) {
		margin-top: 96px;
	}

	.fct-destination .fct-ab-person:nth-child(3) {
		margin-top: -16px;
	}
}

/* =====================================================================================================
 * Contact (Phase 5h; docs/PAGES.md, approved 2026-10-10: cp-01, cp-02, cpr-01, cpr-02). The opener (text, the
 * mail block — address and "Stuur een mail" from Settings → FCT, inc/contact.php — and the landscape in the
 * theme's mask organic-r8.svg with the note), then two shared editorial rows; no contact band (D9).
 * Composed per breakpoint (the site's 960 and 600):
 *   ≥ 960     side by side (R8's order); the landscape at 44.44 vw (640 px at 1440), object-position 70% 50%
 *   600–959   stacked in reading order; the landscape max. 600 px, right-aligned, the same crop
 *   < 600     stacked; the landscape over the content width, zoomed 1.25× towards the walker
 * The mask keeps its traced ratio (1.2093) at every size, so its shape never distorts; the note sits low against
 * the image's left edge, on the paper of the mask's empty lower left (never on the image).
 * ===================================================================================================== */
.fct-destination .fct-ct-opener {
	--zoom: 1.25;
	--origin: 77% 62%;

	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 40px;
	box-sizing: border-box;
	padding: 48px var(--m) 40px;
}

.fct-destination .fct-ct-opener .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-ct-h1 {
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(36px, calc(8.57vw + 8.6px), 46px);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -0.02em;
}

/* The two lines fit every width at normal spacing (≥ 40 px to spare), so they do not wrap; with a reader's larger text
   spacing (WCAG 1.4.12) they may, instead of running out of the page at 320 px (Phase 6A; was nowrap). */
.fct-destination .fct-ct-h1 .fct-wwd-line {
	white-space: normal;
}

.fct-destination .fct-ct-lead {
	max-width: 540px;
	margin: 22px 0 0;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-ct-mail {
	margin-top: 32px;
	padding-top: 22px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ct-opener .fct-ct-mail__label {
	margin: 0 0 10px;
}

.fct-destination .fct-ct-mail__address {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(22px, calc(1.2vw + 17px), 26px);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
	overflow-wrap: anywhere;
}

.fct-destination .fct-ct-mail__address a {
	color: var(--wp--preset--color--forest);
	text-decoration: none;
}

.fct-destination .fct-ct-mail__address a:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.fct-destination .fct-ct-mail .wp-block-buttons {
	margin-top: 22px;
}

.fct-destination .fct-ct-visual {
	position: relative;
}

.fct-destination .fct-ct-photo {
	position: relative;
	aspect-ratio: 1.2093;
	margin: 0;
	overflow: hidden;
	-webkit-mask: url("../masks/organic-r8.svg?v=f13f784d9873") center / 100% 100% no-repeat;
	mask: url("../masks/organic-r8.svg?v=f13f784d9873") center / 100% 100% no-repeat;
}

.fct-destination .fct-ct-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% 50%;
	transform: scale(var(--zoom));
	transform-origin: var(--origin);
}

.fct-destination .fct-ct-note {
	position: absolute;
	top: 95%;
	left: 0;
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--note);
	font-size: clamp(24px, calc(3.4vw + 11px), 26px);
	line-height: 1.05;
	transform: rotate(-7deg);
	transform-origin: left center;
}

.fct-destination .fct-ct-note__line {
	display: block;
	white-space: nowrap;
}

.fct-destination .fct-ct-note__line + .fct-ct-note__line {
	margin-left: 1.1em;
}

@media (min-width: 600px) {
	.fct-destination .fct-ct-opener {
		--zoom: 1;

		row-gap: 48px;
		padding-top: 64px;
		padding-bottom: 48px;
	}

	.fct-destination .fct-ct-h1 {
		font-size: clamp(46px, calc(1.79vw + 35.3px), 52px);
	}

	.fct-destination .fct-ct-visual {
		justify-self: end;
		width: min(100%, 600px);
	}

	.fct-destination .fct-ct-note {
		top: 90%;
		font-size: 30px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-ct-opener {
		grid-template-columns: minmax(0, 560px) 44.444vw;
		column-gap: clamp(40px, 3.611vw, 52px);
		justify-content: space-between;
		align-items: start;
		padding-top: clamp(72px, 7.64vw, 110px);
		padding-bottom: 0;
	}

	.fct-destination .fct-ct-h1 {
		font-size: clamp(52px, calc(5vw + 4px), 76px);
	}

	.fct-destination .fct-ct-lead {
		margin-top: 30px;
		font-size: 19px;
	}

	.fct-destination .fct-ct-mail {
		margin-top: 40px;
		padding-top: 24px;
	}

	.fct-destination .fct-ct-mail__address {
		font-size: clamp(24px, calc(1.25vw + 12px), 30px);
	}

	.fct-destination .fct-ct-mail .wp-block-buttons {
		margin-top: 26px;
	}

	.fct-destination .fct-ct-visual {
		width: auto;
	}

	.fct-destination .fct-ct-note {
		top: 89%;
		font-size: clamp(30px, calc(0.83vw + 22px), 34px);
	}
}

/* --- the two rows: the shared editorial row (stacked below 960) ------------------------------------- */
.fct-destination .fct-ct-sec {
	box-sizing: border-box;
	padding: var(--pad) var(--m) 0;
}

.fct-destination .fct-ct-sec > .fct-wwd-row {
	padding-top: 28px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ct-sec .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-ct-sec .fct-wwd-h2 {
	margin: 0;
}

.fct-destination .fct-ct-sec--last {
	padding-bottom: var(--pad);
}

.fct-destination .fct-ct-read {
	max-width: 640px;
}

.fct-destination .fct-ct-read p {
	margin: 0 0 18px;
	font-size: var(--copy);
	line-height: 1.65;
}

.fct-destination .fct-ct-points {
	margin: 0 0 22px;
	padding: 0;
	list-style: none;
}

.fct-destination .fct-ct-points li {
	position: relative;
	margin: 0 0 10px;
	padding-left: 26px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-ct-points li::before {
	content: "";
	position: absolute;
	top: 0.8em;
	left: 0;
	width: 14px;
	height: 2px;
	background: var(--wp--preset--color--forest);
}

.fct-destination .fct-ct-read .fct-ct-privacy {
	margin-top: 30px;
	padding-top: 18px;
	border-top: 1px solid rgb(18 56 61 / 22%);
	color: var(--wp--preset--color--charcoal);
	font-size: 15px;
}

/* =====================================================================================================
 * Workshops (Phase 5i; docs/PAGES.md, desktop approved 2026-10-11: WS-03). The opener (text and the supplied
 * illustration, whole — no mask, Gold or note added: its painted circle, torn edge and handwriting are part of
 * it; its handwriting in Forest, WS-04), "Voor wie" as a quiet transition, five workshops as five editorial rows
 * (WS-04, the final baseline), the Fellowship on sage, the shared contact band (without the mail line here).
 * The image is a WebP with a transparent background, so the paper runs through. Its torn lower edge stands on
 * the hairline of "Voor wie": the source's lower edge (≈ row 1150 of 1178, 2.1 % of its width above its own
 * bottom) is pulled onto the line. Its right edge is the source's straight edge and runs off the page; the
 * handwriting keeps 3.5 % of the image width from it.
 * Composed per breakpoint (the site's 600, 960 and 1200):
 *   ≥ 1200     WS-03: the image 58.33 vw (840 px at 1440), right edge on the viewport, beside the text
 *   960–1199   side by side; the image 56 vw; the text column narrows so it never reaches the photo
 *   600–959    stacked: text, then the image 92 vw running off the right edge
 *   < 600      stacked: text, then the image over the full width
 * Above 1440 the composition stays the 1440 one, centred.
 * ===================================================================================================== */
.fct-destination :is(.fct-ws-opener, .fct-ws-audience, .fct-ws-list, .fct-ws-fellow) {
	--wsx: max(var(--m), calc((100vw - 1252px) / 2));

	box-sizing: border-box;
	padding-inline: var(--wsx);
}

.fct-destination .fct-ws-opener {
	--hw: 100vw;

	position: relative;
	display: flex;
	flex-direction: column;
	padding-top: 48px;
}

.fct-destination .fct-ws-opener .is-style-eyebrow {
	margin: 0 0 16px;
}

.fct-destination .fct-ws-h1 {
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(36px, calc(8.57vw + 8.6px), 46px);
	font-weight: 700;
	line-height: 0.98;
	letter-spacing: -0.025em;
}

.fct-destination .fct-ws-h1 .fct-wwd-line {
	display: block;
	white-space: nowrap;
}

.fct-destination .fct-ws-lead {
	max-width: 470px;
	margin-top: 22px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.01em;
}

.fct-destination .fct-ws-body {
	max-width: 470px;
	margin-top: 14px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-ws-hero {
	width: var(--hw);
	max-width: none;
	margin: 32px 0 calc(-0.021 * var(--hw)) calc(-1 * var(--wsx));
}

.fct-destination .fct-ws-hero img {
	display: block;
	width: 100%;
	height: auto;
}

@media (min-width: 600px) {
	.fct-destination .fct-ws-opener {
		--hw: 92vw;

		padding-top: 64px;
	}

	.fct-destination .fct-ws-h1 {
		font-size: clamp(52px, calc(4.76vw + 23.4px), 64px);
	}

	.fct-destination .fct-ws-lead {
		margin-top: 26px;
		font-size: 22px;
	}

	.fct-destination .fct-ws-hero {
		align-self: flex-end;
		margin: 40px calc(-1 * var(--wsx)) calc(-0.021 * var(--hw)) 0;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-ws-opener {
		--hw: 56vw;

		display: block;
		min-height: calc(0.895 * var(--hw));
		padding-top: 88px;
	}

	.fct-destination .fct-ws-opener__text {
		position: relative;
		z-index: 2;
		padding-bottom: 96px;
	}

	.fct-destination .fct-ws-opener .is-style-eyebrow {
		margin-bottom: 18px;
	}

	.fct-destination .fct-ws-h1 {
		font-size: clamp(53px, 5.555vw, 80px);
	}

	/* The lead and body stop short of the photo: its left edge is 3.6 % into the image. */
	.fct-destination :is(.fct-ws-lead, .fct-ws-body) {
		max-width: min(470px, calc(100vw - 0.964 * var(--hw) - var(--wsx) - 40px));
	}

	.fct-destination .fct-ws-lead {
		margin-top: 30px;
		font-size: 24px;
	}

	.fct-destination .fct-ws-body {
		margin-top: 18px;
	}

	.fct-destination .fct-ws-hero {
		position: absolute;
		right: max(0px, calc((100vw - 1440px) / 2));
		bottom: calc(-0.021 * var(--hw));
		z-index: 1;
		margin: 0;
	}
}

@media (min-width: 1200px) {
	.fct-destination .fct-ws-opener {
		--hw: min(58.333vw, 840px);
	}
}

/* --- Voor wie: a quiet transition; the image stands on its hairline ---------------------------------- */
.fct-destination .fct-ws-audience__inner {
	max-width: 1252px;
	margin-inline: auto;
	padding-top: 26px;
	border-top: 1px solid rgb(18 56 61 / 30%);
}

.fct-destination .fct-ws-audience__text {
	max-width: 700px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.38;
	letter-spacing: -0.005em;
}

@media (min-width: 600px) {
	.fct-destination .fct-ws-audience__inner {
		padding-top: 30px;
	}

	.fct-destination .fct-ws-audience__text {
		font-size: 21px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-ws-audience__inner {
		padding-top: 32px;
	}

	.fct-destination .fct-ws-audience__text {
		font-size: 24px;
		line-height: 1.35;
	}
}

/* --- the five workshops: five editorial rows (WS-04, approved 2026-10-11) ----------------------------------
   Each workshop one row: a hairline above (and one under the fifth), the title left on the shared editorial row's
   title column (fct-wwd-row: 380 px at 1440), the hook and the description right, the award line under "Regels
   breken mag?". The content sets each row's height; one spacing above and below every row. Below 960 one column:
   title, hook, description. No hook in the hand, no cards, icons, numbers or per-workshop actions. */
.fct-destination .fct-ws-list {
	padding-top: 72px;
}

.fct-destination .fct-ws-board {
	max-width: 1252px;
	margin-inline: auto;
}

.fct-destination .fct-ws-w {
	padding: 36px 0 40px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ws-w:last-child {
	border-bottom: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ws-w__title {
	max-width: 14em;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(30px, calc(2.5vw + 20px), 36px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.022em;
}

.fct-destination .fct-ws-w__hook {
	max-width: 24em;
	margin-top: 14px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 19px;
	font-weight: 500;
	line-height: 1.32;
	letter-spacing: -0.005em;
}

.fct-destination .fct-ws-w__body {
	max-width: 36em;
	margin-top: 12px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-ws-w__award {
	width: fit-content;
	max-width: 100%;
	margin-top: 18px;
	padding-top: 12px;
	border-top: 2px solid var(--wp--preset--color--forest);
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
}

@media (min-width: 600px) {
	.fct-destination .fct-ws-list {
		padding-top: 96px;
	}

	.fct-destination .fct-ws-w {
		padding: 44px 0 48px;
	}

	.fct-destination .fct-ws-w__hook {
		font-size: 21px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-ws-list {
		padding-top: 120px;
	}

	.fct-destination .fct-ws-w {
		display: grid;
		grid-template-columns: clamp(280px, calc(80px + 20.83vw), 380px) minmax(0, 1fr);
		column-gap: clamp(36px, calc(16px + 2.083vw), 46px);
		align-items: start;
		padding: 52px 0 56px;
	}

	.fct-destination .fct-ws-w__title {
		font-size: clamp(32px, calc(1.25vw + 20px), 38px);
	}

	.fct-destination .fct-ws-w__hook {
		margin-top: 4px;
		font-size: 22px;
		line-height: 1.3;
	}

	.fct-destination .fct-ws-w__body {
		margin-top: 14px;
	}

	.fct-destination .fct-ws-w__award {
		font-size: 16px;
	}
}

/* --- Fellowship: its own sage section; the goal after "Het doel?" -------------------------------------- */
.fct-destination .fct-ws-fellow {
	padding-block: 64px 72px;
	background: var(--wp--preset--color--sage);
}

.fct-destination .fct-ws-fellow__inner {
	max-width: 1252px;
	margin-inline: auto;
}

.fct-destination .fct-ws-fellow .is-style-eyebrow {
	margin: 0 0 14px;
}

.fct-destination .fct-ws-fellow__h2 {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(34px, calc(2.86vw + 24.9px), 44px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.022em;
}

.fct-destination .fct-ws-fellow__read {
	padding-top: 22px;
}

.fct-destination .fct-ws-fellow__read p {
	max-width: 34em;
	margin-bottom: 16px;
	font-size: var(--copy);
	line-height: 1.6;
}

.fct-destination .fct-ws-fellow__goal {
	margin-top: 32px;
	padding-top: 26px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ws-fellow__q {
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--note);
	font-size: 38px;
	line-height: 1;
}

.fct-destination .fct-ws-fellow__q span {
	position: relative;
	display: inline-block;
	padding: 0 0.12em;
	isolation: isolate;
}

.fct-destination .fct-ws-fellow__q span::before {
	content: "";
	position: absolute;
	right: -0.12em;
	bottom: 0.02em;
	left: -0.08em;
	z-index: -1;
	height: 0.42em;
	background: var(--wp--preset--color--gold);
	-webkit-mask: url("../masks/marker-stroke.svg?v=e8543023ce30") center / 100% 100% no-repeat;
	mask: url("../masks/marker-stroke.svg?v=e8543023ce30") center / 100% 100% no-repeat;
}

.fct-destination .fct-ws-fellow__aim {
	max-width: 28em;
	margin-top: 14px;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.34;
	letter-spacing: -0.008em;
}

.fct-destination .fct-ws-fellow__close {
	max-width: 34em;
	margin-top: 16px;
	font-size: var(--copy);
	line-height: 1.6;
}

@media (min-width: 600px) {
	.fct-destination .fct-ws-fellow {
		padding-block: 80px 88px;
	}

	.fct-destination .fct-ws-fellow__goal {
		margin-top: 40px;
		padding-top: 30px;
	}

	.fct-destination .fct-ws-fellow__q {
		font-size: 42px;
	}

	.fct-destination .fct-ws-fellow__aim {
		font-size: 22px;
	}
}

@media (min-width: 960px) {
	.fct-destination .fct-ws-fellow {
		padding-block: 92px 100px;
	}

	.fct-destination :is(.fct-ws-fellow__top, .fct-ws-fellow__goal) {
		display: grid;
		grid-template-columns: minmax(0, 47.8fr) minmax(0, 52.2fr);
		column-gap: clamp(48px, 5.556vw, 80px);
	}

	.fct-destination .fct-ws-fellow__h2 {
		font-size: clamp(40px, 3.611vw, 52px);
	}

	.fct-destination .fct-ws-fellow__read {
		padding-top: 34px;
	}

	.fct-destination .fct-ws-fellow__goal {
		align-items: start;
		margin-top: 52px;
		padding-top: 34px;
	}

	.fct-destination .fct-ws-fellow__q {
		justify-self: end;
		font-size: 46px;
	}

	.fct-destination .fct-ws-fellow__aim {
		margin-top: 4px;
		font-size: 24px;
		line-height: 1.32;
	}

	.fct-destination .fct-ws-fellow__close {
		margin-top: 18px;
	}
}

/* The overview's opening article (fct/insights-lead, Optimalisatie 3, D-031): a one-item card list above the grid,
   so it takes the approved one-item row from 960 px and the approved list below; here only its distance to the
   grid, and below 600 px one hairline between it and the index instead of two. */
.fct-destination .fct-in-lead {
	margin-bottom: 48px;
}

/* Five articles (2026-10-17): an opening article with four cards below stands as two rows of the approved two-column
   state from 960 px (2 × 2). Only after an opening article and only with exactly four cards; below 960 px the
   approved list. */
@media (min-width: 960px) {
	.fct-destination .fct-in-lead ~ .fct-in-query .fct-in-cards:has(> li:nth-child(4):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 959.98px) {
	.fct-destination .fct-in-lead {
		margin-bottom: 24px;
	}
}

@media (max-width: 599.98px) {
	.fct-destination .fct-in-lead {
		margin-bottom: 0;
	}

	.fct-destination .fct-in-lead > li:last-child .fct-in-card {
		border-bottom: 0;
	}
}

/* --- AI captions (Phase 6B.2, inc/ai-images.php) ------------------------------------------------------------------
   Workshops: below 960 px under the picture, right-aligned (the figure is in the flow); from 960 px, where the figure
   is anchored to the opener's foot, inside its transparent lower-left corner, so nothing moves and nothing reaches
   into the next section. */
.fct-destination .fct-ws-hero > .fct-ai-credit {
	max-width: none;
	/* The figure reaches 2.1 % of its width into the next section (its negative bottom margin); the caption keeps
	   that much plus 20 px clear of the section's rule (6B.2 review: 10 px read as part of the next section). */
	margin: 6px var(--wsx, 0px) calc(0.021 * var(--hw) + 20px) auto;
	text-align: right;
}

@media (min-width: 960px) {
	/* Two lines in the corner, its edge measured from the image's alpha (≥ 23.6 % free at the top line's height),
	   2 % of the figure's width above the next section's rule. */
	.fct-destination .fct-ws-hero > .fct-ai-credit {
		position: absolute;
		bottom: 3.4%;
		left: 0;
		width: max-content;
		max-width: 26%;
		margin: 0;
		text-align: left;
	}
}

/* Inzichten overview: one caption after the cards; hidden where the overview hides the card images (below 600 px). */
.fct-destination .fct-in-list > .fct-in-credit,
.fct-destination .fct-in-query > .fct-in-credit {
	margin-top: 28px;
}

@media (max-width: 599.98px) {
	.fct-destination .fct-in-credit {
		display: none;
	}
}

/* "Verder lezen": one caption after the cards. */
.fct-destination .fct-cs-related__credit {
	margin-top: 20px;
}

/* Over FCT — "Over onze beelden" (Phase 6B.2): a quiet closing row in the reading measure of "Samen zijn we Fish
   Climbing Trees.", under a hairline; the heading smaller than the page's H2s. */
.fct-destination .fct-ab-images {
	box-sizing: border-box;
	max-width: calc(1252px + 2 * var(--m));
	margin: 0 auto;
	padding: clamp(56px, calc(0.7 * var(--pad)), 88px) var(--m) 0;
}

.fct-destination .fct-ab-images__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	row-gap: 10px;
	padding-top: 28px;
	border-top: 1px solid rgb(18 56 61 / 22%);
}

.fct-destination .fct-ab-images__h {
	margin: 0;
	color: var(--wp--preset--color--forest);
	font-family: var(--wp--preset--font-family--display);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.005em;
}

.fct-destination .fct-ab-images__p {
	max-width: 560px;
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
}

.fct-destination .fct-ab-images + .fct-wwd-band {
	margin-top: var(--pad);
}

@media (min-width: 960px) {
	.fct-destination .fct-ab-images__inner {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: 64px;
		row-gap: 0;
	}
}