/**
 * theme-it-services-child — layout shell + global header (CSS variables only).
 *
 * @package Theme_It_Services_Child
 */

/* -------------------------------------------------------------------------
   Spacing scale — child theme uses numeric tokens; define here so rules never
   drop when parent/plugin omits them (invalid var() breaks whole properties).
   ------------------------------------------------------------------------- */
:root {
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.25rem;
	--space-6: 1.5rem;
	--space-7: 1.75rem;
	--space-8: 2rem;
	--space-section-x: clamp(1rem, 4vw, 2rem);
}

/* -------------------------------------------------------------------------
   Document shell — no offset from browser defaults; space for fixed header
   ------------------------------------------------------------------------- */

/*
 * --wp-admin-bar-height: set on :root in header.php from live #wpadminbar (do not set on body).
 */
html {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	--wp-admin-bar-height: 0px;
}

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

body {
	margin: 0;
	padding: 0;
	/* Spacing for fixed site header only; core adds html { margin-top } for the admin bar when logged in */
	padding-top: var(--site-header-height, 4.5rem);
	font-family: var(--font-body);
	color: var(--color-text);
	background: var(--color-bg);
}

.site,
#page.site {
	margin: 0;
	padding: 0;
	max-width: none;
}

/* -------------------------------------------------------------------------
   Fixed header — “command bar”: navy depth, light type, accent only where it earns it
   ------------------------------------------------------------------------- */

.site-header {
	position: fixed;
	top: var(--wp-admin-bar-height, 0px);
	left: 0;
	z-index: 1000;
	width: 100%;
	max-width: 100vw;
	margin: 0;
	padding: 0;
	font-family: var(--font-body);
	color: var(--color-dark-text);
	background: linear-gradient(
		104deg,
		color-mix(in srgb, var(--color-dark) 94%, var(--color-secondary) 6%) 0%,
		color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%) 42%,
		color-mix(in srgb, var(--color-dark) 82%, var(--color-bg-alt) 18%) 100%
	);
	border-bottom: 1px solid color-mix(in srgb, var(--color-dark-text) 14%, transparent);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-dark-text) 8%, transparent),
		var(--box-shadow);
	backdrop-filter: blur(16px);
}

.site-header::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2px;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--color-accent) 55%, transparent) 0%,
		color-mix(in srgb, var(--color-secondary) 35%, transparent) 28%,
		transparent 72%
	);
	opacity: 0.85;
}

.site-header__bar {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
}

.site-header__inner {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-sm);
	width: 100%;
	max-width: none;
	margin: 0;
	padding-block: 0.65rem;
	padding-inline: clamp(1rem, 4vw, var(--container-padding));
}

.site-header__brand {
	flex: 0 1 auto;
	min-width: 0;
}

.site-header__logo {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: inherit;
	/* No border, chip, lift, or hover styling — link is a plain home affordance */
}

/* Keyboard focus only (no hover ring) */
.site-header__logo:focus {
	outline: none;
}

.site-header__logo:focus-visible {
	outline: 2px solid color-mix(in srgb, var(--color-dark-text) 45%, transparent);
	outline-offset: 3px;
}

.site-header__logo-img {
	display: block;
	max-height: 2.65rem;
	width: auto;
	filter: drop-shadow(0 2px 8px color-mix(in srgb, var(--color-dark) 55%, transparent));
}

@media (min-width: 1024px) {
	.site-header__logo-img {
		max-height: 3.2rem;
	}
}

.site-header__title {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: clamp(1rem, 2.4vw, 1.2rem);
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--color-dark-text);
	text-shadow: 0 1px 1px color-mix(in srgb, var(--color-dark) 40%, transparent);
}

/* Desktop primary nav — hidden < 1024px */
.site-header__nav--desktop {
	display: none;
	flex: 1 1 auto;
	justify-content: center;
	min-width: 0;
}

@media (min-width: 1024px) {
	.site-header__nav--desktop {
		display: flex;
	}
}

.site-nav--desktop {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav--desktop > li {
	position: static;
}

/* Parents with mega panel: stacking + invisible bridge so pointer can reach the panel */
.site-nav--desktop > li.menu-item-has-children {
	position: relative;
}

.site-nav--desktop > li.menu-item-has-children:hover,
.site-nav--desktop > li.menu-item-has-children:focus-within {
	z-index: 1003;
}

.site-nav--desktop > li.menu-item-has-children::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: 3rem;
	z-index: 1001;
}

.site-nav--desktop > li > a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 0.85rem;
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0.03em;
	text-decoration: none;
	color: color-mix(in srgb, var(--color-dark-text) 88%, var(--color-bg-alt) 12%);
	border-radius: var(--border-radius);
	transition:
		color 0.25s ease,
		background 0.25s ease,
		box-shadow 0.25s ease;
	box-shadow: inset 0 -2px 0 transparent;
}

.site-nav--desktop > li > a:hover,
.site-nav--desktop > li > a:focus-visible,
.site-nav--desktop > li.current-menu-item > a,
.site-nav--desktop > li.current-menu-ancestor > a {
	color: var(--color-dark-text);
	background: color-mix(in srgb, var(--color-dark-text) 9%, transparent);
	box-shadow: inset 0 -2px 0 color-mix(in srgb, var(--color-accent) 70%, transparent);
	outline: none;
}

/* Nav typography — light labels only on the dark bar (mega panel sets its own colours) */
.nav-item__label {
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 500;
}

.site-nav--desktop > li > a .nav-item__label {
	color: color-mix(in srgb, var(--color-dark-text) 92%, var(--color-secondary) 8%);
}

.site-nav--desktop .nav-item__icon {
	display: inline-flex;
	flex-shrink: 0;
	color: color-mix(in srgb, var(--color-bg-alt) 55%, var(--color-dark-text) 45%);
	font-size: 1rem;
	line-height: 1;
}

.site-nav--desktop .nav-item__icon:empty {
	display: none;
}

/*
 * Mega panel — same surface as .site-header (continuous “command bar”). Top = header bar bottom (JS).
 */
.mega-panel {
	position: fixed;
	left: 0;
	right: 0;
	top: var(--site-header-bottom, 4.5rem);
	z-index: 1002;
	width: 100%;
	max-width: 100vw;
	margin: 0;
	padding: 0;
	border: none;
	color: var(--color-dark-text);
	background: linear-gradient(
		104deg,
		color-mix(in srgb, var(--color-dark) 94%, var(--color-secondary) 6%) 0%,
		color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%) 42%,
		color-mix(in srgb, var(--color-dark) 82%, var(--color-bg-alt) 18%) 100%
	);
	border-top: 1px solid color-mix(in srgb, var(--color-dark-text) 10%, transparent);
	box-shadow:
		0 24px 48px color-mix(in srgb, var(--color-dark) 22%, transparent),
		var(--box-shadow-hover);
	backdrop-filter: blur(16px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-0.35rem);
	transition:
		opacity 0.35s ease,
		visibility 0.35s ease,
		transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.mega-panel::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2px;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		color-mix(in srgb, var(--color-accent) 55%, transparent) 0%,
		color-mix(in srgb, var(--color-secondary) 35%, transparent) 28%,
		transparent 72%
	);
	opacity: 0.85;
}

.mega-panel::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: -3rem;
	height: 3rem;
	z-index: 1;
}

.site-nav--desktop .menu-item-has-children:hover .mega-panel,
.site-nav--desktop .menu-item-has-children:focus-within .mega-panel,
.mega-panel[aria-hidden="false"] {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.mega-panel__inner {
	width: 100%;
	max-width: var(--container-width);
	margin-inline: auto;
	padding-block: var(--space-md);
	padding-inline: clamp(1rem, 4vw, var(--container-padding));
	position: relative;
}

.mega-panel__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-sm) var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 1100px) {
	.mega-panel__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.mega-panel__grid > li {
	margin: 0;
	padding: 0;
}

.mega-panel__grid a {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	padding: 0.45rem 0.35rem;
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: var(--line-height-base);
	text-decoration: none;
	color: color-mix(in srgb, var(--color-dark-text) 92%, var(--color-bg-alt) 8%);
	border-radius: var(--border-radius);
	transition: background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.mega-panel__grid a .nav-item__label {
	color: inherit;
}

.mega-panel__grid a .nav-item__icon {
	color: color-mix(in srgb, var(--color-bg-alt) 45%, var(--color-dark-text) 55%);
	flex-shrink: 0;
	margin-top: 0.15rem;
}

.mega-panel__grid a:hover,
.mega-panel__grid a:focus-visible {
	color: var(--color-dark-text);
	background: color-mix(in srgb, var(--color-dark-text) 10%, transparent);
	box-shadow: inset 3px 0 0 color-mix(in srgb, var(--color-accent) 70%, transparent);
	outline: none;
}

.mega-panel__viewall {
	margin: var(--space-sm) 0 0;
	padding-top: var(--space-sm);
	border-top: 1px solid color-mix(in srgb, var(--color-dark-text) 14%, transparent);
	text-align: center;
}

.mega-panel__viewall a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.5rem 1rem;
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--color-dark-text);
	border-radius: var(--border-radius-lg);
	border: 1px solid color-mix(in srgb, var(--color-accent) 55%, var(--color-dark-text) 45%);
	background: color-mix(in srgb, var(--color-accent) 12%, transparent);
	transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.mega-panel__viewall a:hover,
.mega-panel__viewall a:focus-visible {
	color: var(--color-bg);
	background: color-mix(in srgb, var(--color-accent) 88%, var(--color-dark) 12%);
	border-color: color-mix(in srgb, var(--color-accent) 75%, var(--color-dark-text) 25%);
	box-shadow: 0 2px 12px color-mix(in srgb, var(--color-dark) 28%, transparent);
	outline: none;
}

/* Toolbar — CTA + burger slot */
.site-header__toolbar {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: flex-end;
	gap: var(--space-xs);
}

.site-header__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.55rem 1.15rem;
	font-family: var(--font-heading);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-dark-text);
	background: color-mix(in srgb, var(--color-accent) 12%, transparent);
	border-radius: var(--border-radius-lg);
	border: 1px solid color-mix(in srgb, var(--color-accent) 55%, var(--color-dark-text) 45%);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--color-dark-text) 8%, transparent),
		0 2px 0 color-mix(in srgb, var(--color-dark) 35%, transparent);
	transition:
		transform 0.2s ease,
		box-shadow 0.25s ease,
		background 0.25s ease,
		color 0.25s ease,
		border-color 0.25s ease;
}

.site-header__cta:hover,
.site-header__cta:focus-visible {
	color: var(--color-bg);
	background: color-mix(in srgb, var(--color-accent) 92%, var(--color-dark) 8%);
	border-color: color-mix(in srgb, var(--color-accent) 80%, var(--color-dark-text) 20%);
	box-shadow: var(--box-shadow-hover);
	transform: translateY(-1px);
	outline: none;
}

/*
 * Toolbar CTA: desktop only. Chained selector beats .site-header__cta { display } — required
 * or the base rule was re-showing the link on tablet/mobile.
 */
.site-header__cta.site-header__cta--toolbar {
	display: none;
}

@media (min-width: 1024px) {
	.site-header__cta.site-header__cta--toolbar {
		display: inline-flex;
	}
}

.site-header__burger {
	display: grid;
	place-items: center;
	place-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	margin: 0;
	line-height: 0;
	border: 1px solid color-mix(in srgb, var(--color-dark-text) 28%, transparent);
	border-radius: var(--border-radius);
	background: color-mix(in srgb, var(--color-dark-text) 6%, transparent);
	cursor: pointer;
	box-sizing: border-box;
	/* Parent theme sets -webkit-appearance: button — that adds uneven inner padding on iOS/Safari */
	appearance: none;
	-webkit-appearance: none;
	transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}

.site-header__burger::-moz-focus-inner {
	border: 0;
	padding: 0;
}

.site-header__burger:hover,
.site-header__burger:focus-visible {
	border-color: color-mix(in srgb, var(--color-accent) 45%, var(--color-dark-text) 55%);
	background: color-mix(in srgb, var(--color-dark-text) 12%, transparent);
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-accent) 25%, transparent);
	outline: none;
}

/* Three bars in a fixed box; grid above centers this box in the hit target */
.site-header__burger-icon {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	width: 1.2rem;
	height: 0.875rem;
	flex: 0 0 auto;
	justify-self: center;
	align-self: center;
	direction: ltr;
}

