.wt-infinite-timeline {
	--wt-timeline-background: #fff;
	--wt-timeline-item-width: 310px;
	--wt-timeline-item-gap: 44px;
	--wt-timeline-line-color: #344257;
	--wt-timeline-progress-color: #45bdf5;
	--wt-timeline-line-width: 3px;
	--wt-timeline-dot-size: 18px;
	--wt-timeline-dot-gap: 8px;
	--wt-timeline-line-text-gap: 24px;
	--wt-timeline-accent-color: #45bdf5;
	--wt-timeline-main-color: #263348;
	--wt-timeline-text-gap: 10px;
	--wt-timeline-progress: 0%;
	--wt-timeline-mobile-height: 640px;
	--wt-timeline-mobile-item-height: 132px;
	--wt-timeline-mobile-dot-offset: 12px;
	position: relative;
	width: 100%;
	max-width: 100%;
	background: var(--wt-timeline-background);
	overflow: hidden;
	isolation: isolate;
}

.wt-infinite-timeline *,
.wt-infinite-timeline *::before,
.wt-infinite-timeline *::after {
	box-sizing: border-box;
}

.wt-infinite-timeline__viewport {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.wt-infinite-timeline__track {
	display: flex;
	width: max-content;
	will-change: transform;
}

.wt-infinite-timeline__group {
	display: flex;
	flex: none;
	width: max-content;
}

.wt-infinite-timeline__item {
	display: flex;
	flex: 0 0 var(--wt-timeline-item-width);
	width: var(--wt-timeline-item-width);
	margin: 0 var(--wt-timeline-item-gap) 0 0;
	flex-direction: column;
}

.wt-infinite-timeline__rail {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--wt-timeline-dot-size) minmax(0, 1fr);
	align-items: center;
	column-gap: var(--wt-timeline-dot-gap);
	width: calc(100% + var(--wt-timeline-item-gap));
	height: var(--wt-timeline-dot-size);
}

.wt-infinite-timeline__line {
	display: block;
	width: 100%;
	height: var(--wt-timeline-line-width);
	background: var(--wt-timeline-line-color);
}

.wt-infinite-timeline__dot {
	display: block;
	width: var(--wt-timeline-dot-size);
	height: var(--wt-timeline-dot-size);
	border-radius: 50%;
	background: var(--wt-timeline-line-color);
}

.wt-infinite-timeline__copy {
	display: block;
	margin-top: var(--wt-timeline-line-text-gap);
	margin-bottom: 0;
	padding-left: calc(50% + (var(--wt-timeline-dot-size) / 2) + var(--wt-timeline-dot-gap));
	width: calc(150% + var(--wt-timeline-item-gap));
	color: var(--wt-timeline-main-color);
}

.wt-infinite-timeline__accent {
	display: inline;
	margin-right: var(--wt-timeline-text-gap);
	color: var(--wt-timeline-accent-color);
	font-family: monospace;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.35;
}

.wt-infinite-timeline__separator {
	display: inline;
	margin-right: var(--wt-timeline-text-gap);
	color: var(--wt-timeline-main-color);
	font-size: 20px;
	line-height: 1.35;
}

.wt-infinite-timeline__main {
	display: inline;
	color: var(--wt-timeline-main-color);
	font-size: 20px;
	font-weight: 500;
	line-height: 1.35;
}

.wt-infinite-timeline__progress-layer {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	clip-path: inset(0 calc(100% - var(--wt-timeline-progress)) 0 0);
}

.wt-infinite-timeline.is-direction-right .wt-infinite-timeline__progress-layer {
	clip-path: inset(0 0 0 calc(100% - var(--wt-timeline-progress)));
}

.wt-infinite-timeline__progress-layer .wt-infinite-timeline__line,
.wt-infinite-timeline__progress-layer .wt-infinite-timeline__dot {
	background: var(--wt-timeline-progress-color);
}

.wt-infinite-timeline__progress-layer .wt-infinite-timeline__copy {
	visibility: hidden;
}

.wt-infinite-timeline.is-paused .wt-infinite-timeline__track {
	will-change: auto;
}

@media (max-width: 767px) {
	.wt-infinite-timeline.is-full-width-mobile {
		left: 50%;
		width: 100vw;
		max-width: 100vw;
		margin-left: -50vw;
	}

	.wt-infinite-timeline:not(.is-mobile-vertical) .wt-infinite-timeline__copy {
		width: calc(160% + var(--wt-timeline-item-gap));
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__viewport {
		height: var(--wt-timeline-mobile-height);
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__track,
	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__group {
		flex-direction: column;
		width: 100%;
		height: max-content;
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__item {
		position: relative;
		flex: 0 0 auto;
		width: 100%;
		min-height: var(--wt-timeline-mobile-item-height);
		margin: 0 0 var(--wt-timeline-item-gap);
		padding-left: calc(var(--wt-timeline-dot-size) + (var(--wt-timeline-dot-gap) * 2));
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__rail {
		position: absolute;
		top: 0;
		left: 0;
		display: grid;
		grid-template-columns: var(--wt-timeline-dot-size);
		grid-template-rows: var(--wt-timeline-mobile-dot-offset) var(--wt-timeline-dot-size) minmax(0, 1fr);
		align-items: stretch;
		justify-items: center;
		row-gap: var(--wt-timeline-dot-gap);
		width: var(--wt-timeline-dot-size);
		height: calc(100% + var(--wt-timeline-item-gap));
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__line {
		width: var(--wt-timeline-line-width);
		height: 100%;
	}

	.wt-infinite-timeline.is-mobile-vertical .wt-infinite-timeline__copy {
		width: 100%;
		margin: 0;
		padding: 0;
	}

	.wt-infinite-timeline.is-mobile-vertical.is-mobile-up .wt-infinite-timeline__progress-layer {
		clip-path: inset(calc(100% - var(--wt-timeline-progress)) 0 0 0);
	}

	.wt-infinite-timeline.is-mobile-vertical.is-mobile-down .wt-infinite-timeline__progress-layer {
		clip-path: inset(0 0 calc(100% - var(--wt-timeline-progress)) 0);
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.wt-infinite-timeline.is-full-width-tablet {
		left: 50%;
		width: 100vw;
		max-width: 100vw;
		margin-left: -50vw;
	}
}

@media (min-width: 1025px) {
	.wt-infinite-timeline.is-full-width-desktop {
		left: 50%;
		width: 100vw;
		max-width: 100vw;
		margin-left: -50vw;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wt-infinite-timeline__track {
		will-change: auto;
	}
}