/* ==========================================================================
   Veridian — base component & layout styles (scaffold).
   Uses tokens from tokens.css exclusively: no raw hex values in this file.
   ========================================================================== */

/* --- Reset-ish --- */
*, *::before, *::after { box-sizing: border-box; }
body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-base);
	line-height: var(--leading-body);
	color: var(--color-text);
	background: var(--color-surface);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; }
a { color: var(--color-primary); }
h1, h2, h3, h4 { line-height: var(--leading-tight); color: var(--color-primary); }

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

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0);
}
.skip-link:focus {
	position: fixed; top: 8px; left: 8px;
	width: auto; height: auto; clip: auto;
	background: var(--color-surface); color: var(--color-primary);
	padding: var(--space-2) var(--space-4); z-index: 999;
}

/* --- Buttons --- */
.btn {
	display: inline-block;
	padding: 0.8em 1.6em;
	border-radius: var(--radius-pill);
	font-weight: 600;
	font-size: var(--text-sm);
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}
.btn--olive {
	background: linear-gradient(180deg, var(--v-olive-300) -60%, var(--v-olive-500) 55%, var(--v-olive-600) 160%);
	color: var(--color-text-invert);
	box-shadow: 0 6px 18px rgba(var(--v-green-900-rgb), 0.25);
}
.btn--olive:hover {
	background: linear-gradient(180deg, var(--v-olive-500) -60%, var(--v-olive-600) 70%);
	box-shadow: 0 8px 22px rgba(var(--v-green-900-rgb), 0.35);
}
.btn--green { background: var(--color-primary); color: var(--color-text-invert); }
.btn--green:hover { background: var(--color-primary-hover); }
.btn--ghost {
	border: 1.5px solid currentColor;
	color: var(--color-text-invert);
}
.btn--ghost:hover { background: rgba(255, 255, 255, 0.12); }

/* --- Top strip --- */
.top-strip {
	background:
		radial-gradient(30rem 8rem at 100% 50%, rgba(140, 139, 87, 0.22), transparent 70%),
		linear-gradient(90deg, var(--v-green-900) 0%, var(--v-green-800) 100%);
	color: var(--v-cream);
	font-size: var(--text-xs);
	border-bottom: 1px solid rgba(169, 168, 107, 0.28);
}
.top-strip__inner {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: var(--space-2) var(--space-6);
	justify-content: space-between;
	padding-block: var(--space-3);
}
.top-strip__contact {
	display: flex; align-items: center;
	gap: var(--space-3) var(--space-8);
	flex-wrap: wrap;
}
.top-strip__item {
	display: inline-flex; align-items: center; gap: var(--space-2);
	margin: 0;
	color: var(--v-cream);
	text-decoration: none;
	letter-spacing: 0.01em;
	transition: color 0.2s ease;
}
a.top-strip__item:hover { color: var(--v-olive-300); }
.top-strip__ico {
	display: grid; place-items: center;
	width: 22px; height: 22px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: rgba(169, 168, 107, 0.18);
	color: var(--v-olive-300);
	transition: background 0.2s ease, color 0.2s ease;
}
.top-strip__ico svg { width: 13px; height: 13px; }
a.top-strip__item:hover .top-strip__ico { background: var(--color-accent); color: var(--color-text-invert); }
.top-strip__phone { font-weight: 600; }
.top-strip__badge {
	display: inline-flex; align-items: center;
	margin-left: var(--space-2);
	padding: 4px 14px;
	border-radius: var(--radius-pill);
	background: rgba(169, 168, 107, 0.2);
	border: 1px solid rgba(169, 168, 107, 0.4);
	color: var(--v-olive-300);
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	font-size: 0.68rem;
}
/* Mobile-only claim button in the top bar. */
.top-strip__claim { display: none; }

@media (max-width: 860px) {
	/* Top bar becomes an action bar: phone left, Make a claim right.
	   Address + email live in the mobile menu instead. */
	.top-strip__inner {
		flex-wrap: nowrap;
		justify-content: space-between;
		gap: var(--space-3);
		padding-block: var(--space-2);
	}
	.top-strip__address,
	.top-strip__badge,
	.top-strip__contact a[href^="mailto"] { display: none; }
	.top-strip__contact { gap: var(--space-3); min-width: 0; }
	.top-strip__phone { font-size: var(--text-sm); font-weight: 700; color: var(--color-text-invert); }
	.top-strip__phone .top-strip__ico { width: 24px; height: 24px; background: rgba(169, 168, 107, 0.28); }
	.top-strip__phone .top-strip__ico svg { width: 14px; height: 14px; }
	.top-strip__claim {
		display: inline-flex; align-items: center;
		flex: 0 0 auto;
		padding: 7px 16px;
		border-radius: var(--radius-pill);
		background: linear-gradient(180deg, var(--v-olive-300) -60%, var(--v-olive-500) 55%, var(--v-olive-600) 160%);
		color: var(--color-text-invert);
		font-size: 0.78rem;
		font-weight: 700;
		letter-spacing: 0.02em;
		text-decoration: none;
		white-space: nowrap;
		box-shadow: 0 4px 12px rgba(var(--v-green-900-rgb), 0.3);
	}
	.top-strip__claim:active { transform: translateY(1px); }
}

/* --- Header: frosted glass while sticky --- */
.site-header {
	background: var(--color-primary);
	position: sticky; top: 0; z-index: 50;
}
/* Desktop only: backdrop-filter makes the header a containing block for
   fixed-position children, which would break the mobile nav drawer. */
@media (min-width: 861px) {
	@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
		.site-header {
			background: rgba(var(--v-green-800-rgb), 0.88);
			-webkit-backdrop-filter: blur(14px) saturate(1.4);
			backdrop-filter: blur(14px) saturate(1.4);
			border-bottom: 1px solid rgba(255, 255, 255, 0.08);
		}
	}
}
.site-header__inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: var(--space-6);
	padding-block: var(--space-3);
}
/* Text-only lockup (398x88 source): wide and shallow, so give it width
   and let the header stay slim. */
.site-header .brand img { width: 190px; height: auto; display: block; }
.site-nav { display: flex; align-items: center; gap: var(--space-6); }
.nav-menu {
	display: flex; gap: var(--space-6);
	list-style: none; margin: 0; padding: 0;
}
.nav-menu a {
	color: var(--color-text-invert);
	text-decoration: none;
	font-size: var(--text-sm);
	font-weight: 500;
}
.nav-menu a:hover { color: var(--v-olive-300); }

.nav-toggle { display: none; }
.site-nav__contact { display: none; }
.site-nav__details { display: none; }
.site-nav__bottom { display: contents; } /* desktop: children sit in the header row as before */

/* --- Mobile navigation: full-height drawer under the header --- */
@media (max-width: 860px) {
	.nav-toggle {
		display: inline-flex; flex-direction: column; gap: 5px;
		background: none; border: 0; padding: var(--space-2); cursor: pointer;
	}
	.nav-toggle__bar {
		width: 24px; height: 2px;
		background: var(--color-text-invert);
		transition: transform 0.2s ease, opacity 0.2s ease;
	}
	.nav-toggle.is-active .nav-toggle__bar:nth-of-type(1) { transform: translateY(7px) rotate(45deg); }
	.nav-toggle.is-active .nav-toggle__bar:nth-of-type(2) { opacity: 0; }
	.nav-toggle.is-active .nav-toggle__bar:nth-of-type(3) { transform: translateY(-7px) rotate(-45deg); }

	.site-nav {
		position: fixed;
		left: 0; right: 0; bottom: 0; top: 0; /* top corrected by JS to sit under the header */
		background:
			radial-gradient(36rem 22rem at 90% 0%, rgba(169, 168, 107, 0.14), transparent 65%),
			var(--color-primary);
		z-index: 49;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: var(--space-4) var(--container-pad);
		padding-bottom: calc(var(--space-12) + env(safe-area-inset-bottom, 0px));
		overflow-y: auto;
		overscroll-behavior: contain;
		visibility: hidden;
		opacity: 0;
		transform: translateY(-10px);
		pointer-events: none;
		transition: opacity 0.28s ease, transform 0.28s cubic-bezier(.2,.7,.3,1), visibility 0.28s;
	}
	.site-nav.is-open {
		visibility: visible;
		opacity: 1;
		transform: none;
		pointer-events: auto;
	}
	@media (prefers-reduced-motion: reduce) {
		.site-nav { transition: none; }
	}
	body.nav-open { overflow: hidden; }

	/* Two-column link grid; the Services accordion spans the full width. */
	.nav-menu {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-auto-flow: row dense;
		column-gap: var(--space-6);
		align-items: start;
	}
	.nav-menu > li { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
	.nav-item--mega { grid-column: 1 / -1; }
	.nav-menu > li > a:active,
	.nav-mega-toggle:active { color: var(--v-olive-300); }
	.nav-menu a {
		display: block;
		padding: var(--space-4) 0;
		font-size: var(--text-lg);
		font-weight: 600;
		min-height: 52px; /* comfortable thumb target */
	}
	.nav-menu a::after { display: none; }
	.nav-mega-toggle {
		width: 100%;
		justify-content: space-between;
		padding: var(--space-4) 0;
		font-size: var(--text-lg);
		font-weight: 600;
	}
	.nav-caret { width: 9px; height: 9px; }

	/* Bottom row: phone (left) + Make a claim (right). */
	.site-nav__bottom {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-4);
		margin-top: var(--space-8);
		padding-top: var(--space-6);
		border-top: 1px solid rgba(255, 255, 255, 0.14);
	}

	/* Email / address / WhatsApp — moved out of the top bar. */
	.site-nav__details {
		list-style: none;
		margin: var(--space-6) 0 0;
		padding: 0;
		display: grid;
		gap: var(--space-4);
	}
	.site-nav__details li {
		display: flex; align-items: flex-start; gap: var(--space-3);
		font-size: var(--text-sm);
		color: var(--v-cream);
		line-height: 1.5;
	}
	.site-nav__details a { color: var(--v-cream); text-decoration: none; }
	.site-nav__details a:active { color: var(--v-olive-300); }
	.site-nav__ico {
		display: grid; place-items: center;
		width: 30px; height: 30px;
		flex: 0 0 auto;
		border-radius: 50%;
		background: rgba(169, 168, 107, 0.18);
		color: var(--v-olive-300);
	}
	.site-nav__ico svg { width: 15px; height: 15px; }
	.site-nav__cta {
		width: auto;
		flex: 0 0 auto;
		text-align: center;
		font-size: var(--text-base);
	}
	.site-nav__contact {
		display: grid;
		gap: 2px;
		justify-items: start;
		text-align: left;
		min-width: 0;
	}
	.site-nav__contact a {
		color: var(--v-olive-300);
		font-family: var(--font-display);
		font-size: var(--text-xl);
		font-weight: 600;
		text-decoration: none;
	}
	.site-nav__contact span { font-size: var(--text-xs); color: var(--v-cream); line-height: 1.5; }
}

