/* ============================================================
   LogoSlider Topshape  (tokens only; Swiper base above)
   ============================================================ */
.ppc-logoslider-topshape {
	position: relative;
	background: var(--ppc-color-surface-muted);
	/* 96px between the slider and the panel edges (Figma), measured to the panel border and
	   not the top-shape that protrudes above it. */
	padding-block: 6rem;
	padding-inline: var(--ppc-section-inset-x);
	/* No overflow:hidden here, it would clip the top-shape that protrudes above the panel.
	   The Swiper container clips its own overflowing slides. */
}

/* Label on the left, slider fills the rest; the whole row is centered on the container width
   (the Swiper clips slides at the container edge instead of bleeding to the viewport). */
.ppc-logoslider-topshape__inner {
	display: flex;
	align-items: center;
	gap: 2rem;
	max-width: var(--ppc-container-width);
	margin-inline: auto;
}

.ppc-logoslider-topshape__label {
	flex-shrink: 0;
	margin: 0;
	font-family: var(--ppc-font-sans);
	font-weight: var(--ppc-font-weight-medium);
	font-size: 0.9375rem;
	line-height: var(--ppc-line-height-tight);
	color: var(--ppc-color-cta-text);
	white-space: nowrap;
}

/* Decorative top-center peak that protrudes above the panel (Figma vector). */
.ppc-logoslider-topshape__shape {
	position: absolute;
	top: 0;
	left: 50%;
	width: 202px;
	height: 48px;
	transform: translate(-50%, -100%);
	pointer-events: none;
}
.ppc-logoslider-topshape__shape svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ppc-logoslider-topshape__slider {
	flex: 1 1 0;
	min-width: 0;
}

/* Continuous linear marquee (autoplay delay 0 + linear timing). */
.ppc-logoslider-topshape .swiper-wrapper {
	align-items: center;
	transition-timing-function: linear;
}

.ppc-logoslider-topshape__slide {
	display: flex;
	align-items: center;
	justify-content: center;
	width: auto;
}

.ppc-logoslider-topshape__logo {
	display: block;
	width: auto;
	height: 2rem;
	object-fit: contain;
}

