/* ---------- Client logo strip ---------- */
.ry-marquee {
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}
.ry-marquee-track { width: max-content !important; }
.ry-marquee-track.is-running { animation: ryMarquee 32s linear infinite; }
.ry-marquee:hover .ry-marquee-track { animation-play-state: paused; }

/* Client logos sit in grey and take their colour on hover. */
.ry-marquee-track > .e-con { transition: background-color 0.3s ease; }
.ry-marquee-track > .e-con:hover { background-color: #ece6d8 !important; }
.ry-marquee-track img { filter: grayscale(100%); opacity: 0.65; transition: filter 0.3s ease, opacity 0.3s ease; }
.ry-marquee-track > .e-con:hover img { filter: none; opacity: 1; }

/* Track holds 4 identical sets of tiles (gap 20px); moving by half lands on an identical frame. */
@keyframes ryMarquee {
	from { transform: translateX(0); }
	to { transform: translateX(calc(-50% - 10px)); }
}