/* GCU Bureau theme layer on top of Twenty Twenty-One.
   Colours come from tokens.css (gcu-brand v2026.10) plus the web additions in section 1; no hex
   values outside those two places. The web font is Inter (section 0), with Arial as fallback.
   The parent is driven through its own custom properties where it has one. Where its selectors
   are very specific (buttons, nested group spacing) this file says so and matches them.

   Sections: 0 font · 1 tokens · 2 base · 3 headings · 4 header · 5 page band · 6 content and
   registers · 7 homepage patterns · 8 footer · 9 print */

/* ---------- 0. Web font: Inter ---------- */

/* Inter 4.1 (rsms/inter, SIL OFL, assets/fonts/OFL.txt), served from the theme: no request to
   Google or any other third party. Cut to Latin and Latin Extended (EN/FR/DE), weights 400-700,
   optical-size axis and every OpenType feature kept. The website uses Inter; Word and PowerPoint
   keep Arial (gcu-brand), which is also the fallback below. */
@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/inter-latin.woff2") format("woff2");
}

@font-face {
	font-family: "Inter";
	font-style: italic;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/inter-latin-italic.woff2") format("woff2");
}

/* Arial scaled to Inter's metrics, so text does not jump when Inter arrives. */
@font-face {
	font-family: "Inter Fallback";
	src: local("Arial");
	ascent-override: 90.44%;
	descent-override: 22.52%;
	line-gap-override: 0%;
	size-adjust: 107.12%;
}

/* ---------- 1. Tokens ---------- */

/* Web additions to the gcu-brand palette (website only, owner-approved 23 Oct 2026):
   Deep for the hero, utility strip and footer; a lighter hairline; amber shades that keep the
   "open" status word at 4.5:1; one radius; two elevations tinted towards the blue. */
:root {
	--gcu-font-web: "Inter", "Inter Fallback", var(--gcu-font);
	--gcu-deep: #00365F;
	--gcu-on-deep: #DCE6F2;
	--gcu-on-deep-rule: rgba(255, 255, 255, 0.16);
	--gcu-line: #E3E8EF;
	--gcu-band: #F8FAFC;
	--gcu-amber-ink: #7A4A00;
	--gcu-amber-tint: #FFF4E5;
	--gcu-green-tint: #EAF4EA;
	--gcu-red-tint: #FBEAE9;
	--gcu-radius: 4px;
	--gcu-shadow-1: 0 1px 2px rgba(0, 54, 95, 0.06), 0 4px 16px rgba(0, 54, 95, 0.06);
	--gcu-shadow-2: 0 2px 4px rgba(0, 30, 60, 0.10), 0 16px 40px rgba(0, 30, 60, 0.22);
	--gcu-container: 1200px;
	--gcu-pad: clamp(20px, 4vw, 32px);
	--gcu-wrap: min(calc(100vw - 2 * var(--gcu-pad)), var(--gcu-container));
	--gcu-section-space: clamp(40px, 5vw, 64px);

	/* Parent variables */
	--global--font-primary: var(--gcu-font-web);
	--global--font-secondary: var(--gcu-font-web);
	--global--font-size-base: 1rem;
	--global--font-size-xs: 0.875rem;
	--global--font-size-sm: 0.9375rem;
	--global--font-size-md: 1rem;
	--global--font-size-lg: 1.15rem;
	--global--font-size-xl: 1.4rem;
	--global--font-size-xxl: 1.75rem;
	--global--font-size-xxxl: 2.4rem;
	--global--font-size-page-title: 2.75rem;
	--global--line-height-body: 1.6;
	--global--line-height-heading: 1.25;
	--global--line-height-page-title: 1.1;

	--heading--font-size-h1: 1.75rem;
	--heading--font-size-h2: 1.4rem;
	--heading--font-size-h3: 1.15rem;
	--heading--font-size-h4: 1.05rem;
	--heading--font-size-h5: 1rem;
	--heading--font-size-h6: 0.875rem;
	--heading--font-weight: 700;
	--heading--font-weight-page-title: 700;
	--heading--font-weight-strong: 700;
	--entry-header--font-size: var(--global--font-size-page-title);

	--global--color-primary: var(--gcu-ink);
	--global--color-secondary: var(--gcu-deep);
	--global--color-primary-hover: var(--gcu-blue);
	--global--color-background: var(--gcu-white);
	--global--color-border: var(--gcu-rule);

	--button--color-text-active: var(--gcu-blue);
	--button--color-background: var(--gcu-blue);
	--button--font-size: 0.9375rem;
	--button--font-weight: 600;
	--button--border-width: 1px;
	--button--border-radius: var(--gcu-radius);
	--button--padding-vertical: 12px;
	--button--padding-horizontal: 22px;

	--form--font-size: 1rem;
	--form--border-color: var(--gcu-rule);
	--form--border-width: 1px;
	--form--border-radius: var(--gcu-radius);

	--table--stripes-border-color: var(--gcu-rule);
	--table--stripes-background-color: var(--gcu-mist);

	--branding--logo--max-width: 148px;
	--branding--logo--max-width-mobile: 120px;

	--primary-nav--font-size: 0.9375rem;
	--primary-nav--font-size-mobile: 1.125rem;
	--primary-nav--font-size-sub-menu: 0.9375rem;
	--primary-nav--font-size-sub-menu-mobile: 1rem;
	--primary-nav--font-size-button: 0.9375rem;
	--primary-nav--font-weight: 600;
	--primary-nav--font-weight-button: 600;
	--primary-nav--color-link: var(--gcu-ink);
	--primary-nav--color-link-hover: var(--gcu-blue);
	--primary-nav--color-text: var(--gcu-ink);
	--primary-nav--border-color: var(--gcu-line);

	/* One container for header, content and footer. */
	--responsive--alignwide-width: var(--gcu-wrap);
}