/* --- Hero: layered gradient with a soft diagonal sheen --- */
.hero {
	background:
		linear-gradient(115deg, rgba(255, 255, 255, 0.055) 0%, transparent 42%),
		radial-gradient(56rem 32rem at 88% -5%, rgba(169, 168, 107, 0.20), transparent 62%),
		radial-gradient(30rem 20rem at 55% 110%, rgba(169, 168, 107, 0.08), transparent 65%),
		linear-gradient(158deg, var(--v-green-800) 20%, var(--v-green-900) 100%);
	color: var(--color-text-invert);
	text-align: center;
	padding-block: var(--space-24) var(--space-16);
	position: relative;
	overflow: hidden;
}
.hero > .container { position: relative; z-index: 1; }

/* Ambient background: two soft glows drifting slowly behind the content.
   Pure gradients (no blur filters) so it stays cheap on phones; disabled
   entirely for reduced-motion users. */
@media (prefers-reduced-motion: no-preference) {
	.hero::before,
	.hero::after {
		content: "";
		position: absolute;
		border-radius: 50%;
		pointer-events: none;
		z-index: 0;
	}
	.hero::before {
		width: 38rem; height: 38rem;
		top: -14rem; right: -10rem;
		background: radial-gradient(circle, rgba(169, 168, 107, 0.22), transparent 62%);
		animation: v-drift-a 24s ease-in-out infinite alternate;
	}
	.hero::after {
		width: 30rem; height: 30rem;
		bottom: -16rem; left: -10rem;
		background: radial-gradient(circle, rgba(255, 255, 255, 0.06), transparent 62%);
		animation: v-drift-b 30s ease-in-out infinite alternate;
	}
}
@keyframes v-drift-a {
	from { transform: translate(0, 0) scale(1); }
	to   { transform: translate(-7rem, 5rem) scale(1.18); }
}
@keyframes v-drift-b {
	from { transform: translate(0, 0) scale(1); }
	to   { transform: translate(6rem, -4rem) scale(1.12); }
}
.hero__kicker {
	display: flex; align-items: center; gap: var(--space-3);
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-300);
	margin: 0 0 var(--space-4);
	font-weight: 600;
}
.kicker-rule { display: inline-block; width: 2.5rem; height: 1px; background: var(--v-olive-500); }
.hero__title {
	font-family: var(--font-display);
	font-size: clamp(var(--text-3xl), 6.5vw, var(--text-5xl));
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--color-text-invert);
	margin: 0 0 var(--space-6);
}
.hero__title span,
.hero__title em { color: var(--v-olive-300); font-style: normal; }
.hero__lead { max-width: 44rem; margin: 0 auto var(--space-8); color: var(--v-cream); font-size: var(--text-lg); }
.hero__actions { display: flex; gap: var(--space-4); justify-content: center; flex-wrap: wrap; }

/* --- Page hero (inner pages) --- */
.page-hero {
	background: var(--color-primary);
	color: var(--color-text-invert);
	padding-block: var(--space-12);
	margin-bottom: var(--space-12);
}
.page-hero__kicker {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-300);
	margin: 0 0 var(--space-2);
}
.page-hero__title {
	font-family: var(--font-display);
	color: var(--color-text-invert);
	font-size: clamp(var(--text-2xl), 4.5vw, var(--text-3xl));
	margin: 0;
}

/* --- Sections / services grid --- */
.section-title {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	text-align: center;
	margin-block: 0 var(--space-8);
}
.services { padding-block: var(--space-20); background: var(--color-surface-alt); }
.services__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
	gap: var(--space-4);
}
.service-card {
	display: flex; flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--v-olive-300);
	border-bottom: 3px solid var(--v-olive-500);
	border-radius: var(--radius-md);
	text-decoration: none;
	color: var(--color-primary);
	background: var(--color-surface);
	box-shadow: var(--shadow-card);
	transition: transform 0.28s cubic-bezier(.2,.7,.3,1), box-shadow 0.28s ease, border-color 0.28s ease;
}
.service-card__media {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: var(--v-green-100);
}
.service-card__media img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s cubic-bezier(.2,.7,.3,1);
}
.service-card:hover .service-card__media img { transform: scale(1.07); }
.service-card__media::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(0deg, rgba(var(--v-green-900-rgb), 0.55) 0%, transparent 55%);
}
.service-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--shadow-card-hover);
	border-bottom-color: var(--color-primary);
}
.service-card__num {
	position: absolute; right: var(--space-4); bottom: var(--space-2);
	z-index: 1;
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 700;
	color: var(--v-olive-300);
	line-height: 1;
}
.service-card__more {
	margin-top: auto;
	padding-top: var(--space-2);
	color: var(--v-olive-600);
	font-weight: 600;
	font-size: var(--text-sm);
}
.service-card__more span { transition: transform 0.18s ease; display: inline-block; }
.service-card:hover .service-card__more span { transform: translateX(4px); }
.services__all { text-align: center; margin: var(--space-8) 0 0; }

/* --- Why us / partner --- */
.why-us { background: var(--color-surface-alt); padding-block: var(--space-16); }
.why-us__inner {
	display: grid; gap: var(--space-6);
	grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
}
.why-us__panel {
	background: var(--color-primary); color: var(--color-text-invert);
	border-radius: var(--radius-md); padding: var(--space-8);
}
.why-us__panel h2 { color: var(--v-olive-300); margin-top: 0; }
.why-us__panel ul { margin: 0; padding-left: 1.2em; }
.why-us__partner {
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md); padding: var(--space-8);
}
.why-us__partner h2 { margin-top: 0; }

/* --- Service page layout --- */
.service-layout {
	display: grid; gap: var(--space-8);
	grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr);
	margin-bottom: var(--space-16);
}
@media (max-width: 860px) { .service-layout { grid-template-columns: 1fr; } }
.contact-card {
	position: sticky; top: 6rem;
	/* Taller than the viewport? Scroll inside the card instead of hiding
	   the submit button below the fold. */
	max-height: calc(100vh - 7.5rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: var(--v-olive-500) transparent;
	background: var(--color-surface-alt);
	border-radius: var(--radius-md);
	padding: var(--space-6);
	display: grid; gap: var(--space-3);
	justify-items: start;
}
/* Short screens: let the card flow with the page — no pinning, no nested
   scrolling, the whole form (and its button) always reachable. */
@media (max-height: 760px) {
	.contact-card { position: static; max-height: none; overflow: visible; }
}
.contact-card h2 { margin: 0; font-size: var(--text-lg); }
.contact-card__email { word-break: break-all; }

/* --- Entry content --- */
.entry { max-width: 50rem; margin-bottom: var(--space-16); }
.entry--page, .entry--post { margin-inline: auto; }
.entry__hero-image { margin: 0 0 var(--space-8); }
.entry__hero-image img { border-radius: var(--radius-md); }

/* --- Archive cards --- */
.archive-list { display: grid; gap: var(--space-8); margin-bottom: var(--space-16); }
.archive-card {
	display: grid; gap: var(--space-4);
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	align-items: start;
}
@media (max-width: 640px) { .archive-card { grid-template-columns: 1fr; } }
.archive-card__media img { border-radius: var(--radius-md); }
.archive-card__title { margin: 0; }
.archive-card__title a { text-decoration: none; }
.archive-card__meta { color: var(--color-text-soft); font-size: var(--text-sm); }

/* --- Footer CTA band --- */
.footer-cta {
	background: var(--color-accent);
	color: var(--color-text-invert);
	text-align: center;
	padding-block: var(--space-12);
}
.footer-cta__title {
	font-family: var(--font-display);
	color: var(--color-text-invert);
	font-size: var(--text-2xl);
	margin: 0 0 var(--space-2);
}
.footer-cta__actions {
	display: flex; gap: var(--space-4); justify-content: center; flex-wrap: wrap;
	margin-top: var(--space-6);
}
.footer-cta .btn--olive { background: var(--color-primary); }
.footer-cta .btn--olive:hover { background: var(--v-green-900); }

/* --- Footer --- */
.site-footer { background: var(--v-green-900); color: var(--color-text-invert); }
.site-footer__grid {
	display: grid; gap: var(--space-8);
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	padding-block: var(--space-16);
}
.site-footer h3 {
	color: var(--v-olive-300);
	font-size: var(--text-sm);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
}
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.site-footer a { color: var(--color-text-invert); text-decoration: none; }
.site-footer a:hover { color: var(--v-olive-300); }
.site-footer__legal {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	font-size: var(--text-xs);
}
.site-footer__legal-inner {
	display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-6);
	justify-content: space-between;
	padding-block: var(--space-4);
}
.legal-menu { display: flex; flex-wrap: wrap; gap: var(--space-4); list-style: none; margin: 0; padding: 0; }

/* ==========================================================================
   Section head (kicker + title + optional sub/link)
   ========================================================================== */
