/*
 * Страница «Контакты» — в прежнем виде: меню разделов слева, серая панель с текстом справа,
 * вопросы и ответы раскрывающимся списком. Разметку разделов дают блоки плагина umsl-core
 * (.tab-pane, .info-tab, .faq1_*), вкладки переключает assets/js/contacts.js.
 */

.umsl-info__layout {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	align-items: start;
	gap: 0;
}

.umsl-info__layout > * {
	margin: 0;
}

/* ── Меню разделов ───────────────────────────────────────────────────────── */

.umsl-info__menu {
	position: sticky;
	top: calc(var(--umsl-top) + var(--umsl-header-h) + var(--umsl-pad) * 2 + var(--wp--preset--spacing--50));
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--20);
}

.umsl-info__link {
	color: var(--wp--preset--color--text-secondary);
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.2;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 3px;
	transition: color 0.2s ease-out, text-decoration-color 0.2s ease-out;
}

.umsl-info__link:hover,
.umsl-info__link[aria-current="true"] {
	color: var(--wp--preset--color--text-primary);
	text-decoration-color: currentColor;
}

.umsl-info__link[hidden] {
	display: none;
}

/* ── Разделы ─────────────────────────────────────────────────────────────── */

.umsl-info__content > * {
	margin-block: 0;
}

/* Переход по адресу раздела (#faq): панель встаёт под шапкой, а не уходит под неё. */
.umsl-info .tab-pane {
	scroll-margin-top: calc(var(--umsl-top) + var(--umsl-header-h) + var(--umsl-pad) * 2 + var(--wp--preset--spacing--50));
}

/* Без скрипта разделы идут друг под другом; со скриптом виден только выбранный. */
.umsl-info__content > .tab-pane + .tab-pane {
	margin-top: var(--wp--preset--spacing--50);
}

.umsl-info.is-tabbed .tab-pane {
	margin-top: 0;
}

.umsl-info.is-tabbed .tab-pane:not(.is-active) {
	display: none;
}

/* Серая панель с текстом. */
.umsl-info .info-tab,
.umsl-info .accordion-faq {
	padding: var(--wp--preset--spacing--60);
	border-radius: var(--wp--preset--border-radius--md);
	background: var(--wp--preset--color--bg-panel);
	color: var(--wp--preset--color--text-primary);
}

.umsl-info .accordion-faq {
	padding-block: var(--wp--preset--spacing--40);
}

/*
 * Текст раздела — как на текстовых страницах макета: крупное название, подзаголовки фирменным шрифтом,
 * серый текст обычным начертанием, строка не длиннее ~75 знаков, воздух между разделами.
 */
.umsl-info .info-rich-wrap {
	color: var(--wp--preset--color--text-secondary);
	font-size: var(--wp--preset--font-size--md);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: 1.5;
}

.umsl-info .info-rich-wrap > * {
	max-width: 760px;
}

/* Название раздела. */
.umsl-info .info-rich-wrap > :is(h1, h2):first-child {
	margin: 0 0 var(--wp--preset--spacing--60);
	color: var(--wp--preset--color--text-primary);
	font-size: var(--wp--preset--font-size--3-xl);
	line-height: 1.05;
}

/* Подзаголовки. Набранные прописными блок раздела сам переводит в обычный регистр. */
.umsl-info .info-rich-wrap :is(h2, h3) {
	margin: var(--wp--preset--spacing--70) 0 var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--text-primary);
	font-family: var(--wp--preset--font-family--brand);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: var(--wp--custom--font-weight--semibold);
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
}

.umsl-info .info-rich-wrap > :is(h1, h2):first-child + :is(h2, h3) {
	margin-top: 0;
}

.umsl-info .info-rich-wrap p {
	margin: 0 0 var(--wp--preset--spacing--30);
}

.umsl-info .info-rich-wrap > :last-child {
	margin-bottom: 0;
}

.umsl-info .info-rich-wrap strong {
	color: var(--wp--preset--color--text-primary);
	font-weight: var(--wp--custom--font-weight--medium);
}

/* Списки: тире вместо точки, пункты с отступом друг от друга. */
.umsl-info .info-rich-wrap ul {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	margin: 0 0 var(--wp--preset--spacing--40);
	padding: 0;
	list-style: none;
}

.umsl-info .info-rich-wrap ul > li {
	position: relative;
	padding-left: 1.6em;
}

.umsl-info .info-rich-wrap ul > li::before {
	content: "—";
	position: absolute;
	left: 0;
}