/* Reading width 720 px; registers and embedded tools use the full container. The parent sets
   these inside media queries, so they are repeated in the same queries. */
@media only screen and (min-width: 482px) {
	:root {
		--responsive--aligndefault-width: min(calc(100vw - 2 * var(--gcu-pad)), 720px);
		--responsive--alignwide-width: var(--gcu-wrap);
	}

	body.gcu-wide {
		--responsive--aligndefault-width: var(--gcu-wrap);
	}
}

@media only screen and (min-width: 822px) {
	:root {
		--responsive--aligndefault-width: min(calc(100vw - 2 * var(--gcu-pad)), 720px);
		--responsive--alignwide-width: var(--gcu-wrap);
	}
}

/* ---------- 2. Base ---------- */

html body {
	font-size: var(--global--font-size-base);
	color: var(--gcu-ink);
	background-color: var(--gcu-white);
}

/* Body links in GCU Blue, not Accent Blue: Accent on white is about 3.6:1, under the 4.5:1
   needed for text. */
.site-main a:not(.wp-block-button__link):not(.wp-block-file__button) {
	color: var(--gcu-blue);
}

.site-main a:not(.wp-block-button__link):not(.wp-block-file__button):hover {
	color: var(--gcu-deep);
}

/* Same selector as the parent's focus rule (90 % white background, hidden outline), so this one
   wins by order. On the deep-blue strips the text and outline are white. */
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
	background: none;
	color: var(--gcu-blue);
	outline: 2px solid var(--gcu-accent);
	outline-offset: 2px;
}

.site .gcu-utility a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.site .gcu-footer a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.site .gcu-hero a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
	color: var(--gcu-white);
	outline-color: var(--gcu-white);
}

.site a:focus:not(:focus-visible) {
	outline: none;
}

/* Buttons: the parent empties them on hover with !important; brand is Deep on hover. Their
   GCU Blue fill is in frontend.css, which the block editor does not load. */
.site .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.site .wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
	background-color: var(--gcu-deep) !important;
	border-color: var(--gcu-deep) !important;
	color: var(--gcu-white) !important;
}

/* ---------- 3. Headings ---------- */

.entry-content h1 {
	color: var(--gcu-deep);
	letter-spacing: -0.015em;
}

.entry-content h2 {
	color: var(--gcu-ink);
	letter-spacing: -0.01em;
}

.entry-content h3 {
	color: var(--gcu-steel);
	font-style: italic;
}

/* The signature: a short double rule, like two rails, above page and section titles. */
.gcu-page-header .entry-title::before,
.gcu-section-title::before {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	margin-bottom: 26px;
	background: var(--gcu-blue);
	box-shadow: 0 6px 0 var(--gcu-blue);
}

/* ---------- 4. Header: utility strip, masthead, menu ---------- */

.gcu-utility {
	background: var(--gcu-deep);
	color: var(--gcu-on-deep);
	font-size: 0.8125rem;
	line-height: 1.4;
}

.gcu-utility__inner {
	max-width: var(--gcu-wrap);
	margin: 0 auto;
	padding: 8px 0;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 24px;
	align-items: center;
	justify-content: space-between;
}