.section-head { margin-bottom: var(--space-8); position: relative; }
.section-head--center { text-align: center; max-width: 44rem; margin-inline: auto; }
.section-head__kicker {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
	font-weight: 600;
	margin: 0 0 var(--space-2);
}
.section-head__title {
	font-family: var(--font-display);
	font-weight: 600;
	font-size: clamp(var(--text-xl), 4vw, var(--text-2xl));
	margin: 0 0 var(--space-3);
}
.section-head__sub { color: var(--color-text-soft); margin: 0; }
.section-head__link { font-weight: 600; text-decoration: none; white-space: nowrap; }
@media (min-width: 700px) {
	.section-head:not(.section-head--center) { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: var(--space-4); }
	.section-head:not(.section-head--center) .section-head__link { grid-column: 2; grid-row: 1 / span 2; }
	.section-head:not(.section-head--center) .section-head__kicker,
	.section-head:not(.section-head--center) .section-head__title { grid-column: 1; }
}

/* ==========================================================================
   Hero (split variant + facts row)
   ========================================================================== */
.hero--split { text-align: left; padding-block: var(--space-16) 0; }
.hero--split .hero__inner { display: grid; gap: var(--space-12); align-items: center; }
.hero--split .hero__lead { margin-inline: 0; }
.hero--split .hero__actions { justify-content: flex-start; }
.hero--split .hero__kicker { justify-content: flex-start; }

.hero__contact-row {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: var(--space-4) var(--space-8);
	margin-top: var(--space-8);
	padding-top: var(--space-6);
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.hero__phone-link { display: grid; gap: 2px; text-decoration: none; }
.hero__phone-label {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-300);
}
.hero__phone-number {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 600;
	color: var(--color-text-invert);
	line-height: 1.1;
}
.hero__phone-link:hover .hero__phone-number { color: var(--v-olive-300); }
.hero__hours { margin: 0; font-size: var(--text-xs); color: var(--v-cream); line-height: 1.6; }

.hero__media { position: relative; max-width: 34rem; margin-block: var(--space-2) var(--space-6); }
.hero__media img {
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card-hover);
	display: block;
	position: relative;
	z-index: 1;
}
.hero__frame {
	position: absolute; inset: calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) var(--space-4) var(--space-4);
	border: 1px solid var(--v-olive-500);
	border-radius: var(--radius-md);
	z-index: 0;
}
.hero__badge {
	position: absolute; left: calc(-1 * var(--space-2)); bottom: var(--space-6);
	z-index: 2;
	margin: 0;
	background: var(--color-surface);
	color: var(--color-primary);
	border-left: 3px solid var(--color-accent);
	border-radius: var(--radius-sm);
	padding: var(--space-3) var(--space-6);
	font-size: var(--text-sm);
	line-height: 1.3;
	box-shadow: var(--shadow-card-hover);
	display: grid;
}
.hero__badge strong { font-size: var(--text-lg); font-family: var(--font-display); }
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
	.hero__badge {
		background: rgba(var(--v-green-900-rgb), 0.55);
		color: var(--color-text-invert);
		border: 1px solid rgba(255, 255, 255, 0.28);
		border-left: 3px solid var(--color-accent);
		-webkit-backdrop-filter: blur(12px) saturate(1.3);
		backdrop-filter: blur(12px) saturate(1.3);
	}
	.hero__badge strong { color: var(--v-olive-300); }
}

.hero__facts {
	display: grid; gap: 1px;
	background: rgba(255, 255, 255, 0.14);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-bottom: 0;
	border-radius: var(--radius-md) var(--radius-md) 0 0;
	overflow: hidden;
	margin-top: var(--space-8);
}
.hero__fact {
	background: var(--v-green-900);
	padding: var(--space-4) var(--space-6);
	display: grid; gap: 2px;
}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
	.hero__fact {
		background: rgba(255, 255, 255, 0.05);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
	}
}
.hero__fact strong {
	font-family: var(--font-display);
	font-size: var(--text-lg);
	color: var(--v-olive-300);
	font-weight: 600;
}
.hero__fact span { font-size: var(--text-xs); color: var(--v-cream); }
@media (min-width: 700px) {
	.hero__facts { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 860px) {
	.hero--split .hero__inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
}
@media (max-width: 859px) {
	.hero__media { margin-inline: auto; }
}

/* ==========================================================================
   Trust strip
   ========================================================================== */
.trust-strip { background: var(--v-green-900); color: var(--color-text-invert); }
.trust-strip__inner {
	display: flex; flex-wrap: wrap;
	gap: var(--space-2) var(--space-8);
	justify-content: center;
	padding-block: var(--space-4);
}
.trust-strip p { margin: 0; font-size: var(--text-sm); }
.trust-strip span { color: var(--v-olive-300); font-weight: 700; margin-right: var(--space-1); }

/* ==========================================================================
   Service cards (icon + number + name + description)
   ========================================================================== */
.service-card__icon {
	flex: 0 0 auto;
	display: grid; place-items: center;
	width: 46px; height: 46px;
	margin-top: calc(-1 * var(--space-8));
	margin-bottom: var(--space-1);
	border-radius: 50%;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	color: var(--color-primary);
	box-shadow: var(--shadow-card);
	transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.service-card__icon .icon { width: 23px; height: 23px; }
.service-card__body {
	position: relative;
	display: flex; flex-direction: column; gap: var(--space-2);
	flex: 1 1 auto;
	padding: var(--space-6);
}
.service-card__name {
	font-family: var(--font-display);
	font-size: var(--text-lg);
	font-weight: 600;
	line-height: var(--leading-tight);
}
.service-card__desc { font-weight: 400; font-size: var(--text-sm); color: var(--color-text-soft); }
.service-card:hover .service-card__icon { background: var(--color-primary); color: var(--color-text-invert); transform: translateY(-2px) rotate(-4deg); }

/* ==========================================================================
   About band (media + copy)
   ========================================================================== */
.about-band { padding-block: var(--space-16); background: var(--color-surface-alt); }
.about-band__inner { display: grid; gap: var(--space-8); align-items: center; }
.about-band__media img { border-radius: var(--radius-md); box-shadow: var(--shadow-card); display: block; }
.about-band__copy > p { color: var(--color-text-soft); }
.about-band__values { list-style: none; margin: var(--space-6) 0; padding: 0; display: grid; gap: var(--space-2); }
.about-band__values strong { color: var(--color-primary); }
@media (min-width: 860px) {
	.about-band__inner { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
}

/* ==========================================================================
   Steps (how it works)
   ========================================================================== */
.steps { padding-block: var(--space-16); }
.steps--tinted { background: var(--v-green-100); }
.steps__grid {
	display: grid; gap: var(--space-6);
	list-style: none; margin: 0; padding: 0;
	counter-reset: step;
}
.step {
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	padding: var(--space-6);
	box-shadow: var(--shadow-card);
}
.step__num {
	display: grid; place-items: center;
	width: 52px; height: 52px;
	border-radius: 50%;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-500);
	box-shadow: inset 0 0 0 4px var(--color-surface), inset 0 0 0 5px var(--v-olive-300);
	color: var(--color-primary);
	font-weight: 600;
	font-size: var(--text-xl);
	font-family: var(--font-display);
	margin-bottom: var(--space-4);
}
.step__title { margin: 0 0 var(--space-2); font-size: var(--text-lg); }
.step p { margin: 0; color: var(--color-text-soft); font-size: var(--text-sm); }
@media (min-width: 700px) {
	.steps__grid { grid-template-columns: repeat(3, 1fr); }
}
.steps__grid--inline { margin-block: var(--space-6) var(--space-8); }

/* ==========================================================================
   Why-us extras
   ========================================================================== */
.why-us__panel ul { display: grid; gap: var(--space-2); }
.why-us__phone { margin: var(--space-6) 0 0; }
.why-us__phone a {
	color: var(--v-olive-300);
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 600;
	text-decoration: none;
}

/* ==========================================================================
   FAQ accordion
   ========================================================================== */
.faq-band { padding-block: var(--space-20); background: var(--color-surface); }
.faq-band__inner { display: grid; gap: var(--space-8); align-items: start; }
.faq-band__intro p { color: var(--color-text-soft); }
.faq-band__intro .btn { margin-top: var(--space-2); }
@media (min-width: 860px) {
	.faq-band__inner { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
}
.faq-list { display: grid; gap: var(--space-3); }
.faq-item {
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card);
	overflow: hidden;
}
.faq-item__q {
	display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
	padding: var(--space-4) var(--space-6);
	font-weight: 600;
	color: var(--color-primary);
	cursor: pointer;
	list-style: none;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__marker {
	flex: 0 0 auto;
	width: 12px; height: 12px;
	border-right: 2px solid var(--color-accent);
	border-bottom: 2px solid var(--color-accent);
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	margin-top: -4px;
}
.faq-item[open] .faq-item__marker { transform: rotate(225deg); margin-top: 4px; }
.faq-item__a { padding: 0 var(--space-6) var(--space-4); }
.faq-item__a p { margin: 0; color: var(--color-text-soft); }
.faq-page { max-width: 52rem; margin-bottom: var(--space-16); }
.faq-page h2 { font-family: var(--font-display); margin-top: var(--space-12); }

/* ==========================================================================
   News strip + cards
   ========================================================================== */
.news-strip { padding-block: var(--space-16); }
.news-strip__grid { display: grid; gap: var(--space-6); }
@media (min-width: 700px) {
	.news-strip__grid { grid-template-columns: repeat(3, 1fr); }
}
.news-card {
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card);
	overflow: hidden;
	display: flex; flex-direction: column;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.news-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-card-hover); }
.news-card__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.news-card__body { padding: var(--space-6); display: grid; gap: var(--space-2); align-content: start; }
.news-card__meta { margin: 0; font-size: var(--text-xs); color: var(--color-text-soft); text-transform: uppercase; letter-spacing: var(--tracking-caps); }
.news-card__title { margin: 0; font-size: var(--text-lg); }
.news-card__title a { text-decoration: none; }
.news-card__title a:hover { color: var(--color-accent-hover); }
.news-card__excerpt { margin: 0; font-size: var(--text-sm); color: var(--color-text-soft); }
.news-card__more { font-weight: 600; font-size: var(--text-sm); text-decoration: none; }

/* ==========================================================================
   Page hero extras
   ========================================================================== */
.page-hero__kicker a { color: inherit; text-decoration: none; }
.page-hero__kicker a:hover { text-decoration: underline; }
.page-hero__lead { max-width: 44rem; margin: var(--space-4) 0 0; color: var(--v-cream); }
.page-hero--tall { padding-block: var(--space-16); }
.page-hero--tall .hero__actions { margin-top: var(--space-6); justify-content: flex-start; }

/* ==========================================================================
   Service page content
   ========================================================================== */
.service-content { min-width: 0; }
.service-content__image { margin: 0 0 var(--space-8); }
.service-content__image img { border-radius: var(--radius-md); display: block; width: 100%; aspect-ratio: 12 / 7; object-fit: cover; }
.service-content__intro { font-size: var(--text-lg); color: var(--color-text-soft); }
.service-content h2 { font-family: var(--font-display); font-size: var(--text-xl); margin-top: var(--space-12); }
.help-grid { display: grid; gap: var(--space-4); margin-block: var(--space-6); }
@media (min-width: 700px) {
	.help-grid { grid-template-columns: 1fr 1fr; }
}
.help-card {
	background: var(--color-surface-alt);
	border-radius: var(--radius-md);
	padding: var(--space-6);
	border-left: 4px solid var(--color-accent);
}
.help-card__title { margin: 0 0 var(--space-2); font-size: var(--text-base); }
.help-card p { margin: 0; font-size: var(--text-sm); color: var(--color-text-soft); }
.check-list { list-style: none; margin: var(--space-4) 0 var(--space-8); padding: 0; display: grid; gap: var(--space-3); }
.check-list li { padding-left: var(--space-8); position: relative; }
.check-list li::before {
	content: "";
	position: absolute; left: 0; top: 0.28em;
	width: 14px; height: 8px;
	border-left: 3px solid var(--color-accent);
	border-bottom: 3px solid var(--color-accent);
	transform: rotate(-45deg);
}
.related-services { margin-top: var(--space-12); }

/* ==========================================================================
   Chips
   ========================================================================== */
.chip-list { list-style: none; margin: var(--space-4) 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-3); }
.chip-list--center { justify-content: center; }
.chip {
	display: inline-block;
	padding: 0.55em 1.2em;
	border-radius: var(--radius-pill);
	border: 1px solid var(--v-olive-500);
	color: var(--color-primary);
	background: var(--color-surface);
	text-decoration: none;
	font-size: var(--text-sm);
	font-weight: 500;
}
a.chip:hover { background: var(--color-accent); color: var(--color-text-invert); }
.chip--static { cursor: default; }

