.step-process-carousel {
	--step-process-slide-gap: 45px;
}

.step-process-carousel .step-process-carousel__header {
	margin-bottom: 56px;
}

.step-process-carousel .step-process-carousel__intro-copy {
	max-width: 720px;
	margin-top: 24px;
	margin-bottom: 0;
}

.step-process-carousel .step-process-carousel__slider-shell {
	width: 130%;
	overflow: hidden;
}

.step-process-carousel .step-process-carousel__slider {
	margin-left: calc(var(--step-process-slide-gap) * -0.5);
	margin-right: calc(var(--step-process-slide-gap) * -0.5);
}

.step-process-carousel .step-process-carousel__slider:not(.slick-initialized) {
	display: flex;
	overflow: hidden;
}

.step-process-carousel .step-process-carousel__slider:not(.slick-initialized) .step-process-carousel__slide {
	flex: 0 0 25%;
	max-width: 25%;
}

.step-process-carousel .step-process-carousel__slide {
	padding: 0 calc(var(--step-process-slide-gap) * 0.5);
	box-sizing: border-box;
}

.step-process-carousel .step-process-carousel__slider .slick-list {
	overflow: hidden;
}

.step-process-carousel .step-process-carousel__slider .slick-track {
	display: flex;
	cursor: grab;
}

.step-process-carousel .step-process-carousel__slider .slick-list.dragging .slick-track {
	cursor: grabbing;
}

.step-process-carousel .step-process-carousel__slider .slick-slide,
.step-process-carousel .step-process-carousel__slider .slick-slide > div {
	height: inherit;
}

.step-process-carousel .step-process-carousel__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	height: 100%;
}

.step-process-carousel .step-process-carousel__badge {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 28px;
}

.step-process-carousel .step-process-carousel__badge span {
	color: #ffffff;
	font-size: 32px;
	line-height: 1;
	font-weight: 700;
}

/* Tick variant */
.step-process-carousel .step-process-carousel__badge--tick {
	width: 45px;
	height: 45px;
}

.step-process-carousel .step-process-carousel__tick-icon {
	width: 24px;
	height: 24px;
	display: block;
	flex-shrink: 0;
}

.step-process-carousel .step-process-carousel__badge--blue {
	background-color: #397ccf;
}

.step-process-carousel .step-process-carousel__badge--green {
	background-color: #3ccf73;
}

.step-process-carousel .step-process-carousel__badge--orange {
	background-color: #ff6a00;
}

.step-process-carousel .step-process-carousel__badge--yellow {
	background-color: #ffd400;
}

.step-process-carousel .step-process-carousel__slide-title {
	margin-top: 0;
	margin-bottom: 16px;
}

.step-process-carousel .step-process-carousel__slide-text,
.step-process-carousel .step-process-carousel__slide-text p {
	margin-top: 0;
	margin-bottom: 0;
}

.step-process-carousel .step-process-carousel__slide-text p + p {
	margin-top: 12px;
}

@media (max-width: 1919.98px) {
	.step-process-carousel {
		--step-process-slide-gap: 28px;
	}
}

@media (max-width: 1599.98px) {
	.step-process-carousel {
		--step-process-slide-gap: 24px;
	}

	.step-process-carousel .step-process-carousel__header {
		margin-bottom: 48px;
	}
}

@media (max-width: 991.98px) {
	.step-process-carousel {
		--step-process-slide-gap: 20px;
	}

	.step-process-carousel .step-process-carousel__slider:not(.slick-initialized) .step-process-carousel__slide {
		flex-basis: 50%;
		max-width: 50%;
	}

	.step-process-carousel .step-process-carousel__header {
		margin-bottom: 32px;
	}

	.step-process-carousel .step-process-carousel__badge {
		margin-bottom: 20px;
	}
}

@media(max-width: 767.98px){
	.step-process-carousel .step-process-carousel__badge:not(.step-process-carousel__badge--tick) {
		width: 45px;
		height: 45px;
	}

	.step-process-carousel .step-process-carousel__badge span {
		font-size: 25px;
	}
}

@media (max-width: 575.98px) {
	.step-process-carousel .step-process-carousel__slider-shell {
		width: 150%;
	}
	.step-process-carousel {
		--step-process-slide-gap: 30px;
	}

	.step-process-carousel .step-process-carousel__slider:not(.slick-initialized) .step-process-carousel__slide {
		flex-basis: 50%;
		max-width: 50%;
	}

	.step-process-carousel .step-process-carousel__intro-copy {
		margin-top: 16px;
	}
}