.gcu-utility__links,
.gcu-utility__languages {
	display: flex;
	align-items: center;
	gap: 12px;
}

.gcu-utility__links {
	gap: 24px;
	margin-left: auto;
}

.site .gcu-utility a {
	color: var(--gcu-on-deep);
	text-decoration: none;
}

.site .gcu-utility a:hover,
.site .gcu-utility a[aria-current] {
	color: var(--gcu-white);
}

.site .gcu-utility a[aria-current] {
	font-weight: 600;
}

.site .gcu-utility .gcu-utility__broker {
	color: var(--gcu-white);
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.gcu-utility__broker::before {
	content: "";
	width: 14px;
	height: 14px;
	background: currentColor;
	-webkit-mask: var(--gcu-icon-login) center / contain no-repeat;
	mask: var(--gcu-icon-login) center / contain no-repeat;
}

@media (max-width: 599px) {
	.gcu-utility__name {
		display: none;
	}
}

/* The masthead stays at the top while the utility strip scrolls away. */
.gcu-masthead {
	position: sticky;
	top: var(--global--admin-bar--height, 0px);
	z-index: 50;
	background: var(--gcu-white);
	border-bottom: 1px solid var(--gcu-line);
	transition: box-shadow 0.2s;
}

/* Below 600 px WordPress lets the admin bar scroll away, so nothing sits above the masthead. */
@media (max-width: 600px) {
	.gcu-masthead {
		top: 0;
	}
}

html {
	scroll-padding-top: 96px;
}

/* Once stuck (sticky-header.js), the masthead gets compact: the logo at its 110 px screen minimum
   (gcu-brand), less padding and no gaps between menu items, so logo and menu share one row from
   1024 px in all three languages. */
.gcu-header-stuck .gcu-masthead {
	box-shadow: 0 2px 12px rgba(0, 30, 60, 0.12);
}

.gcu-header-stuck .site-header {
	padding-top: 6px;
	padding-bottom: 6px;
}

.gcu-header-stuck .site-header .gcu-logo img {
	width: 110px;
}

@media only screen and (min-width: 482px) {
	.gcu-header-stuck .primary-navigation > div > .menu-wrapper {
		column-gap: 0;
	}
}

/* Phone: the menu button lines up with the smaller logo. */
@media only screen and (max-width: 481.98px) {
	.gcu-header-stuck .menu-button-container {
		padding-top: 4px;
	}
}

.site-header {
	position: relative;
	max-width: var(--gcu-wrap);
	padding-top: 16px;
	padding-bottom: 16px;
	align-items: center;
	row-gap: 12px;
}

@media only screen and (min-width: 482px) {
	.site-header {
		padding-top: 18px;
		padding-bottom: 18px;
	}
}

.site-header .site-branding {
	margin-right: auto;
}

.site-header .gcu-logo {
	display: block;
	line-height: 0;
}

.site-header .gcu-logo img {
	display: block;
	width: var(--branding--logo--max-width-mobile);
	height: auto;
}

@media only screen and (min-width: 482px) {
	.site-header .gcu-logo img {
		width: var(--branding--logo--max-width);
	}
}

/* Prefixed with .site-header to outrank the parent's ":link" rules and the inline CSS that the
   Options for Twenty Twenty-One plugin prints while it is still active. */
.site-header .primary-navigation a,
.site-header .primary-navigation a:link,
.site-header .primary-navigation a:visited {
	color: var(--primary-nav--color-link);
	font-weight: var(--primary-nav--font-weight);
	text-transform: none;
	text-decoration: none;
}

.site-header .primary-navigation a:hover {
	color: var(--primary-nav--color-link-hover);
	text-decoration: none;
}

.site-header .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-plus svg,
.site-header .primary-navigation > div > .menu-wrapper .sub-menu-toggle .icon-minus svg {
	fill: var(--gcu-steel);
}

/* The page you are in: a GCU Blue underline on its top-level item. */
.site-header .primary-navigation > div > .menu-wrapper > .current-menu-item:not(.gcu-cta) > a,
.site-header .primary-navigation > div > .menu-wrapper > .current-menu-ancestor:not(.gcu-cta) > a {
	color: var(--gcu-blue);
	box-shadow: inset 0 -2px 0 var(--gcu-blue);
}

/* A menu item with the CSS class "gcu-cta" (Appearance → Menus → CSS Classes) is the button. */
.site-header .primary-navigation .gcu-cta > a,
.site-header .primary-navigation .gcu-cta > a:link,
.site-header .primary-navigation .gcu-cta > a:visited,
.site .site-header .primary-navigation .gcu-cta > a:focus {
	display: inline-block;
	padding: 10px 18px;
	border-radius: var(--gcu-radius);
	background: var(--gcu-blue);
	color: var(--gcu-white);
	box-shadow: none;
}

.site-header .primary-navigation .gcu-cta > a:hover {
	background: var(--gcu-deep);
	color: var(--gcu-white);
}

/* The language switcher now sits in the utility strip; any left in the menu shows names only. */
.primary-navigation .pll-parent-menu-item img,
.primary-navigation .lang-item img {
	display: none;
}

@media only screen and (min-width: 482px) {
	.primary-navigation > div > .menu-wrapper {
		column-gap: 8px;
		align-items: center;
	}

	.primary-navigation .sub-menu {
		background-color: var(--gcu-white);
		border-radius: var(--gcu-radius);
		box-shadow: var(--gcu-shadow-1);
	}

	.primary-navigation .sub-menu .menu-item > a:hover {
		background-color: var(--gcu-sky);
		color: var(--gcu-deep);
	}
}

/* Phone: the parent's menu overlay is white with Ink links; only the button needs placing,
   because the header no longer starts at the top of the page. */
@media only screen and (max-width: 481.98px) {
	.site-header .primary-navigation {
		top: 0;
	}

	.primary-navigation-open .site-header .primary-navigation {
		top: var(--global--admin-bar--height);
	}

	.menu-button-container {
		padding-top: 16px;
	}

	.site-header .menu-button-container #primary-mobile-menu {
		color: var(--gcu-deep);
	}

	.site-header .primary-navigation .gcu-cta {
		margin-top: 16px;
	}
}

