/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

.selection {
	background-color: var(--color-dark);
}

.selection__head {
	color: var(--color-white);
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 32px 416px;
	grid-template-columns: 1fr 416px;
	gap: 32px;
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: end;
	margin-bottom: 34px;
	.description {
		margin-bottom: 30px;
	}
}

.selection__blocks {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 16px;
}
.selection-block {
	color: var(--color-white);
	padding: 32px;
	background-color: rgba(255, 255, 255, 0.05);
}
.selection-block__title {
	text-align: center;
	margin-bottom: 32px;
	font-weight: 700;
	font-size: 24px;
	text-transform: uppercase;
}

.selection-card {
	aspect-ratio: 1;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	padding: 24px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

.selection-block__text {
	margin-top: 32px;
	text-align: center;
}
.pricing {
	.head {
		gap: 32px;
	}
	.bottom {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 12px;
	}
}

.pricing__blocks {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 48px 1fr 48px 1fr;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px 48px;
}
.pricing-block {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 24px;
}
.pricing-block__title {
	font-weight: 700;
	font-size: 24px;
	line-height: 140%;
	text-transform: uppercase;
}
.pricing-block__list {
	li {
		padding: 8px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 10px;
		line-height: 140%;
		&:nth-child(odd) {
			background-color: #e9e5e9;
		}
		span {
			display: -webkit-inline-box;
			display: -ms-inline-flexbox;
			display: inline-flex;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			-webkit-box-align: center;
			-ms-flex-align: center;
			align-items: center;
			padding: 8px 12px;
			margin-left: auto;
			width: 70px;
			height: 41px;
			font-weight: 700;
			color: var(--color-white);
			background: var(--color-accent-dark);
		}
	}
}

.serving {
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;

	.sescription {
		margin-top: auto;
	}
}
.explore {
	background-color: var(--color-white-bg);
}

.serving__inner {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 64px 484px;
	grid-template-columns: 1fr 484px;
	gap: 64px;
}
.serving__content {
	color: var(--color-white);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.serving__form {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 8px;
	margin-top: 32px;
	.button {
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
	}
	.field {
		textarea,
		input {
			border-color: var(--color-white);
			background-color: rgba(255, 255, 255, 0.1);
		}
	}
}

@media (max-width: 1199.98px) {
	.selection__head {
		-ms-grid-columns: (1fr) [2];
		grid-template-columns: repeat(2, 1fr);
	}
	.selection-block {
		padding: 24px;
	}
	.serving__inner {
		-ms-grid-columns: (1fr) [2];
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 767.98px) {
	.selection__head {
		margin-bottom: 40px;
		-ms-grid-columns: auto;
		grid-template-columns: auto;
		text-align: center;
		.description {
			margin-bottom: 0;
		}
	}
	.selection-block {
		margin-inline: -16px;
		padding: 16px;
	}
	.selection-swiper {
		overflow: visible !important;
		.swiper-slide {
			width: 258px;
		}
	}
	.selection-block__title {
		font-size: 18px;
	}
	.selection-card {
		padding: 20px;
	}
	.pricing__blocks {
		-ms-grid-columns: auto;
		grid-template-columns: auto;
	}
	.pricing-block__title {
		font-size: 20px;
	}
	.pricing-block {
		gap: 16px;
	}
	.pricing-block__list {
		& li {
			span {
				height: 38px;
				padding: 4px;
			}
		}
	}
	.serving__inner {
		-ms-grid-columns: auto;
		grid-template-columns: auto;
		text-align: center;
	}
	.serving__form {
		margin-top: 0;
	}
}