/* ==========================================================================
   Стилар — сборные резервуары. Общие стили.
   Сетка как на Тильде: контейнер 1200 px с полями 20 px, контент 1160 px.
   ========================================================================== */

@font-face {
	font-family: "Montserrat";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/montserrat-cyrillic.woff2") format("woff2");
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
	font-family: "Montserrat";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/montserrat-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--ink: #182744;
	--accent: #41619e;
	--primary: #254585;
	--navy: #002b72;
	--deep: #001943;
	--text: #454e60;
	--muted: #5b6373;
	--light: #f5f8ff;
	--red: linear-gradient(84.24deg, #ff5454 0%, #ce1a1a 100%);
	--blue-band: linear-gradient(263.16deg, #00205f 0%, #375083 100%);
	--shadow: 0 0 50px rgba(0, 43, 114, 0.1);
	--shadow-sm: 0 0 15px rgba(0, 43, 114, 0.1);
	--dock-h: 0px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	padding-bottom: var(--dock-h);
	font-family: "Montserrat", Arial, sans-serif;
	font-size: 16px;
	line-height: 1.55;
	color: var(--ink);
	background: #fff;
	overflow-x: hidden;
}

body.modal-open,
body.menu-open {
	overflow: hidden;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

a {
	color: inherit;
}

button {
	font: inherit;
	color: inherit;
	cursor: pointer;
}

h1,
h2,
h3,
p,
ul,
ol,
figure {
	margin: 0;
}

ul,
ol {
	padding: 0;
	list-style: none;
}

[hidden] {
	display: none !important;
}

:focus-visible {
	outline: 2px solid #41619e;
	outline-offset: 2px;
}

.container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

.accent {
	color: var(--accent);
}

.accent_light {
	color: #5c84d0;
}

.accent_pale {
	color: #97afdf;
}

/* --------------------------------------------------------------------------
   Заголовки и кнопки
   -------------------------------------------------------------------------- */

.h2 {
	max-width: 930px;
	margin: 0 auto;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.57;
	text-align: center;
	text-transform: uppercase;
	color: var(--ink);
}

.h2_plain {
	font-weight: 600;
	text-transform: none;
}

.h2_left {
	margin: 0;
	text-align: left;
}

.h2_light {
	color: #fff;
}

.subtitle {
	max-width: 1111px;
	margin: 20px auto 0;
	font-size: 18px;
	line-height: 1.56;
	text-align: center;
	color: var(--text);
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 60px;
	padding: 0 24px;
	border: 0;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
	transition: filter 0.2s, box-shadow 0.2s, transform 0.2s;
}

.btn:hover {
	filter: brightness(1.08);
	box-shadow: 0 8px 20px rgba(206, 26, 26, 0.25);
}

.btn_red {
	background: var(--red);
}

.btn_blue {
	background: linear-gradient(23.4deg, #00359c 0%, #2a63de 100%);
}

.btn_blue:hover {
	box-shadow: 0 8px 20px rgba(0, 53, 156, 0.3);
}

.btn_dark {
	min-height: 45px;
	padding: 0 34px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0;
	background: linear-gradient(180deg, #254585 0%, #182744 100%);
}

.btn_dark:hover {
	box-shadow: 0 8px 20px rgba(24, 39, 68, 0.3);
}

.btn_outline {
	min-height: 45px;
	padding: 0 34px;
	border: 1px solid #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0;
	background: transparent;
}

.btn_outline:hover {
	background: rgba(255, 255, 255, 0.1);
	box-shadow: none;
}

.btn_stack,
.btn_icon {
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding: 0 31px;
	letter-spacing: 0;
}

.btn_stack {
	align-items: center;
}

.btn__title {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.13;
}

.btn__sub {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.15;
	text-transform: lowercase;
}

.link {
	padding: 0;
	border: 0;
	border-bottom: 1px solid currentColor;
	font: inherit;
	color: var(--accent);
	background: none;
}

.link:hover {
	border-bottom-color: transparent;
}

.link_light {
	color: #fff;
}

/* Круглая кнопка «смотреть видео» */
.play {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	background: none;
}

.play::after,
.play_small::before,
.play_tiny::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	margin: -40px 0 0 -40px;
	border-radius: 50%;
	background: #002b72 url("../img/3431-6337-photo.svg") center / 52px no-repeat;
	transition: transform 0.2s;
}

.play:hover::after {
	transform: scale(1.08);
}

.play_small,
.play_tiny {
	position: relative;
	flex: none;
	width: 56px;
	height: 56px;
}

.play_small::after,
.play_tiny::after {
	content: none;
}

.play_small::before {
	width: 56px;
	height: 56px;
	margin: -28px 0 0 -28px;
	background-size: 56px;
}

.play_tiny {
	width: 37px;
	height: 37px;
}

.play_tiny::before {
	width: 37px;
	height: 37px;
	margin: -18.5px 0 0 -18.5px;
	background-size: 37px;
}

/* Поля форм */
.field {
	display: block;
	width: 100%;
	height: 56px;
	padding: 0 18px;
	border: 1px solid #c9d3e6;
	border-radius: 5px;
	font: inherit;
	font-size: 16px;
	color: var(--ink);
	background: #fff;
}

.field::placeholder {
	color: #454e60;
	opacity: 0.5;
}

.field:focus {
	border-color: var(--accent);
	outline: none;
}

.field.is-invalid {
	border-color: #e10000;
}

.consent {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13px;
	line-height: 1.54;
	color: var(--text);
	cursor: pointer;
}

.consent_small {
	font-size: 12px;
	line-height: 1.58;
}

.consent__input {
	flex: none;
	width: 16px;
	height: 16px;
	margin: 2px 0 0;
	accent-color: var(--accent);
}

.consent a {
	color: var(--accent);
}

.consent.is-invalid .consent__text {
	color: #e10000;
}

.form__honeypot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.field-error {
	position: absolute;
	z-index: 2;
	padding: 2px 8px;
	border-radius: 3px;
	font-size: 12px;
	line-height: 1.4;
	color: #fff;
	background: #e10000;
	pointer-events: none;
}

.field-error_static {
	position: static;
	display: inline-block;
	margin-top: 4px;
}

.form-toast {
	position: fixed;
	top: 20px;
	left: 50%;
	z-index: 1000;
	display: flex;
	align-items: center;
	gap: 16px;
	max-width: calc(100% - 40px);
	padding: 14px 18px;
	border-radius: 5px;
	color: #fff;
	background: #e10000;
	transform: translateX(-50%);
	box-shadow: var(--shadow);
}

.form-toast__text {
	font-size: 14px;
}

.form-toast__close {
	position: relative;
	flex: none;
	width: 20px;
	height: 20px;
	border: 0;
	background: none;
}

.form-toast__close::before,
.form-toast__close::after {
	content: "";
	position: absolute;
	top: 9px;
	left: 2px;
	width: 16px;
	height: 2px;
	background: #fff;
	transform: rotate(45deg);
}

.form-toast__close::after {
	transform: rotate(-45deg);
}

/* Метки «да / нет» */
.mark {
	position: absolute;
	top: -12px;
	left: 50%;
	width: 30px;
	height: 30px;
	margin-left: -15px;
	border-radius: 50%;
	background: var(--red);
}

.mark::before {
	content: "+";
	position: absolute;
	inset: 0;
	font-size: 20px;
	font-weight: 100;
	line-height: 30px;
	text-align: center;
	color: #fff;
	transform: rotate(45deg);
}

.mark_ok {
	background: linear-gradient(136.8deg, #7aff54 0%, #31ce1a 100%);
}

.mark_ok::before {
	content: "✓";
	font-size: 11px;
	transform: none;
}

/* Слайдер на прокрутке */
[data-slider] {
	position: relative;
}

.slider__track {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
}

.slider__track::-webkit-scrollbar {
	display: none;
}

.slider__track > * {
	flex: none;
	scroll-snap-align: start;
}

.slider__btn {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	color: #fff;
	background: #41619e;
	transition: background 0.2s;
}

.slider__btn:hover {
	background: #254585;
}

.slider__btn_prev {
	left: 28px;
}

.slider__btn_prev svg {
	transform: scaleX(-1);
}

.slider__btn_next {
	right: 28px;
}

.slider__btn_small {
	position: static;
	width: 22px;
	height: 22px;
	margin: 0;
}

.slider__btn_small svg {
	width: 6px;
	height: 10px;
}

.slider__btn_side.slider__btn_prev {
	left: -78px;
}

.slider__btn_side.slider__btn_next {
	right: -78px;
}

/* --------------------------------------------------------------------------
   Шапка
   -------------------------------------------------------------------------- */

.header {
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 20;
	width: 100%;
	max-width: 1200px;
	padding: 0 20px;
	transform: translateX(-50%);
}

.header__top {
	display: flex;
	align-items: center;
	height: 69px;
	padding-bottom: 2px;
}

.header__logo {
	flex: none;
	padding-right: 7px;
	margin-right: 9px;
	border-right: 1px solid var(--navy);
}

.header__logo img {
	display: block;
	width: 163px;
	height: 30px;
}

.header__about {
	color: var(--navy);
}

.header__tagline {
	font-size: 10px;
	line-height: 1.4;
}

.header__registry {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-size: 8px;
	line-height: 1.38;
	text-decoration: underline;
}

.header__registry::before {
	content: "";
	width: 11px;
	height: 11px;
	background: url("../img/6236-3932-doc-icon.png") center / contain no-repeat;
}

.header__mail {
	margin-left: auto;
	font-size: 10px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--navy);
}

.header__phone {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-left: 54px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.13;
	text-decoration: none;
	color: var(--deep);
}

.header__phone::before {
	content: "";
	width: 12px;
	height: 12px;
	background: url("../img/6532-3232-call.png") center / contain no-repeat;
}

.header__burger {
	display: none;
}

.nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 50px;
	padding: 0 41px 0 39px;
	border-radius: 5px;
	background: var(--primary);
	box-shadow: var(--shadow);
}

.nav__link {
	font-size: 12px;
	font-weight: 500;
	line-height: 1.17;
	text-decoration: none;
	color: #f6f6f6;
}

.nav__link:hover {
	text-decoration: underline;
}

.scrollnav {
	position: fixed;
	top: 0;
	left: 50%;
	z-index: 30;
	width: 100%;
	max-width: 1200px;
	padding: 0 20px;
	visibility: hidden;
	transform: translate(-50%, -100%);
	transition: transform 0.3s, visibility 0.3s;
}

.scrollnav.is-visible {
	visibility: visible;
	transform: translate(-50%, 0);
}

.nav_sticky {
	border-radius: 0 0 5px 5px;
}

.mobmenu {
	position: fixed;
	inset: 0;
	z-index: 200;
	background: rgba(0, 25, 67, 0.5);
}

.mobmenu__panel {
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: min(360px, 100%);
	height: 100%;
	padding: 60px 30px 30px;
	overflow-y: auto;
	background: #fff;
}

.mobmenu__close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 32px;
	height: 32px;
	border: 0;
	background: none;
}

.mobmenu__close::before,
.mobmenu__close::after {
	content: "";
	position: absolute;
	top: 15px;
	left: 5px;
	width: 22px;
	height: 2px;
	background: var(--ink);
	transform: rotate(45deg);
}

.mobmenu__close::after {
	transform: rotate(-45deg);
}

.mobmenu__nav {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding-bottom: 14px;
	border-bottom: 1px solid #e4e9f3;
}

.mobmenu__link {
	padding: 8px 0;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	color: var(--ink);
}

.mobmenu__phone {
	font-size: 20px;
	font-weight: 700;
	text-decoration: none;
	color: var(--deep);
}

.mobmenu__mail {
	font-size: 14px;
	font-weight: 600;
	color: var(--navy);
}

.mobmenu__cta {
	margin-top: 10px;
}

/* --------------------------------------------------------------------------
   Первый экран
   -------------------------------------------------------------------------- */

.hero {
	position: relative;
	overflow: hidden;
	background: #eef1f6;
}

.hero__bg {
	position: absolute;
	top: -46px;
	left: calc(50% - 888px);
	width: 1786px;
	max-width: none;
	height: 1005px;
	object-fit: cover;
}

.hero__inner {
	position: relative;
	max-width: 1200px;
	height: 918px;
	margin: 0 auto;
	padding: 173px 20px 0;
}

.hero__head {
	position: relative;
	width: 371px;
}

.hero__title {
	font-size: 50px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	color: var(--navy);
}

.hero__badge {
	position: absolute;
	top: 7px;
	left: 296px;
	width: 201px;
	height: 38px;
	border-radius: 5px;
	font-size: 18px;
	font-weight: 600;
	line-height: 38px;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	background: var(--primary);
	box-shadow: var(--shadow-sm);
}

.hero__subtitle {
	max-width: 567px;
	margin-top: 10px;
	font-size: 18px;
	line-height: 1.17;
	text-transform: lowercase;
	color: var(--navy);
}

.hero__note {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 15px;
	height: 113px;
	margin: 8px 0 -16px;
	pointer-events: none;
}

.hero__note img {
	width: 85px;
	height: 113px;
	object-fit: contain;
}

.hero__note p {
	max-width: 318px;
	padding-bottom: 2px;
	font-size: 14px;
	line-height: 1.36;
	color: var(--deep);
}

.hero__cta {
	position: relative;
	width: 429px;
	min-height: 70px;
}

.hero__cta::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 26px;
	width: 24px;
	height: 24px;
	margin-top: -12px;
	background: url("../img/6463-3534-document-text-outlin.svg") center / contain no-repeat;
}

.hero__catalog {
	display: flex;
	width: 285px;
	min-height: 54px;
	margin-top: 12px;
	padding: 0 24px 0 25px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
}

.hero__catalog span {
	padding-right: 10px;
	border-right: 1px solid #fff;
	line-height: 24px;
}

.hero__catalog img {
	width: 15px;
	height: 26px;
}

.hero__video {
	position: absolute;
	top: 414px;
	left: 542px;
	width: 118px;
	height: 118px;
	border-radius: 50%;
}

.hero__video .play__ring {
	width: 118px;
	height: 118px;
}

.hero__benefits {
	position: absolute;
	top: 622px;
	left: 20px;
	right: 20px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	height: 200px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
}

.hero__benefits::before {
	content: "";
	position: absolute;
	top: 106px;
	left: 15px;
	right: 15px;
	z-index: -1;
	height: 110px;
	border-radius: 15px;
	background: var(--primary);
	box-shadow: var(--shadow);
}

.hero__benefit {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 26px;
	text-align: center;
}

.hero__benefit + .hero__benefit::before {
	content: "";
	position: absolute;
	top: 47px;
	left: 0;
	width: 1px;
	height: 107px;
	background: var(--navy);
}

.hero__benefit img {
	height: 74px;
	width: auto;
	object-fit: contain;
}

.hero__benefit-title {
	margin-top: 41px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.33;
	color: var(--deep);
}

.hero__benefit-text {
	margin-top: 10px;
	font-size: 16px;
	line-height: 1.38;
	color: var(--deep);
}

.hero_square .hero__bg {
	left: calc(50% - 960px);
	width: 1920px;
	height: 964px;
}

.hero_square .hero__head {
	width: 757px;
}

.hero_square .hero__badge {
	width: 414px;
}

.hero_square .hero__catalog {
	width: 270px;
}

.hero_short .hero__bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-position: 70% 0;
}

