/* ==========================================================================
   BKA 2026 v5 · 7/8 SECTIONS – the generic page template's bands.
   flow · media-text · quote · values · pillars · zig-zag programmes ·
   routes · team · cards · legacy · giving (donation pages).
   ========================================================================== */

.v5-flow__title {
	margin: 2.4em 0 .7em;
	color: var(--v5-red);
	font-size: clamp(1.625rem, 1.15rem + 1.5vw, 2.375rem);
	line-height: 1.12;
}
.v5-flow__part:first-child > .v5-flow__title:first-child { margin-top: 0; }
.v5-flow__part + .v5-flow__part { margin-top: 1.4em; }
.v5-flow__copy { font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); }
.v5-flow__copy > .v5-flow__part:first-child > p:first-child {
	color: var(--v5-ink);
	font-size: 1.12em;
	line-height: 1.62;
}
.v5-flow__list { margin: 1.25rem 0 1.5rem; }

.v5-flow--aside .v5-flow__layout {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: var(--v5-gap-lg);
	align-items: start;
}
.v5-flow__aside {
	position: sticky;
	top: calc(var(--v5-header-h) + 2rem);
	display: grid;
	gap: var(--v5-gap);
}
.v5-flow__photo { overflow: hidden; border-radius: var(--v5-radius-lg); background: var(--v5-mist); aspect-ratio: 4 / 5; }
.v5-flow__photo + .v5-flow__photo { width: 72%; margin-top: -24%; margin-left: auto; aspect-ratio: 1; border: 6px solid var(--v5-white); box-shadow: var(--v5-shadow-lift); }
.v5-band--mist .v5-flow__photo + .v5-flow__photo { border-color: var(--v5-mist); }
.v5-flow__photo img { width: 100%; height: 100%; object-fit: cover; }
.v5-flow__photo:only-child { aspect-ratio: 4 / 3; }

/* Flow compositions: split (lead | body), single (statement), column */
.v5-flow--split .v5-flow__layout {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--v5-gap-lg);
	align-items: start;
}
.v5-flow__lead { position: sticky; top: calc(var(--v5-header-h) + 2rem); }
.v5-flow__lead p {
	margin: 0;
	color: var(--v5-ink);
	font-family: var(--v5-font-display);
	font-size: clamp(1.5rem, 1.1rem + 1.25vw, 2.25rem);
	line-height: 1.24;
	text-wrap: pretty;
}
.v5-flow__lead p strong { font-weight: var(--v5-w-display); color: var(--v5-red); }
.v5-flow--split .v5-flow__copy { max-width: none; }
.v5-flow--split .v5-flow__copy > .v5-flow__part:first-child > p:first-child { font-size: 1em; color: inherit; line-height: inherit; }
.v5-flow--column .v5-flow__copy { margin-inline: auto; }
.v5-flow__statement { max-width: 58rem; margin-inline: auto; text-align: center; }
.v5-flow__statement-text p {
	margin: 0;
	color: var(--v5-ink);
	font-family: var(--v5-font-display);
	font-size: clamp(1.5rem, 1.05rem + 1.45vw, 2.375rem);
	line-height: 1.3;
	text-wrap: balance;
}
.v5-flow__statement-text strong { font-weight: var(--v5-w-display); color: var(--v5-red); }

/* Related programmes */
.v5-related__parent { color: inherit; text-decoration: none; }
.v5-related__parent:hover { color: var(--v5-red-600); text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: .18em; }

