:root {
    --maincolor: #15202A;       /* тёмный: текст, тёмные секции */
    --seccolor: #B2180E;        /* красный акцент */
    --seccolor_hover: #C91C10;  /* hover для красного */
    --dark: #181F26;            /* тёмные кнопки */
    --darkest: #0F171F;         /* футер */
    --gray: #414954;            /* второстепенный текст */
    --gray_blue: #5C6C80;       /* подписи в карточках */
    --navy: #213D5D;            /* названия партнёров */
    --light: #B9C3CF;           /* светлый текст на тёмном, линии */
    --light_nav: #BEC3C5;       /* пункты меню */
    --bg_gray: #E9E8E3;         /* фон серых секций */
    --bg_light: #F2F1ED;        /* светлые плашки */
    --shadow: 0 10px 30px rgba(33, 61, 93, 0.1);
    --shadow_dark: 0 10px 30px rgba(21, 32, 42, 0.1);

    --font: "Montserrat", sans-serif;
    --font_mono: "Space Mono", monospace;
    --header_h: 70px;
    --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font);
    background-repeat: no-repeat;
    color: var(--maincolor);
}

html {scroll-behavior: smooth;}

img {
    border: none;
    display: block;
    max-width: 100%;
    height: auto;
}
a {
    outline: none;
    text-decoration: none;
}
ul, ol {list-style: none;}

input, button, textarea {outline: none;}
button {
    border: none;
    background: none;
    font: inherit;
    cursor: pointer;
}

body {
    width: 100%;
    min-width: 320px;
    background-color: #fff;
    overflow-x: hidden;
}

/* Контентная обёртка */
.div1400 {
    position: relative;
    width: min(1400px, 100% - 40px);
    margin: 0 auto;
}

section {
    position: relative;
    padding: 100px 0;
    overflow-x: clip;
    scroll-margin-top: var(--header_h);
}

.nobr {white-space: nowrap;}



/* ---------- ФОНЫ СЕКЦИЙ ---------- */
.gray_sec {background-color: var(--bg_gray);}
.dark_sec {background-color: var(--maincolor);}
.dark_sec .sec_title,
.dark_sec .sec_text,
.dark_sec .sec_text b {color: #fff;}

/* Общий фон для нескольких секций подряд: слои позиционируются от обёртки */
.bg_group {
    position: relative;
    overflow: hidden;
}
.bg_group > section {z-index: 1;}
.bg_layer {
    position: absolute;
    left: 50%;
    pointer-events: none;
}
/* Сетка 1926×1766, по центру макета */
.bg_net {
    width: max(1926px, 100vw);
    height: 1766px;
    margin-left: calc(max(1926px, 100vw) / -2);
    background: url(../img/site/net_back_full.svg) center / 100% 100% no-repeat;
}
/* «Разлёт» 1330×1446, повёрнут как в макете */
.bg_burst {
    width: 1330px;
    height: 1446px;
    background: url(../img/site/burst_back.svg) center / 100% 100% no-repeat;
    transform: rotate(-6.12deg);
}
.bg_group_utp .bg_net {top: -217px;}
.engineering .bg_net {top: -404px;}
.bg_group_how .bg_net {top: -679px;}
.bg_burst_1 {top: 975px; margin-left: -505px;}
.bg_burst_2 {top: 2222px; margin-left: -1183px;}



/* ---------- ЗАГОЛОВКИ СЕКЦИЙ ---------- */
.sec_head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 40px;
}
.sec_head_left {max-width: 820px;}

.sec_label {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    font-size: 16px;
    line-height: 23px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--seccolor);
}
.sec_label::before {
    content: '';
    flex-shrink: 0;
    width: 28px;
    height: 3px;
    margin-right: 10px;
    background-color: var(--seccolor);
    transition: width 700ms var(--ease) 200ms;
}
.dark_sec .sec_label {color: #fff;}

.sec_title {
    font-size: 40px;
    line-height: 46px;
    font-weight: 800;
    text-transform: uppercase;
}
.sec_title span {color: var(--seccolor);}

.sec_text {
    flex-shrink: 0;
    width: 400px;
    padding-bottom: 4px;
    font-size: 16px;
    line-height: 21px;
    color: var(--gray);
}
.sec_text b {
    font-weight: 600;
    color: var(--maincolor);
}



/* ---------- КНОПКИ ---------- */
/* Обводка «снаружи» из макета = box-shadow, при наведении она убирается */
.btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 52px;
    padding: 0 40px;
    overflow: hidden;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 300ms ease-out, box-shadow 300ms ease-out;
}
.btn span, .btn b {color: inherit;}
.btn_red {
    background-color: var(--seccolor);
    box-shadow: 0 0 0 5px rgba(178, 24, 14, 0.32);
}
.btn_dark {
    background-color: rgba(24, 31, 38, 0.8);
    box-shadow: 0 0 0 5px rgba(65, 69, 75, 0.32);
    color: var(--light_nav);
}
.btn_small {
    height: 32px;
    padding: 0 20px 1px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 0 0 3px rgba(178, 24, 14, 0.32);
}

@media (hover: hover) and (min-width: 769px) {
    .btn:hover {box-shadow: 0 0 0 0 transparent;}
    .btn_red:hover {background-color: var(--seccolor_hover);}
    .btn_dark:hover {
        background-color: var(--dark);
        color: #fff;
    }
}



/* ---------- HEADER ---------- */
header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: var(--header_h);
    background-color: var(--maincolor);
    border-bottom: 1px solid var(--seccolor);
    box-shadow: 0 10px 30px rgba(21, 32, 42, 0.25);
}
.header_inner {
    display: flex;
    align-items: center;
    height: 100%;
}
.header_logo {flex-shrink: 0;}
.header_logo img {width: 237px;}

.header_nav {
    display: flex;
    align-items: center;
    gap: 24px;
    margin: 0 auto;
}
.header_nav a {
    position: relative;
    padding: 6px 0;
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
    color: var(--light_nav);
    transition: color 250ms ease-out;
}
.header_nav a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background-color: var(--seccolor);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 300ms var(--ease);
}
.header_nav a.active {color: #fff;}
.header_nav a.active::after {transform: scaleX(1);}

.header_contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    margin-right: 20px;
}
.header_contacts span {
    font-size: 10px;
    line-height: 12px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--light_nav);
}
.header_phone {
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}