.hero_short .hero__head {
	width: 560px;
}

.hero_short .hero__subtitle {
	max-width: 480px;
}

/* --------------------------------------------------------------------------
   Первый экран страницы объёма
   -------------------------------------------------------------------------- */

.product {
	position: relative;
	overflow: hidden;
	background: #eef1f6;
}

.product__bg {
	position: absolute;
	top: 0;
	left: calc(50% - 960px);
	width: 1920px;
	max-width: none;
	height: 977px;
	object-fit: cover;
}

.product__inner {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 665px;
	grid-template-rows: auto 1fr;
	column-gap: 28px;
	max-width: 1200px;
	min-height: 977px;
	margin: 0 auto;
	padding: 132px 20px 100px;
}

.crumbs {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	font-size: 12px;
	line-height: 1.17;
	color: #0b0b0b;
}

.crumbs__link {
	text-decoration: none;
}

.crumbs__link:hover {
	text-decoration: underline;
}

.product__info {
	padding-top: 47px;
}

.product__title {
	max-width: 471px;
	font-size: 54px;
	font-weight: 700;
	line-height: 1.09;
	text-transform: uppercase;
	color: var(--navy);
}

.product__price {
	margin-top: 19px;
	font-size: 20px;
	line-height: 1.15;
	color: var(--navy);
}

.product__price-value {
	display: inline-block;
	padding: 3px 4px;
	border-radius: 5px;
	background: #87a6e3;
	box-shadow: var(--shadow-sm);
}

.product__specs {
	max-width: 467px;
	margin: 16px 0 0;
	font-size: 18px;
	line-height: 1.78;
	color: var(--deep);
}

.product__spec dt {
	display: inline;
	font-weight: 700;
}

.product__spec dd {
	display: inline;
	margin: 0;
}

.product__checks {
	display: flex;
	flex-direction: column;
	gap: 13px;
	margin-top: 18px;
}

.product__check {
	display: flex;
	align-items: center;
	gap: 11px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.78;
	color: var(--deep);
}

.product__check img {
	flex: none;
	width: 30px;
	height: 30px;
}

.product__cta {
	width: 390px;
	min-height: 70px;
	margin-top: 26px;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 0;
}

.product__media {
	padding-top: 58px;
}

.product__img {
	display: block;
	width: 665px;
	height: 590px;
	border-radius: 10px;
	object-fit: cover;
	background: #fff;
}

.product__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 400px;
	margin-top: 15px;
}

.product__tag {
	display: block;
	padding: 0 8px;
	border-radius: 7px;
	font-size: 16px;
	font-weight: 700;
	line-height: 30px;
	color: #1167ff;
	background: #ebf7ff;
}

.product__tag:hover {
	text-decoration: none;
}

/* --------------------------------------------------------------------------
   Характеристики резервуара
   -------------------------------------------------------------------------- */

.specs {
	padding: 77px 0 42px;
}

.specs__inner {
	display: grid;
	grid-template-columns: 581px 561px;
	justify-content: space-between;
	align-items: start;
}

.specs__title {
	max-width: 350px;
	line-height: 1.27;
	letter-spacing: -1px;
}

.specs__list {
	margin: 12px 0 0;
	font-size: 14px;
	line-height: 1.93;
	color: var(--deep);
}

.specs__row {
	display: flex;
	align-items: baseline;
}

.specs__name {
	display: flex;
	flex: 1;
	align-items: baseline;
	font-weight: 700;
	white-space: nowrap;
}

.specs__name::after {
	content: "";
	flex: 1;
	min-width: 12px;
	margin: 0 2px;
	border-bottom: 1px dotted #6f7a8f;
}

.specs__value {
	margin: 0;
	text-align: right;
}

.specs__img {
	width: 561px;
	height: 353px;
	margin-top: 84px;
	object-fit: contain;
}

/* --------------------------------------------------------------------------
   «Читать дальше»
   -------------------------------------------------------------------------- */

.readmore {
	padding: 0 0 78px;
	font-size: 14px;
	line-height: 1.57;
	color: var(--muted);
}

.readmore_light {
	background: var(--light);
}

.hero + .readmore,
.product + .readmore,
.readmore_specs {
	padding: 20px 0 23px;
}

.others + .readmore,
.readmore:has(+ .calc) {
	padding-bottom: 18px;
}

.readmore__more {
	padding: 0;
	border: 0;
	border-bottom: 1px solid #253f72;
	font-weight: 600;
	color: #253f72;
	background: none;
}

.readmore__more:hover {
	border-bottom-color: transparent;
}

.readmore__title {
	margin-bottom: 21px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.57;
	color: var(--muted);
}

.readmore__full p + p {
	margin-top: 0;
}

/* --------------------------------------------------------------------------
   Видео «Актуальные события»
   -------------------------------------------------------------------------- */

.videos__title {
	max-width: 1100px;
	padding: 77px 0 15px;
	line-height: 1.27;
	letter-spacing: -1px;
}

.videos__band {
	height: 270px;
	background: #213a6b center / cover no-repeat;
}

.videos__list {
	display: grid;
	grid-template-columns: repeat(6, 202.4px);
	justify-content: center;
	padding-top: 52px;
}

.videos__btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
}

.videos__thumb {
	position: relative;
	width: 127px;
	height: 127px;
	border: 12px solid #c24042;
	border-radius: 50%;
	overflow: hidden;
	background: #c24042;
}

.videos__thumb img {
	width: 103px;
	height: 103px;
	object-fit: cover;
	transition: transform 0.3s;
}

.videos__thumb::after {
	content: "";
	position: absolute;
	top: 31px;
	left: 37px;
	width: 35px;
	height: 40px;
	background: url("../img/3132-3639-white.svg") center / contain no-repeat;
}

.videos__btn:hover img {
	transform: scale(1.08);
}

.videos__name {
	margin-top: 7px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.38;
	color: #fff;
}

/* --------------------------------------------------------------------------
   Каталог
   -------------------------------------------------------------------------- */

.catalog {
	padding: 77px 0 80px;
	background: var(--light);
}

.catalog__title {
	line-height: 1.27;
	letter-spacing: -1px;
}

.catalog__tabs {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	margin: 15px 0 20px;
}

