/* ==================== SERVICES: service grid + card ==================== */

/* query.service-grid > ul.service-grid__list > li > .service-card
   (post-featured-image.service-card__image + post-title.service-card__title + button.service-card__more «Подробнее»).
   Карточка, фото, заголовок и кнопка — общие с карточкой товара (catalog.css); здесь только колонки (3 / 3 / 1) и высота фото 180. */

.service-grid .service-grid__list{
	grid-template-columns: repeat(var(--service-columns), minmax(0, 1fr));
}

.service-grid .service-card__image{
	height: var(--service-card-image);
}

/* ==================== SERVICE PAGE: /service/<услуга>/ (mytoy_new.pen → «Сборка мебели (new)») ==================== */

/* .catalog-page__main.service-single > post-featured-image.service-single__image + post-content.service-single__content
   + webmaster/order-form.service-single__order. Колонкой: фото на всю ширину (320 / 240 / 200, радиус 12) → текст → «Заказать».
   Страницы новости и акции (single-news.html, single-sale.html) используют те же классы без формы; дата — news.css / sales.css. */

.catalog-page .service-single{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--service-stack-gap);
}

.catalog-page .service-single > *{
	margin: 0;
}

.service-single .service-single__image{
	width: 100%;
	height: var(--service-image-height);
	border-radius: var(--radius-xl);
	background: var(--catalog-image-bg);
	overflow: hidden;
}

.service-single .service-single__image img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-single .service-single__content{
	display: block;
	width: 100%;
	font-size: var(--catalog-text-size);
	line-height: 1.7;
	color: var(--color-text-2);
}

.service-single .service-single__content > *{
	margin: 0 0 1em;
}

.service-single .service-single__content > :last-child{
	margin-bottom: 0;
}

.service-single .service-single__content :is(h2, h3, h4){
	margin: 1.4em 0 .6em;
	color: var(--color-text);
	line-height: 1.3;
}

.service-single .service-single__content a{
	color: var(--color-accent);
}

/* «Заказать» — пилюля по ширине текста */
.service-single .service-single__order{
	--order-btn-size: var(--btn-size);
}

.service-single .service-single__order .order-form__open-wrap{
	width: auto;
}

/* ==================== Паттерн «Новости» (home-news): плитки с подписью на тёмной полосе (общие правила; мозаика — news.css) ==================== */

.home-news{
	max-width: var(--container-max);
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	padding: 0 var(--page-gutter);
}

.home-news .home-news__title{
	margin: 0 0 var(--home-title-gap);
	font-size: var(--catalog-title-size);
	font-weight: 700;
	line-height: 1.2;
	color: var(--color-black);
}

.home-news .home-news__query{
	margin: 0;
}

.home-news .home-news__list > li{
	margin: 0;
}

/* isolation: the photo goes under the (non-positioned) name bar with z-index:-1 without leaving the tile. */
.home-news .home-news__item{
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	aspect-ratio: var(--home-services-ratio);
	margin: 0;
	overflow: hidden;
	background: var(--catalog-image-bg);
}

.home-news .home-news__image{
	position: absolute;
	inset: 0;
	z-index: -1;
	margin: 0;
}

.home-news .home-news__image img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s ease;
}

.home-news .home-news__item:hover .home-news__image img{
	transform: scale(1.05);
}

.home-news .home-news__name a{
	color: inherit;
	text-decoration: none;
}

.home-news .home-news__name a::after{
	content: "";
	position: absolute;
	inset: 0;
}
