/*
 * Component styles for the hand-authored header, footer and homepage
 * section templates. Scoped under top-level `.aislf-*` block classes with
 * `__element` / `--modifier` suffixes (BEM-ish) — this styles PHP templates,
 * not Elementor output, so it stays flat and readable rather than deeply
 * nested. All colour/spacing/type comes from tokens.css; no hex values or
 * magic numbers here.
 */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal;
}

.aislf-skip-link {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	left: var(--aislf-space-2);
	padding: var(--aislf-space-1) var(--aislf-space-2);
	position: fixed;
	top: -5rem;
	z-index: 1000;
}

.aislf-skip-link:focus {
	top: var(--aislf-space-2);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	color: var(--aislf-color-ink);
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-body);
	line-height: var(--aislf-line-height-body);
	margin: 0;
}

/* Disabling Elementor's default fonts does not remove typography already
 * saved in its active site kit. Production's generated post-7.css still sets
 * HELVETICA NEUE directly on `.elementor-kit-7` and its links, as well as in
 * the global typography variables. Match any kit ID so this remains valid if
 * Elementor recreates the kit, while leaving its colours and layout intact. */
body[class*="elementor-kit-"] {
	--e-global-typography-primary-font-family: var(--aislf-font-body) !important;
	--e-global-typography-secondary-font-family: var(--aislf-font-body) !important;
	--e-global-typography-text-font-family: var(--aislf-font-body) !important;
	--e-global-typography-accent-font-family: var(--aislf-font-body) !important;
	font-family: var(--aislf-font-body) !important;
}

body[class*="elementor-kit-"] a,
body[class*="elementor-kit-"] button,
body[class*="elementor-kit-"] input,
body[class*="elementor-kit-"] select,
body[class*="elementor-kit-"] textarea {
	font-family: inherit !important;
}

body[class*="elementor-kit-"] :is(h1, h2, h3, h4, h5, h6) {
	font-family: var(--aislf-font-heading) !important;
}

.aislf-header,
.aislf-main,
.aislf-footer {
	font-family: var(--aislf-font-body) !important;
}

/* Shared link states. Component-specific link colours later in this file take
 * precedence where a dark surface or specialised treatment requires them. */
:where(.aislf-main) a:link {
	color: var(--aislf-color-navy);
}

:where(.aislf-main) a:hover,
:where(.aislf-main) a:focus-visible,
:where(.aislf-main) a:active,
:where(.aislf-main) a:visited {
	color: var(--aislf-color-gold);
}

/* Body-copy links written in the editor.
 *
 * Elementor's reset.css carries `a { color: #cc3366 }`, a magenta belonging to
 * no part of this brand, and every link without a class of its own inherited
 * it — the contact address in the Talent Awards notice among them. Only links
 * with no class are matched, so editor prose is covered while every component
 * link, all of which carry one, keeps its own treatment.
 *
 * `:where()` holds this at the same specificity as `.aislf-breadcrumbs a`
 * rather than above it, so the breadcrumb's own white-on-hero colour still
 * wins on source order and does not have to be defended with !important. */
:where(.aislf-main) a:not([class]) {
	color: var(--aislf-color-navy);
	text-decoration: underline;
	text-decoration-color: var(--aislf-color-gold);
	text-decoration-thickness: 1px;
	text-underline-offset: .18em;
	transition: color 160ms ease, text-decoration-color 160ms ease;
}

:where(.aislf-main) a:not([class]):hover,
:where(.aislf-main) a:not([class]):focus-visible {
	color: var(--aislf-color-gold);
	text-decoration-color: currentColor;
}

/* Theme Switcha changes the PHP theme per visitor but active plugins still
   load the live site's saved global typography. Keep those global heading
   rules (currently Requiem) from overriding this child theme's own surfaces. */
.aislf-header :is(h1, h2, h3, h4, h5, h6),
.aislf-main :is(h1, h2, h3, h4, h5, h6),
.aislf-footer :is(h1, h2, h3, h4, h5, h6) {
	font-family: var(--aislf-font-heading) !important;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

:focus-visible {
	box-shadow: 0 0 0 3px var(--aislf-color-ink), 0 0 0 6px var(--aislf-color-focus);
	outline: 3px solid transparent;
	outline-offset: 3px;
}

/* ---------- Header ---------- */

.aislf-header {
	background: var(--aislf-color-white);
	position: relative;
}

.aislf-header__inner {
	align-items: center;
	display: flex;
	justify-content: space-between;
	gap: var(--aislf-space-2);
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	min-height: var(--aislf-header-height);
	padding-inline: var(--aislf-container-padding);
}

.aislf-header__logos {
	align-items: center;
	display: flex;
	gap: var(--aislf-space-3);
}

.aislf-header__logo {
	height: 3rem; /* 2.5rem base, enlarged 20% per client feedback */
	width: auto;
}

.aislf-header__logo--remote {
	max-width: 9rem; /* 7.5rem base, enlarged 20% to match */
	object-fit: contain;
}

.aislf-header__logo-surface {
	display: inline-flex;
	align-items: center;
}

.aislf-wordmark {
	color: var(--aislf-color-navy);
	display: inline-block;
	font-family: var(--aislf-font-heading);
	font-weight: 700;
	line-height: 1;
}

.aislf-wordmark--foundation {
	font-size: 1.25rem;
}

.aislf-wordmark--harrow {
	border-left: 1px solid var(--aislf-color-gold);
	font-size: 0.9rem;
	margin-left: var(--aislf-space-2);
	padding-left: var(--aislf-space-2);
}

.aislf-header__trigger {
	align-items: center;
	background: none;
	border: 1px solid var(--aislf-color-navy);
	border-radius: var(--aislf-radius);
	color: var(--aislf-color-navy);
	cursor: pointer;
	display: flex;
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-body);
	gap: var(--aislf-space-1);
	min-height: 44px;
	min-width: 44px;
	padding: var(--aislf-space-1) var(--aislf-space-2);
}

/* Elementor global colours load after the child theme; the hand-coded shell
   must retain the approved Foundation navy rather than a saved pink token. */
.aislf-header .aislf-header__trigger {
	border-color: var(--aislf-color-navy) !important;
	color: var(--aislf-color-navy) !important;
}

.aislf-header__trigger-icon {
	background: currentColor;
	display: inline-block;
	height: 2px;
	position: relative;
	width: 1.5rem;
}

.aislf-header__trigger-icon::before,
.aislf-header__trigger-icon::after {
	background: currentColor;
	content: "";
	height: 2px;
	left: 0;
	position: absolute;
	width: 100%;
}

.aislf-header__trigger-icon::before {
	top: 0;
}

.aislf-header__trigger-icon::after {
	bottom: 0;
}

.aislf-header__trigger[aria-expanded="true"] .aislf-header__trigger-icon::before {
	top: 50%;
	transform: rotate(45deg);
}

.aislf-header__trigger[aria-expanded="true"] .aislf-header__trigger-icon::after {
	top: 50%;
	bottom: auto;
	transform: rotate(-45deg);
}

.aislf-header__trigger[aria-expanded="true"] .aislf-header__trigger-icon {
	background: transparent;
}

.aislf-header__nav {
	background: var(--aislf-color-cream);
	border-top: 1px solid var(--aislf-color-navy-light);
}

.aislf-header__nav-list {
	display: flex;
	flex-direction: column;
	list-style: none;
	margin: 0;
	max-width: var(--aislf-max-width);
	margin-inline: auto;
	padding: var(--aislf-space-2) var(--aislf-container-padding);
}

.aislf-header__nav-list a {
	color: var(--aislf-color-navy);
	display: block;
	padding: 0.75rem 0;
	text-decoration: none;
}

.aislf-header__nav-list a:hover,
.aislf-header__nav-list a:focus {
	text-decoration: underline;
}

/* Keep nested WordPress menu levels readable in the collapsed navigation. */
.aislf-header__nav-list .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0 0 0 var(--aislf-space-2);
}

.aislf-header__nav-list .sub-menu a {
	padding-block: .55rem;
}

/* The six approved labels are long; below this width they wrapped to two
   lines each and read as a cramped block, so the Menu disclosure covers
   everything narrower. Keep in step with the matchMedia query in nav.js. */
@media (min-width: 1200px) {
	.aislf-header__trigger {
		display: none;
	}

	.aislf-header__nav-list {
		flex-direction: row;
		gap: var(--aislf-space-4);
	}
}

.aislf-header__divider {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding-block: 3px;
}

.aislf-header__divider-line {
	background: var(--aislf-color-gold);
	display: block;
	height: 1px;
	width: 100%;
}

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

.aislf-hero {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	min-height: 70vh;
	position: relative;
}

.aislf-hero__video,
.aislf-hero__poster {
	height: 100%;
	inset: 0;
	object-fit: cover;
	position: absolute;
	width: 100%;
}

.aislf-hero__overlay {
	background: linear-gradient(to top, rgb(10 37 64 / 70%), rgb(10 37 64 / 10%));
	bottom: 0;
	left: 0;
	padding: var(--aislf-space-6) var(--aislf-container-padding);
	position: absolute;
	right: 0;
}

.aislf-hero__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h1);
	line-height: var(--aislf-line-height-heading);
	margin: 0 0 var(--aislf-space-2);
	max-width: 40ch;
}

.aislf-hero__subheading {
	font-size: 1.125rem;
	margin: 0;
	max-width: 50ch;
}

@media (prefers-reduced-motion: reduce) {
	.aislf-hero__video {
		display: none;
	}
}

/* ---------- Client-review fallback homepage ---------- */

.aislf-preview-hero {
	background: linear-gradient(135deg, var(--aislf-color-navy) 0%, var(--aislf-color-navy-mid) 55%, var(--aislf-color-navy) 100%);
	color: var(--aislf-color-white);
	padding: clamp(6rem, 13vw, 11rem) var(--aislf-container-padding);
}

.aislf-preview-hero__inner,
.aislf-preview-introduction__inner,
.aislf-preview-section-heading,
.aislf-preview-discussion {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
}

.aislf-preview-hero h1,
.aislf-preview-introduction h2,
.aislf-preview-section-heading h2,
.aislf-preview-discussion h2 {
	font-family: var(--aislf-font-heading);
	line-height: var(--aislf-line-height-heading);
}

.aislf-preview-hero h1 {
	font-size: var(--aislf-font-size-h1);
	margin: 0;
	max-width: 15ch;
}

.aislf-preview-kicker {
	color: var(--aislf-color-navy-light);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 var(--aislf-space-2);
	text-transform: uppercase;
}

.aislf-preview-hero .aislf-preview-kicker,
.aislf-preview-discussion .aislf-preview-kicker {
	color: var(--aislf-color-gold);
}

.aislf-preview-hero__intro {
	font-size: 1.125rem;
	margin: var(--aislf-space-3) 0 var(--aislf-space-4);
	max-width: 52ch;
}

.aislf-preview-button {
	background: var(--aislf-color-gold);
	color: var(--aislf-color-navy);
	display: inline-block;
	font-weight: 700;
	min-height: 44px;
	padding: 0.8rem 1.25rem;
	text-decoration: none;
}

.aislf-preview-button:hover,
.aislf-preview-button:focus {
	background: var(--aislf-color-white);
	text-decoration: underline;
}

.aislf-preview-button--secondary {
	background: transparent;
	box-shadow: inset 0 0 0 1px var(--aislf-color-white);
	color: var(--aislf-color-white);
	margin-left: var(--aislf-space-1);
}

.aislf-preview-button--secondary:hover,
.aislf-preview-button--secondary:focus {
	background: var(--aislf-color-white);
	color: var(--aislf-color-navy);
}

.aislf-preview-introduction {
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-preview-introduction__inner {
	max-width: 68ch;
}

.aislf-preview-introduction h2,
.aislf-preview-section-heading h2,
.aislf-preview-discussion h2 {
	font-size: var(--aislf-font-size-h2);
	margin: 0 0 var(--aislf-space-3);
}

.aislf-preview-introduction p:last-child {
	max-width: 60ch;
}

.aislf-preview-areas,
.aislf-preview-pathways {
	background: var(--aislf-color-cream);
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-preview-section-heading {
	margin-bottom: var(--aislf-space-4);
}

.aislf-preview-area-grid,
.aislf-preview-pathways__list {
	display: grid;
	gap: var(--aislf-space-3);
	grid-template-columns: 1fr;
	list-style: none;
	margin: 0 auto;
	max-width: var(--aislf-max-width);
	padding: 0;
}

.aislf-preview-area {
	min-height: 20rem;
	padding: var(--aislf-space-4);
}

.aislf-preview-area--gold {
	background: var(--aislf-color-gold);
	color: var(--aislf-color-navy);
}

.aislf-preview-area--navy,
.aislf-preview-discussion {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-preview-area h3 {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h2);
	margin: var(--aislf-space-4) 0 var(--aislf-space-2);
}

.aislf-preview-area__number,
.aislf-preview-area__note {
	font-size: var(--aislf-font-size-eyebrow);
	letter-spacing: 0.08em;
	margin: 0;
	text-transform: uppercase;
}

.aislf-preview-area__note {
	margin-top: var(--aislf-space-4);
}

.aislf-preview-pathways {
	background: var(--aislf-color-white);
}

.aislf-preview-pathways__list li {
	border-top: 1px solid var(--aislf-color-gold);
	padding: var(--aislf-space-3) 0;
}

.aislf-preview-pathways__list h3 {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h3);
	margin: 0 0 var(--aislf-space-1);
}

.aislf-preview-pathways__list p {
	margin: 0 0 var(--aislf-space-2);
}

.aislf-preview-pathways__list a {
	color: var(--aislf-color-navy);
	font-weight: 700;
}

.aislf-preview-discussion {
	display: grid;
	gap: var(--aislf-space-4);
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-preview-discussion ul {
	margin: 0;
	padding-left: 1.2em;
}

.aislf-preview-discussion li + li {
	margin-top: var(--aislf-space-1);
}

.aislf-wordmark--footer {
	color: var(--aislf-color-white);
	font-size: 1.5rem;
}

@media (min-width: 700px) {
	.aislf-preview-area-grid,
	.aislf-preview-pathways__list {
		grid-template-columns: repeat(2, 1fr);
	}

	.aislf-preview-discussion {
		grid-template-columns: 1fr 1fr;
	}
}

/* ---------- Statement ---------- */

.aislf-statement {
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-statement__inner {
	margin-inline: auto;
	max-width: 65ch;
	text-align: center;
}

.aislf-statement__eyebrow {
	color: var(--aislf-color-gold-text);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-2);
	text-transform: uppercase;
}

.aislf-statement__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h2);
	line-height: var(--aislf-line-height-heading);
	margin: 0 0 var(--aislf-space-3);
}

.aislf-statement__body {
	color: var(--aislf-color-ink);
}

/* ---------- Pillar grid ---------- */

.aislf-pillar-grid {
	padding: var(--aislf-space-8) var(--aislf-container-padding);
	margin-inline: auto;
	max-width: var(--aislf-max-width);
}

.aislf-pillar-grid__list {
	display: grid;
	gap: var(--aislf-space-4);
	grid-template-columns: 1fr;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 640px) {
	.aislf-pillar-grid__list {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.aislf-pillar-grid__list {
		grid-template-columns: repeat(3, 1fr);
	}
}

.aislf-pillar-card {
	background: var(--aislf-color-cream);
	border-radius: var(--aislf-radius);
	padding: var(--aislf-space-4);
}

.aislf-pillar-card__eyebrow {
	color: var(--aislf-color-gold-text);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-1);
	text-transform: uppercase;
}

.aislf-pillar-card__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h3);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-pillar-card__body {
	margin: 0 0 var(--aislf-space-3);
}

.aislf-pillar-card__link {
	color: var(--aislf-color-navy);
	font-weight: bold;
	text-decoration: none;
}

.aislf-pillar-card__link:hover,
.aislf-pillar-card__link:focus {
	text-decoration: underline;
}

/* ---------- Two column page template ---------- */

.aislf-two-column-page {
	background: var(--aislf-color-white);
}

.aislf-two-column-page__container,
.aislf-standard-page__container,
.aislf-detailed-page__container {
	width: 100%;
	max-width: var(--aislf-max-width);
	margin-inline: auto;
	padding-inline: var(--aislf-container-padding);
}

/* Standard inner pages share the About page's wider editorial gutter. */
.aislf-standard-page__container {
	max-width: var(--aislf-option-max-width);
	padding-inline: var(--aislf-option-gutter);
}

/* Body copy inherited a neutral grey here while every other template uses
   the brand navy. */
.aislf-two-column-page {
	color: var(--aislf-color-navy);
}

/* Standing notice under the banner. Gold rule and cream ground, the same
   card language as the reference blocks on the standard inner page. */
/* Type scale matched to the About page. The opening gold paragraph ran at
   40px against About's lead, and section headings ran at the page-title
   size rather than the section size. */
.aislf-two-column-page__highlight {
	font-size: var(--aislf-font-size-lead);
	line-height: 1.45;
}

.aislf-two-column-page__container h2,
.aislf-two-column-page__main-title {
	font-size: clamp(2rem, 3vw, 2.75rem);
	line-height: 1.12;
}

.aislf-two-column-page__hero h1 {
	font-size: var(--aislf-font-size-h1);
}

.aislf-two-column-page__secondary-intro {
	font-size: var(--aislf-font-size-body);
}

.aislf-two-column-page__notice {
	padding-block: var(--aislf-space-4) 0;
}

.aislf-two-column-page__notice-inner {
	border-left: 3px solid var(--aislf-color-gold);
	background: var(--aislf-color-cream);
	padding: clamp(1.25rem, 2vw, 1.75rem) clamp(1.25rem, 2.4vw, 2rem);
}

.aislf-two-column-page__notice-inner > :first-child { margin-top: 0; }
.aislf-two-column-page__notice-inner > :last-child { margin-bottom: 0; }

.aislf-two-column-page__notice-inner p {
	/* Runs the full width of its box. A measure cap here left the notice
	   breaking mid-sentence with half the panel empty beside it, which read
	   as a layout fault rather than as restraint. */
	max-width: none;
	font-size: 1rem;
	line-height: var(--aislf-line-height-body);
}

/* Section headings matched to the About page rather than running at the
   page-title size. */
.aislf-two-column-page__main h2,
.aislf-two-column-page__main-title {
	font-size: clamp(2rem, 3vw, 2.75rem);
	line-height: 1.12;
}

.aislf-two-column-page__hero {
	display: flex;
	align-items: flex-end;
	/* Same banner height as the About page and the standard inner page. */
	min-height: 320px;
	padding-block: 2.5rem;
	background: var(--aislf-color-cream);
}

.aislf-two-column-page__hero--image {
	background-color: var(--aislf-color-navy);
	/* Banner is a 4.5:1 strip against much squarer source photography, so
	   cover always crops hard vertically. Centred, the crop began a quarter
	   of the way down and cut the tops off the faces, which sit high in
	   these images. Biasing upward keeps them whole. */
	background-position: 50% 20%;
	background-repeat: no-repeat;
	background-size: cover;
	color: var(--aislf-color-white);
	isolation: isolate;
	position: relative;
}

