/* Обзор Jetinno JL28 - дополнения к special_article.css, только внутри .jl28-page */

.jl28-page .small.header.article { line-height: 1.3; }
.jl28-page .item__text--content { line-height: 1.55; }
.jl28-page .block__header .text-content { line-height: 1.55; }
.jl28-page .block__header .header { line-height: 1.4; }

/* шапка (его макет 16.10 15:43): текст | логотипы друг под другом | фото и «Купить» под ним */
.jl28-page .jl28-head { gap: 24px; }
.jl28-page .jl28-head .text-layer { flex: 0 1 42%; max-width: 520px; box-sizing: border-box; }
.jl28-page .jl28-brands { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 56px; }
.jl28-page .jl28-brands__jetinno { width: 410px; max-width: 100%; height: auto; }
.jl28-page .jl28-brands__partner { display: block; max-width: 76%; line-height: 0; transition: .25s ease opacity; }
.jl28-page .jl28-brands__partner:hover { opacity: .7; }
.jl28-page .jl28-brands__partner img { width: 310px; max-width: 100%; height: auto; }
.jl28-page .jl28-photo { flex: 0 1 24%; max-width: 300px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.jl28-page .jl28-photo .image__content { max-width: 100%; height: auto; }

/* «Купить»: знак Ассорти и слово буквами логотипа «АССОРТИ» (svg в шаблоне, цвет - цвет текста кнопки); высота слова к ежу - как в логотипе */
.jl28-page a.my__btn-buy.jl28-buy {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: auto;
	max-width: none;
	padding: 8px 22px 8px 12px;
	border-radius: 40px;
	text-decoration: none;
}
.jl28-page .jl28-buy__mark { height: 56px; width: auto; }
.jl28-page .jl28-buy__word { display: block; height: 20px; width: auto; flex: none; }
/* вверху, под фото - без плашки, как на его макете */
.jl28-page a.my__btn-buy.jl28-buy { background: transparent; border-color: transparent; color: #1D1D1B; padding: 0 8px; transition: .25s ease opacity; }
.jl28-page a.my__btn-buy.jl28-buy:hover { background: transparent; border-color: transparent; color: #1D1D1B; opacity: .7; }

/* размытые края у всех картинок: маска по четырём сторонам (его 23.10 18:16 «на 25% меньше размыва» - 9% -> 6.75%) */
.jl28-page .block__header .image__content,
.jl28-page .block-1 .item__slider .one-slide img,
.jl28-page .jl28-node img,
.jl28-page .block-3 .icon-decoration {
	-webkit-mask-image: linear-gradient(to right, transparent, #000 6.75%, #000 93.25%, transparent), linear-gradient(to bottom, transparent, #000 6.75%, #000 93.25%, transparent);
	-webkit-mask-composite: source-in;
	mask-image: linear-gradient(to right, transparent, #000 6.75%, #000 93.25%, transparent), linear-gradient(to bottom, transparent, #000 6.75%, #000 93.25%, transparent);
	mask-composite: intersect;
}

/* слайдер: фото целиком, по центру; стрелки на всех слайдерах */
.jl28-page .block-1 .item__slider { background: transparent; }
.jl28-page .block-1 .item__slider .one-slide { height: 300px !important; padding: 0 34px; box-sizing: border-box; }  /* фото не уходит под стрелки */
.jl28-page .block-1 .item__slider .one-slide img { max-width: 100%; max-height: 300px; width: auto; height: auto; object-fit: contain; }
.jl28-page .block-1 .item__slider .item__slider-navigation { z-index: 2; pointer-events: none; }
.jl28-page .block-1 .item__slider .slider-navigation__prev,
.jl28-page .block-1 .item__slider .slider-navigation__next { pointer-events: auto; cursor: pointer; }
.jl28-page .block-1 .item__text--header { line-height: 1.35; }

/* технологические особенности: без пунктира, у каждой - фото узла */
.jl28-page .block-2 .item .text-content::after { content: none; }
.jl28-page .block-2 .item { gap: 24px; margin-bottom: 70px; }
.jl28-page .block-2 .item .text-content { flex: 0 1 600px; margin-bottom: 0; }
.jl28-page .block-2 .jl28-node { flex: 0 0 240px; }
.jl28-page .block-2 .jl28-node img { display: block; width: 100%; height: auto; }
.jl28-page .block-2 .item .decoration { margin: 0; line-height: 1; }

/* вывод после преимуществ и итог страницы - как .alert-block в блоке 2 */
.jl28-page .alert-block {
	padding: 30px;
	max-width: 760px;
	border: solid #5BA190 6px;
	box-shadow: 15px 37px 40px rgba(0, 0, 0, 0.09), 4px 9px 22px rgba(0, 0, 0, 0.1);
	background-color: #fff;
	margin: 0 auto 120px;
	color: #000;
	text-align: center;
	font: 700 16px 'Montserrat';
	line-height: 1.55;
}
.jl28-page .jl28-final { margin-bottom: 80px; text-align: center; }
.jl28-page .jl28-final .alert-block { margin-bottom: 40px; }

/* второй блок с иконками (обслуживание) */
.jl28-page .jl28-block-6 { margin-bottom: 100px; }

/* характеристики: компактнее, чем прайс */
.jl28-page .block-4 .jl28-specs td { padding: 14px 0; vertical-align: top; font-size: 15px; line-height: 1.45; }
.jl28-page .block-4 .jl28-specs td:nth-of-type(2) { padding-left: 20px; }
.jl28-page .block-4 .jl28-specs tr td:last-of-type { text-align: left; font-weight: 500; color: #717A82; font-size: 13px; padding-left: 20px; }
.jl28-page .block-4 .jl28-specs tr:first-of-type td { font-size: 16px; color: #000; }
.jl28-page .block-4 .jl28-specs tr.jl28-group td { padding: 34px 0 12px; font: 700 17px 'Montserrat'; color: #00695d; text-align: left; width: auto; }
.jl28-page .block-4 .jl28-specs tr.jl28-group { border-bottom: 2px solid #26CAA3; }
.jl28-page .jl28-more { margin-top: 10px; }
.jl28-page .jl28-more > summary {
	display: block;
	width: fit-content;
	margin: 30px auto 0;
	padding: 13px 32px;
	border: 2px solid #00695d;
	border-radius: 3px;
	color: #00695d;
	font: 700 15px 'Montserrat';
	cursor: pointer;
	list-style: none;
	transition: 0.25s ease all;
}
.jl28-page .jl28-more > summary::-webkit-details-marker { display: none; }
.jl28-page .jl28-more > summary:hover { background: #00695d; color: #fff; }
.jl28-page .jl28-more[open] > summary { margin-bottom: 10px; }
.jl28-page .jl28-more[open] > summary::after { content: " \2191"; }

@media (max-width: 767px) {
	.jl28-page .small.header.article { margin: 40px 20px 20px; }
	.jl28-page .small.header.article.right-position { margin-left: auto; }
	.jl28-page .block-1 .item { margin-bottom: 40px; align-items: center; }
	.jl28-page .block-1 .item__slider .one-slide { height: 240px !important; }
	.jl28-page .block-1 .item__slider .one-slide img { max-height: 240px; }
	.jl28-page .alert-block { margin: 0 20px 60px; padding: 20px; }
	.jl28-page .jl28-final .alert-block { margin-bottom: 30px; }
	.jl28-page .jl28-block-6 { margin-bottom: 40px; }
	.jl28-page .block-1 .item__text { margin-top: 16px; }
	/* шапка на телефоне (сайт разворачивает её снизу вверх): фото и «Купить», логотипы, текст */
	.jl28-page .jl28-head { gap: 0; }
	.jl28-page .jl28-head .text-layer { flex: none; max-width: none; }
	.jl28-page .jl28-brands { flex: none; gap: 24px; margin: 10px 0 30px; }
	.jl28-page .jl28-brands__jetinno { width: 78%; max-width: 320px; }
	.jl28-page .jl28-brands__partner { max-width: 70%; }
	.jl28-page .jl28-brands__partner img { width: 260px; }
	.jl28-page .jl28-photo { flex: none; width: 100%; max-width: none; margin-bottom: 20px; }
	.jl28-page .jl28-photo .image__content { margin-bottom: 0; }
	.jl28-page .jl28-buy__mark { height: 44px; }
	.jl28-page .jl28-buy__word { height: 17px; }
	/* особенности на телефоне: текст, под ним фото узла */
	.jl28-page .block-2 .item,
	.jl28-page .block-2 .item.reverse { flex-direction: column; align-items: stretch; gap: 14px; margin: 0 20px 40px 0; width: auto; }  /* во всю ширину, по краям жёлтого заголовка */
	.jl28-page .block-2 .item .text-content { flex: none; }
	.jl28-page .block-2 .jl28-node { flex: none; width: 240px; max-width: 75%; margin: 0 auto; }
	/* характеристики на телефоне - столбиком: параметр, значение, примечание */
	.jl28-page .block-4 .price-wrapper { overflow-x: visible; }
	.jl28-page .block-4 .price.jl28-specs { width: 100%; }
	.jl28-page .block-4 .jl28-specs tr { display: block; padding: 10px 0; }
	.jl28-page .block-4 .jl28-specs tr:first-of-type:not(.jl28-group) { display: none; }
	.jl28-page .block-4 .jl28-specs td,
	.jl28-page .block-4 .jl28-specs td:nth-of-type(2),
	.jl28-page .block-4 .jl28-specs tr td:last-of-type { display: block; width: auto; padding: 2px 0; font-size: 14px; }
	.jl28-page .block-4 .jl28-specs td:empty { display: none; }
	.jl28-page .block-4 .jl28-specs tr.jl28-group td { padding: 24px 0 8px; font-size: 16px; }
}