/* Text + its own photographs */
.v5-media-text--beside .v5-media-text__layout {
	display: grid;
	grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
	gap: var(--v5-gap-lg);
	align-items: start;
}
.v5-media-text__copy { font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); }
.v5-media-text__copy > p:first-of-type { color: var(--v5-ink); font-size: 1.1em; line-height: 1.62; }
.v5-media-text__media { position: sticky; top: calc(var(--v5-header-h) + 2rem); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.v5-media-text__media > figure,
.v5-media-text__media > figure:nth-child(5n + 1) { grid-column: span 1; grid-row: auto; aspect-ratio: 1; }
.v5-media-text__media > figure:first-child { grid-column: 1 / -1; aspect-ratio: 3 / 2; }
.v5-media-text__media.v5-mosaic--2 > figure:last-child { grid-column: 1 / -1; aspect-ratio: 3 / 2; }
.v5-media-text__media.v5-mosaic--1 > figure:first-child { aspect-ratio: 4 / 5; }
.v5-media-text__action { margin-top: 2rem; }
.v5-media-text .v5-gallery { margin-top: clamp(2rem, 1.5rem + 2vw, 3.5rem); }

/* Quote → statement band */
.v5-quote__title {
	margin: 0 0 1.5rem;
	color: var(--v5-red);
	font-size: clamp(1.5rem, 1.1rem + 1.3vw, 2.25rem);
}
.v5-quote__figure {
	padding: .35rem 0 .35rem clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
	border-left: 5px solid var(--v5-red);
}
.v5-quote .v5-statement__text { max-width: 36ch; }
.v5-quote .v5-statement__text :where(p) { margin: 0; }

/* Values (red band) */
.v5-values .v5-title { margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.v5-values__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--v5-on-red-rule);
	border-radius: var(--v5-radius);
	background: var(--v5-on-red-rule);
	list-style: none;
}
.v5-values__item {
	display: grid;
	align-content: space-between;
	gap: 2.25rem;
	min-height: 11rem;
	margin: 0;
	padding: 1.5rem 1.6rem 1.75rem;
	background: var(--v5-red);
	transition: background-color var(--v5-dur) var(--v5-ease);
}
.v5-values__item:hover { background: var(--v5-red-600); }
.v5-values__number { color: rgba(255, 255, 255, .7); font-size: .8125rem; font-weight: var(--v5-w-bold); letter-spacing: .14em; }
.v5-values__text { color: #fff; font-family: var(--v5-font-display); font-size: clamp(1.375rem, 1.1rem + .9vw, 1.875rem); line-height: 1.15; }
.v5-values__list--7 { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.v5-values__list--7 .v5-values__item { grid-column: span 3; }
.v5-values__list--7 .v5-values__item:nth-child(n + 5) { grid-column: span 4; }
.v5-values__list--7 .v5-values__item:nth-child(n + 5),
.v5-values__list--3 .v5-values__item,
.v5-values__list--6 .v5-values__item:nth-child(n + 5) { min-height: 9rem; }

/* Pillars */
.v5-pillars__lead {
	margin: 1.25rem 0 0;
	color: var(--v5-ink);
	font-family: var(--v5-font-display);
	font-size: var(--v5-fs-statement);
	line-height: 1.15;
	text-wrap: balance;
}
.v5-pillars__body .v5-prose { margin-bottom: 1.75rem; font-size: 1.125rem; }
.v5-pillars__list { display: grid; gap: .85rem; margin: 0; padding: 0; list-style: none; }
.v5-pillars__item {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin: 0;
	padding: 1.1rem 1.5rem 1.1rem 1.1rem;
	border-radius: var(--v5-radius);
	background: var(--v5-white);
	box-shadow: var(--v5-shadow-card);
	font-weight: var(--v5-w-ui);
}
.v5-band--white .v5-pillars__item { background: var(--v5-mist); box-shadow: none; }
.v5-pillars__item .v5-icon-disc { background: var(--v5-red); color: #fff; }

/* Programmes: zig-zag rows */
.v5-zigzag { display: grid; gap: clamp(4rem, 3rem + 5vw, 8rem); }
.v5-zigzag__row {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: clamp(2rem, 1rem + 4vw, 6rem);
	align-items: center;
}
.v5-zigzag__row:nth-child(even) .v5-zigzag__media { order: 2; }
.v5-zigzag__media { position: relative; padding-bottom: 8%; }
.v5-zigzag__media .v5-placeholder { aspect-ratio: 4 / 3; border-radius: var(--v5-radius-lg); }
.v5-zigzag__photo { overflow: hidden; border-radius: var(--v5-radius-lg); background: var(--v5-mist); aspect-ratio: 4 / 3; box-shadow: var(--v5-shadow-lift); }
.v5-zigzag__photo img { width: 100%; height: 100%; object-fit: cover; }
.v5-zigzag__photo--inset {
	position: absolute;
	right: -6%;
	bottom: 0;
	width: 42%;
	aspect-ratio: 1;
	border: 6px solid var(--v5-white);
}
.v5-band--mist .v5-zigzag__photo--inset { border-color: var(--v5-mist); }
.v5-zigzag__row:nth-child(even) .v5-zigzag__photo--inset { right: auto; left: -6%; }
.v5-zigzag__number {
	display: block;
	margin-bottom: .75rem;
	color: var(--v5-red);
	font-family: var(--v5-font-display);
	font-size: 1rem;
	letter-spacing: .14em;
}
.v5-zigzag__number::after { content: ""; display: inline-block; width: 2.5rem; height: 2px; margin-left: .75rem; vertical-align: middle; background: currentColor; }
.v5-zigzag__title { margin: 0 0 1rem; color: var(--v5-ink); font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem); line-height: 1.08; }
.v5-zigzag__value { margin: 0 0 .25rem; color: var(--v5-red); font-family: var(--v5-font-display); font-size: var(--v5-fs-h3); }
.v5-zigzag__text { font-size: 1.0625rem; }
.v5-zigzag__action { margin: 1.75rem 0 0; }

.v5-programme-card__body { display: grid; gap: .65rem; padding: 1.4rem 1.5rem 1.6rem; }
.v5-programme-card__title { margin: 0; font-size: clamp(1.25rem, 1.05rem + .6vw, 1.625rem); color: var(--v5-ink); }
.v5-programme-card__value { margin: 0; color: var(--v5-red); font-family: var(--v5-font-display); font-size: var(--v5-fs-h3); }
.v5-programme-card__text > :last-child { margin-bottom: 0; }

/* Routes */
.v5-routes__grid {
	display: grid;
	grid-template-columns: repeat(var(--v5-route-cols, 4), minmax(0, 1fr));
	gap: var(--v5-gap);
}
.v5-routes__grid--3 { --v5-route-cols: 3; }
.v5-route .v5-photo-card__media { aspect-ratio: 4 / 3.1; }

/* Team */
.v5-team__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v5-gap); align-items: start; }
.v5-team__column { padding: clamp(1.75rem, 1.2rem + 1.8vw, 3rem); }
.v5-band--white .v5-team__column { background: var(--v5-mist); box-shadow: none; }
.v5-team__title { margin: 0 0 1.5rem; color: var(--v5-red); font-size: clamp(1.5rem, 1.15rem + 1vw, 2.125rem); letter-spacing: .04em; }
.v5-people { display: grid; gap: .9rem; margin: 0; padding: 0; list-style: none; }
.v5-person { display: flex; align-items: center; gap: 1rem; margin: 0; }
.v5-person__copy { line-height: 1.4; }
.v5-person__name { font-weight: var(--v5-w-bold); color: var(--v5-ink); }
.v5-person__role { color: var(--v5-muted); }
.v5-team__leader { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--v5-line); }
.v5-team__leader p { margin: 0; }
.v5-team__leader-role { color: var(--v5-muted); font-size: .875rem; font-weight: var(--v5-w-bold); letter-spacing: .08em; text-transform: uppercase; }
.v5-team__leader-name { color: var(--v5-ink); font-family: var(--v5-font-display); font-size: 1.5rem; line-height: 1.25; }
.v5-team__note { margin-top: 1.5rem; padding: 1.1rem 1.25rem; border-left: 5px solid var(--v5-red); border-radius: 0 var(--v5-radius-sm) var(--v5-radius-sm) 0; background: var(--v5-white); }
.v5-team__note > :last-child,
.v5-team__thanks > :last-child { margin-bottom: 0; }
.v5-team__thanks { margin-top: .75rem; padding: 1.1rem 1.25rem; border-radius: var(--v5-radius-sm); background: var(--v5-red-100); list-style: none; }

