/* Collaborating companies (public pages). */

.elimu-sponsors__level {
	margin-block: 2.5rem;
}

.elimu-sponsors__level:first-child {
	margin-block-start: 1rem;
}

.elimu-sponsors__title {
	margin: 0 0 1rem;
	color: var(--wp--preset--color--text-muted, #50575e);
	font-size: 0.875rem;
	letter-spacing: 0.08em;
	text-align: center;
	text-transform: uppercase;
}

.elimu-sponsors__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 1.5rem 2.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.elimu-sponsors__item {
	margin: 0;
}

.elimu-sponsors__item a {
	display: block;
}

.elimu-sponsors__item a:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-primary, #0077b6);
	outline-offset: 4px;
}

.elimu-sponsors__item img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	object-fit: contain;
}

.elimu-sponsors__level--platinum .elimu-sponsors__item img {
	max-width: min(100%, 20rem);
	max-height: 7rem;
}

.elimu-sponsors__level--gold .elimu-sponsors__item img {
	max-width: min(100%, 14rem);
	max-height: 5rem;
}

.elimu-sponsors__level--silver .elimu-sponsors__item img {
	max-width: min(100%, 9rem);
	max-height: 3.5rem;
}

/* Endless carousel: sponsors.js adds .is-marquee when the logos do not fit in one row. */
.elimu-sponsors {
	--elimu-sponsors-gap: 2.5rem;
}

.elimu-sponsors__list {
	gap: 1.5rem var(--elimu-sponsors-gap);
}

.elimu-sponsors__level.is-marquee .elimu-sponsors__viewport {
	overflow: hidden;
	padding-block: 0.5rem;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}

.elimu-sponsors__level.is-marquee .elimu-sponsors__list {
	flex-wrap: nowrap;
	justify-content: flex-start;
	gap: 0;
	width: max-content;
	animation: elimu-sponsors-marquee var(--elimu-marquee-duration, 60s) linear infinite;
}

.elimu-sponsors__level--gold.is-marquee .elimu-sponsors__list {
	animation-direction: reverse;
}

.elimu-sponsors__level.is-marquee .elimu-sponsors__item {
	flex: none;
	margin-inline-end: var(--elimu-sponsors-gap);
}

.elimu-sponsors__level--platinum.is-marquee .elimu-sponsors__item img {
	max-width: 20rem;
}

.elimu-sponsors__level--gold.is-marquee .elimu-sponsors__item img {
	max-width: 14rem;
}

.elimu-sponsors__level--silver.is-marquee .elimu-sponsors__item img {
	max-width: 9rem;
}

.elimu-sponsors__level.is-marquee .elimu-sponsors__viewport:hover .elimu-sponsors__list,
.elimu-sponsors__level.is-marquee .elimu-sponsors__viewport:focus-within .elimu-sponsors__list {
	animation-play-state: paused;
}

@keyframes elimu-sponsors-marquee {
	to {
		transform: translateX(calc(-1 * var(--elimu-marquee-distance, 50%)));
	}
}

@media (prefers-reduced-motion: reduce) {
	.elimu-sponsors__level.is-marquee .elimu-sponsors__list {
		animation: none;
	}
}