/* ---------- 5. Page title band ---------- */

.site .site-main {
	padding-top: 0;
	padding-bottom: var(--gcu-section-space);
}

.home .site-main {
	padding-bottom: 0;
}

/* Holds only the editor's "Edit" link on the homepage (the admin bar has one too). */
.home .entry-footer {
	display: none;
}

.site-main > article > .gcu-page-header,
.singular .gcu-page-header {
	max-width: var(--gcu-wrap);
	margin: 0 auto 48px;
	padding: 40px 0 48px;
	border: 0;
	/* Mist band across the full width with a hairline below; border-image paints beyond the
	   box without adding horizontal scroll. */
	border-image: linear-gradient(var(--gcu-mist) calc(100% - 1px), var(--gcu-line) 0) fill 0 / 0 / 0 100vmax;
}

.gcu-breadcrumb {
	margin-bottom: 24px;
	font-size: 0.875rem;
	color: var(--gcu-steel);
}

.site .site-main .gcu-breadcrumb a {
	color: var(--gcu-steel);
}

.gcu-breadcrumb__sep {
	margin: 0 4px;
}

.gcu-page-header .entry-title {
	margin: 0;
	max-width: 20em;
	font-size: clamp(2rem, 1.4rem + 2vw, 2.75rem);
	line-height: 1.1;
	letter-spacing: -0.025em;
	color: var(--gcu-deep);
}

.gcu-page-header__lead {
	margin: 16px 0 0;
	max-width: 720px;
	font-size: 1.125rem;
	color: var(--gcu-steel);
}

/* ---------- 6. Content and registers (TablePress) ---------- */

/* Registers sit inside block groups (flex or constrained layout); min-width: 0 stops the
   wrapper from growing to the table's width instead of scrolling. */
.gcu-table-wrap {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: var(--global--spacing-vertical);
	border: 1px solid var(--gcu-rule);
	border-radius: var(--gcu-radius);
}

.entry-content .tablepress {
	--text-color: var(--gcu-ink);
	--head-text-color: var(--gcu-deep);
	--head-bg-color: var(--gcu-sky);
	--head-active-bg-color: var(--gcu-tint);
	--odd-bg-color: var(--gcu-white);
	--even-bg-color: var(--gcu-band);
	--hover-bg-color: var(--gcu-sky);
	--border-color: var(--gcu-line);
	width: 100%;
	margin-bottom: 0;
	font-size: 0.9375rem;
	line-height: 1.5;
	/* l with a tail (cv05) and I with serifs (cv08), so codes such as AP-ECMinGCU-2026-03
	   cannot be misread. Not "tnum": in Inter it also widens hyphens and full stops, which
	   gaps dates and codes ("2026 - 04"). */
	font-feature-settings: "cv05", "cv08";
}

