/* Страница «Контакты». Разметку даёт mu-plugins/kenda-kontakty.php
   Палитра и блоки общие: dileram.css и o-brende.css грузятся первыми,
   здесь только то, чего там нет. */

/* ------------------------------------------------------- способы связи */

.kd-stranica .kk-svyaz {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
	margin-top: 22px;
}

.kd-stranica .kk-karta {
	padding: 20px 22px;
	border: 1px solid var(--kd-liniya2);
	border-radius: 10px;
	background: var(--kd-fon2);
}

.kd-stranica .kk-karta__imya {
	margin: 0 0 8px;
	font-size: 13px;
	/* ⛔ То же наследство темы, что и на карточке товара: кегль наш, а
	   межстрочье осталось от `body { line-height: 26px }`. При кегле 13 это
	   двойной интервал, и каждая подпись занимала 26 пикселей вместо 17.
	   Найдено сплошным замером заголовков 30.08.2026. */
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--kd-tihiy);
}

.kd-stranica .kk-karta__znachenie {
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
	font-weight: 600;
	color: var(--kd-tekst);
	/* ⛔ Длинная почта не должна распирать карточку на узком экране. */
	overflow-wrap: anywhere;
}

.kd-stranica .kk-karta__znachenie a {
	color: var(--kd-tekst);
	text-decoration: none;
	border-bottom: 1px solid rgba(200, 16, 46, .35);
	transition: color 140ms ease-out, border-color 140ms ease-out;
}

.kd-stranica .kk-karta__znachenie a:visited { color: var(--kd-tekst); }

.kd-stranica .kk-karta__znachenie a:hover {
	color: var(--kd-krasnyy);
	border-bottom-color: var(--kd-krasnyy);
}

/* ------------------------------------------------------------------ карта */

/* ⛔⛔ Прежняя карта тянула плитки с зарубежного `tile.openstreetmap.org`.
   Замена на виджет Яндекса: сервис российский и ключа не требует. */
.kd-stranica .kk-karta-ramka {
	position: relative;
	margin-top: 22px;
	/* ⭐ Пропорция вместо жёсткой высоты: на телефоне карта не вытягивается
	   в узкую щель, на широком экране не съедает пол-экрана.
	   ⛔⭐⭐ `width: 100%` здесь ОБЯЗАТЕЛЕН. Без него при `aspect-ratio`
	   вместе с `max-height` браузер режет не высоту, а ШИРИНУ: карта на 1920
	   встала 976 пикселей вместо 1616 и справа осталась дыра (кадр 28.08.2026). */
	width: 100%;
	aspect-ratio: 21 / 8;
	min-height: 300px;
	max-height: 460px;
	border: 1px solid var(--kd-liniya2);
	border-radius: 10px;
	overflow: hidden;
	background: var(--kd-fon2);
}

.kd-stranica .kk-karta-holst {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.kd-stranica .kk-karta-podpis {
	margin: 12px 0 0;
	font-size: 15px;
}

/* ------------------------------------------------------------ кадры стенда */

.kd-stranica .kk-kadry {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 22px;
}

/* ⛔ Если файл одного снимка пропадёт, оставшийся занимал бы половину сетки
   и справа зияла бы дыра (нашёл Кодекс 28.08.2026). */
.kd-stranica .kk-kadr:only-child {
	grid-column: 1 / -1;
	aspect-ratio: 21 / 9;
}

.kd-stranica .kk-kadr {
	position: relative;
	margin: 0;
	aspect-ratio: 4 / 3;
	border-radius: 10px;
	overflow: hidden;
	background: var(--kd-holst);
}

/* ⛔ Три класса против `.main-content img` темы, иначе снимок не заполняет рамку. */
.kd-stranica .kk-kadry .kk-kadr img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 240ms ease-out;
}

.kd-stranica .kk-kadr:hover img { transform: scale(1.03); }

/* ------------------------------------------------------------------ конец */

.kd-stranica .kk-konec { margin-bottom: 8px; }

/* --------------------------------------------------------------- планшет */

@media (max-width: 1100px) {
	.kd-stranica .kk-svyaz { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kd-stranica .kk-karta-ramka { aspect-ratio: 16 / 9; }
}

@media (max-width: 860px) {
	.kd-stranica .kk-kadry { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --------------------------------------------------------------- телефон */

@media (max-width: 600px) {
	.kd-stranica .kk-svyaz { grid-template-columns: 1fr; }
	.kd-stranica .kk-kadry { grid-template-columns: 1fr; }
	.kd-stranica .kk-karta-ramka { aspect-ratio: 4 / 3; max-height: 380px; }
}

@media (prefers-reduced-motion: reduce) {
	.kd-stranica .kk-kadr img,
	.kd-stranica .kk-kadr:hover img { transition: none; transform: none; }
}