.catalog__tab {
	height: 55px;
	padding: 0 10px;
	border: 1px solid var(--primary);
	border-radius: 5px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.1;
	color: #000;
	background: #fff;
	transition: background 0.2s, color 0.2s;
}

.catalog__tab:hover {
	background: #eef2fb;
}

.catalog__tab[aria-selected="true"] {
	color: #fff;
	background: var(--primary);
}

.catalog__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.card {
	display: flex;
	flex-direction: column;
	padding-bottom: 25px;
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
}

.card__img {
	display: block;
	height: 300px;
	overflow: hidden;
}

.card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s;
}

.card:hover .card__img img {
	transform: scale(1.04);
}

.card__title {
	margin: 20px 24px 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.28;
	letter-spacing: -0.5px;
	color: #111;
}

.card__title a {
	text-decoration: none;
}

.card__price {
	margin: 14px 24px 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.39;
	letter-spacing: -0.2px;
	color: #111;
}

.card__btn {
	align-self: flex-start;
	width: 320px;
	max-width: calc(100% - 48px);
	margin: 18px 24px 0;
}

.card_wide {
	position: relative;
	grid-column: span 2;
	align-items: center;
}

.card_wide .card__img {
	align-self: stretch;
	border-radius: 0 0 12px;
}

.card__bullets {
	position: absolute;
	top: 20px;
	right: 20px;
	display: flex;
	flex-direction: column;
	gap: 17px;
	width: 293px;
}

.card__bullets li {
	display: flex;
	align-items: center;
	min-height: 75px;
	padding: 0 22px;
	border: 1px solid #e4e9f3;
	border-radius: 12px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.56;
	color: var(--deep);
	background: #fbfbff;
}

.card__lead {
	max-width: 591px;
	margin: 18px 20px 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: -0.2px;
	text-align: center;
	color: #111;
}

.card_wide .card__btn {
	align-self: center;
	width: 460px;
	margin-top: 22px;
}

.catalog__title + .catalog__grid {
	margin-top: 19px;
}

.catalog_square .catalog__title {
	max-width: 737px;
}

/* --------------------------------------------------------------------------
   Также посмотрите
   -------------------------------------------------------------------------- */

.others {
	padding: 47px 0 80px;
	background: var(--light);
}

.others__title {
	max-width: 649px;
	line-height: 1.27;
	letter-spacing: -1px;
}

.others__track {
	gap: 28px;
	margin-top: 19px;
}

.others__track .card {
	width: calc((100% - 56px) / 3);
}

.others__nav {
	display: flex;
	justify-content: center;
	gap: 22px;
	margin-top: 20px;
}

.others__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--navy);
	cursor: pointer;
	transition: background 0.2s;
}

.others__btn:hover {
	background: var(--primary);
}

.others__btn img {
	width: 44px;
	height: 44px;
}

.others__btn_prev img {
	transform: scaleX(-1);
}

/* --------------------------------------------------------------------------
   Скачать каталог
   -------------------------------------------------------------------------- */

.download {
	overflow: hidden;
	background: var(--blue-band);
}

.download__inner {
	position: relative;
	min-height: 506px;
	padding-top: 80px;
	padding-bottom: 60px;
	color: #fff;
}

.download__title {
	position: relative;
	z-index: 1;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.35;
	text-transform: uppercase;
}

.download__badge {
	display: inline-block;
	margin-left: 2px;
	padding: 0 12px 0 10px;
	border-radius: 5px;
	font-size: 18px;
	font-weight: 500;
	line-height: 30px;
	vertical-align: 5px;
	color: #000;
	background: #fff;
	box-shadow: var(--shadow-sm);
}

.download__badge strong {
	margin-left: 4px;
	font-weight: 700;
}

.download__intro {
	position: relative;
	z-index: 1;
	margin-top: 19px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.33;
}

.download__list {
	position: relative;
	z-index: 1;
	margin-top: 6px;
}

.download__list li {
	position: relative;
	padding-left: 32px;
	font-size: 18px;
	line-height: 2;
}

.download__list li::before {
	content: "";
	position: absolute;
	top: 7px;
	left: 0;
	width: 22px;
	height: 22px;
	background: url("../img/3631-3162-2.svg") center / contain no-repeat;
}

.download__btn {
	position: relative;
	z-index: 1;
	width: 298px;
	margin-top: 28px;
	background: linear-gradient(132.84deg, #ff5454 46%, #ce1a1a 100%);
}

.download__img {
	position: absolute;
	top: -132px;
	left: 467px;
	width: 941px;
	max-width: none;
	height: 919px;
	pointer-events: none;
}

.download_square .download__img {
	top: 18px;
	left: 598px;
	width: 576px;
	height: 607px;
}

/* --------------------------------------------------------------------------
   Примеры проектов
   -------------------------------------------------------------------------- */

.projects {
	position: relative;
	padding: 85px 0 30px;
}

.projects__title {
	max-width: 1134px;
}

.projects::before,
.stages::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 50%;
	width: 10px;
	height: 5px;
	margin-left: -5px;
	background: url("../img/6133-6431-Line_1_1.svg") center / contain no-repeat;
}

.projects__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px 60px;
	margin-top: 21px;
}

.project {
	position: relative;
	min-height: 519px;
	padding: 13px 13px 30px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow-sm);
}

.project__gallery .slider__track {
	gap: 0;
	height: 305px;
}

.project__gallery .slider__track img {
	width: 100%;
	height: 305px;
	object-fit: cover;
}

.project__arrows {
	position: absolute;
	right: 0;
	bottom: -42px;
	display: flex;
	gap: 6px;
}

.project__title {
	max-width: 336px;
	margin-top: 15px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.56;
	color: var(--ink);
}

.project__text {
	max-width: 507px;
	margin-top: 19px;
	font-size: 16px;
	line-height: 1.56;
	color: var(--ink);
}

.projects__more {
	padding-top: 20px;
	text-align: center;
}

/* --------------------------------------------------------------------------
   География
   -------------------------------------------------------------------------- */

.geography {
	position: relative;
	padding: 80px 0 90px;
	overflow: hidden;
	background: #002773;
}

.geography__title {
	position: relative;
	z-index: 1;
}

.geography__map {
	position: absolute;
	top: 0;
	left: calc(50% - 837px);
	width: 1675px;
	max-width: none;
	height: 870px;
	object-fit: cover;
}

.geography .container:last-child {
	position: relative;
	z-index: 1;
	padding-top: 712px;
}

.geography__list {
	display: block;
	width: 100%;
}

.geography__more {
	margin-top: 27px;
	text-align: center;
}

/* --------------------------------------------------------------------------
   Расчёт и анкета: общий фон под страницей, как фиксированная обложка на Тильде
   -------------------------------------------------------------------------- */

.calc,
.quiz-section {
	background: #f5f8ff url("../img/6630-3061-calculation_2.jpg") center / cover fixed;
}

.calc {
	padding: 80px 0 32px;
}

.calc__title {
	max-width: 718px;
}

.calc__subtitle {
	margin-top: 15px;
	font-size: 14px;
	line-height: 1.57;
	text-align: center;
	color: var(--text);
}

.calc__docs {
	display: flex;
	justify-content: space-between;
	margin-top: 61px;
}

.calc__doc {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 300px;
	height: 166px;
	border: 1px solid #97afdf;
	border-radius: 5px;
	text-align: center;
	background: #fcfdff;
	box-shadow: var(--shadow);
}

.calc__doc img {
	height: 116px;
	width: auto;
	margin-top: -48px;
}

.calc__doc-text {
	max-width: 170px;
	margin-top: 7px;
	font-size: 13px;
	line-height: 1.54;
	color: var(--ink);
}

.calc__doc-link {
	margin-top: 10px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.54;
	color: #253f72;
}

.calc__doc-link:hover {
	text-decoration: none;
}

.quiz-section {
	padding: 45px 0 75px;
}

.quiz {
	position: relative;
	display: grid;
	grid-template-columns: 290px 1fr;
	min-height: 600px;
	padding: 14px;
	background: #fff;
	box-shadow: var(--shadow);
}

.quiz__expert {
	padding: 12px 10px 0 10px;
}

.quiz__photo {
	width: 55px;
	height: 55px;
	border-radius: 5px;
	object-fit: cover;
}

.quiz__expert-box {
	margin-top: 10px;
	padding: 12px 12px 18px;
	background: #f5f8ff;
}

.quiz__expert-name {
	font-size: 14px;
	font-weight: 600;
	color: #000;
}

.quiz__expert-role {
	font-size: 12px;
	line-height: 1.4;
	color: #9aa3b5;
}

.quiz__expert-text {
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--text);
}

.quiz__main {
	display: flex;
	flex-direction: column;
	padding: 0 45px 15px;
	background: #fff;
}

.quiz__progress {
	height: 4px;
	margin: 0 -45px;
	background: #e4e9f3;
}

.quiz__bar {
	display: block;
	width: 12.5%;
	height: 100%;
	background: var(--accent);
	transition: width 0.3s;
}

.quiz__body {
	flex: 1;
	padding-top: 40px;
}

.quiz__step {
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.quiz__question {
	padding: 0;
	margin-bottom: 30px;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.3;
	color: #000;
}

.quiz__options {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px 14px;
}

.quiz__option {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 58px;
	padding: 10px 18px;
	border: 1px solid #e4e9f3;
	border-radius: 3px;
	font-size: 14px;
	line-height: 1.3;
	color: var(--text);
	cursor: pointer;
	transition: border-color 0.2s;
}

.quiz__option:hover,
.quiz__option:has(:checked) {
	border-color: var(--accent);
}

.quiz__radio {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--accent);
}

.quiz__input {
	max-width: 520px;
}

.quiz__hint {
	margin-top: 10px;
	font-size: 13px;
	color: #9aa3b5;
}

.quiz__fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	max-width: 620px;
	margin-bottom: 18px;
}

.quiz__fields .quiz__input {
	max-width: none;
}

.quiz__alert {
	margin-top: 12px;
	font-size: 14px;
	color: #e10000;
}

.quiz__nav {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-top: 20px;
}

.quiz__count {
	margin-right: auto;
	font-size: 12px;
	color: #9aa3b5;
}

.quiz__error {
	font-size: 13px;
	color: #e10000;
}

.quiz__prev {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border: 1px solid #e4e9f3;
	border-radius: 3px;
	color: #9aa3b5;
	background: #fff;
}

.quiz__prev svg {
	transform: scaleX(-1);
}

.quiz__prev:disabled {
	opacity: 0.5;
	cursor: default;
}

