.flex-layout.swiper_steps {
}

.flex-layout.swiper_steps .steps-grid {
	grid-template-rows: auto max(1.5rem, calc(1.5 * var(--su))) auto 40px;
}

.flex-layout.swiper_steps .panel {
	grid-column: 1 / 7;
	grid-row: 1 / 5;
	background: radial-gradient(111.4% 165.88% at 93.12% 171.63%, var(--support-1) 0%, var(--primary-100) 96.33%);
}

.flex-layout.swiper_steps .intro-col {
	grid-column: 1 / 7;
	grid-row: 1 / 2;
	position: relative;
	z-index: 2;
	display: flex;
	align-items: end;
}

.flex-layout.swiper_steps .heading-col {
	grid-column: 7 / 13;
	grid-row: 1 / 2;
	padding: max(1.5rem, calc(2.5 * var(--su))) max(1.5rem, calc(3 * var(--su)));
}

.flex-layout.swiper_steps .intro-col .nova-eyebrow {
	color: var(--white-100);
	padding-left: max(1.5rem, calc(2.5 * var(--su)));
}

.flex-layout.swiper_steps .heading-col .pk-text {
	margin-top: max(.75rem, calc(.75 * var(--su)));
	color: var(--primary-80);
}

.flex-layout.swiper_steps .steps-swiper {
	grid-column: 1 / 13;
	grid-row: 3 / 4;
	position: relative;
	z-index: 1;
	overflow: visible;
	padding-left: max(1.5rem, calc(2.5 * var(--su)));
}

.flex-layout.swiper_steps .swiper-slide {
	width: max(26rem, calc(26 * var(--su)));
	height: auto;
}

.flex-layout.swiper_steps .step-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: max(1.5rem, calc(2.5 * var(--su)));
	background-color: var(--support-1);
	color: var(--primary-100);
}

.flex-layout.swiper_steps .step-card .type {
	display: flex;
	align-items: center;
	gap: max(.5rem, calc(.5 * var(--su)));
	margin-bottom: max(1.5rem, calc(1.5 * var(--su)));
}

.flex-layout.swiper_steps .step-card .type .badge {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: max(2rem, calc(2 * var(--su)));
	height: auto;
	aspect-ratio: 1;
	border-radius: 50%;
	background-color: var(--white-100);
	outline: 1px solid var(--primary-10);
	outline-offset: -1px;
	color: var(--accent-100);
}

.flex-layout.swiper_steps .step-card .type .badge.icon-mask::after,
.flex-layout.swiper_steps .step-card .type .badge.icon-font::after {
	content: none;
}

.flex-layout.swiper_steps .step-card .type .badge.icon-mask::before {
	content: '';
	display: block;
	width: 1em;
	height: 1em;
	background-color: currentColor;
	mask: var(--mask-url) center / contain no-repeat;
}

.flex-layout.swiper_steps .step-card .type .badge.icon-font::before {
	content: attr(data-icon);
	font-family: 'Material Symbols Outlined';
	font-size: 1.25em;
	font-weight: 300;
	line-height: 1;
	font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20;
}

.flex-layout.swiper_steps .step-card .content {
	display: flex;
	flex-direction: column;
	gap: max(.5rem, calc(.5 * var(--su)));
}

.flex-layout.swiper_steps .step-card .title {
	margin: 0;
}

.flex-layout.swiper_steps .step-card .text {
	margin: 0;
	font-size: var(--body-s-regular);
	color: var(--primary-100);
}

.flex-layout.swiper_steps .nova-pagination {
	margin-top: max(1.5rem, calc(2.5 * var(--su)));
}

@media screen and (max-width: 992px) {

	.flex-layout.swiper_steps .pk-grid-container {
		row-gap: 1.5rem;
	}

	.flex-layout.swiper_steps .steps-grid {
		display: flex;
		flex-direction: column;
	}

	.flex-layout.swiper_steps .panel {
		display: none;
	}

	.flex-layout.swiper_steps .heading-col {
		order: -1;
		padding: 0;
		margin-bottom: 100px !important;
	}

	.flex-layout.swiper_steps .intro-col {
		padding: 0;
	}

	.flex-layout.swiper_steps .intro-col .nova-eyebrow {
		padding: 0;
		margin-bottom: 0 !important;
	}

	.flex-layout.swiper_steps .steps-swiper {
		padding-left: 0;
		position: relative;
	}

	.flex-layout.swiper_steps .steps-swiper::before {
		content: '';
		position: absolute;
		top: -100px;
		height: calc(100% + 124px);
		width: 100vw;
		left: calc(-1 * var(--pk-site-gutter));
		background: radial-gradient(111.4% 165.88% at 93.12% 171.63%, var(--support-1) 0%, var(--primary-100) 96.33%);
	}

	.flex-layout.swiper_steps .swiper-slide {
		width: 100%;
	}

	.flex-layout.swiper_steps .nova-pagination {
		margin-top: 3rem;
	}

}


@media screen and (max-width: 767px) { 

	.flex-layout.swiper_steps .step-card {
		justify-content: space-between;
	}

}