.ppp-timeline-slider {
	--ppp-timeline-slide-width: calc(var(--wp--custom--layout--wide) * 0.4);
	--ppp-timeline-image-height: clamp(11rem, 18vw, 14rem);
	--ppp-timeline-dot-size: calc(var(--wp--preset--spacing--sm) * 1.5);
	--ppp-timeline-bar-thickness: calc(var(--wp--custom--border-width--large) * 2.5);
	--ppp-timeline-slide-inline-pad: var(--wp--preset--spacing--sm);
	--ppp-timeline-image-line-gap: var(--wp--preset--spacing--sm);
	--ppp-timeline-axis-offset: calc(var(--wp--preset--spacing--xs) + (var(--ppp-timeline-dot-size) / 2) + (var(--ppp-timeline-bar-thickness) / 2));
	--ppp-timeline-bottom-reserve: calc(var(--ppp-timeline-axis-offset) + (var(--ppp-timeline-dot-size) / 2) + var(--ppp-timeline-image-line-gap));
	--ppp-timeline-edge-fade-width: clamp(10vw, calc(12vw + var(--wp--preset--spacing--sm)), 25vw);
	--ppp-timeline-surface: var(--wp--custom--color--neutral-100);
	--ppp-timeline-fade-color: var(--ppp-timeline-surface);
	position: relative;
	overflow: hidden;
	background: var(--ppp-timeline-surface);
	padding: var(--wp--preset--spacing--lg) 0 var(--wp--preset--spacing--md);
}

.ppp-timeline-slider.alignfull > .ppp-timeline-slider__viewport,
.ppp-timeline-slider.alignwide > .ppp-timeline-slider__viewport {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

.ppp-timeline-slider__viewport {
	position: relative;
	overflow: hidden;
}

.ppp-timeline-slider__viewport::before,
.ppp-timeline-slider__viewport::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--ppp-timeline-edge-fade-width);
	pointer-events: none;
	z-index: 4;
}

.ppp-timeline-slider__viewport::before {
	left: 0;
	background: linear-gradient(90deg, var(--ppp-timeline-fade-color) 0%, transparent 100%);
}

.ppp-timeline-slider__viewport::after {
	right: 0;
	background: linear-gradient(270deg, var(--ppp-timeline-fade-color) 0%, transparent 100%);
}

.ppp-timeline-slider .splide__track {
	overflow: visible;
	max-width: none;
	margin: 0;
	padding: 0;
}

.ppp-timeline-slider .splide__list {
	position: relative;
	display: flex;
	align-items: stretch;
	margin: 0;
	padding: 0 0 var(--ppp-timeline-bottom-reserve);
}

.ppp-timeline-slider .splide__slide {
	position: relative;
	flex: 0 0 auto;
	width: var(--ppp-timeline-slide-width);
	min-width: 0;
	padding: 0 var(--ppp-timeline-slide-inline-pad) var(--ppp-timeline-bottom-reserve);
}

.ppp-timeline-slider .splide__slide::before {
	content: "";
	position: absolute;
	left: calc(-1 * var(--ppp-timeline-slide-inline-pad));
	width: calc(100% + (var(--ppp-timeline-slide-inline-pad) * 2));
	bottom: calc(var(--ppp-timeline-axis-offset) - (var(--ppp-timeline-bar-thickness) / 2));
	height: var(--ppp-timeline-bar-thickness);
	border-radius: 999px;
	background: var(--ppp-timeline-line, transparent);
	z-index: 0;
}

.ppp-timeline-slider .splide__slide::after {
	content: "";
	position: absolute;
	left: 50%;
	width: var(--ppp-timeline-dot-size);
	height: var(--ppp-timeline-dot-size);
	border-radius: 999px;
	background: var(--ppp-timeline-dot, var(--wp--preset--color--primary));
	bottom: calc(var(--ppp-timeline-axis-offset) - (var(--ppp-timeline-dot-size) / 2));
	transform: translateX(-50%);
	z-index: 2;
}

.ppp-timeline-slider__card {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--sm);
	height: 100%;
}

.ppp-timeline-slider__year {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--gigantic);
	font-weight: 800;
	line-height: var(--wp--custom--line-height--small);
	color: var(--wp--preset--color--foreground);
}

.ppp-timeline-slider__description {
	font-size: var(--wp--preset--font-size--large);
	line-height: var(--wp--custom--line-height--large);
	color: var(--wp--custom--color--neutral-900);
}

.ppp-timeline-slider__description > :first-child {
	margin-top: 0;
}

.ppp-timeline-slider__description > :last-child {
	margin-bottom: 0;
}

.ppp-timeline-slider__image-wrap,
.ppp-timeline-slider__image-placeholder {
	width: 100%;
	height: var(--ppp-timeline-image-height);
	margin-top: auto;
	background: var(--wp--custom--color--neutral-300);
	overflow: hidden;
}

.ppp-timeline-slider__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ppp-timeline-slider__image-placeholder {
	position: relative;
}

.ppp-timeline-slider__image-placeholder::before {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: var(--wp--preset--spacing--md);
	height: var(--wp--preset--spacing--md);
	border-radius: var(--wp--custom--border-radius--small);
	border: var(--wp--custom--border-width--medium) solid rgba(255, 255, 255, 0.5);
	transform: translate(-50%, -50%);
}

.ppp-timeline-slider .splide__pagination {
	display: none;
}

@media (max-width: 1023px) {
	.ppp-timeline-slider {
		--ppp-timeline-slide-width: clamp(15rem, 52vw, 20rem);
	}
}

@media (max-width: 767px) {
	.ppp-timeline-slider {
		--ppp-timeline-slide-width: clamp(13rem, 70vw, 18rem);
		--ppp-timeline-image-height: clamp(9rem, 44vw, 12rem);
		--ppp-timeline-dot-size: calc(var(--wp--preset--spacing--xs) * 1.5);
		--ppp-timeline-slide-inline-pad: var(--wp--preset--spacing--xs);
		padding-top: var(--wp--preset--spacing--md);
		padding-bottom: var(--wp--preset--spacing--sm);
	}

	.ppp-timeline-slider__year {
		font-size: var(--wp--preset--font-size--huge);
	}

	.ppp-timeline-slider__description {
		font-size: var(--wp--preset--font-size--small);
	}
}