/* Overrides the TablePress custom CSS stored in WordPress (dark blue header, grey !important
   borders), which uses the shorter selectors ".tablepress thead tr th" and ".tablepress tbody td". */
.entry-content .tablepress thead th,
.entry-content .tablepress tfoot th {
	background-color: var(--gcu-sky);
	color: var(--gcu-deep);
	font-size: 0.8125rem;
	font-weight: 600;
	vertical-align: bottom;
	text-align: left;
}

.entry-content .tablepress thead tr th,
.entry-content .tablepress tbody td,
.entry-content .tablepress tfoot th {
	border: 0 !important;
	border-bottom: 1px solid var(--gcu-line) !important;
	padding: 16px 20px;
}

.entry-content .tablepress thead tr th {
	border-bottom-color: var(--gcu-rule) !important;
}

.entry-content .tablepress tbody tr:last-child td {
	border-bottom: 0 !important;
}

.entry-content .tablepress tbody td {
	vertical-align: top;
}

/* Registers with four or more columns keep a readable width and scroll in their frame on a
   phone, instead of squeezing every column to a few characters. */
.gcu-table-wrap .tablepress:has(td.column-4) {
	min-width: 46rem;
}

.entry-content .tablepress tbody td.column-1 {
	font-weight: 600;
}

/* Embedded GCU Broker tools (signatory search, wagon search, Appendix 5 calculation). The pages
   carry an inline style from the old theme, "left: -350px; width: 1200px", which shifted the
   iframe out of a narrow column; on these wide pages it pushes the tool off the left edge.
   !important is needed to beat the inline style. */
.entry-content iframe[src*="gcubroker.org"] {
	display: block;
	left: 0 !important;
	right: auto !important;
	width: 100% !important;
	max-width: 100%;
}

/* Status word and document buttons, for registers whose upload CSV carries the markup:
   <span class="gcu-pill gcu-pill--open">open</span>
   <span class="gcu-docs"><a href="…_en.pdf">EN</a><a href="…_fr.pdf">FR</a><a href="…_de.pdf">DE</a></span> */
.gcu-pill {
	display: inline-block;
	justify-self: end;
	margin: 0;
	padding: 2px 10px;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.5;
	white-space: nowrap;
}

.gcu-pill--open,
.gcu-pill--attention {
	color: var(--gcu-amber-ink);
	background: var(--gcu-amber-tint);
	border-color: var(--gcu-amber);
}

.gcu-pill--adopted,
.gcu-pill--on-track {
	color: var(--gcu-green);
	background: var(--gcu-green-tint);
}

.gcu-pill--rejected,
.gcu-pill--overdue {
	color: var(--gcu-red);
	background: var(--gcu-red-tint);
}

.gcu-docs {
	display: inline-flex;
	gap: 6px;
}

.site .gcu-docs a {
	padding: 3px 9px;
	border: 1px solid var(--gcu-rule);
	border-radius: var(--gcu-radius);
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
}

.site .gcu-docs a:hover {
	border-color: var(--gcu-blue);
	background: var(--gcu-sky);
}

/* ---------- 7. Homepage patterns ---------- */

/* Classic themes get an extra .wp-block-group__inner-container inside every group, and the
   editor adds its own wrappers; both are taken out of the layout so the grids below apply to
   the blocks themselves. */
.wp-block-group[class*="gcu-"] > .wp-block-group__inner-container,
.wp-block-group[class*="gcu-"] > .block-editor-inner-blocks,
.wp-block-group[class*="gcu-"] > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: contents;
}

/* The parent spaces and narrows every child of a group and of the content; the patterns set
   their own spacing, so those rules are undone inside them. */
.entry-content > .alignfull[class*="gcu-"] {
	margin-top: 0;
	margin-bottom: 0;
}

/* :where() keeps this at zero specificity: it beats the parent's normal rules by !important,
   and any later !important rule in this file beats it. */
:where(.alignfull[class*="gcu-"]) :where(p, h1, h2, h3, ol, ul, li, .wp-block-group, .wp-block-buttons) {
	margin: 0 !important;
	max-width: none !important;
}