.site-header__burger-line {
	display: block;
	height: 2px;
	background: var(--color-dark-text);
	border-radius: 2px;
	transition: transform 0.3s ease, opacity 0.25s ease;
	transform-origin: center;
}

body.is-mobile-nav-open .site-header__burger-line:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}

body.is-mobile-nav-open .site-header__burger-line:nth-child(2) {
	opacity: 0;
}

body.is-mobile-nav-open .site-header__burger-line:nth-child(3) {
	transform: translateY(-6px) rotate(-45deg);
}

/* Mobile cluster — completely removed on desktop */
.site-header__mobile-only {
	display: block;
}

@media (min-width: 1024px) {
	.site-header__mobile-only,
	.site-header__mobile-only.site-header__mobile-only {
		display: none !important;
	}
}

.site-header__backdrop {
	position: fixed;
	inset: 0;
	z-index: 1100;
	background: color-mix(in srgb, var(--color-dark) 48%, transparent);
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.35s ease, visibility 0.35s ease;
}

body.admin-bar .site-header__backdrop {
	top: var(--wp-admin-bar-height);
}

.site-header__backdrop.is-open {
	opacity: 1;
	visibility: visible;
}

.site-header__drawer {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1200;
	display: flex;
	flex-direction: column;
	width: min(100% - 2rem, 22rem);
	max-width: 100%;
	height: 100vh;
	height: 100dvh;
	margin: 0;
	padding: 0;
	background: color-mix(in srgb, var(--color-bg) 97%, var(--color-bg-alt) 3%);
	border-left: 1px solid color-mix(in srgb, var(--color-secondary) 18%, transparent);
	box-shadow:
		-8px 0 40px color-mix(in srgb, var(--color-dark) 20%, transparent),
		var(--box-shadow-hover);
	transform: translateX(105%);
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

body.admin-bar .site-header__drawer {
	top: var(--wp-admin-bar-height);
	height: calc(100vh - var(--wp-admin-bar-height));
	height: calc(100dvh - var(--wp-admin-bar-height));
}

.site-header__drawer.is-open {
	transform: translateX(0);
}

.site-header__drawer-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-xs);
	padding: var(--space-sm);
	background: linear-gradient(
		95deg,
		color-mix(in srgb, var(--color-dark) 90%, var(--color-secondary) 10%) 0%,
		color-mix(in srgb, var(--color-secondary) 85%, var(--color-dark) 15%) 100%
	);
	border-bottom: 1px solid color-mix(in srgb, var(--color-dark-text) 12%, transparent);
}

.site-header__drawer-title {
	font-family: var(--font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-dark-text) 92%, var(--color-bg-alt) 8%);
}

.site-header__drawer-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: none;
	border-radius: var(--border-radius);
	background: transparent;
	color: var(--color-dark-text);
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.site-header__drawer-close:hover,
.site-header__drawer-close:focus-visible {
	background: color-mix(in srgb, var(--color-dark-text) 12%, transparent);
	color: var(--color-dark-text);
	outline: none;
}

.site-header__drawer-body {
	flex: 1 1 auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: var(--space-sm);
}

.site-header__drawer-cta {
	margin: var(--space-md) 0 0;
	padding: var(--space-md) 0 0;
	border-top: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
}

.site-header__cta.site-header__cta--drawer {
	display: flex;
	width: 100%;
	max-width: 100%;
	justify-content: center;
	text-align: center;
	box-sizing: border-box;
	padding-block: 0.65rem;
	/* Light drawer surface: solid navy bar, not pale accent wash + wrong text token */
	color: var(--color-dark-text);
	background: linear-gradient(
		104deg,
		color-mix(in srgb, var(--color-dark) 94%, var(--color-secondary) 6%) 0%,
		color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%) 42%,
		color-mix(in srgb, var(--color-dark) 82%, var(--color-bg-alt) 18%) 100%
	);
	border: 1px solid color-mix(in srgb, var(--color-dark) 35%, transparent);
	box-shadow: 0 2px 10px color-mix(in srgb, var(--color-dark) 18%, transparent);
	transform: none;
}

.site-header__cta.site-header__cta--drawer:hover,
.site-header__cta.site-header__cta--drawer:focus-visible {
	color: var(--color-bg);
	background: color-mix(in srgb, var(--color-accent) 88%, var(--color-dark) 12%);
	border-color: color-mix(in srgb, var(--color-accent) 70%, var(--color-dark-text) 30%);
	box-shadow: 0 4px 14px color-mix(in srgb, var(--color-dark) 22%, transparent);
	transform: none;
	outline: none;
}

/* Mobile nav tree — same nav typography as desktop */
.mobile-nav {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mobile-nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mobile-nav a {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 500;
	text-decoration: none;
	color: var(--color-text);
}

.mobile-nav .nav-item__label {
	font-family: var(--font-heading);
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--color-text);
}

.mobile-nav .nav-item__icon {
	display: inline-flex;
	flex-shrink: 0;
	color: color-mix(in srgb, var(--color-secondary) 70%, var(--color-text) 30%);
	font-size: 1rem;
	line-height: 1;
}

.mobile-nav .nav-item__icon:empty {
	display: none;
}

.mobile-nav__row {
	display: flex;
	align-items: center;
	gap: var(--space-xs);
	padding-block: 0.35rem;
	border-bottom: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent);
}

.mobile-nav__row .nav-item__label {
	flex: 1 1 auto;
	min-width: 0;
}

.mobile-nav__row--d0 {
	padding-inline-start: 0;
}

.mobile-nav__row--d1 {
	padding-inline-start: var(--space-sm);
}

.mobile-nav__row--d2 {
	padding-inline-start: calc(var(--space-sm) * 2);
}

.mobile-nav__row--d3 {
	padding-inline-start: calc(var(--space-sm) * 3);
}

.mobile-nav__toggle {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--color-text) 14%, transparent);
	border-radius: var(--border-radius);
	background: color-mix(in srgb, var(--color-bg-alt) 45%, var(--color-bg) 55%);
	cursor: pointer;
	transition: border-color 0.25s ease, background 0.25s ease;
}

.mobile-nav__toggle:hover,
.mobile-nav__toggle:focus-visible {
	border-color: color-mix(in srgb, var(--color-primary) 35%, transparent);
	outline: none;
}

.mobile-nav__chev {
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	color: var(--color-text);
}

.mobile-nav li.is-open > .mobile-nav__row .mobile-nav__chev {
	transform: rotate(-180deg);
	color: color-mix(in srgb, var(--color-secondary) 65%, var(--color-primary) 35%);
}

.mobile-nav__sub {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	padding-inline-start: var(--space-sm);
	transition:
		max-height 0.45s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.35s ease;
}

.mobile-nav li.is-open > .mobile-nav__sub {
	max-height: 100rem;
	opacity: 1;
}

.mobile-nav > li > a {
	padding-block: 0.65rem;
	border-bottom: 1px solid color-mix(in srgb, var(--color-text) 7%, transparent);
}

.mobile-nav .mobile-nav__sub a {
	padding-block: 0.55rem;
	border-bottom: 1px solid color-mix(in srgb, var(--color-text) 6%, transparent);
}

body.is-mobile-nav-open {
	overflow: hidden;
}

/* ==========================================================================
   Front page — sections (data from Theme Admin; CSS variables only)
   Background rhythm: navy → white → muted → navy → white → navy (PROJECT.md)
   ========================================================================== */

.site-main--front {
	margin: 0;
	padding: 0;
}

.fp-section {
	position: relative;
	padding-block: clamp(var(--space-md), 6vw, var(--space-xl));
	padding-inline: clamp(1rem, 4vw, var(--container-padding));
	font-family: var(--font-body);
}

.fp-section__inner {
	width: 100%;
	max-width: var(--container-width);
	margin-inline: auto;
}

.fp-section--navy {
	color: var(--color-dark-text);
	background: linear-gradient(
		104deg,
		color-mix(in srgb, var(--color-dark) 94%, var(--color-secondary) 6%) 0%,
		color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%) 42%,
		color-mix(in srgb, var(--color-dark) 82%, var(--color-bg-alt) 18%) 100%
	);
}

.fp-section--white {
	color: var(--color-text);
	background: var(--color-bg);
}

.fp-section--muted {
	color: var(--color-text);
	background: var(--color-bg-alt);
}

.fp-eyebrow {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-dark-text) 88%, var(--color-accent) 12%);
}

.fp-eyebrow--on-light {
	color: color-mix(in srgb, var(--color-accent) 85%, var(--color-text) 15%);
}

.fp-section__title {
	margin: 0 0 var(--space-md);
	font-family: var(--font-heading);
	font-size: clamp(1.65rem, 3.5vw, 2.35rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--color-text);
}

.fp-section__title--on-dark {
	color: var(--color-dark-text);
}

.fp-prose {
	font-family: var(--font-body);
	font-size: 1.0625rem;
	line-height: var(--line-height-base);
}

.fp-prose > p:first-child {
	margin-top: 0;
}

.fp-prose > p:last-child {
	margin-bottom: 0;
}

/* Buttons */
.fp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.65rem 1.35rem;
	font-family: var(--font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: var(--border-radius-lg);
	border: 1px solid transparent;
	transition:
		background 0.25s ease,
		color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.2s ease;
}

.fp-btn--primary {
	color: var(--color-bg);
	background: color-mix(in srgb, var(--color-accent) 92%, var(--color-dark) 8%);
	border-color: color-mix(in srgb, var(--color-accent) 80%, var(--color-dark-text) 20%);
	box-shadow: 0 2px 14px color-mix(in srgb, var(--color-dark) 25%, transparent);
}

.fp-btn--primary:hover,
.fp-btn--primary:focus-visible {
	color: var(--color-bg);
	background: color-mix(in srgb, var(--color-accent) 100%, var(--color-dark) 0%);
	transform: translateY(-1px);
	outline: none;
}

.fp-section--navy .fp-btn--ghost {
	color: var(--color-dark-text);
	border-color: color-mix(in srgb, var(--color-dark-text) 45%, transparent);
	background: color-mix(in srgb, var(--color-dark-text) 8%, transparent);
}

.fp-section--navy .fp-btn--ghost:hover,
.fp-section--navy .fp-btn--ghost:focus-visible {
	background: color-mix(in srgb, var(--color-dark-text) 16%, transparent);
	outline: none;
}

.fp-section--white .fp-btn--ghost,
.fp-section--muted .fp-btn--ghost {
	color: var(--color-text);
	border-color: color-mix(in srgb, var(--color-secondary) 35%, var(--color-text) 65%);
	background: transparent;
}

.fp-section--white .fp-btn--ghost:hover,
.fp-section--muted .fp-btn--ghost:hover,
.fp-section--white .fp-btn--ghost:focus-visible,
.fp-section--muted .fp-btn--ghost:focus-visible {
	background: color-mix(in srgb, var(--color-secondary) 8%, var(--color-bg) 92%);
	outline: none;
}

/* Hero */
.fp-hero {
	isolation: isolate;
	min-height: clamp(22rem, 72vh, 44rem);
	display: flex;
	align-items: flex-end;
	padding-block: clamp(var(--space-lg), 10vh, var(--space-xl));
	overflow: hidden;
}

.fp-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.fp-hero__bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.fp-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background-image: linear-gradient(
		115deg,
		color-mix(in srgb, var(--color-dark) 78%, transparent) 0%,
		color-mix(in srgb, var(--color-secondary) 52%, transparent) 55%,
		color-mix(in srgb, var(--color-dark) 70%, transparent) 100%
	);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.fp-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: radial-gradient(
		ellipse 90% 70% at 70% 10%,
		color-mix(in srgb, var(--color-accent) 18%, transparent) 0%,
		transparent 55%
	);
	opacity: 0.9;
}

.fp-hero__inner {
	position: relative;
	z-index: 2;
	max-width: min(42rem, 100%);
}

@media (prefers-reduced-motion: no-preference) {
	.fp-hero__inner {
		animation: fp-hero-in 0.85s ease-out both;
	}
}

@keyframes fp-hero-in {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.fp-hero__title {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: clamp(2rem, 5vw, 3.1rem);
	font-weight: 700;
	letter-spacing: -0.04em;
	line-height: 1.05;
	color: var(--color-dark-text);
	text-shadow: 0 2px 28px color-mix(in srgb, var(--color-dark) 45%, transparent);
}

.fp-hero__sub {
	margin-bottom: var(--space-md);
	color: color-mix(in srgb, var(--color-dark-text) 92%, var(--color-bg-alt) 8%);
}

.fp-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-sm);
	margin-bottom: var(--space-md);
}