/* ==========================================================================
   Services hub
   ========================================================================== */
.hub-grid { display: grid; gap: var(--space-6); margin-bottom: var(--space-16); }
@media (min-width: 700px) { .hub-grid { grid-template-columns: 1fr 1fr; } }
.hub-card {
	display: flex; flex-direction: column;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card);
	overflow: hidden;
	text-decoration: none;
	color: var(--color-text);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.hub-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-card-hover); }
.hub-card__media img { display: block; width: 100%; aspect-ratio: 16 / 8; object-fit: cover; }
.hub-card__body { padding: var(--space-6); display: grid; gap: var(--space-2); position: relative; }
.hub-card__icon {
	position: absolute; top: calc(-1 * var(--space-6)); right: var(--space-6);
	display: grid; place-items: center;
	width: 52px; height: 52px;
	border-radius: 50%;
	background: var(--color-primary);
	color: var(--color-text-invert);
	box-shadow: var(--shadow-card);
}
.hub-card__icon .icon { width: 26px; height: 26px; }
.hub-card__name { font-family: var(--font-display); font-size: var(--text-xl); color: var(--color-primary); font-weight: 600; }
.hub-card__desc { color: var(--color-text-soft); font-size: var(--text-sm); }
.hub-card__more { color: var(--v-olive-600); font-weight: 600; font-size: var(--text-sm); }

/* ==========================================================================
   Contact page
   ========================================================================== */
.contact-layout { display: grid; gap: var(--space-8); margin-bottom: var(--space-16); }
@media (min-width: 860px) {
	.contact-layout { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
}
.contact-layout__form h2 { font-family: var(--font-display); margin-top: 0; }
.contact-layout__info { display: grid; gap: var(--space-4); align-content: start; }
.info-card {
	background: var(--color-surface-alt);
	border-radius: var(--radius-md);
	padding: var(--space-6);
}
.info-card h3 {
	margin: 0 0 var(--space-2);
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
}
.info-card p { margin: 0 0 var(--space-2); }
.info-card__big { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 600; text-decoration: none; }
.info-card__note { color: var(--color-text-soft); font-size: var(--text-sm); }

/* ==========================================================================
   Benefits (partner / about values)
   ========================================================================== */
.benefits { padding-block: var(--space-16); }
.benefits__grid { display: grid; gap: var(--space-4); }
@media (min-width: 700px) { .benefits__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .benefits__grid { grid-template-columns: repeat(4, 1fr); } }
.benefit {
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	padding: var(--space-6);
	box-shadow: var(--shadow-card);
}
.benefit h3 { margin: 0 0 var(--space-2); font-size: var(--text-base); }
.benefit p { margin: 0; font-size: var(--text-sm); color: var(--color-text-soft); }
.who-partners { padding-block: 0 var(--space-16); }

/* ==========================================================================
   Image page hero (inner pages with a photographic banner)
   ========================================================================== */
.page-hero--image { position: relative; overflow: hidden; }
.page-hero--image > .container { position: relative; z-index: 2; }
.page-hero__img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	z-index: 0;
}
.page-hero__scrim {
	position: absolute; inset: 0;
	z-index: 1;
	background:
		linear-gradient(100deg,
			rgba(var(--v-green-900-rgb), 0.95) 0%,
			rgba(var(--v-green-900-rgb), 0.80) 45%,
			rgba(var(--v-green-900-rgb), 0.45) 78%,
			rgba(var(--v-green-900-rgb), 0.30) 100%),
		linear-gradient(0deg, rgba(var(--v-green-900-rgb), 0.75) 0%, transparent 45%);
}

/* ==========================================================================
   Partner page — stats band
   ========================================================================== */
.stats-band {
	background:
		radial-gradient(40rem 20rem at 20% 0%, rgba(169, 168, 107, 0.14), transparent 65%),
		var(--v-green-900);
	color: var(--color-text-invert);
	padding-block: var(--space-12);
}
.stats-band__grid { display: grid; gap: var(--space-8); text-align: center; }
@media (min-width: 560px) { .stats-band__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) { .stats-band__grid { grid-template-columns: repeat(4, 1fr); } }
.stat { display: grid; gap: var(--space-2); justify-items: center; }
.stat__num {
	font-family: var(--font-display);
	font-size: clamp(var(--text-3xl), 6vw, var(--text-4xl));
	font-weight: 700;
	line-height: 1;
	color: var(--v-olive-300);
}
.stat__label { font-size: var(--text-sm); color: var(--v-cream); max-width: 14rem; line-height: 1.5; }

/* ==========================================================================
   Partner page — "sound familiar?" scenarios
   ========================================================================== */
.scenarios { padding-block: var(--space-20); background: var(--color-surface-alt); }
.scenario-grid { display: grid; gap: var(--space-6); }
@media (min-width: 700px) { .scenario-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .scenario-grid { grid-template-columns: repeat(3, 1fr); } }
.scenario {
	position: relative;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-left: 3px solid var(--color-accent);
	border-radius: var(--radius-md);
	padding: var(--space-6);
	box-shadow: var(--shadow-card);
	display: flex; flex-direction: column; gap: var(--space-4);
	transition: transform 0.28s cubic-bezier(.2,.7,.3,1), box-shadow 0.28s ease;
}
.scenario:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.scenario__quote {
	margin: 0;
	font-size: var(--text-base);
	line-height: 1.6;
	color: var(--color-text);
}
.scenario__who {
	margin: auto 0 0;
	font-size: var(--text-xs);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--color-text-soft);
}
.scenario__who a { color: var(--v-olive-600); text-decoration: none; }
.scenario__who a:hover { color: var(--color-primary); text-decoration: underline; }

/* ==========================================================================
   Partner page — sector cards
   ========================================================================== */
.sectors { padding-block: 0 var(--space-20); }
.sector-grid { display: grid; gap: var(--space-4); }
@media (min-width: 640px) { .sector-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .sector-grid { grid-template-columns: repeat(3, 1fr); } }
.sector {
	position: relative;
	overflow: hidden;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	padding: 0 var(--space-6) var(--space-6);
	box-shadow: var(--shadow-card);
	transition: transform 0.28s cubic-bezier(.2,.7,.3,1), box-shadow 0.28s ease;
}
.sector:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.sector__media {
	display: block;
	overflow: hidden;
	margin: 0 calc(-1 * var(--space-6)) var(--space-4);
	aspect-ratio: 16 / 9;
	background: var(--v-green-100);
}
.sector__media img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.6s cubic-bezier(.2,.7,.3,1);
}
.sector:hover .sector__media img { transform: scale(1.06); }
.sector__icon {
	display: grid; place-items: center;
	width: 46px; height: 46px;
	border-radius: 50%;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	box-shadow: var(--shadow-card);
	color: var(--color-primary);
	margin: calc(-1 * var(--space-8)) 0 var(--space-3);
	position: relative;
	z-index: 1;
	transition: background 0.25s ease, color 0.25s ease;
}
.sector:hover .sector__icon { background: var(--color-primary); color: var(--color-text-invert); }
.sector__icon .icon { width: 23px; height: 23px; }
.sector h3 { margin: 0 0 var(--space-2); font-size: var(--text-base); }
.sector p { margin: 0; font-size: var(--text-sm); color: var(--color-text-soft); }