.quiz__next {
	min-width: 143px;
	min-height: 50px;
	font-size: 14px;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   Болтовое соединение
   -------------------------------------------------------------------------- */

.bolt {
	padding: 80px 0;
}

.bolt_square .bolt__title {
	max-width: 1021px;
}

.bolt__banner {
	position: relative;
	height: 450px;
	margin-top: 30px;
	padding: 84px 60px 0;
	border-radius: 35px;
	overflow: hidden;
	color: #fff;
}

.bolt__bg,
.bolt__banner::before {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.bolt__bg {
	object-fit: cover;
}

.bolt__banner::before {
	content: "";
	z-index: 1;
	background: linear-gradient(86.76deg, #182744 0%, rgba(24, 39, 68, 0.81) 41%, rgba(255, 247, 5, 0) 100%);
}

.bolt__banner > *:not(img) {
	position: relative;
	z-index: 2;
}

.bolt__banner-title {
	max-width: 421px;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.54;
}

.bolt__banner-text {
	margin-top: 10px;
	font-size: 18px;
	line-height: 1.56;
	color: #a1aec9;
}

.bolt__pill {
	display: flex;
	align-items: center;
	gap: 14px;
	width: 584px;
	min-height: 98px;
	margin-top: 20px;
	padding: 8px 20px 8px 8px;
	border-radius: 100px;
	background: linear-gradient(105.48deg, #41609d 0%, #577abd 50%, #42619e 100%);
}

.bolt__pill-icon {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 83px;
	height: 82px;
	border-radius: 50%;
	background: #314c83;
}

.bolt__pill-icon img {
	width: 70px;
	height: 71px;
}

.bolt__pill p {
	font-size: 16px;
	line-height: 1.56;
}

.bolt__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 25px;
	margin-top: 30px;
}

.bolt__card {
	min-height: 265px;
	padding: 16px 20px 20px;
	border-radius: 10px;
	background: #fff;
	box-shadow: var(--shadow);
}

.bolt__card img {
	width: 47px;
	height: 48px;
}

.bolt__card-title {
	margin-top: 8px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.56;
	color: var(--ink);
}

.bolt__card-text {
	margin-top: 15px;
	font-size: 16px;
	line-height: 1.56;
	color: var(--ink);
}

/* --------------------------------------------------------------------------
   Мембрана
   -------------------------------------------------------------------------- */

.membrane {
	padding: 80px 0;
	background: #f5f8ff center top / cover no-repeat;
}

.membrane__title {
	max-width: none;
}

.membrane__grid {
	display: grid;
	grid-template-columns: 721px 400px;
	justify-content: space-between;
	margin-top: 30px;
}

.membrane__lead {
	max-width: 513px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.56;
	color: #000;
}

.membrane__features {
	display: grid;
	grid-template-columns: 413px 1fr;
	margin-top: 31px;
}

.membrane__feature {
	display: grid;
	grid-template-columns: 47px 1fr;
	column-gap: 19px;
	align-items: center;
}

.membrane__feature img {
	width: 47px;
	height: 47px;
}

.membrane__feature-title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.31;
	color: var(--ink);
}

.membrane__feature-text {
	grid-column: 1 / -1;
	max-width: 381px;
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.57;
	color: var(--ink);
}

.membrane__feature + .membrane__feature .membrane__feature-text {
	max-width: 265px;
}

.membrane__usage {
	display: grid;
	grid-template-columns: 286px 1fr;
	min-height: 145px;
	margin-top: 20px;
	border-radius: 5px;
	background: #f7f8fb;
	box-shadow: var(--shadow);
}

.membrane__usage-text {
	display: flex;
	align-items: center;
	padding: 20px 18px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	color: #fff;
	background: linear-gradient(114.84deg, #182744 18%, #42619e 83%);
}

.membrane__liquids {
	display: grid;
	grid-template-columns: 190px 1fr;
	gap: 20px 0;
	align-content: center;
	padding: 15px 0 15px 20px;
}

.membrane__liquids li {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 16px;
	line-height: 1.31;
	color: var(--ink);
}

.membrane__liquids img {
	flex: none;
	width: 45px;
	height: 45px;
	padding: 3px;
	border-radius: 5px;
	object-fit: cover;
	background: #fff;
}

.membrane__photo {
	position: relative;
	align-self: start;
	margin-top: 3px;
}

.membrane__photo > img {
	display: block;
	width: 400px;
	height: 371px;
	border-radius: 5px;
	object-fit: cover;
}

.membrane__tooltip {
	position: absolute;
	top: 44px;
	left: 46px;
	width: 329px;
	min-height: 129px;
	padding: 18px 20px 18px 18px;
	border-radius: 5px;
	font-size: 14px;
	line-height: 1.57;
	color: var(--ink);
	background: #fff;
	box-shadow: var(--shadow);
}

.membrane__tooltip::before {
	content: "+";
	position: absolute;
	top: -11px;
	left: -9px;
	width: 31px;
	height: 31px;
	border-radius: 50%;
	font-size: 20px;
	font-weight: 100;
	line-height: 31px;
	text-align: center;
	color: #fff;
	background: var(--red);
}

.membrane__tooltip .cold {
	color: var(--accent);
}

.membrane__tooltip .hot {
	color: #d80000;
}

.membrane__video {
	position: absolute;
	left: 38px;
	bottom: 40px;
	display: flex;
	align-items: center;
	gap: 14px;
	max-width: 300px;
	padding: 0;
	border: 0;
	font-size: 14px;
	line-height: 1.29;
	text-align: left;
	color: #fff;
	background: none;
}

/* --------------------------------------------------------------------------
   Комплектация: схема с точками
   -------------------------------------------------------------------------- */

.equipment {
	padding: 80px 0 79px;
}

.equipment__title {
	max-width: 707px;
}

.equipment__scheme {
	position: relative;
	width: 801px;
	max-width: 100%;
	margin: 30px auto 0;
}

.equipment__scheme > img {
	display: block;
	width: 100%;
}

.hotspot {
	position: absolute;
	width: 30px;
	height: 30px;
	margin: -15px 0 0 -15px;
}

.hotspot__btn {
	position: relative;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--red);
}

.hotspot__btn::before {
	content: "";
	position: absolute;
	inset: -6px;
	border-radius: 50%;
	background: rgba(255, 84, 84, 0.35);
	animation: hotspot-pulse 1.8s infinite;
}

.hotspot__btn::after {
	content: "+";
	position: absolute;
	inset: 0;
	font-size: 20px;
	font-weight: 100;
	line-height: 30px;
	color: #fff;
}

@keyframes hotspot-pulse {
	0% {
		transform: scale(0.6);
		opacity: 1;
	}

	100% {
		transform: scale(1.3);
		opacity: 0;
	}
}

.hotspot__tip {
	position: absolute;
	bottom: calc(100% + 12px);
	left: 50%;
	z-index: 5;
	width: 260px;
	padding: 14px 16px;
	border-radius: 5px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ink);
	background: #fff;
	box-shadow: 0 5px 30px rgba(0, 43, 114, 0.2);
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%);
	transition: opacity 0.2s, visibility 0.2s;
}

.hotspot:hover .hotspot__tip,
.hotspot.is-open .hotspot__tip {
	opacity: 1;
	visibility: visible;
}

/* --------------------------------------------------------------------------
   «Соберем резервуар по вашим параметрам»
   -------------------------------------------------------------------------- */

.assemble {
	overflow: hidden;
	background: #f5f8ff center top / cover no-repeat;
}

.assemble__inner {
	position: relative;
	min-height: 609px;
	padding-top: 80px;
	padding-bottom: 80px;
}

.assemble__inner > :not(img) {
	position: relative;
	z-index: 2;
}

.assemble__title {
	max-width: 566px;
}

.assemble__subtitle {
	max-width: 408px;
	margin-top: 13px;
	font-size: 18px;
	line-height: 1.28;
	color: var(--text);
}

.assemble__price {
	display: grid;
	grid-template-columns: 30px 1fr;
	column-gap: 19px;
	max-width: 459px;
	margin-top: 31px;
}

.assemble__price img {
	width: 30px;
	height: 30px;
}

.assemble__price-title {
	align-self: center;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.28;
	color: var(--ink);
}

.assemble__price-text {
	grid-column: 2;
	margin-top: 3px;
	font-size: 14px;
	line-height: 1.57;
	color: var(--ink);
}

.assemble__cta {
	width: 289px;
	min-height: 70px;
	margin-top: 30px;
}

.assemble__img {
	position: absolute;
	top: 38px;
	left: 464px;
	z-index: 1;
	width: 872px;
	max-width: none;
	height: 742px;
}

.assemble__booklet {
	position: absolute;
	top: 80px;
	left: 520px;
	z-index: 1;
	width: 541px;
	max-width: none;
	height: 370px;
}

.assemble_square .assemble__img {
	top: 80px;
	left: 556px;
	width: 644px;
	height: 651px;
}

.assemble_square .assemble__booklet {
	top: 136px;
	left: 749px;
	z-index: 2;
	width: 257px;
	height: 349px;
}

/* --------------------------------------------------------------------------
   Монтаж и этапы
   -------------------------------------------------------------------------- */

.montage {
	padding: 80px 0 49px;
}

.montage__title {
	max-width: 1010px;
}

.montage__list {
	position: relative;
	display: grid;
	grid-template-columns: 315fr 259fr 269fr 316fr;
	min-height: 242px;
	margin-top: 43px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
}

.montage__list::after {
	content: "";
	position: absolute;
	left: 15px;
	right: 15px;
	bottom: -19px;
	z-index: -1;
	height: 134px;
	border-radius: 15px;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 43, 114, 0.1);
}

.montage__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 30px 15px 25px;
	text-align: center;
}

.montage__item + .montage__item::before {
	content: "";
	position: absolute;
	top: 30px;
	left: 0;
	width: 1px;
	height: 138px;
	background: var(--navy);
}

.montage__item > img {
	height: 105px;
	width: auto;
	object-fit: contain;
}

.montage__text {
	margin-top: 12px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.38;
	color: var(--deep);
}

.montage__link {
	margin-top: 6px;
	font-size: 14px;
	font-weight: 500;
}

.stages {
	position: relative;
	padding: 20px 0 80px;
}

.stages::before {
	top: 0;
}

.stages__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 25px;
	margin-top: 20px;
	counter-reset: none;
}

.stages__item {
	position: relative;
	height: 313px;
	border-radius: 5px;
	overflow: hidden;
}

.stages__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.stages__item::after {
	content: "";
	position: absolute;
	inset: 40% 0 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 10, 30, 0.6) 100%);
}

.stages__num {
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 1;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	font-size: 16px;
	font-weight: 100;
	line-height: 45px;
	text-align: center;
	color: #fff;
	background: linear-gradient(182.88deg, #577abd 0%, #00194a 100%);
}

.stages__name {
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 20px;
	z-index: 1;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.38;
	color: #fff;
}

.stages__more {
	margin-top: 33px;
	text-align: center;
}

.stages__link {
	font-size: 18px;
	font-weight: 500;
	line-height: 1.33;
}

/* --------------------------------------------------------------------------
   Документы и консультация
   -------------------------------------------------------------------------- */

.documents {
	padding: 80px 0;
	background: var(--light);
}

.documents__title {
	max-width: 701px;
}

.documents__cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 80px;
	margin-top: 25px;
}