.fp-hero__proof {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-xs) var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

.fp-hero__proof-item {
	position: relative;
	padding-left: 1.1rem;
	font-family: var(--font-heading);
	font-size: 0.9rem;
	font-weight: 600;
	color: color-mix(in srgb, var(--color-dark-text) 94%, var(--color-bg-alt) 6%);
}

.fp-hero__proof-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45em;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: color-mix(in srgb, var(--color-accent) 80%, var(--color-dark-text) 20%);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-dark-text) 25%, transparent);
}

/* What we do — featured + compact tiles */
.fp-services {
	display: grid;
	gap: clamp(1rem, 2.5vw, 1.75rem);
	margin-top: clamp(1.35rem, 4vw, 2.25rem);
}

@media (min-width: 960px) {
	.fp-services:not(.fp-services--solo) {
		grid-template-columns: minmax(0, 1.12fr) minmax(15.5rem, 0.4fr);
		grid-template-rows: repeat(3, minmax(0, auto));
		align-items: stretch;
	}

	.fp-services:not(.fp-services--solo) .fp-services__featured {
		grid-column: 1;
		grid-row: 1 / -1;
	}

	.fp-services:not(.fp-services--solo) .fp-services__secondary {
		grid-column: 2;
		grid-row: 1 / -1;
	}
}

.fp-services--solo {
	max-width: min(48rem, 100%);
	margin-inline: auto;
}

.fp-services__featured {
	display: grid;
	grid-template-columns: 1fr;
	overflow: hidden;
	border-radius: calc(var(--border-radius-lg) + 2px);
	background: var(--color-bg);
	border: 1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-bg) 80%, var(--color-secondary) 20%),
		0 24px 48px color-mix(in srgb, var(--color-dark) 8%, transparent);
	transition:
		box-shadow 0.35s ease,
		border-color 0.35s ease;
}

@media (min-width: 768px) {
	.fp-services__featured {
		grid-template-columns: 1fr 1fr;
		align-items: stretch;
		/* Keeps featured from dominating viewport; right column sets height via compact minis */
		min-height: clamp(13.5rem, 22vw, 18rem);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.fp-services__featured:hover {
		box-shadow:
			0 1px 0 color-mix(in srgb, var(--color-bg) 70%, var(--color-accent) 30%),
			0 28px 56px color-mix(in srgb, var(--color-dark) 11%, transparent);
		border-color: color-mix(in srgb, var(--color-accent) 22%, var(--color-secondary) 78%);
	}
}

.fp-services__featured-media {
	position: relative;
	overflow: hidden;
	background: linear-gradient(
		160deg,
		color-mix(in srgb, var(--color-dark) 12%, var(--color-bg-alt) 88%) 0%,
		color-mix(in srgb, var(--color-secondary) 18%, var(--color-bg-alt) 82%) 100%
	);
}

.fp-services__featured-aspect {
	position: relative;
	aspect-ratio: 5 / 4;
	width: 100%;
}

@media (min-width: 768px) {
	.fp-services__featured-aspect {
		position: absolute;
		inset: 0;
		aspect-ratio: unset;
		height: 100%;
		min-height: 13.5rem;
	}

	.fp-services__featured-media {
		min-height: 100%;
	}
}

.fp-services__featured-img,
.fp-services__featured-placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.fp-services__featured-placeholder {
	min-height: 12rem;
	background: linear-gradient(
		125deg,
		color-mix(in srgb, var(--color-secondary) 35%, var(--color-bg-alt) 65%),
		color-mix(in srgb, var(--color-dark) 25%, var(--color-bg-alt) 75%)
	);
}

.fp-services__featured-body {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--space-sm);
	padding: clamp(1.25rem, 3.5vw, 2rem);
}

.fp-services__featured-accent {
	position: absolute;
	left: 0;
	top: clamp(1.25rem, 3.5vw, 2rem);
	bottom: clamp(1.25rem, 3.5vw, 2rem);
	width: 3px;
	border-radius: 2px;
	background: linear-gradient(
		180deg,
		var(--color-accent) 0%,
		color-mix(in srgb, var(--color-accent) 45%, var(--color-secondary) 55%) 100%
	);
}

.fp-services__featured-title {
	margin: 0 0 0.15rem;
	padding-left: 0.85rem;
	font-family: var(--font-heading);
	font-size: clamp(1.35rem, 2.8vw, 1.85rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.12;
	color: var(--color-text);
}

.fp-services__featured-copy {
	padding-left: 0.85rem;
	margin: 0;
	font-size: clamp(0.98rem, 1.2vw, 1.05rem);
	line-height: 1.55;
	color: color-mix(in srgb, var(--color-text) 90%, var(--color-secondary) 10%);
}

.fp-services__featured-copy > p {
	margin: 0 0 0.5rem;
}

.fp-services__featured-copy > p:last-child {
	margin-bottom: 0;
}

.fp-services__featured-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.35rem;
	margin-left: 0.85rem;
	padding: 0.55rem 0;
	font-family: var(--font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-accent);
	border-bottom: 2px solid color-mix(in srgb, var(--color-accent) 70%, transparent);
	transition:
		color 0.2s ease,
		gap 0.25s ease,
		border-color 0.2s ease;
	align-self: flex-start;
}

.fp-services__featured-cta:hover,
.fp-services__featured-cta:focus-visible {
	color: color-mix(in srgb, var(--color-accent) 85%, var(--color-dark) 15%);
	border-color: var(--color-accent);
	gap: 0.65rem;
	outline: none;
}

.fp-services__cta-arrow {
	flex-shrink: 0;
	transition: transform 0.25s ease;
}

.fp-services__featured-cta:hover .fp-services__cta-arrow,
.fp-services__featured-cta:focus-visible .fp-services__cta-arrow {
	transform: translateX(3px);
}

@media (prefers-reduced-motion: reduce) {
	.fp-services__featured-cta:hover,
	.fp-services__featured-cta:focus-visible {
		gap: 0.4rem;
	}

	.fp-services__featured-cta:hover .fp-services__cta-arrow,
	.fp-services__featured-cta:focus-visible .fp-services__cta-arrow {
		transform: none;
	}
}

.fp-services__secondary {
	display: flex;
	flex-direction: column;
	gap: clamp(0.45rem, 1.2vw, 0.65rem);
}

/*
 * Compact services — same ~footprint as original thumb rows: short horizontal band.
 * Full-bleed image + scrim; text sits on the darker right (photo reads on the left).
 */
.fp-services__mini {
	--fp-mini-radius: var(--border-radius-lg);
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	min-height: 0;
	overflow: hidden;
	border-radius: var(--fp-mini-radius);
	border: 1px solid color-mix(in srgb, var(--color-secondary) 14%, transparent);
	box-shadow: var(--box-shadow);
	isolation: isolate;
	transition:
		transform 0.28s ease,
		box-shadow 0.28s ease,
		border-color 0.28s ease;
}

.fp-services__mini--no-media {
	border-color: color-mix(in srgb, var(--color-secondary) 14%, transparent);
	background: linear-gradient(
		125deg,
		color-mix(in srgb, var(--color-dark) 90%, var(--color-secondary) 10%) 0%,
		color-mix(in srgb, var(--color-secondary) 50%, var(--color-dark) 50%) 100%
	);
}

@media (prefers-reduced-motion: no-preference) {
	.fp-services__mini:hover {
		transform: translateY(-2px);
		box-shadow: var(--box-shadow-hover);
		border-color: color-mix(in srgb, var(--color-accent) 30%, var(--color-secondary) 70%);
	}

	.fp-services__mini--has-photo:hover .fp-services__mini-img {
		transform: scale(1.04);
	}
}

.fp-services__mini-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

.fp-services__mini-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform 0.65s ease;
	will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
	.fp-services__mini-img {
		transition: none;
	}

	.fp-services__mini--has-photo:hover .fp-services__mini-img {
		transform: none;
	}
}

.fp-services__mini-scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	/* Left: lighter so the photo reads; right: solid enough for type */
	background: linear-gradient(
		100deg,
		color-mix(in srgb, var(--color-dark) 22%, transparent) 0%,
		color-mix(in srgb, var(--color-dark) 18%, transparent) 32%,
		color-mix(in srgb, var(--color-dark) 78%, transparent) 58%,
		color-mix(in srgb, var(--color-dark) 90%, transparent) 100%
	);
}

.fp-services__mini--no-media .fp-services__mini-scrim {
	background: linear-gradient(
		90deg,
		transparent 0%,
		color-mix(in srgb, var(--color-dark) 35%, transparent) 100%
	);
	opacity: 0.75;
}

.fp-services__mini-content {
	position: relative;
	z-index: 2;
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.2rem;
	min-width: 0;
	padding: clamp(0.55rem, 1.4vw, 0.75rem) clamp(0.65rem, 1.8vw, 0.9rem);
	padding-left: 38%;
}

.fp-services__mini--no-media .fp-services__mini-content {
	padding-left: clamp(0.65rem, 1.8vw, 0.9rem);
}

.fp-services__mini-title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(0.9rem, 1.35vw, 0.98rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--color-dark-text);
	text-shadow: 0 1px 2px color-mix(in srgb, var(--color-dark) 60%, transparent);
}

.fp-services__mini--no-media .fp-services__mini-title {
	text-shadow: 0 1px 8px color-mix(in srgb, var(--color-dark) 45%, transparent);
}

.fp-services__mini-copy {
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.42;
	max-width: none;
	color: color-mix(in srgb, var(--color-dark-text) 90%, var(--color-bg-alt) 10%);
	text-shadow: 0 1px 2px color-mix(in srgb, var(--color-dark) 55%, transparent);
}

.fp-services__mini-link {
	margin-top: 0.1rem;
	align-self: flex-start;
	font-family: var(--font-heading);
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-dark-text);
	padding: 0.28rem 0.5rem;
	border-radius: calc(var(--border-radius) - 1px);
	background: color-mix(in srgb, var(--color-accent) 90%, var(--color-dark) 10%);
	border: 1px solid color-mix(in srgb, var(--color-accent) 45%, transparent);
	box-shadow: 0 1px 6px color-mix(in srgb, var(--color-dark) 22%, transparent);
	transition:
		background 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.fp-services__mini-link:hover,
.fp-services__mini-link:focus-visible {
	background: var(--color-accent);
	color: var(--color-bg);
	box-shadow: 0 4px 18px color-mix(in srgb, var(--color-accent) 35%, transparent);
	transform: translateY(-1px);
	outline: none;
}

.fp-services__mini-link:focus-visible {
	outline: 2px solid var(--color-dark-text);
	outline-offset: 3px;
}

/* Legacy card grid (unused on homepage; kept for other templates) */
.fp-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr));
	gap: var(--space-md);
	margin: var(--space-md) 0 0;
	padding: 0;
	list-style: none;
}

.fp-card {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
	padding: var(--space-md);
	border-radius: var(--border-radius-lg);
	background: color-mix(in srgb, var(--color-bg-alt) 55%, var(--color-bg) 45%);
	border: 1px solid color-mix(in srgb, var(--color-secondary) 10%, transparent);
	box-shadow: var(--box-shadow);
	transition:
		transform 0.3s ease,
		box-shadow 0.3s ease;
}

.fp-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--box-shadow-hover);
}

.fp-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: var(--border-radius);
	background: var(--color-bg);
	border: 1px solid color-mix(in srgb, var(--color-secondary) 12%, transparent);
}

.fp-card__img {
	display: block;
	max-width: 100%;
	max-height: 2.5rem;
	width: auto;
	height: auto;
	object-fit: contain;
}

.fp-card__title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--color-text);
}

.fp-card__copy {
	flex: 1 1 auto;
	color: color-mix(in srgb, var(--color-text) 92%, var(--color-secondary) 8%);
	font-size: 0.9375rem;
}