.header_call svg {fill: var(--seccolor);}
.hamburger {display: none;}

@media (hover: hover) and (min-width: 769px) {
    .header_nav a:hover {color: #fff;}
    .header_nav a:hover::after {
        transform: scaleX(1);
        transform-origin: left;
    }
    .header_phone:hover {color: var(--light);}
}



/* ---------- HERO ---------- */
.hero {
    display: flex;
    --hero_h: clamp(780px, 100vh, 960px);
    min-height: var(--hero_h);
    padding: calc(var(--header_h) + 30px) 0 95px;
    overflow: hidden;
    background: var(--maincolor) url(../img/site/hero_back.webp) center / cover no-repeat;
}
.hero_video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Затемнение: градиент из макета (блок 1440px) строго по центру экрана, за его краями цвета продолжаются.
   Для угла 105.84° длина линии градиента блока 1440×H = 1385.3px + 0.2729·H,
   поэтому стоп f из макета стоит на 50% + (f − 0.5)·длина */
.hero_shade {
    --grad_len: calc(1385.3px + 0.2729 * var(--hero_h));
    position: absolute;
    inset: 0;
    background: linear-gradient(105.84deg,
        rgba(21, 32, 42, 0.95) calc(50% - 0.4315 * var(--grad_len)),
        rgba(21, 32, 42, 0.922393) calc(50% - 0.2426 * var(--grad_len)),
        rgba(21, 32, 42, 0.85) calc(50% - 0.1437 * var(--grad_len)),
        rgba(21, 32, 42, 0.75) calc(50% + 0.1463 * var(--grad_len)),
        rgba(21, 32, 42, 0.65) calc(50% + 0.3233 * var(--grad_len)),
        rgba(21, 32, 42, 0.4) calc(50% + 0.5 * var(--grad_len)));
}
.hero_inner {
    display: flex;
    flex-direction: column;
}
.hero_org {
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(185, 195, 207, 0.32);
    font-size: 28px;
    line-height: 34px;
    font-weight: 500;
    letter-spacing: 0.015em;
    text-transform: uppercase;
    color: #fff;
}

.hero_title {
    margin-top: 30px;
    font-size: 70px;
    line-height: 75px;
    font-weight: 900;
    text-transform: uppercase;
}
.hero_line {
    display: block;
    overflow: hidden;
}
.hero_line > span {
    display: block;
    color: #fff;
    transform: translateY(105%);
    transition: transform 1000ms var(--ease);
}
.hero_line:nth-child(2) > span {transition-delay: 150ms;}
.hero_line:nth-child(3) > span {transition-delay: 300ms;}
.hero_title em {
    font-style: normal;
    color: var(--seccolor);
}
body.loaded .hero_line > span {transform: none;}

.hero_bottom {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    margin-top: auto;
    padding-top: 30px;
}
.hero_info {
    flex: 1;
    max-width: 820px;
}
.hero_subtitle {
    font-size: 28px;
    line-height: 34px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
}
.hero_text {
    max-width: 715px;
    margin-top: 20px;
    font-size: 25px;
    line-height: 30px;
    color: #fff;
}
.hero_buttons {
    display: flex;
    gap: 30px;
    margin-top: 49px;
}

.hero_list {
    flex-shrink: 0;
    width: 400px;
}
.hero_list li {
    display: flex;
    align-items: center;
    min-height: 50px;
    margin-bottom: 30px;
    padding: 5px 0 5px 20px;
    border-left: 4px solid var(--seccolor);
    font-size: 18px;
    line-height: 20px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
}
.hero_list li:nth-child(2) {min-height: 30px;}
.hero_list li:last-child {margin-bottom: 0;}



/* ---------- UTP ---------- */
.utp .sec_text {
    font-weight: 500;
    color: var(--gray_blue);
}
.utp .sec_text b {color: var(--gray_blue);}
.utp_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.utp_card {
    min-height: 180px;
    padding: 25px;
    background-color: #fff;
    box-shadow: var(--shadow);
    transition: transform 350ms var(--ease), box-shadow 350ms ease-out, opacity 800ms ease;
}
.utp_num {
    font-family: var(--font_mono);
    font-size: 18px;
    line-height: 18px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--seccolor);
}
.utp_title {
    margin-top: 10px;
    font-size: 18px;
    line-height: 23px;
    font-weight: 700;
}
.utp_text {
    margin-top: 10px;
    font-size: 15px;
    line-height: 23px;
}
.utp_text b {font-weight: 700;}
.utp_card_red {background-color: var(--seccolor);}
.utp_card_red p, .utp_card_red b {color: #fff;}



/* ---------- PARTNERS ---------- */
.partners {padding-bottom: 160px;}
.partners_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.partners_card {
    padding: 20px;
    text-align: center;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.partners_type {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray_blue);
}
.partners_logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 79px;
    margin: 10px 0;
}
.partners_logo img {
    max-height: 79px;
    max-width: 170px;
}
.partners_name {
    font-size: 17px;
    line-height: 21px;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--navy);
}
.partners_text {
    margin-top: 10px;
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    color: var(--gray_blue);
}

.partners_approval {
    margin-top: 20px;
    padding: 15px 25px;
    font-size: 21px;
    line-height: 26px;
    font-weight: 800;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    background-color: var(--seccolor);
    box-shadow: var(--shadow);
}

.partners_ankor {
    display: flex;
    align-items: center;
    margin-top: 20px;
    padding: 20px 25px 20px 40px;
    background-color: var(--maincolor);
    box-shadow: var(--shadow);
}
.partners_ankor img {
    flex-shrink: 0;
    width: 288px;
}
.partners_ankor_text {
    margin-left: 40px;
    padding-left: 40px;
    border-left: 1px solid var(--light);
}
.partners_ankor_text p {
    font-size: 20px;
    line-height: 23px;
    font-weight: 500;
    color: #fff;
}
.partners_ankor_text .partners_ankor_title {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--light);
}