.documents__card {
	position: relative;
	display: flex;
	justify-content: space-between;
	height: 136px;
	padding: 23px 20px 0 70px;
	border-radius: 5px;
	overflow: hidden;
	color: #fff;
}

.documents__card_dark {
	background: linear-gradient(88.2deg, #172643 0%, #052769 63%);
}

.documents__card_light {
	background: linear-gradient(256.68deg, #577abd 0%, #152648 100%);
}

.documents__plus {
	position: absolute;
	top: 21px;
	left: 25px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 20px;
	font-weight: 100;
	line-height: 30px;
	text-align: center;
	background: linear-gradient(182.88deg, #577abd 0%, #00194a 100%);
}

.documents__card-title {
	max-width: 220px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.38;
}

.documents__card img {
	align-self: flex-end;
	width: 290px;
	height: 136px;
	object-fit: contain;
	object-position: bottom right;
}

.consult {
	display: grid;
	grid-template-columns: 583px 1fr;
	margin-top: 55px;
}

.consult__person {
	position: relative;
	padding-left: 21px;
}

.consult__person img {
	width: 510px;
	height: 510px;
}

.consult__name,
.consult__role {
	position: absolute;
	border-radius: 5px;
	text-align: center;
	color: var(--ink);
	background: #fff;
	box-shadow: var(--shadow);
}

.consult__name {
	top: 253px;
	left: 0;
	width: 260px;
	height: 52px;
	font-size: 18px;
	font-weight: 600;
	line-height: 52px;
	z-index: 2;
}

.consult__role {
	top: 295px;
	left: 67px;
	width: 260px;
	height: 64px;
	padding-top: 19px;
	font-size: 16px;
	line-height: 1.56;
	z-index: 1;
}

.consult__body {
	padding-top: 0;
	margin-top: -5px;
}

.consult__title {
	max-width: 543px;
}

.consult__text {
	max-width: 530px;
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.56;
	color: var(--text);
}

.consult__form {
	position: relative;
	width: 584px;
	min-height: 256px;
	margin-top: 28px;
	padding: 31px 37px 26px 40px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
}

.consult__label {
	display: block;
	font-size: 16px;
	line-height: 1.56;
	color: var(--ink);
}

.consult__row {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: 20px;
	align-items: center;
	margin: 12px 0 28px;
}

.consult__input,
.reference__input {
	height: 50px;
	padding: 0 0 0 4px;
	border: 0;
	border-bottom: 1px solid #c9d3e6;
	border-radius: 0;
}

.consult__btn {
	min-height: 70px;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   О компании
   -------------------------------------------------------------------------- */

.about {
	padding: 80px 0 0;
}

.about__inner {
	display: grid;
	grid-template-columns: 1fr 609px;
	align-items: center;
	gap: 30px;
}

.about__text {
	margin-left: -20px;
	padding-bottom: 10px;
}

.about__title {
	max-width: 520px;
	color: #000;
}

.about__lead {
	max-width: 493px;
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.56;
	color: #000;
}

.about__media {
	position: relative;
	border-radius: 5px;
	overflow: hidden;
}

.about__media > img {
	display: block;
	width: 609px;
	height: 381px;
	object-fit: cover;
}

.about__video {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 34px 0 0;
	border: 0;
	font-size: 16px;
	line-height: 1.56;
	color: #fff;
	background: none;
}

.about__gallery {
	padding: 30px 0 55px max(20px, calc(50% - 580px));
}

.about__gallery .slider__track {
	gap: 20px;
	padding-right: 20px;
	scroll-padding-left: 0;
}

.about__gallery .slider__track img {
	width: 375px;
	height: 250px;
	border-radius: 5px;
	object-fit: cover;
}

.about__gallery .slider__btn {
	margin-top: -32px;
}

/* --------------------------------------------------------------------------
   Доставка и регионы
   -------------------------------------------------------------------------- */

.delivery {
	background: var(--blue-band);
}

.delivery__box {
	display: flex;
	justify-content: space-between;
	min-height: 385px;
	padding: 80px 0 60px;
}

.delivery__title {
	max-width: 671px;
}

.delivery__lead {
	max-width: 664px;
	margin-top: 25px;
	font-size: 18px;
	line-height: 1.56;
	color: #adbad2;
}

.delivery__link {
	margin-top: 25px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.56;
}

.delivery__map {
	align-self: flex-start;
	width: 407px;
	height: 240px;
	margin-top: -30px;
}

.regions {
	padding: 76px 0 75px;
	background: var(--light);
}

.regions__track {
	gap: 40px;
}

.regions__card {
	width: calc((100% - 120px) / 4);
	border-radius: 5px;
	overflow: hidden;
	background: var(--primary);
}

.regions__card img {
	display: block;
	width: 100%;
	height: 146px;
	object-fit: cover;
}

.regions__name {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 57px;
	padding: 8px 10px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-align: center;
	color: #fff;
}

/* --------------------------------------------------------------------------
   Тендеры
   -------------------------------------------------------------------------- */

.tenders {
	padding: 80px 0 81px;
	overflow: hidden;
}

.tenders__title {
	max-width: 830px;
}

.tenders__subtitle {
	max-width: 683px;
	margin-top: 19px;
}

.tenders__body {
	position: relative;
	display: flex;
	justify-content: flex-end;
	min-height: 428px;
	margin-top: 26px;
	padding-right: 16px;
}

.tenders__media {
	position: absolute;
	top: -28px;
	left: -73px;
	z-index: 2;
	width: 738px;
	pointer-events: none;
}

.tenders__img {
	width: 738px;
	height: 512px;
	max-width: none;
}

.tenders__stamp {
	position: absolute;
	top: 144px;
	left: 59px;
	width: 136px;
	height: 136px;
}

.tenders__card {
	position: relative;
	width: 617px;
	padding: 25px 40px 38px 27px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
}

.tenders__icon {
	position: absolute;
	top: -56px;
	right: -60px;
	width: 129px;
	height: 129px;
}

.tenders__card-title {
	max-width: 512px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.55;
	color: var(--ink);
}

.tenders__checks {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin-top: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #e4e4e4;
	max-width: 500px;
}

.tenders__checks li {
	position: relative;
	padding-left: 29px;
	font-size: 16px;
	line-height: 1.56;
	color: #1f1f1f;
}

.tenders__checks li::before {
	content: "✓";
	position: absolute;
	top: 5px;
	left: 0;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	font-size: 8px;
	line-height: 15px;
	text-align: center;
	color: #fff;
	background: linear-gradient(182.88deg, #577abd 0%, #00194a 100%);
}

.tenders__docs {
	display: flex;
	gap: 29px;
	margin-top: 10px;
}

.tenders__doc {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 113px;
	height: 146px;
	background: #ededed;
}

.tenders__doc img {
	width: 86px;
	height: 122px;
}

.tenders__links {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-top: 3px;
}

.tenders__link {
	padding: 0;
	border: 0;
	font-size: 14px;
	line-height: 1.57;
	text-align: left;
	text-decoration: underline;
	color: #314c83;
	background: none;
}

.tenders__link:hover {
	text-decoration: none;
}

.tenders__link_main {
	font-weight: 700;
}

.tenders__link_all {
	color: #e60000;
}

/* --------------------------------------------------------------------------
   Команда
   -------------------------------------------------------------------------- */

.team-intro {
	overflow: hidden;
	background: var(--light);
}

.team-intro__inner {
	position: relative;
	min-height: 493px;
	padding-top: 80px;
	padding-bottom: 40px;
}

.team-intro__inner > :not(img) {
	position: relative;
	z-index: 2;
}

.team-intro__logo {
	position: absolute;
	top: 110px;
	left: 0;
	width: 1200px;
	max-width: none;
	height: 224px;
}

.team-intro__title {
	max-width: 793px;
}

.team-intro__subtitle {
	max-width: 570px;
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.56;
	color: var(--text);
}

.team-intro__video {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 241px;
	margin-top: 30px;
	padding: 0;
	border: 0;
	background: none;
}

.team-intro__thumb {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 241px;
	height: 125px;
	padding: 7px 6px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
}

.team-intro__thumb img {
	width: 229px;
	height: 111px;
	border-radius: 5px;
	object-fit: cover;
}

.team-intro__thumb .play {
	position: absolute;
}

.team-intro__caption {
	margin-top: 11px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.56;
	color: var(--text);
}

.team-intro__photo {
	position: absolute;
	top: 128px;
	left: 480px;
	z-index: 1;
	width: 707px;
	max-width: none;
	height: 448px;
}

.team-intro_director .team-intro__photo {
	top: 41px;
	left: 637px;
	width: 431px;
	height: 454px;
}

.team-intro_director .team-intro__title {
	max-width: 530px;
}

.team-intro_director .team-intro__subtitle {
	max-width: 330px;
}

.team-intro__inner > .team-intro__name,
.team-intro__inner > .team-intro__role {
	position: absolute;
	border-radius: 5px;
	text-align: center;
	color: var(--ink);
	background: #fff;
	box-shadow: var(--shadow);
}

.team-intro__inner > .team-intro__name {
	top: 353px;
	left: 482px;
	z-index: 3;
	width: 190px;
	height: 41px;
	font-size: 14px;
	font-weight: 600;
	line-height: 41px;
}

.team-intro__inner > .team-intro__role {
	top: 384px;
	left: 518px;
	width: 190px;
	height: 38px;
	padding-top: 10px;
	font-size: 12px;
	line-height: 1.5;
}

.team {
	padding: 80px 0 70px;
}

.team__title {
	max-width: 872px;
	line-height: 1.2;
}

.team__slider {
	margin-top: 28px;
}

.team__track {
	gap: 40px;
}

.team__card {
	width: calc((100% - 80px) / 3);
	border-radius: 5px;
	overflow: hidden;
	background: #eef3fd;
}

.team__card img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: top;
}

.team__name {
	padding-top: 18px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	text-align: center;
	color: #000;
}

.team__role {
	padding: 6px 10px 22px;
	font-size: 13px;
	text-align: center;
	color: var(--text);
}

/* --------------------------------------------------------------------------
   Консультация по техзаданию
   -------------------------------------------------------------------------- */

.reference {
	background: #f5f8ff center -21px / cover no-repeat;
}

.reference__inner {
	position: relative;
	padding-top: 83px;
	padding-bottom: 80px;
}

.reference__whatsapp {
	position: absolute;
	top: 10px;
	left: 80px;
	width: 72px;
	height: 72px;
}

.reference__phone {
	position: absolute;
	top: 79px;
	right: 4px;
	width: 178px;
	height: 245px;
}

.reference__title {
	max-width: 661px;
	font-size: 26px;
	line-height: 1.54;
}

.reference__subtitle {
	margin-top: 20px;
}

.reference__grid {
	display: grid;
	grid-template-columns: 545px 553px;
	margin-top: 29px;
}

.reference__head {
	font-size: 20px;
	font-weight: 600;
	line-height: 1.55;
	color: #000;
}

.reference__list ul {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 12px 0 0 -10px;
}

.reference__list li {
	display: flex;
	align-items: center;
	gap: 11px;
	font-size: 16px;
	line-height: 1.56;
	color: var(--text);
}

.reference__list img {
	flex: none;
	width: 79px;
	height: 64px;
	object-fit: contain;
}

.reference__side {
	text-align: center;
}

.reference__form {
	padding: 13px 33px 22px;
	border-radius: 5px;
	text-align: left;
	background: #fff;
	box-shadow: var(--shadow);
}

.reference__form-title {
	font-size: 24px;
	font-weight: 600;
	line-height: 1.54;
	color: #000;
}

.reference__form-text {
	margin-top: 6px;
	font-size: 14px;
	line-height: 1.57;
	color: var(--text);
}

.reference__label {
	display: block;
	margin-top: 13px;
	padding: 0;
	font-size: 14px;
	line-height: 1.57;
	color: var(--ink);
}

.reference__input {
	max-width: 383px;
}

.reference__methods {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding: 0;
	border: 0;
}

.reference__methods .reference__label {
	margin-bottom: 10px;
}

.check {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 12px;
	color: var(--text);
	cursor: pointer;
}

.check__input {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: #000;
}

.reference__btn {
	min-height: 50px;
	margin: 18px 0 12px;
	padding: 0 28px;
	letter-spacing: 0;
}

.reference__write {
	margin-top: 21px;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.56;
	color: var(--text);
}

.reference__messengers {
	display: flex;
	justify-content: center;
	gap: 45px;
	margin-top: 26px;
}

.reference__messengers a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 66px;
	height: 36px;
	border-radius: 5px;
	background: #fff;
	box-shadow: var(--shadow);
	transition: transform 0.2s;
}

.reference__messengers a:hover {
	transform: translateY(-2px);
}

.reference__messengers img {
	max-height: 25px;
	width: auto;
}

/* --------------------------------------------------------------------------
   Вопросы и SEO-текст
   -------------------------------------------------------------------------- */

.faq {
	padding: 70px 0 32px;
}

.faq__title {
	max-width: none;
	line-height: 1.43;
	color: #000;
}

.faq__grid {
	display: grid;
	grid-template-columns: 1fr 364px;
	gap: 37px;
	margin-top: 20px;
}

.faq__list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.faq__item {
	border-radius: 8px;
	background: var(--light);
}

.faq__q {
	font-size: inherit;
	font-weight: inherit;
}

.faq__trigger {
	position: relative;
	display: block;
	width: 100%;
	min-height: 86px;
	padding: 22px 80px 22px 30px;
	border: 0;
	font-size: 18px;
	line-height: 1.5;
	text-align: left;
	color: #000;
	background: none;
}

.faq__icon {
	position: absolute;
	top: 50%;
	right: 18px;
	width: 38px;
	height: 38px;
	margin-top: -19px;
	border-radius: 50%;
	background: var(--red);
	transition: transform 0.3s;
}

.faq__icon::before,
.faq__icon::after {
	content: "";
	position: absolute;
	top: 18px;
	left: 9px;
	width: 20px;
	height: 2px;
	background: #fff;
}

.faq__icon::after {
	transform: rotate(90deg);
}

.faq__item.is-open .faq__icon {
	transform: rotate(45deg);
}

.faq__answer {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.3s ease;
}

.faq__answer p {
	padding: 0 30px 26px;
	font-size: 16px;
	line-height: 1.55;
	color: var(--text);
}

.faq__side {
	display: flex;
	flex-direction: column;
	align-items: center;
	align-self: start;
	min-height: 340px;
	padding: 24px 16px 31px;
	border-radius: 8px;
	text-align: center;
	color: #fff;
	background: var(--blue-band);
}

.faq__side img {
	width: 130px;
	height: 130px;
	border-radius: 50%;
	object-fit: cover;
	background: #e2e2e2;
}

.faq__side p {
	max-width: 332px;
	margin-top: 27px;
	font-size: 16px;
	line-height: 1.38;
}

.faq__btn {
	width: 263px;
	min-height: 59px;
	margin-top: 25px;
	border-radius: 3px;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0;
}

.faq__image {
	display: block;
	width: 100%;
	height: 476px;
	margin-top: 48px;
	border-radius: 20px;
	object-fit: cover;
}

.seo {
	padding: 30px 0 30px;
	font-size: 14px;
	line-height: 1.55;
	color: #333;
}

.seo__title {
	margin-bottom: 4px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.35;
	color: #000;
}

.seo p + p {
	margin-top: 22px;
}

/* --------------------------------------------------------------------------
   Подвал и нижняя панель
   -------------------------------------------------------------------------- */

.footer {
	color: #fff;
	background: #182643;
}

.footer__inner {
	display: grid;
	grid-template-columns: 360px 276px 334px 1fr;
	max-width: 1200px;
	margin: 0 auto;
	padding: 23px 20px 30px;
}

.footer__logo img {
	width: 208px;
	height: 39px;
}

.footer__tagline {
	max-width: 212px;
	margin-top: 11px;
	font-size: 14px;
	line-height: 1.36;
	color: #c1d2f4;
}

.footer__nav {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding-top: 6px;
}

.footer__label {
	margin-bottom: 8px;
	font-size: 14px;
	line-height: 1.36;
	color: #6982b2;
}

.footer__nav a {
	font-size: 14px;
	font-weight: 500;
	line-height: 1.14;
	text-decoration: none;
}

.footer__nav a:hover,
.footer__legal a:hover {
	text-decoration: underline;
}

.footer__contacts {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-top: 7px;
}

.footer__address {
	max-width: 282px;
	font-size: 14px;
	line-height: 1.36;
	color: #6982b2;
}

.footer__phone {
	margin-top: 10px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.18;
	text-decoration: none;
}

.footer__mail {
	margin-top: 10px;
	font-size: 14px;
	font-weight: 600;
	color: #6a93e1;
}

.footer__call {
	justify-self: end;
	align-self: start;
	width: 190px;
	height: 54px;
	margin-top: 3px;
	border: 0;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	background: #314c83;
	transition: background 0.2s;
}

.footer__call:hover {
	background: #41619e;
}

.footer__bottom {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: 30px;
	padding-top: 14px;
	border-top: 1px solid #6982b2;
}

.footer__copy {
	flex: none;
	font-size: 14px;
	line-height: 1.36;
	color: #c1d2f4;
}

.footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 18px;
	font-size: 12px;
	line-height: 1.36;
	color: #c1d2f4;
}

.footer__dev {
	position: relative;
	display: flex;
	flex: none;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	font-weight: 300;
	text-decoration: none;
}

.footer__dev-logo_hover {
	position: absolute;
	right: 0;
	opacity: 0;
	transition: opacity 0.2s;
}

.footer__dev:hover .footer__dev-logo_hover {
	opacity: 1;
}

.dock {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 40;
	background: var(--primary);
	box-shadow: 0 -5px 30px rgba(0, 25, 67, 0.2);
	visibility: hidden;
	transform: translateY(100%);
	transition: transform 0.3s, visibility 0.3s;
}

.dock.is-visible {
	visibility: visible;
	transform: none;
}

.dock__inner {
	display: flex;
	align-items: center;
	max-width: 1200px;
	height: 70px;
	margin: 0 auto;
	padding: 0 20px;
	color: #fff;
}

.dock__cta {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 369px;
	height: 58px;
	padding: 0 50px 0 21px;
	border: 0;
	border-radius: 5px;
	text-align: left;
	color: #fff;
	background: linear-gradient(46.08deg, #ca2f2f 0%, #b61c1c 100%);
}

.dock__cta-title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.14;
}

.dock__cta-sub {
	font-size: 10px;
	font-weight: 500;
	line-height: 1.2;
	text-transform: lowercase;
}

.dock__cta-icon {
	position: absolute;
	top: 17px;
	right: 24px;
}

.dock__photo {
	width: 58px;
	height: 58px;
	margin-left: 15px;
	border-radius: 8px;
	object-fit: cover;
}

.dock__person {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-left: 15px;
}

.dock__name {
	font-size: 16px;
	font-weight: 600;
	line-height: 1.13;
}

.dock__role {
	max-width: 230px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.25;
}

.dock__write {
	margin-left: auto;
	font-size: 16px;
	font-weight: 600;
}

.dock__messenger {
	margin-left: 13px;
}

.dock__messenger img {
	width: 49px;
	height: 49px;
	border-radius: 50%;
	transition: transform 0.2s;
}

.dock__messenger:hover img {
	transform: scale(1.06);
}

/* --------------------------------------------------------------------------
   Модальные окна
   -------------------------------------------------------------------------- */

.modal {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	overflow-y: auto;
	background: rgba(0, 0, 0, 0.8);
}

.modal__close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: none;
}

.modal__close::before,
.modal__close::after {
	content: "";
	position: absolute;
	top: 15px;
	left: 4px;
	width: 24px;
	height: 2px;
	background: #000;
	transform: rotate(45deg);
}

.modal__close::after {
	transform: rotate(-45deg);
}

.modal__close_light {
	top: -42px;
	right: 0;
}

.modal__close_light::before,
.modal__close_light::after {
	background: #fff;
}

.popup {
	position: relative;
	width: 560px;
	max-width: 100%;
	margin: auto;
	padding: 50px 40px 40px;
	background: #fff;
}

.popup__title {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.35;
	text-align: center;
	color: #000;
}

.popup__form {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 26px;
}

.popup__submit {
	width: 100%;
	margin-top: 4px;
}

.video-box {
	position: relative;
	width: min(1000px, 100%);
	margin: auto;
}

.video-box__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #000;
}