.fp-card__link {
	margin-top: auto;
	align-self: flex-start;
	font-family: var(--font-heading);
	font-size: 0.875rem;
	font-weight: 700;
	text-decoration: none;
	color: color-mix(in srgb, var(--color-secondary) 70%, var(--color-accent) 30%);
	border-bottom: 2px solid color-mix(in srgb, var(--color-accent) 55%, transparent);
	padding-bottom: 0.1rem;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.fp-card__link:hover,
.fp-card__link:focus-visible {
	color: var(--color-accent);
	border-color: var(--color-accent);
	outline: none;
}

/* How we work — vertical spine + zigzag on large screens */
.fp-steps {
	position: relative;
	margin: clamp(1.25rem, 4vw, 2rem) 0 0;
	padding: 0 0 0.5rem;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* Mobile / tablet: rail through centre of axis column */
.fp-steps::before {
	content: "";
	position: absolute;
	left: calc(2.35rem / 2);
	transform: translateX(-50%);
	top: 0.35rem;
	bottom: 0.35rem;
	width: 2px;
	border-radius: 2px;
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--color-accent) 55%, var(--color-secondary) 45%) 0%,
		color-mix(in srgb, var(--color-secondary) 45%, var(--color-text) 55%) 45%,
		color-mix(in srgb, var(--color-secondary) 55%, var(--color-text) 45%) 100%
	);
	opacity: 0.55;
	pointer-events: none;
	z-index: 0;
}

.fp-step {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 2.35rem minmax(0, 1fr);
	grid-template-areas: "axis panel";
	align-items: start;
	column-gap: clamp(0.65rem, 2vw, 1rem);
	row-gap: 0;
	padding: clamp(0.85rem, 2.5vw, 1.35rem) 0;
}

.fp-step__filler {
	display: none;
}

.fp-step__axis {
	grid-area: axis;
	position: relative;
	display: flex;
	justify-content: center;
	padding-top: 0.35rem;
}

.fp-step__dot {
	display: block;
	width: 0.65rem;
	height: 0.65rem;
	border-radius: 50%;
	background: var(--color-bg);
	border: 2px solid var(--color-accent);
	box-shadow:
		0 0 0 3px color-mix(in srgb, var(--color-bg-alt) 90%, var(--color-bg) 10%),
		0 4px 14px color-mix(in srgb, var(--color-dark) 12%, transparent);
}

.fp-step__panel {
	grid-area: panel;
	max-width: 38rem;
	padding: clamp(0.65rem, 2vw, 1rem) clamp(0.85rem, 2.5vw, 1.25rem);
	border-radius: var(--border-radius-lg);
	background: color-mix(in srgb, var(--color-bg) 92%, var(--color-bg-alt) 8%);
	border: 1px solid color-mix(in srgb, var(--color-text) 7%, transparent);
	box-shadow: 0 10px 28px color-mix(in srgb, var(--color-text) 5%, transparent);
	text-align: left;
}

.fp-step__kicker {
	margin: 0 0 0.35rem;
	font-family: var(--font-heading);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-accent) 75%, var(--color-text) 25%);
}

.fp-step__title {
	margin: 0 0 var(--space-xs);
	font-family: var(--font-heading);
	font-size: clamp(1.08rem, 2.2vw, 1.35rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--color-text);
}

.fp-step__copy {
	margin: 0;
	color: color-mix(in srgb, var(--color-text) 93%, var(--color-secondary) 7%);
	font-size: 0.9375rem;
	line-height: 1.55;
}

@media (min-width: 960px) {
	.fp-steps {
		padding-left: 0;
		padding-right: 0;
	}

	.fp-steps::before {
		left: 50%;
		transform: translateX(-50%);
		top: 0.5rem;
		bottom: 0.5rem;
		opacity: 0.65;
	}

	.fp-step {
		grid-template-columns: minmax(0, 1fr) minmax(3rem, 4.25rem) minmax(0, 1fr);
		grid-template-areas: "panel-l axis panel-r";
		column-gap: clamp(0.75rem, 2.5vw, 1.75rem);
		align-items: start;
		padding: clamp(1rem, 2.5vw, 1.5rem) 0;
	}

	.fp-step__axis {
		grid-area: axis;
		padding-top: 0.5rem;
	}

	.fp-step__filler {
		display: block;
		grid-area: panel-l;
		min-height: 1px;
	}

	.fp-step__panel {
		grid-area: panel-r;
		max-width: none;
	}

	/* Odd: copy left of spine */
	.fp-step:nth-child(odd) .fp-step__filler {
		grid-area: panel-r;
	}

	.fp-step:nth-child(odd) .fp-step__panel {
		grid-area: panel-l;
		justify-self: end;
		text-align: right;
		max-width: min(100%, 30rem);
	}

	.fp-step:nth-child(odd) .fp-step__copy {
		text-align: right;
	}

	.fp-step:nth-child(odd) .fp-step__copy > p {
		text-align: right;
	}

	/* Even: copy right of spine */
	.fp-step:nth-child(even) .fp-step__filler {
		grid-area: panel-l;
	}

	.fp-step:nth-child(even) .fp-step__panel {
		grid-area: panel-r;
		justify-self: start;
		text-align: left;
		max-width: min(100%, 30rem);
	}

	.fp-step__dot {
		width: 0.75rem;
		height: 0.75rem;
		border-width: 2px;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.fp-step {
		opacity: 0;
		animation: fp-step-reveal 0.65s cubic-bezier(0.22, 1, 0.36, 1) forwards;
	}

	.fp-step:nth-child(1) {
		animation-delay: 0.05s;
	}
	.fp-step:nth-child(2) {
		animation-delay: 0.14s;
	}
	.fp-step:nth-child(3) {
		animation-delay: 0.23s;
	}
	.fp-step:nth-child(4) {
		animation-delay: 0.32s;
	}
	.fp-step:nth-child(5) {
		animation-delay: 0.41s;
	}
	.fp-step:nth-child(6) {
		animation-delay: 0.5s;
	}
	.fp-step:nth-child(7) {
		animation-delay: 0.59s;
	}
	.fp-step:nth-child(8) {
		animation-delay: 0.68s;
	}

	@media (min-width: 960px) {
		.fp-step:nth-child(odd) {
			animation-name: fp-step-reveal-left;
		}

		.fp-step:nth-child(even) {
			animation-name: fp-step-reveal-right;
		}
	}
}

@keyframes fp-step-reveal {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fp-step-reveal-left {
	from {
		opacity: 0;
		transform: translateX(-1.25rem);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fp-step-reveal-right {
	from {
		opacity: 0;
		transform: translateX(1.25rem);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.fp-step {
		opacity: 1;
		animation: none;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.fp-step__panel {
		transition:
			border-color 0.3s ease,
			box-shadow 0.35s ease,
			transform 0.35s ease;
	}

	.fp-step__panel:hover {
		border-color: color-mix(in srgb, var(--color-accent) 35%, var(--color-text) 65%);
		box-shadow: 0 14px 36px color-mix(in srgb, var(--color-text) 8%, transparent);
		transform: translateY(-2px);
	}
}

/* Why us — image tiles, headline always on, body on hover / tap */
.fp-why-grid {
	--fp-why-reveal-duration: 0.38s;
	--fp-why-reveal-ease: cubic-bezier(0.25, 0.85, 0.3, 1);
	--fp-why-copy-max: min(13rem, 48vh);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr));
	gap: clamp(0.85rem, 2.2vw, 1.35rem);
	margin: clamp(1.25rem, 3.5vw, 2rem) 0 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 600px) and (max-width: 1180px) {
	.fp-why-grid {
		--fp-why-copy-max: min(15rem, 55vh);
	}
}

.fp-why-grid__cell {
	position: relative;
	min-width: 0;
}

.fp-why-card {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: calc(var(--border-radius-lg) + 4px);
	border: 1px solid color-mix(in srgb, var(--color-dark-text) 16%, transparent);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-dark-text) 10%, transparent),
		0 20px 44px color-mix(in srgb, var(--color-dark) 22%, transparent);
	aspect-ratio: 4 / 3;
	isolation: isolate;
	outline: none;
	transition:
		border-color var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		box-shadow var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		transform var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

/*
 * Desktop: fixed tile size — reveal is in-place (opacity/transform + clip) to avoid layout thrash.
 * html.fp-why-use-toggle: tablets/phones — only .is-expanded (JS); no :focus-within on copy.
 */
html:not(.fp-why-use-toggle) .fp-why-card:hover,
html:not(.fp-why-use-toggle) .fp-why-card:focus-within {
	border-color: color-mix(in srgb, var(--color-accent) 38%, var(--color-dark-text) 62%);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-accent) 18%, transparent),
		0 26px 56px color-mix(in srgb, var(--color-dark) 30%, transparent);
	transform: translateY(-2px);
}

html:not(.fp-why-use-toggle) .fp-why-card:focus-within {
	box-shadow:
		0 0 0 2px color-mix(in srgb, var(--color-accent) 55%, transparent),
		0 24px 52px color-mix(in srgb, var(--color-dark) 28%, transparent);
}

html.fp-why-use-toggle .fp-why-card.is-expanded {
	border-color: color-mix(in srgb, var(--color-accent) 38%, var(--color-dark-text) 62%);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-accent) 18%, transparent),
		0 26px 56px color-mix(in srgb, var(--color-dark) 30%, transparent);
	transform: translateY(-2px);
}

.fp-why-card__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.fp-why-card__img,
.fp-why-card__placeholder {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.fp-why-card__placeholder {
	background: linear-gradient(
		135deg,
		color-mix(in srgb, var(--color-secondary) 55%, var(--color-dark) 45%) 0%,
		color-mix(in srgb, var(--color-dark) 70%, var(--color-accent) 30%) 100%
	);
}

.fp-why-card__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	transition: opacity var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

.fp-why-card__scrim--base {
	background: linear-gradient(
		185deg,
		color-mix(in srgb, var(--color-dark) 12%, transparent) 0%,
		transparent 28%,
		color-mix(in srgb, var(--color-dark) 52%, transparent) 68%,
		color-mix(in srgb, var(--color-dark) 92%, transparent) 100%
	);
}

.fp-why-card__scrim--peak {
	opacity: 0;
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--color-dark) 35%, transparent) 0%,
		color-mix(in srgb, var(--color-dark) 82%, transparent) 55%,
		color-mix(in srgb, var(--color-dark) 94%, transparent) 100%
	);
}

@media (hover: hover) {
	html:not(.fp-why-use-toggle) .fp-why-card:hover .fp-why-card__scrim--peak,
	html:not(.fp-why-use-toggle) .fp-why-card:focus-within .fp-why-card__scrim--peak {
		opacity: 1;
	}
}

html.fp-why-use-toggle .fp-why-card.is-expanded .fp-why-card__scrim--peak {
	opacity: 1;
}

.fp-why-card__content {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	height: 100%;
	min-height: 100%;
	padding: clamp(1rem, 3vw, 1.35rem);
	padding-top: 35%;
}

.fp-why-card__head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.45rem;
	margin-bottom: 0.25rem;
}

.fp-why-card__accent {
	display: block;
	width: 2.25rem;
	height: 3px;
	border-radius: 2px;
	flex-shrink: 0;
	background: linear-gradient(
		90deg,
		var(--color-accent) 0%,
		color-mix(in srgb, var(--color-accent) 40%, transparent) 100%
	);
	pointer-events: none;
}

.fp-why-card__title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(1.05rem, 2.4vw, 1.28rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.12;
	color: var(--color-dark-text);
	text-shadow:
		0 1px 3px color-mix(in srgb, var(--color-dark) 70%, transparent),
		0 12px 28px color-mix(in srgb, var(--color-dark) 45%, transparent);
}

.fp-why-card__cue {
	margin: 0 0 0.35rem;
	max-height: 3rem;
	overflow: hidden;
	font-family: var(--font-heading);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-dark-text) 72%, var(--color-accent) 28%);
	opacity: 0.9;
	transition:
		opacity var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		transform var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		max-height var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		margin-bottom var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

/* Cues: media query guesses before paint; html.fp-why-use-toggle syncs with front-page.js */
.fp-why-card__cue--touch {
	display: none;
}

.fp-why-card__cue--hover {
	display: block;
}

@media (hover: none), (any-pointer: coarse) {
	.fp-why-card__cue--hover {
		display: none;
	}

	.fp-why-card__cue--touch {
		display: block;
	}
}

html.fp-why-use-toggle .fp-why-card__cue--hover {
	display: none !important;
}

html.fp-why-use-toggle .fp-why-card__cue--touch {
	display: block !important;
}

/* After JS: desktop path only — avoids killing touch cue before html class exists */
@media (hover: hover) and (pointer: fine) {
	html:not(.fp-why-use-toggle) .fp-why-card__cue--touch {
		display: none !important;
	}

	html:not(.fp-why-use-toggle) .fp-why-card__cue--hover {
		display: block !important;
	}
}