/* ---------- THREAT ---------- */
.threat {overflow: hidden;}
/* Градиент из макета (отражён по горизонтали) строго по центру блоком 1440px, за краями цвета продолжаются */
.threat_back {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg,
            rgba(21, 32, 42, 0.9) calc(50% - 720px),
            rgba(21, 32, 42, 0.8) calc(50% + 17.7px),
            rgba(21, 32, 42, 0.55) calc(50% + 720px)),
        var(--maincolor) url(../img/site/threat_back.webp) center / cover no-repeat;
}
.threat .sec_title {
    font-size: 46px;
    line-height: 50px;
}
.threat .sec_text {font-weight: 500;}

.threat_drone_wrap {
    position: absolute;
    left: calc(50% - 45px);
    top: 200px;
    width: 400px;
    pointer-events: none;
}
.threat_drone {
    width: 100%;
    filter: drop-shadow(0 25px 25px rgba(0, 0, 0, 0.45));
    animation: drone_float 6s ease-in-out infinite;
}
@keyframes drone_float {
    0%, 100% {transform: translate(0, 0) rotate(0deg);}
    50% {transform: translate(-14px, -12px) rotate(-1.5deg);}
}

.threat_subtitle {
    margin-top: 220px;
    font-size: 28px;
    line-height: 34px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
}
.threat_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px;
}
.threat_card {
    min-height: 180px;
    padding: 25px;
    background-color: rgba(255, 255, 255, 0.12);
    border-bottom: 3px solid var(--seccolor);
    box-shadow: 0 10px 30px rgba(18, 35, 54, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: background-color 350ms ease-out, transform 350ms var(--ease), opacity 800ms ease;
}
.threat_type {
    font-size: 18px;
    line-height: 18px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--light);
}
.threat_doc {
    margin: 20px 0;
    font-size: 32px;
    line-height: 23px;
    font-weight: 800;
    color: #fff;
}
.threat_text {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    color: #fff;
}



/* ---------- OBJECTS ---------- */
.objects {padding-bottom: 160px;}
.objects_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.objects_card {
    display: flex;
    flex-direction: column;
    padding-top: 20px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.objects_head {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0 20px;
}
.objects_icon {
    width: auto;
    height: 55px;
    align-self: flex-start;
}
.objects_title {
    display: flex;
    align-items: center;
    min-height: 40px;
    font-size: 21px;
    line-height: 20px;
    font-weight: 700;
    text-transform: uppercase;
}
.objects_text {
    display: flex;
    align-items: center;
    min-height: 68px;
    margin: 10px 0 20px;
    padding: 0 20px;
    font-size: 14px;
    line-height: 17px;
    color: var(--gray_blue);
}
/* Картинка фоном (inline background-image): высоту блока можно менять без искажения пропорций */
.objects_img {
    margin-top: auto;
    aspect-ratio: 295 / 216;
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
    transform-origin: center bottom;
    transition: transform 700ms var(--ease);
}

.objects_also {margin-top: 40px;}
.objects_also_title {
    margin-bottom: 10px;
    font-size: 23px;
    line-height: 23px;
    font-weight: 700;
    text-transform: uppercase;
}

/* Список в строку с красными точками-разделителями */
.dot_list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 10px;
}
.dot_list li {
    display: flex;
    align-items: center;
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
}
.dot_list li:not(:first-child)::before {
    content: '';
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    margin: 0 20px;
    border-radius: 50%;
    background-color: var(--seccolor);
}



/* ---------- PROBLEM ---------- */
.problem {
    padding: 0 0 80px;
    background-color: var(--bg_light);
}
.problem_top {
    padding: 40px 0;
    background-color: var(--seccolor);
}
.problem_top .sec_head {margin-bottom: 0;}
.problem_top .sec_label::before {background-color: #fff;}

.problem_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding-top: 40px;
}
.problem_card {
    min-height: 305px;
    padding: 20px;
    border-left: 4px solid var(--seccolor);
    transition: background-color 350ms ease-out, box-shadow 350ms ease-out, opacity 800ms ease, transform 800ms var(--ease);
}
.problem_num {
    font-family: var(--font_mono);
    font-size: 23px;
    line-height: 18px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--seccolor);
}
.problem_title {
    margin-top: 20px;
    font-size: 23px;
    line-height: 23px;
    font-weight: 700;
}
.problem_text {
    margin-top: 20px;
    font-size: 18px;
    line-height: 23px;
}



/* ---------- SOLUTION ---------- */
.solution {overflow: hidden;}
.solution .sec_head {position: relative; z-index: 2;}
.solution_body {position: relative;}
.solution_img {
    position: absolute;
    right: -100px;
    top: -83px;
    width: 868px;
    pointer-events: none;
}
.solution_text {
    position: relative;
    max-width: 591px;
    padding-top: 60px;
    font-size: 20px;
    line-height: 32px;
    color: #fff;
}
.solution_fire {
    position: relative;
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: 60px;
    padding: 0 4px;
}
.solution_fire img {width: 109px;}
.solution_fire p {
    font-size: 23px;
    line-height: 28px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
}
.solution_stats {
    position: relative;
    display: flex;
    gap: 20px;
    margin-top: 60px;
}
.solution_stat {
    padding: 15px 25px;
    background-color: rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid #fff;
    box-shadow: 0 10px 30px rgba(18, 35, 54, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.solution_stat p {
    font-size: 23px;
    line-height: 28px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}
.solution_stat .solution_value {
    font-weight: 800;
    color: var(--seccolor);
}
.solution_value b {
    font-size: 32px;
    line-height: 28px;
    font-weight: 900;
    color: var(--seccolor);
}



/* ---------- ENGINEERING ---------- */
.engineering {overflow: hidden;}
.engineering .div1400 {z-index: 1;}
.engineering_body {
    position: relative;
    min-height: 600px;
}
.engineering_img {
    position: absolute;
    right: -10px;
    top: 0;
    width: 715px;
}
.engineering_info {
    position: relative;
    max-width: 505px;
    padding-top: 20px;
}

/* Нумерованный список: красная цифра + заголовок капсом + текст */
.num_list {counter-reset: num_list;}
.num_list li {
    position: relative;
    margin-bottom: 30px;
    padding-left: 30px;
    counter-increment: num_list;
}
.num_list li:last-child {margin-bottom: 0;}
.num_list li::before {
    content: counter(num_list);
    position: absolute;
    left: 0;
    top: -6px;
    width: 20px;
    font-family: var(--font_mono);
    font-size: 23px;
    line-height: 34px;
    font-weight: 700;
    text-align: center;
    color: var(--seccolor);
}
.num_list p {
    font-size: 16px;
    line-height: 20px;
    color: var(--gray);
}
.num_list .num_list_title {
    margin-bottom: 5px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--maincolor);
}

.engineering_note {
    margin: 40px 0 0 10px;
    padding: 10px 15px;
    border-left: 5px solid var(--seccolor);
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    color: var(--gray);
}

/* Мягкая полупрозрачная пульсация точки на схеме */
.pulse {
    position: absolute;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border-radius: 50%;
    pointer-events: none;
}
.pulse::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background-color: rgba(178, 24, 14, 0.35);
    animation: pulse_soft 2.6s ease-out infinite;
}
@keyframes pulse_soft {
    0% {transform: scale(0.8); opacity: 0.7;}
    100% {transform: scale(2.2); opacity: 0;}
}