.gcu-hero__inner,
.gcu-figures__inner,
.gcu-split,
.gcu-about__inner {
	max-width: var(--gcu-wrap) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.gcu-section {
	padding: var(--gcu-section-space) 0;
}

/* Two white sections in a row would stack both paddings; one is enough. */
.gcu-section:not(.gcu-section--mist) + .gcu-section:not(.gcu-section--mist) {
	padding-top: 0;
}

.gcu-section--mist {
	background: var(--gcu-mist);
}

/* Two classes: ".entry-content h2" (section 3) would otherwise set the colour and spacing. */
.gcu-section .gcu-section-title {
	margin-bottom: 16px !important;
	font-size: clamp(1.75rem, 1.3rem + 1.2vw, 2.125rem);
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--gcu-deep);
}

.gcu-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	gap: 48px 64px;
	align-items: start;
}

.gcu-split__intro p {
	max-width: 22em !important;
	color: var(--gcu-steel);
}

.gcu-split__intro p + p {
	margin-top: 16px !important;
}

.gcu-more a {
	font-weight: 600;
	text-decoration: none;
}

.gcu-more a::after {
	content: " →";
}

/* Hero */

.gcu-hero {
	background: var(--gcu-deep);
	color: var(--gcu-white);
	padding: var(--gcu-section-space) 0 calc(var(--gcu-section-space) + 8px);
}

.gcu-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

/* .gcu-hero prefix: ".entry-content h1" (section 3) would otherwise paint it Deep on Deep. */
.gcu-hero .gcu-hero__title {
	font-size: clamp(2.125rem, 1.4rem + 2.6vw, 3.25rem);
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--gcu-white);
}

.gcu-hero__title::before {
	content: "";
	display: block;
	width: 56px;
	height: 3px;
	margin-bottom: 32px;
	background: var(--gcu-accent);
	box-shadow: 0 7px 0 var(--gcu-accent);
}

.gcu-hero .gcu-hero__lead {
	margin-top: 24px !important;
	max-width: 36em !important;
	font-size: 1.1875rem;
	color: var(--gcu-on-deep);
}

.gcu-hero .wp-block-buttons {
	margin-top: 36px !important;
	gap: 12px;
}

.gcu-hero .wp-block-button .wp-block-button__link {
	border-radius: var(--gcu-radius);
}

.gcu-hero .gcu-button-light .wp-block-button__link {
	background-color: var(--gcu-white) !important;
	border-color: var(--gcu-white) !important;
	color: var(--gcu-deep) !important;
}

/* .site prefix: the general button hover (section 2) is .site-scoped and would otherwise win. */
.site .gcu-hero .gcu-button-light .wp-block-button__link:hover,
.site .gcu-hero .gcu-button-light .wp-block-button__link:active {
	background-color: var(--gcu-sky) !important;
	border-color: var(--gcu-sky) !important;
	color: var(--gcu-deep) !important;
}

.gcu-hero .gcu-button-ghost .wp-block-button__link {
	background-color: transparent !important;
	border-color: rgba(255, 255, 255, 0.45) !important;
	color: var(--gcu-white) !important;
}

.site .gcu-hero .gcu-button-ghost .wp-block-button__link:hover,
.site .gcu-hero .gcu-button-ghost .wp-block-button__link:active {
	border-color: var(--gcu-white) !important;
	background-color: rgba(255, 255, 255, 0.08) !important;
	color: var(--gcu-white) !important;
}

/* Wave card */

.gcu-wave-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 6px 12px;
	align-items: center;
	padding: 28px;
	border-radius: var(--gcu-radius);
	background: var(--gcu-white);
	color: var(--gcu-ink);
	box-shadow: var(--gcu-shadow-2);
}

.gcu-wave-card .gcu-wave-card__title,
.gcu-wave-card .gcu-timeline,
.gcu-wave-card .gcu-more {
	grid-column: 1 / -1;
}

.gcu-wave-card__meta {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--gcu-steel);
}

.gcu-wave-card .gcu-wave-card__title {
	margin-bottom: 12px !important;
	font-size: 1.375rem;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--gcu-ink);
}

.gcu-timeline {
	list-style: none;
	padding: 0 !important;
	margin-bottom: 16px !important;
}

.gcu-timeline li {
	position: relative;
	padding: 10px 0 10px 24px;
	border-top: 1px solid var(--gcu-line);
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--gcu-steel);
}

.gcu-timeline li strong {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--gcu-ink);
}

.gcu-timeline li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 17px;
	width: 10px;
	height: 10px;
	box-sizing: border-box;
	border: 2px solid var(--gcu-rule);
	border-radius: 999px;
	background: var(--gcu-white);
}

