.mm-client-logos {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	width: 100%;
	padding: clamp(24px, 3vw, 42px) 0 clamp(28px, 3.4vw, 48px);
	border-top: 1px solid rgba(191, 151, 77, .22);
	border-bottom: 1px solid rgba(191, 151, 77, .24);
	background:
		radial-gradient(circle at 50% -40%, rgba(205, 165, 91, .18), transparent 47%),
		linear-gradient(180deg, #f9f4eb 0%, #efe5d5 100%);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, .82),
		inset 0 -1px 0 rgba(255, 255, 255, .48);
}

.mm-client-logos::before,
.mm-client-logos::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 3;
	width: clamp(46px, 8vw, 150px);
	pointer-events: none;
}

.mm-client-logos::before {
	left: 0;
	background: linear-gradient(90deg, #f4ebdd 12%, rgba(244, 235, 221, 0));
}

.mm-client-logos::after {
	right: 0;
	background: linear-gradient(270deg, #f4ebdd 12%, rgba(244, 235, 221, 0));
}

.mm-client-logos__heading {
	display: grid;
	grid-template-columns: minmax(34px, 1fr) auto minmax(34px, 1fr);
	align-items: center;
	gap: clamp(14px, 2vw, 26px);
	width: min(1180px, calc(100% - 40px));
	margin: 0 auto clamp(20px, 2.6vw, 32px);
	color: #7b5a2b;
}

.mm-client-logos__heading span {
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(170, 125, 55, .48), transparent);
}

.mm-client-logos__heading p {
	margin: 0;
	font-size: clamp(13px, 1.05vw, 16px);
	font-weight: 800;
	letter-spacing: .11em;
	line-height: 1.4;
	text-align: center;
	text-transform: uppercase;
}

.mm-client-logos__viewport {
	overflow: hidden;
	width: 100%;
	direction: ltr;
}

.mm-client-logos__track {
	display: flex;
	width: max-content;
	will-change: transform;
	animation: mm-client-logo-flow 78s linear infinite;
}

.mm-client-logos__group {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	gap: clamp(20px, 2.1vw, 38px);
	padding-inline: clamp(10px, 1.05vw, 19px);
}

.mm-client-logos__item {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: clamp(128px, 10.5vw, 174px);
	height: clamp(78px, 6.4vw, 100px);
	padding: 13px 18px;
	border: 1px solid rgba(177, 132, 55, .28);
	border-radius: 18px;
	background: linear-gradient(145deg, rgba(255,254,250,.96), rgba(247,239,225,.90));
	box-shadow:
		0 12px 30px rgba(83, 62, 31, .055),
		inset 0 1px 0 rgba(255,255,255,.82);
}

.mm-client-logos__item img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 142px;
	max-height: 58px;
	object-fit: contain;
	image-rendering: auto;
	filter: saturate(.96) contrast(1.08) brightness(.98);
	opacity: 1;
	mix-blend-mode: normal;
	transition: filter .24s ease, opacity .24s ease, transform .24s ease;
}

.mm-client-logos__item:hover img {
	filter: saturate(1) contrast(1.1) brightness(1);
	opacity: 1;
	transform: scale(1.035);
}

.mm-client-logos__viewport:hover .mm-client-logos__track,
.mm-client-logos__viewport:focus-within .mm-client-logos__track {
	animation-play-state: paused;
}

@keyframes mm-client-logo-flow {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}

@media (max-width: 767px) {
	.mm-client-logos {
		padding-block: 22px 28px;
	}

	.mm-client-logos__heading {
		width: calc(100% - 28px);
		gap: 10px;
		margin-bottom: 18px;
	}

	.mm-client-logos__heading p {
		max-width: 230px;
		font-size: 12px;
		letter-spacing: .06em;
	}

	.mm-client-logos__group {
		gap: 14px;
		padding-inline: 7px;
	}

	.mm-client-logos__item {
		width: 124px;
		height: 74px;
		padding: 12px 15px;
		border-radius: 15px;
	}

	.mm-client-logos__item img {
		max-width: 103px;
		max-height: 47px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mm-client-logos__viewport {
		overflow-x: auto;
		scrollbar-width: thin;
	}

	.mm-client-logos__track {
		animation: none !important;
		transform: none !important;
	}

	.mm-client-logos__group[aria-hidden="true"] {
		display: none;
	}

	.mm-client-logos__item img {
		transition: none !important;
	}
}
