/* Createam Logo Marquee */
.ctm {
	--ctm-item: 220px;
	--ctm-h: 64px;
	--ctm-pad: 22px;
	--ctm-gap: 24px;
	--ctm-sec: 5.5;
	--ctm-fade: 8%;
	--ctm-div-c: rgba(0, 0, 0, 0.15);
	--ctm-div-w: 1px;
	--ctm-div-h: 100%;
	direction: ltr; /* keeps the scroll math identical on RTL sites */
	display: flex;
	flex-direction: column;
	gap: var(--ctm-gap);
	width: 100%;
}

.ctm-row {
	overflow: hidden;
}

.ctm--fade .ctm-row {
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--ctm-fade), #000 calc(100% - var(--ctm-fade)), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 var(--ctm-fade), #000 calc(100% - var(--ctm-fade)), transparent 100%);
}

.ctm-track {
	display: flex;
	width: max-content;
	animation: ctm-left calc(var(--ctm-count, 12) * var(--ctm-sec) * 1s) linear infinite;
	will-change: transform;
}

.ctm-row--right .ctm-track {
	animation-name: ctm-right;
}

.ctm--pause .ctm-row:hover .ctm-track {
	animation-play-state: paused;
}

.ctm .ctm-group {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ctm .ctm-item {
	position: relative;
	flex: 0 0 var(--ctm-item);
	box-sizing: border-box;
	margin: 0;
	padding: 0 var(--ctm-pad);
	list-style: none;
}

.ctm--dividers .ctm-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: var(--ctm-div-w);
	height: var(--ctm-div-h);
	background: var(--ctm-div-c);
	transform: translateY(-50%);
}

.ctm .ctm-item a {
	display: block;
}

.ctm .ctm-item img {
	display: block;
	width: 100%;
	max-width: none;
	height: var(--ctm-h);
	object-fit: contain;
	transition-property: filter, opacity;
	transition-duration: 0.3s;
	transition-timing-function: ease;
}

/* Per-logo "Apply filter" switched off: always original colors. */
.ctm .ctm-item.ctm-item--nofilter img {
	filter: none !important;
	opacity: 1 !important;
}

.ctm-empty {
	padding: 24px;
	text-align: center;
	border: 1px dashed rgba(0, 0, 0, 0.25);
}

@keyframes ctm-left {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}

@keyframes ctm-right {
	from { transform: translate3d(-50%, 0, 0); }
	to { transform: translate3d(0, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.ctm-track {
		animation: none;
	}
	.ctm-row {
		overflow-x: auto;
	}
	.ctm-group[aria-hidden],
	.ctm-item[aria-hidden] {
		display: none;
	}
}