/* ---------- CONSTRUCTION ---------- */
.construction_grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}
.construction_card {
    padding-bottom: 20px;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.construction_img {position: relative;}
.construction_img img {
    width: 100%;
    aspect-ratio: 232 / 230;
    object-fit: cover;
}
/* Номер элемента в круге с белой обводкой */
.construction_img span {
    position: absolute;
    left: 15px;
    bottom: -13px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 4px solid #fff;
    background-color: var(--maincolor);
    font-family: var(--font_mono);
    font-size: 18px;
    line-height: 23px;
    font-weight: 700;
    color: #fff;
}
.construction_info {padding: 23px 15px 0;}
.construction_title {
    font-size: 18px;
    line-height: 23px;
    font-weight: 700;
}
.construction_text {
    margin-top: 10px;
    font-size: 16px;
    line-height: 23px;
    color: var(--gray);
}

.construction_all {
    display: flex;
    align-items: center;
    margin-top: 20px;
    padding: 25px 25px 25px 40px;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.construction_all_title {
    flex-shrink: 0;
    width: 225px;
    margin-right: 40px;
    padding: 15px 0;
    border-right: 1px solid var(--light);
    font-size: 21px;
    line-height: 26px;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--seccolor);
}
.construction_all .dot_list {flex: 1;}
.construction_all .dot_list li {
    font-size: 18px;
    font-weight: 600;
}



/* ---------- HOW ---------- */
.how_body {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 60px;
}
.how_img {
    position: relative;
    flex-shrink: 1;
    width: 667px;
}
.how_img img {width: 100%;}
.how .num_list {
    flex-shrink: 0;
    width: 505px;
    padding-top: 102px;
}
.how .num_list li::before {
    top: -2px;
    width: 15px;
    line-height: 18px;
    letter-spacing: 0.05em;
}
.how .num_list p {color: var(--maincolor);}



/* ---------- LEVELS ---------- */
.levels_table {
    width: 100%;
    border-collapse: collapse;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.levels_table th,
.levels_table td {
    padding: 20px;
    text-align: left;
    vertical-align: middle;
    font-size: 18px;
    line-height: 22px;
}
.levels_table th {
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    background-color: var(--maincolor);
}
.levels_table th:first-child {
    width: 300px;
    font-weight: 600;
}
.levels_table th.levels_max {
    width: 209px;
    background-color: var(--seccolor);
}
.levels_table tbody tr {transition: background-color 250ms;}
.levels_table tbody tr:not(:last-child) td {border-bottom: 1px solid var(--gray);}
.levels_table tbody tr:last-child td {
    padding-bottom: 40px;
    vertical-align: top;
}
.levels_table td:first-child {font-weight: 600;}
.levels_table .levels_mass td {
    font-size: 23px;
    line-height: 28px;
    font-weight: 900;
}
.levels_table .levels_mass td:first-child {
    font-size: 18px;
    font-weight: 600;
}
.levels_table .levels_mass td.levels_max {color: var(--seccolor);}



/* ---------- SECOND WALL ---------- */
.second_wall {padding-bottom: 160px;}
.wall_grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}
.wall_card {
    padding-bottom: 20px;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.wall_img {overflow: hidden;}
.wall_img img {
    width: 100%;
    aspect-ratio: 232 / 248;
    object-fit: cover;
    transition: transform 700ms var(--ease);
}
.wall_info {padding: 10px 15px 0;}
.wall_title {
    font-size: 20px;
    line-height: 23px;
    font-weight: 700;
}
.wall_text {
    margin-top: 10px;
    font-size: 16px;
    line-height: 23px;
}

.wall_bottom {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    margin-top: 60px;
}
.wall_photo {
    position: relative;
    flex: 1;
    max-width: 960px;
    box-shadow: var(--shadow);
}
.wall_photo > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.wall_tag {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 15px 20px;
}
.wall_tag p {
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    color: #fff;
}
.wall_tag span {
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    color: #fff;
}
.wall_tag_red {
    left: 40px;
    top: 40px;
    min-width: 301px;
    background-color: var(--seccolor);
}
.wall_tag_dark {
    right: 40px;
    bottom: 40px;
    width: 243px;
    background-color: var(--maincolor);
}

.wall_side {
    flex-shrink: 0;
    width: 400px;
}
.wall_line {
    margin-bottom: 10px;
    padding: 5px 20px;
    border-left: 5px solid var(--maincolor);
}
.wall_line_red {border-color: var(--seccolor);}
.wall_line p {
    font-size: 16px;
    line-height: 20px;
}
.wall_line .wall_line_title {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
}
.wall_line_red .wall_line_title {color: var(--seccolor);}

.wall_distances {
    margin-top: 20px;
    padding: 20px 20px 10px;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.wall_distances_title {
    font-size: 18px;
    line-height: 22px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--seccolor);
}
.wall_distances_threat {
    margin: 10px 0;
    padding: 10px 0;
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.01em;
}
.wall_distances_threat b {font-weight: 700;}
.wall_distances li {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 0;
    padding: 10px 0;
    font-size: 16px;
    line-height: 20px;
}
.wall_distances li:not(:last-child) {
    margin-bottom: 10px;
    border-bottom: 1px dashed var(--light);
}
.wall_distances li span:last-child {white-space: nowrap;}



/* ---------- INDUSTRIES (табы) ---------- */
.industries {padding-bottom: 60px;}
.tabs_nav {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 40px;
}
.tabs_btn {
    height: 50px;
    padding: 0 30px;
    font-size: 21px;
    line-height: 26px;
    font-weight: 800;
    text-transform: uppercase;
    color: #fff;
    background-color: var(--maincolor);
    box-shadow: 0 0 0 3px rgba(21, 32, 42, 0.12), 0 5px 20px rgba(21, 32, 42, 0.15);
    transition: background-color 300ms, box-shadow 300ms;
}
.tabs_btn.active {
    background-color: var(--seccolor);
    box-shadow: 0 5px 20px rgba(21, 32, 42, 0.15);
    cursor: default;
}

.tabs_item {
    display: none;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.tabs_item.active {display: grid;}
.tabs_item > div {animation: tab_in 600ms var(--ease) both;}
.tabs_item > div:nth-child(2) {animation-delay: 80ms;}
.tabs_item > div:nth-child(3) {animation-delay: 160ms;}
.tabs_item > div:nth-child(4) {animation-delay: 240ms;}
@keyframes tab_in {
    0% {opacity: 0; transform: translateY(25px);}
    100% {opacity: 1; transform: none;}
}

.ind_list,
.ind_card {
    background-color: #fff;
    box-shadow: var(--shadow_dark);
}
.ind_list {padding: 20px;}
.ind_list_title {
    font-size: 18px;
    line-height: 22px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.line_list {margin-top: 20px;}
.line_list li {
    margin-bottom: 10px;
    padding: 0 8px;
    border-left: 2px solid var(--seccolor);
    font-size: 16px;
    line-height: 20px;
    color: var(--gray);
}
.line_list li:last-child {margin-bottom: 0;}
.ind_card {padding-bottom: 20px;}
.ind_img {overflow: hidden;}
.ind_img img {
    width: 100%;
    aspect-ratio: 295 / 230;
    object-fit: cover;
    transition: transform 700ms var(--ease);
}
.ind_title {
    padding: 20px 20px 0;
    font-size: 18px;
    line-height: 22px;
    font-weight: 600;
}
.ind_text {
    padding: 5px 20px 0;
    font-size: 16px;
    line-height: 20px;
    color: var(--gray);
}



/* ---------- BENEFITS (преимущества) ---------- */
.benefits {padding-top: 60px;}
.benefits .sec_head_left,
.docs .sec_head_left {max-width: none;}
.benefit_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.benefit_card {
    min-height: 275px;
    padding: 20px;
    background-color: #fff;
    box-shadow: var(--shadow_dark);
    transition: transform 350ms var(--ease), box-shadow 350ms ease-out, opacity 800ms ease;
}
.benefit_icon {
    width: auto;
    height: 65px;
}
.benefit_title {
    margin-top: 30px;
    font-size: 23px;
    line-height: 28px;
    font-weight: 700;
}
.benefit_text {
    margin-top: 10px;
    font-size: 18px;
    line-height: 22px;
}



/* ---------- PROJECTS (слайдер) ---------- */
.slider {position: relative;}
.slider_viewport {
    position: relative;
    width: 100%;
    aspect-ratio: 1240 / 600;
    max-height: 680px;
    overflow: hidden;
    background-color: var(--dark);
    touch-action: pan-y;
}
.slider_slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 900ms ease;
}
.slider_slide.active {
    z-index: 1;
    opacity: 1;
}
.slider_slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.08);
    transition: transform 7000ms linear;
}
.slider_slide.active img {transform: scale(1);}

.slider_progress {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    width: 100%;
    height: 4px;
    background-color: rgba(255, 255, 255, 0.2);
}
.slider_progress span {
    display: block;
    width: 0;
    height: 100%;
    background-color: var(--seccolor);
}

.slider_bottom {
    display: flex;
    align-items: center;
    gap: 40px;
    margin-top: 20px;
}
.slider_caption {
    flex: 1;
    min-height: 50px;
    padding: 4px 0 4px 15px;
    border-left: 3px solid var(--seccolor);
    transition: opacity 300ms, transform 300ms;
}
.slider_caption.hide {
    opacity: 0;
    transform: translateX(-15px);
}
.slider_title {
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}
.slider_text {
    font-size: 16px;
    line-height: 20px;
    color: #fff;
}
.slider_arrows {
    display: flex;
    gap: 42px;
}
.slider_arrow {
    width: 50px;
    height: 50px;
    background: var(--seccolor) url(../img/site/arrow.svg) 54% center / 18px auto no-repeat;
    transition: background-color 300ms, transform 300ms var(--ease);
    -webkit-tap-highlight-color: transparent;
}
.slider_prev {transform: scaleX(-1);}



/* ---------- PRODUCTION ---------- */
.prod_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.prod_card {box-shadow: var(--shadow_dark);}
.prod_img {overflow: hidden;}
.prod_img img {
    width: 100%;
    aspect-ratio: 400 / 420;
    object-fit: cover;
    transition: transform 900ms var(--ease);
}
.prod_info {padding: 20px 20px 30px;}
.prod_type {
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--seccolor);
}
.prod_title {
    margin-top: 10px;
    font-size: 23px;
    line-height: 28px;
    font-weight: 700;
}
.prod_text {
    margin-top: 10px;
    font-size: 16px;
    line-height: 20px;
    color: var(--gray);
}



