/* Blok: Klantlogo's — gecentreerde kop + horizontale logo-strip. */
.block-client-logos { background: var(--amazing-bg); padding-block: 40px 56px; }
.block-client-logos__inner { text-align: center; }
.block-client-logos__title { font-size: clamp(28px, 2.2vw, 40px); margin-bottom: 34px; }
/* Oneindige logo-slider (marquee). Track = 2× de logo-set → animeren tot -50%
   geeft een naadloze lus. Rand-fades maskeren het in/uit lopen. */
.block-client-logos__marquee {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	        mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.block-client-logos__track {
	display: flex;
	align-items: center;
	width: max-content;
	animation: cl-marquee 32s linear infinite;
}
.block-client-logos__marquee:hover .block-client-logos__track { animation-play-state: paused; }
/* Uniforme marge (óók achter het laatste logo) i.p.v. gap: zo is de tweede set
   exact één set-breedte verder → translateX(-50%) loopt naadloos rond. */
.block-client-logos__item { flex: 0 0 auto; display: flex; align-items: center; margin-inline: clamp(14px, 2.5vw, 36px); }
.block-client-logos__item img { max-height: 64px; width: auto; object-fit: contain; }

@keyframes cl-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.block-client-logos__track { animation: none; flex-wrap: wrap; justify-content: center; width: auto; }
	.block-client-logos__item[aria-hidden="true"] { display: none; }
}