/*
 * Copy reveal: clip with max-height (one layout tween) + opacity/transform on the text (GPU-friendly).
 * Tile stays fixed 4:3 — no aspect-ratio snap.
 */
.fp-why-card__copy-shell {
	max-height: 0;
	overflow: hidden;
	transition: max-height var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

html:not(.fp-why-use-toggle) .fp-why-card:hover .fp-why-card__copy-shell,
html:not(.fp-why-use-toggle) .fp-why-card:focus-within .fp-why-card__copy-shell {
	max-height: var(--fp-why-copy-max);
}

html.fp-why-use-toggle .fp-why-card.is-expanded .fp-why-card__copy-shell {
	max-height: var(--fp-why-copy-max);
}

.fp-why-card__copy {
	margin: 0;
	min-height: 0;
	max-height: var(--fp-why-copy-max);
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	opacity: 0;
	transform: translateY(0.35rem);
	pointer-events: none;
	font-size: 0.875rem;
	line-height: 1.55;
	color: color-mix(in srgb, var(--color-dark-text) 94%, var(--color-bg-alt) 6%);
	text-shadow: 0 1px 4px color-mix(in srgb, var(--color-dark) 55%, transparent);
	transition:
		opacity var(--fp-why-reveal-duration) var(--fp-why-reveal-ease),
		transform var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

html:not(.fp-why-use-toggle) .fp-why-card:hover .fp-why-card__copy,
html:not(.fp-why-use-toggle) .fp-why-card:focus-within .fp-why-card__copy {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

html.fp-why-use-toggle .fp-why-card.is-expanded .fp-why-card__copy {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.fp-why-card__copy > p {
	margin: 0 0 0.4rem;
}

.fp-why-card__copy > p:last-child {
	margin-bottom: 0;
}

@media (hover: hover) {
	html:not(.fp-why-use-toggle) .fp-why-card:hover .fp-why-card__cue--hover,
	html:not(.fp-why-use-toggle) .fp-why-card:focus-within .fp-why-card__cue--hover {
		opacity: 0;
		transform: translateY(-0.2rem);
		max-height: 0;
		margin-top: 0;
		margin-bottom: 0;
	}
}

html.fp-why-use-toggle .fp-why-card.is-expanded .fp-why-card__cue--touch {
	opacity: 0;
	transform: translateY(-0.2rem);
	max-height: 0;
	margin-top: 0;
	margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.fp-why-card,
	.fp-why-card__img,
	.fp-why-card__scrim,
	.fp-why-card__copy,
	.fp-why-card__copy-shell,
	.fp-why-card__cue {
		transition: none;
	}

	.fp-why-card:hover,
	.fp-why-card:focus-within,
	html.fp-why-use-toggle .fp-why-card.is-expanded {
		transform: none;
	}
}

.fp-why-card__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	margin-top: 0.35rem;
	padding: 0.4rem 0.65rem;
	width: fit-content;
	max-width: 100%;
	font-family: var(--font-heading);
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-dark-text);
	background: color-mix(in srgb, var(--color-accent) 88%, var(--color-dark) 12%);
	border: 1px solid color-mix(in srgb, var(--color-accent) 50%, transparent);
	border-radius: var(--border-radius);
	cursor: pointer;
	box-shadow: 0 2px 12px color-mix(in srgb, var(--color-dark) 25%, transparent);
	transition:
		background 0.2s ease,
		color 0.2s ease,
		border-color 0.2s ease;
}

.fp-why-card__toggle:hover,
.fp-why-card__toggle:focus-visible {
	background: var(--color-accent);
	color: var(--color-bg);
	outline: none;
}

.fp-why-card__toggle:focus-visible {
	box-shadow: 0 0 0 2px var(--color-dark-text);
}

.fp-why-card__toggle-icon {
	display: flex;
	transition: transform var(--fp-why-reveal-duration) var(--fp-why-reveal-ease);
}

.fp-why-card.is-expanded .fp-why-card__toggle-icon {
	transform: rotate(180deg);
}

@media (hover: hover) and (pointer: fine) {
	html:not(.fp-why-use-toggle) .fp-why-card__toggle {
		display: none;
	}
}

html.fp-why-use-toggle .fp-why-card__toggle {
	display: inline-flex !important;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
}

/* Clients & technologies — logo carousel */
.fp-client-logos__sub {
	margin: -0.25rem 0 var(--space-md);
	max-width: min(42rem, 100%);
	font-size: clamp(0.95rem, 1.6vw, 1.05rem);
	line-height: 1.55;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-text-light) 12%);
}

.fp-logo-carousel {
	position: relative;
	margin-top: var(--space-sm);
	--fp-logo-marquee-duration: 48s;
	/* Prominent strip — larger than default UI icons, still below hero scale */
	--fp-logo-max-w: min(13.5rem, 42vw);
	--fp-logo-max-h: clamp(3.35rem, 8.25vw, 4.75rem);
}

.fp-logo-carousel__marquee {
	position: relative;
}

.fp-logo-carousel__still {
	display: none;
}

.fp-logo-carousel__grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: clamp(1.75rem, 4.5vw, 3rem);
}

.fp-logo-carousel__fade {
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 2;
	width: clamp(2.75rem, 7.5vw, 4.75rem);
	pointer-events: none;
}

.fp-logo-carousel__fade--left {
	left: 0;
	background: linear-gradient(
		90deg,
		var(--color-bg) 0%,
		color-mix(in srgb, var(--color-bg) 35%, transparent) 55%,
		transparent 100%
	);
}

.fp-logo-carousel__fade--right {
	right: 0;
	background: linear-gradient(
		270deg,
		var(--color-bg) 0%,
		color-mix(in srgb, var(--color-bg) 35%, transparent) 55%,
		transparent 100%
	);
}

.fp-logo-carousel__viewport {
	overflow: hidden;
	width: 100%;
}

.fp-logo-carousel__track {
	display: flex;
	width: max-content;
	align-items: center;
	gap: clamp(2.35rem, 5.75vw, 4.25rem);
	animation: fp-logo-marquee var(--fp-logo-marquee-duration) linear infinite;
}

.fp-logo-carousel:hover .fp-logo-carousel__track,
.fp-logo-carousel:focus-within .fp-logo-carousel__track {
	animation-play-state: paused;
}

@keyframes fp-logo-marquee {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-50%);
	}
}

.fp-logo-carousel__cell {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--fp-logo-max-h);
}

.fp-logo-carousel__link,
.fp-logo-carousel__nolink {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: var(--fp-logo-max-w);
}

.fp-logo-carousel__link {
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.fp-logo-carousel__link:hover,
.fp-logo-carousel__link:focus-visible {
	opacity: 0.85;
	outline: none;
}

.fp-logo-carousel__link:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent) 70%, transparent);
	border-radius: 4px;
}

.fp-logo-carousel__img {
	display: block;
	width: auto;
	height: auto;
	max-width: var(--fp-logo-max-w);
	max-height: var(--fp-logo-max-h);
	object-fit: contain;
	object-position: center;
}

@media (prefers-reduced-motion: reduce) {
	.fp-logo-carousel__marquee {
		display: none;
	}

	.fp-logo-carousel__still {
		display: block;
	}

	.fp-logo-carousel__track {
		animation: none;
	}
}

/* Home CTA — premium band: bold layered bg, grid, glass panel (image optional) */
.fp-section--cta.fp-section {
	padding-block: clamp(var(--space-xl), 10vw, 5.5rem);
}

.fp-home-cta {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

/* No photo: replace flat navy with depth, colour, and motion */
.fp-home-cta.fp-section--navy:not(.fp-home-cta--has-image) {
	background-color: color-mix(in srgb, var(--color-dark) 92%, #050810 8%);
	background-image:
		radial-gradient(ellipse 110% 90% at 50% -35%, color-mix(in srgb, var(--color-accent) 55%, transparent) 0%, transparent 52%),
		radial-gradient(ellipse 70% 55% at 105% 75%, color-mix(in srgb, var(--color-secondary) 40%, transparent) 0%, transparent 55%),
		radial-gradient(ellipse 65% 50% at -5% 90%, color-mix(in srgb, var(--color-accent) 28%, transparent) 0%, transparent 48%),
		linear-gradient(
			168deg,
			color-mix(in srgb, var(--color-dark) 94%, var(--color-secondary) 6%) 0%,
			color-mix(in srgb, var(--color-dark) 78%, #121a2e 22%) 48%,
			color-mix(in srgb, var(--color-dark) 96%, #02040a 4%) 100%
		);
	background-size: 100% 100%;
}

/* Photo background */
.fp-home-cta.fp-home-cta--has-image.fp-section--navy {
	background: color-mix(in srgb, var(--color-dark) 92%, var(--color-secondary) 8%);
}

.fp-home-cta__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.fp-home-cta__img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
	object-position: center;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-home-cta__media {
		transform: scale(1.04);
		transform-origin: center center;
		animation: fp-home-cta-kenburns 26s ease-in-out infinite alternate;
	}
}

@keyframes fp-home-cta-kenburns {
	from {
		transform: scale(1.04) translate(0, 0);
	}

	to {
		transform: scale(1.1) translate(0.4%, -0.4%);
	}
}

.fp-home-cta__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		185deg,
		color-mix(in srgb, var(--color-dark) 35%, transparent) 0%,
		color-mix(in srgb, var(--color-dark) 72%, transparent) 50%,
		color-mix(in srgb, var(--color-dark) 88%, transparent) 100%
	);
}

.fp-home-cta:not(.fp-home-cta--has-image) .fp-home-cta__scrim {
	background: linear-gradient(
		180deg,
		transparent 0%,
		color-mix(in srgb, var(--color-dark) 28%, transparent) 100%
	);
	opacity: 0.55;
}

.fp-home-cta--has-image .fp-home-cta__scrim {
	opacity: 1;
}

.fp-home-cta__ambience {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	overflow: hidden;
}

.fp-home-cta__ambience::before,
.fp-home-cta__ambience::after {
	content: '';
	position: absolute;
	inset: -25%;
	border-radius: 50%;
	filter: blur(56px);
	opacity: 0.72;
}

.fp-home-cta__ambience::before {
	background: radial-gradient(
		circle at 28% 32%,
		color-mix(in srgb, var(--color-accent) 70%, transparent) 0%,
		transparent 58%
	);
	animation: fp-home-cta-ambience-a 16s ease-in-out infinite alternate;
}

.fp-home-cta__ambience::after {
	background: radial-gradient(
		circle at 72% 68%,
		color-mix(in srgb, var(--color-secondary) 55%, transparent) 0%,
		transparent 52%
	);
	animation: fp-home-cta-ambience-b 20s ease-in-out infinite alternate;
	mix-blend-mode: screen;
	opacity: 0.55;
}

@keyframes fp-home-cta-ambience-a {
	from {
		transform: translate(-12%, -8%) scale(1);
	}

	to {
		transform: translate(14%, 12%) scale(1.18);
	}
}

@keyframes fp-home-cta-ambience-b {
	from {
		transform: translate(10%, 8%) scale(1.05);
	}

	to {
		transform: translate(-16%, -10%) scale(1.15);
	}
}

.fp-home-cta__gridlines {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	opacity: 0.35;
	background-image:
		linear-gradient(to right, color-mix(in srgb, var(--color-dark-text) 14%, transparent) 1px, transparent 1px),
		linear-gradient(to bottom, color-mix(in srgb, var(--color-dark-text) 14%, transparent) 1px, transparent 1px);
	background-size: min(3.5rem, 8vw) min(3.5rem, 8vw);
	mask-image: linear-gradient(180deg, black 0%, transparent 92%);
}

.fp-home-cta__spotlight {
	position: absolute;
	inset: 0;
	z-index: 4;
	pointer-events: none;
	background: radial-gradient(
		ellipse 85% 65% at 50% 35%,
		color-mix(in srgb, var(--color-dark-text) 18%, transparent) 0%,
		transparent 68%
	);
	mix-blend-mode: overlay;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-home-cta__spotlight {
		animation: fp-home-cta-spotlight 18s ease-in-out infinite alternate;
	}
}

@keyframes fp-home-cta-spotlight {
	from {
		opacity: 0.85;
		transform: scale(1);
	}

	to {
		opacity: 1;
		transform: scale(1.06);
	}
}

.fp-home-cta__noise {
	position: absolute;
	inset: 0;
	z-index: 5;
	pointer-events: none;
	opacity: 0.07;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
	.fp-home-cta__media {
		transform: none;
		animation: none;
	}

	.fp-home-cta__ambience::before,
	.fp-home-cta__ambience::after {
		animation: none;
		opacity: 0.45;
	}

	.fp-home-cta__spotlight {
		animation: none;
	}
}

.fp-home-cta .fp-section__inner {
	position: relative;
	z-index: 6;
}

.fp-home-cta__inner {
	max-width: min(46rem, 100%);
	margin-inline: auto;
	padding-inline: 0;
}

.fp-home-cta__panel {
	padding: clamp(2rem, 5.5vw, 3.5rem) clamp(1.5rem, 4vw, 2.75rem);
	border-radius: calc(var(--border-radius-lg) + 6px);
	text-align: center;
	background: color-mix(in srgb, var(--color-dark) 32%, transparent);
	border: 1px solid color-mix(in srgb, var(--color-dark-text) 18%, transparent);
	box-shadow:
		inset 0 1px 0 color-mix(in srgb, var(--color-dark-text) 12%, transparent),
		0 0 0 1px color-mix(in srgb, var(--color-accent) 22%, transparent),
		0 28px 80px color-mix(in srgb, #000 45%, transparent),
		0 0 120px color-mix(in srgb, var(--color-accent) 12%, transparent);
	backdrop-filter: blur(18px) saturate(160%);
	-webkit-backdrop-filter: blur(18px) saturate(160%);
}

.fp-home-cta__title {
	margin: 0 auto var(--space-sm);
	max-width: min(100%, 36ch);
	margin-left: auto;
	margin-right: auto;
	font-family: var(--font-heading);
	font-size: clamp(1.85rem, 4.2vw, 2.75rem);
	font-weight: 700;
	letter-spacing: -0.035em;
	line-height: 1.12;
	color: var(--color-dark-text);
	text-shadow:
		0 2px 32px color-mix(in srgb, var(--color-dark) 75%, transparent),
		0 0 60px color-mix(in srgb, var(--color-accent) 18%, transparent);
}

.fp-home-cta__title::after {
	content: '';
	display: block;
	width: 4rem;
	height: 3px;
	margin: var(--space-md) auto 0;
	border-radius: 2px;
	background: linear-gradient(
		90deg,
		transparent,
		var(--color-accent),
		color-mix(in srgb, var(--color-accent) 40%, transparent)
	);
}

.fp-home-cta__copy {
	margin: var(--space-md) auto var(--space-md);
	max-width: 38ch;
	font-size: clamp(1rem, 2.1vw, 1.125rem);
	line-height: 1.65;
	color: color-mix(in srgb, var(--color-dark-text) 96%, var(--color-bg-alt) 4%);
	text-shadow: 0 1px 20px color-mix(in srgb, var(--color-dark) 70%, transparent);
}

.fp-home-cta__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--space-sm);
	margin-top: var(--space-sm);
}