/* ---------- STEPS ---------- */
.steps {overflow: hidden;}
/* Башня прижата к правому краю экрана; запас по высоте — под смещение параллакса */
.steps_tower {
    position: absolute;
    right: 0;
    top: -60px;
    height: calc(100% + 120px);
    aspect-ratio: 1179 / 1102;
    background: url(../img/site/steps_full.svg) right top / 100% 100% no-repeat;
    pointer-events: none;
}
@media screen and (max-width: 1400px) {
    .steps_tower {translate: 30% 0;}
}
.steps_list {
    position: relative;
    max-width: 715px;
}
.steps_list li {
    display: flex;
    align-items: center;
    gap: 30px;
    min-height: 81px;
    margin-bottom: 10px;
    padding: 10px 20px;
    background-color: rgba(244, 243, 239, 0.7);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: background-color 300ms, box-shadow 300ms, opacity 800ms ease, transform 800ms var(--ease);
}
.steps_list li:last-child {margin-bottom: 0;}
.steps_num {
    flex-shrink: 0;
    width: 31px;
    font-family: var(--font_mono);
    font-size: 25px;
    line-height: 37px;
    font-weight: 700;
    color: var(--seccolor);
}
.steps_info {flex: 1;}
.steps_title {
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
}
.steps_text {
    margin-top: 5px;
    font-size: 14px;
    line-height: 17px;
    color: var(--gray);
}
.steps_term {
    flex-shrink: 0;
    font-size: 14px;
    line-height: 17px;
    font-weight: 700;
    color: var(--seccolor);
    white-space: nowrap;
}



