.header-xs {
    display: none;
}

.header-s {
    display: none;
}

.header-m {
    display: none;
}

.header-l {
    display: none;
}

.header-xl {
    display: none;
}

.header-xxl {
    display: none;
}


@media (max-width: 767px) {

    /* H0 */
    h0 {
        /* Mobile/H0 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 46px;
        line-height: 100%;
        letter-spacing: -0.07em;
        text-transform: uppercase;
    }


    h1 {
        /* Mobile/H1 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 48px;
        line-height: 100%;
        /* identical to box height, or 48px */
        letter-spacing: -0.08em;
        text-transform: uppercase;
    }

    h6 {
        /* Mobile/H6 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 100%;
        /* identical to box height, or 14px */
        letter-spacing: -0.04em;
    }

    h2 {
        /* Mobile/H2 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 28px;
        line-height: 110%;
        /* identical to box height, or 31px */
        letter-spacing: -0.04em;
    }

    h3 {

        /* Mobile/H3 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 24px;
        line-height: 100%;
        /* identical to box height, or 24px */
        letter-spacing: -0.06em;
    }

    h4 {
        /* Mobile/H4 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 22px;
        line-height: 105%;
        /* identical to box height, or 23px */
        letter-spacing: -0.04em;
    }

    .text {

        /* Mobile/Text */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 120%;
        /* or 19px */
        letter-spacing: -0.02em;

    }

    .small-text {
        /* Mobile/Small Text */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 120%;
        /* identical to box height, or 17px */
        letter-spacing: -0.02em;

    }

    .caption {

        /* Mobile/Caption */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 42px;
        line-height: 95%;
        /* identical to box height, or 40px */
        letter-spacing: -0.09em;

    }
    .feature-box {
        height:100%;
    }

    .all-solutions-btn {
        width:60%;
    }
    .solutions-h1 {
        margin-bottom:28px;
    }

    .solutions-count {
        font-size:32px;
        top:6%;
    }
    /*#solutions {*/
    /*    padding-top:0!important;*/
    /*    padding-bottom:0!important;*/
    /*}*/
}

/*@media (min-width: 768px) and (max-width: 1023px) {
    .header-s {
        display: block;
    }

    .logos img {
        width: 230px;
        height: 186px;
        margin-right: 16px;
        margin-bottom: 16px;

    }

    .header {
        margin-top: 0;
    }

    .header .block-btn {
        padding-bottom: 105px;
    }
    .header .block-btn h4 {
        margin: 20px 0 44px 0;
    }

    .all-solutions-btn {
        width:44%;
    }

    .solutions-count {
        font-size: 32px;
        top:9%;
    }

}*/


@media (max-width: 1024px){
    .solutions-h1 {
        font-size:100px;
    }
    .solutions-count {
       font-size: 36px;
        top:9%;
    }
}
@media (max-width: 768px) {
    .solutions-count {
        font-size: 32px;
        top:18%;
    }
}

/*@media (min-width: 1024px) and (max-width: 1279px) {*/
/*    .header-m {*/
/*        display: block;*/
/*    }*/

/*    .logos img {*/
/*        width: 150px;*/
/*        height: 120px;*/
/*        margin-right: 16px;*/
/*    }*/
/*    .header .block-btn {*/
/*        padding-bottom: 76px;*/
/*    }*/
/*}*/



@media (min-width: 1280px) and (max-width: 1599px) {
    .header-l {
        display: block;
    }

    .logos img {
        width: 190px;
        height: 150px;
        margin-right: 16px;
    }

}

@media (min-width: 1600px) and (max-width: 1919px) {
    .header-xl {
        display: block;
    }

    .logos img {
        width: 246px;
        height: 200px;
        margin-right: 16px;
    }
    .feature-box {
        height:100%;
    }
}