.fp-home-cta .fp-home-cta__btn.fp-btn--primary {
	box-shadow:
		0 4px 24px color-mix(in srgb, var(--color-accent) 45%, transparent),
		inset 0 1px 0 color-mix(in srgb, var(--color-dark-text) 15%, transparent);
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.fp-home-cta .fp-home-cta__btn.fp-btn--primary:hover,
.fp-home-cta .fp-home-cta__btn.fp-btn--primary:focus-visible {
	transform: translateY(-2px);
	box-shadow:
		0 8px 32px color-mix(in srgb, var(--color-accent) 55%, transparent),
		inset 0 1px 0 color-mix(in srgb, var(--color-dark-text) 18%, transparent);
}

.fp-home-cta .fp-home-cta__btn.fp-btn--ghost {
	border-width: 2px;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition:
		transform 0.2s ease,
		background 0.2s ease;
}

.fp-home-cta .fp-home-cta__btn.fp-btn--ghost:hover,
.fp-home-cta .fp-home-cta__btn.fp-btn--ghost:focus-visible {
	transform: translateY(-2px);
	background: color-mix(in srgb, var(--color-dark-text) 10%, transparent);
}

/* ==========================================================================
   Global footer — light neutral, distinct from dark CTA above
   ========================================================================== */

.site-footer {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0;
	color: var(--color-text);
	background: color-mix(in srgb, var(--color-bg-alt) 88%, var(--color-bg) 12%);
	border-top: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent);
}

.site-footer__inner {
	width: 100%;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, var(--container-padding));
}

.site-footer__grid {
	display: grid;
	gap: clamp(2rem, 4vw, 2.75rem);
	grid-template-columns: minmax(14rem, 1.35fr) repeat(auto-fit, minmax(11.5rem, 1fr));
	align-items: start;
}

@media (max-width: 719px) {
	.site-footer__grid {
		grid-template-columns: 1fr;
	}
}

.site-footer__brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--space-sm);
	max-width: 22rem;
}

.site-footer__logo {
	display: inline-block;
	line-height: 0;
	text-decoration: none;
}

.site-footer__logo-img {
	display: block;
	width: auto;
	height: auto;
	max-width: min(12rem, 72vw);
	max-height: 3.25rem;
	object-fit: contain;
	object-position: left center;
}

.site-footer__site-title {
	font-family: var(--font-heading);
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--color-text);
	text-decoration: none;
}

.site-footer__site-title:hover,
.site-footer__site-title:focus-visible {
	color: var(--color-accent);
}

.site-footer__tagline {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: color-mix(in srgb, var(--color-text) 82%, var(--color-text-light) 18%);
}

.site-footer__social-block {
	margin-top: var(--space-sm);
}

.site-footer__social-heading {
	margin: 0 0 0.5rem;
	font-family: var(--font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-text) 92%, var(--color-accent) 8%);
}

.site-footer__social-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-footer__social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	font-size: 1.15rem;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-secondary) 12%);
	background: color-mix(in srgb, var(--color-bg) 70%, transparent);
	border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
	border-radius: var(--border-radius);
	text-decoration: none;
	transition:
		color 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease;
}

.site-footer__social-link:hover,
.site-footer__social-link:focus-visible {
	color: var(--color-accent);
	background: color-mix(in srgb, var(--color-accent) 10%, var(--color-bg) 90%);
	border-color: color-mix(in srgb, var(--color-accent) 35%, transparent);
	transform: translateY(-2px);
	outline: none;
}

.site-footer__social-fallback {
	font-size: 1rem;
	line-height: 1;
	opacity: 0.75;
}

.site-footer__col {
	min-width: 0;
}

.site-footer__col-title {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: 1.0625rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--color-text);
}

.site-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}

.site-footer__link {
	display: inline-flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.9375rem;
	line-height: 1.45;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-text-light) 12%);
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-footer__link:hover,
.site-footer__link:focus-visible {
	color: var(--color-accent);
	outline: none;
}

.site-footer__link-icon {
	flex-shrink: 0;
	margin-top: 0.15em;
	font-size: 0.95em;
	color: color-mix(in srgb, var(--color-secondary) 75%, var(--color-text) 25%);
}

.site-footer__link-text {
	flex: 1;
	min-width: 0;
}

.site-footer__bar {
	margin-top: clamp(2rem, 4vw, 2.75rem);
	padding-top: clamp(1.25rem, 3vw, 1.5rem);
	border-top: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
	text-align: center;
}

.site-footer__copy {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: color-mix(in srgb, var(--color-text-light) 92%, var(--color-text) 8%);
}

.site-footer__copy-sep {
	margin: 0 0.35rem;
	opacity: 0.65;
}

.site-footer__credit {
	margin: 0.65rem 0 0;
	font-size: 0.78rem;
	line-height: 1.5;
	color: color-mix(in srgb, var(--color-text-light) 92%, var(--color-text) 8%);
}

.site-footer__credit-link {
	color: inherit;
	text-decoration: none;
	/*text-decoration-color: color-mix(in srgb, var(--color-text) 25%, transparent);*/
	/*text-underline-offset: 0.15em;*/
}

.site-footer__credit-link:hover,
.site-footer__credit-link:focus-visible {
	color: var(--color-text);
}

/* ==========================================================================
   About page (page-about.php)
   ========================================================================== */

.site-main--about {
	margin: 0;
	padding: 0;
}

/* Intro below slim banner (optional Theme Admin copy) */
.about-page__hero-lead {
	padding-block: clamp(var(--space-md), 4vw, var(--space-xl));
}

.about-page__hero-lead-inner {
	max-width: min(42rem, 100%);
	margin-inline: auto;
	color: var(--color-text);
}

.about-page__story-inner {
	display: grid;
	gap: var(--space-5);
	align-items: start;
}

.about-page__story-media,
.about-page__story-content {
	min-width: 0;
}

@media (min-width: 768px) {
	/* Asymmetrical split: narrower image, wider story column */
	.about-page__story-inner {
		grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
		gap: clamp(1.75rem, 4vw, 3rem);
		align-items: center;
		max-width: min(76rem, 100%);
		margin-inline: auto;
	}

	.about-page__story-content {
		justify-self: stretch;
		width: 100%;
		max-width: none;
		padding-left: clamp(0, 2vw, 0.75rem);
	}
}

.about-page__story-media {
	position: relative;
	overflow: hidden;
	border-radius: var(--border-radius-lg);
	box-shadow:
		0 4px 24px color-mix(in srgb, var(--color-dark) 12%, transparent),
		0 0 0 1px color-mix(in srgb, var(--color-text) 6%, transparent);
	aspect-ratio: 16 / 10;
	max-height: min(50vh, 22rem);
}

@media (min-width: 768px) {
	.about-page__story-media {
		aspect-ratio: 3 / 4;
		max-height: min(72vh, 34rem);
	}
}

.about-page__story-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.about-page__story-content .fp-section__title {
	text-wrap: balance;
}

/* Mission: narrow manifesto + full-width value cards */
.about-page__mission-inner {
	max-width: min(72rem, 100%);
	margin-inline: auto;
}

.about-page__mission-statement {
	max-width: min(38rem, 100%);
	margin-inline: auto;
	text-align: center;
}

.about-page__mission-heading {
	text-wrap: balance;
	margin: 0 0 clamp(1rem, 3vw, 1.5rem);
}

.about-page__mission-copy--manifesto {
	font-size: clamp(1.0625rem, 2vw, 1.2rem);
	line-height: 1.7;
	color: color-mix(in srgb, var(--color-text) 92%, var(--color-secondary) 8%);
}

.about-page__mission-copy--manifesto > p {
	margin-bottom: clamp(0.75rem, 2vw, 1.125rem);
}

.about-page__mission-copy--manifesto > p:last-child {
	margin-bottom: 0;
}

.about-page__values {
	margin-top: clamp(2.25rem, 5vw, 3.5rem);
	padding-top: clamp(2rem, 4.5vw, 3rem);
	border-top: 1px solid color-mix(in srgb, var(--color-text) 12%, transparent);
}

.about-page__values-title {
	margin: 0 auto clamp(1.5rem, 3.5vw, 2.25rem);
	max-width: 40rem;
	font-family: var(--font-heading);
	font-size: clamp(1.15rem, 2.2vw, 1.4rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.3;
	text-align: center;
	color: color-mix(in srgb, var(--color-secondary) 50%, var(--color-text) 50%);
}

.about-page__values-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
	gap: clamp(1rem, 2.5vw, 1.35rem);
}

.about-page__value-card {
	margin: 0;
	padding: clamp(1.25rem, 3vw, 1.65rem);
	background: var(--color-bg);
	border-radius: var(--border-radius-lg);
	border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
	box-shadow: 0 2px 16px color-mix(in srgb, var(--color-dark) 6%, transparent);
	border-top: 3px solid color-mix(in srgb, var(--color-accent) 78%, var(--color-secondary) 22%);
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;
}

@media (prefers-reduced-motion: reduce) {
	.about-page__value-card {
		transition: none;
	}

	.about-page__value-card:hover,
	.about-page__value-card:focus-within {
		transform: none;
	}
}

.about-page__value-card:hover,
.about-page__value-card:focus-within {
	border-color: color-mix(in srgb, var(--color-accent) 35%, var(--color-text) 65%);
	box-shadow: 0 8px 28px color-mix(in srgb, var(--color-dark) 10%, transparent);
	transform: translateY(-2px);
}