/* ---------- DOCS ---------- */
.docs_body {
    display: flex;
    justify-content: space-between;
    gap: 40px;
}
.docs_left {
    flex-shrink: 0;
    width: 400px;
}
.docs_big {
    display: flex;
    align-items: baseline;
    font-size: 146px;
    line-height: 146px;
    font-weight: 800;
    color: var(--seccolor);
}
.docs_big small {
    margin-right: 15px;
    font-size: 68px;
    font-weight: 800;
    color: var(--seccolor);
}
.docs_big b {
    font-weight: 800;
    color: var(--seccolor);
}
.docs_lead {
    margin-top: 20px;
    font-size: 23px;
    line-height: 32px;
    font-weight: 500;
}
.docs_text {
    margin-top: 20px;
    font-size: 18px;
    line-height: 23px;
    font-weight: 500;
    color: var(--gray);
}

.docs_right {
    flex: 1;
    max-width: 800px;
}
.docs_list_title {
    padding: 20px 0;
    font-size: 18px;
    line-height: 22px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray);
}
.docs_list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 20px 0;
    border-bottom: 1px solid var(--gray);
    transition: padding 300ms var(--ease), opacity 800ms ease, transform 800ms var(--ease);
}
.docs_list li:last-child {border-bottom: none;}
.docs_list span {
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
}
.docs_list b {
    font-size: 18px;
    line-height: 22px;
    font-weight: 800;
    color: var(--seccolor);
}



/* ---------- FAQ ---------- */
.faq {padding-bottom: 160px;}
.faq_list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.faq_item {
    background-color: #fff;
    box-shadow: var(--shadow_dark);
}
.faq_question {
    position: relative;
    display: block;
    width: 100%;
    padding: 20px 87px 20px 30px;
    text-align: left;
    font-size: 20px;
    line-height: 27px;
    font-weight: 600;
    transition: color 250ms;
}
/* Плюс из двух линий: вертикальная сжимается и прячется за горизонтальной */
.faq_question::before,
.faq_question::after {
    content: '';
    position: absolute;
    right: 30px;
    top: 50%;
    width: 27px;
    height: 3px;
    margin-top: -1.5px;
    background-color: var(--seccolor);
}
.faq_question::after {
    right: 42px;
    width: 3px;
    height: 27px;
    margin-top: -13.5px;
    transition: transform 350ms var(--ease);
}
.faq_item.open .faq_question::after {transform: scaleY(0);}
.faq_answer {display: none;}
.faq_item.open .faq_answer {display: block;}
.faq_answer p {
    max-width: 1160px;
    padding: 10px 30px 40px;
    font-size: 20px;
    line-height: 24px;
}



/* ---------- PARTNERS ROW ---------- */
.partners_row {padding: 30px 0 38px;}
.partners_row .sec_label {margin-bottom: 20px;}
.partners_row_list {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    align-items: center;
    gap: 50px;
    padding: 0 40px;
}
.partners_row_list div {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 106px;
}
.partners_row_list img {
    max-width: min(152px, 100%);
    max-height: 106px;
}



/* ---------- QUIZ BLOCK ---------- */
.quiz_block_body {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px;
}
.quiz_block_info {
    max-width: 534px;
    padding-top: 11px;
}
.quiz_block_text {
    max-width: 505px;
    font-size: 20px;
    line-height: 32px;
    color: #fff;
}
.quiz_block_contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.quiz_block_phone {
    margin: 30px 0 29px;
    font-size: 40px;
    line-height: 49px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}
.quiz_block_link {
    position: relative;
    margin-bottom: 30px;
    font-size: 23px;
    line-height: 28px;
    font-weight: 600;
    color: #fff;
    text-decoration: underline;
    text-decoration-color: var(--seccolor);
    text-decoration-thickness: 2px;
    text-underline-offset: 5px;
    transition: text-decoration-color 250ms, color 250ms;
}
.quiz_block_link:last-child {margin-bottom: 0;}
.quiz_block_form {
    flex-shrink: 0;
    width: 666px;
    padding: 40px;
    background-color: #fff;
}

/* Подсказка «адрес скопирован» у mailto-ссылок */
a span.alert {
    position: absolute;
    left: 0;
    top: 130%;
    z-index: 10;
    width: 230px;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
    color: var(--maincolor);
    background-color: #fff;
    border-left: 3px solid var(--seccolor);
    box-shadow: 0 4px 23px rgba(0, 0, 0, 0.2);
    animation: tab_in 300ms both;
}



/* ---------- КВИЗ-ФОРМА ---------- */
.quiz input.company {display: none;}
.quiz_progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.quiz_progress span {
    position: relative;
    height: 4px;
    background-color: var(--light);
    overflow: hidden;
}
.quiz_progress span::after {
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--seccolor);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 500ms var(--ease);
}
.quiz_progress span.active::after {transform: scaleX(1);}

.quiz_step {display: none;}
.quiz_step.active {
    display: block;
    animation: tab_in 500ms var(--ease) both;
}
.quiz_question {
    margin: 20px 0;
    font-size: 20px;
    line-height: 32px;
    font-weight: 700;
    color: #000;
}

.quiz_options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.quiz_option {cursor: pointer;}
.quiz_option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.quiz_option span {
    display: block;
    padding: 10px 25px;
    border: 1px solid var(--light);
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    color: #000;
    transition: border-color 250ms, background-color 250ms, color 250ms;
}
.quiz_option input:checked + span {
    border-color: var(--seccolor);
    background-color: var(--seccolor);
    color: #fff;
}

