.bg--linearGradient-zero-area {
	background: linear-gradient(
		180deg,
		var(--secondary-palette-warm-grey-100) 0%,
		var(--secondary-palette-white) 100%
	);
}

.left-zero__with-shape::before {
	content: "";
	background-color: var(--secondary-palette-white);
	background-image: url("../svg/left-zero-pattern-bg.svg");
	background-repeat: no-repeat;
	background-position: left;
	background-size: contain;
	position: absolute;
	top: 0;
	left: -25%;
	width: calc(100% + 25%);
	height: 100%;
	border-radius: 0 120px 0 0;
	border: 1px solid var(--primary-palette-yellow);
	box-shadow: 0 5.4800px 7.4800px 0 rgb(179 196 220 / 26%);
	z-index: -1;
}

.left-zero__with-shape__card {
	background-color: var(--secondary-palette-dark-grey-400);
	border: 1px solid var(--secondary-palette-cool-grey);
}

.left-zero__with-shape__card:hover {
	background: var(--secondary-palette-dark-grey-200);
	transition: background-color 0.3s ease-in;
}

.left-zero__with-shape__card:hover a {
	color: var(--primary-palette-blue) !important;
}

.bg-has-left-bottom-image::before {
	background-repeat: no-repeat;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 615px;
	z-index: 0;
}

.bg-has-left-bottom-image::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 0;
	background-repeat: no-repeat;
}

.left-zero__without-shape__card:hover {
	box-shadow: 0 5px 10px 0 rgb(0 0 0 / 25%);
	transition: box-shadow 0.3s ease-in;
}

.left-zero__without-shape__card:hover a {
	color: var(--primary-palette-blue);
}

.left-zero__without-shape__card:hover a::after {
	background-image: url("../svg/blue-arrow-icon.svg");
}

.left-zero__plane__card {
	background-color: var(--secondary-palette-dark-grey-400);
	border: 1px solid var(--secondary-palette-cool-grey);
	box-shadow: 0px 4px 4px 0px #00000026;
}

.left-zero__plane__card:hover {
	background: var(--secondary-palette-dark-grey-200);
	transition: background-color 0.3s ease-in;
}

.left-zero__plane__card:hover a {
	color: var(--primary-palette-blue) !important;
}

.left-zero__without-shape__card--image{
	width: 120px;
}

@media only screen and (width <= 1400px) {
	.left-zero__with-shape::before {
		background-size: cover;
	}
}

@media only screen and (width <= 991.98px) {
	.left-zero__with-shape::before {
		border-left: 0;
		border-right: 0;
		border-radius: 0;
	}
}

@media only screen and (width <= 575.98px) {
	.left-zero__with-shape .hide-scrollbar {
		padding-right: 0;
	}

	.left-zero__variant--three .hide-scrollbar {
		padding-right: 0;
	}
}

@media only screen and (width >= 1940px) {
	.left-zero__with-shape::before {
		left: -80%;
		width: calc(100% + 1055px);
	}
}

@media only screen and (width >= 3024px) {
	.left-zero__with-shape::before {
		left: -195%;
		width: calc(100% + 2575px);
	}
}