.video-box__frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.picture-box {
	position: relative;
	width: min(1100px, 100%);
	margin: auto;
	padding: 40px 20px 20px;
	background: #fff;
}

.picture-box img {
	display: block;
	width: 100%;
}

.table-box {
	position: relative;
	width: min(1100px, 100%);
	max-height: calc(100vh - 40px);
	margin: auto;
	padding: 50px 20px 20px;
	background: #fff;
}

.table-box__scroll {
	max-height: calc(100vh - 130px);
	overflow: auto;
}

.delivery-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.4;
	color: #000;
}

.delivery-table th,
.delivery-table td {
	padding: 10px 12px;
	border: 1px solid #e0e0e0;
	text-align: left;
}

.delivery-table th {
	position: sticky;
	top: 0;
	font-weight: 700;
	color: #fff;
	background: var(--primary);
}

.delivery-table tbody tr:nth-child(even) {
	background: #f5f8ff;
}

.delivery-table__btn {
	padding: 0;
	border: 0;
	font-weight: 600;
	text-decoration: underline;
	color: var(--accent);
	background: none;
}

/* --------------------------------------------------------------------------
   Юридические документы
   -------------------------------------------------------------------------- */

.legal {
	padding: 160px 0 80px;
	background: var(--light);
}

.legal__inner {
	max-width: 900px;
	margin: 0 auto;
	padding: 0 20px;
}

