/**
 * Стыковка вёрстки темы progroup с Elementor.
 *
 * ЗДЕСЬ ТОЛЬКО ТИПОГРАФИКА И ДЕКОР ТЕМЫ.
 *
 * Раскладка и отступы — ширина контента, паддинги колонок, отступы между
 * блоками, поля на мобильном — задаются штатными настройками Elementor прямо
 * в редакторе (секция → «Ширина», колонка → «Внутренние отступы», виджет →
 * «Отступ»). В CSS их не дублируем: иначе правка в редакторе не даёт эффекта,
 * и непонятно, почему.
 *
 * Остаётся то, что раскладкой не является и должно быть одинаковым на всём
 * сайте: размеры шрифтов из дизайна темы, спрайтовые иконки контактов и
 * оформление карты. Вынеси их в поля виджетов — и при смене дизайна пришлось бы
 * обходить каждую страницу руками.
 *
 * Файл намеренно обычный .css и не собирается из style.scss: тема подключает
 * МИНИФИЦИРОВАННЫЕ style.min.css / media.min.css, сборщика в репозитории нет,
 * поэтому правки в .scss на фронт не попадают.
 */

/* ---------------------------------------------------------------------------
   Страница «Контакты»

   Прежде заголовки и тексты рисовал кастомный виджет, и стили висели на его
   разметке (.left-content .title, .right-content .text). Теперь это штатные
   «Заголовок» и «Текстовый редактор», поэтому те же размеры перевешиваем на
   разметку Elementor — вид остаётся прежним.
--------------------------------------------------------------------------- */

/* Заголовки: «г. Алматы», «График работы:», «Реквизиты». */
#p-contact .elementor-heading-title {
	font-weight: 400;
	font-size: 45px;
	line-height: normal;
	color: #050505;
	text-transform: uppercase;
}

/* В «г. Алматы» приставка «г.» набрана строчными — как и было. */
#p-contact .elementor-heading-title span {
	text-transform: none;
}

/* Текст графика работы и реквизитов. */
#p-contact .elementor-widget-text-editor {
	font-size: 18px;
	line-height: 28px;
}

#p-contact .elementor-widget-text-editor p {
	margin: 0;
}

/* Контакты: адрес / телефон / почта со спрайтом иконок. Прежде эти правила
   жили внутри .left-content, теперь разметку даёт виджет «Контакты города». */
#p-contact .contact-item {
	padding-left: 40px;
	position: relative;
	font-size: 18px;
	margin-bottom: 20px;
}

#p-contact .contact-item:before {
	position: absolute;
	width: 24px;
	height: 24px;
	content: "";
	left: 0;
	top: 50%;
	margin-top: -12px;
	display: block;
	background-image: url(../imgs/contact-sprite-icons-green.png);
	background-repeat: no-repeat;
}

#p-contact .contact-item.address:before { background-position: 0px 2px; }
#p-contact .contact-item.phone:before   { background-position: 2px -38px; }
#p-contact .contact-item.email:before   { background-position: 2px -75px; }

#p-contact .contact-item a {
	color: inherit;
	text-decoration: none;
}

/* Карта. Отступы сверху/снизу — часть оформления блока, а не раскладки
   страницы: они одинаковы для обоих городов и заданы дизайном. */
#p-contact .map {
	margin: 40px 0px 50px;
	overflow: hidden;
	width: 100%;
	border-radius: 5px;
}

/* ---------------------------------------------------------------------------
   Мобильные размеры шрифтов.

   Порог 767px — на нём Elementor складывает колонки в одну. Величины взяты из
   media.scss (блок #p-contact внутри @media (max-width: 700px)), где висели на
   .left-content/.right-content — этих классов в новой разметке уже нет.
--------------------------------------------------------------------------- */
@media screen and (max-width: 767px) {
	#p-contact .elementor-heading-title {
		font-size: 22px;
	}

	#p-contact .contact-item {
		font-size: 12px;
		margin-bottom: 22px;
	}

	#p-contact .elementor-widget-text-editor {
		font-size: 12px;
		line-height: 24px;
	}

	#p-contact .map {
		margin: 24px 0 32px;
	}
}