.gcu-timeline li.is-next::before {
	border-color: var(--gcu-blue);
}

.gcu-timeline li.is-done::before {
	border-color: var(--gcu-blue);
	background: var(--gcu-blue);
}

/* Key figures */

.gcu-figures {
	border-bottom: 1px solid var(--gcu-line);
}

.gcu-figures__inner {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gcu-figure {
	padding: 32px 24px !important;
	border-left: 1px solid var(--gcu-line);
}

.gcu-figure:first-child {
	padding-left: 0 !important;
	border-left: 0;
}

.gcu-figure__value {
	font-size: clamp(1.75rem, 1.2rem + 1.5vw, 2.25rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--gcu-blue);
}

.gcu-figure__label {
	margin-top: 6px !important;
	font-size: 0.875rem;
	color: var(--gcu-steel);
}

/* Tools */

.gcu-tools__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 48px;
	border-top: 1px solid var(--gcu-rule);
}

.gcu-tool {
	position: relative;
	padding: 28px 0 28px 62px !important;
	border-bottom: 1px solid var(--gcu-rule);
}

/* Icon tile: ::before is the Sky Tint square, ::after the line icon (Lucide shapes, as masks). */
.gcu-tool::before,
.gcu-tool::after {
	content: "";
	position: absolute;
	left: 0;
	top: 28px;
	width: 44px;
	height: 44px;
	border-radius: var(--gcu-radius);
	background: var(--gcu-sky);
}

.gcu-tool::after {
	left: 11px;
	top: 39px;
	width: 22px;
	height: 22px;
	border-radius: 0;
	background: var(--gcu-blue);
	-webkit-mask: var(--gcu-tool-icon) center / contain no-repeat;
	mask: var(--gcu-tool-icon) center / contain no-repeat;
}

.gcu-tool--primary::before {
	background: var(--gcu-blue);
}

.gcu-tool--primary::after {
	background: var(--gcu-white);
}

.gcu-icon-search { --gcu-tool-icon: var(--gcu-icon-search); }
.gcu-icon-users { --gcu-tool-icon: var(--gcu-icon-users); }
.gcu-icon-calculator { --gcu-tool-icon: var(--gcu-icon-calculator); }
.gcu-icon-login { --gcu-tool-icon: var(--gcu-icon-login); }

.gcu-tool__title {
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.4;
}

.site .site-main .gcu-tool__title a {
	color: var(--gcu-ink);
	text-decoration: none;
}

/* The whole tile is the link. */
.gcu-tool__title a::before {
	content: "";
	position: absolute;
	inset: 0;
}