.about-page__value-card-text {
	margin: 0;
	font-family: var(--font-body);
	font-size: 0.98rem;
	line-height: 1.55;
	font-weight: 600;
	color: var(--color-text);
}

.about-page__editor {
	max-width: var(--content-max);
	margin-inline: auto;
	padding: var(--space-6) var(--space-section-x);
}

.about-page__editor .entry-content {
	max-width: min(48rem, 100%);
}

/* ==========================================================================
   Contact page (page-contact.php)
   ========================================================================== */

.site-main--contact {
	margin: 0;
	padding: 0;
}

/* Intro + details + map: one aligned band under the banner */
.contact-page__top {
	padding-block: clamp(var(--space-lg), 6vw, var(--space-xl));
}

.contact-page__top-inner {
	display: flex;
	flex-direction: column;
	gap: clamp(2rem, 5vw, 3.25rem);
	max-width: min(72rem, 100%);
	margin-inline: auto;
}

.contact-page__intro-head.svc-page__intro-block {
	margin-bottom: 0;
	text-align: center;
	max-width: min(52rem, 100%);
	margin-inline: auto;
}

.contact-page__intro-lead {
	max-width: 65ch;
	margin-inline: auto;
	font-size: 1.0625rem;
	line-height: 1.65;
}

.contact-page__details-grid {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2rem);
	align-items: stretch;
}

@media (min-width: 900px) {
	.contact-page__details-grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
		gap: clamp(1.5rem, 3vw, 2.5rem);
		align-items: stretch;
	}

	.contact-page__details-grid--map-only {
		grid-template-columns: minmax(0, 1fr);
		max-width: min(48rem, 100%);
		margin-inline: auto;
	}
}

.contact-page__details-card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	background: color-mix(in srgb, var(--color-bg-alt) 92%, var(--color-bg) 8%);
	border: 1px solid color-mix(in srgb, var(--color-text) 9%, transparent);
	border-radius: var(--border-radius-lg);
	border-left: 3px solid color-mix(in srgb, var(--color-accent) 75%, var(--color-secondary) 25%);
	box-shadow: 0 2px 20px color-mix(in srgb, var(--color-dark) 6%, transparent);
	padding: clamp(1.75rem, 4vw, 2.75rem);
	min-height: 100%;
}

.contact-page__details-text {
	display: flex;
	flex-direction: column;
	gap: clamp(1.35rem, 3.5vw, 2.1rem);
	min-width: 0;
	width: 100%;
}

.contact-page__detail {
	margin: 0;
}

.contact-page__detail-label {
	display: block;
	font-family: var(--font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-accent) 70%, var(--color-text) 30%);
	margin-bottom: var(--space-3);
}

.contact-page__detail-value {
	font-size: 1.0625rem;
	line-height: 1.55;
	color: var(--color-text);
}

.contact-page__detail--address .fp-prose > p {
	margin: 0;
}

.contact-page__detail--address .fp-prose > p + p {
	margin-top: 0.65em;
}

/* No underlines — weight + colour carry affordance */
.contact-page__details-card a:link,
.contact-page__details-card a:visited,
.contact-page__details-card a:hover,
.contact-page__details-card a:active,
.contact-page__details-card a:focus,
.contact-page__details-card a:focus-visible {
	text-decoration: none;
}

.contact-page__details-card a.contact-page__detail-value {
	color: color-mix(in srgb, var(--color-secondary) 58%, var(--color-text) 42%);
	font-weight: 650;
}

.contact-page__details-card a.contact-page__detail-value:hover,
.contact-page__details-card a.contact-page__detail-value:focus-visible {
	color: color-mix(in srgb, var(--color-accent) 55%, var(--color-secondary) 45%);
	text-decoration: none;
}

.contact-page__map {
	position: relative;
	min-height: min(22rem, 50vh);
	overflow: hidden;
	border-radius: var(--border-radius-lg);
	border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
	box-shadow: 0 4px 20px color-mix(in srgb, var(--color-dark) 8%, transparent);
}

.contact-page__map iframe {
	display: block;
	width: 100%;
	min-height: min(22rem, 50vh);
	border: 0;
}

.contact-page__form-inner {
	max-width: min(40rem, 100%);
	margin-inline: auto;
}

.contact-page__form-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-bottom: clamp(1.5rem, 4vw, 2.25rem);
}

.contact-page__form-header .fp-eyebrow {
	margin-bottom: var(--space-3);
}

.contact-page__form-heading {
	width: 100%;
	margin: 0 0 var(--space-4);
	text-align: center;
}

.contact-page__form-header .contact-page__form-heading:last-child {
	margin-bottom: 0;
}

.contact-page__form-lead {
	width: 100%;
	max-width: 52ch;
	margin: 1rem 0 0;
	text-align: center;
	font-size: 1.0625rem;
	line-height: 1.65;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-bg) 12%);
}

/* Flex parent centres this block; reinforce text + any plugin paragraph rules */
.contact-page__form-lead.fp-prose,
.contact-page__form-lead.fp-prose p {
	text-align: center;
}

.contact-page__form-lead > p:last-child {
	margin-bottom: 0;
}

.contact-page__notice {
	margin: 0 0 var(--space-6);
	padding: var(--space-4);
	border-radius: var(--border-radius-lg);
	font-size: 1rem;
	line-height: 1.5;
}

.contact-page__notice--success {
	background: color-mix(in srgb, var(--color-secondary) 12%, var(--color-bg) 88%);
	border: 1px solid color-mix(in srgb, var(--color-secondary) 28%, transparent);
	color: var(--color-text);
}

.contact-page__notice--error {
	background: color-mix(in srgb, var(--color-accent) 10%, var(--color-bg) 90%);
	border: 1px solid color-mix(in srgb, var(--color-accent) 35%, transparent);
	color: var(--color-text);
}

.contact-page__form-grid {
	display: grid;
	/* rem-based clamp — does not depend on var() resolution */
	row-gap: clamp(1.5rem, 4vw, 2.25rem);
	column-gap: clamp(1.125rem, 3.5vw, 1.75rem);
	grid-template-columns: 1fr;
}

@media (min-width: 600px) {
	.contact-page__form-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.contact-page__field {
	margin: 0;
}

.contact-page__field--full {
	grid-column: 1 / -1;
}

.contact-page__label {
	display: block;
	font-family: var(--font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	margin-bottom: 0.75rem;
	color: var(--color-text);
}

.contact-page__label abbr {
	text-decoration: none;
	color: color-mix(in srgb, var(--color-accent) 80%, var(--color-text) 20%);
}

.contact-page__input,
.contact-page__select,
.contact-page__textarea {
	width: 100%;
	padding: 0.85rem 1rem;
	font-family: var(--font-body);
	font-size: 1rem;
	line-height: 1.5;
	color: var(--color-text);
	background: var(--color-bg);
	border: 1px solid color-mix(in srgb, var(--color-text) 16%, transparent);
	border-radius: var(--border-radius);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.contact-page__textarea {
	min-height: 9rem;
	resize: vertical;
}

.contact-page__input:focus,
.contact-page__select:focus,
.contact-page__textarea:focus {
	outline: none;
	border-color: color-mix(in srgb, var(--color-secondary) 55%, var(--color-text) 45%);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-secondary) 22%, transparent);
}

.contact-page__form-actions {
	margin: clamp(1.5rem, 4vw, 2.25rem) 0 0;
	text-align: center;
}

/* ==========================================================================
   Downloads page (page-downloads)
   ========================================================================== */

.site-main--downloads {
	margin: 0;
	padding: 0;
}

.downloads-page__primary-inner {
	max-width: min(52rem, 100%);
	margin-inline: auto;
}

.downloads-page__intro-block {
	margin-bottom: clamp(1.5rem, 4vw, 2.25rem);
}

.downloads-page__intro-block:last-child {
	margin-bottom: 0;
}

.downloads-page__group {
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
	padding-top: clamp(1.25rem, 3vw, 1.75rem);
	border-top: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
}

.downloads-page__group--after-intro {
	margin-top: clamp(0.35rem, 1.5vw, 0.75rem);
	padding-top: 0;
	border-top: 0;
}

.downloads-page__group-title {
	margin: 0 0 clamp(1rem, 2.5vw, 1.35rem);
	font-family: var(--font-heading);
	font-size: clamp(1.08rem, 2.2vw, 1.25rem);
	font-weight: 700;
	color: color-mix(in srgb, var(--color-secondary) 58%, var(--color-text) 42%);
	letter-spacing: -0.02em;
	text-align: left;
}

.downloads-page__files {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: clamp(1rem, 3vw, 1.35rem);
}

.downloads-page__file {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: clamp(0.85rem, 2.5vw, 1.25rem);
	margin: 0;
	padding: clamp(1.15rem, 3vw, 1.5rem) clamp(1.15rem, 3vw, 1.5rem);
	background: var(--color-bg);
	border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
	border-radius: var(--border-radius-lg);
	box-shadow: 0 2px 12px color-mix(in srgb, var(--color-dark) 5%, transparent);
}

.downloads-page__file-media {
	flex: 0 0 auto;
	width: min(32vw, 7.5rem);
	max-width: 140px;
}

.downloads-page__file-img {
	display: block;
	width: 100%;
	height: auto;
	max-height: clamp(3rem, 12vw, 4.5rem);
	object-fit: contain;
	object-position: left center;
}

.downloads-page__file-main {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	flex: 1 1 12rem;
	min-width: 0;
}

.downloads-page__file-body {
	flex: 1 1 14rem;
	min-width: 0;
}

.downloads-page__file-title {
	margin: 0 0 var(--space-2);
	font-family: var(--font-heading);
	font-size: clamp(1rem, 2.1vw, 1.12rem);
	font-weight: 700;
	color: var(--color-text);
	letter-spacing: -0.02em;
}

.downloads-page__file-desc {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-bg) 12%);
}

.downloads-page__file-btn {
	flex-shrink: 0;
}

.downloads-page__file-no-file {
	flex-shrink: 0;
	font-size: 0.8125rem;
	color: color-mix(in srgb, var(--color-text) 55%, var(--color-bg) 45%);
	font-style: italic;
}

.downloads-page__empty {
	margin: 0;
	text-align: center;
	color: color-mix(in srgb, var(--color-text) 72%, var(--color-bg) 28%);
	font-size: 1rem;
}

.downloads-page__editor .fp-section__inner {
	max-width: min(48rem, 100%);
	margin-inline: auto;
}

/* ==========================================================================
   Services CPT — listing (page-services) + single (single-service)
   ========================================================================== */

.site-main--services {
	margin: 0;
	padding: 0;
}

/* Banner: title only; optional photo — slim strip, title centred (matches Services + About inner pages) */
.svc-page__hero {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(10rem, 20vw, 15rem);
	padding-block: clamp(var(--space-md), 4vw, var(--space-lg));
	overflow: hidden;
	isolation: isolate;
}

.svc-page__hero-inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: min(42rem, 100%);
	margin-inline: auto;
	text-align: center;
}

.svc-page__hero--has-media {
	min-height: clamp(10rem, 22vw, 16rem);
	padding-block: clamp(var(--space-md), 4vw, var(--space-lg));
}

/* Remove hairline gap under fixed header (subpixel seam) */
@media (min-width: 960px) {
	.svc-page__hero--has-media,
	.fp-hero--has-bg,
	.svc-single__banner {
		margin-top: -1px;
	}
}

.svc-page__hero-media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.svc-page__hero-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.svc-page__hero--has-media::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background-image: linear-gradient(
		115deg,
		color-mix(in srgb, var(--color-dark) 78%, transparent) 0%,
		color-mix(in srgb, var(--color-secondary) 52%, transparent) 55%,
		color-mix(in srgb, var(--color-dark) 70%, transparent) 100%
	);
}

.svc-page__hero--has-media::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: color-mix(in srgb, var(--color-dark) 18%, transparent);
}

.svc-page__hero--has-media .fp-section__title--on-dark {
	text-shadow: 0 2px 28px color-mix(in srgb, var(--color-dark) 45%, transparent);
}

/* Intro above service grid (muted section) */
.svc-page__intro-block {
	margin: 0 0 clamp(1.5rem, 4vw, 2.25rem);
	max-width: min(42rem, 100%);
}

.svc-page__intro-block .fp-eyebrow--on-light {
	margin-bottom: var(--space-sm);
}