.aislf-two-column-page__hero--image::before {
	background: var(--aislf-color-navy);
	content: "";
	inset: 0;
	opacity: .58;
	position: absolute;
	z-index: 0;
}

.aislf-two-column-page__hero--image .aislf-two-column-page__container {
	position: relative;
	z-index: 1;
}

.aislf-two-column-page__hero--image h1,
.aislf-two-column-page__hero--image .aislf-two-column-page__intro {
	color: var(--aislf-color-white);
}

.aislf-two-column-page__hero h1 {
	/* 50% wrapped "AISL Harrow Talent Awards" onto two lines; 24ch holds it
	   on one and matches the other page templates. Size matches About. */
	max-width: 24ch;
	margin: var(--aislf-space-2) 0 0;
	font-size: var(--aislf-font-size-h1);
	font-weight: 400;
	line-height: 1;
}

.aislf-two-column-page__hero .aislf-breadcrumbs {
	max-width: none;
	margin: 0;
	padding: 0;
}

.aislf-two-column-page__hero--image .aislf-breadcrumbs,
.aislf-two-column-page__hero--image .aislf-breadcrumbs a {
	color: var(--aislf-color-white);
}

.aislf-two-column-page__intro {
	max-width: 64ch;
	margin-top: var(--aislf-space-3);
	font-size: clamp(1.1rem, 2vw, 1.35rem);
}

.aislf-two-column-page__intro > :last-child,
.aislf-two-column-page__rich-text > :last-child,
.aislf-two-column-page__secondary-intro > :last-child,
.aislf-two-column-page__sidebar > :last-child {
	margin-bottom: 0;
}

.aislf-two-column-page__primary {
	padding-block: clamp(4rem, 8vw, 7rem);
}

.aislf-two-column-page__primary-grid {
	display: grid;
	grid-template-columns: minmax(14rem, 3fr) minmax(0, 7fr);
	gap: clamp(2rem, 7vw, 7rem);
	align-items: start;
}

.aislf-two-column-page__primary-grid--no-sidebar {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-two-column-page__sidebar {
	padding-top: var(--aislf-space-2);
	border-top: 2px solid var(--aislf-color-gold);
}

.aislf-two-column-page__main-content {
	max-width: 78ch;
}

.aislf-two-column-page__highlight {
	margin: 0 0 var(--aislf-space-4);
	color: var(--aislf-color-gold);
	font-family: var(--aislf-font-heading);
	font-size: clamp(1.7rem, 3vw, 2.5rem);
	line-height: 1.25;
}

.aislf-two-column-page__rich-text {
	line-height: var(--aislf-line-height-body);
}

.aislf-two-column-page__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-2);
	margin-top: var(--aislf-space-4);
}

.aislf-two-column-page__secondary {
	padding-block: clamp(4rem, 8vw, 7rem);
	background: var(--aislf-color-cream);
}

.aislf-two-column-page__secondary h2 {
	max-width: 20ch;
	margin: 0;
	font-size: clamp(2rem, 4vw, 3.5rem);
}

.aislf-two-column-page__secondary-intro {
	max-width: 64ch;
	margin-top: var(--aislf-space-2);
	font-size: 1.1rem;
}

.aislf-two-column-page__secondary-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2rem, 6vw, 6rem);
	margin-top: var(--aislf-space-4);
	padding-top: var(--aislf-space-4);
	border-top: 1px solid rgba(22, 36, 62, .25);
}

.aislf-two-column-page__secondary-grid--single {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-two-column-page__secondary-column h3 {
	margin: 0 0 var(--aislf-space-2);
	font-size: clamp(1.4rem, 2vw, 1.8rem);
}

/* ---------- Publications page ---------- */

.aislf-publications__content {
	padding-block: clamp(3rem, 6vw, 6rem);
}

.aislf-publications__container {
	display: grid;
	grid-template-columns: minmax(12rem, 1fr) minmax(0, 3fr);
	gap: clamp(2.5rem, 7vw, 7rem);
	width: 100%;
	max-width: var(--aislf-max-width);
	margin-inline: auto;
	padding-inline: var(--aislf-container-padding);
	align-items: start;
}

.aislf-publications__container--no-sidebar {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-publications__sidebar {
	padding-top: var(--aislf-space-2);
	border-top: 2px solid var(--aislf-color-gold);
}

.aislf-publications__sidebar h2 {
	margin: 0 0 var(--aislf-space-2);
	font-size: 1rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.aislf-publications__sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.aislf-publications__sidebar li {
	border-bottom: 1px solid rgba(22, 36, 62, .2);
}

.aislf-publications__sidebar a {
	display: flex;
	justify-content: space-between;
	padding-block: .9rem;
	color: var(--aislf-color-navy);
	font-weight: 700;
	text-decoration: none;
}

.aislf-publications__sidebar a:hover,
.aislf-publications__sidebar a:focus {
	color: var(--aislf-color-gold-text);
}

.aislf-publications__intro {
	max-width: 68ch;
	margin-bottom: clamp(2rem, 5vw, 4rem);
	font-size: 1.1rem;
	line-height: var(--aislf-line-height-body);
}

.aislf-publications__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2rem, 4vw, 3.5rem) var(--aislf-space-3);
}

.aislf-publication-card__media {
	display: block;
	overflow: hidden;
	background: var(--aislf-color-cream);
	aspect-ratio: 4 / 3;
}

.aislf-publication-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .25s ease;
}

a.aislf-publication-card__media:hover img,
a.aislf-publication-card__media:focus img {
	transform: scale(1.025);
}

.aislf-publication-card__title {
	margin: var(--aislf-space-2) 0 0;
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	line-height: 1.25;
}

.aislf-publication-card__title a {
	color: var(--aislf-color-navy);
	text-decoration: none;
}

.aislf-publication-card__title a:hover,
.aislf-publication-card__title a:focus {
	color: var(--aislf-color-gold-text);
}

.aislf-publications__pagination {
	margin-top: clamp(3rem, 6vw, 5rem);
	padding-top: var(--aislf-space-3);
	border-top: 1px solid rgba(22, 36, 62, .2);
}

.aislf-publications__pagination .page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.aislf-publications__pagination a,
.aislf-publications__pagination span {
	display: inline-flex;
	min-width: 2.5rem;
	min-height: 2.5rem;
	align-items: center;
	justify-content: center;
	padding: .5rem .75rem;
	color: var(--aislf-color-navy);
	text-decoration: none;
}

.aislf-publications__pagination .current {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-publications__pagination a:hover,
.aislf-publications__pagination a:focus {
	background: var(--aislf-color-cream);
}

@media (max-width: 767px) {
	.aislf-two-column-page__hero {
		min-height: 20rem;
		padding-block: 2rem;
	}

	.aislf-two-column-page__primary-grid,
	.aislf-two-column-page__secondary-grid,
	.aislf-publications__container,
	.aislf-publications__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.aislf-two-column-page__buttons {
		align-items: stretch;
		flex-direction: column;
	}

	.aislf-publications__content {
		padding-block: var(--aislf-space-6);
	}
}

/* ---------- Standard page template ---------- */

.aislf-standard-page {
	background: var(--aislf-color-cream);
	color: var(--aislf-color-navy);
}

.aislf-standard-page__hero {
	position: relative;
	display: grid;
	height: 320px;
	min-height: 320px;
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	overflow: hidden;
}

.aislf-standard-page__hero-media,
.aislf-standard-page__hero-shade,
.aislf-standard-page__hero-copy {
	grid-area: 1 / 1;
}

.aislf-standard-page__hero-media {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aislf-standard-page__hero-shade {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(to top, rgb(1 3 24 / 78%) 0%, rgb(1 3 24 / 10%) 60%);
}

.aislf-standard-page__hero-copy {
	align-self: end;
	z-index: 2;
	width: 100%;
	max-width: var(--aislf-option-max-width);
	margin-inline: auto;
	padding: var(--aislf-space-3) var(--aislf-option-gutter) clamp(1.5rem, 3vw, 2.5rem);
}

.aislf-standard-page__hero .aislf-breadcrumbs {
	margin: 0;
	max-width: none;
	padding-inline: 0;
}

.aislf-standard-page__hero .aislf-breadcrumbs a,
.aislf-standard-page__hero .aislf-breadcrumbs li,
.aislf-standard-page__hero .aislf-breadcrumbs span {
	color: var(--aislf-color-white);
}

.aislf-standard-page__hero h1 {
	/* 14ch broke "AISL Community Service" across two lines; 24ch holds the
	   longest current page title on one and still stops a runaway headline. */
	max-width: 24ch;
	margin: var(--aislf-space-2) 0 0;
	color: var(--aislf-color-white);
	font-size: var(--aislf-font-size-h1);
	font-weight: 400;
}

.aislf-standard-page__section {
	padding-block: clamp(2.5rem, 5.75vw, 5.25rem);
}

.aislf-standard-page__grid {
	display: grid;
	/* Same proportion as the About page. The old fixed 520px first column did
	   not shrink, so between 700px and 1000px the copy column was squeezed to
	   165px — about 21 characters a line. */
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.45fr);
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
}

.aislf-standard-page__grid--single {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-standard-page__intro-title {
	max-width: 19ch;
	margin: 0;
	font-size: clamp(2rem, 3vw, 2.75rem);
	line-height: 1.12;
}

.aislf-standard-page__rich-text {
	line-height: var(--aislf-line-height-body);
}

.aislf-standard-page__rich-text > :first-child {
	font-family: var(--aislf-font-heading) !important;
    /* margin: 0 0 var(--aislf-space-4) 0;
    font-size: clamp(2rem, 3vw, 2.75rem);
    line-height: 1.12; */
	font-weight: 900;
}

.aislf-standard-page__rich-text > :last-child {
	margin-bottom: 0;
}

.aislf-standard-page__intro-content {
	max-width: 40rem;
}

.aislf-standard-page__intro-content > p {
	max-width: 62ch;
	margin: 0 0 1.15rem;
	font-size: var(--aislf-font-size-body);
	line-height: 1.62;
}

.aislf-standard-page__intro-content > p:first-child {
	max-width: 58ch;
	margin-bottom: var(--aislf-space-3);
	color: var(--aislf-color-gold-text);
	/* Same lead size as the About page; these pages are the same treatment. */
	font-size: var(--aislf-font-size-lead);
	line-height: 1.45;
}

/* A row of call-to-action buttons inside editor content. Wraps rather than
   overflowing, and keeps them apart — stacked in the flow they sat flush
   against each other with a 1px gap. */
.aislf-standard-page__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-2);
	margin-top: var(--aislf-space-3);
}

/* The two side-by-side blocks are reference material — dates you check, rules
   you scan — not prose. Giving them a card treatment separates them from the
   narrative above without inventing a new visual language: gold top rule,
   cream ground and a hairline, exactly as the pillar and audience cards
   already do. No shadow, no radius; this theme has neither anywhere. */
.aislf-standard-page__columns .aislf-standard-page__rich-text {
	border-top: 2px solid var(--aislf-color-gold);
	border-inline: 1px solid rgba(22, 36, 62, .14);
	border-bottom: 1px solid rgba(22, 36, 62, .14);
	background: var(--aislf-color-cream);
	padding: clamp(1.5rem, 2.4vw, 2.25rem);
}

.aislf-standard-page__columns .aislf-standard-page__rich-text > :first-child {
	margin-top: 0;
}

.aislf-standard-page__columns .aislf-standard-page__rich-text > :last-child {
	margin-bottom: 0;
}

/* Present editor-created bottom-content lists with the same two-column card
   rhythm as the Secondary Inner Page. */
/* The closing section renders a single block into the page's two-column
   grid, so it was sitting in the narrow first column with the wide one
   empty beside it. It has no second column to fill, so it takes the full
   measure. */
.aislf-standard-page__bottom .aislf-standard-page__grid {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-standard-page__bottom .aislf-standard-page__rich-text ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem);
	align-items: start;
	margin: 0;
	padding: 0;
	list-style: none;
}

.aislf-standard-page__bottom .aislf-standard-page__rich-text li {
	min-width: 0;
	padding-block: var(--aislf-space-2);
	border-top: 2px solid var(--aislf-color-gold);
	background: var(--aislf-color-cream);
}

.aislf-standard-page__bottom .aislf-standard-page__rich-text li a {
	display: block;
	padding-block: .7rem;
	color: var(--aislf-color-navy);
	text-decoration: none;
	transition: color 180ms ease;
	font-family: var(--aislf-font-heading);
	font-size: clamp(1.05rem, 1.4vw, 1.25rem);
	text-transform: uppercase;
}

@media (hover: hover) and (pointer: fine) {
	.aislf-standard-page__bottom .aislf-standard-page__rich-text li a:hover {
		color: var(--aislf-color-gold-text);
	}
}

/* Editor tables. Follows the delivery-doc table already in this theme:
   navy header, hairline rules, no shadow or radius. The wrapper scrolls
   rather than letting a wide table push the page sideways on a phone. */
.aislf-standard-page__custom-html {
	overflow-x: auto;
	margin-top: var(--aislf-space-4);
}

.aislf-standard-page__rich-text table {
	width: 100%;
	border-collapse: collapse;
}

.aislf-standard-page__rich-text th,
.aislf-standard-page__rich-text td {
	padding: var(--aislf-space-2);
	border-bottom: 1px solid rgba(22, 36, 62, .18);
	text-align: left;
	vertical-align: top;
	/* Short factual values — "16 to 17", year groups — should not break
	   mid-phrase just because their column is narrow. The column widens
	   instead, which it has room to do. */
	text-wrap: balance;
}

/* Only the short factual cells hold one line. Row headers like "Sixth Form /
   A Level Students" must wrap — holding those on one line was what pushed
   the table past its column and forced horizontal scrolling. */
.aislf-standard-page__rich-text td:not(:last-child) {
	white-space: nowrap;
}

/* The last column carries the long text and must stay wrappable. */
.aislf-standard-page__rich-text td:last-child,
.aislf-standard-page__rich-text th:last-child {
	white-space: normal;
	min-width: 18ch;
}

.aislf-standard-page__rich-text thead th {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	vertical-align: bottom;
}

.aislf-standard-page__rich-text tbody tr:nth-child(odd) {
	background: var(--aislf-color-cream);
}

.aislf-standard-page__rich-text table p {
	margin: 0;
	max-width: none;
}

/* A list running straight into the paragraph that follows it read as one
   block; the paragraph is a new thought and needs the gap. */
.aislf-standard-page__rich-text ul,
.aislf-standard-page__rich-text ol {
	margin-bottom: var(--aislf-space-3);
}

.aislf-standard-page__rich-text :is(ul, ol) + p {
	margin-top: var(--aislf-space-3);
}

.aislf-standard-page__columns {
	border-top: 1px solid rgb(22 36 62 / 24%);
	background: var(--aislf-color-white);
}

.aislf-standard-page__columns .aislf-standard-page__grid--single .aislf-standard-page__rich-text {
	max-width: 80ch;
}

.aislf-standard-page__bottom,
.aislf-secondary-inner-page__cards {
	border-top: 1px solid rgb(22 36 62 / 24%);
	/* background: var(--aislf-color-white); */
}

.aislf-standard-page__intro,
.aislf-standard-page__bottom {
	padding-block: clamp(2.125rem, 5vw, 4.5rem);
}

.aislf-standard-page__bottom-content {
	width: 100%;
	max-width: none;
}

/* ---------- Secondary inner page template ---------- */

/* Two up, not four. These cards carry admissions prose of very uneven
   length — one school's entry runs five times another's — so at four
   across each column was about 370px, the text set to a cramped measure
   and the height difference between neighbours became the loudest thing
   on the page. */
/* School entries as a disclosure list.
 *
 * Eleven cards of wildly uneven length cannot be made tidy by a grid: with
 * equal heights the short ones hold voids, with natural heights the rows
 * stagger. The content is reference material — people are looking for one
 * school, not reading eleven — so the list collapses to one scannable row
 * each and opens on demand. Native <details>, so it works without
 * JavaScript and is keyboard-operable as shipped. */
.aislf-school-entry {
	border-top: 1px solid rgba(22, 36, 62, .18);
}

/* Close both columns with the same rule. Using only :last-of-type added the
   final edge to the odd left-hand item but not to the item above it in the
   right column, which made the last row appear to have uneven padding. */
.aislf-school-entry:nth-last-child(-n + 2) {
	border-bottom: 1px solid rgba(22, 36, 62, .18);
}

.aislf-school-entry__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--aislf-space-3);
	min-height: 6rem;
	padding-block: var(--aislf-space-3);
	color: var(--aislf-color-navy);
	font-family: var(--aislf-font-heading);
	font-size: clamp(1.05rem, 1.4vw, 1.25rem);
	line-height: 1.3;
	cursor: pointer;
	list-style: none;
}

.aislf-school-entry__summary::-webkit-details-marker {
	display: none;
}

/* The theme has no icon set, so the marker is drawn from the same hairline
   language as the rules above it. */
.aislf-school-entry__summary::after {
	content: "";
	flex: 0 0 auto;
	inline-size: .6rem;
	block-size: .6rem;
	border-right: 1px solid var(--aislf-color-gold-text);
	border-bottom: 1px solid var(--aislf-color-gold-text);
	transform: rotate(45deg) translate(-.15rem, -.15rem);
	transition: transform 180ms cubic-bezier(.23, 1, .32, 1);
}

.aislf-school-entry[open] .aislf-school-entry__summary::after {
	transform: rotate(-135deg) translate(-.15rem, -.15rem);
}

@media (hover: hover) and (pointer: fine) {
	.aislf-school-entry__summary:hover {
		color: var(--aislf-color-gold-text);
	}
}

.aislf-school-entry__body {
	padding-block: 0 var(--aislf-space-3);
	max-width: 74ch;
}

@media (prefers-reduced-motion: reduce) {
	.aislf-school-entry__summary::after {
		transition: none;
	}
}

.aislf-secondary-inner-page__card-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: clamp(1.25rem, 2.5vw, 2rem);
	row-gap: 0;
	align-items: start;
}

.aislf-secondary-inner-page__card {
	min-width: 0;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	border-top: 2px solid var(--aislf-color-gold);
	background: var(--aislf-color-cream);
}

.aislf-secondary-inner-page__card h2 {
	margin: 0 0 var(--aislf-space-2);
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h3);
	font-weight: 400;
	line-height: 1.15;
}

@media (max-width: 1000px) {
	/* Tablet: two columns leave neither the heading nor the copy a workable
	   measure at this width, so the section stacks here rather than at 700. */
	.aislf-standard-page__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--aislf-space-4);
	}

	.aislf-standard-page__bottom .aislf-standard-page__rich-text ul {
		grid-template-columns: minmax(0, 1fr);
	}


	.aislf-secondary-inner-page__card-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.aislf-school-entry:nth-last-child(2) {
		border-bottom: 0;
	}

	.aislf-school-entry__summary {
		min-height: 5rem;
		padding-block: var(--aislf-space-2);
	}
}

