/* Оформление первого экрана страниц раздела «Тихие стены».
   Затемняющий градиент под текстом + светлая типографика,
   чтобы заголовок читался на светлых фото. Изолировано классом .s-steny-hero. */

.s-steny-hero {
	position: relative;
}

.s-steny-hero:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(90deg,
		rgba(18, 20, 28, 0.78) 0%,
		rgba(18, 20, 28, 0.62) 38%,
		rgba(18, 20, 28, 0.22) 66%,
		rgba(18, 20, 28, 0) 100%);
	z-index: 0;
	pointer-events: none;
}

.s-steny-hero > .container {
	position: relative;
	z-index: 1;
}

.s-steny-hero .h1-block h1,
.s-steny-hero .h1-block .descr p,
.s-steny-hero .descr-h1 .item p,
.s-steny-hero .descr-h1 .item p strong {
	color: #fff !important;
}

.s-steny-hero .h1-block h1 {
	text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35);
}

.s-steny-hero .h1-block h1 .color {
	color: #57c7e6 !important;
}

/* На планшете/мобильном форма уходит вниз — делаем затемнение
   равномернее, чтобы текст читался по всей ширине. */
@media (max-width: 991px) {
	.s-steny-hero:before {
		background: linear-gradient(180deg,
			rgba(18, 20, 28, 0.7) 0%,
			rgba(18, 20, 28, 0.55) 60%,
			rgba(18, 20, 28, 0.5) 100%);
	}
}

/* Readable header for the five wall landing pages without a separate card. */
.header:before {
	display: none;
}

.header .logo img,
.header .left-part .loo-mob img {
	-webkit-filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.95))
		drop-shadow(0 1px 2px rgba(255, 255, 255, 0.8));
	filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.95))
		drop-shadow(0 1px 2px rgba(255, 255, 255, 0.8));
}

.header .phone a {
	color: #fff;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95), 0 0 8px rgba(0, 0, 0, 0.65);
}

@media (min-width: 992px) {
	.header .navigation {
		padding: 18px 30px;
		background: rgba(18, 20, 28, 0.9);
		border-radius: 10px;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	}

	.header .navigation > nav > ul > li > a,
	.header .navigation > nav > ul > li > .f-l {
		color: #fff;
	}

	.header .navigation > nav > ul > li > .f-l:before {
		-webkit-filter: invert(1);
		filter: invert(1);
	}

	.header .navigation .dropdown-second a {
		color: #363740;
	}
}

@media (max-width: 768px) {
	.nohome .s-steny-hero .section-wrap:before {
		display: none;
	}

	.header:before {
		display: none;
	}

	.header .container {
		padding-left: 10px;
		padding-right: 10px;
	}

	.header .row-first {
		min-height: 76px;
		margin: 0;
		padding: 10px 58px 10px 14px;
		background: transparent;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}

	.header .left-part {
		width: 100%;
		margin-top: 0;
		padding: 0;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		gap: 12px;
	}

	.header .left-part .loo-mob {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
	}

	.header .left-part .loo-mob img {
		display: block;
		width: 136px;
		height: auto;
	}

	.header .left-wrap {
		-webkit-box-flex: 1;
		-ms-flex: 1 1 auto;
		flex: 1 1 auto;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
	}

	.header .phone {
		margin-right: 0;
		font-size: 16px;
		font-weight: 600;
	}

	.header .phone a {
		color: #fff;
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.95), 0 0 8px rgba(0, 0, 0, 0.65);
	}

	.header .mobil-mnu,
	.header.fixed .mobil-mnu {
		top: 46px;
		right: 24px;
	}
}

@media (max-width: 390px) {
	.header .row-first {
		padding-left: 10px;
		padding-right: 52px;
	}

	.header .left-part {
		gap: 8px;
	}

	.header .left-part .loo-mob img {
		width: 112px;
	}

	.header .phone {
		font-size: 14px;
	}

	.header .mobil-mnu,
	.header.fixed .mobil-mnu {
		right: 20px;
	}
}