/* Stacking Cards
---------------------------------------- */

.nou-stacking-cards {
	--nou-stack-card-offset: 26px;
	--nou-stack-card-top: 108px;
	--nou-stack-blue: #0837ff;
	--nou-stack-text: #080d21;
	--nou-stack-muted: #52627c;
	background: #f7faff;
}

.nou-stacking-heading {
	margin-left: auto;
	margin-right: auto;
}

.nou-stacking-title {
	color: var(--nou-stack-text);
	font-size: 44px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.12;
	margin: 0;
}

.nou-stacking-copy {
	color: var(--nou-stack-muted);
	font-size: 18px;
	line-height: 1.65;
	margin: 0;
}

.nou-stacking-cards > .nou-stacking-card {
	background:
		radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.92), transparent 34%),
		radial-gradient(circle at 76% 32%, rgba(222, 232, 255, 0.86), transparent 42%),
		linear-gradient(rgba(255, 255, 255, 0.62) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.62) 1px, transparent 1px),
		#edf3ff;
	background-size: auto, auto, 118px 118px, 118px 118px, auto;
	border: 1px solid #dbe6ff;
	box-shadow: 0 24px 70px rgba(23, 43, 77, 0.08);
	color: var(--nou-stack-text);
	overflow: hidden;
	padding: 56px 58px;
	position: sticky;
	top: var(--nou-stack-card-top);
}

.nou-stacking-cards > .nou-stacking-card + .nou-stacking-card {
	top: calc(var(--nou-stack-card-top) + var(--nou-stack-card-offset));
}

.nou-stacking-step {
	align-items: center;
	background: #fff;
	border: 1px solid #dbe6ff;
	border-radius: 999px;
	color: var(--nou-stack-blue);
	display: inline-flex;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	margin: 0;
	padding: 10px 16px;
	width: fit-content;
}

.nou-stacking-card-title {
	color: var(--nou-stack-text);
	font-size: 36px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.14;
	margin: 0;
}

.nou-stacking-card-copy {
	color: var(--nou-stack-muted);
	font-size: 18px;
	line-height: 1.65;
	margin: 0;
}

.nou-stacking-image {
	background: #fff;
	border: 1px solid #dbe6ff;
	border-radius: 20px;
	box-shadow: 0 24px 64px rgba(23, 43, 77, 0.12);
	margin: 0;
	overflow: hidden;
}

.nou-stacking-image img {
	aspect-ratio: 1.46;
	display: block;
	height: auto;
	object-fit: cover;
	object-position: top;
	width: 100%;
}

@media (max-width: 900px) {
	.nou-stacking-title {
		font-size: 36px;
	}

	.nou-stacking-card-title {
		font-size: 30px;
	}
}

@media (max-width: 781px) {
	.nou-stacking-cards > .nou-stacking-card {
		border-radius: 22px;
		padding: 32px 24px;
		position: relative;
		top: auto;
	}

	.nou-stacking-cards > .nou-stacking-card + .nou-stacking-card {
		top: auto;
	}

	.nou-stacking-title {
		font-size: 32px;
	}

}