@media (max-width: 700px) {
	.aislf-standard-page__hero,
	.aislf-about-hero {
		height: 16rem;
		min-height: 16rem;
	}

	.aislf-standard-page__hero-shade {
		background: linear-gradient(90deg, rgb(1 3 24 / 88%), rgb(2 7 42 / 62%) 72%, rgb(2 5 24 / 30%));
	}

	.aislf-standard-page__hero h1 {
		font-size: clamp(2.25rem, 10vw, 3.5rem);
	}

	.aislf-standard-page__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--aislf-space-4);
	}

	.aislf-secondary-inner-page__card-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- Detailed content page template ---------- */

.aislf-detailed-page {
	background: var(--aislf-color-cream);
	color: var(--aislf-color-navy);
}

.aislf-detailed-page__hero {
	display: grid;
	min-height: clamp(22rem, 46vw, 42rem);
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	overflow: hidden;
}

.aislf-detailed-page__hero-media,
.aislf-detailed-page__hero-shade,
.aislf-detailed-page__hero-copy {
	grid-area: 1 / 1;
}

.aislf-detailed-page__hero-media {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aislf-detailed-page__hero-shade {
	z-index: 1;
	background: linear-gradient(90deg, rgb(1 3 24 / 90%) 0%, rgb(2 7 42 / 72%) 38%, rgb(3 12 57 / 20%) 72%, rgb(2 5 24 / 6%) 100%);
}

.aislf-detailed-page__hero-copy {
	align-self: center;
	z-index: 2;
	width: 100%;
	max-width: var(--aislf-max-width);
	margin-inline: auto;
	padding: clamp(3rem, 6vw, 6rem) var(--aislf-container-padding);
}

.aislf-detailed-page__hero h1 {
	max-width: 14ch;
	margin: var(--aislf-space-3) 0 0;
	color: var(--aislf-color-white);
	font-size: clamp(3rem, 5vw, 4.5rem);
	font-weight: 400;
	line-height: .98;
}

.aislf-detailed-page__hero .aislf-breadcrumbs {
	max-width: none;
	margin: 0;
	padding: 0;
	color: var(--aislf-color-white);
}

.aislf-detailed-page__hero .aislf-breadcrumbs a {
	color: var(--aislf-color-white);
}

.aislf-detailed-page__section {
	padding-block: clamp(3rem, 7vw, 6.5rem);
}

.aislf-detailed-page__reading-width {
	max-width: 62rem;
}

.aislf-detailed-page h2 {
	max-width: 20ch;
	margin: 0 0 var(--aislf-space-3);
	font-size: clamp(2rem, 3vw, 2.75rem);
	line-height: 1.12;
}

.aislf-detailed-page__lead {
	max-width: 64ch;
	margin-bottom: var(--aislf-space-3);
	color: var(--aislf-color-gold-text);
	font-family: var(--aislf-font-heading);
	font-size: clamp(1.35rem, 2.5vw, 2rem);
	line-height: 1.3;
}

.aislf-detailed-page__lead > :first-child,
.aislf-detailed-page__rich-text > :first-child {
	margin-top: 0;
}

.aislf-detailed-page__lead > :last-child,
.aislf-detailed-page__rich-text > :last-child {
	margin-bottom: 0;
}

.aislf-detailed-page__rich-text {
	max-width: 72ch;
	line-height: var(--aislf-line-height-body);
}

.aislf-detailed-page__content {
	border-top: 1px solid rgb(22 36 62 / 24%);
	background: var(--aislf-color-white);
}

.aislf-detailed-page__content-grid,
.aislf-detailed-page__contact-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(17rem, .9fr);
	gap: clamp(2.5rem, 7vw, 7rem);
	align-items: start;
}

.aislf-detailed-page__content-grid--single {
	grid-template-columns: minmax(0, 1fr);
}

.aislf-detailed-page__content-grid--single > * {
	max-width: 72ch;
}

.aislf-detailed-page__media {
	width: 100%;
	overflow: hidden;
}

.aislf-detailed-page__media iframe,
.aislf-detailed-page__media video {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
}

.aislf-detailed-page__related {
	border-top: 1px solid rgb(22 36 62 / 24%);
}

.aislf-detailed-page__related-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: var(--aislf-space-4);
	text-align: center;
}

.aislf-detailed-page__related-header h2 {
	margin-inline: auto;
}

.aislf-detailed-page__related-shortcode {
	margin-bottom: var(--aislf-space-4);
}

.aislf-detailed-page__related-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--aislf-space-3);
}

.aislf-detailed-page__related-card {
	display: block;
	border-bottom: 1px solid rgb(22 36 62 / 25%);
	color: var(--aislf-color-navy);
	text-decoration: none;
}

.aislf-detailed-page__related-card figure {
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--aislf-color-white);
}

.aislf-detailed-page__related-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aislf-detailed-page__related-card h3 {
	margin: 0;
	padding: var(--aislf-space-2) 0 var(--aislf-space-3);
	font-size: var(--aislf-font-size-h3);
}

a.aislf-detailed-page__related-card:hover h3,
a.aislf-detailed-page__related-card:focus h3 {
	text-decoration: underline;
}

.aislf-detailed-page__feature-image {
	padding-bottom: clamp(3rem, 7vw, 6.5rem);
}

.aislf-detailed-page__feature-image img {
	width: 100%;
	height: auto;
}

.aislf-detailed-page__contact {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-detailed-page__contact h2,
.aislf-detailed-page__contact a {
	color: var(--aislf-color-white);
}

.aislf-detailed-page__form {
	min-width: 0;
}

@media (min-width: 640px) {
	.aislf-detailed-page__related-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 960px) {
	.aislf-detailed-page__related-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.aislf-detailed-page__hero {
		min-height: 26rem;
	}

	.aislf-detailed-page__hero-shade {
		background: linear-gradient(90deg, rgb(1 3 24 / 88%), rgb(2 7 42 / 62%) 72%, rgb(2 5 24 / 30%));
	}

	.aislf-detailed-page__hero h1 {
		font-size: clamp(2.75rem, 12vw, 4.25rem);
	}

	.aislf-detailed-page__content-grid,
	.aislf-detailed-page__contact-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--aislf-space-4);
	}
}

/* ---------- News / events feed ---------- */

.aislf-home-news {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: clamp(4rem, 8vw, 8rem) var(--aislf-container-padding);
}

.aislf-home-news__header {
	display: grid;
	grid-template-columns: minmax(12rem, 1fr) minmax(18rem, 2fr);
	align-items: end;
	gap: var(--aislf-space-3);
	padding-bottom: var(--aislf-space-3);
	border-bottom: 1px solid rgba(22, 36, 62, .25);
}

.aislf-home-news__header h2 {
	margin: 0;
	font-size: clamp(2rem, 3.25vw, 2.75rem);
	text-align: right;
}

.aislf-home-news__eyebrow,
.aislf-home-news__date,
.aislf-home-news__type {
	margin: 0 0 .35rem;
	color: var(--aislf-color-gold-text);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.aislf-home-news__eyebrow {
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-eyebrow);
}

.aislf-home-news__pinned {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--aislf-space-4);
	padding: var(--aislf-space-3) 0 var(--aislf-space-4);
}

.aislf-home-news__feature-media,
.aislf-home-news__row-media {
	margin: 0;
	background: #e5e3de;
	overflow: hidden;
}

.aislf-home-news__feature-media-link,
.aislf-home-news__row-media-link {
	display: block;
	text-decoration: none;
}

.aislf-home-news__feature-media {
	aspect-ratio: 3 / 2;
	margin-bottom: var(--aislf-space-2);
}

.aislf-home-news__feature-media img,
.aislf-home-news__row-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aislf-home-news__categories {
	margin: 0 0 .7rem;
	color: #526071;
	font-size: .8rem;
	line-height: 1.45;
}

.aislf-home-news__schools {
	margin: -.35rem 0 .7rem;
	color: #526071;
	font-size: .8rem;
	line-height: 1.45;
}

.aislf-home-news__schools strong {
	color: var(--aislf-color-navy);
}

.aislf-home-news h3 {
	margin: 0;
	font-size: clamp(1.3rem, 2vw, 1.75rem);
	line-height: 1.08;
}

.aislf-home-news h3 a,
.aislf-home-news__all {
	color: var(--aislf-color-navy);
}

.aislf-home-news h3 a {
	text-decoration: none;
}

.aislf-home-news h3 a:hover,
.aislf-home-news h3 a:focus {
	text-decoration: none;
}

.aislf-home-news__summary {
	margin: .75rem 0 0;
	font-size: .92rem;
	line-height: 1.6;
}

.aislf-home-news__list {
	border-top: 1px solid rgba(22, 36, 62, .25);
}

.aislf-home-news__row {
	display: grid;
	grid-template-columns: minmax(12rem, 21.5rem) 1fr;
	align-items: center;
	gap: var(--aislf-space-3);
	padding: var(--aislf-space-2) 0;
	border-bottom: 1px solid rgba(22, 36, 62, .25);
}

.aislf-home-news__row--no-image {
	grid-template-columns: 1fr;
}

.aislf-home-news__row-media {
	aspect-ratio: 16 / 9;
}

.aislf-home-news__all {
	display: inline-flex;
	align-items: center;
	min-height: 3rem;
	margin-top: var(--aislf-space-3);
	font-weight: 700;
}

@media (max-width: 700px) {
	.aislf-home-news__header,
	.aislf-home-news__pinned,
	.aislf-home-news__row {
		grid-template-columns: 1fr;
	}

	.aislf-home-news__header h2 {
		text-align: left;
	}
}

.aislf-news-feed {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-news-feed__header {
	margin-bottom: var(--aislf-space-4);
}

.aislf-news-feed__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h2);
	margin: 0 0 var(--aislf-space-1);
}

.aislf-news-feed__group-heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h3);
	margin: var(--aislf-space-6) 0 var(--aislf-space-3);
}

.aislf-news-feature {
	background: var(--aislf-color-cream);
	border-radius: var(--aislf-radius);
	display: grid;
	gap: var(--aislf-space-4);
	grid-template-columns: 1fr;
	overflow: hidden;
}

@media (min-width: 768px) {
	.aislf-news-feature {
		grid-template-columns: 1fr 1fr;
	}
}

.aislf-news-feature__media img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.aislf-news-feature__body {
	padding: var(--aislf-space-4);
}

.aislf-news-feature__type {
	color: var(--aislf-color-gold);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-1);
	text-transform: uppercase;
}

.aislf-news-feature__title {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h3);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-card-grid {
	display: grid;
	gap: var(--aislf-space-4);
	grid-template-columns: 1fr;
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 960px) {
	.aislf-card-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.aislf-news-card,
.aislf-event-card {
	border: 1px solid var(--aislf-color-cream);
	border-radius: var(--aislf-radius);
	padding: var(--aislf-space-3);
}

.aislf-news-card__category {
	color: var(--aislf-color-gold);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-1);
	text-transform: uppercase;
}

.aislf-news-card__title,
.aislf-event-card__title {
	font-family: var(--aislf-font-heading);
	font-size: 1.125rem;
	margin: 0 0 var(--aislf-space-2);
}

.aislf-event-card__date {
	color: var(--aislf-color-navy-light);
	font-weight: bold;
	margin: 0 0 var(--aislf-space-2);
}

.aislf-news-card__link,
.aislf-event-card__link,
.aislf-news-feature__link {
	color: var(--aislf-color-navy);
	font-weight: bold;
	text-decoration: none;
}

.aislf-news-card__link:hover,
.aislf-news-card__link:focus,
.aislf-event-card__link:hover,
.aislf-event-card__link:focus,
.aislf-news-feature__link:hover,
.aislf-news-feature__link:focus {
	text-decoration: underline;
}

/* ---------- CTA band ---------- */

.aislf-cta-band {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

.aislf-cta-band__inner {
	margin-inline: auto;
	max-width: 60ch;
	text-align: center;
}

.aislf-cta-band__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h2);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-cta-band__body {
	margin: 0 0 var(--aislf-space-4);
}

/* ---------- Internal delivery references ---------- */

.aislf-doc {
	background: var(--aislf-color-white);
}

.aislf-doc__container {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding-inline: var(--aislf-container-padding);
}

.aislf-doc__hero {
	background: linear-gradient(135deg, var(--aislf-color-navy) 0%, var(--aislf-color-navy-mid) 100%);
	color: var(--aislf-color-white);
	padding-block: clamp(3.5rem, 8vw, 6.5rem);
}

.aislf-doc__hero h1,
.aislf-doc h2,
.aislf-doc h3 {
	font-family: var(--aislf-font-heading);
	line-height: var(--aislf-line-height-heading);
}

.aislf-doc__hero h1 {
	font-size: var(--aislf-font-size-h1);
	margin: 0;
	max-width: 16ch;
}

.aislf-doc__lede {
	font-size: 1.125rem;
	margin: var(--aislf-space-3) 0 0;
	max-width: 54ch;
}

.aislf-doc__eyebrow,
.aislf-doc__card-kicker,
.aislf-doc__timeline-label {
	color: var(--aislf-color-gold-text);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: 0.09em;
	margin: 0 0 var(--aislf-space-1);
	text-transform: uppercase;
}

.aislf-doc__hero .aislf-doc__eyebrow,
.aislf-doc__section--navy .aislf-doc__eyebrow {
	color: var(--aislf-color-gold);
}

.aislf-doc__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-1);
	margin-top: var(--aislf-space-4);
}

.aislf-doc__meta span,
.aislf-doc__status {
	align-items: center;
	border-radius: 999px;
	display: inline-flex;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.2;
	padding: 0.45rem 0.75rem;
}

.aislf-doc__meta span {
	background: rgb(255 255 255 / 14%);
	border: 1px solid rgb(255 255 255 / 30%);
}

.aislf-doc__tabs {
	background: var(--aislf-color-white);
	border-bottom: 1px solid rgb(10 37 64 / 15%);
}

.aislf-doc__tabs .aislf-doc__container,
.aislf-doc__contents .aislf-doc__container {
	display: flex;
	gap: var(--aislf-space-1);
	overflow-x: auto;
}

.aislf-doc__tabs a {
	color: var(--aislf-color-navy);
	display: inline-flex;
	font-weight: 700;
	min-height: 44px;
	padding: 0.8rem var(--aislf-space-2);
	text-decoration: none;
	white-space: nowrap;
}

.aislf-doc__tabs a:hover,
.aislf-doc__tabs a:focus,
.aislf-doc__tabs a[aria-current="page"] {
	background: var(--aislf-color-cream);
	text-decoration: underline;
	text-decoration-color: var(--aislf-color-gold-text);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}

.aislf-doc__contents {
	background: var(--aislf-color-cream);
	border-bottom: 1px solid rgb(10 37 64 / 10%);
	font-size: 0.9375rem;
}

.aislf-doc__contents span,
.aislf-doc__contents a {
	align-items: center;
	color: var(--aislf-color-navy);
	display: inline-flex;
	font-weight: 700;
	min-height: 44px;
	text-decoration: none;
	white-space: nowrap;
}

.aislf-doc__contents a:hover,
.aislf-doc__contents a:focus {
	text-decoration: underline;
}

.aislf-doc__section {
	padding-block: clamp(3rem, 6vw, 5.5rem);
	scroll-margin-top: var(--aislf-header-height);
}

.aislf-doc__section--cream {
	background: var(--aislf-color-cream);
}