.umsl-info .info-rich-wrap ol {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	margin: 0 0 var(--wp--preset--spacing--40);
	padding-left: 1.6em;
}

/* Абзац перед списком («не принимаются:») держится ближе к списку. */
.umsl-info .info-rich-wrap p:has(+ :is(ul, ol)) {
	margin-bottom: var(--wp--preset--spacing--20);
}

.umsl-info .info-rich-wrap a {
	color: var(--wp--preset--color--text-primary);
}

/* Сведения «название — значение» (продавец, реквизиты): строки с линией, название серым слева. */
.umsl-info .umsl-facts.wp-block-table {
	margin: 0;
	overflow: visible;
}

.umsl-info .umsl-facts table {
	width: 100%;
	border-collapse: collapse;
}

.umsl-info .umsl-facts :is(th, td) {
	padding: var(--wp--preset--spacing--40) 0;
	border: 0;
	border-bottom: var(--wp--custom--border-width--thin) solid var(--wp--preset--color--border-strong);
	text-align: left;
	vertical-align: top;
}

.umsl-info .umsl-facts th {
	box-sizing: border-box;
	width: 35%;
	padding-inline-end: var(--wp--preset--spacing--50);
	color: var(--wp--preset--color--text-secondary);
	font-weight: var(--wp--custom--font-weight--regular);
}

.umsl-info .umsl-facts td {
	color: var(--wp--preset--color--text-primary);
	overflow-wrap: anywhere;
}

@media (max-width: 600px) {
	.umsl-info .umsl-facts :is(table, tbody, tr, th, td) {
		display: block;
		width: auto;
	}

	.umsl-info .umsl-facts th {
		padding-bottom: 0;
		border-bottom: 0;
		font-size: var(--wp--preset--font-size--sm);
	}

	.umsl-info .umsl-facts td {
		padding-top: var(--wp--preset--spacing--10);
	}

	.umsl-info .info-tab,
	.umsl-info .accordion-faq {
		padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	}
}

/* ── Вопросы и ответы ────────────────────────────────────────────────────── */

.umsl-info .faq1_accordion {
	border-bottom: 1px solid var(--wp--preset--color--border-strong);
}

.umsl-info .faq1_accordion:last-child {
	border-bottom: 0;
}

.umsl-info .faq1_question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--50);
	width: 100%;
	padding: var(--wp--preset--spacing--40) 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	font-size: var(--wp--preset--font-size--lg);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: 1.25;
	text-align: left;
	cursor: pointer;
}

.umsl-info .faq1_icon-wrapper {
	flex: none;
	width: 32px;
	height: 32px;
	transition: transform 0.2s ease-out;
}

.umsl-info .faq1_accordion.is-open .faq1_icon-wrapper {
	transform: rotate(180deg);
}

.umsl-info .faq1_answer {
	color: var(--wp--preset--color--text-secondary);
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.6;
}

.umsl-info .faq1_answer .faq-pb {
	max-width: 720px;
}

.umsl-info .faq1_answer p {
	margin: 0 0 var(--wp--preset--spacing--30);
}

.umsl-info .faq1_answer .faq-pb {
	padding-bottom: var(--wp--preset--spacing--30);
}

/*
 * Со скриптом закрытый ответ свёрнут и раскрывается плавно; без скрипта все ответы открыты.
 * Высота анимируется через сетку (0fr → 1fr); свёрнутый ответ скрыт и от клавиатуры.
 */
.umsl-info.is-tabbed .faq1_answer {
	display: grid;
	grid-template-rows: 0fr;
	visibility: hidden;
	transition: grid-template-rows 0.35s cubic-bezier(0.23, 1, 0.32, 1), visibility 0s 0.35s;
}

.umsl-info.is-tabbed .faq1_answer > * {
	min-height: 0;
	overflow: hidden;
}

.umsl-info.is-tabbed .faq1_accordion.is-open .faq1_answer {
	grid-template-rows: 1fr;
	visibility: visible;
	transition: grid-template-rows 0.35s cubic-bezier(0.23, 1, 0.32, 1), visibility 0s;
}

/* ── Телефон: меню строкой над панелью ───────────────────────────────────── */

@media (max-width: 900px) {
	.umsl-info__layout {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wp--preset--spacing--40);
	}

	.umsl-info__menu {
		position: static;
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
	}

	.umsl-info .faq1_question {
		font-size: var(--wp--preset--font-size--md);
	}
}