/* ==========================================================================
   Partner page — service image tiles ("what your clients get")
   ========================================================================== */
.service-tiles {
	display: grid;
	gap: var(--space-4);
	grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
}
.service-tile {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	border-radius: var(--radius-md);
	background: var(--color-primary);
	box-shadow: var(--shadow-card);
	text-decoration: none;
	transition: transform 0.28s cubic-bezier(.2,.7,.3,1), box-shadow 0.28s ease;
}
.service-tile:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.service-tile img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(.2,.7,.3,1);
}
.service-tile:hover img { transform: scale(1.08); }
.service-tile__scrim {
	position: absolute; inset: 0;
	background: linear-gradient(0deg, rgba(var(--v-green-900-rgb), 0.88) 8%, rgba(var(--v-green-900-rgb), 0.25) 60%, transparent 100%);
	transition: background 0.28s ease;
}
.service-tile:hover .service-tile__scrim {
	background: linear-gradient(0deg, rgba(var(--v-green-900-rgb), 0.92) 15%, rgba(var(--v-green-900-rgb), 0.45) 70%, rgba(var(--v-green-900-rgb), 0.15) 100%);
}
.service-tile__label {
	position: absolute; left: var(--space-4); right: var(--space-4); bottom: var(--space-4);
	color: var(--color-text-invert);
	font-family: var(--font-display);
	font-weight: 600;
	font-size: var(--text-base);
	line-height: 1.15;
}

/* Reversed media/copy order for alternating image bands */
@media (min-width: 860px) {
	.about-band--reverse .about-band__inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
	.about-band--reverse .about-band__media { order: 2; }
	.about-band--reverse .about-band__copy { order: 1; }
	.about-band--reverse .about-band__frame {
		inset: var(--space-4) var(--space-4) calc(-1 * var(--space-4)) calc(-1 * var(--space-4));
	}
}

/* ==========================================================================
   Partner page — partnership tiers
   ========================================================================== */
.tiers { padding-block: var(--space-20); background: var(--v-green-100); }
.tier-grid { display: grid; gap: var(--space-6); align-items: start; }
@media (min-width: 900px) { .tier-grid { grid-template-columns: repeat(3, 1fr); } }
.tier {
	position: relative;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	padding: var(--space-8) var(--space-6);
	box-shadow: var(--shadow-card);
	height: 100%;
}
.tier--featured {
	border: 2px solid var(--color-accent);
	box-shadow: var(--shadow-card-hover);
}
@media (min-width: 900px) {
	.tier--featured { transform: translateY(-10px); }
}
.tier__badge {
	position: absolute; top: calc(-1 * var(--space-3)); left: 50%;
	transform: translateX(-50%);
	background: var(--color-accent);
	color: var(--color-text-invert);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 4px 14px;
	border-radius: var(--radius-pill);
	white-space: nowrap;
}
.tier__name {
	margin: 0 0 var(--space-1);
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 600;
	color: var(--color-primary);
}
.tier__for {
	margin: 0 0 var(--space-4);
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
	font-weight: 600;
}
.tier .check-list { margin: 0; gap: var(--space-2); }
.tier .check-list li { font-size: var(--text-sm); }

/* ==========================================================================
   Partner page — client services chips band
   ========================================================================== */
.client-gets { padding-block: var(--space-20); }

/* Four-across step grids (partner "how it works") */
@media (min-width: 700px) {
	.steps__grid--four { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
	.steps__grid--four { grid-template-columns: repeat(4, 1fr); }
}

/* Tick list on dark backgrounds */
.check-list--invert li { color: var(--v-cream); }
.check-list--invert li::before {
	border-left-color: var(--v-olive-300);
	border-bottom-color: var(--v-olive-300);
}

/* ==========================================================================
   Partner form band
   ========================================================================== */
.partner-form-band { background: var(--color-primary); color: var(--color-text-invert); padding-block: var(--space-16); }
.partner-form-band__inner { display: grid; gap: var(--space-8); align-items: start; }
@media (min-width: 860px) {
	.partner-form-band__inner { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); }
}
.partner-form-band .section-head__kicker { color: var(--v-olive-300); }
.partner-form-band .section-head__title { color: var(--color-text-invert); }
.partner-form-band__intro p { color: var(--v-cream); }
.partner-form-band__phone {
	color: var(--v-olive-300);
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 600;
	text-decoration: none;
}
.partner-form-band__form {
	background: var(--color-surface);
	color: var(--color-text);
	border-radius: var(--radius-md);
	padding: var(--space-8);
	box-shadow: var(--shadow-card-hover);
}

/* ==========================================================================
   Forms
   ========================================================================== */
.enquiry-form { display: grid; gap: var(--space-4); }
.form-row { display: grid; gap: var(--space-4); }
@media (min-width: 700px) { .form-row { grid-template-columns: 1fr 1fr; } }
.form-field { margin: 0; display: grid; gap: var(--space-1); }
.form-field label { font-weight: 600; font-size: var(--text-sm); color: var(--color-primary); }
.form-field .req { color: var(--color-accent-hover); }
.form-field input:not([type="checkbox"]),
.form-field select,
.form-field textarea {
	width: 100%;
	font: inherit;
	color: var(--color-text);
	background: var(--color-surface);
	border: 1px solid var(--v-olive-500);
	border-radius: var(--radius-sm);
	padding: 0.65em 0.9em;
}
.form-field input:focus-visible,
.form-field select:focus-visible,
.form-field textarea:focus-visible {
	outline: 2px solid var(--color-accent);
	outline-offset: 1px;
}
.form-field textarea { resize: vertical; }
.form-field--consent label { display: flex; gap: var(--space-3); align-items: flex-start; font-weight: 400; color: var(--color-text-soft); font-size: var(--text-sm); }
.form-field--consent input { margin-top: 0.3em; }
.form-submit { margin: 0; display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.form-submit .btn { border: 0; cursor: pointer; font-family: inherit; }
.form-privacy { font-size: var(--text-xs); color: var(--color-text-soft); letter-spacing: var(--tracking-caps); text-transform: uppercase; }
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; margin: 0; }
.form-notice { border-radius: var(--radius-sm); padding: var(--space-4); font-size: var(--text-sm); }
.form-notice--ok { background: var(--v-green-100); border-left: 4px solid var(--color-primary); }
.form-notice--error { background: var(--v-cream); border-left: 4px solid var(--color-accent-hover); }

/* Mini form in the service side-card: compact and full-width submit */
.enquiry-form--mini { gap: var(--space-3); width: 100%; }
.enquiry-form--mini .form-field input:not([type="checkbox"]),
.enquiry-form--mini .form-field select,
.enquiry-form--mini .form-field textarea { padding: 0.5em 0.75em; }
.enquiry-form--mini .form-submit .btn { width: 100%; text-align: center; }
.enquiry-form--mini .form-privacy { display: none; }
.contact-card .leadstack { width: 100%; }
body .contact-card .leadstack .ls-submit { width: 100%; }
body .contact-card .leadstack input,
body .contact-card .leadstack select,
body .contact-card .leadstack textarea { padding: 9px 12px; }
.contact-card__rule { width: 100%; border: 0; border-top: 1px solid var(--v-olive-300); margin: var(--space-2) 0; }
.contact-card__form-title { margin: 0; font-size: var(--text-base); }
.contact-card { max-height: none; }
@media (max-width: 859px) { .contact-card { position: static; } }

/* ==========================================================================
   MD intro quote (about)
   ========================================================================== */
.md-intro { padding-block: var(--space-16); background: var(--color-primary); }
.md-intro__quote { margin: 0 auto; max-width: 46rem; text-align: center; }
.md-intro__quote p {
	font-family: var(--font-display);
	font-size: clamp(var(--text-lg), 3vw, var(--text-xl));
	color: var(--color-text-invert);
	margin: 0 0 var(--space-6);
}
.md-intro__quote footer { display: grid; gap: var(--space-1); }
.md-intro__quote strong { color: var(--v-olive-300); font-size: var(--text-base); }
.md-intro__quote span { color: var(--v-cream); font-size: var(--text-xs); letter-spacing: var(--tracking-caps); text-transform: uppercase; }

/* ==========================================================================
   Entry typography + pagination
   ========================================================================== */
.entry h2 { font-family: var(--font-display); }
.entry a { color: var(--color-accent-hover); }
.pagination-wrap { margin-bottom: var(--space-16); }
.pagination-wrap .nav-links { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.pagination-wrap .page-numbers {
	display: inline-block;
	padding: 0.4em 0.9em;
	border: 1px solid var(--v-olive-500);
	border-radius: var(--radius-sm);
	text-decoration: none;
}
.pagination-wrap .page-numbers.current { background: var(--color-primary); color: var(--color-text-invert); border-color: var(--color-primary); }

/* ==========================================================================
   Buttons: arrow variant
   ========================================================================== */
.btn--arrow::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.6em;
	transition: transform 0.18s ease;
}
.btn--arrow:hover::after { transform: translateX(4px); }

/* ==========================================================================
   Nav: animated underline
   ========================================================================== */
.nav-menu a { position: relative; padding-bottom: 4px; }
.nav-menu a::after {
	content: "";
	position: absolute; left: 0; bottom: 0;
	width: 100%; height: 1px;
	background: var(--v-olive-300);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.22s ease;
}
.nav-menu a:hover::after,
.nav-menu .current-menu-item a::after { transform: scaleX(1); }
.nav-menu .mega-link::after { display: none; } /* panel links use bg hover, not the underline */

/* ==========================================================================
   Manifesto band
   ========================================================================== */