.aislf-doc__section--navy {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-doc__section-heading {
	max-width: 68ch;
}

.aislf-doc h2 {
	font-size: var(--aislf-font-size-h2);
	margin: 0 0 var(--aislf-space-3);
}

.aislf-doc h3 {
	font-size: var(--aislf-font-size-h3);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-doc__section-heading > p:last-child {
	margin-bottom: 0;
}

.aislf-doc__flow {
	counter-reset: flow;
	display: grid;
	gap: var(--aislf-space-2);
	grid-template-columns: 1fr;
	list-style: none;
	margin: var(--aislf-space-4) 0 0;
	padding: 0;
}

.aislf-doc__flow li {
	background: var(--aislf-color-white);
	border-left: 4px solid var(--aislf-color-gold);
	box-shadow: 0 1px 0 rgb(10 37 64 / 12%);
	color: var(--aislf-color-ink);
	display: grid;
	gap: 0.2rem;
	min-height: 7rem;
	padding: var(--aislf-space-3);
	position: relative;
}

.aislf-doc__flow li::before {
	color: var(--aislf-color-gold-text);
	content: counter(flow, decimal-leading-zero);
	counter-increment: flow;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.08em;
}

.aislf-doc__flow li strong {
	color: var(--aislf-color-navy);
	font-family: var(--aislf-font-heading);
	font-size: 1.2rem;
}

.aislf-doc__flow li span {
	font-size: 0.9375rem;
}

.aislf-doc__card-grid,
.aislf-doc__metrics,
.aislf-doc__details {
	display: grid;
	gap: var(--aislf-space-2);
	grid-template-columns: 1fr;
}

.aislf-doc__card {
	border: 1px solid rgb(10 37 64 / 15%);
	border-top: 4px solid var(--aislf-color-gold);
	padding: var(--aislf-space-3);
}

.aislf-doc__card p:not(.aislf-doc__card-kicker) {
	margin-bottom: var(--aislf-space-3);
}

.aislf-doc code,
.aislf-doc__card code {
	background: var(--aislf-color-cream);
	border-radius: var(--aislf-radius);
	color: var(--aislf-color-navy);
	display: inline-block;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.8125rem;
	padding: 0.2rem 0.4rem;
	overflow-wrap: anywhere;
}

.aislf-doc__two-column {
	display: grid;
	gap: var(--aislf-space-4);
	grid-template-columns: 1fr;
}

.aislf-doc__list,
.aislf-doc__number-list,
.aislf-doc__timeline-item ul,
.aislf-doc__details ul {
	padding-left: 1.25em;
}

.aislf-doc__list li + li,
.aislf-doc__timeline-item li + li,
.aislf-doc__details li + li {
	margin-top: var(--aislf-space-1);
}

.aislf-doc__callout {
	align-self: start;
	background: var(--aislf-color-navy);
	border-top: 4px solid var(--aislf-color-gold);
	color: var(--aislf-color-white);
	padding: var(--aislf-space-4);
}

.aislf-doc__callout--light {
	background: var(--aislf-color-white);
	color: var(--aislf-color-ink);
}

.aislf-doc__callout .aislf-doc__card-kicker {
	color: var(--aislf-color-gold);
}

.aislf-doc__table-wrap {
	overflow-x: auto;
}

.aislf-doc__table {
	border-collapse: collapse;
	min-width: 40rem;
	width: 100%;
}

.aislf-doc__table th,
.aislf-doc__table td {
	border-bottom: 1px solid rgb(10 37 64 / 15%);
	padding: var(--aislf-space-2);
	text-align: left;
	vertical-align: top;
}

.aislf-doc__table thead th {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-doc__status {
	border: 1px solid currentColor;
	white-space: nowrap;
}

.aislf-doc__status--done {
	background: var(--aislf-color-status-done-bg);
	color: var(--aislf-color-status-done);
}

.aislf-doc__status--now {
	background: var(--aislf-color-status-now-bg);
	color: var(--aislf-color-status-now);
}

.aislf-doc__status--pending {
	background: var(--aislf-color-status-pending-bg);
	color: var(--aislf-color-status-pending);
}

.aislf-doc__status--risk {
	background: var(--aislf-color-status-risk-bg);
	color: var(--aislf-color-status-risk);
}

.aislf-doc__metrics {
	margin-bottom: var(--aislf-space-6);
}

.aislf-doc__metrics > div {
	border-left: 3px solid var(--aislf-color-gold);
	padding: var(--aislf-space-2) var(--aislf-space-3);
}

.aislf-doc__metrics strong {
	color: var(--aislf-color-navy);
	display: block;
	font-family: var(--aislf-font-heading);
	font-size: 2.5rem;
	line-height: 1;
}

.aislf-doc__metrics span {
	display: block;
	font-size: 0.9375rem;
	margin-top: var(--aislf-space-1);
}

.aislf-doc__timeline {
	list-style: none;
	margin: 0;
	padding: 0;
}

.aislf-doc__timeline-item {
	border-left: 2px solid rgb(10 37 64 / 25%);
	display: grid;
	gap: var(--aislf-space-3);
	grid-template-columns: 1fr;
	margin-left: 0.65rem;
	padding: 0 0 var(--aislf-space-6) var(--aislf-space-4);
	position: relative;
}

.aislf-doc__timeline-item::before {
	background: var(--aislf-color-white);
	border: 4px solid var(--aislf-color-navy-light);
	border-radius: 50%;
	content: "";
	height: 1rem;
	left: -0.6rem;
	position: absolute;
	top: 0.15rem;
	width: 1rem;
}

.aislf-doc__timeline-item--done::before {
	border-color: var(--aislf-color-status-done);
}

.aislf-doc__timeline-item--now::before {
	border-color: var(--aislf-color-gold-text);
}

.aislf-doc__timeline-item h2 {
	font-size: clamp(1.35rem, 2vw, 1.85rem);
}

.aislf-doc__timeline-item > .aislf-doc__status {
	align-self: start;
	justify-self: start;
}

.aislf-doc__section--navy .aislf-doc__status--pending {
	background: transparent;
	color: var(--aislf-color-white);
}

.aislf-doc__log-entry {
	border-top: 1px solid rgb(10 37 64 / 18%);
	display: grid;
	gap: var(--aislf-space-3);
	grid-template-columns: 1fr;
	padding-block: var(--aislf-space-4);
}

.aislf-doc__log-date {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-2);
}

.aislf-doc__log-date time,
.aislf-doc__log-symbol {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	display: inline-block;
	font-family: var(--aislf-font-heading);
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 0.9;
	min-width: 4rem;
	padding: 0.65rem;
	text-align: center;
}

.aislf-doc__log-date time span {
	font-family: var(--aislf-font-body);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.aislf-doc__log-symbol {
	align-items: center;
	background: var(--aislf-color-gold-text);
	display: inline-flex;
	justify-content: center;
}

.aislf-doc__log-entry--gate {
	background: var(--aislf-color-cream);
	border: 0;
	margin-top: var(--aislf-space-3);
	padding: var(--aislf-space-4);
}

.aislf-doc__details {
	border-top: 1px solid rgb(10 37 64 / 14%);
	margin-top: var(--aislf-space-3);
	padding-top: var(--aislf-space-3);
}

.aislf-doc__details h3 {
	font-family: var(--aislf-font-body);
	font-size: 1rem;
	font-weight: 700;
}

@media (min-width: 640px) {
	.aislf-doc__flow,
	.aislf-doc__card-grid,
	.aislf-doc__metrics,
	.aislf-doc__details {
		grid-template-columns: repeat(2, 1fr);
	}

	.aislf-doc__flow li:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}

@media (min-width: 900px) {
	.aislf-doc__flow {
		grid-template-columns: repeat(5, 1fr);
	}

	.aislf-doc__flow li:last-child:nth-child(odd) {
		grid-column: auto;
	}

	.aislf-doc__card-grid {
		grid-template-columns: repeat(4, 1fr);
	}

	.aislf-doc__metrics {
		grid-template-columns: repeat(4, 1fr);
	}

	.aislf-doc__two-column {
		grid-template-columns: minmax(0, 1.5fr) minmax(18rem, 0.8fr);
	}

	.aislf-doc__timeline-item,
	.aislf-doc__log-entry {
		grid-template-columns: 8rem minmax(0, 1fr) auto;
	}

	.aislf-doc__log-entry {
		grid-template-columns: 8rem minmax(0, 1fr);
	}
}

@media print {
	.aislf-doc__tabs,
	.aislf-doc__contents,
	.aislf-header,
	.aislf-footer {
		display: none;
	}

	.aislf-doc__hero,
	.aislf-doc__section--navy {
		background: var(--aislf-color-white);
		color: var(--aislf-color-ink);
	}
}

/* ---------- Footer ---------- */

.aislf-footer {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-footer__inner {
	display: grid;
	gap: var(--aislf-space-4);
	grid-template-columns: 1fr;
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: var(--aislf-space-8) var(--aislf-container-padding);
}

@media (min-width: 640px) {
	.aislf-footer__inner {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.aislf-footer__inner {
		grid-template-columns: 1.4fr repeat(5, minmax(0, 1fr));
	}
}

.aislf-footer__logo {
	height: 2.5rem;
	margin-bottom: var(--aislf-space-2);
	width: auto;
}

.aislf-footer__address {
	font-style: normal;
	opacity: 0.85;
}

.aislf-footer__column-title {
	color: var(--aislf-color-gold);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-2);
	text-transform: uppercase;
}

.aislf-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.aislf-footer__list li {
	margin-bottom: var(--aislf-space-1);
}

.aislf-footer a {
	color: var(--aislf-color-white);
	text-decoration: none;
}

.aislf-footer a:hover,
.aislf-footer a:focus {
	color: var(--aislf-color-white);
	text-decoration: underline;
}

.aislf-footer__list--locations {
	column-gap: var(--aislf-space-3);
	columns: 2;
}

.aislf-footer__values {
	border-top: 1px solid var(--aislf-color-navy-light);
}

.aislf-footer__values-strip {
	color: var(--aislf-color-gold);
	font-family: var(--aislf-font-heading);
	letter-spacing: 0.05em;
	margin: 0 auto;
	max-width: var(--aislf-max-width);
	padding: var(--aislf-space-3) var(--aislf-container-padding);
	text-align: center;
}

.aislf-footer__values-strip span {
	margin-inline: var(--aislf-space-2);
}

.aislf-footer__copyright {
	border-top: 1px solid var(--aislf-color-navy-light);
	font-size: .75rem;
	margin: 0;
	opacity: .7;
	padding: var(--aislf-space-2) var(--aislf-container-padding);
	text-align: center;
}

/* ---------- Fallback page template ---------- */

.aislf-main {
	width: 100%;
}

.aislf-article {
	margin-inline: auto;
	max-width: var(--aislf-option-max-width);
	padding: var(--aislf-space-6) var(--aislf-option-gutter);
}

.aislf-article__content {
	max-width: none;
}

.aislf-breadcrumbs {
	margin: var(--aislf-space-3) auto 0;
	max-width: var(--aislf-max-width);
	padding-inline: var(--aislf-container-padding);
}

.aislf-breadcrumbs__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.aislf-breadcrumbs__list li + li::before {
	content: "/";
	margin-right: 0.25rem;
}

.aislf-breadcrumbs a {
	color: var(--aislf-color-navy);
}

.aislf-article__title {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h1);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-article__eyebrow {
	color: var(--aislf-color-gold);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-1);
	text-transform: uppercase;
}

.aislf-article__meta {
	color: var(--aislf-color-navy-light);
	margin: 0 0 var(--aislf-space-4);
}

.aislf-article__meta--event {
	font-weight: bold;
}

.aislf-article__media {
	margin-bottom: var(--aislf-space-4);
}

.aislf-article__media img,
.aislf-article__media video {
	border-radius: var(--aislf-radius);
	width: 100%;
}

.aislf-article__content :is(h2, h3, h4) {
	font-family: var(--aislf-font-heading);
	line-height: var(--aislf-line-height-heading);
}

.aislf-article__content p {
	margin: 0 0 var(--aislf-space-3);
}

/* ---------- Contact page template ---------- */

.aislf-contact-page {
	background: var(--aislf-color-cream);
	color: var(--aislf-color-navy);
}

.aislf-contact-page__container {
	width: 100%;
	max-width: var(--aislf-option-max-width);
	margin-inline: auto;
	padding-inline: var(--aislf-option-gutter);
}

.aislf-contact-page__hero {
	display: flex;
	min-height: 320px;
	align-items: center;
	padding-block: var(--aislf-space-4);
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

.aislf-contact-page__eyebrow {
	margin: 0 0 var(--aislf-space-2);
	color: var(--aislf-color-gold);
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.aislf-contact-page h1 {
	max-width: 14ch;
	margin: 0;
	font-size: var(--aislf-font-size-h1);
	font-weight: 400;
	line-height: var(--aislf-line-height-heading);
}

.aislf-contact-page__content {
	padding-block: clamp(4rem, 9vw, 8rem);
	background: var(--aislf-color-white);
}

.aislf-contact-page__layout {
	display: grid;
	grid-template-columns: minmax(15rem, .75fr) minmax(0, 1.4fr);
	gap: clamp(3rem, 8vw, 8rem);
	align-items: start;
}

.aislf-contact-page__details {
	padding-top: .4rem;
}

.aislf-contact-page__details > h2 {
	margin: 0 0 var(--aislf-space-4);
	font-size: clamp(1.75rem, 3vw, 2.5rem);
	font-weight: 400;
}

.aislf-contact-page h3 {
	margin: 0 0 var(--aislf-space-2);
	font-size: var(--aislf-font-size-h3);
}

.aislf-contact-page address,
.aislf-contact-page__links p {
	margin: 0;
	font-size: 1.1rem;
	line-height: var(--aislf-line-height-body);
}

.aislf-contact-page__links p + p {
	margin-top: var(--aislf-space-2);
}

.aislf-contact-page__links {
	margin-top: var(--aislf-space-6);
}

.aislf-contact-page__links p span:first-child {
	font-weight: 700;
}

.aislf-contact-page a {
	color: var(--aislf-color-navy);
	font-weight: 700;
}

.aislf-contact-page a:hover,
.aislf-contact-page a:focus {
	color: var(--aislf-color-gold-text);
}

.aislf-contact-page__enquiry {
	min-width: 0;
	padding: clamp(1.5rem, 3vw, 2.5rem);
	border: 1px solid var(--aislf-color-gold);
}

.aislf-contact-page__form-intro {
	margin-bottom: var(--aislf-space-4);
}

.aislf-contact-page__form-intro h2 {
	max-width: 20ch;
	margin: 0;
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: var(--aislf-line-height-heading);
}

.aislf-contact-page__form {
	max-width: none;
}

.aislf-contact-page__form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--aislf-space-3);
}

.aislf-contact-page__form p {
	margin: 0 0 var(--aislf-space-3);
}

.aislf-contact-page__form label {
	display: block;
	margin-bottom: .4rem;
	font-weight: 700;
}

.aislf-contact-page__form input:not([type="hidden"]),
.aislf-contact-page__form textarea {
	display: block;
	width: 100%;
	border: 1px solid rgba(21, 34, 66, .35);
	border-radius: var(--aislf-radius);
	padding: .75rem;
	background: var(--aislf-color-white);
	color: var(--aislf-color-ink);
	font: inherit;
}

.aislf-contact-page__form textarea {
	min-height: 10rem;
	resize: vertical;
}

.aislf-contact-page__form input:focus,
.aislf-contact-page__form textarea:focus {
	border-color: rgba(21, 34, 66, .35);
	box-shadow: none;
	outline: none;
}

.aislf-contact-page__notice {
	max-width: 52rem;
	margin: 0 0 var(--aislf-space-4);
	padding: var(--aislf-space-2);
	border-left: 3px solid var(--aislf-color-navy);
	background: var(--aislf-color-cream);
}

.aislf-contact-page__notice p {
	margin: 0 0 var(--aislf-space-1);
	font-weight: 700;
}

.aislf-contact-page__notice ul {
	margin: 0;
	padding-left: 1.25rem;
}

.aislf-contact-page__notice--success {
	border-left-color: var(--aislf-color-status-done);
}

.aislf-contact-page__notice--error {
	border-left-color: var(--aislf-color-status-risk);
}

.aislf-contact-page__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 850px) {
	.aislf-contact-page__layout {
		grid-template-columns: 1fr;
		gap: var(--aislf-space-6);
	}

	.aislf-contact-page address,
	.aislf-contact-page__links p {
		font-size: var(--aislf-font-size-body);
	}

	.aislf-contact-page__form-grid {
		grid-template-columns: 1fr;
	}
}

.aislf-article__cta {
	margin-top: var(--aislf-space-4);
}

/* ---------- Archive header / pagination ---------- */

.aislf-archive-header {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: var(--aislf-space-6) var(--aislf-container-padding) 0;
}

.aislf-archive-header__title {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h1);
	margin: 0 0 var(--aislf-space-2);
}

.aislf-archive-header__description {
	color: var(--aislf-color-navy-light);
	max-width: 60ch;
}

.aislf-archive-grid {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: var(--aislf-space-4) var(--aislf-container-padding) var(--aislf-space-6);
}

.aislf-news-card__media,
.aislf-event-card__media {
	margin: calc(var(--aislf-space-3) * -1) calc(var(--aislf-space-3) * -1) var(--aislf-space-3);
	overflow: hidden;
}

.aislf-news-card__media img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.aislf-pagination {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: 0 var(--aislf-container-padding) var(--aislf-space-8);
}

.aislf-pagination .page-numbers {
	color: var(--aislf-color-navy);
	display: inline-block;
	margin-right: var(--aislf-space-2);
	text-decoration: none;
}

.aislf-pagination .page-numbers.current {
	font-weight: bold;
	text-decoration: underline;
}

.aislf-pagination .page-numbers:hover,
.aislf-pagination .page-numbers:focus {
	text-decoration: underline;
}

/* ---------- Related stories ---------- */

.aislf-related {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: 0 var(--aislf-container-padding) var(--aislf-space-8);
}

.aislf-related__heading {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h2);
	margin: 0 0 var(--aislf-space-4);
}

/* ---------- Share buttons ---------- */

.aislf-share {
	border-top: 1px solid var(--aislf-color-cream);
	margin-top: var(--aislf-space-6);
	padding-top: var(--aislf-space-3);
}

.aislf-share__label {
	color: var(--aislf-color-navy-light);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: bold;
	letter-spacing: 0.08em;
	margin: 0 0 var(--aislf-space-2);
	text-transform: uppercase;
}

.aislf-share__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.aislf-share__list a {
	border: 1px solid var(--aislf-color-navy);
	border-radius: var(--aislf-radius);
	color: var(--aislf-color-navy);
	display: inline-block;
	padding: var(--aislf-space-1) var(--aislf-space-2);
	text-decoration: none;
}

.aislf-share__list a:hover,
.aislf-share__list a:focus {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

/* ---------- Breadcrumb ---------- */

.aislf-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--aislf-space-1);
	list-style: none;
	margin: 0 0 var(--aislf-space-2);
	padding: 0;
}

.aislf-breadcrumb__list li:not(:last-child)::after {
	content: "/";
	margin-left: var(--aislf-space-1);
}

.aislf-breadcrumb__list a {
	color: inherit;
	font-size: var(--aislf-font-size-eyebrow);
	letter-spacing: 0.05em;
	text-decoration: underline;
	text-transform: uppercase;
}

/* ---------- Programme (single-aislf_programme.php) ---------- */

/* --aislf-programme-accent is set inline per-post from the accent_color ACF
   field (navy/gold/cream) — the one place a dynamic per-post value can't
   come from a static token, see single-aislf_programme.php. */

.aislf-programme__hero {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
	min-height: 60vh;
	position: relative;
}

.aislf-programme__hero-media {
	height: 100%;
	inset: 0;
	object-fit: cover;
	position: absolute;
	width: 100%;
}

.aislf-programme__hero-overlay {
	background: linear-gradient(to top, rgb(10 37 64 / 70%), rgb(10 37 64 / 10%));
	border-bottom: 4px solid var(--aislf-programme-accent, var(--aislf-color-gold));
	bottom: 0;
	left: 0;
	padding: var(--aislf-space-6) var(--aislf-container-padding);
	position: absolute;
	right: 0;
}

.aislf-programme__hero-title {
	font-family: var(--aislf-font-heading);
	font-size: var(--aislf-font-size-h1);
	line-height: var(--aislf-line-height-heading);
	margin: 0;
	max-width: 40ch;
}

.aislf-programme__content {
	margin-inline: auto;
	max-width: 70ch;
	padding: var(--aislf-space-6) var(--aislf-container-padding);
}

.aislf-programme__content :is(h2, h3, h4) {
	color: var(--aislf-programme-accent, var(--aislf-color-navy));
	font-family: var(--aislf-font-heading);
	line-height: var(--aislf-line-height-heading);
}

.aislf-programme__content p {
	margin: 0 0 var(--aislf-space-3);
}

.aislf-programme__children {
	margin-inline: auto;
	max-width: var(--aislf-max-width);
	padding: 0 var(--aislf-container-padding) var(--aislf-space-8);
}
/* -------------------------------------------------------------------------
   Client-review homepage directions. Scoped to /design-options/ only.
   ------------------------------------------------------------------------- */
.aislf-option {
	background: #f7f4ef;
	color: var(--aislf-color-navy);
}

.aislf-option h1,
.aislf-option h2,
.aislf-option h3 {
	font-family: var(--aislf-font-heading);
	line-height: var(--aislf-line-height-heading);
	color: inherit;
}

.aislf-option a { color: inherit; }

.aislf-option-chooser {
	padding: clamp(3rem, 8vw, 8rem) var(--aislf-container-padding);
	min-height: 70vh;
}

.aislf-option-chooser__inner,
.aislf-option-intro,
.aislf-option-programmes,
.aislf-option-news {
	max-width: var(--aislf-max-width);
	margin: 0 auto;
}

.aislf-option-chooser h1 {
	max-width: 12ch;
	font-size: clamp(3rem, 7vw, 6.5rem);
	margin: 0 0 var(--aislf-space-3);
}

.aislf-option-chooser__inner > p:not(.aislf-option__source-note) {
	max-width: 56ch;
	font-size: 1.2rem;
	line-height: 1.6;
}

.aislf-option__eyebrow {
	margin: 0 0 var(--aislf-space-2);
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: .12em;
	color: #a39161;
	text-transform: uppercase;
}

.aislf-option-chooser__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--aislf-space-2);
	margin: var(--aislf-space-6) 0 var(--aislf-space-3);
}

.aislf-option-chooser__card {
	display: flex;
	flex-direction: column;
	min-height: 16rem;
	padding: var(--aislf-space-4);
	border: 1px solid rgba(10, 37, 64, .2);
	background: var(--aislf-color-white);
	color: var(--aislf-color-navy);
	text-decoration: none;
}

