/* Start:/local/template_files/css/home-uslugi.css?17884142543147*/
/*
 * Блок "Наши услуги" на главной. Разметка и основные стили - у блока our-departments
 * (файл ah.scss), здесь только правка под иконки направлений: они векторные и рисуются
 * под маленький размер, поэтому вписываем их в круг, а не растягиваем на всю плитку.
 * Модификатор нужен, чтобы не задеть такой же блок на других страницах.
 */
.our-departments_uslugi {
	--HomeUslugi-Icon: #005379;
	--HomeUslugi-IconBg: #fff;
	--HomeUslugi-IconRing: #cfe2e3;
}

.our-departments_uslugi .our-departments__icon img,
.our-departments_uslugi .our-departments__svg {
	top: 50%;
	left: 50%;
	width: 54%;
	height: 54%;
	transform: translate(-50%, -50%);
	object-fit: contain;
}

/* иконка приходит инлайном, чтобы её можно было покрасить.
   z-index нужен обоим вариантам: внешний круг рисуется псевдоэлементом после содержимого
   и без него закрывает иконку */
.our-departments_uslugi .our-departments__icon img,
.our-departments_uslugi .our-departments__svg {
	z-index: 1;
}

.our-departments_uslugi .our-departments__svg {
	position: absolute;
	color: var(--HomeUslugi-Icon);
}

@media (max-width: 767px) {
	.our-departments_uslugi .our-departments__icon img,
	.our-departments_uslugi .our-departments__svg {
		width: 50%;
		height: 50%;
	}
}

/* Иконки нарисованы светлыми линиями (#B1C7CB) и на бирюзовом круге почти сливались,
   а у "Стационарного лечения" в svg своя белая подложка - она выбивалась квадратом.
   Берём её за основу: круг под иконкой белый, снаружи остаётся светлый ободок. */
.our-departments_uslugi .our-departments__icon::before {
	background-color: var(--HomeUslugi-IconBg);
}

.our-departments_uslugi .our-departments__icon::after {
	background-color: var(--HomeUslugi-IconRing);
	opacity: 1;
}

/* в исходном блоке круг на наведении вырастал до размера ободка и закрывал его */
@media (min-width: 992px) {
	.our-departments_uslugi .our-departments__item:hover .our-departments__icon::before {
		width: 120px;
		height: 120px;
	}
}

/* Интерлиньяж плиток. В общем блоке (ah.scss, .our-departments__heading) стоит
   line-height: 14px при шрифте 20px - названия в одну строку это не задевало,
   а у направлений почти все подписи в две, и строки слипались.
   Правим только у блока услуг, чтобы не задеть такой же блок на других страницах. */
.our-departments_uslugi .our-departments__heading {
	line-height: 1.25;
}

/* End */
/* /local/template_files/css/home-uslugi.css?17884142543147 */