/* Cards */
.v5-cards__title { margin-bottom: 1.5rem; }
.v5-cards__body { margin-bottom: 2rem; }
.v5-card__media { margin: -1.5rem -1.5rem 1.25rem; overflow: hidden; border-radius: var(--v5-radius) var(--v5-radius) 0 0; aspect-ratio: 3 / 2; }
.v5-card__media img { width: 100%; height: 100%; object-fit: cover; }
.v5-card__value { margin: 0 0 .25rem; color: var(--v5-red); font-family: var(--v5-font-display); font-size: var(--v5-fs-h3); }
.v5-person-card { display: grid; justify-items: start; gap: .75rem; }
.v5-person-card .v5-card__title { margin: 0; font-size: 1.25rem; color: var(--v5-ink); }

/* Legacy content */
.v5-legacy__prose { margin-inline: auto; font-size: 1.125rem; }
.v5-link-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: .75rem; margin: 0; padding: 0; list-style: none; }
.v5-link-list li { margin: 0; }
.v5-link-list__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	height: 100%;
	padding: 1.1rem 1.35rem;
	border-radius: var(--v5-radius-sm);
	background: var(--v5-mist);
	color: var(--v5-ink);
	font-weight: var(--v5-w-ui);
	text-decoration: none;
	transition: background-color var(--v5-dur) var(--v5-ease), color var(--v5-dur) var(--v5-ease);
}
.v5-link-list__item:hover { background: var(--v5-red-100); color: var(--v5-red-700); text-decoration: none; }
.v5-link-list__item .v5-icon { color: var(--v5-red); }