.site .site-main .gcu-tool:hover .gcu-tool__title a {
	color: var(--gcu-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.gcu-tool__text {
	margin-top: 4px !important;
	font-size: 0.9375rem;
	color: var(--gcu-steel);
}

/* Notifications */

.gcu-notice-list {
	border-radius: var(--gcu-radius);
	background: var(--gcu-white);
	box-shadow: var(--gcu-shadow-1);
}

.gcu-notice {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	column-gap: 32px;
	padding: 24px 28px !important;
	border-bottom: 1px solid var(--gcu-line);
}

.gcu-notice:last-child {
	border-bottom: 0;
}

.gcu-notice__date {
	grid-row: 1 / span 2;
	padding-top: 2px;
	font-size: 0.875rem;
	color: var(--gcu-steel);
}

.gcu-notice__title {
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.4;
}

.site .site-main .gcu-notice__title a {
	color: var(--gcu-ink);
	text-decoration: none;
}

.site .site-main .gcu-notice__title a:hover {
	color: var(--gcu-blue);
	text-decoration: underline;
}

.gcu-notice__text {
	margin-top: 2px !important;
	font-size: 0.9375rem;
	color: var(--gcu-steel);
}

/* About */

.gcu-about__inner {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px 80px;
	align-items: start;
}

.gcu-about__text p + p {
	margin-top: 16px !important;
}

.gcu-link-list {
	border-top: 1px solid var(--gcu-rule);
}

.gcu-link-row {
	position: relative;
	padding: 22px 40px 22px 0 !important;
	border-bottom: 1px solid var(--gcu-rule);
}

.gcu-link-row::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: var(--gcu-blue);
	-webkit-mask: var(--gcu-icon-arrow) center / contain no-repeat;
	mask: var(--gcu-icon-arrow) center / contain no-repeat;
}

.gcu-link-row__title {
	font-size: 1.0625rem;
	font-weight: 600;
}

.site .site-main .gcu-link-row__title a {
	color: var(--gcu-ink);
	text-decoration: none;
}

.gcu-link-row__title a::before {
	content: "";
	position: absolute;
	inset: 0;
}

.site .site-main .gcu-link-row:hover .gcu-link-row__title a {
	color: var(--gcu-blue);
}

.gcu-link-row__text {
	font-size: 0.9375rem;
	color: var(--gcu-steel);
}

/* Narrow screens */

@media (max-width: 899px) {
	.gcu-hero__inner,
	.gcu-split,
	.gcu-about__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.gcu-hero__inner {
		gap: 40px;
	}
}

@media (max-width: 699px) {
	.gcu-figures__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gcu-figure,
	.gcu-figure:first-child {
		padding: 24px 0 !important;
		border-left: 0;
	}

	.gcu-figure:nth-child(n + 3) {
		border-top: 1px solid var(--gcu-line);
	}

	.gcu-tools__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.gcu-notice {
		grid-template-columns: minmax(0, 1fr);
		padding: 18px 20px !important;
	}

	.gcu-notice__date {
		grid-row: auto;
		padding-top: 0;
	}

	.gcu-wave-card {
		padding: 22px;
	}
}

/* Icons: Lucide shapes (ISC licence), used as CSS masks so they take the text colour. */
:root {
	--gcu-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E");
	--gcu-icon-users: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
	--gcu-icon-calculator: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='16' height='20' x='4' y='2' rx='2'/%3E%3Cline x1='8' x2='16' y1='6' y2='6'/%3E%3Cline x1='16' x2='16' y1='14' y2='18'/%3E%3Cpath d='M16 10h.01M12 10h.01M8 10h.01M12 14h.01M8 14h.01M12 18h.01M8 18h.01'/%3E%3C/svg%3E");
	--gcu-icon-login: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpolyline points='10 17 15 12 10 7'/%3E%3Cline x1='15' x2='3' y1='12' y2='12'/%3E%3C/svg%3E");
	--gcu-icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
}

/* ---------- 8. Footer ---------- */

.gcu-footer {
	background: var(--gcu-deep);
	color: var(--gcu-on-deep);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.gcu-footer__inner {
	max-width: var(--gcu-wrap);
	margin: 0 auto;
	padding: 64px 0 32px;
}

.gcu-footer__top {
	display: grid;
	grid-template-columns: minmax(200px, 1fr) minmax(0, 3fr);
	gap: 40px;
	padding-bottom: 48px;
	border-bottom: 1px solid var(--gcu-on-deep-rule);
}

.gcu-footer__logo {
	display: block;
	width: 132px;
	height: auto;
	margin-bottom: 20px;
}

.gcu-footer address {
	font-style: normal;
	line-height: 1.7;
}

.site .gcu-footer a {
	color: var(--gcu-on-deep);
	text-decoration: none;
}

.site .gcu-footer a:hover,
.site .gcu-footer address a,
.site .gcu-footer [aria-current] {
	color: var(--gcu-white);
}

.site .gcu-footer a:hover {
	text-decoration: underline;
}

.gcu-footer__menu,
.gcu-footer__menu .sub-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}

.gcu-footer__menu {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 32px;
}

.site .gcu-footer__menu > li > a {
	display: block;
	margin-bottom: 14px;
	color: var(--gcu-white);
	font-weight: 600;
}

.gcu-footer__menu .sub-menu {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.gcu-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	justify-content: space-between;
	padding-top: 24px;
	font-size: 0.875rem;
}

.gcu-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
}

.site .gcu-footer .gcu-footer__language[aria-current] {
	font-weight: 600;
}

@media (max-width: 799px) {
	.gcu-footer__top {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---------- 9. Print ---------- */

@media print {
	.gcu-utility,
	.gcu-masthead,
	.gcu-footer,
	.gcu-breadcrumb {
		display: none !important;
	}

	.gcu-page-header {
		border-image: none !important;
		padding: 0 0 12pt !important;
	}

	.gcu-hero {
		background: none;
		color: var(--gcu-ink);
	}

	.gcu-table-wrap {
		overflow: visible;
		border: 0;
	}

	.entry-content > *,
	body.gcu-wide .entry-content > * {
		max-width: 100% !important;
	}

	.entry-content .tablepress {
		font-size: 8pt;
	}

	.entry-content .tablepress thead {
		display: table-header-group;
	}

	.entry-content .tablepress tr {
		break-inside: avoid;
	}
}