.legal__back {
	font-size: 14px;
	font-weight: 500;
	color: var(--accent);
}

.legal__title {
	margin-top: 20px;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--navy);
}

.legal__text {
	margin-top: 30px;
	padding: 40px;
	border-radius: 5px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--text);
	background: #fff;
	box-shadow: var(--shadow);
}

.legal__text h2 {
	margin: 32px 0 12px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--ink);
}

.legal__text h2:first-child {
	margin-top: 0;
}

.legal__text p + p,
.legal__text ul + p,
.legal__text p + ul {
	margin-top: 12px;
}

.legal__text ul {
	padding-left: 22px;
	list-style: disc;
}

.legal__text li + li {
	margin-top: 6px;
}

.legal__text a {
	color: var(--accent);
	overflow-wrap: anywhere;
}

@media (max-width: 959px) {
	.legal {
		padding-top: 110px;
	}
}

@media (max-width: 639px) {
	.legal {
		padding: 90px 0 50px;
	}

	.legal__inner {
		padding: 0 15px;
	}

	.legal__title {
		font-size: 26px;
	}

	.legal__text {
		padding: 24px 16px;
		font-size: 15px;
	}

	.legal__text h2 {
		font-size: 18px;
	}
}

/* --------------------------------------------------------------------------
   Спасибо за заявку
   -------------------------------------------------------------------------- */

.thanks {
	min-height: 100vh;
	padding: 69px 20px 60px;
	background: #1b2847;
}

.thanks__inner {
	max-width: 1186px;
	margin: 0 auto;
}

.thanks__logo {
	display: block;
	width: 100%;
	height: auto;
	opacity: 0.5;
}

.thanks__box {
	position: relative;
	max-width: 800px;
	margin: 107px 0 0 12px;
	padding: 46px 0 0;
}

.thanks__photo {
	position: absolute;
	top: 0;
	left: 0;
	width: 661px;
	height: 500px;
	border-radius: 5px;
	object-fit: cover;
	object-position: 100% 50%;
}

.thanks__card {
	position: relative;
	width: 553px;
	min-height: 499px;
	padding: 100px 60px 60px;
	background: #fff;
}

.thanks__title {
	padding-bottom: 24px;
	font-size: 32px;
	font-weight: 600;
	line-height: 1.23;
	color: #000;
}

.thanks__title::after {
	content: "";
	display: block;
	width: 49px;
	height: 3px;
	margin-top: 24px;
	background: #8fa1d0;
}

.thanks__text {
	font-size: 20px;
	font-weight: 300;
	line-height: 1.55;
	color: #000;
}

.thanks__back {
	display: inline-block;
	margin-top: 30px;
	font-size: 18px;
	font-weight: 600;
	color: var(--accent);
}

.thanks__links {
	display: flex;
	flex-direction: column;
	gap: 17px;
	width: 460px;
	max-width: 100%;
	margin: 37px auto 0;
}

.thanks__address,
.thanks__link {
	padding: 20px 24px;
	border-radius: 30px;
	font-size: 16px;
	line-height: 1.6;
	text-align: center;
	text-decoration: none;
}

.thanks__address {
	color: #333;
	background: #fff;
}

.thanks__link {
	color: #fff;
	transition: opacity 0.2s;
}

.thanks__link:hover {
	opacity: 0.85;
}

.thanks__link_dark {
	color: #ffecd9;
	background: #000;
}

.thanks__link_whatsapp {
	background: #27d061;
}

.thanks__link_telegram {
	background: #0087d0;
}

.thanks__link_vk {
	background: #4a6791;
}

@media (max-width: 959px) {
	.thanks__box {
		margin: 40px auto 0;
		padding: 0;
	}

	.thanks__photo {
		position: static;
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 661 / 500;
	}

	.thanks__card {
		width: auto;
		min-height: 0;
		padding: 40px 30px;
	}
}

@media (max-width: 639px) {
	.thanks {
		padding: 30px 15px 40px;
	}

	.thanks__title {
		font-size: 26px;
	}

	.thanks__text {
		font-size: 17px;
	}

	.thanks__card {
		padding: 30px 20px;
	}
}

/* --------------------------------------------------------------------------
   Cookie
   -------------------------------------------------------------------------- */