@media (min-width: 1920px) {
    .header-xxl {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {


    h0 {
        /* Small_Tablet/H0 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 96px;
        line-height: 84%;
        letter-spacing: -0.07em;
        text-transform: uppercase;

    }



    h2 {

        /* Small_Tablet/H2 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 40px;
        line-height: 110%;
        /* identical to box height, or 44px */
        letter-spacing: -0.04em;
    }



    h3 {

        /* Small_Tablet/H3 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 32px;
        line-height: 100%;
        /* identical to box height, or 32px */
        letter-spacing: -0.06em;

    }



    h4 {

        /* Small_Tablet/H4 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 24px;
        line-height: 105%;
        /* or 25px */
        letter-spacing: -0.04em;

    }



    .caption {

        /* Small_Tablet/Caption */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 56px;
        line-height: 95%;
        /* or 53px */
        letter-spacing: -0.09em;

    }


}

@media (min-width: 1024px) and (max-width: 1600px) {
    h0 {

        /* Tablet/H0 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 162px;
        line-height: 84%;

        letter-spacing: -0.07em;
        text-transform: uppercase;
    }



    h1 {

        /* Tablet/H1 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 100px;
        line-height: 100%;
        /* identical to box height, or 100px */
        letter-spacing: -0.08em;
        text-transform: uppercase;
    }



    h2 {

        /* Tablet/H2 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 56px;
        line-height: 110%;
        /* identical to box height, or 62px */
        letter-spacing: -0.04em;

    }



    h3 {

        /* Tablet/H3 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 36px;
        line-height: 100%;
        /* identical to box height, or 36px */
        letter-spacing: -0.06em;

    }



    h4 {

        /* Tablet/H4 */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 500;
        font-size: 28px;
        line-height: 105%;
        /* or 29px */
        letter-spacing: -0.04em;

    }


    .caption {

        /* Tablet/Caption */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 60px;
        line-height: 95%;
        /* identical to box height, or 57px */
        letter-spacing: -0.09em;
    }


    .text {
        /* Tablet/Text */
        font-family: 'Inter';
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        line-height: 120%;
        /* identical to box height, or 22px */
        letter-spacing: -0.02em;

    }


}


@media (max-width: 1600px) {
    .header .block-btn {
        padding-bottom: 105px;
    }
    .decor-first {
        height:80px;
    }
    .decor-two {
        width: 58px;
        height: 58px;
    }
    .decor-third {
        height:80px;
    }
    .about-section-text {
        padding-top: 36px;
        padding-bottom:36px;
    }
    #products h2 {
        padding-bottom: 48px;
    }
    #products .logos {
        margin-bottom: 48px;
    }
    #contact .sendFormBtn {
        margin-top: 36px;
    }

}
@media (max-width: 1280px) {

    .decor-first {
        height:48px;
    }
    .decor-two {
        width: 58px;
        height: 58px;
    }
    .decor-third {
        height:48px;
    }
    .header .block-btn {
        padding-bottom: 96px;
    }
    .header .block-btn h4 {
        margin: 14px 0 36px 0;
    }
    #about-us {
        padding: 120px 0 120px 0;
    }
    .subtitle {
        padding: 0 0 14px 0;
    }
    .about-section-text {
        padding-top: 28px;
        padding-bottom: 28px;
    }
    .feature-box {
        height: 195px;
    }
    #products .subtitle {
        padding-top: 98px;
    }
    #products {
        padding: 0 0 97px 0;
    }
    #products .logos {
        margin-bottom: 64px;
    }
    #solutions {
        padding: 120px 0 0 0;
    }
    #solutions h2 {
        padding-bottom: 28px;
    }
    #analytics_expertise {
        padding: 120px 0px 122px 0px;
    }
    #contact .subtitle {
        padding-top: 116px;
    }
    #contact h2 {
        padding-bottom: 28px;
    }
    #contact .sendFormBtn {
        margin-top: 38px;
    }
    #contact {
        padding-bottom: 116px;
    }
    .navbar .nav-item:hover .nav-link {
        color:var(--color-white);
    }
    #menu-mobile-dropdown .dropdown-menu.show >a {
        color:var(--color-black);
    }

    .solutions-count {
        font-size:36px;
        margin-top: 17px;
    }

}
@media (max-width: 1399px) {
    /* Порог поднят с 1199 до 1399 вместе со сменой Bootstrap-брейкпоинта
       хедера (navbar-expand-xl → navbar-expand-xxl, nav.blade.php) — иначе
       в диапазоне 1200-1399px мобильное меню показывалось бы (см. причину
       смены брейкпоинта ниже), но без этих стилей паддингов/кнопки.
       .nav-right/.flex-v-just (style.css) уже задают position/размеры/фон/flex-direction
       для #navbarNav — но Bootstrap-правило .collapse.show{display:block} специфичнее
       .flex-v-just{display:flex} (2 класса против 1), поэтому нужен явный оверрайд
       именно display, иначе открытая панель схлопывается в display:block. */
    #navbarNav.show {
        display: flex;
        overflow-y: auto;
    }
    .menu-mobile-dropdown-block {
        padding: 28px 8px 0 0px;
        margin: 0px 0px 0px 8px;
    }
    .nav-link {
        padding: 14px 0px 14px 8px;
    }
    .nav-link.dropdown-toggle.show {
        padding: 6px 6px 6px 6px;
        margin-top: 12px;
        margin-right: 8px;
    }
    #menu-mobile-dropdown .dropdown-menu.show >a:hover {
        color: var(--color-black);
        background-color: var(--color-highlight);
    }
    .get-consultation {
       margin-bottom: 30px;
    }
    .get-consultation .btn {
       width: 100%;
    }
}
@media (max-width: 1024px) {
    .decor-first {
        height:40px;
    }
    .decor-two {
        width: 58px;
        height: 58px;
    }
    .decor-third {
        height:40px;
    }
    .header .block-btn h4 {
        margin: 14px 0 16px 0;
    }
    .header .block-btn {
        padding-bottom: 76px;
    }
    #about-us {
        padding: 100px 0 100px 0;
    }
    .feature-box {
        height: 226px;
    }
    #products .subtitle {
        padding-top: 56px;
    }
    #products h2 {
        padding-bottom: 28px;
    }
    #products .logos {
        margin-bottom: 28px;
    }
    #products {
        padding: 0 0 50px 0;
    }
    #solutions {
        padding: 100px 0 0 0;
    }
    #analytics_expertise {
        padding: 100px 0 102px 0;
    }
    #analytics_expertise .title {
        padding: 0 0 28px 0;
    }
    #contact .subtitle {
        padding-top: 100px;
    }
    #contact .txt-agreement {
        padding-top: 16px;
    }
    #contact .sendFormBtn {
        margin-top: 18px;
    }
    #contact {
        padding-bottom: 100px;
    }
    .solutions-count {
        margin-top: 0px;
    }
    #main-page-community-block a {
        width:30%;
    }

}
@media (max-width: 768px) {

    /* Базовые .nav-right{width:45vw} (style.css) в диапазоне ~501-767px дают
       270-345px — уже теснее самого длинного пункта мобильного подменю
       "■ ARACHNID.Anomaly Detection" (~260px с маркером, без учёта паддингов
       .dropdown-menu/.nav-link) и переносится на 2 строки, наезжая на
       следующий пункт списка (второй строке текста некуда деться — соседние
       <a> идут одна под одной без доп. высоты под перенос). Раньше это не
       было заметно, т.к. бургер-меню открывалось только до 1199px и на этих
       промежуточных ширинах фактически не тестировалось. Явный px вместо vw
       — как и в override'ах на 500px/390px ниже. */
    .nav-right {
        width: 320px;
    }

    .mobile-decor {
        display:block;
    }
    .decor-first {
        height:124px;
    }
    .decor-two {
        width: 58px;
        height: 58px;
        margin: 12px 0 12px 0;
    }
    .decor-third {
        height:124px;
    }
    #about-us {
        padding: 99px 0 100px 0;
    }
    .header .block-btn h4 {
        margin: 20px 0 44px 0;
    }
    .header .block-btn {
        padding-bottom: 105px;
    }
    .logos img {
        margin-bottom: 16px;
    }

    .description-accordion {
        margin: 0 0 0 -6px;
    }
    .solutions-count {
        font-size:32px;
        letter-spacing: -1.92px;
    }

    #main-page-community-block img {
        width:70%;
    }

}
@media (max-width: 700px) {
    .header-xs {
        display:block;
    }
    #main-page-community-block img {
        width:100%;
    }
}

