.t-quiz {
	--step-padding-top: 45px;
	--padding-vertical: 35px;
	--padding-horizontal: 45px;
	--primary-color: #1f5bff;
	--primary-color-transparent: #1f5bff33;
	--panel-default-bg-color: #f4f4f4;
	--text-secondary: rgba(0, 0, 0, 0.5);
	--background-padding: 10px;
	--two-cols-even: minmax(0, 1fr) minmax(0, 1fr);
	--two-cols-odd: minmax(0, 1fr) minmax(0, 2fr);
	--full-height: 100vh;
	--full-height-with-border: calc(100vh - var(--border-size) * 2);
	--height-100-with-border: calc(100% - var(--border-size) * 2);
	--min-height-mobile: 550px;
	--max-height-mobile: 80vh;
	--min-height-tablet: 650px;
	--gap-between-two-cols: 40px;
	--panel-type: none;
	--mobile-distance-to-consultant: 28px;
	--mobile-distance-to-media: 15px;
	--step-overflow-gradient-height: 20px;
}

.t-quiz.topside-panel {
	--panel-type: header;
}

.t-quiz.rightside-panel,
.t-quiz.leftside-panel {
	--panel-type: sidebar;
}

.t-quiz__quiz {
	width: 100%;
	border-radius: var(--outer-border-radius);
	background-color: var(--panel-default-bg-color);
	box-sizing: border-box;
	container: quiz / inline-size;
	/* остальные стили для обводки задаются в шаблоне блока */
	border-style: solid;
}

.t-quiz.popup .t-popup__container {
	border-radius: var(--outer-border-radius);
}

.t-quiz.popup .t-popup__container.t-popup__container_no-transform {
	/* 
		оставляем transition только для высоты, чтобы при переключении блока в static позиционирование
		не было резкого скачка. Проявляется при изменнии динамической высоты и маленького шага на очень высокий.
	*/
	transition: height ease-in-out 0.3s !important;
}

.t-quiz__quiz-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	transition: all ease-in-out 0.3s;
	background-color: var(--panel-background-color);
	/* остальные стили для обводки задаются в шаблоне блока */
	border-style: solid;
}

.t-quiz.popup.fullscreen:not(.fixed-height) .t-quiz__quiz-wrapper {
	height: var(--height-100-with-border);
}

/* 
	фулскрин без фиксированной высоты - минимальная высота квиза в 100vh
	если контента больше, то блок растягивается
*/
.t-quiz.fullscreen:not(.popup):not(.fixed-height) {
	display: flex;
	min-height: var(--full-height);
}

/* фулскрин попап растягивается на всю ширину экрана */
.t-quiz.popup.fullscreen .t-popup__container {
	display: flex;
	left: 0;
	right: 0;
}

/* 
	попап фулскрин без динамической высоты - минимальная 100vh
	попап должен растягиваться, если контента много
*/
.t-quiz.popup.fullscreen:not(.fixed-height) .t-popup__container {
	min-height: var(--full-height);
}

.t-quiz.popup.fullscreen.t-quiz.popup .t-popup__container,
.t-quiz.popup.fullscreen.fixed-height .t-quiz__quiz {
	background-color: transparent !important;
}

/* Фуллскриновый попап прилепает в краям экрана, сбрасываем отступы слева и справа */
.t-quiz.popup.fullscreen .t-popup {
	padding: 0;
}

/* Фулскрин попап без фиксированной высоты прилипает к краям экрана, потому что min-height: 100vh, сбрасываем верхний отступы */
.t-quiz.popup.fullscreen:not(.fixed-height) .t-popup__container.t-popup__container-static {
	margin: 0;
}

/* Растягиваем результат на максимальную высоту фулскрина: НЕ ИЗМЕНЯТЬ БЕЗ НЕОБХОДИМОСТИ */
.t-quiz:not(.fullscreen) .t-quiz__result-container {
	min-height: 100%;
	display: flex;
	flex-direction: column;
}

.t-quiz:not(.fullscreen) .t-quiz__result-wrapper {
	flex: 1;
}

/* important нужен чтобы перекрыть установленную высоту на элементе */
/* 
	Работает для всех фулскринов, чтобы результаты растягивались на всю высоту.
	Высота фулскрина задается либо в настройках, либо это 100vh
*/
/* result-wrapper 100% нужно, чтобы результат растягивался при маленькой высоте контента */
.t-quiz.fullscreen .t-quiz__result-wrapper,
.t-quiz.fullscreen .t-quiz__result {
	height: 100% !important;
}

/* 
	Правила работают только для состояния с фикс высотой. 
	Фулскрин с динамической высотой имееет фикс мин высоту в 100vh
*/
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__result-container,
.t-quiz.fixed-height .t-quiz__result-container {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.t-quiz.fullscreen:not(.fixed-height) .t-quiz__main,
.t-quiz.fixed-height .t-quiz__main {
	display: flex;
	flex-direction: column;
	flex: 1;
}
/* Используем flex, потому что height: 100% работает некоррктно в некоторых кейсах результата */
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__quiz-form-wrapper,
.t-quiz.fixed-height .t-quiz__quiz-form-wrapper {
	flex: 1;
}

/* На обычных шагах нет неободимости растягивать эту обертку, иначе она наезжает на футер */
.t-quiz.popup.fullscreen:not(.fixed-height):has(
		.t-quiz__cover.t-step-form__step_active,
		.t-quiz__result.t-step-form__step_active
	)
	.t-quiz__quiz-form-wrapper {
	height: 100%;
}

/* important нужен чтобы перекрыть установленную высоту на элементе */
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover,
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__fullscreen-container,
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__side-container,
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__container,
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__side-cover,
.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__img {
	height: 100% !important;
}

.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__sidebar {
	width: clamp(var(--sidebar-width), 20%, 300px);
}

.t-quiz .t-quiz.popup-fullscreen .t-popup__container {
	margin: 0;
}

.t-quiz__panel.t-quiz__sidebar,
.t-quiz__quiz-wrapper_fixed-height .t-quiz__main,
.t-quiz__quiz-wrapper_fixed-height .t-quiz__content-padding-container,
.t-quiz__quiz-wrapper_fixed-height .t-quiz__content-wrapper,
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fixed-height,
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_dynamic-height .t-quiz__cover {
	overflow-y: auto;
}

.t-quiz__content-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
	z-index: 1;
	background-color: var(--quiz-background-color, #ffffff);
	flex: 1;
	container: main / inline-size;
}

.t-step-form__step {
	padding: var(--step-padding-top) var(--padding-horizontal) 55px;
}

/* Cover */
.t-quiz__cover {
	width: 100%;
	padding: 0;
}

.t-quiz__cover__content-container {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 30px;
	width: 100%;
	align-items: center;
	justify-content: center;
}

.t-quiz__cover__fullscreen-container .t-quiz__cover__content-container {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 70px 100px;
}

.t-quiz__cover__fullscreen-container .t-quiz__cover__text-wrapper {
	overflow-y: auto;
}

.t-quiz__cover__side-container .t-quiz__cover__content-container {
	padding: 45px;
}

.t-quiz__cover__text-wrapper {
	display: flex;
	flex-direction: column;
}

.t-quiz__cover__title {
	word-wrap: break-word;
	max-width: 1160px;
}

.t-quiz__cover__descr {
	word-wrap: break-word;
	max-width: 700px;
}

.t-quiz__cover__title:has(+ .t-quiz__cover__descr) {
	padding-bottom: 15px;
}

.t-quiz__cover__fullscreen-container:has(.t-quiz__cover__filter) .t-quiz__cover__title,
.t-quiz__cover__fullscreen-container:has(.t-quiz__cover__filter) .t-quiz__cover__descr {
	color: white;
}

.t-quiz__cover__side-container {
	display: flex;
	flex-direction: row;
}

.t-quiz__cover__side-container.rightside {
	flex-direction: row;
}

.t-quiz__cover__side-container.leftside {
	flex-direction: row-reverse;
}

.t-quiz__cover__side-container .t-quiz__cover__side-cover {
	height: fit-content;
	position: sticky;
	top: 0;
}

.t-quiz__cover__side-container .t-quiz__cover__side-cover,
.t-quiz__cover__side-container .t-quiz__cover__content-container {
	flex-basis: 50%;
}

.t-quiz__cover_color {
	width: 100%;
	height: 100%;
}

.t-quiz__cover__filter {
	position: absolute;
	inset: 0;
}

.t-quiz__cover__container {
	position: relative;
	overflow: hidden;
}

.t-quiz__cover__img {
	height: 100%;
	width: 100%;
}

/* Panel */
.t-quiz__panel {
	position: relative;
	overflow: hidden;
	flex-shrink: 0;
	background-color: var(--panel-default-bg-color);
	padding: 30px var(--padding-horizontal);
}

.t-quiz__main__description-container {
	padding: 50px var(--padding-horizontal) 0;
}

.t-quiz__main .t-quiz__quiz-description-text,
.t-quiz__main .t-quiz__quiz-description-title,
.t-quiz__sidebar .t-quiz__quiz-description-text,
.t-quiz__sidebar .t-quiz__quiz-description-title {
	width: 100%;
}

.t-quiz__quiz-description {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	box-sizing: border-box;
	word-wrap: break-word;
}

.t-quiz__sidebar .t-quiz__quiz-description {
	flex-direction: column;
	align-items: flex-start;
}

.t-quiz__quiz-description-icon {
	vertical-align: top;
	width: 100%;
	max-width: 40px;
	height: auto;
}

.t-quiz__square {
	aspect-ratio: 1 / 1;
}

.t-quiz__circle {
	border-radius: 100%;
}

.t-quiz__quiz-description-title {
	flex: 1;
	width: 90%;
	box-sizing: border-box;
}

.t-quiz__quiz-description-text {
	display: inline-block;
}

.t-quiz__progress-bar-container {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	pointer-events: none;
	user-select: none;
	overflow: hidden;
	z-index: 2;
}

.t-quiz__progressbar {
	position: static;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 5px;
	background-color: var(--primary-color-transparent);
	transform: translate3d(0, 0, 0);
}

.t-quiz__progress {
	height: 100%;
	width: 0;
	background-color: var(--primary-color);
	transition: width 0.3s ease;
}

.t-quiz__panel__main {
	display: flex;
	flex-direction: column;
	gap: 25px;
}

.t-quiz.popup.fullscreen .t-quiz__panel__main {
	min-height: 32px;
}

/* Contact Form */
.t-quiz__contact-form__title {
	padding: 25px var(--padding-horizontal);
}

.t-quiz__contact-form {
	display: none;
}

.t-quiz__contact-form__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px;
}

.t-quiz__contact-form__layout:has(.t-quiz__consultant) {
	gap: 25px;
}

.t-quiz__contact-form__layout.t-input-group_two-cols {
	gap: var(--gap-between-two-cols);
}

.t-quiz__contact-form .t-input-group {
	display: flex;
}

.t-quiz__contact-form__footer {
	margin-top: 20px;
}

/* 
	По умолчанию хедер распологается в одну колноку.
*/
.t-quiz__contact-form__header {
	display: grid;
	grid-template-columns: 1fr;
	gap: 25px;
	align-self: start;
}

.t-quiz__contact-form__header__text-wrapper {
	display: flex;
	flex-direction: column;
}

.t-quiz__contact-form__footer__text,
.t-quiz__contact-form__header__descr,
.t-quiz__contact-form__header__title {
	word-break: break-word;
}

.t-quiz__contact-form__header__title:has(+ .t-quiz__contact-form__header__descr) {
	padding-bottom: 15px;
}

/* 
	При расположении полей в одну колонку, консультант на форме контактов располаается справа от заголовка и описания.
	Если включена верхняя панель или ее нет вообще, то консультант располагается рядом с заголовком
*/
.t-quiz__quiz-wrapper.topside-panel
	.t-quiz__contact-form__layout.t-input-group_one-col
	.t-quiz__contact-form__header:has(.t-quiz__consultant),