.quiz_fields {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
}
.quiz_field_wide {grid-column: span 2;}
/* Два поля в одной строке под общей подписью (габариты + высота) */
.quiz_inputs {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 15px;
}
.quiz_field {
    display: block;
    margin-bottom: 14px;
}
.quiz_label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
    line-height: 16px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--gray);
}
.quiz_label i {
    font-style: normal;
    color: var(--seccolor);
}
.quiz input,
.quiz textarea {
    width: 100%;
    padding: 10px 16px;
    border: 1px solid var(--light);
    border-radius: 0;
    background-color: #fff;
    font-size: 16px;
    line-height: 20px;
    color: var(--maincolor);
    transition: border-color 250ms, box-shadow 250ms;
}
.quiz input::placeholder,
.quiz textarea::placeholder {color: #8995A3;}
.quiz input:focus,
.quiz textarea:focus {
    border-color: var(--maincolor);
    box-shadow: 0 0 0 3px rgba(21, 32, 42, 0.08);
}
.quiz input.error {
    border-color: var(--seccolor);
    box-shadow: 0 0 0 3px rgba(178, 24, 14, 0.15);
    animation: shake 400ms;
}
@keyframes shake {
    0%, 100% {transform: translateX(0);}
    25% {transform: translateX(-6px);}
    75% {transform: translateX(6px);}
}
.quiz textarea {
    height: 90px;
    resize: none;
}

.quiz .politika {
    font-size: 13px;
    line-height: 17px;
    color: var(--gray);
}
.quiz .politika a {
    color: var(--gray);
    text-decoration: underline;
}

.quiz_nav {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}
.quiz_nav .btn {
    height: 42px;
    padding: 0 30px;
    font-size: 18px;
    font-weight: 600;
}
.quiz_nav .btn_red {box-shadow: 0 0 0 3px rgba(178, 24, 14, 0.2);}
.quiz_nav .btn_dark {
    background-color: var(--maincolor);
    box-shadow: 0 0 0 3px rgba(21, 32, 42, 0.2);
    color: #fff;
}
.quiz_prev,
.quiz_submit {display: none;}
.quiz_simple .quiz_submit {display: inline-flex;}
.quiz_simple .politika {margin-top: 6px;}

/* Ответ после отправки формы */
.lead_success {
    padding: 30px 0 10px 20px;
    border-left: 4px solid var(--seccolor);
    animation: tab_in 500ms var(--ease) both;
}
.lead_success p {
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
}
.lead_error {
    margin-top: 15px;
    padding: 10px 14px;
    border-left: 3px solid var(--seccolor);
    background-color: rgba(178, 24, 14, 0.06);
    font-size: 14px;
    line-height: 19px;
}
.lead_error a {
    font-weight: 700;
    color: var(--seccolor);
    white-space: nowrap;
}
.lead_form.sending .quiz_submit {opacity: 0.6; cursor: wait;}
.quiz_counter {
    padding: 0 30px;
    font-size: 18px;
    line-height: 22px;
    color: var(--light);
}
.quiz_counter b {
    font-weight: 400;
    color: var(--light);
}

@media (hover: hover) and (min-width: 769px) {
    .quiz_option:hover span {border-color: var(--maincolor);}
    .quiz_option input:checked + span {border-color: var(--seccolor);}
    .quiz .politika a:hover {color: var(--seccolor);}
}



/* ---------- FOOTER ---------- */
footer {
    padding: 30px 0 calc(135px + var(--cookies_h, 0px));
    background-color: var(--darkest);
}
.footer_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}
.footer_logo img {width: 237px;}
.footer_text {
    max-width: 408px;
    font-size: 14px;
    line-height: 17px;
    color: var(--light);
}
.footer_right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}
.copyright,
.developer {
    font-size: 12px;
    line-height: 14px;
    font-weight: 300;
    color: var(--light);
}
.copyright span {color: inherit;}
.developer a {
    color: var(--light);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 250ms;
}



/* ---------- ФИКСИРОВАННЫЕ КНОПКИ ---------- */
.fixed_buttons {
    position: fixed;
    right: max(20px, calc((100% - 1400px) / 2));
    bottom: calc(33px + var(--cookies_h, 0px));
    z-index: 90;
    transition: bottom 400ms var(--ease);
    display: flex;
    gap: 10px;
}
.btn_max {
    height: 32px;
    padding: 0 20px 1px;
    gap: 5px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background-color: var(--maincolor);
    box-shadow: 0 0 0 3px rgba(21, 32, 42, 0.32), 0 8px 24px rgba(0, 0, 0, 0.25);
}
.btn_max img {width: 16px;}
/* Периодический блик по кнопке МАКС */
.btn_max::after {
    content: '';
    position: absolute;
    top: 0;
    left: -60%;
    width: 40%;
    height: 100%;
    background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-20deg);
    pointer-events: none;
    animation: max_shine 4s ease-in-out infinite;
}
@keyframes max_shine {
    0% {left: -60%;}
    25%, 100% {left: 140%;}
}



/* ---------- КНОПКА «НАВЕРХ» ---------- */
/* Квадрат 32×32 над кнопкой МАКС, при наведении раскрывается влево с надписью */
.up_button {
    position: fixed;
    right: max(20px, calc((100% - 1400px) / 2));
    bottom: calc(85px + var(--cookies_h, 0px));
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    max-width: 32px;
    height: 32px;
    padding: 0 8px 0 0;
    overflow: hidden;
    background-color: var(--seccolor);
    box-shadow: 0 0 0 3px rgba(178, 24, 14, 0.32);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity 400ms ease, transform 400ms var(--ease), visibility 400ms, max-width 400ms var(--ease), bottom 400ms var(--ease), background-color 300ms;
}
.up_button.show {
    opacity: 1;
    visibility: visible;
    transform: none;
}
.up_button span {
    padding-left: 14px;
    font-size: 14px;
    line-height: 17px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 300ms;
}
.up_button svg {flex-shrink: 0;}

@media (hover: hover) and (min-width: 769px) {
    .up_button:hover {
        max-width: 140px;
        background-color: var(--seccolor_hover);
    }
    .up_button:hover span {opacity: 1;}
}