@media (max-width: 599px) {
    .header-xs {
        display:block;
    }
    .solutions-h1 {
       font-size:48px;
    }
    .solutions-count {
        font-size:24px;
    }
    .decor-first {
        height:110px;
    }
    .decor-third {
        height:110px;
    }
    .header .block-btn h4 {
        margin: 20px 0 32px 0;
    }
    .header .block-btn {
        padding-bottom: 97px;
    }
    #main-page-community-block a {
        width:50%;
    }
}
@media (max-width: 500px) {
    .nav-right {
        width: 70vw;
        height: 90vh;
    }
    .header-xs {
        padding: 36px 0 20px 0;
    }
    #about-us {
        padding: 80px 0 80px 0;
    }
    .block-btn a {
        margin-bottom:16px;
    }
    .accordion-button .subtitle-num {
        padding: 0 0 14px 12px;
    }
    #analyticsAccordion .accordion-body .row {
        flex-direction: row-reverse;
    }
    #analyticsAccordion .accordion-body .col-img {
        order: 2 !important;
    }
    #analyticsAccordion .accordion-body .text {
        padding: 16px 0px 16px 2px;
    }
    .modal-header .btn-close {
        margin: -19px 0px 10px 58px;
    }
    .modal-title {
        font-size: 22px;
    }
    .nav-right {
        width: 89%;
        margin: 0 20px 0 0;
    }

    .get-consultation .btn {
        width: 100%;
        justify-content: space-around;
        display: flex;
        margin-bottom:30px;
    }

    .description-accordion {
        margin: 0 0 0 11px;
    }
    .solutions-count {
        font-size:24px;
        margin-top: 0px;
        letter-spacing: -1.44px;
    }

}
@media (max-width: 390px) {

    #about-us {
        padding: 80px 0px 80px 0px;
    }
    #products .subtitle {
        padding-top: 80px;
    }
    .nav-right {
        width: 89%;
        margin: 0 20px 0 0;
    }
    .modal-header .btn-close {
        margin: -10px 0px 10px 37px;
    }

    #orderSuccess .btn-close {
        right: 13px;
        top: 20px;
    }
    .logos img {
        margin-left: 23px;
        margin-right: 23px;
        width: 80%;
    }
    .modal-title {
        font-size: 18px;
    }
}
@media (max-width: 375px) {

    /*.solutions-h1 {*/
    /*    margin-bottom:28px;*/
    /*}*/
    /*.solutions-count {*/
    /*    font-size:24px;*/
    /*}*/

    .subtitle {
        margin-top: 0px;
    }

    .all-solutions-btn {
        width:80%;
    }
}
@media (max-width: 320px) {

    .header-xs svg {
        width:305px;
    }
    #main-page-community-block a {
        width:100%;
    }

}
/*
@media (max-width: 600px) {
    h2 {
        font-size:12px!important;
    }
    h3 {
        font-size:12px!important;
    }

    .about-section-text {
        font-size:12px;
    }
}*/