.t-quiz__quiz-wrapper.without-panel
	.t-quiz__contact-form__layout.t-input-group_one-col
	.t-quiz__contact-form__header:has(.t-quiz__consultant) {
	display: grid;
	grid-template-columns: var(--two-cols-even);
	gap: 16px;
}

/* Footer */
.t-quiz__footer {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: 40px;
	margin-top: auto;
	padding-left: var(--padding-horizontal);
	padding-right: var(--padding-horizontal);
	padding-bottom: 45px;
	container: footer / inline-size;
}

.t-quiz__footer-sticky {
	position: sticky;
	z-index: 1;
	bottom: 0;
	left: 0;
	right: 0;

	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 0%,
		var(--btn-wrapper-background-color) var(--step-overflow-gradient-height)
	);
	padding-top: var(--step-overflow-gradient-height);
}

.t-quiz__footer-sticky:has(.t-quiz__footer.t-quiz-hidden) {
	display: none;
}

.t-quiz__btn-wrapper {
	display: flex;
	justify-content: flex-end;
	flex: 1;
	gap: 8px;
}

/* Buttons */
.t-quiz .t-btnflex_sm {
	padding: 15px;
}

.t-quiz .t-btnflex_md {
	padding: 15px 30px;
	min-width: 130px;
}

/* Inputs */
.t-quiz__inputs-wrapper {
	display: flex;
	flex-direction: column;
	/* Отступ между полями для ввода на шаге с несколькими полями */
	gap: 40px;
}

.t-quiz .t-step-form__step_active .t-input-group {
	display: grid;
}

.t-quiz .t-input-group {
	display: block;
	flex-direction: column;
}

.t-quiz .t-input-group {
	gap: 25px;
}

.t-quiz .t-input-group.t-input-group_two-cols {
	gap: var(--gap-between-two-cols);
}

.t-quiz .t-input-title:has(+ .t-input-subtitle) {
	padding-bottom: 5px;
}

/* Отступ между заголовком и контентом на форме контактов */
.t-quiz__contact-form .t-quiz__inputs-wrapper .t-input-group:not(.t-input-group_two-cols) {
	gap: 5px;
}

/* Отступ между подзаголовком и контентом на форме контактов */
.t-quiz__contact-form .t-quiz__inputs-wrapper .t-input-group:not(.t-input-group_two-cols):has(.t-input-subtitle) {
	gap: 15px;
}

/* Отступ между полями для ввода на шаге на форме контактов */
.t-quiz__contact-form .t-quiz__inputs-wrapper {
	gap: 25px;
}

.t-quiz .t-input-group__title-container {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.t-quiz .t-input-block textarea {
	padding-top: 17px;
}

.t-quiz .t-input-title,
.t-quiz .t-input-subtitle {
	height: unset;
	word-wrap: break-word;
}

.t-quiz .t-inputtime,
.t-quiz .t-datepicker__wrapper {
	max-width: 245px;
}

.t-quiz .t-form_bbonly .t-input-title {
	margin-bottom: 0;
}

.t-quiz .t-form_bbonly .t-input-subtitle {
	padding-bottom: 0;
	padding-top: 5px;
}

.t-quiz__variants-hint {
	margin-top: 15px;
	opacity: 0.5;
	font-style: italic;
}

.t-quiz .t-ownvariant-wrapper_flex .t-input-ownanswer {
	height: calc(1em + 5px);
}

.t-quiz .t-img-select__text {
	margin-top: 10px;
}

.t-quiz .t-radio__wrapper {
	margin-top: 0;
}

.t-quiz .t-img-select__container {
	margin: 0;
}

.t-quiz .t-img-select__container.t-img-select__container_all-in-row {
	padding-right: var(--padding-horizontal);
}

.t-quiz .t-input-block:has(.t-img-select__container_all-in-row) {
	margin-left: calc(var(--padding-horizontal) * -1);
	margin-right: calc(var(--padding-horizontal) * -1);
	padding-left: var(--padding-horizontal);
}

.t-quiz .t-img-select__item,
.t-quiz .t-img-select__control {
	margin: 0;
}

.t-quiz .t-input-block:has(.t-contact-method__types-container) {
	--contact-method-padding-h: var(--padding-horizontal);
}

/* Reset INPUT RD Styles */
.t-quiz .t-checkboxes__wrapper .t-checkbox__control,
.t-quiz .t-checkboxes__wrapper .t-ownvariant-wrapper_flex {
	margin-top: 0;
}

.t-quiz .t-checkboxes__wrapper_button.t-checkboxes__wrapper .t-checkbox__control,
.t-quiz .t-checkboxes__wrapper_button.t-checkboxes__wrapper .t-ownvariant-wrapper_flex {
	margin: 0;
}

.t-quiz .t-radio__wrapper_button .t-radio__ownvariant-wrapper:last-of-type,
.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item:last-of-type {
	margin-bottom: 0;
}

.t-quiz .t-radio__wrapper_button .t-radio__item,
.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item {
	margin-bottom: 0;
	min-height: 60px;
	height: auto;
}

.t-quiz .t-form__inputsbox .t-radio__wrapper_button .t-radio__item {
	padding: 10px 15px;
}

.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item {
	padding: 0;
}

.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item {
	display: flex;
	flex-direction: column;
}

.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item .t-checkbox__control {
	padding: 10px 15px;
	box-sizing: border-box;
	flex: 1;
}

.t-quiz .t-checkboxes__wrapper_button .t-checkboxes__item .t-checkboxes__ownvariant-wrapper {
	display: flex;
	flex-direction: column;
	flex: 1;
	height: 100%;
}

.t-quiz .t-input-block_rd-flex .t-radio__wrapper,
.t-quiz .t-input-block_rd-flex .t-checkboxes__wrapper,
.t-quiz .t-input-block_rd-flex .t-radio__wrapper fieldset,
.t-quiz .t-input-block_rd-flex .t-checkboxes__wrapper fieldset {
	gap: 15px;
}

.t-quiz .t-input-block_rd-flex .t-radio__control,
.t-quiz .t-input-block_rd-flex .t-radio__control:first-child,
.t-quiz .t-input-block_rd-flex .t-radio__control:last-child {
	margin: 0;
}

.t-quiz .t-input-block:not(.t-input-block_rd-flex) .t-checkboxes__wrapper,
.t-quiz .t-input-block:not(.t-input-block_rd-flex) .t-radio__wrapper {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.t-quiz .t-radio__control.t-radio__control,
.t-quiz .t-checkbox__control.t-checkbox__control {
	margin: 0;
}
/* End */

.t-quiz__main {
	z-index: 1;
	position: relative;
}

.t-quiz__main.t-quiz-hidden .t-quiz__quiz-form-wrapper {
	overflow: hidden;
	max-height: 0px;
	opacity: 0;
	visibility: hidden;
}

.t-quiz .justify-start {
	justify-content: flex-start;
}

.t-quiz .justify-center {
	justify-content: center;
}

.t-quiz .justify-end {
	justify-content: flex-end;
}

.t-quiz .align-start {
	align-items: flex-start;
	text-align: start;
}

.t-quiz .align-center {
	align-items: center;
	text-align: center;
}

.t-quiz .align-end {
	align-items: flex-end;
	text-align: end;
}

/* Result */
.t-step-form__step.t-quiz__result {
	height: 100%;
	padding: 0;
	box-sizing: border-box;
}

.t-quiz__result-container {
	padding-left: var(--padding-horizontal);
	padding-right: var(--padding-horizontal);
}

/* Описание отступов для результата: https://www.figma.com/design/aGV0QTdzDhMRVcxIWXzzUx/Quiz?node-id=2432-8&t=L1iO66Bf1BqHxe7H-11
	Отступы вокруг шага;
*/
.t-quiz__result_rightside .t-quiz__result-wrapper,
.t-quiz__result_leftside .t-quiz__result-wrapper {
	padding-top: 45px;
	padding-bottom: 45px;
}

.t-quiz__result_topside .t-quiz__result-wrapper {
	padding-top: 30px;
	padding-bottom: 45px;
}

.t-quiz__result_bottomside .t-quiz__result-wrapper {
	padding-top: 45px;
	padding-bottom: 45px;
}

/* Отступы между изображением и контентом */
.t-quiz__result_bottomside .t-quiz__result-content-wrapper {
	margin-bottom: 45px;
}

.t-quiz__result_topside .t-quiz__result-img-wrapper {
	margin-bottom: 25px;
}

/* Отступы между кнопкой и контентом */
/* 
		Обновленная верстка.
		В обновленной верстке у всех кнопок есть контейнер. 
		Если контейнер есть, то внешние отступы задаются через него.
		Старые стили сохранены для обратной совместимости.
	*/
.t-quiz__result-button-container .t-quiz__result-btn {
	margin-top: 0 !important;
}

.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-button-container,
.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-btn {
	margin-top: 25px;
}

.t-quiz__result_leftside .t-quiz__result-button-container,
.t-quiz__result_rightside .t-quiz__result-button-container,
.t-quiz__result_leftside .t-quiz__result-btn,
.t-quiz__result_rightside .t-quiz__result-btn {
	margin-top: 30px;
}

.t-quiz__result_bottomside .t-quiz__result-button-container,
.t-quiz__result_bottomside .t-quiz__result-btn {
	margin-top: 25px;
}

/* При sticky позиционировании кнопки на результате, отступ переносится в обертку с кнопкой */
.t-quiz__result_topside .t-quiz__result-wrapper:has(.sticky) {
	padding-bottom: 25px;
}

/* Используется padding, чтобы правильно работала маска c gradient'ом при sticky позициониривании */
.t-quiz__result_topside .t-quiz__result-wrapper:has(.sticky) .t-quiz__result-btn-wrapper {
	padding-top: 20px;
	padding-bottom: 20px;
}

.t-quiz__result_topside .t-quiz__result-content-wrapper.sticky .t-quiz__result-text {
	padding-bottom: 5px;
}

.t-quiz__result-button-container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

.t-quiz__result-button-container.t-align_left {
	justify-content: flex-start;
}

.t-quiz__result-button-container.t-align_center {
	justify-content: center;
}

.t-quiz__result-button-container.t-align_right {
	justify-content: flex-end;
}

.t-quiz__result-btn-wrapper {
	--gradient-height: 10px;

	position: sticky;
	bottom: 0;
	display: flex;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 0%,
		var(--btn-wrapper-background-color) var(--gradient-height)
	);
}

.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn {
	flex: 1;
	max-width: 500px;
}

/* Если кнопка одна, то у нее есть минимальная ширина вместо flex, чтобы не растягивалась слишком сиильно */
.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn:only-child {
	flex: unset;
	min-width: 400px;
}

@media screen and (max-width: 640px) {
	.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn:only-child {
		min-width: unset;
	}
}

.t-quiz__result_topside .t-quiz__result-wrapper,
.t-quiz__result_bottomside .t-quiz__result-wrapper {
	width: 100%;
	max-width: 560px;
	margin: auto;
}

.t-quiz__result_flex .t-quiz__result-wrapper {
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
}

.t-quiz__result_flex .t-quiz__result-content-wrapper {
	align-self: center;
}

.t-quiz__result_flex .t-quiz__result-content-wrapper.justify-start {
	align-self: flex-start;
}

.t-quiz__result_flex .t-quiz__result-content-wrapper.justify-end {
	align-self: flex-end;
}

.t-quiz__result_flex .t-quiz__result-content-wrapper,
.t-quiz__result_flex .t-quiz__result-img-wrapper {
	width: 48%;
}

.t-quiz__result_block .t-quiz__result-img-wrapper {
	width: 100%;
	aspect-ratio: 16/9;
}

.t-quiz__result-img-wrapper {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.t-quiz__result-content-wrapper {
	display: flex;
	flex-direction: column;
}

.t-quiz__result-content-wrapper.t-align_left {
	align-items: flex-start;
}

.t-quiz__result-content-wrapper.t-align_center {
	align-items: center;
}

.t-quiz__result-content-wrapper.t-align_right {
	align-items: flex-end;
}

.t-quiz__result-content-wrapper,
.t-quiz__result-img-wrapper {
	box-sizing: border-box;
}

.t-quiz__result-img {
	display: block;
	max-width: 100%;
}

.t-quiz__result-title:has(+ .t-quiz__result-text) {
	padding-bottom: 10px;
}

.t-quiz__result.t-form__successbox {
	background-color: transparent;
}

/* При результате в виде сообщения об успешной отправке, скрываем панель или описание */
.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active) .t-quiz__panel,
.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active) .t-quiz__main__description-container {
	display: none;
}