/* Giving (donation pages): copy + sticky donation card */
.v5-giving__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(22rem, 27rem);
	gap: var(--v5-gap-lg);
	align-items: start;
}
.v5-giving__copy { font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); }
.v5-giving__copy > p:first-child { color: var(--v5-ink); font-family: var(--v5-font-display); font-size: var(--v5-fs-statement); line-height: 1.18; }
.v5-giving__examples { display: grid; gap: .85rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.v5-giving__examples li { display: flex; align-items: center; gap: 1rem; margin: 0; padding: 1rem 1.25rem 1rem 1rem; border-radius: var(--v5-radius); background: var(--v5-mist); }
.v5-giving__examples li::before { display: none; }
.v5-giving__examples strong { color: var(--v5-red); font-family: var(--v5-font-display); font-weight: var(--v5-w-display); font-size: 1.25rem; }
.v5-giving__donate { position: relative; }

@media (max-width: 68.75rem) {
	.v5-values__list,
	.v5-values__list--7 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.v5-values__list--7 .v5-values__item,
	.v5-values__list--7 .v5-values__item:nth-child(n + 5) { grid-column: auto; }
	.v5-values__list--7 .v5-values__item:last-child { grid-column: 1 / -1; }
	.v5-routes__grid { --v5-route-cols: 2; }
	.v5-routes__grid--3 { --v5-route-cols: 2; }
}

@media (max-width: 56rem) {
	.v5-flow--aside .v5-flow__layout,
	.v5-flow--split .v5-flow__layout,
	.v5-media-text--beside .v5-media-text__layout,
	.v5-giving__grid,
	.v5-team__grid { grid-template-columns: 1fr; }
	.v5-flow__aside,
	.v5-flow__lead,
	.v5-media-text__media { position: static; }
	.v5-flow__statement { text-align: left; }
	.v5-flow__aside { grid-template-columns: 1fr; }
	.v5-flow__photo { aspect-ratio: 3 / 2; }
	.v5-flow__photo + .v5-flow__photo { display: none; }
	.v5-zigzag__row { grid-template-columns: 1fr; gap: 1.75rem; }
	.v5-zigzag__row:nth-child(even) .v5-zigzag__media { order: 0; }
	.v5-zigzag__photo--inset { right: -2%; width: 38%; }
	.v5-zigzag__row:nth-child(even) .v5-zigzag__photo--inset { left: auto; right: -2%; }
}

@media (max-width: 40rem) {
	.v5-values__list,
	.v5-values__list--7,
	.v5-routes__grid,
	.v5-routes__grid--3 { grid-template-columns: 1fr; }
	.v5-values__item { min-height: 0; gap: .75rem; }
}