.aislf-option-chooser__card:hover { background: var(--aislf-color-navy); color: var(--aislf-color-white); }
.aislf-option-chooser__card:hover span,
.aislf-option-chooser__card:hover p { color: var(--aislf-color-white); }
.aislf-option-chooser__card span { color: var(--aislf-color-gold-text); font-weight: 700; letter-spacing: .1em; }
.aislf-option-chooser__card h2 { margin: auto 0 var(--aislf-space-2); font-size: 2rem; }
.aislf-option-chooser__card p { margin: 0 0 var(--aislf-space-3); line-height: 1.55; }
.aislf-option-chooser__card strong { font-family: var(--aislf-font-body); }

.aislf-option-switcher {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--aislf-space-2);
	padding: .75rem max(var(--aislf-container-padding), calc((100vw - var(--aislf-max-width)) / 2));
	border-bottom: 1px solid rgba(10, 37, 64, .18);
	background: #f7f4ef;
	font-size: .875rem;
}
.aislf-option-switcher div { display: flex; gap: .25rem; }
.aislf-option-switcher a { display: inline-flex; min-height: 2.75rem; align-items: center; padding: 0 .8rem; color: var(--aislf-color-navy); font-weight: 700; }
.aislf-option-switcher a[aria-current="page"] { background: var(--aislf-color-navy); color: #fff; text-decoration: none; }
.aislf-option-switcher p { margin: 0; color: #475569; }

.aislf-option-hero { position: relative; min-height: min(48rem, 78vh); }
/* Review imagery is documentary material: retain the supplied frame rather
   than using a fashionable crop. Letterboxing is intentional. */
.aislf-option-hero img { display: block; width: 100%; height: auto; min-height: 0; object-fit: contain; background: #0b1526; }
.aislf-option .aislf-option-hero img,
.aislf-option .aislf-option-programme__media img,
.aislf-option .aislf-option-news-card img {
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	object-fit: contain !important;
}
.aislf-option-hero__copy { position: relative; z-index: 1; }
.aislf-option-hero--split { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); min-height: 0; background: var(--aislf-color-navy); }
.aislf-option-hero--split .aislf-option-hero__copy { align-self: center; max-width: 44rem; padding: clamp(3rem, 7vw, 7rem); color: var(--aislf-color-white); }
.aislf-option-hero--split .aislf-option__eyebrow { color: #f5d3a3; }
.aislf-option-hero h1 { max-width: 10ch; margin: 0 0 var(--aislf-space-3); font-size: clamp(3.5rem, 7vw, 7.5rem); }
.aislf-option-hero__copy > p:not(.aislf-option__eyebrow) { max-width: 54ch; font-size: 1.1rem; line-height: 1.7; }
/* Image and copy are stacked in the same CSS Grid cell rather than the
   copy being absolutely bottom-anchored over the image. An absolute,
   bottom-anchored box grows UPWARD as copy gets longer with no ceiling —
   confirmed live with the client's four-paragraph hero text: three of the
   four paragraphs and the button overflowed above the navy section into
   the cream section above it, where white text is invisible. It wasn't a
   clipping bug, the content was rendering, just off the visible dark
   background. Grid stacking keeps the same visual overlay but sizes the
   row (and the section) to whichever is tallest, image or copy, so this
   can't recur as copy length changes. object-fit:contain is intentionally
   untouched (see the !important rule below) — the image keeps its
   documentary, uncropped letterboxing; the grid row just grows to fit it. */
.aislf-option-hero--editorial { background: var(--aislf-color-navy); position: relative; display: grid; min-height: min(48rem, 78vh); }
.aislf-option-hero--editorial img,
.aislf-option-hero--editorial::after,
.aislf-option-hero--editorial .aislf-option-hero__copy { grid-area: 1 / 1; }
.aislf-option-hero--editorial img { align-self: stretch; }
.aislf-option-hero--editorial::after { content: ""; z-index: 1; background: linear-gradient(90deg, rgba(10,37,64,.9) 0%, rgba(10,37,64,.42) 55%, rgba(10,37,64,.08) 100%); }
.aislf-option-hero--editorial .aislf-option-hero__copy { position: relative; z-index: 2; align-self: end; max-width: 47rem; margin-left: max(var(--aislf-container-padding), calc((100vw - var(--aislf-max-width)) / 2)); padding: clamp(3rem, 7vw, 7rem) 0; color: var(--aislf-color-white); }
.aislf-option-hero--editorial .aislf-option__eyebrow { color: #f5d3a3; }

/* Buttons.
 *
 * Deliberately not the rounded, shadowed, Material-ish reference: this theme
 * has near-zero radius and no shadow anywhere, and importing that language
 * for one control would make the button the only object on the page playing
 * by different rules. The hierarchy comes from fill against outline, the
 * affordance from a real arrow on anything that actually goes somewhere,
 * and the feedback from the press state — not from decoration.
 *
 * This is the site's only button. There were four: this one, plus
 * `cta-band__button`, `two-column-page__button` and `detailed-page__button`,
 * the last two carrying nothing but a hover that reached for Elementor's
 * `--e-global-color-secondary` and left the resting state to whatever
 * Elementor happened to set. Every template now emits this class, so a
 * button cannot be restyled on one page without being restyled everywhere. */
.aislf-option__button,
.aislf-contact-page__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	min-height: 2.75rem;
	padding: .7rem 1.35rem;
	border: 1px solid var(--aislf-color-gold) !important;
	border-radius: var(--aislf-radius);
	background: var(--aislf-color-white);
	color: var(--aislf-color-gold) !important;
	font-family: var(--aislf-font-body);
	font-size: .9375rem;
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1.25;
	text-decoration: none;
	cursor: pointer;
	/* A call to action that wraps mid-phrase reads as broken. */
	text-wrap: balance;
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		color 180ms ease,
		transform 120ms cubic-bezier(.23, 1, .32, 1);
}

/* An arrow only where the control actually leads somewhere. */
.aislf-option__button[href]::after {
	content: "\2192";
	font-weight: 400;
	transition: transform 180ms cubic-bezier(.23, 1, .32, 1);
}

@media (hover: hover) and (pointer: fine) {
	.aislf-option__button[href]:hover::after {
		transform: translateX(2px);
	}
}

/* Buttons must feel pressed. */
.aislf-option__button:active,
.aislf-contact-page__submit:active {
	transform: translateY(1px);
}

/* Secondary: same language one level down, for when two actions sit
   together and only one of them is the point. */
.aislf-option__button--ghost {
	background: transparent;
	color: var(--aislf-color-navy);
}

.aislf-option__button[aria-disabled="true"] {
	opacity: .5;
	cursor: default;
}

.aislf-option__button[aria-disabled="true"]:active {
	transform: none;
}
/* Was `background: transparent; color: white`, which only works over a dark
   hero. On the About page's cream ground it turned the button invisible on
   hover — white text on near-white, with only the gold hairline left. Navy
   fill reads on either ground, and matches the rail arrows. */
.aislf-option__button:hover,
.aislf-option__button:focus-visible,
.aislf-contact-page__submit:hover,
.aislf-contact-page__submit:focus-visible { background: var(--aislf-color-navy) !important; border-color: var(--aislf-color-navy) !important; color: var(--aislf-color-white) !important; }
.aislf-option__button--light { background: var(--aislf-color-white); border-color: var(--aislf-color-white); }
.aislf-option__button--light:hover { color: var(--aislf-color-white); }

.aislf-option-intro { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(2rem, 8vw, 9rem); padding: clamp(4rem, 10vw, 9rem) var(--aislf-container-padding); }
.aislf-option-intro h2 { max-width: 18ch; margin: 0; font-size: clamp(2.2rem, 4vw, 4.2rem); }
.aislf-option-intro > p { max-width: 39ch; margin: 0; font-size: 1.1rem; line-height: 1.75; }

.aislf-option-programmes { padding: clamp(3rem, 7vw, 7rem) var(--aislf-container-padding); border-top: 1px solid rgba(22, 36, 62, .24); }
.aislf-option-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: var(--aislf-space-3); margin-bottom: var(--aislf-space-4); }
.aislf-option-section-heading h2 { margin: 0; font-size: clamp(2.3rem, 4vw, 4.5rem); }
.aislf-option-programmes__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(22, 36, 62, .35); border-left: 1px solid rgba(22, 36, 62, .35); }
.aislf-option-programme { position: relative; display: flex; flex-direction: column; min-height: 0; padding: var(--aislf-space-3); border-right: 1px solid rgba(22, 36, 62, .35); border-bottom: 1px solid rgba(22, 36, 62, .35); background: #f7f4ef; color: var(--aislf-color-navy); text-decoration: none; }
.aislf-option-programme::after { display: none; }
.aislf-option-programme[data-aislf-parallax] { translate: 0 var(--aislf-parallax-y, 0); will-change: translate; }
.aislf-option-programme__media { margin: 0 0 var(--aislf-space-3); }
.aislf-option-programme__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #dfe3e8;
}
.aislf-option .aislf-option-programme__media img {
	display: block;
	width: 100%;
	height: 100% !important;
	min-height: 100% !important;
	max-height: none !important;
	object-fit: cover !important;
}
.aislf-option-programme:hover { background: #efeae0; color: var(--aislf-color-navy); }
.aislf-option-programme__number { color: var(--aislf-color-gold-text); font-weight: 700; letter-spacing: .1em; }
.aislf-option-programme:hover .aislf-option-programme__number, .aislf-option-programme:hover .aislf-option-programme__motto { color: var(--aislf-color-gold-text); }
.aislf-option-programme h3 { margin: 0 0 .25rem; font-size: 2rem; }
.aislf-option-programme p { margin: .25rem 0; line-height: 1.55; }
.aislf-option-programme__motto { color: var(--aislf-color-gold-text); font-family: var(--aislf-font-heading); font-size: 1.2rem; }
.aislf-option-programme__link { margin-top: var(--aislf-space-2); font-weight: 700; }

.aislf-option-news { padding: clamp(4rem, 9vw, 9rem) var(--aislf-container-padding); }
.aislf-option-news__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--aislf-space-3); }
.aislf-option-news-card { border-top: 1px solid var(--aislf-color-navy); }
.aislf-option-news-card img { display: block; width: 100%; height: auto; object-fit: contain; margin-bottom: var(--aislf-space-2); }
.aislf-option-news-card__date,
.aislf-option-news-card__type { margin: 0 0 .25rem; color: var(--aislf-color-gold-text); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.aislf-option-news-card__entities { margin: 0 0 .75rem; color: #526071; font-size: .78rem; line-height: 1.45; }
.aislf-option-news-card h3 { margin: 0; font-size: 1.55rem; }
.aislf-option-news-card__summary { margin: .75rem 0 0; font-size: .92rem; line-height: 1.6; }
.aislf-option-news-card a, .aislf-option__text-link { color: var(--aislf-color-navy); }
/* The whole card opens the story, but only the title is a link in the
 * accessibility tree: the overlay stretches that one anchor over the card
 * rather than wrapping the image and text in a second, duplicate link. */
.aislf-option-news-card--linked { position: relative; }
.aislf-option-news-card--linked .aislf-option-news-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
}
.aislf-option-news-card--linked:hover .aislf-option-news-card__link { color: var(--aislf-color-gold-text); }
.aislf-option-news-card--linked:has(.aislf-option-news-card__link:focus-visible) {
	outline: 2px solid var(--aislf-color-navy);
	outline-offset: 3px;
}
.aislf-option__text-link { display: inline-flex; min-height: 3rem; align-items: center; margin-top: var(--aislf-space-4); font-weight: 700; }
.aislf-option-audiences { padding: clamp(4rem, 9vw, 9rem) var(--aislf-container-padding); background: var(--aislf-color-navy); color: #fff; }
.aislf-option-audiences .aislf-option__eyebrow { color: var(--aislf-color-gold); }
.aislf-option-audiences__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.28); border-left: 1px solid rgba(255,255,255,.28); }
.aislf-option-audiences__grid article { display: flex; flex-direction: column; min-height: 17rem; padding: var(--aislf-space-3); border-right: 1px solid rgba(255,255,255,.28); border-bottom: 1px solid rgba(255,255,255,.28); }
.aislf-option-audiences__grid h3 { margin: 0 0 var(--aislf-space-2); font-size: 1.8rem; }
.aislf-option-audiences__grid p { line-height: 1.6; }
.aislf-option-audiences__grid a { display: inline-flex; min-height: 44px; align-items: end; margin-top: auto; color: var(--aislf-color-gold); font-weight: 700; }
.aislf-option-cta { padding: clamp(4rem, 10vw, 9rem) var(--aislf-container-padding); background: #0b1526; color: #fff; text-align: center; }
.aislf-option-cta .aislf-option__eyebrow { color: #f5d3a3; }
.aislf-option-cta h2 { margin: 0 auto var(--aislf-space-3); font-size: clamp(2.5rem, 5vw, 5.5rem); }
.aislf-option__source-note { max-width: 70ch; margin: var(--aislf-space-3) 0 0; color: #526071; font-size: .875rem; line-height: 1.5; }
.aislf-option__source-note--bottom { max-width: var(--aislf-max-width); margin: 0 auto; padding: var(--aislf-space-3) var(--aislf-container-padding); }

/* The four directions share information, not composition. */
.aislf-option--1b .aislf-option-programmes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--aislf-space-3); border: 0; }
.aislf-option--1b .aislf-option-programme { min-height: 0; border: 0; background: #f7f4ef; }
.aislf-option--1b .aislf-option-programme:nth-child(odd) { background: #efeae0; color: var(--aislf-color-navy); }
.aislf-option--1b .aislf-option-programme:nth-child(even) { transform: translateY(4rem); }
.aislf-option--1b .aislf-option-programme:nth-child(odd) .aislf-option-programme__number, .aislf-option--1b .aislf-option-programme:nth-child(odd) .aislf-option-programme__motto { color: var(--aislf-color-gold-text); }
.aislf-option--1a .aislf-option-programme { min-height: 22rem; }
.aislf-option--1a .aislf-option-audiences__grid article { min-height: 22rem; }
.aislf-option--2a .aislf-option-hero--editorial { min-height: 46rem; }
.aislf-option--2a .aislf-option-hero--editorial .aislf-option-hero__copy { border-left: 2px solid var(--aislf-color-gold); padding-left: var(--aislf-space-3); }
.aislf-option--2a .aislf-option-programmes__grid { display: block; border-left: 0; }
.aislf-option--2a .aislf-option-programme { display: grid; grid-template-columns: minmax(12rem, .65fr) minmax(14rem, 1fr) minmax(18rem, 1.4fr); column-gap: var(--aislf-space-3); align-items: center; min-height: 14rem; padding: var(--aislf-space-2) 0; border-right: 0; background: transparent; color: var(--aislf-color-navy); }
.aislf-option--2a .aislf-option-programme::after { display: none; }
.aislf-option--2a .aislf-option-programme__media { position: relative; inset: auto; height: auto; margin: 0; }
.aislf-option--2a .aislf-option-programme__media img { height: auto; }
.aislf-option--2a .aislf-option-programme__number, .aislf-option--2a .aislf-option-programme__motto { color: var(--aislf-color-gold-text); }
.aislf-option--2a .aislf-option-programme h3 { margin: 0; font-size: 1.75rem; }
.aislf-option--2a .aislf-option-programme__link { color: var(--aislf-color-navy); }
.aislf-option--2a .aislf-option-news { border-top: 1px solid rgba(22,36,62,.25); }
.aislf-option--2a .aislf-option-news__grid { grid-template-columns: 1fr; gap: 0; border-top: 1px solid rgba(22,36,62,.28); }
/* Image column widened 30% (16.5rem -> 21.5rem) per client review. The
   images stay object-fit: contain, so nothing is cropped. */
.aislf-option--2a .aislf-option-news-card { display: grid; grid-template-columns: 21.5rem 1fr; gap: var(--aislf-space-3); align-items: center; padding: var(--aislf-space-2) 0; border-top: 0; border-bottom: 1px solid rgba(22,36,62,.28); }
.aislf-option--2a .aislf-option-news-card img { height: auto; margin: 0; }
.aislf-option--2b .aislf-option-hero--editorial { min-height: 62rem; }
.aislf-option--2b .aislf-option-hero--editorial { display: flex; flex-direction: column; background: #0b1526; }
.aislf-option--2b .aislf-option-hero--editorial::after { display: none; }
.aislf-option--2b .aislf-option-hero--editorial img { order: 2; min-height: 34rem; max-height: 48rem; }
.aislf-option--2b .aislf-option-hero--editorial .aislf-option-hero__copy { position: static; order: 1; max-width: var(--aislf-max-width); margin: 0 auto; padding: clamp(4rem, 8vw, 8rem) var(--aislf-container-padding); }
.aislf-option--2b .aislf-option-hero--editorial .aislf-option-hero__copy h1 { max-width: 15ch; font-size: clamp(3.5rem, 6vw, 6.5rem); }
.aislf-option--2b .aislf-option-intro { grid-template-columns: 1fr; max-width: 50rem; margin-left: max(var(--aislf-container-padding), calc((100vw - var(--aislf-max-width)) / 2)); }
.aislf-option--2b .aislf-option-programmes__grid { grid-template-columns: 1fr; border-left: 0; }
.aislf-option--2b .aislf-option-programme { display: grid; grid-template-columns: 7rem 1fr 1fr; align-items: center; min-height: 0; border-right: 0; }
.aislf-option--2b .aislf-option-programme__number { grid-column: 1; grid-row: 1; }
.aislf-option--2b .aislf-option-programme h3 { grid-column: 2; grid-row: 1; margin: 0; }
.aislf-option--2b .aislf-option-programme__motto { grid-column: 2; grid-row: 2; margin: .3rem 0 0; }
.aislf-option--2b .aislf-option-programme > p:not(.aislf-option-programme__motto) { grid-column: 2; grid-row: 3; }
.aislf-option--2b .aislf-option-programme__link { display: none; }
.aislf-option--2b .aislf-option-programme__media { position: relative; inset: auto; grid-column: 3; grid-row: 1 / span 3; height: auto; margin: 0; }
.aislf-option--2b .aislf-option-programme__media img { height: auto; }
.aislf-option--2b .aislf-option-news__grid { grid-template-columns: 1fr; gap: 0; }
.aislf-option--2b .aislf-option-news-card { display: grid; grid-template-columns: 15rem 1fr; gap: var(--aislf-space-3); align-items: center; padding: var(--aislf-space-2) 0; }
.aislf-option--2b .aislf-option-news-card img { height: auto; margin: 0; }

@media (prefers-reduced-motion: reduce) {
	.aislf-option-programme__media img { transform: none; }
}

@media (max-width: 700px) {
	.aislf-option-chooser__grid, .aislf-option-news__grid, .aislf-option-programmes__grid, .aislf-option--1b .aislf-option-programmes__grid, .aislf-option-audiences__grid { grid-template-columns: 1fr; }
	.aislf-option-switcher { align-items: flex-start; flex-direction: column; }
	.aislf-option-switcher p { padding: 0 .8rem; }
	.aislf-option-hero--split { grid-template-columns: 1fr; }
	.aislf-option-hero--split img { min-height: 22rem; }
	.aislf-option-hero--editorial { min-height: 38rem; }
	.aislf-option-hero--editorial .aislf-option-hero__copy { right: var(--aislf-container-padding); left: var(--aislf-container-padding); }
	.aislf-option-intro { grid-template-columns: 1fr; gap: var(--aislf-space-3); }
	.aislf-option-section-heading { display: block; }
	.aislf-option-section-heading .aislf-option__eyebrow { margin-bottom: var(--aislf-space-1); }
	.aislf-option--2b .aislf-option-hero--editorial { min-height: 43rem; }
	.aislf-option--2b .aislf-option-intro { margin: 0; }
	.aislf-option--2b .aislf-option-programme { display: flex; min-height: 20rem; }
	.aislf-option--2b .aislf-option-programme__link { display: block; }
	.aislf-option--1b .aislf-option-programme:nth-child(even) { transform: none; }
	.aislf-option--2a .aislf-option-programme { display: flex; min-height: 24rem; padding: var(--aislf-space-2); }
	.aislf-option--2a .aislf-option-programme__media, .aislf-option--2b .aislf-option-programme__media { position: relative; inset: auto; height: auto; }
	.aislf-option--2a .aislf-option-programme, .aislf-option--2b .aislf-option-programme { background: #f7f4ef; color: var(--aislf-color-navy); }
	.aislf-option--2a .aislf-option-programme__number, .aislf-option--2a .aislf-option-programme__motto, .aislf-option--2a .aislf-option-programme__link { color: var(--aislf-color-gold-text); }
	.aislf-option--2a .aislf-option-news-card, .aislf-option--2b .aislf-option-news-card { grid-template-columns: 1fr; }
	.aislf-option--2a .aislf-option-news-card img, .aislf-option--2b .aislf-option-news-card img { height: auto; }
}

/* ---------- Homepage option review layouts: Design.pdf is the geometry reference ---------- */

/* The switcher and header are siblings of `.aislf-option`, so the review
 * grid must be available from body as well as the main content element. */
body,
.aislf-option {
	--aislf-option-max-width: 90rem; /* 1440px at the default root size */
	/* Kept as an alias so the existing call sites read unchanged; the value
	   itself now lives once, in tokens.css. */
	--aislf-option-gutter: var(--aislf-gutter);
	--aislf-option-content-inset: max(var(--aislf-option-gutter), calc((100vw - var(--aislf-option-max-width)) / 2 + var(--aislf-option-gutter)));
	background: #f7f4ef;
	color: var(--aislf-color-navy);
}

/* This lives above the individual site header so a reviewer can compare the
   option's actual navigation treatment rather than a shared chrome. */
.aislf-option-switcher {
	min-height: 2.75rem;
	padding: .25rem var(--aislf-option-content-inset);
	background: #efeae0;
	border-bottom: 1px solid rgba(22, 36, 62, .2);
	font-size: .75rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.aislf-option-switcher div { gap: 0; }
.aislf-option-switcher a { min-height: 2.25rem; padding: 0 .7rem; }
.aislf-option-switcher { position: sticky; top: 0; z-index: 30; }

.aislf-header--option {
	background: var(--aislf-color-navy);
	color: #fff;
}

.aislf-header--option .aislf-header__inner {
	max-width: var(--aislf-option-max-width);
	/* No padding-block here: this is a flex row with align-items:center, so
	   min-height alone sets the bar's height and the (now 20%-larger) logo
	   still centers within it — adding padding on top of min-height would
	   make the bar taller than before instead of shorter. */
	min-height: 3.25rem;
	padding-inline: var(--aislf-option-gutter);
}

.aislf-header--option .aislf-wordmark,
.aislf-header--option .aislf-header__nav-list a { color: #fff; }
.aislf-header--option .aislf-header__nav { background: var(--aislf-color-navy); border-color: rgba(255,255,255,.22); }
.aislf-header--option .aislf-header__nav-list {
	max-width: var(--aislf-option-max-width);
	padding-block: 0;
	padding-inline: var(--aislf-option-gutter);
	gap: clamp(.9rem, 1.8vw, 1.75rem);
}
.aislf-header--option .aislf-header__nav-list a {
	align-items: center;
	display: inline-flex;
	min-height: 2.75rem;
	padding-block: 0;
	font-family: var(--aislf-font-body);
	font-size: .875rem;
	line-height: 1.25;
}
.aislf-header--option .aislf-header__divider { display: none; }
.aislf-header--option .aislf-header__trigger,
.aislf-header--option .aislf-header .aislf-header__trigger { border-color: #fff !important; color: #fff !important; }

/* The hero banner stays full viewport width; only the reading-width sections
   below it are capped. Its copy uses the same 1440px grid inset. */
.aislf-option > .aislf-option-intro,
.aislf-option > .aislf-option-programmes,
.aislf-option > .aislf-option-news,
.aislf-option > .aislf-option-audiences {
	max-width: var(--aislf-option-max-width);
	margin-inline: auto;
}

.aislf-option-hero { min-height: 0; }
.aislf-option-hero h1 { max-width: 11ch; font-size: clamp(3rem, 5vw, 4.5rem); line-height: .98; }
.aislf-option-hero__copy > p:not(.aislf-option__eyebrow) { max-width: 40ch; font-size: var(--aislf-font-size-body); line-height: var(--aislf-line-height-body); }
.aislf-option-hero--editorial .aislf-option-hero__copy { margin-left: var(--aislf-option-content-inset); max-width: 42rem; padding: clamp(2rem, 5vw, 4rem) 0; }
.aislf-option-hero--split .aislf-option-hero__copy { max-width: 29.5rem; padding: clamp(2.5rem, 5vw, 4.5rem); }

/* 1B's documentary image remains whole. Centre it against the text panel so
   its natural landscape ratio reads as intentional editorial whitespace,
   rather than a top-aligned image with an accidental empty block below. */
.aislf-option--1b .aislf-option-hero--split { align-items: center; }
.aislf-option--1b .aislf-option-hero--split img { align-self: center; }
.aislf-option--1b .aislf-option-hero--split .aislf-option-hero__copy { padding-block: clamp(2.75rem, 4vw, 4rem); padding-left: var(--aislf-option-content-inset); }
.aislf-option--1b .aislf-option-hero--split h1 { font-size: clamp(3.25rem, 4.5vw, 4rem); }
.aislf-option--1b .aislf-option-hero--split .aislf-option-hero__copy > p:not(.aislf-option__eyebrow) { max-width: 36ch; }

.aislf-option-intro {
	grid-template-columns: minmax(0, 1.5fr) minmax(17rem, 1fr);
	gap: clamp(2.5rem, 7vw, 7rem);
	padding: clamp(3rem, 7vw, 6.5rem) var(--aislf-option-gutter);
}
.aislf-option-intro h2 { max-width: 19ch; font-size: clamp(2rem, 3vw, 2.75rem); line-height: 1.12; }
.aislf-option-intro__copy { max-width: 40rem; }
.aislf-option-intro__copy p { max-width: 62ch; margin: 0 0 1.15rem; font-size: var(--aislf-font-size-body); line-height: 1.62; }

.aislf-option-programmes,
.aislf-option-news,
.aislf-option-audiences { padding-inline: var(--aislf-option-gutter); }
.aislf-option-programmes { padding-block: clamp(3rem, 6vw, 6rem); }
.aislf-option-news,
.aislf-option-audiences { padding-block: clamp(3rem, 6vw, 6rem); }
.aislf-option-section-heading h2 { font-size: clamp(2rem, 3.25vw, 2.75rem); }
.aislf-option-programme h3 { font-family: var(--aislf-font-heading); font-size: 1.7rem; }
.aislf-option-programme p { font-size: .9rem; line-height: 1.6; }

/* The revised editorial direction has two photographic features, followed by
   four factual, ruled rows. Every asset remains present at natural ratio. */
.aislf-option--2a .aislf-option-hero--editorial { min-height: 0; }
.aislf-option--2a .aislf-option-programmes__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 2.5rem);
	border: 0;
}
.aislf-option--2a .aislf-option-programme { border-bottom: 1px solid rgba(22,36,62,.25); }
.aislf-option--2a .aislf-option-programme:nth-child(-n+2) {
	display: block;
	padding: 0 0 1.5rem;
	border: 0;
	background: transparent;
}
.aislf-option--2a .aislf-option-programme:nth-child(-n+2) .aislf-option-programme__media { margin: 0 0 1.25rem; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 2.5rem minmax(10rem, .85fr) minmax(15rem, 1.5fr) auto;
	gap: 1.5rem;
	min-height: 0;
	padding: 1.5rem 0;
}
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__media { display: none; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__number { grid-column: 1; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) h3 { grid-column: 2; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__motto { grid-column: 4; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) > p:not(.aislf-option-programme__motto) { grid-column: 3; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__link { grid-column: 4; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__motto { margin: 0; }
.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__link { margin: 0; white-space: nowrap; }

.aislf-option--2b .aislf-option-hero--editorial { min-height: 0; }
.aislf-option--2b .aislf-option-hero--editorial img { min-height: 0; max-height: none; }
.aislf-option--2b .aislf-option-hero--editorial .aislf-option-hero__copy { max-width: var(--aislf-option-max-width); padding: clamp(3rem, 6vw, 5.5rem) var(--aislf-option-gutter); }
.aislf-option--2b .aislf-option-intro { max-width: 42rem; margin-inline: max(var(--aislf-option-gutter), calc((100vw - var(--aislf-option-max-width)) / 2)); }

/* Programme imagery is the lead evidence in the two image-led directions.
   Give it a deliberate majority column rather than leaving it as a thumbnail
   beside an over-wide copy column. */
.aislf-option--2a .aislf-option-programme:nth-child(-n+2) {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: minmax(0, 1.22fr) minmax(18rem, .78fr);
	gap: clamp(1.5rem, 4vw, 4rem);
	align-items: center;
	padding-bottom: clamp(2rem, 4vw, 3.5rem);
}
.aislf-option--2a .aislf-option-programme:nth-child(-n+2) .aislf-option-programme__media { margin: 0; }
.aislf-option--2b .aislf-option-programme {
	grid-template-columns: 5.5rem minmax(17rem, .78fr) minmax(25rem, 1.22fr);
	column-gap: clamp(1.25rem, 3vw, 3rem);
}

@media (max-width: 700px) {
	.aislf-option--2a .aislf-option-programme:nth-child(-n+2) { display: flex; gap: 0; padding-bottom: 1.5rem; }
	.aislf-option--2a .aislf-option-programme:nth-child(-n+2) .aislf-option-programme__media { margin: 0 0 1.25rem; }
	.aislf-option--2b .aislf-option-programme { grid-template-columns: 1fr; }
}

/* 2B is a printed-report masthead followed by the whole documentary cover;
   the cover intentionally follows the source aspect ratio rather than being
   forced into the portrait crop shown in the presentation mock-up. */
.aislf-option-hero--report { background: #0b1526; color: #fff; }
.aislf-option-hero--report__masthead {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(16rem, .55fr);
	gap: clamp(2rem, 7vw, 7rem);
	align-items: center;
	padding: clamp(2.25rem, 3.5vw, 3.5rem) var(--aislf-option-content-inset) clamp(1.75rem, 2.75vw, 2.75rem);
}
.aislf-option-hero--report .aislf-option__eyebrow { color: var(--aislf-color-gold); }
.aislf-option-hero--report h1 { max-width: none; margin: 0; font-size: clamp(2.6rem, 3.8vw, 3.5rem); letter-spacing: -.025em; line-height: .96; text-transform: uppercase; }
.aislf-option-hero--report__copy { max-width: 34ch; }
.aislf-option-hero--report__copy p { margin: 0 0 .85rem; font-size: .9rem; line-height: 1.6; }
.aislf-option-hero--report__copy .aislf-option__text-link { min-height: 2.5rem; margin: .25rem 0 0; color: #fff; }
.aislf-option-hero--report__photo { margin: 0; }
.aislf-option-hero--report__photo img { display: block; width: 100%; height: auto; object-fit: contain; }

@media (max-width: 700px) {
	.aislf-option-switcher { overflow-x: auto; white-space: nowrap; }
	.aislf-header--option .aislf-header__inner,
	.aislf-header--option .aislf-header__nav-list { padding-inline: var(--aislf-option-gutter); }
	.aislf-option-hero--editorial { min-height: 0; }
	.aislf-option-hero--editorial .aislf-option-hero__copy { margin-inline: var(--aislf-option-gutter); max-width: none; }
	.aislf-option-intro { grid-template-columns: 1fr; gap: 2rem; }
	.aislf-option--2a .aislf-option-programmes__grid { grid-template-columns: 1fr; }
	.aislf-option--2a .aislf-option-programme:nth-child(n+3) { display: flex; gap: 0; padding: 1.5rem 0; }
	.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__media { display: none; }
	.aislf-option--2b .aislf-option-hero--editorial { min-height: 0; }
	.aislf-option--2b .aislf-option-intro { margin-inline: auto; }
	.aislf-option-hero--report__masthead { grid-template-columns: 1fr; gap: 1.5rem; padding-block: 3rem 2.5rem; }
}

/* ---------- Nurturing Talents for Good: current AISL homepage reference ---------- */
/* The four review directions deliberately diverge below this point. Their shared
   opening statement follows the live AISL composition: one continuous image
   surface, a dark reading shade, and compact type that never competes with the
   pupils in the photograph. */
.aislf-option-hero--live {
	display: grid;
	min-height: clamp(43rem, 63vw, 60rem);
	background: #050a24;
	color: var(--aislf-color-white);
	overflow: hidden;
}
.aislf-option-hero--live > img,
.aislf-option-hero--live > .aislf-option-hero__shade,
.aislf-option-hero--live > .aislf-option-hero__copy { grid-area: 1 / 1; }
.aislf-option .aislf-option-hero--live > img {
	display: block;
	width: 100%;
	height: 100% !important;
	min-height: 100% !important;
	max-height: none !important;
	object-fit: cover !important;
	object-position: 63% center;
	background: #050a24;
}
.aislf-option-hero--live > .aislf-option-hero__shade {
	z-index: 1;
	background: linear-gradient(90deg, rgba(1, 3, 24, .9) 0%, rgba(2, 7, 42, .78) 35%, rgba(3, 12, 57, .24) 65%, rgba(2, 5, 24, .04) 100%);
}
.aislf-option-hero--live .aislf-option-hero__copy {
	z-index: 2;
	align-self: center;
	width: min(58rem, calc(100% - (var(--aislf-option-content-inset) * 2)));
	margin-left: var(--aislf-option-content-inset);
	padding-block: clamp(3rem, 5vw, 5.5rem);
	/* 2A's hero rule: a single gold hairline down the copy, per the client's
	 * chosen reference. Border-box keeps the block's width unchanged. */
	border-left: 1px solid rgba(171, 152, 104, 1);
	padding-left: clamp(1.75rem, 3vw, 2.75rem);
	color: var(--aislf-color-white);
}
.aislf-option-hero--live h1 {
	max-width: 14ch;
	margin: 0 clamp(1.5rem, 4vw, 4rem) clamp(2.25rem, 4vw, 4rem) 0;
	font-size: clamp(3.1rem, 5.4vw, 6.5rem);
	font-weight: 400;
	line-height: .9;
	letter-spacing: .005em;
	text-transform: uppercase;
}
.aislf-option-hero--live h1 span,
.aislf-option-hero--live h1 strong { display: block; }
/* "FOR GOOD" reads as the same voice as the line above it, emphasised —
   not as a second typeface arguing with the first.
 *
 * It used to switch to the body sans at weight 800. A grotesque sans and a
 * serif share no skeleton, so the two lines of one sentence read as two
 * unrelated brands; and the heading serif has no 800, so the browser was
 * synthesising a fake bold on top of that. Contrast now comes from colour,
 * real weight and letter-spacing inside one family, which is where contrast
 * belongs. Size lifts .74 to .78em because a serif at the same nominal size
 * reads smaller than the sans it replaces. */
.aislf-option-hero--live h1 strong {
	color: var(--aislf-color-gold);
	font-size: .78em;
	font-weight: 700;
	letter-spacing: .02em;
}
.aislf-option-hero--live .aislf-option-hero__intro-copy {
	max-width: 59ch;
	margin: 0 0 clamp(2rem, 3vw, 3rem);
	font-family: var(--aislf-font-heading);
	font-size: clamp(.98rem, 1.35vw, 1.28rem) !important;
	font-weight: 400;
	line-height: 1.4;
}
.aislf-option-hero--live .aislf-option-hero__intro-copy p {
	margin: 0;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
}
.aislf-option-hero--live .aislf-option-hero__intro-copy strong { font-weight: 700; }
.aislf-option-hero--live .aislf-option-hero__body-copy {
	max-width: 67ch;
	margin-bottom: clamp(1.5rem, 2.75vw, 2.5rem);
}
.aislf-option-hero--live .aislf-option-hero__body-copy p {
	margin: 0 0 .75rem;
	font-size: clamp(.79rem, 1vw, .97rem);
	font-weight: 700;
	line-height: 1.5;
}
.aislf-option-hero--live .aislf-option__button {
	min-height: 2.75rem;
	padding: .6rem 1.15rem;
	border-color: var(--aislf-color-gold);
	background: transparent;
	color: var(--aislf-color-white) !important;
	font-size: .9rem;
}
.aislf-option-hero--live .aislf-option__button:hover,
.aislf-option-hero--live .aislf-option__button:focus-visible {
	border-color: var(--aislf-color-gold);
	background: var(--aislf-color-gold);
	color: var(--aislf-color-navy);
}
/* Each option keeps a recognisable opening rhythm without changing the
   approved content or breaking the full-bleed image relationship. */
.aislf-option--1a .aislf-option-hero--live .aislf-option-hero__copy { align-self: end; }
.aislf-option--1b .aislf-option-hero--live .aislf-option-hero__copy { max-width: 52rem; }
.aislf-option--2a .aislf-option-hero--live .aislf-option-hero__copy { border-left: 2px solid rgba(171, 152, 104, 1); padding-left: clamp(1.25rem, 2.4vw, 2.5rem); }
.aislf-option--2b .aislf-option-hero--live .aislf-option-hero__copy { align-self: start; padding-top: clamp(4.5rem, 8vw, 7.5rem); }

@media (max-width: 700px) {
	.aislf-option-hero--live { min-height: 47rem; }
	.aislf-option .aislf-option-hero--live > img { object-position: 63% center; }
	.aislf-option-hero--live > .aislf-option-hero__shade { background: linear-gradient(90deg, rgba(1, 3, 24, .88), rgba(2, 7, 42, .66) 68%, rgba(2, 5, 24, .3)); }
	.aislf-option-hero--live .aislf-option-hero__copy {
		width: auto;
		margin-inline: var(--aislf-option-gutter);
		padding-block: 3rem;
	}
	.aislf-option-hero--live h1 { max-width: 10ch; font-size: clamp(2.75rem, 12vw, 4.25rem); }
	.aislf-option-hero--live .aislf-option-hero__intro-copy { font-size: .95rem; line-height: 1.45; }
	.aislf-option-hero--live .aislf-option-hero__body-copy p { font-size: .82rem; line-height: 1.5; }
	.aislf-option--1a .aislf-option-hero--live .aislf-option-hero__copy,
	.aislf-option--2b .aislf-option-hero--live .aislf-option-hero__copy { align-self: center; padding-top: 3rem; }
}

/* ---------- Foundation film: one source, four editorial treatments ---------- */
.aislf-option-intro__video {
	grid-column: 1 / -1;
	margin: clamp(1rem, 3vw, 2.5rem) 0 0;
}
.aislf-option-intro__video video {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #0b1526;
	object-fit: contain;
}
.aislf-option-intro__video figcaption {
	/* Sits directly under the film and runs on one line where the column is
	   wide enough. The old 800px cap forced this sentence to wrap at every
	   desktop size; narrow screens still wrap naturally, which is correct. */
	max-width: none;
	margin: .75rem auto 0;
	color: #526071;
	font-size: .82rem;
	line-height: 1.5;
	text-align: center;
}
/* 1A: calm, full-width documentary panel after the two-column introduction. */
/* .aislf-option--1a .aislf-option-intro__video { border-top: 1px solid rgba(22, 36, 62, .25); padding-top: clamp(1.25rem, 2.5vw, 2.25rem); } */
/* 1B: the film becomes the destination at the end of the narrative pathway. */
.aislf-option--1b .aislf-option-intro__video { max-width: 56rem; margin-left: auto; }
.aislf-option--1b .aislf-option-intro__video video { box-shadow: -1rem 1rem 0 #e8e1d4; }
/* 2A: editorial feature — wide picture plate with a precise rule and caption. */
.aislf-option--2a .aislf-option-intro__video { border-top: 2px solid var(--aislf-color-navy); padding-top: 1rem; }
.aislf-option--2a .aislf-option-intro__video figcaption { font-family: var(--aislf-font-heading); }
/* 2B: report treatment — a restrained navy frame, aligned to the report column. */
.aislf-option--2b .aislf-option-intro {
	gap: clamp(1.25rem, 2.25vw, 2rem);
	padding-block: clamp(3rem, 5vw, 4rem);
}
.aislf-option--2b .aislf-option-intro__heading .aislf-option__eyebrow { margin-bottom: .65rem; }
.aislf-option--2b .aislf-option-intro__copy p { margin-bottom: .7rem; }
.aislf-option--2b .aislf-option-intro__video { max-width: 42rem; margin-top: .25rem; margin-left: 0; padding: .75rem; background: #0b1526; }
.aislf-option--2b .aislf-option-intro__video figcaption { margin: .7rem auto .1rem; color: rgba(255,255,255,.78); }

@media (max-width: 700px) {
	.aislf-option-intro__video { grid-column: auto; margin-top: .5rem; }
	.aislf-option--1b .aislf-option-intro__video,
	.aislf-option--2b .aislf-option-intro__video { max-width: none; margin-left: 0; }
	.aislf-option--1b .aislf-option-intro__video video { box-shadow: -.5rem .5rem 0 #e8e1d4; }
	/* Stacked into a single column, the video sits directly under the
	   Foundation copy it belongs to, so its column rule now reads as a
	   divider splitting one section in two. */
	.aislf-option--1a .aislf-option-intro__video,
	.aislf-option--2a .aislf-option-intro__video { border-top: 0; padding-top: 0; }
}

/* ---------- Tablet and narrow-phone responsive QA corrections ---------- */
/* Six full brief labels need the menu disclosure through tablet widths. */
@media (max-width: 1199px) {
	.aislf-header--option .aislf-header__trigger { display: flex; }
	.aislf-header--option .aislf-header__nav-list { flex-direction: column; gap: 0; }
}

@media (min-width: 701px) and (max-width: 900px) {
	.aislf-option--1a .aislf-option-programmes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aislf-option--1a .aislf-option-programme { min-height: auto; }
	.aislf-option--2a .aislf-option-programme:nth-child(n+3) {
		grid-template-columns: 2.5rem minmax(9rem, .85fr) minmax(0, 1.15fr);
		gap: 1.25rem;
	}
	.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__motto { grid-column: 2; grid-row: 2; }
	.aislf-option--2a .aislf-option-programme:nth-child(n+3) .aislf-option-programme__link { grid-column: 3; grid-row: 2; white-space: normal; }
	.aislf-option--2b .aislf-option-programme { grid-template-columns: 4rem minmax(0, .9fr) minmax(0, 1.1fr); column-gap: 1.25rem; }
	.aislf-option--2a .aislf-option-news-card,
	.aislf-option--2b .aislf-option-news-card { grid-template-columns: minmax(15.5rem, 49%) minmax(0, 1fr); gap: 1.25rem; }
}

@media (max-width: 360px) {
	/* Wide enough for the trimmed mark's 2.9:1 ratio, so it scales down by
	   height rather than being letterboxed by the width cap. */
	.aislf-header__logo--remote { max-width: 7.5rem; }
	.aislf-wordmark--harrow { display: none; }
	.aislf-header__trigger { padding-inline: .65rem; }
	/* The "Menu" word is the button's only content now that the icon has
	   been removed, so it must stay visible at every width. */
}

/* ==========================================================================
   Client review 2026-08-28 — header, brand colour and homepage composition.
   ========================================================================== */

/* The main site now uses the same navy brand header as the review options, so
   the approved treatment is not limited to the comparison URLs. */
.aislf-header--brand {
	background: var(--aislf-color-navy);
	color: var(--aislf-color-white);
}

/* The chrome shares the page's content column. The header, the navigation
   row and the footer all previously sat on the 24px container padding while
   every body section sits on the wider option gutter, so their left edges
   were 24px short of the content above and below them. */
.aislf-header--brand .aislf-header__inner,
.aislf-header--brand .aislf-header__nav-list,
.aislf-footer__inner {
	max-width: var(--aislf-option-max-width);
	padding-inline: var(--aislf-option-gutter);
}

/* The logo needs real space above and below it rather than sitting hard
   against the top edge of the page. */
.aislf-header--brand .aislf-header__inner {
	min-height: 5rem;
}

/* The navigation row was as tall as the logo bar. Trim it back while
   keeping each link a comfortable pointer target. */
.aislf-header--brand .aislf-header__nav-list {
	padding-block: .25rem;
}

.aislf-header--brand .aislf-header__nav-list a {
	display: flex;
	align-items: center;
	min-height: 2.75rem;
	padding-block: 0;
}

.aislf-header--brand .aislf-header__nav,
.aislf-header--brand .aislf-header__nav-list {
	background: var(--aislf-color-navy);
}

.aislf-header--brand .aislf-header__nav-list a,
.aislf-header--brand .aislf-wordmark {
	color: var(--aislf-color-white);
}

/* The Elementor guard above forces the trigger navy with !important, which on
   the navy brand bar rendered the Menu button navy-on-navy: present, focusable
   and completely invisible on every width below the nav breakpoint. The option
   header already carried this correction; the brand header did not. */
.aislf-header--brand .aislf-header__trigger,
.aislf-header--brand .aislf-header .aislf-header__trigger {
	border-color: var(--aislf-color-white) !important;
	color: var(--aislf-color-white) !important;
}

.aislf-header--brand .aislf-header__divider {
	display: none;
}

/* Header follows the page on scroll, so the navigation stays reachable from
   anywhere in a long homepage. */
.aislf-header--brand,
.aislf-header--option {
	position: sticky;
	top: 0;
	z-index: 60;
}

.aislf-option-switcher {
	position: sticky;
	top: 0;
	z-index: 61;
}

/* The switcher sits above the header, so the header sticks below it. */
.aislf-header--option {
	top: 2.25rem;
}

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* Keep the menu toggle available below the desktop navigation breakpoint. */
@media (min-width: 1200px) {
	.aislf-header__trigger {
		display: none !important;
	}
}

.aislf-header__inner {
	align-items: center;
	display: flex;
	gap: clamp(.75rem, 1.5vw, 1.5rem);
}

.aislf-header__logos {
	flex: 0 0 auto;
}

.aislf-header__nav {
	background: transparent;
	border-top: 0;
	flex: 1 1 auto;
	min-width: 0;
}

/* Gold rules divide each primary navigation label. */
.aislf-header--brand .aislf-header__nav-list,
.aislf-header--option .aislf-header__nav-list {
	align-items: stretch;
}

.aislf-header--brand .aislf-header__nav-list > li,
.aislf-header--option .aislf-header__nav-list > li {
	display: flex;
	align-items: center;
}

.aislf-header--brand .aislf-header__nav-list > li + li,
.aislf-header--option .aislf-header__nav-list > li + li {
	padding-left: clamp(.9rem, 1.8vw, 1.75rem);
}

/* Once the bar is shown at all, each label sits on a single line: the six
   approved labels are long, so the row is scaled to fit rather than wrapped. */
@media (min-width: 1200px) {
	.aislf-header--brand .aislf-header__nav-list a,
	.aislf-header--option .aislf-header__nav-list a {
		white-space: nowrap;
		font-size: clamp(.72rem, .95vw, .95rem);
	}

	.aislf-header--brand .aislf-header__nav-list,
	.aislf-header--option .aislf-header__nav-list {
		gap: clamp(.5rem, 1.1vw, 1.5rem);
	}

	.aislf-header--brand .aislf-header__nav-list > li + li,
.aislf-header--option .aislf-header__nav-list > li + li {
	padding-left: clamp(.5rem, 1.1vw, 1.5rem);
}
}

/* WordPress submenu behaviour: keep child levels hidden until their parent
   is hovered or focused. The first child level drops below its parent and
   deeper levels fly out to the right. */
@media (min-width: 1200px) {
	.aislf-header__nav-list > li {
		position: relative;
	}

	/* Short animated underline for the desktop primary navigation. Keep this
	 * on top-level links only so submenu items retain their clean treatment. */
	.aislf-header__nav-list > li > a {
		position: relative;
	}

	.aislf-header__nav-list > li > a::after {
		background: var(--aislf-color-gold);
		bottom: .2rem;
		content: "";
		height: 2px;
		left: 50%;
		position: absolute;
		transform: translateX(-50%);
		transition: width .24s ease;
		width: 0;
	}

	.aislf-header__nav-list > li > a:hover::after,
	.aislf-header__nav-list > li > a:focus-visible::after {
		width: 1.5rem;
	}

	.aislf-header__nav-list .sub-menu {
		background: var(--aislf-color-navy);
		border: 1px solid rgba(255, 255, 255, .28);
		box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .2);
		flex-direction: column;
		gap: 0;
		left: 0;
		list-style: none;
		margin: 0;
		min-width: 16rem;
		opacity: 0;
		padding: .35rem 0;
		pointer-events: none;
		position: absolute;
		top: 100%;
		transform: translateY(-.75rem);
		transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
		visibility: hidden;
		z-index: 20;
	}

	.aislf-header__nav-list li:hover > .sub-menu,
	.aislf-header__nav-list li:focus-within > .sub-menu {
		display: flex;
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
		visibility: visible;
	}

	.aislf-header__nav-list .sub-menu li {
		border: 0;
		display: block;
		padding: 0;
		position: relative;
	}

	.aislf-header__nav-list .sub-menu a {
		align-items: center;
		background: transparent;
		color: var(--aislf-color-white);
		display: flex;
		min-height: 2.75rem;
		padding: .65rem 1rem;
		white-space: normal;
	}

	.aislf-header__nav-list .sub-menu a:hover,
	.aislf-header__nav-list .sub-menu a:focus {
		background: var(--aislf-color-navy-light);
		text-decoration: none;
	}

	.aislf-header__nav-list .sub-menu .sub-menu {
		left: 100%;
		top: -.35rem;
	}
}

/* The supplied Foundation mark is a flat PNG with its own navy field baked in
   (no transparency), so it already reads on the navy bar. An added light
   surface only drew a white box around it. */
.aislf-header__logo-surface {
	background: none;
	padding: 0;
}

/* The mark is the trimmed asset, so the element box is now the artwork itself
   rather than artwork plus ~25% dead margin on every side. Heights come down
   accordingly: the same box would otherwise render the logo nearly twice its
   previous size. */
.aislf-header__logo,
.aislf-header__logo--remote {
	height: 2.25rem;
	max-width: 11rem;
}

@media (max-width: 60rem) {
	.aislf-header--brand .aislf-header__nav-list > li + li,
	.aislf-header--option .aislf-header__nav-list > li + li {
		border-left: 0;
		padding-left: 0;
	}
}

/* Footer: the locations column read cramped in review, so it now spans a
   wider track in one column with room to breathe, and the reference site's
   Harrow-in-the-U.K. column is included. */
@media (min-width: 960px) {
	.aislf-footer__inner {
		grid-template-columns: 1.5fr 1fr 1.15fr 1fr 1fr 1.2fr;
		gap: var(--aislf-space-6) var(--aislf-space-4);
	}
}

.aislf-footer__list--locations {
	columns: 1;
}

.aislf-footer__list--locations li {
	margin-bottom: .45rem;
}

/* Same as the header mark: the PNG carries its own navy field, so a light
   surface behind it only draws a white box. Height reduced for the trimmed
   asset, whose box is the artwork with no built-in margin. */
.aislf-footer__logo {
	height: 2.5rem;
}

.aislf-footer__address {
	line-height: 1.7;
}

.aislf-footer__email {
	margin: var(--aislf-space-2) 0 0;
	opacity: .85;
}

.aislf-footer__email a {
	color: var(--aislf-color-white);
}

/* ---------- Approved homepage composition ---------- */

/* Each band carries its own chosen direction's option class, so the shared
   page background is set per band rather than once on a single wrapper. */
.aislf-home-band {
	background: #f7f4ef;
}

/* Client review: the programme index keeps 1A's card layout without the
   numbered badges. */
.aislf-option-programmes--unnumbered .aislf-option-programme__number {
	display: none;
}

/* Client review: the audience band read too dark and too tightly packed, and
   the cards are informational rather than navigational, so the links are
   dropped and the band sits on the cream surface. */
.aislf-option-audiences--light {
	background: var(--aislf-color-cream);
	color: var(--aislf-color-navy);
}

.aislf-option-audiences--light .aislf-option__eyebrow {
	color: var(--aislf-color-gold-text);
}

.aislf-option-audiences--light .aislf-option-audiences__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 2.75rem);
	border: 0;
}

.aislf-option-audiences--light .aislf-option-audiences__grid article {
	min-height: 0;
	padding: clamp(1.5rem, 2.4vw, 2.25rem) 0 0;
	border: 0;
	border-top: 2px solid var(--aislf-color-gold);
}

.aislf-option-audiences--light .aislf-option-audiences__grid h3 {
	margin: 0 0 var(--aislf-space-2);
	font-size: clamp(1.35rem, 1.6vw, 1.6rem);
}

.aislf-option-audiences--light .aislf-option-audiences__grid p {
	max-width: 34ch;
}

@media (max-width: 60rem) {
	.aislf-option-audiences--light .aislf-option-audiences__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 40rem) {
	.aislf-option-audiences--light .aislf-option-audiences__grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   About AISL & AISL Harrow Schools — ported from the live page (2026-09).
   Built on the approved homepage's .aislf-option-* language rather than a
   new visual system, per the client's revamp brief.
   ========================================================================== */

.aislf-about-hero {
	position: relative;
	display: grid;
	/* Reads as a page banner, not a full hero — the homepage owns the tall
	   hero treatment; this page's job is to get to the copy quickly. */
	height: 320px;
	min-height: 320px;
	overflow: hidden;
	background: #050a24;
}

/* The image and shade are taken out of flow: as grid items, the image's own
   1920×1009 ratio set the row height (841px at a 1600px viewport) and
   min-height could not cap it. Out of flow, the band's height is the
   min-height or the copy, whichever is taller, and the image crops to it. */
.aislf-about-hero > img,
.aislf-about-hero__shade {
	position: absolute;
	inset: 0;
}

.aislf-about-hero__copy {
	grid-area: 1 / 1;
}

.aislf-about-hero > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 32%;
}

.aislf-about-hero__shade {
	background: linear-gradient(to top, rgba(1, 3, 24, .78) 0%, rgba(1, 3, 24, .1) 60%);
}

.aislf-about-hero__copy {
	z-index: 1;
	align-self: end;
	width: 100%;
	max-width: var(--aislf-option-max-width);
	margin-inline: auto;
	padding: var(--aislf-space-3) var(--aislf-option-gutter) clamp(1.5rem, 3vw, 2.5rem);
	color: var(--aislf-color-white);
}

.aislf-about-hero__copy h1 {
	margin: var(--aislf-space-2) 0 0;
	font-size: var(--aislf-font-size-h1);
}

/* The shared breadcrumb component defaults to navy text, centred with its
   own max-width — reset both so it sits, in white, at the hero's own inset. */
.aislf-about-hero .aislf-breadcrumbs {
	margin: 0;
	max-width: none;
	padding-inline: 0;
}

.aislf-about-hero .aislf-breadcrumbs a,
.aislf-about-hero .aislf-breadcrumbs li,
.aislf-about-hero .aislf-breadcrumbs span {
	color: var(--aislf-color-white);
}

/* Over the photograph the default underline reads as clutter. It returns on
   hover and focus, so the link is still obviously a link when reached — and
   focus-visible keeps its own ring regardless. Scoped to this hero; the
   breadcrumb on cream elsewhere keeps its conventional underline. */
.aislf-about-hero .aislf-breadcrumbs a {
	text-decoration: none;
}

.aislf-about-hero .aislf-breadcrumbs a:hover,
.aislf-about-hero .aislf-breadcrumbs a:focus-visible {
	text-decoration: underline;
}

.aislf-about-anchor-nav {
	margin-inline: auto;
	max-width: var(--aislf-option-max-width);
	padding: var(--aislf-space-3) var(--aislf-option-gutter) 0;
}

.aislf-about-anchor-nav__inner {
	display: flex;
	gap: var(--aislf-space-3);
	overflow-x: auto;
	border-bottom: 1px solid rgba(22, 36, 62, .2);
}

.aislf-about-anchor-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 .1rem;
	border-bottom: 2px solid transparent;
	color: var(--aislf-color-navy);
	font-weight: 700;
	font-size: .9rem;
	white-space: nowrap;
	text-decoration: none;
}

.aislf-about-anchor-nav a:hover,
.aislf-about-anchor-nav a:focus {
	border-bottom-color: var(--aislf-color-gold);
}

.aislf-about-section {
	/* Clears the sticky brand header + this page's own anchor nav so a jump
	   link doesn't land its target underneath either bar. */
	scroll-margin-top: var(--aislf-anchor-offset);
}

/* The homepage's intro grid gives the heading the wider column, which suits
   its short intro. This page's sections run four to five paragraphs, so the
   same proportions left a tall, narrow column of copy beside a mostly empty
   one. Scoped to this page so the approved homepage layout is untouched. */
.aislf-about-section.aislf-option-intro {
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.45fr);
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
	padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

/* The rule above carries two classes, so it outranks the shared
   single-class `.aislf-option-intro` mobile collapse no matter where that
   sits in the file — these sections have to collapse themselves. Without
   this the grid stays two-up at phone widths and the copy column runs into
   its own heading. */
@media (max-width: 700px) {
	.aislf-about-section.aislf-option-intro {
		grid-template-columns: 1fr;
		gap: var(--aislf-space-3);
	}

	/* Same cause: the shared mobile rule drops the film to `grid-column:
	   auto`, which is only correct once the grid is single-column. While the
	   grid stayed two-up, the film auto-placed into the narrow first track
	   and rendered as a thumbnail. */
	.aislf-about-section .aislf-option-intro__video {
		grid-column: 1 / -1;
	}

	/* Three long section labels cannot share one phone-width row. Wrapping
	   shows all three at once; scrolling hid the third behind exactly the
	   kind of raw scrollbar chrome that was removed from the rail. */
	.aislf-about-anchor-nav__inner {
		flex-wrap: wrap;
		gap: 0 var(--aislf-space-3);
		overflow-x: visible;
	}
}

.aislf-about-section:not(:first-of-type) {
	border-top: 1px solid rgba(22, 36, 62, .18);
}

.aislf-about-cta {
	margin: 0 0 var(--aislf-space-4);
}

/* Each section opens with its lead paragraph set in brand gold and a step up
   in size, as on the live page.

   The tone is --aislf-color-gold-text, not --aislf-color-gold: the brand gold
   reads 2.38:1 on this cream ground, which fails WCAG AA for body copy (4.5:1)
   and would still fail even at large-text sizes (3:1). The darkened token
   exists in tokens.css for exactly this case and reads 5.57:1. */
.aislf-option-intro__copy .aislf-about-lead {
	max-width: 58ch;
	margin-bottom: var(--aislf-space-3);
	color: var(--aislf-color-gold-text);
	/* Stepped up to sit closer to the live page, where the gold opening
	   paragraph reads a clear size above the body copy rather than a nudge. */
	font-size: var(--aislf-font-size-lead);
	line-height: 1.45;
}

.aislf-about-lead strong {
	font-weight: 700;
}

.aislf-about-locations {
	margin: 0 0 var(--aislf-space-4);
}

/* The composite schools banner is a single wide artwork, so it reads as a
   full-bleed band rather than a picture sitting inside the reading measure.
   Breaking out of the section's max-width and gutters needs the viewport
   width, and `100vw` includes the classic scrollbar — hence the explicit
   width below rather than `width: 100vw`, which would overflow the page by
   the scrollbar's width on Windows. */
.aislf-about-banner {
	margin-inline: calc(50% - 50vw);
	width: auto;
	max-width: none;
}

.aislf-about-banner img {
	display: block;
	width: 100vw;
	max-width: 100%;
	height: auto;
}

/* ==========================================================================
   Media rail — reusable component (templates/sections/media-rail.php).
   Page-agnostic: pages own the spacing around it, the component owns itself.
   ========================================================================== */

.aislf-rail {
	/* Local motion tokens. The built-in CSS easings are too weak to read as
	   intentional; these are the strong variants. Kept scoped until a second
	   component needs them rather than pushed into tokens.css early. */
	--aislf-rail-ease-out: cubic-bezier(.23, 1, .32, 1);
	--aislf-rail-dur-press: 120ms;
	--aislf-rail-dur-hover: 180ms;
	--aislf-rail-dur-enter: 280ms;
}

.aislf-rail__viewport {
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	/* Zero, not the gutter. The viewport's own start edge already sits on the
	   content edge, so a scroll padding there pushed every snap one gutter
	   short of the card — each step stopped on the gap with a sliver of the
	   previous card still showing, instead of landing on the next image. */
	scroll-padding-inline: 0;
	/* overflow clips outward box-shadows and the global :focus-visible ring is
	   one, so leave it room. */
	padding-block: 6px var(--aislf-space-2);
	/* The rail starts on the section's own left edge, so the first card lines
	   up with every heading on the page, and runs off the right edge of the
	   screen. Reaching the screen edge means clearing two things: the
	   section's gutter, and the empty margin left when the 1440px container
	   is centred in a wider viewport. A partly-visible card at that edge is
	   what signals there is more to see — the job the scrollbar used to do. */
	margin-inline-end: calc(-1 * (var(--aislf-option-gutter) + max(0px, (100vw - var(--aislf-option-max-width)) / 2)));
	padding-inline-end: 0;
}

/* The native scrollbar is hidden only once rail.js has confirmed the arrows
   work. Without JavaScript the flag is never set and the scrollbar stays,
   so a mouse-only user is never stranded with no way to scroll. */
[data-aislf-rail-ready] .aislf-rail__viewport {
	scrollbar-width: none;
}

[data-aislf-rail-ready] .aislf-rail__viewport::-webkit-scrollbar {
	display: none;
}

.aislf-rail__list {
	display: flex;
	gap: var(--aislf-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Three across on a desktop rather than four. The photographs are the point
   of this section, and at four the schools were reduced to thumbnails. */
.aislf-rail__item {
	flex: 0 0 clamp(15rem, 30vw, 26rem);
	margin: 0;
	scroll-snap-align: start;
}

.aislf-rail__item figure {
	margin: 0;
}

.aislf-rail__media {
	/* The supplied frame, exactly: every source photograph is 800x432. 4:3
	   discarded 28% of each image and 3:2 still took 19%; matching the native
	   ratio crops nothing, and follows the same rule the review imagery
	   already states — retain the supplied frame rather than a fashionable
	   crop. Rails fed differently-shaped images can override this. */
	aspect-ratio: 800 / 432;
	overflow: hidden;
	background: #dfe3e8;
}

.aislf-rail__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.aislf-rail__caption {
	margin-top: var(--aislf-space-1);
	color: var(--aislf-color-gold-text);
	font-family: var(--aislf-font-heading);
	font-size: 1rem;
}

.aislf-rail__controls {
	display: flex;
	align-items: center;
	gap: var(--aislf-space-3);
	margin-top: var(--aislf-space-2);
}

.aislf-rail__arrows {
	display: flex;
	gap: var(--aislf-space-1);
}

.aislf-rail__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* 40px, down from 44px: beside a 3:2 card these read as oversized. Still
	   well clear of the 24px WCAG 2.2 minimum target size; 44px is the AAA
	   comfort figure, not a floor. */
	inline-size: 40px;
	block-size: 40px;
	padding: 0;
	border: 1px solid var(--aislf-color-navy);
	border-radius: var(--aislf-radius);
	background: transparent;
	color: var(--aislf-color-navy);
	cursor: pointer;
	transition:
		transform var(--aislf-rail-dur-press) var(--aislf-rail-ease-out),
		background-color var(--aislf-rail-dur-hover) ease,
		color var(--aislf-rail-dur-hover) ease,
		opacity var(--aislf-rail-dur-hover) ease;
}

/* Touch devices fire :hover on tap, so gate it. */
@media (hover: hover) and (pointer: fine) {
	.aislf-rail__arrow:not([aria-disabled="true"]):hover {
		background: var(--aislf-color-navy);
		color: var(--aislf-color-white);
	}
}

.aislf-rail__arrow:active:not([aria-disabled="true"]) {
	transform: scale(.96);
}

.aislf-rail__arrow[aria-disabled="true"] {
	opacity: .35;
	cursor: default;
}

/* Elementor's global button colours load after the child theme and were
   painting these arrows pink on the deployed site. Same guard the header
   trigger already carries, for the same reason. */
.aislf-rail .aislf-rail__arrow {
	border-color: var(--aislf-color-navy) !important;
	background-color: transparent !important;
	color: var(--aislf-color-navy) !important;
}

@media (hover: hover) and (pointer: fine) {
	.aislf-rail .aislf-rail__arrow:not([aria-disabled="true"]):hover {
		background-color: var(--aislf-color-navy) !important;
		color: var(--aislf-color-white) !important;
	}
}

.aislf-rail__progress {
	position: relative;
	flex: 1 1 auto;
	block-size: 2px;
	overflow: hidden;
	background: rgba(22, 36, 62, .18);
}

.aislf-rail__progress-fill {
	position: absolute;
	inset: 0;
	/* gold-text, not gold: the brand gold on this cream ground is 2.38:1 and
	   fails the 3:1 minimum for a non-text state indicator. */
	background: var(--aislf-color-gold-text);
	transform: scaleX(.3);
	transform-origin: left center;
	will-change: transform;
}

.aislf-rail__count {
	flex: 0 0 auto;
	margin: 0;
	color: var(--aislf-color-gold-text);
	font-family: var(--aislf-font-body);
	font-size: var(--aislf-font-size-eyebrow);
	font-weight: 700;
	letter-spacing: .12em;
	/* Stops the digits twitching as the count changes. */
	font-variant-numeric: tabular-nums;
}

/* Entrance stagger, transitions rather than keyframes so it stays
   interruptible. Only the cards in view stagger; the rest must never sit
   waiting for a delay that never pays off. */
.aislf-rail__item {
	opacity: 0;
	transform: translateY(10px);
	transition:
		opacity var(--aislf-rail-dur-enter) var(--aislf-rail-ease-out),
		transform var(--aislf-rail-dur-enter) var(--aislf-rail-ease-out);
}

[data-aislf-rail-ready] .aislf-rail__item {
	opacity: 1;
	transform: none;
}

[data-aislf-rail-ready] .aislf-rail__item:nth-child(2) { transition-delay: 45ms; }
[data-aislf-rail-ready] .aislf-rail__item:nth-child(3) { transition-delay: 90ms; }
[data-aislf-rail-ready] .aislf-rail__item:nth-child(4) { transition-delay: 135ms; }

/* If JavaScript never runs, the cards must still be visible. */
.aislf-rail:not([data-aislf-rail-ready]) .aislf-rail__item {
	opacity: 1;
	transform: none;
	transition: none;
}

/* Reduced motion means gentler, not zero: keep the fade that explains
   arrival, drop every displacement. */
@media (prefers-reduced-motion: reduce) {
	.aislf-rail {
		--aislf-rail-dur-enter: 150ms;
	}

	.aislf-rail__item {
		transform: none;
		transition-property: opacity;
	}

	[data-aislf-rail-ready] .aislf-rail__item {
		transition-delay: 0ms;
	}

	.aislf-rail__arrow {
		transition-property: background-color, color, opacity;
	}

	.aislf-rail__arrow:active:not([aria-disabled="true"]) {
		transform: none;
	}
}

@media (max-width: 700px) {
	/* One card, full content width. On a phone the 78vw peek cost more in
	   image size than it bought in "there is more this way" — the arrows,
	   the counter and the progress track all carry that signal already. */
	.aislf-rail__item {
		flex-basis: calc(100vw - (var(--aislf-option-gutter) * 2));
	}

	/* The rail is the full content width now, so nothing is meant to bleed
	   past its end. */
	.aislf-rail__viewport {
		margin-inline-end: 0;
		padding-inline-end: 0;
	}

	.aislf-rail__arrow {
		inline-size: 36px;
		block-size: 36px;
	}

	.aislf-rail__arrow svg {
		width: 15px;
		height: 15px;
	}

	.aislf-rail__controls {
		gap: var(--aislf-space-2);
	}
}

/* Desktop header layout override: keep the logo and primary menu together
   once the full navigation has enough room. */
@media (min-width: 1200px) {
.aislf-header.aislf-header--brand .aislf-header__nav-list,
.aislf-header.aislf-header--option .aislf-header__nav-list {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 2rem;
	justify-content: flex-start;
	max-width: none;
	overflow: visible;
	padding: .25rem 0;
	white-space: nowrap;
}

.aislf-header {
	overflow-anchor: none;
	position: sticky;
	top: 0;
	z-index: 100;
}

.aislf-header.aislf-header--brand .aislf-header__nav-list > li + li,
.aislf-header.aislf-header--option .aislf-header__nav-list > li + li {
	padding-left: 0;
}

.aislf-header.aislf-header--brand .aislf-header__nav-list a,
.aislf-header.aislf-header--option .aislf-header__nav-list a {
	font-size: clamp(.7rem, .85vw, .9rem);
}
}

.aislf-header--brand .aislf-header__logo,
.aislf-header--option .aislf-header__logo,
.aislf-header--brand .aislf-header__logo--remote,
.aislf-header--option .aislf-header__logo--remote {
	height: 2.5rem;
	max-width: 11.25rem;
}

.aislf-header--brand .aislf-header__inner,
.aislf-header--option .aislf-header__inner {
	height: 6rem;
	min-height: 6rem;
	transition: height .28s ease, min-height .28s ease;
}

.aislf-header--brand .aislf-header__logo-link,
.aislf-header--option .aislf-header__logo-link,
.aislf-header--brand .aislf-header__logo-surface,
.aislf-header--option .aislf-header__logo-surface {
	display: inline-flex;
	height: 2.5rem;
	transition: height .28s ease, width .28s ease;
}

.aislf-header--brand .aislf-header__logo,
.aislf-header--option .aislf-header__logo,
.aislf-header--brand .aislf-header__logo--remote,
.aislf-header--option .aislf-header__logo--remote {
	display: block;
	transition: height .2s ease, max-width .2s ease;
}

.aislf-header--brand .aislf-header__nav-list a,
.aislf-header--option .aislf-header__nav-list a,
.aislf-header--brand .aislf-header__nav-list a:hover,
.aislf-header--brand .aislf-header__nav-list a:focus,
.aislf-header--option .aislf-header__nav-list a:hover,
.aislf-header--option .aislf-header__nav-list a:focus {
	text-decoration: none !important;
}

.aislf-header--brand.aislf-header--scrolled .aislf-header__inner,
.aislf-header--option.aislf-header--scrolled .aislf-header__inner {
	height: 4.2rem;
	min-height: 4.2rem;
}

.aislf-header--brand.aislf-header--scrolled .aislf-header__logo-link,
.aislf-header--option.aislf-header--scrolled .aislf-header__logo-link,
.aislf-header--brand.aislf-header--scrolled .aislf-header__logo-surface,
.aislf-header--option.aislf-header--scrolled .aislf-header__logo-surface {
	height: 2rem;
}

.aislf-header--brand.aislf-header--scrolled .aislf-header__logo,
.aislf-header--option.aislf-header--scrolled .aislf-header__logo,
.aislf-header--brand.aislf-header--scrolled .aislf-header__logo--remote,
.aislf-header--option.aislf-header--scrolled .aislf-header__logo--remote {
	height: 2rem;
	max-width: 9rem;
}

/* Mobile navigation is a full-page panel opened by the top-right toggle. */
@media (max-width: 1199px) {
	body.aislf-menu-open {
		overflow: hidden;
	}

	.aislf-header--brand .aislf-header__trigger,
	.aislf-header--option .aislf-header__trigger {
		display: flex !important;
		align-items: center;
		justify-content: center;
		position: relative;
		z-index: 101;
		margin-left: auto;
		min-width: 2.75rem;
		width: 2.75rem;
		height: 2.75rem;
		padding: 0 !important;
		border: 0 !important;
		border-color: transparent !important;
		border-radius: 0;
		background: transparent !important;
		box-shadow: none !important;
		color: var(--aislf-color-white) !important;
	}

	.aislf-header--brand .aislf-header__trigger:hover,
	.aislf-header--brand .aislf-header__trigger:focus,
	.aislf-header--brand .aislf-header__trigger:active,
	.aislf-header--brand .aislf-header__trigger:focus-visible,
	.aislf-header--option .aislf-header__trigger:hover,
	.aislf-header--option .aislf-header__trigger:focus,
	.aislf-header--option .aislf-header__trigger:active,
	.aislf-header--option .aislf-header__trigger:focus-visible {
		border: 0 !important;
		background: transparent !important;
		background-color: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
		color: var(--aislf-color-white) !important;
	}

	.aislf-header--brand .aislf-header__trigger,
	.aislf-header--option .aislf-header__trigger {
		-webkit-tap-highlight-color: transparent;
	}

	.aislf-header__trigger-icon::before,
	.aislf-header__trigger-icon::after {
		top: 0;
		bottom: auto;
		transform-origin: center;
	}

	.aislf-header__trigger-icon::before {
		box-shadow: 0 .5rem 0 currentColor;
	}

	.aislf-header__trigger[aria-expanded="true"] .aislf-header__trigger-icon::before {
		box-shadow: none;
	}

	.aislf-header--brand .aislf-header__nav,
	.aislf-header--option .aislf-header__nav {
		position: fixed;
		inset: 0;
		z-index: 100;
		overflow-y: auto;
		padding-top: 6rem;
		border: 0;
		background: var(--aislf-color-navy);
	}

	.aislf-header--brand .aislf-header__nav-list,
	.aislf-header--option .aislf-header__nav-list {
		display: block !important;
		max-width: var(--aislf-option-max-width);
		padding: 1rem var(--aislf-option-gutter) 3rem;
	}

	.aislf-header--brand .aislf-header__nav-list > li,
	.aislf-header--option .aislf-header__nav-list > li {
		display: block !important;
		width: 100%;
		margin: 0;
		padding: 0 !important;
		border: 0;
	}

	.aislf-header--brand .aislf-header__nav-list a,
	.aislf-header--option .aislf-header__nav-list a {
		display: block;
		width: 100%;
		color: var(--aislf-color-white);
		font-size: 1.1rem;
		line-height: 1.3;
		padding: .45rem 0;
		white-space: normal;
	}

	.aislf-header--brand .aislf-header__nav-list .sub-menu,
	.aislf-header--option .aislf-header__nav-list .sub-menu {
		display: block !important;
		width: 100%;
		margin: 0;
		padding: 0 0 .35rem 1.25rem;
		background: transparent;
		border-left: 1px solid rgb(171 152 104 / 70%);
	}

	.aislf-header--brand .aislf-header__nav-list .sub-menu li,
	.aislf-header--option .aislf-header__nav-list .sub-menu li {
		display: block;
		margin: 0;
	}

	.aislf-header--brand .aislf-header__nav-list > li.menu-item-has-children > a,
	.aislf-header--option .aislf-header__nav-list > li.menu-item-has-children > a {
		padding-block: .7rem .45rem;
		color: var(--aislf-color-gold);
		font-weight: 700;
		letter-spacing: .015em;
	}

	.aislf-header--brand .aislf-header__nav-list .sub-menu a,
	.aislf-header--option .aislf-header__nav-list .sub-menu a {
		color: rgb(255 255 255 / 88%);
		font-size: .98rem;
		padding-block: .28rem;
	}

	.aislf-header--brand .aislf-header__nav-list a:hover,
	.aislf-header--brand .aislf-header__nav-list a:focus,
	.aislf-header--option .aislf-header__nav-list a:hover,
	.aislf-header--option .aislf-header__nav-list a:focus {
		color: var(--aislf-color-gold) !important;
		text-decoration: none !important;
	}
}

@keyframes aislf-menu-fade-in-down {
	from {
		opacity: 0;
		transform: translateY(-1rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (max-width: 1199px) and (prefers-reduced-motion: no-preference) {
	.aislf-header--brand .aislf-header__nav:not([hidden]),
	.aislf-header--option .aislf-header__nav:not([hidden]) {
		animation: aislf-menu-fade-in-down .28s ease both;
	}

	.aislf-header--brand .aislf-header__nav.aislf-menu-closing,
	.aislf-header--option .aislf-header__nav.aislf-menu-closing {
		animation: aislf-menu-fade-out-up .28s ease both;
		pointer-events: none;
	}
}

@keyframes aislf-menu-fade-out-up {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 0;
		transform: translateY(-1rem);
	}
}
