.pp-eurocham-logo-slider {
	width: 100%;
	overflow: hidden;
	position: relative;
}

/* Few logos: no marquee, single row, centered (class toggled by JS). */
.pp-eurocham-logo-slider--static .pp-eurocham-logo-slider__viewport {
	mask-image: none;
	-webkit-mask-image: none;
}

.pp-eurocham-logo-slider--static .pp-eurocham-logo-slider__track {
	animation: none;
	transform: none;
	width: 100%;
	max-width: 100%;
	justify-content: center;
}

.pp-eurocham-logo-slider--static .pp-eurocham-logo-slider__set[aria-hidden='true'] {
	display: none;
}

.pp-eurocham-logo-slider--static .pp-eurocham-logo-slider__set {
	flex-wrap: nowrap;
	width: auto;
	max-width: 100%;
	justify-content: center;
}

.pp-eurocham-logo-slider__viewport {
	overflow: hidden;
	width: 100%;
	mask-image: linear-gradient(
		to right,
		transparent,
		#000 4%,
		#000 96%,
		transparent
	);
	-webkit-mask-image: linear-gradient(
		to right,
		transparent,
		#000 4%,
		#000 96%,
		transparent
	);
}

.pp-eurocham-logo-slider__track {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0;
	width: max-content;
	/* 20% slower than 90s → duration ÷ 0.8 */
	animation: pp-eurocham-logo-marquee var(--pp-logo-slider-duration, 112.5s) linear infinite;
}

/* Each copy is its own flex row so gap is not inserted between duplicate sets (which breaks -50% loop). */
.pp-eurocham-logo-slider__set {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 3rem;
	flex: 0 0 auto;
	padding: 20px 0
}

@media (prefers-reduced-motion: reduce) {
	.pp-eurocham-logo-slider__track {
		animation: none;
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
		max-width: 100%;
	}

	.pp-eurocham-logo-slider__set {
		flex-wrap: wrap;
		justify-content: center;
		width: 100%;
	}
}

@keyframes pp-eurocham-logo-marquee {
	from {
		transform: translate3d(0, 0, 0);
	}
	to {
		transform: translate3d(-50%, 0, 0);
	}
}

.pp-eurocham-logo-slider__item {
	position: relative;
	flex: 0 0 auto;
	width: 200px;
	height: 100px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 24px;
}

/*
 * Corner diagonal ribbons (top-left), placement like a classic 45° wrap.
 * Colors: #0f1c59 band, #fff text, #0b143d / #080f30 fold accents.
 * Diamond and gold are separate elements so each band sizes to its own label width.
 */
.pp-eurocham-logo-slider__ribbon {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	pointer-events: none;
	z-index: 4;
}

.pp-eurocham-logo-slider__ribbon--diamond {
	z-index: 6;
}

.pp-eurocham-logo-slider__ribbon--gold {
	z-index: 5;
}

.pp-eurocham-logo-slider__ribbon--diamond .pp-eurocham-logo-slider__ribbon-body {
	background: #BE1E2D;
}

/* Diagonal band: width follows copy; each ribbon positions its own strip. */
.pp-eurocham-logo-slider__ribbon-body {
	position: absolute;
	top: 14px;
	left: -29px;
	z-index: 1;
	display: block;
	width: max-content;
	min-width: 108px;
	max-width: 200px;
	padding: 5px 18px;
	box-sizing: border-box;
	text-align: center;
	font-size: 9px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: 0.02em;
	color: #fff;
	background: #0f1c59;
	white-space: nowrap;
	transform: rotate(-45deg);
	transform-origin: center center;
	box-shadow: 0 2px 6px rgba(30, 58, 95, 0.35);
}

/* Slight “turn-under” at the ends of the strip along the ribbon edges */
.pp-eurocham-logo-slider__ribbon-body::before {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4px 5px 0 0;
	border-color: #0b143d transparent transparent transparent;
}

.pp-eurocham-logo-slider__ribbon-body::after {
	content: '';
    position: absolute;
    bottom: -2px;
    right: 1px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 6px 7px;
    border-color: transparent transparent #0b143d transparent;
    transform: rotate(45deg);
}

/* Second band offset along the diagonal when both tiers are shown */
.pp-eurocham-logo-slider__ribbon--gold .pp-eurocham-logo-slider__ribbon-body {
	top: 14px;
    left: -27px;
}

.pp-eurocham-logo-slider__item:has(.pp-eurocham-logo-slider__ribbon--diamond) .pp-eurocham-logo-slider__ribbon--gold .pp-eurocham-logo-slider__ribbon-body {
	top: 20px;
	left: -34px;
}

/* Avoid doubled corner shadows when both ribbons are present */
.pp-eurocham-logo-slider__item:has(.pp-eurocham-logo-slider__ribbon--diamond) .pp-eurocham-logo-slider__ribbon--gold::before,
.pp-eurocham-logo-slider__item:has(.pp-eurocham-logo-slider__ribbon--diamond) .pp-eurocham-logo-slider__ribbon--gold::after {
	display: none;
}

.pp-eurocham-logo-slider__img {
	display: block;
	max-height: 50px;
	max-width: 140px;
	width: auto;
	height: auto;
	object-fit: contain;
	object-position: center;
}