.vl-clients-page {
	background: var(--vl-paper);
}

.vl-service-hero.vl-clients-hero {
	min-height: auto;
}

.vl-clients-hero__inner {
	position: relative;
	z-index: 1;
	display: grid;
	align-items: center;
	width: var(--vl-width);
	min-height: min(42svh, 410px);
	margin-inline: auto;
	padding: clamp(2.4rem, 5vw, 4.2rem) 0;
}

.vl-clients-hero__copy {
	max-width: 920px;
}

.vl-clients-hero h1 {
	max-width: 1040px;
	margin: 0;
	color: #ffffff;
	font: 800 clamp(2.6rem, 4.9vw, 5rem)/1 "Montserrat", sans-serif;
	letter-spacing: 0;
	text-shadow: 0 8px 42px rgba(0, 0, 0, 0.34);
}

.vl-clients-hero__copy > p:not(.vl-service-eyebrow) {
	max-width: 760px;
	margin: 1.2rem 0 0;
	color: rgba(255, 255, 255, 0.86);
	font: 600 clamp(1.08rem, 1.45vw, 1.35rem)/1.5 "Titillium Web", sans-serif;
}

.vl-clients-list {
	width: min(100% - 2rem, 1180px);
	margin: 0 auto;
	padding: clamp(3.6rem, 7vw, 6rem) 0;
}

.vl-clients-logo-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(0.9rem, 2vw, 1.4rem);
	margin: clamp(2rem, 4vw, 3rem) 0 0;
	padding: 0;
	list-style: none;
}

.vl-clients-logo-grid li {
	display: grid;
	place-items: center;
	min-height: 142px;
	padding: clamp(1rem, 2.2vw, 1.5rem);
	border: 1px solid rgba(37, 95, 89, 0.12);
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 20px 60px rgba(28, 45, 42, 0.055);
}

.vl-clients-logo-grid img {
	display: block;
	max-width: min(100%, 210px);
	max-height: 76px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: saturate(0.92);
}