/* ---------- ПЛАШКА COOKIES ---------- */
.cookies {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 95;
    width: 100%;
    padding: 20px 0;
    background-color: #fff;
    border-top: 3px solid var(--seccolor);
    box-shadow: 0 -10px 30px rgba(21, 32, 42, 0.15);
    transform: translateY(110%);
    transition: transform 500ms var(--ease);
}
.cookies.show {transform: none;}
/* Сетка: два блока текста слева, кнопка справа на две строки */
.cookies_inner {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 2px 40px;
}
.cookies_btn {
    grid-column: 2;
    grid-row: 1 / span 2;
}
.cookies_text {
    max-width: 1020px;
    font-size: 14px;
    line-height: 20px;
}
.cookies_text a {
    font-weight: 700;
    color: var(--seccolor);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 250ms;
}
.cookies_btn {
    flex-shrink: 0;
    height: 40px;
    padding: 0 30px;
}



/* ---------- СТРАНИЦЫ ДОКУМЕНТОВ (policy, agreement) ---------- */
.legal {
    min-height: 100vh;
    padding: calc(var(--header_h) + 60px) 0 100px;
}
.legal_head {margin-bottom: 40px;}
.legal_head .sec_title {max-width: 900px;}
.legal_date {
    margin-top: 15px;
    font-size: 16px;
    line-height: 21px;
    color: var(--gray);
}
.legal_card {
    max-width: 960px;
    padding: 50px 60px;
    background-color: #fff;
    box-shadow: var(--shadow);
}
.legal_block + .legal_block {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid var(--light);
}
.legal_card h2 {
    margin-bottom: 20px;
    font-size: 23px;
    line-height: 28px;
    font-weight: 800;
    text-transform: uppercase;
}
.legal_card h3 {
    margin: 25px 0 10px;
    padding-left: 15px;
    border-left: 3px solid var(--seccolor);
    font-size: 18px;
    line-height: 22px;
    font-weight: 700;
}
.legal_card p,
.legal_card li,
.legal_details dd {
    font-size: 16px;
    line-height: 25px;
    color: var(--gray);
}
.legal_card p + p {margin-top: 12px;}
.legal_card a:not(.btn) {
    color: var(--seccolor);
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color 250ms;
}

/* Маркированный список с красными точками */
.legal_list li {
    position: relative;
    margin-bottom: 10px;
    padding-left: 25px;
}
.legal_list li:last-child {margin-bottom: 0;}
.legal_list li::before {
    content: '';
    position: absolute;
    left: 3px;
    top: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--seccolor);
}
.legal_card p + .legal_list {margin-top: 12px;}

/* Реквизиты оператора: «название — значение» */
.legal_details {
    display: grid;
    grid-template-columns: 220px 1fr;
}
.legal_details dt,
.legal_details dd {
    padding: 12px 0;
    border-bottom: 1px dashed var(--light);
}
.legal_details dt {
    font-size: 16px;
    line-height: 25px;
    font-weight: 700;
}
.legal_details dt:last-of-type,
.legal_details dd:last-of-type {border-bottom: none;}

.legal_card .legal_notice {
    margin-top: 25px;
    padding: 15px 20px;
    border-left: 5px solid var(--seccolor);
    background-color: var(--bg_light);
    color: var(--maincolor);
}

.legal_nav {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 50px;
}
.legal_nav .btn {
    height: 44px;
    padding: 0 30px;
    font-size: 16px;
    white-space: normal;
    text-align: center;
}



/* ---------- HOVER-ЭФФЕКТЫ КАРТОЧЕК (только десктоп) ---------- */
@media (hover: hover) and (min-width: 769px) {
    .utp_card:hover,
    .benefit_card:hover {
        transform: translateY(-6px);
        box-shadow: 0 14px 34px rgba(21, 32, 42, 0.14);
    }

    .threat_card:hover {
        background-color: rgba(255, 255, 255, 0.18);
        transform: translateY(-6px);
    }

    .objects_card:hover .objects_img,
    .wall_card:hover .wall_img img,
    .ind_card:hover .ind_img img,
    .prod_card:hover .prod_img img {transform: scale(1.06);}

    .problem_card:hover {
        background-color: #fff;
        box-shadow: var(--shadow);
    }

    .levels_table tbody tr:hover {background-color: var(--bg_light);}

    .tabs_btn:not(.active):hover {background-color: #232C36;}

    .slider_arrow:hover {background-color: var(--seccolor_hover);}
    .slider_next:hover {transform: translateX(4px);}
    .slider_prev:hover {transform: scaleX(-1) translateX(4px);}

    .steps_list li:hover {
        background-color: #fff;
        box-shadow: var(--shadow);
    }

    .docs_list li:hover {padding-left: 12px;}
    .docs_list li:hover span {color: var(--seccolor);}

    .faq_question:hover {color: var(--seccolor);}

    .quiz_block_phone:hover {color: var(--light);}
    .quiz_block_link:hover {
        color: var(--light);
        text-decoration-color: #fff;
    }
    .developer a:hover {color: #fff;}
    .legal_card a:not(.btn):hover {color: var(--seccolor_hover);}
    .cookies_text a:hover {color: var(--seccolor_hover);}
}



/* ---------- ПОЯВЛЕНИЕ ПРИ СКРОЛЛЕ ---------- */
/* Класс .js ставится на <html> скриптом — без JS контент виден сразу */
.js [data-anim] {
    opacity: 0;
    transition: opacity 800ms ease, transform 800ms var(--ease);
    transition-delay: var(--delay, 0ms);
}
.js [data-anim="up"] {transform: translateY(40px);}
.js [data-anim="left"] {transform: translateX(-40px);}
.js [data-anim="right"] {transform: translateX(40px);}
.js [data-anim="zoom"] {transform: scale(0.94);}
.js [data-anim].visible {
    opacity: 1;
    transform: none;
}
.js .sec_label:not(.visible)::before {width: 0;}

@media (prefers-reduced-motion: reduce) {
    .js .sec_label::before {width: 28px !important;}
    .js [data-anim] {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .hero_line > span {transform: none;}
    .threat_drone, .btn_max::after, .pulse::before {animation: none;}
}



/* ---------- MOBILE SHOW / HIDE ---------- */
.ms {display: none !important;}