.cookie-banner {
	position: fixed;
	left: 20px;
	bottom: calc(20px + var(--dock-h));
	z-index: 250;
	max-width: 426px;
	padding: 18px 20px;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.cookie-banner__inner {
	display: flex;
	align-items: center;
	gap: 20px;
}

.cookie-banner__text {
	font-size: 12px;
	line-height: 1.5;
	color: #555;
}

.cookie-banner__btn {
	flex: none;
	padding: 8px 18px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 13px;
	color: #555;
	background: #f6f6f6;
}

.cookie-banner__btn:hover {
	background: #eee;
}

/* --------------------------------------------------------------------------
   Адаптив: до 1199px — сетка тянется, широкие колонки сжимаются
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
	.nav {
		padding: 0 20px;
	}

	.product__inner {
		grid-template-columns: 1fr 1fr;
	}

	.product__title {
		font-size: 44px;
	}

	.product__img {
		width: 100%;
		height: auto;
		aspect-ratio: 665 / 590;
	}

	.specs__inner {
		grid-template-columns: 1fr 1fr;
		gap: 40px;
	}

	.specs__img {
		width: 100%;
		height: auto;
	}

	.videos__list {
		grid-template-columns: repeat(6, 1fr);
		padding: 0 20px;
	}

	.membrane__grid {
		grid-template-columns: 1fr 340px;
		gap: 30px;
	}

	.membrane__features {
		grid-template-columns: 1fr 1fr;
	}

	.membrane__photo > img {
		width: 100%;
		height: auto;
	}

	.membrane__tooltip {
		left: 6px;
	}

	.assemble__img {
		left: 500px;
		width: 640px;
		height: auto;
	}

	.assemble__booklet {
		display: none;
	}

	.consult {
		grid-template-columns: 1fr 1fr;
		gap: 20px;
	}

	.consult__person img {
		width: 100%;
		height: auto;
	}

	.consult__form {
		width: 100%;
		max-width: 584px;
	}

	.consult__row {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.about__inner {
		grid-template-columns: 1fr 1fr;
		gap: 30px;
	}

	.about__media > img {
		width: 100%;
		height: auto;
	}

	.tenders__media {
		left: -20px;
		width: 480px;
	}

	.tenders__img {
		width: 480px;
		height: auto;
	}

	.tenders__stamp {
		top: 94px;
		left: 38px;
		width: 88px;
		height: 88px;
	}

	.tenders__card {
		width: 540px;
	}

	.tenders__icon {
		right: -20px;
	}

	.team-intro__logo {
		width: 100%;
		height: auto;
	}

	.team-intro__photo {
		left: auto;
		right: -40px;
		width: 560px;
		height: auto;
	}

	.team-intro__title {
		max-width: 470px;
	}

	.team-intro__subtitle {
		max-width: 420px;
	}

	.team-intro_director .team-intro__photo {
		left: auto;
		right: 40px;
	}

	.team-intro__inner > .team-intro__name,
	.team-intro__inner > .team-intro__role {
		left: auto;
		right: 240px;
	}

	.slider__btn_side.slider__btn_prev {
		left: -12px;
	}

	.slider__btn_side.slider__btn_next {
		right: -12px;
	}

	.reference__grid {
		grid-template-columns: 1fr 1fr;
		gap: 30px;
	}

	.reference__phone {
		display: none;
	}

	.footer__inner {
		grid-template-columns: 1.1fr 1fr 1.2fr auto;
		gap: 20px;
	}
}

/* --------------------------------------------------------------------------
   Адаптив: до 959px — бургер, блоки в одну-две колонки, абсолютные слои в поток
   -------------------------------------------------------------------------- */

@media (max-width: 959px) {
	.h2 {
		font-size: 28px;
	}

	.header__about,
	.header__mail,
	.header .nav,
	.scrollnav {
		display: none;
	}

	.header__phone {
		margin-left: auto;
	}

	.header__burger {
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 44px;
		height: 44px;
		margin-left: 14px;
		padding: 0 10px;
		border: 0;
		border-radius: 5px;
		background: var(--primary);
	}

	.header__burger span {
		display: block;
		height: 2px;
		border-radius: 1px;
		background: #fff;
	}

	.header__logo {
		border-right: 0;
	}

	/* Первый экран */
	.hero__bg,
	.hero_square .hero__bg,
	.hero_short .hero__bg {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-position: 70% 0;
		opacity: 0.35;
	}

	.hero__inner {
		height: auto;
		padding: 110px 20px 40px;
	}

	.hero__head,
	.hero_square .hero__head,
	.hero_short .hero__head {
		width: auto;
		max-width: 600px;
	}

	.hero__title {
		font-size: 40px;
	}

	.hero__badge,
	.hero_square .hero__badge {
		position: static;
		display: inline-block;
		width: auto;
		margin-top: 12px;
		padding: 0 14px;
	}

	.hero__video {
		top: 300px;
		left: auto;
		right: 40px;
	}

	.hero__benefits {
		position: relative;
		top: auto;
		left: auto;
		right: auto;
		height: auto;
		margin-top: 40px;
		padding-bottom: 26px;
	}

	.hero__benefits::before {
		display: none;
	}

	.hero__benefit {
		padding: 26px 12px 0;
	}

	.hero__benefit-title {
		margin-top: 16px;
	}

	/* Страница объёма */
	.product__bg {
		height: 100%;
	}

	.product__inner {
		grid-template-columns: 1fr;
		min-height: 0;
		padding: 100px 20px 60px;
	}

	.product__info {
		padding-top: 30px;
	}

	.product__title {
		max-width: none;
		font-size: 40px;
	}

	.product__media {
		padding-top: 30px;
	}

	.specs__inner {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.specs__img {
		max-width: 561px;
		margin: 30px auto 0;
	}

	/* Ролики, каталог, слайдеры */
	.videos__band {
		height: auto;
		padding-bottom: 30px;
	}

	.videos__list {
		grid-template-columns: repeat(3, 1fr);
		row-gap: 20px;
	}

	.catalog__tabs {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}

	.catalog__grid {
		grid-template-columns: 1fr 1fr;
	}

	.others__track .card {
		width: calc((100% - 28px) / 2);
	}

	/* Каталог, проекты, расчёт */
	.download__inner {
		min-height: 0;
	}

	.download__img,
	.download_square .download__img {
		position: static;
		display: block;
		width: 100%;
		max-width: 560px;
		height: auto;
		margin: 30px auto 0;
	}

	.project__title {
		padding-right: 64px;
	}

	.geography {
		padding-top: 60px;
	}

	.geography__map {
		position: static;
		width: 100%;
		height: auto;
		margin: 20px 0;
		transform: none;
	}

	.geography .container:last-child {
		padding-top: 0;
	}

	.calc__docs {
		flex-wrap: wrap;
		justify-content: center;
		gap: 30px 20px;
	}

	.quiz {
		grid-template-columns: 1fr;
	}

	.quiz__expert {
		display: flex;
		align-items: center;
		gap: 20px;
	}

	/* Болты, мембрана, оборудование, сборка */
	.bolt__banner {
		height: auto;
		padding: 40px 30px;
	}

	.bolt__pill {
		width: auto;
	}

	.membrane__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.membrane__photo {
		max-width: 400px;
		margin: 0 auto;
	}

	.equipment {
		overflow: hidden;
	}

	.hotspot__tip {
		max-width: 220px;
	}

	.assemble__inner {
		min-height: 0;
	}

	.assemble__img,
	.assemble_square .assemble__img {
		position: static;
		display: block;
		width: 100%;
		max-width: 640px;
		height: auto;
		margin: 30px auto 0;
	}

	.montage__list {
		grid-template-columns: 1fr 1fr;
		row-gap: 30px;
	}

	.montage__list::after,
	.montage__item + .montage__item::before {
		display: none;
	}

	.stages__list {
		grid-template-columns: 1fr 1fr;
	}

	.documents__cards {
		flex-direction: column;
		gap: 40px;
	}

	.documents__plus {
		display: none;
	}

	/* Консультация, о компании, доставка, тендеры */
	.consult {
		grid-template-columns: 1fr;
	}

	.consult__person {
		width: 100%;
		max-width: 420px;
		margin: 0 auto;
	}

	.consult__name {
		top: auto;
		bottom: 70px;
	}

	.consult__role {
		top: auto;
		bottom: 18px;
	}

	.about__inner {
		grid-template-columns: 1fr;
	}

	.about__text {
		margin: 0;
	}

	.delivery__box {
		flex-direction: column;
		align-items: flex-start;
		height: auto;
		gap: 20px;
	}

	.delivery__map {
		width: 100%;
		max-width: 407px;
		height: auto;
		margin: 0;
	}

	.regions__card {
		width: calc((100% - 20px) / 2);
	}

	.tenders__body {
		display: block;
		min-height: 0;
		padding-right: 0;
	}

	.tenders__media {
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		max-width: 480px;
		margin: 0 auto;
	}

	.tenders__img {
		width: 100%;
	}

	.tenders__card {
		width: auto;
	}

	.tenders__icon {
		top: -40px;
		right: 10px;
		width: 90px;
		height: 90px;
	}

	/* Команда */
	.team-intro__inner {
		min-height: 0;
	}

	.team-intro__logo {
		display: none;
	}

	.team-intro__photo,
	.team-intro_director .team-intro__photo {
		position: static;
		display: block;
		width: 100%;
		max-width: 600px;
		height: auto;
		margin: 30px auto 0;
	}

	.team-intro__inner > .team-intro__name,
	.team-intro__inner > .team-intro__role {
		position: static;
		width: auto;
		height: auto;
		text-align: center;
	}

	.team-intro__inner > .team-intro__name {
		margin-top: 12px;
	}

	.team__card {
		width: calc((100% - 20px) / 2);
	}

	.slider__btn_side.slider__btn_prev {
		left: 4px;
	}

	.slider__btn_side.slider__btn_next {
		right: 4px;
	}

	/* Референс, вопросы, подвал */
	.reference__whatsapp {
		display: none;
	}

	.reference__grid {
		grid-template-columns: 1fr;
	}

	.reference__form {
		max-width: 560px;
		margin: 0 auto;
	}

	.faq__grid {
		grid-template-columns: 1fr;
	}

	.footer__inner {
		grid-template-columns: 1fr 1fr;
		row-gap: 30px;
	}

	.footer__call {
		justify-self: start;
	}

	.footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}

	.footer__legal {
		justify-content: flex-start;
	}

	.dock__person,
	.dock__photo {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   Адаптив: до 639px — телефоны 320–480
   -------------------------------------------------------------------------- */

@media (max-width: 639px) {
	.container,
	.header,
	.scrollnav,
	.hero__inner,
	.product__inner,
	.footer__inner,
	.dock__inner {
		padding-left: 15px;
		padding-right: 15px;
	}

	.h2 {
		font-size: 22px;
		line-height: 1.36;
		letter-spacing: 0;
	}

	.subtitle {
		font-size: 16px;
	}

	.header__top {
		height: 60px;
	}

	.header__logo img {
		width: 130px;
		height: auto;
	}

	.header__phone {
		font-size: 14px;
	}

	.header__phone::before {
		display: none;
	}

	/* Первый экран */
	.hero__inner {
		padding-top: 90px;
	}

	.hero__title {
		font-size: 30px;
	}

	.hero__badge {
		font-size: 14px;
		line-height: 32px;
	}

	.hero__subtitle {
		font-size: 16px;
	}

	.hero__note {
		height: auto;
		margin: 16px 0;
	}

	.hero__note img {
		width: 60px;
		height: 80px;
	}

	.hero__note p {
		font-size: 13px;
	}

	.hero__cta,
	.hero__catalog,
	.hero_square .hero__catalog {
		width: 100%;
	}

	.hero__cta {
		padding-right: 56px;
	}

	.hero__video {
		position: relative;
		top: auto;
		right: auto;
		display: block;
		margin: 24px auto 0;
	}

	.hero__benefits {
		grid-template-columns: 1fr;
	}

	.hero__benefit + .hero__benefit::before {
		top: 0;
		left: 20px;
		right: 20px;
		width: auto;
		height: 1px;
	}

	/* Страница объёма */
	.product__title {
		font-size: 30px;
	}

	.product__specs,
	.product__check {
		font-size: 15px;
	}

	.product__cta {
		width: 100%;
		font-size: 18px;
	}

	.specs__name {
		white-space: normal;
	}

	/* Ролики, каталог */
	.videos__list {
		grid-template-columns: 1fr 1fr;
	}

	.catalog__tabs {
		grid-template-columns: 1fr 1fr;
	}

	.catalog__tab {
		font-size: 13px;
	}

	.catalog__grid {
		grid-template-columns: 1fr;
	}

	.card_wide {
		grid-column: auto;
	}

	.card__bullets {
		position: static;
		width: auto;
		margin: 16px 0 0;
	}

	.others__track .card {
		width: 85%;
	}

	.download__title {
		font-size: 24px;
	}

	.download__badge {
		display: inline-block;
	}

	.projects__grid {
		grid-template-columns: 1fr;
	}

	.project {
		min-height: 0;
	}

	.calc__doc {
		width: 100%;
	}

	/* Анкета */
	.quiz {
		padding: 20px 15px;
	}

	.quiz__expert {
		display: none;
	}

	.quiz__main {
		padding: 0;
	}

	.quiz__progress {
		margin: 0;
	}

	.quiz__question {
		font-size: 18px;
	}

	.quiz__options,
	.quiz__fields {
		grid-template-columns: 1fr;
	}

	/* Болты, мембрана, этапы */
	.bolt__banner {
		padding: 30px 15px;
	}

	.bolt__banner-title {
		font-size: 20px;
	}

	.bolt__pill {
		border-radius: 20px;
	}

	.bolt__cards {
		grid-template-columns: 1fr;
	}

	.membrane__features,
	.membrane__usage {
		grid-template-columns: 1fr;
	}

	.membrane__liquids {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px 10px;
		padding: 15px 10px;
	}

	.membrane__liquids li {
		gap: 8px;
		font-size: 14px;
	}

	.membrane__liquids img {
		width: 36px;
		height: 36px;
	}

	.membrane__tooltip {
		position: static;
		width: auto;
		min-height: 0;
		margin-top: 12px;
	}

	.membrane__tooltip::before {
		display: none;
	}

	.membrane__video {
		position: static;
		margin-top: 14px;
		color: var(--ink);
	}

	.stages__list {
		grid-template-columns: 1fr;
	}

	.stages__item {
		height: 220px;
	}

	.documents__card {
		flex-direction: column;
		padding: 25px 20px;
	}

	.documents__card img {
		width: 100%;
		max-width: 290px;
		height: auto;
	}

	/* Консультация, о компании, регионы, тендеры */
	.consult__form {
		padding: 20px 15px;
	}

	.consult__name,
	.consult__role {
		width: 220px;
		font-size: 15px;
	}

	.about__media > img {
		aspect-ratio: 609 / 381;
	}

	.about__gallery .slider__track img {
		width: 280px;
		height: 187px;
	}

	.regions__card,
	.team__card {
		width: 85%;
	}

	.tenders__card {
		padding: 25px 15px 30px;
	}

	.tenders__card-title {
		padding-right: 70px;
		font-size: 18px;
	}

	.tenders__icon {
		width: 70px;
		height: 70px;
		top: -20px;
		right: 0;
	}

	.tenders__docs {
		flex-direction: column;
		align-items: flex-start;
	}

	.team-intro__subtitle {
		font-size: 16px;
	}

	.reference__title {
		font-size: 22px;
	}

	.reference__form {
		padding: 13px 15px 22px;
	}

	.faq__trigger {
		padding-left: 15px;
		padding-right: 60px;
		font-size: 16px;
	}

	.faq__image {
		height: 220px;
	}

	.footer__inner {
		grid-template-columns: 1fr;
	}

	/* Нижняя панель, окна, cookie */
	.dock__inner {
		height: 60px;
	}

	.dock__write {
		display: none;
	}

	.dock__cta {
		flex: 1;
		width: auto;
		height: 48px;
		padding: 0 40px 0 12px;
	}

	.dock__cta-title {
		font-size: 13px;
	}

	.dock__cta-sub {
		display: none;
	}

	.dock__cta-icon {
		top: 12px;
		right: 12px;
	}

	.dock__messenger {
		margin-left: 8px;
	}

	.dock__messenger img {
		width: 40px;
		height: 40px;
	}

	.popup {
		padding: 40px 20px 25px;
	}

	.popup__title {
		font-size: 20px;
	}

	.cookie-banner {
		left: 10px;
		right: 10px;
		max-width: none;
	}

	.cookie-banner__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}
}