/**
 * Форма заявки «Получить консультацию».
 * Используется и в секции на странице, и в попапе — поэтому подключается на всех страницах.
 */

/* Feedback — Figma 1:2213 (1920×1007; image 977×1141 at x1170 y17) */
.mbi-feedback {
	position: relative;
	isolation: isolate;
	padding: 128px 0;
	background: var(--bg-white);
	color: var(--txt-blue);
	overflow: hidden;
	min-height: 1007px;
	box-sizing: border-box;
	border-bottom: 200px solid var(--bg-dark-blue);
}

.mbi-feedback__container {
	position: relative;
	z-index: 1;
}

.mbi-feedback__card {
	max-width: 964px;
	margin: 0;
	padding: 0;
	background: transparent;
	border-radius: 0;
	color: var(--txt-blue);
}

.mbi-feedback__intro {
	display: flex;
	flex-direction: column;
	gap: 32px;
	margin-bottom: 63px;
}

.mbi-feedback__title {
	margin: 0;
	max-width: 920px;
	font-size: clamp(32px, 3.4vw, 64px);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: -0.08em;
	text-transform: uppercase;
	color: var(--txt-blue);
}

.mbi-feedback__title-accent {
	color: var(--txt-coffee);
}

.mbi-feedback__text {
	margin: 0;
	max-width: 920px;
	font-size: 24px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: -0.03em;
	color: var(--txt-blue);
}

.mbi-feedback__form {
	display: flex;
	flex-direction: column;
	gap: 40px;
	max-width: 910px;
}

.mbi-feedback__fields {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.mbi-feedback__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.mbi-feedback__field {
	display: block;
	margin: 0;
}

.mbi-feedback__field--wide {
	width: 100%;
}

.mbi-feedback__form input,
.mbi-feedback__form textarea {
	width: 100%;
	height: 76px;
	padding: 24px;
	border: 0;
	border-radius: var(--radius);
	background: var(--bg-blue);
	color: var(--txt-white);
	font-family: inherit;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: -0.02em;
	box-sizing: border-box;
}

.mbi-feedback__form textarea {
	height: 160px;
	min-height: 160px;
	resize: vertical;
}

.mbi-feedback__form input::placeholder,
.mbi-feedback__form textarea::placeholder {
	color: var(--txt-white);
	opacity: 1;
}

.mbi-feedback__form input:focus,
.mbi-feedback__form textarea:focus {
	outline: 2px solid var(--bg-coffee);
	outline-offset: 0;
}

.mbi-feedback__agree {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--txt-blue);
}

.mbi-feedback__agree input {
	width: auto;
	height: auto;
	margin-top: 2px;
	padding: 0;
	accent-color: var(--bg-coffee);
}

.mbi-feedback__agree a {
	color: var(--txt-coffee);
}

.mbi-feedback__error {
	margin: 0;
	color: #b42318;
}

.mbi-feedback__submit {
	width: 100%;
	height: 76px;
	min-height: 76px;
	box-sizing: border-box;
}

/* Image overflows section; overflow:hidden clips — flush to right edge */
.mbi-feedback__side {
	position: absolute;
	top: 17px;
	left: 60.9375%; /* 1170 / 1920 */
	z-index: 0;
	width: 50.8854167%; /* 977 / 1920 */
	aspect-ratio: 977 / 1141;
	pointer-events: none;
}

.mbi-feedback__side img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: left top;
}

.mbi-feedback__ok-text {
	margin: 0 0 24px;
	font-size: 18px;
	line-height: 1.5;
	color: var(--txt-blue);
}

.mbi-feedback__success .mbi-feedback__title {
	margin-bottom: 24px;
}

@media (max-width: 1280px) {
	.mbi-feedback {
		min-height: 0;
		padding: 96px 0;
	}

	.mbi-feedback__side {
		position: relative;
		top: auto;
		left: auto;
		width: min(100%, 560px);
		aspect-ratio: 977 / 1141;
		height: auto;
		max-height: 480px;
		margin: 40px 0 0 auto;
		overflow: hidden;
	}

	.mbi-feedback__side img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: left top;
	}

	.home-about__grid,
	.home-products__grid,
	.home-catalog__grid,
	.home-news__grid,
	.home-cycle__grid,
	.home-production__grid,
	.home-panels__grid,
	.home-stats-block__grid,
	.mbi-feedback__row,
	.home-panorama__inner {
		gap: 40px;
	}
}

@media (max-width: 700px) {
	/* Сетки главной живут в home.css — здесь только форма. */
	.mbi-feedback__row,
	.mbi-feedback__fields {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.mbi-feedback {
		min-height: 0;
		padding: 80px 0;
	}

	.mbi-feedback__side {
		position: relative;
		top: auto;
		left: auto;
		width: min(100%, 560px);
		aspect-ratio: 977 / 1141;
		height: auto;
		max-height: 480px;
		margin: 40px 0 0 auto;
		overflow: hidden;
	}

	.mbi-feedback__side img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: left top;
	}

	.mbi-feedback__intro {
		margin-bottom: 32px;
		gap: 20px;
	}

	.mbi-feedback__text {
		font-size: 18px;
	}

	.mbi-feedback__form {
		gap: 24px;
	}

	.mbi-feedback__row {
		grid-template-columns: 1fr;
	}

	.mbi-feedback__form input,
	.mbi-feedback__submit {
		height: var(--btn-h);
		min-height: var(--btn-h);
		padding: 14px 20px;
		font-size: 16px;
	}

	.mbi-feedback__form textarea {
		height: 140px;
		min-height: 140px;
	}
}