/* Result */

.t-quiz__cover__btns-container {
	display: flex;
	flex-direction: row;
	gap: 8px;
}

.t-quiz__quiz-wrapper.topside-panel .t-quiz__sidebar .t-quiz__consultant,
.t-quiz__quiz-wrapper.without-panel .t-quiz__sidebar .t-quiz__consultant,
.t-quiz__quiz-wrapper.leftside-panel .t-quiz__contact-form__header .t-quiz__consultant,
.t-quiz__quiz-wrapper.rightside-panel .t-quiz__contact-form__header .t-quiz__consultant,
.t-quiz__quiz-wrapper.leftside-panel .t-input-group__header .t-quiz__consultant,
.t-quiz__quiz-wrapper.rightside-panel .t-input-group__header .t-quiz__consultant {
	display: none;
}

.t-quiz__quiz-wrapper.topside-panel .t-input-group__header .t-quiz__consultant,
.t-quiz__quiz-wrapper.without-panel .t-input-group__header .t-quiz__consultant,
.t-quiz__quiz-wrapper.leftside-panel .t-quiz__sidebar .t-quiz__consultant,
.t-quiz__quiz-wrapper.rightside-panel .t-quiz__sidebar .t-quiz__consultant {
	display: block;
}

.t-quiz__quiz-wrapper.topside-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant),
.t-quiz__quiz-wrapper.without-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant) {
	display: grid;
	grid-template-columns: var(--two-cols-even);
	gap: 16px;
}

/* При расположении полей в одну колонку, наличии консультанта и изображения увеличиваем gap в хэдере до 25, 
	чтобы консультант и изображение выравнивались по вертикали относительно друг друга
*/
.t-quiz__quiz-wrapper.topside-panel:not(.t-quiz__inputs-in-cols)
	.t-step-form__step_active:has(.t-quiz__consultant, .t-quiz-step__media)
	.t-input-group__header,
.t-quiz__quiz-wrapper.without-panel:not(.t-quiz__inputs-in-cols)
	.t-step-form__step_active:has(.t-quiz__consultant, .t-quiz-step__media)
	.t-input-group__header {
	gap: 25px;
}

.t-quiz__quiz-wrapper.topside-panel.t-quiz__inputs-in-cols .t-input-group__header:has(.t-quiz__consultant),
.t-quiz__quiz-wrapper.without-panel.t-quiz__inputs-in-cols .t-input-group__header:has(.t-quiz__consultant),
.t-quiz__quiz-wrapper.topside-panel.t-quiz__inputs-in-cols .t-input-group__header:has(.t-quiz-step__media),
.t-quiz__quiz-wrapper.without-panel.t-quiz__inputs-in-cols .t-input-group__header:has(.t-quiz-step__media),
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_withsidebar.t-quiz__inputs-in-cols
	.t-input-group__header:has(.t-quiz-step__media) {
	display: grid;
	grid-template-columns: 1fr;
	gap: 25px;
	align-self: start;
}

.t-quiz__consultant__container {
	display: flex;
	justify-content: flex-start;
	gap: 15px;
}

.t-input-group_two-cols .t-quiz__contact-form__header .t-quiz__consultant__container,
.t-input-group_two-cols .t-input-group__header .t-quiz__consultant__container {
	flex-direction: row;
}

.t-input-group_one-col .t-quiz__contact-form__header .t-quiz__consultant__container,
.t-input-group_one-col .t-input-group__header .t-quiz__consultant__container {
	flex-direction: row-reverse;
}

.t-quiz__sidebar .t-quiz__consultant__container {
	flex-direction: column;
}

.t-quiz__consultant__msg-bubble {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: fit-content;
	max-width: 100%;
	padding: 10px 12px;
	background-color: var(--consultant-msg-bubble-bg);
	border-radius: 4px;
	box-sizing: border-box;
}

.t-quiz__consultant__info-container + .t-quiz__consultant__msg-bubble::after {
	content: '';
	position: absolute;
	margin: 0;
	width: 0;
	height: 0;
	line-height: 0;
}

/* Расположение в две колонки: форма контактов, поле для ввода */
.t-input-group_two-cols .t-quiz__contact-form__header .t-quiz__consultant__msg-bubble::after,
.t-input-group_two-cols .t-input-group__header .t-quiz__consultant__msg-bubble::after {
	top: 15px;
	left: -8px;
	border-top: 8px solid transparent;
	border-right: 8px solid var(--consultant-msg-bubble-bg);
	border-bottom: 8px solid transparent;
	border-left: 8px;
}

/* Расположение в одну колонку: форма контактов, поле для ввода */
.t-input-group_one-col .t-quiz__contact-form__header .t-quiz__consultant__msg-bubble::after,
.t-input-group_one-col .t-input-group__header .t-quiz__consultant__msg-bubble::after {
	top: 15px;
	right: -8px;
	border-top: 8px solid transparent;
	border-right: 8px;
	border-bottom: 8px solid transparent;
	border-left: 8px solid var(--consultant-msg-bubble-bg);
}

.t-quiz__sidebar .t-quiz__consultant__msg-bubble::after {
	top: -8px;
	left: 15px;
	border-top: 8px;
	border-right: 8px solid transparent;
	border-bottom: 8px solid var(--consultant-msg-bubble-bg);
	border-left: 8px solid transparent;
}

.t-quiz__consultant__info-container {
	display: flex;
	flex-direction: row;
	gap: 10px;
	align-items: flex-start;
}

.t-quiz__consultant__img {
	width: 54px;
	aspect-ratio: 1;
	border-radius: 4px;
	overflow: hidden;
	object-fit: cover;
}
.t-quiz__consultant__descr {
	opacity: 0.5;
}

.t-quiz .t-form__errorbox-middle {
	padding: 0 var(--padding-horizontal) 30px;
	box-sizing: border-box;
}

.t-quiz__quiz_dynamic-height {
	transition: all 0.3s ease-in-out;
}

/* Popup */
.t-quiz__quiz__popup_dynamic-height {
	height: 100%;
	max-height: 100%;
	transition: height 0.3s ease-in-out;
}

.t-quiz-hidden {
	display: none !important;
}

.t-quiz .t-submit {
	height: unset;
}

.t-quiz__result-btn-wrapper .t-btn:disabled,
.t-quiz__cover__btns-container .t-btn:disabled,
.t-quiz__btn-wrapper .t-btn:disabled,
.t-quiz__btn-wrapper .t-submit:disabled {
	opacity: 0.4;
	pointer-events: none;
}

.t-quiz .t-form__inputsbox {
	transition: max-height 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.t-quiz .t-input {
	background-color: transparent;
	-webkit-appearance: none;
}

.t-quiz .t-input-block textarea.t-input_pvis {
	padding-top: 26px;
}

.t-quiz .t-input-block textarea {
	padding-top: 17px;
	background-color: transparent;
}

.t-quiz__quiz .t-form__successbox {
	margin: 0;
}

.t-quiz__footer__text-container {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 15px;
}

.t-quiz__counter-container {
	display: flex;
	align-items: center;
	opacity: 0.5;
}

.t-quiz__counter {
	/* Monospace Nums */
	font-variant-numeric: tabular-nums;
}

.t-quiz__text-extra {
	word-break: break-word;
}

.t-quiz__consultant__name-container {
	display: flex;
	flex-direction: column;
}

.t-quiz__content-padding-container {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	transition: padding 0.1s ease-in-out;
}

.t-quiz__quiz-wrapper_fullscreen .t-quiz__content-padding-container {
	display: flex;
	flex-direction: column;
}

.t-quiz__content-padding-container .t-quiz__content-wrapper {
	height: 100%;
}

/* TWO COLS CONTAINER */
.t-quiz__contact-form__layout.t-input-group_two-cols,
.t-quiz .t-input-group.t-input-group_two-cols {
	grid-template-columns: var(--two-cols-even);
}

/* .cols-1to2 - старая запись для обратной совместимости */
.t-quiz__contact-form__layout.cols_1to2,
.t-quiz__contact-form__layout.t-input-group_two-cols_1to2,
.t-quiz .t-input-group.cols_1to2,
.t-quiz .t-input-group.t-input-group_two-cols_1to2 {
	grid-template-columns: var(--two-cols-odd);
}

/* если внутри только один ребенок, то уберём две колонки */
.t-quiz__contact-form__layout.t-input-group_two-cols:has(> :first-child:last-child),
.t-quiz .t-input-group.t-input-group_two-cols:has(> :first-child:last-child),
.t-quiz__contact-form__layout.cols_1to2:has(> :first-child:last-child),
.t-quiz__contact-form__layout.t-input-group_two-cols_1to2:has(> :first-child:last-child),
.t-quiz .t-input-group.cols_1to2:has(> :first-child:last-child),
.t-quiz .t-input-group.t-input-group_two-cols_1to2:has(> :first-child:last-child) {
	grid-template-columns: 1fr;
}

.t-quiz__quiz-wrapper.leftside-panel {
	flex-direction: row;
}

.t-quiz__quiz-wrapper.rightside-panel {
	flex-direction: row-reverse;
}

.t-quiz__sidebar .t-quiz__sidebar__top-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.t-quiz__sidebar {
	--sidebar-width: 200px;
	--sidebar-padding-top: 25px;
	--sidebar-padding-bottom: 35px;
	--sidebar-gap: 40px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--sidebar-padding-top) 25px var(--sidebar-padding-bottom);
	width: var(--sidebar-width);
	gap: var(--sidebar-gap);
	box-sizing: border-box;
}

.t-quiz__sidebar .t-quiz__text-extra {
	margin-top: auto;
}

.t-quiz__quiz-wrapper_withsidebar .t-quiz__footer .t-quiz__text-extra {
	display: none;
}

.t-quiz__quiz-wrapper_fixed-height .t-quiz__main {
	height: 100%;
	mask-image: linear-gradient(
		to bottom,
		transparent 0,
		black var(--step-overflow-gradient-height),
		black calc(100% - var(--step-overflow-gradient-height)),
		transparent 100%
	);
}

.t-quiz__quiz-wrapper_fixed-height .t-quiz__main:has(.t-quiz__footer-sticky) {
	mask-image: linear-gradient(to bottom, transparent 0, black var(--step-overflow-gradient-height));
}

.t-quiz__quiz-wrapper_fixed-height
	.t-quiz__main:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active) {
	-webkit-mask-image: none;
	mask-image: none;
}

.t-quiz__counter-container.t-quiz__counter-container_mobile {
	display: none;
}

.t-quiz__quiz-wrapper_fixed-height.t-quiz__inputs-in-cols
	.t-quiz__screen-wrapper:not(.t-quiz__contact-form)
	.t-input-group__header {
	height: fit-content;
	position: sticky;
	top: var(--step-padding-top);
}