.svc-page__intro-heading {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: clamp(1.35rem, 3vw, 1.85rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.2;
	color: color-mix(in srgb, var(--color-secondary) 88%, var(--color-text) 12%);
}

.svc-page__intro-block .svc-page__intro-heading + .svc-page__lead {
	margin-top: 0;
}

.svc-page__lead {
	color: var(--color-text);
}

.svc-page__lead.fp-prose a {
	color: color-mix(in srgb, var(--color-accent) 88%, var(--color-secondary) 12%);
}

.svc-page__lead.fp-prose a:hover,
.svc-page__lead.fp-prose a:focus-visible {
	color: var(--color-accent);
}

.svc-page__grid-section {
	padding-top: clamp(1.5rem, 4vw, 2.5rem);
}

.svc-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	gap: clamp(1.25rem, 3vw, 1.75rem);
}

@media (min-width: 600px) {
	.svc-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

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

.svc-grid__item {
	min-height: 0;
	display: flex;
}

.svc-card {
	container-type: inline-size;
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	flex: 1 1 auto;
	background: var(--color-bg);
	text-decoration: none;
	color: inherit;
	border-radius: var(--border-radius-lg);
	overflow: hidden;
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-text) 5%, transparent),
		0 12px 40px color-mix(in srgb, var(--color-secondary) 8%, transparent);
	transition:
		box-shadow 0.25s ease,
		transform 0.2s ease;
}

.svc-card:hover,
.svc-card:focus-visible {
	transform: translateY(-3px);
	box-shadow:
		0 2px 0 color-mix(in srgb, var(--color-accent) 35%, transparent),
		0 20px 50px color-mix(in srgb, var(--color-secondary) 14%, transparent);
	outline: none;
}

.svc-card__media {
	position: relative;
	z-index: 0;
	overflow: hidden;
	flex-shrink: 0;
}

.svc-card__media-frame {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 10;
}

.svc-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.svc-card__img--placeholder {
	min-height: 100%;
	height: 100%;
	background: linear-gradient(
		145deg,
		color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%),
		color-mix(in srgb, var(--color-dark) 75%, var(--color-secondary) 25%)
	);
}

/* Sibling of panel so z-index can sit above the angled panel; position from card (16:10 media height = 62.5cqw). */
.svc-card__icon {
	position: absolute;
	left: 50%;
	z-index: 2;
	top: calc(62.5cqw - 1.5rem);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	margin: 0;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: var(--color-bg);
	color: color-mix(in srgb, var(--color-secondary) 92%, var(--color-accent) 8%);
	/*border: 2px solid color-mix(in srgb, var(--color-secondary) 35%, var(--color-bg) 65%);*/
	box-shadow: 0 4px 18px color-mix(in srgb, var(--color-dark) 25%, transparent);
	font-size: 1.25rem;
	pointer-events: none;
}

.svc-card__panel {
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: -2.25rem;
	padding: clamp(2.25rem, 1.75rem + 1.5vw, 2.85rem) clamp(1rem, 4vw, 1.25rem) clamp(1.25rem, 3vw, 1.5rem);
	text-align: center;
	background: var(--color-secondary);
	color: var(--color-dark-text);
	clip-path: polygon(0 15%, 100% 0, 100% 100%, 0 100%);
	min-height: 0;
}

.svc-card:has(.svc-card__icon) .svc-card__panel {
	padding-top: clamp(3.65rem, 2.85rem + 2.5vw, 4.35rem);
}

.svc-card__title {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: clamp(1.05rem, 2.5vw, 1.2rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: var(--color-dark-text);
}

.svc-card__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 0.25rem;
	padding: 0.45rem 1.1rem;
	font-family: var(--font-heading);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-dark-text);
	background: color-mix(in srgb, var(--color-secondary) 40%, var(--color-bg) 60%);
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--color-dark-text) 18%, transparent);
}

.svc-page__empty {
	margin: 0;
	text-align: center;
	color: var(--color-text-light);
}

/* Single service — banner + sidebar + structured main */
.site-main--service {
	margin: 0;
	padding: 0;
}

.svc-single__banner {
	position: relative;
	max-height: min(52vh, 28rem);
	overflow: hidden;
	background: color-mix(in srgb, var(--color-secondary) 88%, var(--color-dark) 12%);
}

.svc-single__banner-img {
	width: 100%;
	height: min(52vh, 28rem);
	object-fit: cover;
	display: block;
}

.svc-single__banner-scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		180deg,
		transparent 0%,
		color-mix(in srgb, var(--color-dark) 55%, transparent) 100%
	);
	pointer-events: none;
}

.svc-single__layout-wrap {
	padding-block: clamp(var(--space-md), 5vw, var(--space-xl));
}

.svc-single__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.5rem, 4vw, 2.5rem);
	align-items: start;
	max-width: var(--container-width);
}

@media (min-width: 960px) {
	.svc-single__layout {
		grid-template-columns: minmax(15rem, 17.5rem) minmax(0, 1fr);
		gap: clamp(2rem, 4vw, 3rem);
	}
}

.svc-single__sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--space-sm);
}

.svc-single__nav-card,
.svc-single__dl-card {
	background: var(--color-bg);
	border-radius: var(--border-radius-lg);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-text) 6%, transparent),
		0 12px 36px color-mix(in srgb, var(--color-secondary) 10%, transparent);
	padding: clamp(1rem, 2.5vw, 1.25rem);
}

/* background-color only (not shorthand) so an inline background-image can layer for the photo variant */
.svc-single__contact-card {
	position: relative;
	overflow: hidden;
	background-color: var(--color-bg);
	background-size: cover;
	background-position: center;
	border-radius: var(--border-radius-lg);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-text) 6%, transparent),
		0 12px 36px color-mix(in srgb, var(--color-secondary) 10%, transparent);
	padding: clamp(1rem, 2.5vw, 1.25rem);
}

.svc-single__contact-card--has-bg {
	color: var(--color-dark-text);
	padding: 0;
	background-color: var(--color-secondary);
}

.svc-single__contact-scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		145deg,
		color-mix(in srgb, var(--color-secondary) 82%, transparent) 0%,
		color-mix(in srgb, var(--color-dark) 55%, transparent) 100%
	);
	pointer-events: none;
}

.svc-single__contact-inner {
	position: relative;
	z-index: 1;
	padding: clamp(1rem, 2.5vw, 1.25rem);
}

.svc-single__contact-eyebrow {
	margin: 0 0 0.35rem;
	font-family: var(--font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	opacity: 0.92;
}

.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-eyebrow {
	color: color-mix(in srgb, var(--color-text) 72%, var(--color-secondary) 28%);
}

.svc-single__contact-headline {
	margin: 0 0 0.75rem;
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.3;
}

.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-headline {
	color: color-mix(in srgb, var(--color-secondary) 90%, var(--color-text) 10%);
}

.svc-single__contact-phone {
	margin: 0 0 0.65rem;
	font-size: 1.0625rem;
	font-weight: 700;
}

.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-phone {
	color: color-mix(in srgb, var(--color-secondary) 88%, var(--color-text) 12%);
}

.svc-single__contact-link {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease, opacity 0.2s ease;
}

.svc-single__contact-card--has-bg .svc-single__contact-link:hover,
.svc-single__contact-card--has-bg .svc-single__contact-link:focus-visible {
	color: var(--color-dark-text);
	opacity: 0.9;
	outline: none;
}

.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-link:hover,
.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-link:focus-visible {
	color: var(--color-accent);
	outline: none;
}

.svc-single__contact-action {
	margin: 0 0 0.5rem;
}

.svc-single__contact-card--has-bg .svc-single__contact-btn.fp-btn--primary {
	background: var(--color-dark-text);
	color: var(--color-secondary);
	border-color: transparent;
}

.svc-single__contact-card--has-bg .svc-single__contact-btn.fp-btn--primary:hover,
.svc-single__contact-card--has-bg .svc-single__contact-btn.fp-btn--primary:focus-visible {
	filter: brightness(1.05);
}

.svc-single__contact-note {
	margin: 0.5rem 0 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	opacity: 0.9;
}

.svc-single__contact-card:not(.svc-single__contact-card--has-bg) .svc-single__contact-note {
	color: color-mix(in srgb, var(--color-text) 85%, var(--color-secondary) 15%);
}

.svc-single__nav-title,
.svc-single__dl-title {
	margin: 0 0 0.65rem;
	font-family: var(--font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--color-text) 88%, var(--color-secondary) 12%);
}

.svc-single__nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.svc-single__nav-link {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 0.65rem;
	border-radius: calc(var(--border-radius-lg) - 4px);
	text-decoration: none;
	font-size: 0.9375rem;
	font-weight: 600;
	color: color-mix(in srgb, var(--color-secondary) 92%, var(--color-text) 8%);
	transition: background 0.2s ease, color 0.2s ease;
}

.svc-single__nav-link:hover,
.svc-single__nav-link:focus-visible {
	background: color-mix(in srgb, var(--color-secondary) 6%, var(--color-bg) 94%);
	color: var(--color-accent);
	outline: none;
}

.svc-single__nav-item.is-active .svc-single__nav-link {
	background: linear-gradient(
		104deg,
		color-mix(in srgb, var(--color-secondary) 94%, var(--color-dark) 6%) 0%,
		color-mix(in srgb, var(--color-secondary) 82%, var(--color-accent) 6%) 100%
	);
	color: var(--color-dark-text);
}

.svc-single__nav-ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	flex-shrink: 0;
	opacity: 0.95;
}

.svc-single__nav-item.is-active .svc-single__nav-ico {
	color: var(--color-dark-text);
}

.svc-single__dl-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.svc-single__dl-link {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: color-mix(in srgb, var(--color-secondary) 90%, var(--color-text) 10%);
	text-decoration: none;
}

.svc-single__dl-link:hover,
.svc-single__dl-link:focus-visible {
	color: var(--color-accent);
	outline: none;
}

.svc-single__dl-link .fa-file-pdf,
.svc-single__dl-link .fa-file-lines {
	color: color-mix(in srgb, var(--color-accent) 85%, var(--color-secondary) 15%);
}

.svc-single__main {
	background: var(--color-bg);
	border-radius: var(--border-radius-lg);
	padding: clamp(1.25rem, 3vw, 2rem);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--color-text) 5%, transparent),
		0 16px 48px color-mix(in srgb, var(--color-secondary) 8%, transparent);
}

.svc-single__figure {
	margin: -0.5rem -0.5rem var(--space-md);
	border-radius: calc(var(--border-radius-lg) - 4px);
	overflow: hidden;
}

.svc-single__figure-img {
	width: 100%;
	height: auto;
	display: block;
	vertical-align: middle;
}

.svc-single__header {
	margin-bottom: var(--space-md);
}

.svc-single__page-title {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 3.5vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: color-mix(in srgb, var(--color-secondary) 92%, var(--color-text) 8%);
}

.svc-single__intro {
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--color-text);
}

.svc-single__intro > p:first-child {
	margin-top: 0;
}

.svc-single__block {
	margin-top: var(--space-md);
	padding-top: var(--space-md);
	border-top: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent);
}

.svc-single__main > .svc-single__block:first-of-type {
	border-top: none;
	padding-top: 0;
	margin-top: var(--space-sm);
}

.svc-single__h2 {
	margin: 0 0 var(--space-sm);
	font-family: var(--font-heading);
	font-size: clamp(1.15rem, 2.5vw, 1.35rem);
	font-weight: 700;
	color: color-mix(in srgb, var(--color-secondary) 88%, var(--color-text) 12%);
}

.svc-single__section-body {
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--color-text);
}

.svc-single__checklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}

.svc-single__check-item {
	display: flex;
	align-items: flex-start;
	gap: 0.55rem;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--color-text);
}

.svc-single__check-ico {
	margin-top: 0.2em;
	flex-shrink: 0;
	color: color-mix(in srgb, var(--color-accent) 90%, var(--color-secondary) 10%);
}

.svc-single__outcomes {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.svc-single__outcome {
	position: relative;
	padding-left: 1.1rem;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--color-text);
}

.svc-single__outcome::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: color-mix(in srgb, var(--color-accent) 80%, var(--color-text) 20%);
}

.svc-single__cta {
	margin: var(--space-md) 0 0;
	text-align: left;
}

.svc-single__legacy {
	margin-top: var(--space-md);
	padding-top: var(--space-md);
	border-top: 1px dashed color-mix(in srgb, var(--color-text) 15%, transparent);
}