.manifesto { padding-block: var(--space-20); background: var(--color-surface); }
.manifesto__inner { max-width: 50rem; margin-inline: auto; text-align: center; }
.manifesto__statement {
	font-family: var(--font-display);
	font-size: clamp(var(--text-xl), 3.4vw, var(--text-2xl));
	font-weight: 500;
	line-height: 1.4;
	color: var(--color-primary);
	margin: var(--space-4) 0 var(--space-8);
}
.manifesto__rule {
	display: inline-block;
	width: 4rem; height: 2px;
	background: var(--color-accent);
}

/* ==========================================================================
   About band: frame, floating card, signature row
   ========================================================================== */
.about-band__media { position: relative; }
.about-band__media img { position: relative; z-index: 1; }
.about-band__frame {
	position: absolute; inset: var(--space-4) calc(-1 * var(--space-4)) calc(-1 * var(--space-4)) var(--space-4);
	border: 1px solid var(--v-olive-500);
	border-radius: var(--radius-md);
	z-index: 0;
}
.about-band__card {
	position: absolute; right: calc(-1 * var(--space-2)); top: var(--space-6);
	z-index: 2;
	margin: 0;
	background: var(--color-primary);
	color: var(--color-text-invert);
	border-radius: var(--radius-sm);
	padding: var(--space-3) var(--space-6);
	font-size: var(--text-xs);
	box-shadow: var(--shadow-card-hover);
	display: grid;
}
.about-band__card strong { font-family: var(--font-display); font-size: var(--text-base); color: var(--v-olive-300); }
.check-list--tight { margin-block: var(--space-6); }
.check-list--tight strong { color: var(--color-primary); }
.about-band__sig {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: var(--space-6);
	margin-top: var(--space-6);
}
.about-band__md { margin: 0; display: grid; line-height: 1.3; }
.about-band__md strong { font-family: var(--font-display); font-size: var(--text-lg); color: var(--color-primary); }
.about-band__md span {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
}

/* ==========================================================================
   Commitments band (dark green)
   ========================================================================== */
.commitments {
	background:
		radial-gradient(46rem 26rem at 100% 100%, rgba(169, 168, 107, 0.10), transparent 65%),
		var(--v-green-900);
	color: var(--color-text-invert);
	padding-block: var(--space-20);
}
.commitments .section-head__kicker { color: var(--v-olive-300); }
.commitments .section-head__title { color: var(--color-text-invert); }
.commitments__grid { display: grid; gap: var(--space-8) var(--space-6); }
@media (min-width: 700px) { .commitments__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .commitments__grid { grid-template-columns: repeat(4, 1fr); } }
.commitment { border-top: 1px solid var(--v-olive-500); padding-top: var(--space-6); }
.commitment__index {
	font-family: var(--font-display);
	font-size: var(--text-xl);
	color: var(--v-olive-300);
}
.commitment h3 { color: var(--color-text-invert); font-size: var(--text-base); margin: var(--space-3) 0 var(--space-2); }
.commitment p { margin: 0; font-size: var(--text-sm); color: var(--v-cream); line-height: var(--leading-body); }

/* ==========================================================================
   Consultation band (green, embedded form)
   ========================================================================== */
.consult-band {
	background:
		radial-gradient(50rem 30rem at 0% 0%, rgba(169, 168, 107, 0.12), transparent 60%),
		var(--color-primary);
	color: var(--color-text-invert);
	padding-block: var(--space-20);
}
.consult-band__inner { display: grid; gap: var(--space-8); align-items: start; }
@media (min-width: 860px) {
	.consult-band__inner { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
}
.consult-band .section-head__kicker { color: var(--v-olive-300); }
.consult-band .section-head__title { color: var(--color-text-invert); }
.consult-band__intro > p { color: var(--v-cream); }
.consult-band__alt {
	margin-top: var(--space-8);
	border-left: 2px solid var(--v-olive-500);
	padding-left: var(--space-6);
	display: grid; gap: var(--space-1);
}
.consult-band__alt-label {
	margin: 0;
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-300);
}
.consult-band__phone {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 600;
	color: var(--color-text-invert);
	text-decoration: none;
	line-height: 1.15;
}
.consult-band__phone:hover { color: var(--v-olive-300); }
.consult-band__hours { margin: 0; font-size: var(--text-xs); color: var(--v-cream); }
.consult-band__form {
	background: var(--color-surface);
	color: var(--color-text);
	border-radius: var(--radius-md);
	padding: var(--space-8);
	box-shadow: var(--shadow-card-hover);
}

/* ==========================================================================
   Mega dropdown (Services)
   ========================================================================== */
@media (min-width: 861px) {
	.nav-menu { align-items: center; }
}
.nav-mega-toggle {
	display: inline-flex; align-items: center; gap: 7px;
	-webkit-appearance: none; appearance: none;
	background: none; border: 0; border-radius: 0; cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	color: var(--color-text-invert);
	font: inherit; font-size: var(--text-sm); font-weight: 500;
	padding: 0 0 4px;
}
.nav-mega-toggle:hover { color: var(--v-olive-300); }
.nav-caret {
	width: 7px; height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform 0.2s ease;
}
.nav-item--mega.is-open .nav-caret { transform: rotate(225deg) translateY(2px); }

.mega-link {
	display: flex; align-items: center; gap: var(--space-3);
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-sm);
	text-decoration: none;
}
.mega-link__icon {
	flex: 0 0 auto;
	display: grid; place-items: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	background: var(--v-green-100);
	color: var(--color-primary);
}
.mega-link__icon .icon { width: 20px; height: 20px; }
.mega-link__body { display: grid; gap: 1px; min-width: 0; }
.mega-link__name { font-weight: 600; font-size: var(--text-sm); color: var(--color-primary); }
.mega-link__desc { font-size: var(--text-xs); color: var(--color-text-soft); }

@media (min-width: 861px) {
	.mega-panel {
		position: absolute; left: 0; right: 0; top: 100%;
		z-index: 60;
		/* Solid fill — must fully hide the hero slide behind it. */
		background: var(--color-surface);
		border-top: 3px solid var(--color-accent);
		border-radius: 0 0 var(--radius-md) var(--radius-md);
		box-shadow: 0 28px 48px rgba(var(--v-green-900-rgb), 0.28);
		opacity: 0; visibility: hidden;
		transform: translateY(10px);
		transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
		z-index: 60;
	}
	.nav-item--mega:hover .mega-panel,
	.nav-item--mega:focus-within .mega-panel,
	.nav-item--mega.is-open .mega-panel {
		opacity: 1; visibility: visible; transform: none;
	}
	.mega-panel__inner {
		display: grid;
		grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
		gap: var(--space-8);
		padding-block: var(--space-8);
	}
	.mega-panel__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-1) var(--space-4); align-content: start; }
	.mega-link:hover { background: var(--color-surface-alt); }
	.mega-panel__aside {
		border-left: 1px solid var(--v-olive-300);
		padding-left: var(--space-8);
		display: grid; gap: var(--space-4);
		align-content: start;
		justify-items: start;
	}
	.mega-panel__aside-kicker {
		margin: 0;
		font-size: var(--text-xs);
		letter-spacing: var(--tracking-caps);
		text-transform: uppercase;
		color: var(--v-olive-600);
		font-weight: 600;
	}
	.mega-panel__aside-text { margin: 0; font-size: var(--text-sm); color: var(--color-text-soft); line-height: 1.55; }
	.mega-panel__aside .btn { margin-top: var(--space-1); }
	.mega-panel__all {
		font-weight: 600;
		font-size: var(--text-sm);
		text-decoration: none;
		color: var(--color-primary);
	}
	.mega-panel__all:hover { color: var(--color-accent-hover); }
}

@media (max-width: 860px) {
	.nav-item--mega { width: 100%; }
	.nav-mega-toggle { width: 100%; justify-content: space-between; padding-block: var(--space-4); }
	.mega-panel { display: none; }
	.nav-item--mega.is-open .mega-panel { display: block; }
	.mega-panel__inner { display: grid; gap: 0; padding: 0 0 var(--space-4); }
	.mega-panel__grid { display: grid; gap: var(--space-1); }

	/* Compact rows: icon beside label, indent guide line for hierarchy. */
	.nav-menu .mega-link {
		display: flex; align-items: center; gap: var(--space-3);
		padding: var(--space-2) 0 var(--space-2) var(--space-4);
		border-left: 1px solid rgba(255, 255, 255, 0.16);
		border-radius: 0;
		font-size: var(--text-base);
	}
	.mega-link__icon {
		background: rgba(255, 255, 255, 0.10);
		color: var(--color-text-invert);
		width: 34px; height: 34px;
		flex: 0 0 auto;
	}
	.mega-link__icon .icon { width: 18px; height: 18px; }
	.nav-menu .mega-link .mega-link__name {
		color: var(--color-text-invert);
		font-size: var(--text-base);
		font-weight: 500;
	}
	.mega-link__desc { display: none; }

	/* Keep only the "View all services" link from the aside. */
	.mega-panel__aside {
		border-left: 1px solid rgba(255, 255, 255, 0.16);
		padding-left: var(--space-4);
	}
	.mega-panel__aside-kicker,
	.mega-panel__aside-text,
	.mega-panel__aside .btn { display: none; }
	.mega-panel__all {
		display: inline-block;
		color: var(--v-olive-300);
		font-weight: 600;
		text-decoration: none;
		padding: var(--space-2) 0;
		font-size: var(--text-sm);
	}
}

/* ==========================================================================
   Hero image slider (welcome + one slide per service)
   ========================================================================== */
