/* House of Sports Marken-Slider */
.h24-brand-marquee {
	--h24-accent: #43ade2;
	--h24-ink: #181818;
	--h24-marquee-duration: 38s;
	box-sizing: border-box;
	width: 100%;
	overflow: hidden;
	padding: 18px 0;
	background: #ffffff;
	mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
}

.h24-brand-marquee *,
.h24-brand-marquee *::before,
.h24-brand-marquee *::after {
	box-sizing: border-box;
}

.h24-brand-marquee__track {
	display: flex;
	width: max-content;
	animation: h24-brand-marquee-scroll var(--h24-marquee-duration) linear infinite;
	will-change: transform;
}

.h24-brand-marquee__set {
	display: flex;
	flex: none;
	align-items: center;
	gap: clamp(28px, 4.5vw, 78px);
	padding-right: clamp(28px, 4.5vw, 78px);
}

.h24-brand-marquee__item {
	display: grid;
	width: clamp(86px, 9vw, 132px);
	height: 54px;
	flex: none;
	place-items: center;
}

.h24-brand-marquee__logo {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 42px;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.82;
	transition: filter 180ms cubic-bezier(0.23, 1, 0.32, 1), opacity 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.h24-brand-marquee__item:hover .h24-brand-marquee__logo {
	filter: grayscale(0);
	opacity: 1;
	transform: scale(1.04);
}

.h24-brand-marquee__logo--invert {
	filter: grayscale(1) invert(1);
}

.h24-brand-marquee__item:hover .h24-brand-marquee__logo--invert {
	filter: invert(1);
}

.h24-brand-marquee--pause-on-hover:hover .h24-brand-marquee__track,
.h24-brand-marquee--pause-on-hover:focus-within .h24-brand-marquee__track {
	animation-play-state: paused;
}

@keyframes h24-brand-marquee-scroll {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.h24-brand-marquee {
		overflow-x: auto;
		mask-image: none;
		-webkit-mask-image: none;
	}

	.h24-brand-marquee__track {
		animation: none;
	}
}