.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-step-form__step:not(.t-quiz__cover):not(.t-quiz__result),
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__panel:not(.t-quiz__sidebar),
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__main__description-container,
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__footer {
	padding-right: 0;
	padding-left: 0;
}

.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-width {
	margin: 0 auto;
	padding: 0 40px;
	box-sizing: border-box;
}

.t-quiz__quiz-wrapper.topside-panel:not(.t-quiz__inputs-in-cols) .t-quiz__consultant__msg-bubble,
.t-quiz__quiz-wrapper.without-panel:not(.t-quiz__inputs-in-cols) .t-quiz__consultant__msg-bubble,
.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__consultant__msg-bubble {
	max-width: 100%;
}

.t-quiz .t-form {
	height: 100%;
}

.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__quiz-description {
	flex-direction: column;
	padding: 0;
}

.t-quiz.popup.fullscreen .t-quiz__quiz-wrapper.topside-panel .t-quiz__panel__main {
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.t-quiz.popup.fullscreen .t-quiz__main__description-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.t-quiz.popup.fullscreen .t-popup__close {
	top: 20px;
	/* important чтобы не работала компенсация скролбара */
	right: 20px !important;
	width: auto;
	height: auto;
}

.t-quiz.popup .t-popup__block-close {
	width: 32px;
	height: 32px;
}

.t-quiz.popup .t-popup__block-close-button {
	width: 32px;
	height: 32px;
	padding: 0;
}
.t-quiz.popup .t-popup__close-icon path {
	fill: var(--btn-close-popup-icon-color);
}
.t-quiz.popup .t-popup__block-close-button svg {
	width: 20px;
	height: 20px;
}

/* Фулскрин попап - у кнопки закрытия есть фон тк она может перекрывать контент */
.t-quiz.popup.fullscreen .t-popup__block-close-button {
	padding: 0;
	background-color: var(--btn-close-popup-bg-color);
	border-radius: 50%;
}
.t-quiz.popup.fullscreen .t-popup__close-icon {
	opacity: 0.5;
}
/* Фулскрин попап - иконка крестика меньше из-за фона */
.t-quiz.popup.fullscreen .t-popup__block-close-button svg {
	width: 14px;
	height: 14px;
}

/* #region Отображение кнопки закрытия попапа */
/* DEPRECATED. Оставлено для обратной соместимости */
.t-quiz.popup .t-popup__btn-close-popup,
.t-quiz.popup .t-quiz__main__description-container__btn-close-popup,
.t-quiz.popup .t-quiz__panel__main__btn-close-popup,
.t-quiz.popup .t-quiz__content-wrapper__btn-close-popup {
	display: none;
}

/* 
	Для всех попапов отображается одна и та же кнопка с position: fixed
	У кнопки появляется фон в тех слайчаях, когда она может перекрывать контент
*/
.t-quiz.popup .t-popup__btn-close-popup {
	display: block;
}

/* #endregion */

.t-quiz__content-padding-container,
.t-quiz__progress-bar-container,
.t-quiz__content-wrapper,
.t-quiz__panel,
.t-quiz__quiz-wrapper {
	border-radius: var(--inner-border-radius);
}

.t-quiz.withpadding .t-quiz__content-padding-container,
.t-quiz.withpadding .t-quiz__progress-bar-container,
.t-quiz.withpadding .t-quiz__content-wrapper {
	border-radius: var(--content-padding-radius);
}

.t-quiz:not(.withpadding) .rightside-panel .t-quiz__content-padding-container,
.t-quiz:not(.withpadding) .rightside-panel .t-quiz__progress-bar-container,
.t-quiz:not(.withpadding) .rightside-panel .t-quiz__content-wrapper {
	border-radius: 0;
	border-top-left-radius: var(--inner-border-radius);
	border-bottom-left-radius: var(--inner-border-radius);
}

.t-quiz:not(.withpadding) .leftside-panel .t-quiz__content-padding-container,
.t-quiz:not(.withpadding) .leftside-panel .t-quiz__progress-bar-container,
.t-quiz:not(.withpadding) .leftside-panel .t-quiz__content-wrapper {
	border-radius: 0;
	border-top-right-radius: var(--inner-border-radius);
	border-bottom-right-radius: var(--inner-border-radius);
}

.t-quiz:not(.withpadding) .topside-panel .t-quiz__content-padding-container,
.t-quiz:not(.withpadding) .topside-panel .t-quiz__progress-bar-container,
.t-quiz:not(.withpadding) .topside-panel .t-quiz__content-wrapper {
	border-radius: 0;
	border-bottom-left-radius: var(--inner-border-radius);
	border-bottom-right-radius: var(--inner-border-radius);
}

.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
	.t-quiz__content-padding-container,
.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
	.t-quiz__progress-bar-container,
.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
	.t-quiz__content-wrapper {
	border-radius: var(--inner-border-radius);
}

.t-quiz__cover__fullscreen-container .t-quiz__cover__img,
.t-quiz__cover__fullscreen-container .t-quiz__cover__container {
	border-radius: var(--inner-border-radius);
}

.t-quiz__cover__side-container.leftside .t-quiz__cover__container {
	border-top-left-radius: var(--inner-border-radius);
	border-bottom-left-radius: var(--inner-border-radius);
}

.t-quiz__cover__side-container.rightside .t-quiz__cover__container {
	border-top-right-radius: var(--inner-border-radius);
	border-bottom-right-radius: var(--inner-border-radius);
}

/* #region CONTENT PADDING */
.t-quiz__quiz-wrapper.panel-hidden .t-quiz__content-padding-container,
.t-quiz__quiz-wrapper.without-panel .t-quiz__content-padding-container {
	padding: var(--content-padding);
}

.t-quiz__quiz-wrapper.leftside-panel .t-quiz__content-padding-container {
	padding-top: var(--content-padding);
	padding-right: var(--content-padding);
	padding-bottom: var(--content-padding);
}
.t-quiz__quiz-wrapper.rightside-panel .t-quiz__content-padding-container {
	padding-top: var(--content-padding);
	padding-left: var(--content-padding);
	padding-bottom: var(--content-padding);
}
.t-quiz__quiz-wrapper.topside-panel .t-quiz__content-padding-container {
	padding-left: var(--content-padding);
	padding-right: var(--content-padding);
	padding-bottom: var(--content-padding);
}
/* #endregion CONTENT PADDING */

@media screen and (min-width: 960px) {
	.t-quiz .t-input-group_two-cols .t-radio__item:first-child,
	.t-quiz .t-input-group_two-cols .t-checkboxes__wrapper .t-checkbox__control:first-child {
		margin-top: 0;
	}

	.t-quiz .t-input-group_two-cols .t-input-title {
		height: unset;
	}

	.t-quiz__quiz-wrapper_fixed-height.t-quiz__inputs-in-cols .t-quiz__contact-form__header {
		height: fit-content;
		position: sticky;
		top: var(--step-padding-top);
	}

	.t-quiz .t-btn {
		max-width: 350px;
	}

	.t-quiz__footer__text-container {
		max-width: 45%;
	}

	.t-quiz .t-width_8 .t-quiz__sidebar,
	.t-quiz .t-width_9 .t-quiz__sidebar,
	.t-quiz .t-col_8 .t-quiz__sidebar,
	.t-quiz .t-col_9 .t-quiz__sidebar {
		width: clamp(var(--sidebar-width), 35%, calc(var(--sidebar-width) + 30px));
	}

	.t-quiz .t-width_10 .t-quiz__sidebar,
	.t-quiz .t-width_11 .t-quiz__sidebar,
	.t-quiz .t-col_10 .t-quiz__sidebar,
	.t-quiz .t-col_11 .t-quiz__sidebar {
		width: clamp(var(--sidebar-width), 35%, calc(var(--sidebar-width) + 30px * 2));
	}

	.t-quiz .t-width_12 .t-quiz__sidebar,
	.t-quiz .t-width_100 .t-quiz__sidebar,
	.t-quiz .t-col_12 .t-quiz__sidebar,
	.t-quiz .t-col_100 .t-quiz__sidebar {
		width: clamp(var(--sidebar-width), 35%, calc(var(--sidebar-width) + 30px * 3));
	}

	.t-quiz.fullscreen .t-quiz__sidebar .t-quiz__width-container {
		display: flex;
		flex-direction: column;
		flex: 1;
		justify-content: space-between;
		padding: 0;
		gap: 40px;
	}

	/* >= 8 cols */
	@container footer (min-width: 760px) {
		.t-quiz__footer__text-container {
			max-width: 55%;
		}
	}

	/* >= 10 cols */
	@container footer (min-width: 960px) {
		.t-quiz__footer__text-container {
			max-width: 65%;
		}
	}

	@container main (max-width: 400px) {
		.t-quiz__footer {
			flex-direction: column;
			align-items: flex-end;
			gap: 20px;
		}

		.t-quiz__btn-wrapper {
			justify-content: flex-start;
		}

		.t-quiz__footer__text-container {
			max-width: 100%;
		}

		.t-quiz__counter-container {
			justify-content: flex-end;
		}
	}
}

/* TABLET */
@media screen and (min-width: 641px) and (max-width: 960px) {
	/* important нужны, чтобы перекрыть селектор с recid  */
	/* в планшетной версии убираются отступы в 10px вокруг шага */
	.t-quiz {
		--content-padding-radius: 0 !important;
		--content-padding: 0px !important;
	}

	/* #region Height */
	/* В планшетной версии у блока не работает фиксированная высота, он всегда растягивается по высоте контента*/
	.t-quiz.fixed-height .t-quiz__quiz-wrapper {
		min-height: var(--min-height-tablet);
		height: 100% !important;
	}

	/* Отключаем overflow-y чтобы не было видно scrollbar во время анимации смены шага */
	.t-quiz.fixed-height .t-quiz__main {
		height: 100%;
		overflow-y: hidden !important;
	}

	/* Сбрасываем высоту, чтобы работал overflow: scroll */
	.t-quiz.popup.fullscreen .t-popup__container {
		height: unset;
		width: 100% !important;
	}

	/* Растягиваем контент на всю доступную высоту */
	.t-quiz__content-padding-container {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.t-quiz__content-wrapper {
		flex: 1;
	}

	.t-quiz__content-padding-container,
	.t-quiz__content-wrapper {
		height: 100% !important;
	}

	.t-quiz:has(.t-quiz__cover.t-step-form__step_active) .t-quiz__quiz-form-wrapper {
		height: 100%;
	}

	.t-quiz__cover__fullscreen-container .t-quiz__cover__img,
	.t-quiz__cover__fullscreen-container .t-quiz__cover__container,
	.t-quiz__cover__fullscreen-container,
	.t-quiz__cover__side-container,
	.t-quiz__cover {
		min-height: var(--min-height-tablet);
	}

	/* important нужен чтобы перекрыть установленную высоту на элементе */
	.t-quiz__result,
	.t-quiz__cover,
	.t-quiz__cover__fullscreen-container,
	.t-quiz__cover__side-container,
	.t-quiz__cover__container,
	.t-quiz__cover__img {
		height: 100% !important;
	}
	/* #endregion */

	/* #region Layout */

	.t-quiz.fullscreen .t-quiz__panel {
		padding-left: 0;
		padding-right: 0;
	}

	/* Боковая панель первращается в header */
	.t-quiz.rightside-panel,
	.t-quiz.leftside-panel {
		--panel-type: header;
	}
	.t-quiz.leftside-panel .t-quiz__quiz-wrapper,
	.t-quiz.rightside-panel .t-quiz__quiz-wrapper {
		flex-direction: column;
	}

	/* Если на панели нет ни названия, ни логотипа, то на мобильной и планшетной версии она скрывается */
	.t-quiz__quiz-wrapper .t-quiz__panel.t-quiz__panel_mobile-empty {
		display: none;
	}

	/* Инпуты выравниваются в одну колонку */
	/* .cols-1to2 - старая запись для обратной совместимости */
	.t-quiz__contact-form__layout.t-input-group_two-cols,
	.t-quiz__contact-form__layout.cols_1to2,
	.t-quiz__contact-form__layout.t-input-group_two-cols_1to2,
	.t-quiz .t-input-group.t-input-group_two-cols,
	.t-quiz .t-input-group.cols_1to2,
	.t-quiz .t-input-group.t-input-group_two-cols_1to2 {
		grid-template-columns: 1fr;
	}

	.t-quiz__sidebar {
		--sidebar-padding-top: 30px;
		--sidebar-padding-bottom: 30px;
		width: 100%;
		padding: var(--sidebar-padding-top) var(--padding-horizontal) var(--sidebar-padding-bottom);
		box-sizing: border-box;
	}

	.t-quiz__sidebar .t-quiz__quiz-description {
		flex-direction: row;
	}

	.t-input-group__header,
	.t-quiz__contact-form__header {
		& .t-quiz__consultant {
			order: -1;
		}
	}

	.t-quiz__quiz-wrapper.topside-panel
		.t-quiz__contact-form__layout.t-input-group_one-col
		.t-quiz__contact-form__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.without-panel
		.t-quiz__contact-form__layout.t-input-group_one-col
		.t-quiz__contact-form__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.topside-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.without-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant) {
		grid-template-columns: 1fr;
	}

	.t-quiz__quiz-wrapper_fixed-height.t-quiz__inputs-in-cols
		.t-quiz__screen-wrapper:not(.t-quiz__contact-form)
		.t-input-group__header {
		height: fit-content;
		position: relative;
		top: 0;
	}

	.t-quiz .t-quiz__contact-form__header,
	.t-quiz .t-input-group__header {
		display: flex;
		flex-direction: column;
	}

	.t-quiz.fullscreen .t-quiz__sidebar {
		width: 100%;
		max-width: 100%;
	}
	/* #endregion Layout */

	/* #region Consultant */
	.t-quiz__quiz-wrapper.leftside-panel .t-quiz__contact-form__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-quiz__contact-form__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.topside-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.without-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.leftside-panel .t-input-group__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-input-group__header .t-quiz__consultant {
		display: block;
	}

	.t-quiz__quiz-wrapper.leftside-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-quiz__sidebar .t-quiz__consultant {
		display: none;
	}

	/* В планшетной и мобильной версии все консультанты отображаются с изображением справа */
	.t-quiz__sidebar,
	.t-input-group_two-cols,
	.t-input-group_one-col {
		& .t-quiz__consultant__container,
		& .t-quiz__contact-form__header .t-quiz__consultant__container,
		& .t-input-group__header .t-quiz__consultant__container {
			flex-direction: row-reverse;
		}

		& .t-quiz__consultant__msg-bubble::after,
		& .t-quiz__contact-form__header .t-quiz__consultant__msg-bubble::after,
		& .t-input-group__header .t-quiz__consultant__msg-bubble::after {
			top: 15px;
			right: -8px;
			left: unset;
			border-top: 8px solid transparent;
			border-right: 8px;
			border-bottom: 8px solid transparent;
			border-left: 8px solid var(--consultant-msg-bubble-bg);
		}
	}

	.t-quiz__consultant__msg-bubble {
		width: 100%;
		max-width: 100%;
	}
	/* #endregion Consultant */

	/* #region Border Radius */
	.t-quiz:not(.without-panel) .t-quiz__content-padding-container,
	.t-quiz:not(.without-panel) .t-quiz__progress-bar-container,
	.t-quiz:not(.without-panel) .t-quiz__content-wrapper {
		border-radius: 0 !important;
		border-bottom-left-radius: var(--inner-border-radius) !important;
		border-bottom-right-radius: var(--inner-border-radius) !important;
	}

	.t-quiz.without-panel .t-quiz__content-padding-container,
	.t-quiz.without-panel .t-quiz__progress-bar-container,
	.t-quiz.without-panel .t-quiz__content-wrapper {
		border-radius: var(--inner-border-radius) !important;
	}

	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__content-padding-container,
	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__progress-bar-container,
	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__content-wrapper {
		border-radius: var(--inner-border-radius) !important;
	}
	/* #endregion Border Radius */

	/* #region Result */
	.t-quiz__result_flex .t-quiz__result-wrapper {
		display: flex;
		padding-bottom: 0;
		box-sizing: border-box;
	}

	.t-quiz__result_rightside .t-quiz__result-wrapper {
		flex-direction: column-reverse;
	}

	.t-quiz__result_leftside .t-quiz__result-wrapper {
		flex-direction: column;
	}

	.t-quiz__result_flex .t-quiz__result-content-wrapper,
	.t-quiz__result_flex .t-quiz__result-img-wrapper {
		width: 100%;
	}

	.t-quiz__result_flex .t-quiz__result-content-wrapper {
		align-self: center;
	}

	.t-quiz__result_flex .t-quiz__result-img-wrapper {
		aspect-ratio: 16/9;
	}

	.t-quiz__result_topside .t-quiz__result-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-wrapper {
		max-width: 100%;
	}

	/* В мобильной версии весь результат прилепает к кроям экрана, отступ добавляется только к контенту */
	.t-quiz__result-container {
		padding-left: 0;
		padding-right: 0;
	}

	.t-quiz__result_topside .t-quiz__result-img-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-content-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-img-wrapper {
		padding: 0;
		margin: 0;
	}

	/* Отступ от контента до изображения, изображение находится под контентом, поэтому margin-bottom */
	.t-quiz__result_bottomside .t-quiz__result-content-wrapper {
		margin-bottom: 40px;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		box-sizing: border-box;
	}

	/* Отступ сверху/снизу от края блока, изобаржение находится снизу и прилимает только к боковым сторонам */
	.t-quiz__result_bottomside .t-quiz__result-wrapper {
		padding-top: 40px;
		padding-bottom: 0px;
	}

	/* Отступ от контента до изображения, в этих леаутах изображение находится НАД контентом, поэтому margin-top от контента */
	.t-quiz__result_leftside .t-quiz__result-content-wrapper,
	.t-quiz__result_rightside .t-quiz__result-content-wrapper,
	.t-quiz__result_topside .t-quiz__result-content-wrapper {
		margin-top: 30px;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		box-sizing: border-box;
	}

	/* Отступ сверху/снизу от края блока, в этих леаутах изобаржение находится сверху и прилимает к краям */
	.t-quiz__result_leftside .t-quiz__result-wrapper,
	.t-quiz__result_rightside .t-quiz__result-wrapper,
	.t-quiz__result_topside .t-quiz__result-wrapper {
		padding-top: 0;
		padding-bottom: 40px;
	}

	.t-quiz__result .t-quiz__result-content-wrapper.sticky {
		padding-bottom: 0;
	}

	.t-quiz__result-btn-wrapper {
		position: static;
		width: 100%;
		box-sizing: border-box;
		-webkit-mask-image: none;
		mask-image: none;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		padding-top: 0 !important;
		padding-bottom: 40px !important;
	}

	/* 
		Обновленная верстка.
		В обновленной верстке у всех кнопок есть контейнер. 
		Если контейнер есть, то внешние отступы задаются через него.
		Старые стили сохранены для обратной совместимости.
	*/
	.t-quiz__result-button-container .t-quiz__result-btn {
		margin-top: 0 !important;
	}

	.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-button-container,
	.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-btn {
		margin-top: 25px;
	}
	.t-quiz__result_leftside .t-quiz__result-button-container,
	.t-quiz__result_rightside .t-quiz__result-button-container,
	.t-quiz__result_bottomside .t-quiz__result-button-container,
	.t-quiz__result_leftside .t-quiz__result-btn,
	.t-quiz__result_rightside .t-quiz__result-btn,
	.t-quiz__result_bottomside .t-quiz__result-btn {
		margin-top: 25px;
	}

	.t-quiz__result-button-container,
	.t-quiz__result-btn-wrapper .t-quiz__result-btn {
		margin-top: 25px;
		margin-bottom: 0;
	}

	.t-quiz.fullscreen:not(.fixed-height) .t-quiz__quiz-wrapper .t-quiz__result-container,
	.t-quiz__result-wrapper {
		min-height: auto;
	}

	/* Добавляем overflow чтобы правильно работали скругления вокруг результата */
	.t-quiz__quiz-wrapper:has(.t-quiz__result.t-step-form__step_active) {
		overflow: hidden;
	}
	/* #endregion */

	/* #region Cover */
	/* 
		В мобильной версии контент всегда вертикально выравнивается по верхней границе, 
		горизонтальное выравнивание сохраняется из настроек обложки 
	*/
	.t-quiz__cover__side-container .t-quiz__cover__content-container {
		justify-content: flex-start !important;
	}

	.t-quiz__cover__fullscreen-container .t-quiz__cover__content-container {
		padding: 35px;
	}

	.t-quiz__cover__side-container.leftside,
	.t-quiz__cover__side-container.rightside {
		display: grid;
		grid-template-rows: repeat(2, minmax(0, 1fr));
	}

	.t-quiz__cover__side-container.leftside .t-quiz__cover__side-cover,
	.t-quiz__cover__side-container.rightside .t-quiz__cover__side-cover {
		grid-row: 1;
	}

	.t-quiz__cover__side-cover .t-quiz__cover__container {
		border-radius: 0 !important;
		border-top-right-radius: var(--inner-border-radius) !important;
		border-top-left-radius: var(--inner-border-radius) !important;
	}

	.t-quiz__cover__side-container .t-quiz__cover__side-cover {
		position: static;
		height: unset;
	}

	.t-quiz__cover__side-container .t-quiz__cover__content-container {
		padding: 30px var(--padding-horizontal) 45px;
	}
	/* #endregion Cover */

	/* #region Inputs */

	/* #endregion Inputs */
	.t-quiz.popup.fullscreen .t-quiz__sidebar,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__quiz-description {
		flex-direction: row;
	}
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main {
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}

	/* В планшетной версии доп текст отображается в фетере, рядом с счетчиком */
	.t-quiz__quiz-wrapper_withsidebar .t-quiz__sidebar .t-quiz__text-extra {
		display: none;
	}
	.t-quiz__quiz-wrapper_withsidebar .t-quiz__footer .t-quiz__text-extra {
		display: block;
	}

	/* отступ между хедером и полем для ввода */
	.t-quiz .t-input-group.t-input-group_two-cols,
	.t-quiz .t-input-group {
		gap: 20px !important;
	}

	/* Отступ между хедером поля (заголовок + описание) и консультантом */
	.t-input-group__header {
		gap: var(--mobile-distance-to-consultant) !important;
	}

	.t-input-group__header:has(.t-quiz-step__media) {
		gap: var(--mobile-distance-to-media) !important;

		/* Добавляем к консультанту отступ, чтобы он был равен 28px */
		& .t-quiz__consultant {
			margin-bottom: calc(var(--mobile-distance-to-consultant) - var(--mobile-distance-to-media));
		}
	}

	/* отступ между хедером с консультантом и полем для ввода  */
	.t-quiz .t-input-group.t-input-group_two-cols:has(.t-quiz__consultant),
	.t-quiz .t-input-group:has(.t-quiz__consultant) {
		gap: 20px !important;
	}

	/* отступ между полями на одном шаге */
	.t-quiz__inputs-wrapper {
		gap: 30px !important;
	}

	/* отступ между хедером формы контактов и полями */
	.t-quiz__contact-form__layout.t-input-group_two-cols,
	.t-quiz__contact-form__layout {
		gap: 20px !important;
	}

	/* отступ между полями на форме контактов */
	.t-quiz__contact-form .t-quiz__inputs-wrapper {
		gap: 20px !important;
	}

	/* Отступ между хедером и консультантом */
	.t-quiz__contact-form__header {
		gap: var(--mobile-distance-to-consultant) !important;
	}

	/* отступ между хедером и полем для ввода на форме контактов */
	.t-quiz__contact-form .t-input-group {
		gap: 5px !important;
	}

	/* отступ между хедером и полем для ввода "Способ связи" */
	.t-quiz__contact-form .t-input-group.t-input-group_contact_method {
		gap: 10px !important;
	}

	/* отступ между радио кнопками и полем телефон/имя пользователя в поле "Способ связи" */
	.t-quiz__contact-form .t-contact-method__container {
		gap: 10px;
	}

	/* Отступ между заголовком и описанием */
	.t-quiz__contact-form__header__title:has(+ .t-quiz__contact-form__header__descr) {
		padding-bottom: 15px;
	}
}

/* MOBILE */
@media screen and (max-width: 640px) {
	.t-quiz__footer-sticky {
		position: static;
		padding-top: 0;
	}

	.t-quiz {
		--padding-horizontal: 20px;
		--padding-vertical: 30px;
	}

	.t-quiz.rightside-panel,
	.t-quiz.leftside-panel {
		--panel-type: header;
	}

	/* #region ВЫСОТА */
	/* 
		Ниже приведены стили для сброса/изменения высоты квиза в мобильной версии.
		НЕ трогать их без необходимости. После внесения изменения нужно проверить все варианты отображения квиза.
		- обычное состояние
		- попап
		- попап с фиксированной высотой
		- фулскрин
		- фулскрин с фиксированной высотой
		- попап фулскрин
		- попап фулскрин с фиксированной высотой
		
		Также нужно проверить все типы шагов: обложки, результаты и др
	*/

	.t-quiz.fullscreen:not(.popup):not(.fixed-height) {
		min-height: auto;
	}

	.t-quiz .t-quiz__main {
		height: 100%;
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	/* Высота мобильной версии - 550px */
	.t-quiz .t-quiz__quiz-wrapper {
		height: 100% !important;
		min-height: 80vh;
		max-height: 100%;
	}

	/* Используем 100% чтобы учитывалась строка поиска на мобильных устройствах */
	/* .t-quiz.popup .t-quiz__quiz-wrapper {
		min-height: 100%;
		max-height: unset;
	} */

	.t-quiz.popup:has(.t-quiz__cover.t-step-form__step_active) .t-quiz__quiz-form-wrapper {
		height: 100%;
	}

	.t-quiz.popup .t-quiz__quiz-wrapper {
		min-height: var(--height-100-with-border);
		max-height: unset;
	}

	.t-quiz.popup .t-popup__container {
		min-height: 100% !important;
		display: flex;
		left: 0;
		right: 0;
	}

	/* important на высоте нужен, чтобы перекрывать фиксированную высоту, указанную в атрибуте style */
	.t-quiz__result,
	.t-quiz__cover {
		height: 100% !important;
	}

	/* Если высота 100%, то при большом количестве контента он обрезается на месте начала скролла */
	.t-quiz.fullscreen .t-quiz__result-wrapper,
	.t-quiz.fullscreen .t-quiz__result,
	.t-quiz.fullscreen:not(.fixed-height) .t-quiz__cover__side-container,
	.t-quiz__cover__side-container {
		height: auto !important;
	}

	/* important на высоте нужен, чтобы перекрывать фиксированную высоту, указанную в атрибуте style */
	.t-quiz__cover__fullscreen-container,
	.t-quiz__cover__container,
	.t-quiz__cover__img {
		height: 100% !important;
	}

	/* для фулскрин обложки нужно задать какое-то абсолютное значение высоты */
	.t-quiz__cover__fullscreen-container .t-quiz__cover__img,
	.t-quiz__cover__fullscreen-container .t-quiz__cover__container,
	.t-quiz__cover__fullscreen-container {
		min-height: var(--max-height-mobile);
	}

	.t-quiz__cover__side-container .t-quiz__cover__side-cover {
		position: static;
		height: unset;
	}

	/* выставляем aspect-ratio по умолчанию, 
		чтобы не было сильных скачков контента при загрузке 
		и пересчёте высоты изображения */
	.t-quiz__cover__side-cover .t-quiz__cover__img {
		aspect-ratio: 2/3;
	}

	.t-quiz.fullscreen:not(.fixed-height) .t-quiz__result-container,
	.t-quiz__result-wrapper {
		min-height: auto;
	}
	/* #endregion */

	.t-quiz .t-quiz__main,
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fixed-height,
	.t-quiz__content-padding-container,
	.t-quiz__panel.t-quiz__sidebar,
	.t-quiz .t-quiz__content-wrapper {
		overflow: unset !important;
	}

	/* такой селектор указан для повышения специфичности */
	.t-quiz .t-step-form__step.t-quiz__cover {
		padding: 0;
	}

	.t-quiz__result-btn-wrapper {
		position: static;
		width: 100%;
		box-sizing: border-box;
		-webkit-mask-image: none;
		mask-image: none;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		padding-top: 0 !important;
		padding-bottom: 40px !important;
	}

	.t-quiz__result-button-container {
		flex: 1;
		width: 100%;
		flex-direction: column;
	}

	/* 
		Обновленная верстка.
		В обновленной верстке у всех кнопок есть контейнер. 
		Если контейнер есть, то внешние отступы задаются через него.
		Старые стили сохранены для обратной совместимости.
	*/
	.t-quiz__result-button-container .t-quiz__result-btn {
		margin-top: 0 !important;
	}

	.t-quiz__result-btn,
	.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn {
		width: 100%;
	}

	.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-button-container,
	.t-quiz__result_topside .t-quiz__result-wrapper:not(:has(.sticky)) .t-quiz__result-btn {
		margin-top: 30px;
	}

	.t-quiz__result_rightside .t-quiz__result-button-container,
	.t-quiz__result_leftside .t-quiz__result-button-container,
	.t-quiz__result_leftside .t-quiz__result-btn,
	.t-quiz__result_rightside .t-quiz__result-btn {
		margin-top: 30px;
	}

	.t-quiz__result_bottomside .t-quiz__result-button-container,
	.t-quiz__result_bottomside .t-quiz__result-btn {
		margin-top: 25px;
	}

	.t-quiz__result-button-container,
	.t-quiz__result-btn-wrapper .t-quiz__result-btn {
		margin-top: 30px;
		margin-bottom: 0;
	}

	.t-quiz__footer {
		padding-bottom: 45px;
	}

	.t-quiz__main__description-container {
		padding: 30px var(--padding-horizontal) 0;
	}

	.t-quiz__quiz-description {
		width: 100%;
		padding: 0;
	}

	.t-quiz .t-input-title {
		padding-right: 0;
	}

	/* .cols-1to2 - старая запись для обратной совместимости */
	.t-quiz__contact-form__layout.t-input-group_two-cols,
	.t-quiz__contact-form__layout.cols_1to2,
	.t-quiz__contact-form__layout.t-input-group_two-cols_1to2,
	.t-quiz .t-input-group.t-input-group_two-cols,
	.t-quiz .t-input-group.cols_1to2,
	.t-quiz .t-input-group.t-input-group_two-cols_1to2 {
		grid-template-columns: 1fr;
	}

	.t-quiz .t-img-select__container {
		margin: 0;
	}

	.t-quiz__inputs-wrapper {
		margin-bottom: 0;
	}

	.t-quiz__quiz-wrapper.leftside-panel,
	.t-quiz__quiz-wrapper.rightside-panel {
		flex-direction: column;
	}

	.t-quiz .t-form_bbonly .t-input-block {
		margin-bottom: 0;
	}

	.t-quiz__sidebar {
		--sidebar-padding-top: 30px;
		--sidebar-padding-bottom: 30px;
		width: 100%;
		padding: var(--sidebar-padding-top) var(--padding-horizontal) var(--sidebar-padding-bottom);
		box-sizing: border-box;
	}

	.t-quiz__sidebar .t-quiz__quiz-description {
		flex-direction: row;
		align-items: center;
	}

	/* 
		В мобильной версии контент всегда вертикально выравнивается по верхней границе, 
		горизонтальное выравнивание сохраняется из настроек обложки 
	*/
	.t-quiz__cover__side-container .t-quiz__cover__content-container {
		justify-content: flex-start !important;
	}

	.t-quiz__cover__fullscreen-container .t-quiz__cover__content-container {
		padding: 35px;
	}

	.t-quiz__quiz-wrapper_withsidebar .t-quiz__footer .t-quiz__text-extra {
		display: block;
	}

	.t-quiz__quiz-wrapper_withsidebar .t-quiz__sidebar .t-quiz__text-extra {
		display: none;
	}

	.t-quiz__quiz-wrapper.without-panel .t-quiz__main__description-container {
		padding-top: 40px;
	}

	.t-quiz__consultant__msg-bubble {
		width: 100%;
		max-width: 100%;
	}

	.t-quiz__quiz-wrapper.leftside-panel .t-quiz__contact-form__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-quiz__contact-form__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.topside-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.without-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.leftside-panel .t-input-group__header .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-input-group__header .t-quiz__consultant {
		display: block;
	}

	.t-quiz__quiz-wrapper.leftside-panel .t-quiz__sidebar .t-quiz__consultant,
	.t-quiz__quiz-wrapper.rightside-panel .t-quiz__sidebar .t-quiz__consultant {
		display: none;
	}

	.t-quiz__contact-form__header,
	.t-input-group__header {
		display: flex;
		flex-direction: column;
	}

	.t-quiz__quiz-description-text {
		width: 100%;
	}

	/* В мобильной версии консультант располагается первым */
	.t-input-group__header,
	.t-quiz__contact-form__header {
		& .t-quiz__consultant {
			order: -1;
		}
	}

	.t-quiz__quiz-wrapper.topside-panel
		.t-quiz__contact-form__layout.t-input-group_one-col
		.t-quiz__contact-form__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.without-panel
		.t-quiz__contact-form__layout.t-input-group_one-col
		.t-quiz__contact-form__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.topside-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant),
	.t-quiz__quiz-wrapper.without-panel:not(.t-quiz__inputs-in-cols) .t-input-group__header:has(.t-quiz__consultant) {
		grid-template-columns: 1fr;
	}

	.t-quiz__quiz-wrapper_fixed-height.t-quiz__inputs-in-cols
		.t-quiz__screen-wrapper:not(.t-quiz__contact-form)
		.t-input-group__header {
		height: fit-content;
		position: relative;
		top: 0;
	}

	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__sidebar {
		width: 100%;
		max-width: 100%;
	}

	/* В планшетной и мобильной версии все консультанты отображаются с изображением справа */
	.t-quiz__sidebar,
	.t-input-group_two-cols,
	.t-input-group_one-col {
		& .t-quiz__consultant__container,
		& .t-quiz__contact-form__header .t-quiz__consultant__container,
		& .t-input-group__header .t-quiz__consultant__container {
			flex-direction: row-reverse;
		}

		& .t-quiz__consultant__msg-bubble::after,
		& .t-quiz__contact-form__header .t-quiz__consultant__msg-bubble::after,
		& .t-input-group__header .t-quiz__consultant__msg-bubble::after {
			top: 15px;
			right: -8px;
			left: unset;
			border-top: 8px solid transparent;
			border-right: 8px;
			border-bottom: 8px solid transparent;
			border-left: 8px solid var(--consultant-msg-bubble-bg);
		}
	}

	.t-quiz.popup.fullscreen .t-quiz__sidebar,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__quiz-description {
		flex-direction: row;
	}

	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main {
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}

	.t-quiz:not(:has(.without-panel)) .t-quiz__content-padding-container,
	.t-quiz:not(:has(.without-panel)) .t-quiz__progress-bar-container,
	.t-quiz:not(:has(.without-panel)) .t-quiz__content-wrapper {
		border-radius: 0 !important;
		border-bottom-left-radius: var(--inner-border-radius) !important;
		border-bottom-right-radius: var(--inner-border-radius) !important;
	}

	.t-quiz:has(.without-panel) .t-quiz__content-padding-container,
	.t-quiz:has(.without-panel) .t-quiz__progress-bar-container,
	.t-quiz:has(.without-panel) .t-quiz__content-wrapper {
		border-radius: var(--inner-border-radius) !important;
	}

	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__content-padding-container,
	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__progress-bar-container,
	.t-quiz:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active)
		.t-quiz__content-wrapper {
		border-radius: var(--inner-border-radius) !important;
	}

	.t-quiz__cover__side-cover .t-quiz__cover__container {
		border-radius: 0 !important;
		border-top-right-radius: var(--inner-border-radius) !important;
		border-top-left-radius: var(--inner-border-radius) !important;
	}

	.t-quiz .t-step-form__step {
		padding-top: 30px;
		padding-bottom: 45px;
		padding-right: var(--padding-horizontal);
		padding-left: var(--padding-horizontal);
		box-sizing: border-box;
	}

	/* проверка на наличие btn-wrapper_mobile для обратной совместимости со старым шаблоном */
	.t-quiz .t-quiz__content-wrapper:has(.t-quiz__btn-wrapper_mobile) .t-step-form__step:not(.t-quiz__cover) {
		padding-bottom: 25px;
	}

	.t-quiz .t-quiz__result.t-step-form__step {
		padding: 0;
	}
	.t-quiz .t-quiz__content-wrapper:has(.t-quiz__btn-wrapper_mobile) .t-quiz__result.t-step-form__step {
		padding: 0;
	}

	.t-quiz__col.t-col {
		padding-left: 0;
		padding-right: 0;
	}

	.t-quiz__btn-wrapper {
		width: 100%;
	}

	.t-quiz__btn_submit,
	.t-quiz__btn_next {
		flex: 1;
	}

	.t-quiz .t-input-block textarea {
		padding-top: 12px;
	}

	.t-quiz__cover__side-container .t-quiz__cover__content-container {
		padding: 30px var(--padding-horizontal) 55px;
	}

	.t-quiz__result_flex .t-quiz__result-wrapper {
		display: flex;
		justify-content: flex-start;
		padding-bottom: 0;
		box-sizing: border-box;
	}

	.t-quiz__result_rightside .t-quiz__result-wrapper {
		flex-direction: column-reverse;
	}

	.t-quiz__result_leftside .t-quiz__result-wrapper {
		flex-direction: column;
	}

	.t-quiz__result_flex .t-quiz__result-content-wrapper,
	.t-quiz__result_flex .t-quiz__result-img-wrapper {
		width: 100%;
	}

	.t-quiz__result_flex .t-quiz__result-content-wrapper {
		align-self: center;
	}

	.t-quiz__result_flex .t-quiz__result-img-wrapper {
		aspect-ratio: 16/9;
	}

	.t-quiz__result_topside .t-quiz__result-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-wrapper {
		max-width: 100%;
	}

	/* В мобильной версии весь результат прилепает к кроям экрана, отступ добавляется только к контенту */
	.t-quiz__result-container {
		padding-left: 0;
		padding-right: 0;
	}

	.t-quiz__result_topside .t-quiz__result-img-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-content-wrapper,
	.t-quiz__result_bottomside .t-quiz__result-img-wrapper {
		padding: 0;
		margin: 0;
	}

	/* Отступ от контента до изображения, изображение находится под контентом, поэтому margin-bottom */
	.t-quiz__result_bottomside .t-quiz__result-content-wrapper {
		margin-bottom: 40px;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		box-sizing: border-box;
	}

	/* Отступ сверху/снизу от края блока, изобаржение находится снизу и прилимает только к боковым сторонам */
	.t-quiz__result_bottomside .t-quiz__result-wrapper {
		padding-top: 40px;
		padding-bottom: 0px;
	}

	/* Отступ от контента до изображения, в этих леаутах изображение находится НАД контентом, поэтому margin-top от контента */
	.t-quiz__result_leftside .t-quiz__result-content-wrapper,
	.t-quiz__result_rightside .t-quiz__result-content-wrapper,
	.t-quiz__result_topside .t-quiz__result-content-wrapper {
		margin-top: 30px;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		box-sizing: border-box;
	}

	/* Отступ сверху/снизу от края блока, в этих леаутах изобаржение находится сверху и прилимает к краям */
	.t-quiz__result_leftside .t-quiz__result-wrapper,
	.t-quiz__result_rightside .t-quiz__result-wrapper,
	.t-quiz__result_topside .t-quiz__result-wrapper {
		padding-top: 0;
		padding-bottom: 40px;
	}

	.t-quiz__result .t-quiz__result-content-wrapper.sticky {
		padding-bottom: 0;
	}

	/* Дополнительный отступ сверху, чтобы кнопка закрытия попапа не перекрывала заголовок */
	.t-quiz.popup .t-quiz__result_bottomside .t-quiz__result-content-wrapper,
	.t-quiz.popup .t-step-form__step.t-quiz__contact-form {
		padding-top: 50px;
	}

	.t-quiz__footer {
		padding-bottom: 35px;
		flex-direction: column-reverse;
		align-items: flex-start;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		gap: 20px;
	}

	/* проверка на наличие btn-wrapper_mobile для обратной совместимости со старым шаблоном 
		если футер пустой, то уменьшаем отступ, так как он суммируется с отступом btn-wrapper */
	.t-quiz__content-wrapper:has(.t-quiz__btn-wrapper_mobile) .t-quiz__footer:not(:has(.t-quiz__text-extra)) {
		padding-bottom: 5px;
	}

	.t-quiz__main__description-container {
		justify-content: space-between;
		align-items: center;
	}

	.t-quiz__quiz-wrapper.without-panel .t-quiz__main__description-container,
	.t-quiz__quiz-wrapper.topside-panel .t-quiz__panel,
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_withsidebar .t-quiz__panel {
		display: flex;
	}

	/* Если на панели нет ни названия, ни логотипа, то на мобильной версии она скрывается */
	.t-quiz__quiz-wrapper .t-quiz__panel.t-quiz__panel_mobile-empty {
		display: none;
	}

	.t-quiz__counter-container_mobile {
		margin-left: auto;
	}

	/* Счетчик шагов в мобильной версии всегда скрыт */
	.t-quiz__quiz-wrapper.without-panel .t-quiz__counter-container.t-quiz__counter-container_mobile,
	.t-quiz__quiz-wrapper.topside-panel .t-quiz__counter-container.t-quiz__counter-container_mobile,
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_withsidebar .t-quiz__counter-container.t-quiz__counter-container_mobile {
		display: none;
	}

	/* Если нет дополнительного текста, то вместе с счетчиком скрывается и контейнер */
	.t-quiz__quiz-wrapper .t-quiz__footer__text-container:not(:has(.t-quiz__text-extra)) {
		display: none;
	}
	.t-quiz__quiz-wrapper .t-quiz__footer__text-container .t-quiz__counter-container {
		display: none;
	}

	.t-quiz__counter-container.t-quiz__counter-container_mobile span:first-child {
		display: none;
	}

	.t-quiz__panel__main {
		flex-direction: row;
		justify-content: space-between;
		gap: 15px;
		width: 100%;
	}

	.t-quiz.popup .t-quiz__panel__main {
		gap: 0;
	}

	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-step-form__step:not(.t-quiz__cover):not(.t-quiz__result),
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__panel:not(.t-quiz__sidebar),
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__main__description-container,
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-quiz__footer {
		padding-right: 20px;
		padding-left: 20px;
	}

	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_fullscreen .t-width {
		padding: 0;
	}

	.t-quiz__result_flex .t-quiz__result-content-wrapper.justify-start {
		align-self: flex-start;
	}

	/* Отступ, чтобы счетчик не заезжал под кнопку закрытия попапа */
	.t-quiz.popup .t-quiz__counter {
		margin-right: 37px;
	}

	.t-quiz.popup .t-quiz__quiz-wrapper.without-panel .t-quiz__main__description-container {
		padding-top: 20px;
	}

	.t-quiz.popup .t-quiz__panel {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.t-quiz.popup.fullscreen .t-quiz__quiz-wrapper.topside-panel .t-quiz__panel__main,
	.t-quiz.popup.fullscreen .t-quiz__main__description-container,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main {
		justify-content: flex-start;
	}

	.t-quiz.popup .t-quiz__panel__main {
		justify-content: flex-start;
		align-items: center;
	}

	.t-quiz.popup .t-quiz__counter-container_mobile {
		margin-left: auto;
	}

	.t-quiz.popup .t-quiz__quiz-description {
		margin-right: 15px;
	}

	.t-quiz.popup .t-popup {
		padding: 0;
	}

	.t-quiz.popup:not(.fullscreen) .t-popup__container.t-popup__container-static {
		display: flex;
		margin: 0;
		max-width: 100%;
	}

	.t-quiz.popup .t-popup__container.t-popup__container-static {
		margin: 0 !important;
	}

	.t-quiz.popup .t-form__inputsbox {
		flex: 1;
	}

	.t-quiz.popup .t-popup_show .t-popup__container {
		position: relative;
		top: 0;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
	}

	/* #region Моб: Кнопка закрытия попапа */
	.t-quiz.popup .t-popup__close {
		top: 15px;
		right: 15px !important;
	}

	/* В мобильной версии кнопка всегда на подложке, поэтому уменьшаем ее размер */
	.t-quiz.popup .t-popup__block-close-button svg {
		width: 14px;
		height: 14px;
	}
	/* В мобильной версии у всех кнопок закрытия попапа есть фон, тк кнопка находится поверх контента */
	.t-quiz.popup .t-popup__block-close-button {
		background-color: var(--btn-close-popup-bg-color-mob) !important;
	}

	.t-quiz.popup .t-popup__close-icon path {
		fill: var(--btn-close-popup-icon-color-mob) !important;
	}

	/* #region Отображение кнопки закрытия попапа */
	/* DEPRECATED. Оставлено для обратной соместимости */
	.t-quiz.popup .t-popup__btn-close-popup,
	.t-quiz.popup .t-quiz__main__description-container__btn-close-popup,
	.t-quiz.popup .t-quiz__panel__main__btn-close-popup,
	.t-quiz.popup .t-quiz__content-wrapper__btn-close-popup {
		display: none;
	}

	.t-quiz.popup .t-popup__btn-close-popup {
		display: block;
	}
	/* #endregion Отображение кнопки закрытия попапа */
	/* #endregion Моб: Кнопка закрытия попапа */

	.t-quiz.popup:not(.t-quiz.popup.fullscreen) .t-popup__block-close-button {
		padding: 0;
	}

	.t-quiz.popup:not(.t-quiz.popup.fullscreen) .t-popup__block-close-button svg {
		width: 14px;
		height: 14px;
	}

	.t-quiz.popup .t-popup__block-close-button {
		padding: 0;
		background-color: rgba(255, 255, 255, 0.7);
		border-radius: 50%;
	}

	.t-quiz.popup .t-popup__block-close-button path {
		fill: #000000;
	}

	.t-quiz__cover__btns-container {
		width: 100%;
	}

	.t-quiz__cover__btns-container .t-quiz__btn_start {
		flex: 1;
	}

	.t-quiz__cover__side-container.leftside,
	.t-quiz__cover__side-container.rightside {
		display: flex;
		flex-direction: column-reverse;
	}

	.t-quiz__cover__side-container.leftside .t-quiz__cover__side-cover,
	.t-quiz__cover__side-container.rightside .t-quiz__cover__side-cover {
		grid-row: 1;
	}

	.t-quiz .t-quiz__main {
		-webkit-mask-image: linear-gradient(
			to bottom,
			transparent 0,
			black 30px,
			black calc(100% - 30px),
			transparent 100%
		);
		mask-image: linear-gradient(to bottom, transparent 0, black 30px, black calc(100% - 30px), transparent 100%);
	}

	.t-quiz .t-quiz__main:has(.t-quiz__cover.t-step-form__step_active, .t-quiz__result.t-step-form__step_active) {
		-webkit-mask-image: linear-gradient(
			to bottom,
			transparent 0,
			black 30px,
			black calc(100% - 30px),
			transparent 100%
		);
		mask-image: linear-gradient(to bottom, transparent 0, black 0, black calc(100% - 30px), transparent 100%);
	}

	/* 
		маска с градиентом не нужна:
		1) результат с картинкой снизу.
		2) обложка на фулскрин.
	*/
	.t-quiz .t-quiz__main:has(.t-quiz__result.t-step-form__step_active > .t-quiz__result_bottomside),
	.t-quiz .t-quiz__main:has(.t-quiz__cover.t-step-form__step_active > .t-quiz__cover__fullscreen-container) {
		-webkit-mask-image: none;
		mask-image: none;
	}

	/* Растягиваем контент на всю доступную высоту, обертка имеет минимальную высоту в ~100vh */
	.t-quiz__content-padding-container {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.t-quiz__content-wrapper {
		flex: auto;
	}

	/* отступ между хедером и полем для ввода */
	.t-quiz .t-input-group.t-input-group_two-cols,
	.t-quiz .t-input-group {
		gap: 20px !important;
	}

	/* Отступ между хедером поля (заголовок + описание) и консультантом */
	.t-input-group__header {
		gap: var(--mobile-distance-to-consultant) !important;
	}

	.t-input-group__header:has(.t-quiz-step__media) {
		gap: var(--mobile-distance-to-media) !important;

		/* Добавляем к консультанту отступ, чтобы он был равен 28px */
		& .t-quiz__consultant {
			margin-bottom: calc(var(--mobile-distance-to-consultant) - var(--mobile-distance-to-media));
		}
	}

	/* отступ между хедером с консультантом и полем для ввода  */
	.t-quiz .t-input-group.t-input-group_two-cols:has(.t-quiz__consultant),
	.t-quiz .t-input-group:has(.t-quiz__consultant) {
		gap: 20px !important;
	}

	/* отступ между полями на одном шаге */
	.t-quiz__inputs-wrapper {
		gap: 30px !important;
	}

	/* отступ между хедером формы контактов и полями */
	.t-quiz__contact-form__layout.t-input-group_two-cols,
	.t-quiz__contact-form__layout {
		gap: 20px !important;
	}

	/* отступ между полями на форме контактов */
	.t-quiz__contact-form .t-quiz__inputs-wrapper {
		gap: 20px !important;
	}

	/* Отступ между хедером и консультантом */
	.t-quiz__contact-form__header {
		gap: var(--mobile-distance-to-consultant) !important;
	}

	/* отступ между хедером и полем для ввода на форме контактов */
	.t-quiz__contact-form .t-input-group {
		gap: 5px !important;
	}

	/* отступ между хедером и полем для ввода "Способ связи" */
	.t-quiz__contact-form .t-input-group.t-input-group_contact_method {
		gap: 10px !important;
	}

	/* отступ между радио кнопками и полем телефон/имя пользователя в поле "Способ связи" */
	.t-quiz__contact-form .t-contact-method__container {
		gap: 10px;
	}

	/* Отступ между заголовком и описанием */
	.t-quiz__contact-form__header__title:has(+ .t-quiz__contact-form__header__descr) {
		padding-bottom: 15px;
	}

	/* Вопрос с вариантами в виде картинок
     Если изображение в один ряд, то gap не нужен, так как там появляется анимация свайпа	
	*/
	.t-quiz .t-input-group_ri:has(.t-ri__scroll-icon-wrapper),
	.t-quiz .t-input-group_ri.t-input-group_two-cols:has(.t-ri__scroll-icon-wrapper) {
		gap: 0px !important;
	}

	/* #region Typography */
	.t-quiz .t-radio__control,
	.t-quiz .t-checkbox__control,
	.t-quiz .t-img-select__text,
	.t-quiz .t-ownvariant-wrapper_flex .t-input-ownanswer {
		font-size: var(--secondary-text-font-size-mob);
	}

	.t-quiz__cover__descr,
	.t-quiz__result-text,
	.t-quiz__contact-form__header__descr,
	.t-quiz__contact-form .t-input-title,
	.t-quiz__text-extra,
	.t-quiz__counter-container,
	.t-quiz__quiz-description-text,
	.t-quiz__consultant__msg,
	.t-quiz__consultant__name-container {
		font-size: var(--secondary-text-font-size-mob);
	}

	.t-quiz__consultant__name {
		font-size: 1em;
	}

	.t-quiz__consultant__descr {
		font-size: calc(1em - 2px);
	}

	.t-quiz__consultant__msg {
		line-height: 1.35;
	}
	/* #endregion Typography */

	/* #region Sticky Btn Wrapper */
	/* фиксированный btn-wrapper */
	.t-quiz__btn-wrapper.t-quiz__btn-wrapper_mobile {
		position: sticky;
		bottom: 0;
		z-index: 1;
		opacity: 0;
		flex: none;
		display: none;
		width: auto;
		padding-top: 25px;
		padding-bottom: 30px;
		padding-left: var(--padding-horizontal);
		padding-right: var(--padding-horizontal);
		background-color: var(--btn-wrapper-background-color);
		-webkit-mask-image: linear-gradient(to bottom, transparent 0, black 15px, black 100%);
		mask-image: linear-gradient(to bottom, transparent 0, black 15px, black 100%);
	}

	.t-quiz__btn-wrapper_mobile.t-quiz__btn-wrapper_hidden {
		animation: fadeOutQuiz 0.1s forwards;
	}

	.t-quiz__btn-wrapper_mobile.t-quiz__btn-wrapper_visible {
		display: flex;
		opacity: 1;
		transform: translateY(0);
		animation: fadeInQuiz 0.3s forwards;
	}

	/* Анимация появления */
	@keyframes fadeInQuiz {
		from {
			transform: translateY(100%);
		}
		to {
			transform: translateY(0);
		}
	}

	/* Анимация исчезновения */
	@keyframes fadeOutQuiz {
		from {
			opacity: 1;
		}
		to {
			opacity: 0;
		}
	}

	/* проверка на наличие btn-wrapper_mobile для обратной совместимости со старым шаблоном */
	.t-quiz__content-wrapper:has(.t-quiz__btn-wrapper_mobile) .t-quiz__btn-wrapper:not(.t-quiz__btn-wrapper_mobile) {
		display: none;
	}

	/* обратная совместимость для старых устройств, не поддерживающих :has */
	.t-quiz__footer .t-quiz__btn-wrapper:not(.t-quiz__btn-wrapper_mobile) {
		display: none;
	}
	/* #endregion Sticky Btn Wrapper */
}

@media screen and (max-width: 480px) {
	.t-quiz .t-inputtime,
	.t-quiz .t-datepicker__wrapper {
		max-width: 100%;
	}
}

@media screen and (max-width: 360px) {
	.t-quiz__quiz-wrapper.without-panel .t-quiz__counter-container.t-quiz__counter-container_mobile,
	.t-quiz__quiz-wrapper.topside-panel .t-quiz__counter-container.t-quiz__counter-container_mobile,
	.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_withsidebar .t-quiz__counter-container.t-quiz__counter-container_mobile {
		display: none;
	}

	.t-quiz.popup.fullscreen .t-quiz__quiz-wrapper.topside-panel .t-quiz__panel__main,
	.t-quiz.popup.fullscreen .t-quiz__main__description-container,
	.t-quiz.popup.fullscreen .t-quiz__sidebar .t-quiz__panel__main,
	.t-quiz.popup .t-quiz__panel__main {
		justify-content: space-between;
	}
}

@media screen and (max-width: 320px) {
	.t-quiz {
		--min-height-mobile: 450px;
	}
}

/* Img on Step */

.t-input-group.t-input-group_with-media {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.t-input-group.t-input-group_with-media .t-input-group__header {
	grid-column: span 2 / span 2;
}

.t-input-group_one-col.t-input-group_ri .t-quiz-step__media {
	margin-top: 7px;
}

.t-quiz__step__video-wrapper .t-video-lazyload,
.t-quiz__step__img {
	width: 100%;
	height: 100%;
	aspect-ratio: 3/2;
	border-radius: 4px;
}

.t-quiz__step__video-wrapper {
	min-height: fit-content;
	min-width: fit-content;
	background-color: #000000;
	border-radius: 4px;
	overflow: hidden;
}

@media screen and (max-width: 960px) {
	.t-input-group.t-input-group_with-media {
		grid-template-columns: 1fr;
	}

	.t-input-group.t-input-group_with-media .t-input-group__header {
		grid-column: unset;
	}

	.t-input-group.t-input-group_with-media .t-input-block {
		grid-column-start: 1;
		grid-row-start: 3;
	}

	.t-input-group.t-input-group_with-media .t-quiz-step__media {
		grid-column-start: 1;
		grid-row-start: 2;
	}

	.t-input-group_one-col.t-input-group_ri .t-quiz-step__media {
		margin-top: 0;
	}

	.t-quiz__result-btn-wrapper {
		display: flex;
	}

	.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn:only-child,
	.t-quiz__result-btn-wrapper .t-quiz__result-btn.t-btn {
		max-width: unset;
	}

	.t-quiz__result_topside .t-quiz__result-content-wrapper.sticky .t-quiz__result-text {
		padding-bottom: 0;
	}

	.t-quiz__result_topside .t-quiz__result-wrapper:has(.sticky) {
		padding-bottom: 0;
	}
}

@media screen and (max-width: 640px) {
	.t-input-group.t-input-group_with-media[data-field-type='ri'] .t-input-block {
		grid-column-start: 1;
		grid-row-start: 4;
	}

	.t-input-group.t-input-group_with-media[data-field-type='ri'] .t-ri__scroll-icon-wrapper {
		grid-column-start: 1;
		grid-row-start: 3;
	}

	/* На шаге с вариантами ответа с картинками увеличиваем margin-top для изображения, 
		компенсируем gap: 0 */
	.t-quiz .t-input-group_ri:has(.t-ri__scroll-icon-wrapper) .t-quiz-step__media,
	.t-quiz .t-input-group_ri.t-input-group_two-cols:has(.t-ri__scroll-icon-wrapper) .t-quiz-step__media {
		margin-top: 23px;
	}
}

/* #region Сообщение об успехе */

.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active) .t-quiz__main,
.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active) .t-quiz__quiz-form-wrapper {
	height: 100%;
}

.t-quiz__result_ordinary {
	width: 100%;
	height: 100%;
	padding-top: var(--padding-vertical);
	padding-left: var(--padding-horizontal);
	padding-right: var(--padding-horizontal);
	padding-bottom: 55px;
	box-sizing: border-box;
	margin-top: auto;
	margin-bottom: auto;
}

.t-quiz__successbox-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

@media screen and (max-width: 960px) {
	.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active)
		.t-quiz__quiz-wrapper:not(.t-quiz__quiz-wrapper_dynamic-height)
		.t-quiz__quiz-form-wrapper {
		display: flex;
		flex-direction: column;
	}
}

@media screen and (max-width: 640px) {
	.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active)
		.t-quiz__quiz-wrapper.t-quiz__quiz-wrapper_dynamic-height
		.t-quiz__quiz-form-wrapper {
		display: flex;
	}

	.t-quiz:has(.t-quiz__result_ordinary.t-step-form__step_active) .t-quiz__quiz-form-wrapper {
		flex: 1;
	}
}
/* #endregion */