.hero-slider {
	position: relative;
	background: var(--v-green-900);
	overflow: hidden;
}
.hero-slider__track {
	position: relative;
	height: min(78vh, 42rem);
	min-height: 30rem;
}
.hero-slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.9s ease, visibility 0.9s;
	pointer-events: none;
}
.hero-slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 1;
}
.hero-slide__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
@media (prefers-reduced-motion: no-preference) {
	.hero-slide.is-active .hero-slide__img { animation: v-kenburns 9s ease-out forwards; }
}
@keyframes v-kenburns {
	from { transform: scale(1.08); }
	to   { transform: scale(1); }
}
.hero-slide__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg,
			rgba(var(--v-green-900-rgb), 0.94) 0%,
			rgba(var(--v-green-900-rgb), 0.72) 42%,
			rgba(var(--v-green-900-rgb), 0.28) 75%,
			rgba(var(--v-green-900-rgb), 0.15) 100%),
		linear-gradient(0deg, rgba(var(--v-green-900-rgb), 0.85) 0%, transparent 30%);
}
.hero-slide__content {
	position: relative;
	z-index: 1;
	width: 100%;
	color: var(--color-text-invert);
	padding-bottom: var(--space-12); /* clears the tab bar */
}
.hero-slide__kicker {
	display: flex; align-items: center; gap: var(--space-3);
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-300);
	font-weight: 600;
	margin: 0 0 var(--space-4);
}
.hero-slide__title {
	font-family: var(--font-display);
	font-size: clamp(var(--text-2xl), 5.2vw, var(--text-4xl));
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.015em;
	line-height: 1.08;
	color: var(--color-text-invert);
	margin: 0 0 var(--space-4);
	max-width: 16em;
}
.hero-slide__title em { color: var(--v-olive-300); font-style: normal; }
.hero-slide__lead {
	max-width: 34rem;
	margin: 0 0 var(--space-8);
	color: var(--v-cream);
	font-size: var(--text-lg);
}
.hero-slide .hero__actions { justify-content: flex-start; }

.hero-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 48px; height: 48px;
	display: grid; place-items: center;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.35);
	background: rgba(var(--v-green-900-rgb), 0.35);
	color: var(--color-text-invert);
	font-size: var(--text-lg);
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
	.hero-slider__arrow {
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
	}
}
.hero-slider__arrow:hover { background: var(--color-accent); border-color: var(--color-accent); }
.hero-slider__arrow--prev { left: var(--space-4); }
.hero-slider__arrow--next { right: var(--space-4); }
@media (max-width: 700px) {
	.hero-slider__arrow { width: 40px; height: 40px; top: auto; bottom: 5.2rem; transform: none; }
}

.hero-slider__tabs-wrap {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 2;
	background: rgba(var(--v-green-900-rgb), 0.55);
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
	.hero-slider__tabs-wrap {
		-webkit-backdrop-filter: blur(12px) saturate(1.3);
		backdrop-filter: blur(12px) saturate(1.3);
	}
}
.hero-slider__tabs {
	display: flex;
	gap: var(--space-2);
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.hero-slider__tabs::-webkit-scrollbar { display: none; }
.hero-slider__tab {
	flex: 0 0 auto;
	background: none;
	border: 0;
	border-top: 2px solid transparent;
	color: var(--v-cream);
	font: inherit;
	font-size: var(--text-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-weight: 600;
	padding: var(--space-3) var(--space-3);
	cursor: pointer;
	white-space: nowrap;
	opacity: 0.75;
	transition: opacity 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.hero-slider__tab:hover { opacity: 1; }
.hero-slider__tab.is-active {
	color: var(--v-olive-300);
	border-top-color: var(--v-olive-500);
	opacity: 1;
}

.facts-band { background: var(--v-green-900); padding-block: 0 var(--space-2); }
.facts-band .hero__facts {
	margin-top: 0;
	border-radius: 0 0 var(--radius-md) var(--radius-md);
	border-top: 0;
}

/* ==========================================================================
   Hero typing effect
   ========================================================================== */
/* The typed segment lives on exactly ONE line, always: nowrap kills the
   hop between lines mid-typing, a fixed height kills vertical shift, and
   on phones the typed line scales down so the longest phrase still fits. */
.hero__type-line {
	display: block;
	white-space: nowrap;
	min-height: 1.18em;
	line-height: 1.18;
}
.hero__type-line + br { display: none; }
@media (max-width: 760px) {
	.hero__type-line {
		font-size: 0.7em;
		line-height: 1.3;
		min-height: 1.3em;
	}
}
.hero__caret {
	display: inline-block;
	width: 3px;
	height: 0.82em;
	margin-left: 0.08em;
	background: var(--v-olive-300);
	vertical-align: baseline;
	transform: translateY(0.12em);
}
@media (prefers-reduced-motion: no-preference) {
	.js-typing .hero__caret { animation: v-blink 1.05s steps(1) infinite; }
}
@keyframes v-blink { 50% { opacity: 0; } }
/* Caret only shows once JS confirms it will animate. */
.hero__caret { opacity: 0; }
.js-typing .hero__caret { opacity: 1; }

/* ==========================================================================
   Testimonials — homepage slider + page grid
   ========================================================================== */
.testimonials {
	background:
		radial-gradient(44rem 26rem at 15% 0%, rgba(169, 168, 107, 0.12), transparent 62%),
		var(--v-green-900);
	color: var(--color-text-invert);
	padding-block: var(--space-20);
	text-align: center;
}
.testimonials__inner { max-width: 52rem; margin-inline: auto; }
.testimonials .section-head__kicker { color: var(--v-olive-300); }
.testimonial-slide { display: none; margin: 0; }
.testimonial-slide.is-active { display: block; }
@media (prefers-reduced-motion: no-preference) {
	.testimonial-slide.is-active { animation: v-fade-up 0.5s ease; }
}
@keyframes v-fade-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.testimonial-slide__quote {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: clamp(var(--text-lg), 3.2vw, var(--text-2xl));
	line-height: 1.45;
	margin: var(--space-4) 0 var(--space-6);
}
.testimonial-slide__quote::before { content: "\201C"; color: var(--v-olive-300); }
.testimonial-slide__quote::after { content: "\201D"; color: var(--v-olive-300); }
.testimonial-slide footer { display: grid; gap: 2px; }
.testimonial-slide footer strong { color: var(--v-olive-300); font-size: var(--text-base); }
.testimonial-slide footer span {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-cream);
}
.testimonials__dots { display: flex; gap: var(--space-2); justify-content: center; margin-top: var(--space-6); }
.testimonials__dots button {
	width: 9px; height: 9px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}
.testimonials__dots button.is-active { background: var(--v-olive-300); transform: scale(1.25); }
.testimonials__all {
	display: inline-block;
	margin-top: var(--space-8);
	color: var(--v-olive-300);
	font-weight: 600;
	text-decoration: none;
	font-size: var(--text-sm);
}
.testimonials__all:hover { color: var(--color-text-invert); }

.testimonial-page { margin-bottom: var(--space-16); }
.testimonial-grid { display: grid; gap: var(--space-6); margin-top: var(--space-4); }
@media (min-width: 700px) { .testimonial-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .testimonial-grid { grid-template-columns: repeat(3, 1fr); } }
.testimonial-card {
	margin: 0;
	background: var(--color-surface);
	border: 1px solid var(--v-olive-300);
	border-top: 3px solid var(--v-olive-500);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card);
	padding: var(--space-8) var(--space-6) var(--space-6);
	display: flex; flex-direction: column;
	position: relative;
}
.testimonial-card__mark {
	position: absolute; top: var(--space-2); left: var(--space-4);
	font-family: var(--font-display);
	font-size: var(--text-4xl);
	line-height: 1;
	color: var(--v-green-100);
}
.testimonial-card__quote { position: relative; margin: 0 0 var(--space-4); color: var(--color-text-soft); font-style: italic; }
.testimonial-card footer { margin-top: auto; display: grid; gap: 2px; }
.testimonial-card footer strong { color: var(--color-primary); }
.testimonial-card footer span {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
}
.testimonial-page__note {
	margin-top: var(--space-8);
	color: var(--color-text-soft);
	font-size: var(--text-sm);
	text-align: center;
}

/* ==========================================================================
   Footer v2 — big-company layout
   ========================================================================== */
.site-footer__grid { grid-template-columns: 1fr; }
@media (min-width: 700px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .site-footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: var(--space-12); } }
.site-footer__brand p { color: var(--v-cream); font-size: var(--text-sm); max-width: 26rem; }
.site-footer__trust { color: var(--v-olive-300); font-size: var(--text-sm); }
.site-footer__cta { margin-top: var(--space-4); justify-self: start; }
.site-footer__all { color: var(--v-olive-300) !important; font-weight: 600; }
.site-footer__phone { margin: 0 0 var(--space-4); display: grid; gap: 2px; }
.site-footer__phone a {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
	font-weight: 600;
	color: var(--v-olive-300);
	text-decoration: none;
	line-height: 1.15;
}
.site-footer__phone span { font-size: var(--text-xs); color: var(--v-cream); }
.site-footer__legal-inner span { max-width: 46rem; color: var(--v-cream); opacity: 0.85; }

/* ==========================================================================
   Smooth scrolling + scroll progress bar
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}
html { scroll-padding-top: 6rem; } /* sticky header clearance for #anchors */

.scroll-progress {
	position: fixed; top: 0; left: 0;
	height: 3px;
	width: 100%;
	transform: scaleX(0);
	transform-origin: 0 50%;
	background: linear-gradient(90deg, var(--v-olive-500), var(--v-olive-300));
	z-index: 60;
	pointer-events: none;
}

/* ==========================================================================
   Interaction polish — lifts, image zooms, link underlines
   ========================================================================== */
.hub-card__media img,
.news-card__media img { transition: transform 0.6s cubic-bezier(.2,.7,.3,1); }
.hub-card:hover .hub-card__media img,
.news-card:hover .news-card__media img { transform: scale(1.06); }
.hub-card, .news-card, .step, .benefit, .testimonial-card {
	transition: transform 0.28s cubic-bezier(.2,.7,.3,1), box-shadow 0.28s ease;
}
.step:hover, .benefit:hover, .testimonial-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-card-hover);
}
.btn { transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; }
.btn:active { transform: translateY(1px); }
.footer-cta .btn:hover, .hero__actions .btn:hover { transform: translateY(-2px); }
.site-footer__col a,
.faq-item__q { transition: color 0.2s ease; }
.commitment { transition: border-color 0.3s ease; }
.commitment:hover { border-top-color: var(--v-olive-300); }

/* ==========================================================================
   Floating WhatsApp chat launcher
   ========================================================================== */
.wa-float {
	position: fixed;
	right: clamp(0.9rem, 3vw, 1.75rem);
	bottom: clamp(0.9rem, 3vw, 1.75rem);
	z-index: 70;
	display: flex; align-items: flex-end; gap: var(--space-3);
}
.wa-float__btn {
	position: relative;
	display: grid; place-items: center;
	width: 58px; height: 58px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: #25D366; /* WhatsApp brand green — intentional exception */
	color: #fff;
	box-shadow: 0 10px 26px rgba(var(--v-green-900-rgb), 0.32);
	transition: transform 0.25s cubic-bezier(.2,.7,.3,1), box-shadow 0.25s ease;
}
.wa-float__btn:hover { transform: scale(1.08); box-shadow: 0 14px 32px rgba(var(--v-green-900-rgb), 0.42); }
.wa-float__icon { width: 32px; height: 32px; }
.wa-float__ping {
	position: absolute; inset: 0;
	border-radius: 50%;
	background: #25D366;
	z-index: -1;
}
@media (prefers-reduced-motion: no-preference) {
	.wa-float__ping { animation: v-ping 2.6s cubic-bezier(0, 0, 0.2, 1) infinite; }
	.wa-float__btn { animation: v-nudge 5s ease-in-out 3s infinite; }
}
@keyframes v-ping {
	0%   { opacity: 0.55; transform: scale(1); }
	70%  { opacity: 0; transform: scale(1.75); }
	100% { opacity: 0; transform: scale(1.75); }
}
@keyframes v-nudge {
	0%, 88%, 100% { transform: scale(1); }
	92%           { transform: scale(1.09) rotate(-6deg); }
	96%           { transform: scale(1.09) rotate(6deg); }
}
.wa-float__bubble {
	position: relative;
	max-width: 15rem;
	background: var(--color-surface);
	color: var(--color-text);
	border: 1px solid var(--v-olive-300);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-card-hover);
	padding: var(--space-4) var(--space-6) var(--space-4) var(--space-4);
	margin-bottom: 2px;
}
@media (prefers-reduced-motion: no-preference) {
	.wa-float__bubble { animation: v-bubble-in 0.45s cubic-bezier(.2,.7,.3,1); }
}
@keyframes v-bubble-in {
	from { opacity: 0; transform: translateY(8px) scale(0.96); }
	to   { opacity: 1; transform: none; }
}
.wa-float__bubble::after {
	content: "";
	position: absolute; right: -7px; bottom: 18px;
	width: 12px; height: 12px;
	background: var(--color-surface);
	border-right: 1px solid var(--v-olive-300);
	border-bottom: 1px solid var(--v-olive-300);
	transform: rotate(-45deg);
}
.wa-float__bubble-title { margin: 0 0 2px; font-weight: 700; font-size: var(--text-sm); color: var(--color-primary); }
.wa-float__bubble-text { margin: 0; font-size: var(--text-xs); color: var(--color-text-soft); line-height: 1.5; }
.wa-float__close {
	position: absolute; top: 2px; right: 6px;
	background: none; border: 0;
	font-size: 18px; line-height: 1;
	color: var(--color-text-soft);
	cursor: pointer;
	padding: 2px 4px;
}
.wa-float__close:hover { color: var(--color-primary); }
@media (max-width: 480px) {
	.wa-float__bubble { max-width: 11.5rem; padding: var(--space-3) var(--space-6) var(--space-3) var(--space-3); }
	.wa-float__btn { width: 52px; height: 52px; }
	.wa-float__icon { width: 28px; height: 28px; }
}

/* ==========================================================================
   Scroll-reveal (JS adds .reveal; respects reduced motion)
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
	.reveal {
		opacity: 0;
		transform: translateY(22px);
		transition: opacity 0.7s cubic-bezier(.2,.7,.3,1), transform 0.7s cubic-bezier(.2,.7,.3,1);
		transition-delay: var(--reveal-delay, 0s);
		will-change: opacity, transform;
	}
	.reveal--left  { transform: translateX(-28px); }
	.reveal--right { transform: translateX(28px); }
	.reveal--zoom  { transform: scale(0.96); }
	.reveal.is-visible { opacity: 1; transform: none; will-change: auto; }
}

/* ==========================================================================
   News index: feature card + grid, placeholder media, category badge
   ========================================================================== */
.news-index { margin-bottom: var(--space-16); }
.news-index__grid { display: grid; gap: var(--space-6); margin-top: var(--space-8); }
@media (min-width: 700px) { .news-index__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .news-index__grid { grid-template-columns: repeat(3, 1fr); } }

.news-card--feature { display: grid; }
@media (min-width: 860px) {
	.news-card--feature { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: stretch; }
	.news-card--feature .news-card__media img { height: 100%; aspect-ratio: auto; }
	.news-card--feature .news-card__body { padding: var(--space-8); align-content: center; }
	.news-card--feature .news-card__title { font-size: var(--text-2xl); font-family: var(--font-display); }
}

.news-card__media--empty {
	display: grid; place-items: center;
	aspect-ratio: 16 / 9;
	background:
		radial-gradient(28rem 16rem at 80% 0%, rgba(169, 168, 107, 0.25), transparent 65%),
		var(--color-primary);
}
.news-card__mark { width: 64px; height: auto; opacity: 0.85; }

.news-card__cat {
	display: inline-block;
	background: var(--v-green-100);
	color: var(--color-primary);
	border-radius: var(--radius-pill);
	padding: 2px 10px;
	font-weight: 600;
	letter-spacing: 0.06em;
	margin-right: var(--space-2);
}
.news-card__dot { margin-inline: var(--space-1); }

/* ==========================================================================
   Single post: hero meta, CTA panel, prev/next
   ========================================================================== */
.post-hero-meta {
	margin: var(--space-3) 0 0;
	font-size: var(--text-sm);
	color: var(--v-cream);
}
.post-hero-meta span { margin-inline: var(--space-2); color: var(--v-olive-300); }
.entry--post { margin-top: var(--space-4); }
.entry--post > p:first-of-type { font-size: var(--text-lg); color: var(--color-text-soft); }
.entry--post h2 { margin-top: var(--space-8); }
.entry--post a { text-decoration-color: var(--v-olive-500); text-underline-offset: 3px; }

.post-cta {
	display: grid; gap: var(--space-4);
	background: var(--color-surface-alt);
	border-left: 4px solid var(--color-accent);
	border-radius: var(--radius-md);
	padding: var(--space-6) var(--space-8);
	margin-top: var(--space-12);
}
@media (min-width: 700px) {
	.post-cta { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
}
.post-cta__copy h2 { margin: 0 0 var(--space-2); font-family: var(--font-display); font-size: var(--text-xl); }
.post-cta__copy p { margin: 0; color: var(--color-text-soft); }
.post-cta__actions { display: grid; gap: var(--space-2); justify-items: center; }
.post-cta__phone {
	font-family: var(--font-display);
	font-size: var(--text-lg);
	font-weight: 600;
	text-decoration: none;
}

.post-nav {
	display: grid; gap: var(--space-4);
	margin-top: var(--space-8);
	padding-top: var(--space-6);
	border-top: 1px solid var(--v-olive-300);
}
@media (min-width: 700px) { .post-nav { grid-template-columns: 1fr 1fr; } }
.post-nav__link { display: grid; gap: var(--space-1); text-decoration: none; }
.post-nav__link--next { text-align: right; }
.post-nav__link--next:only-child { grid-column: 2; }
.post-nav__label {
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--v-olive-600);
}
.post-nav__title { font-weight: 600; color: var(--color-primary); }
.post-nav__link:hover .post-nav__title { color: var(--color-accent-hover); }

/* ==========================================================================
   Map embed (contact page)
   ========================================================================== */
.info-card--map { padding: var(--space-3); }
.map-embed iframe {
	display: block;
	width: 100%;
	height: 300px;
	border: 0;
	border-radius: var(--radius-sm);
}
.map-embed__links {
	display: flex; flex-wrap: wrap; gap: var(--space-4);
	margin: var(--space-3) var(--space-3) var(--space-1);
	font-size: var(--text-sm);
}

/* ==========================================================================
   Leadstack forms — wear the Veridian brand (overrides plugin defaults)
   ========================================================================== */
body .leadstack {
	--ls-accent: var(--v-olive-600);
	--ls-border: var(--v-olive-500);
	--ls-bg: var(--color-surface);
	--ls-text: var(--color-text);
	--ls-muted: var(--color-text-soft);
	--ls-radius: var(--radius-sm);
}
body .leadstack .ls-field > label {
	color: var(--color-primary);
	font-weight: 600;
	font-size: var(--text-sm);
	letter-spacing: 0;
}
body .leadstack .ls-form-title {
	font-family: var(--font-display);
	color: var(--color-primary);
	font-size: var(--text-xl);
}
body .leadstack .ls-submit {
	background: var(--color-accent);
	border-radius: var(--radius-pill);
	font-weight: 600;
	font-size: var(--text-sm);
	letter-spacing: 0.02em;
	padding: 0.9em 1.8em;
}
body .leadstack .ls-submit:hover { background: var(--color-accent-hover); filter: none; }

/* ==========================================================================
   Small-screen safety net
   ========================================================================== */
@media (max-width: 480px) {
	.hero--split { padding-block: var(--space-8) 0; }
	.btn { width: 100%; text-align: center; }
	.hero__actions .btn, .footer-cta__actions .btn { width: auto; flex: 1 1 auto; }
	.top-strip__claim { padding: 7px 13px; }
	.hero__badge { left: var(--space-2); }
	.about-band__card { right: var(--space-2); }
}