@font-face {
    font-family: 'PP Pangram Sans';
    src: local('PP Pangram Sans Medium'), local('PPPangramSans-Medium'),
    url('../fonts/PPPangramSans-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Pangram Sans';
    src: local('PP Pangram Sans Light'), local('PPPangramSans-Light'),
    url('../fonts/PPPangramSans-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Pangram Sans';
    src: local('PP Pangram Sans Semibold'), local('PPPangramSans-Semibold'),
    url('../fonts/PPPangramSans-Semibold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Pangram Sans';
    src: local('PP Pangram Sans Bold'), local('PPPangramSans-Bold'),
    url('../fonts/PPPangramSans-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

::-webkit-scrollbar {
    width: 2px;
    height: 2px;
}

::-webkit-scrollbar-track {
    background: #2A2A2A;
    border-radius: 0;
}

::-webkit-scrollbar-thumb {
    background: var(--color-orange);
    border-radius: 10px;
    min-height: 40px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-orange);
}


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

ul[class],
ol[class] {
    padding: 0;
}

body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
    margin: 0;
}


ul[class],
ol[class] {
    list-style: none;
}

a {
    text-decoration: none;
    color: var(--color-orange);
    transition: all ease .3s;
}

img {
    max-width: 100%;
    display: block;
}



input,
button,
textarea,
select {
    font: inherit;
    transition: all ease .3s;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

html,
body {
    margin: 0;
    padding: 0;
}


body {
    color: var(--color-black);
    
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: -0.16px;
    font-family: "PP Pangram Sans", sans-serif;
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    -webkit-text-size-adjust: 100%;

    min-height: 100vh;
    overflow-x: hidden;
}

body.hidden {
    overflow: hidden;
}

h1 {
    font-size: 60px;
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -1.8px;
    margin-bottom: 40px;


}

h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 115%;
    letter-spacing: -0.96px;
    margin-bottom: 40px;


}

.flex {
    display: flex;
    justify-content: space-between;

    &.wrap {
        flex-wrap: wrap;
    }
}

.grid {
    display: grid;
}

.container {

    max-width: calc(1200px + calc(var(--padd) * 2));
    margin: 0 auto;
    padding: 0 var(--padd);

    @media (max-width: 1024px) {
        --padd: 20px;
    }
}

.btn {
    width: max-content;
    transition: all ease .3s;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    user-select: none;
    padding: 15px 40px;


    &.orange {
        border-radius: 35px;
        background: var(--color-orange);
        color: #fff;

        &:hover {
            background: var(--color-orange-hover);
        }
    }

    &.border-orange {
        border-radius: 35px;
        border: 1px solid var(--color-orange);
        color: var(--color-orange);

        &:hover {
            color: var(--color-orange-hover);
            border-color: var(--color-orange-hover);
            box-shadow: inset 0 0 2px var(--color-orange);
        }
    }

    &.gray {
        border-radius: 35px;
        padding: 17px 40px;
        background: var(--color-gray-light);
        color: var(--color-blue);

        &:hover {
            background: var(--color-orange);
        }
    }
}


.text-orange {
    color: var(--color-orange);
}

.main-section {
    margin-bottom: 150px;

    @media(max-width: 1024px){
        margin-bottom: 80px;
    }
}





.mid-section {
    margin-bottom: 100px;
}

.section-title {
    text-align: center;
    font-size: 60px;
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -1.8px;
    color: var(--color-blue);

    @media (max-width: 1024px) {
        font-size: 38px;
        letter-spacing: -1.1px;
    }

    @media (max-width: 768px) {
        font-size: 30px;
        letter-spacing: -0.9px;
    }

    @media (max-width: 480px) {
        font-size: 26px;
        letter-spacing: -0.7px;
    }
}
.section-title-mid{
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -1.08px;
    margin-bottom: 40px;
}

.pre-title {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 10px;
    font-size: 20px;
    position: relative;
    margin-bottom: 15px;

    &:before {
        --size: 14px;
        content: '';
        width: var(--size);
        height: var(--size);
        background: url("../img/star.svg") no-repeat center center;
        background-size: cover;
    }
}

/* CF7 Forms */
.hidden-fields-container{
    display: none;
}
textarea,
input[type="text"] {
    width: 100%;
    box-sizing: border-box;
    outline: none;
    border: 1px solid var(--color-gray);
    background: none;
    padding: 20px;
    border-radius: 5px;

    &:hover {
        border-color: var(--color-orange);
    }
}


input::-webkit-input-placeholder,
input::-moz-placeholder,
textarea::placeholder,
input::placeholder {
    color: var(--color-gray);
}


.wpcf7-submit {
    display: none;
}


.v-text-field {
    position: relative;
    width: 100%;

    &:hover {
        border-color: var(--color-orange);
    }
}

.v-text-field {
    --padding-left: 25px;

    .v-text-field-outlined {

        input {
            border: 1px solid var(--color-gray);
            border-radius: 10px;
            height: 60px;
            position: relative;

            transition: border 0.3s;
        }

        &:hover {
            input {
                border-color: var(--color-black);
            }
        }

        &.focused {
            input {
                outline: none;
                border-color: var(--color-orange);
            }
        }

        &.focused label,
        &.has-content label {
            top: 0;
            font-size: 13px;

            padding: 0 4px;
            transform: translateY(-50%);
            color: var(--color-blue);

        }

    }

    span.wpcf7-form-control-wrap {
        display: block;
        width: 100%;
        height: 100%;
    }

    input.wpcf7-form-control,
    textarea.wpcf7-form-control {
        width: 100%;
        padding: 20px var(--padding-left);
        background: #fff;
        border-radius: 28px;
        font-family: inherit;
    }

    label {
        position: absolute;
        left: var(--padding-left);
        top: 50%;
        transform: translateY(-50%);
        color: var(--color-gray);
        transition: all 0.2s;
        pointer-events: none;
        background-color: transparent;
        padding: 0;
        z-index: 1;
        -webkit-filter: invert(1);
        filter: invert(1);
        -webkit-mix-blend-mode: difference;
        mix-blend-mode: difference;
        will-change: transform;
    }


    .wpcf7-not-valid-tip {
        position: absolute;

        top: -20px;
        right: 20px;
        font-size: 13px;
        letter-spacing: -0.13px;
        color: #E52030;
    }

    &:not(.focused) .wpcf7-not-valid {
        border-color: #E52030;
    }

}

.textarea-container label {
    top: 28px;
}

.textarea-container.focused label,
.textarea-container.has-content label {
    top: 0;
}


.flex {
    display: flex;
}

.wrap {
    flex-wrap: wrap;
}


.form_wrapper {
    width: 100%;
}

.input_item {
    width: 100%;

}



/* Logo animations */
[id^="anim_"] {
    fill: transparent;
    stroke: var(--header-text-color);
    stroke-width: 1px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
}


@keyframes drawLetter {
    to {
        stroke-dashoffset: 0;
        fill: var(--header-text-color);
    }
}

#anim_1 {
    animation: drawLetter 1s ease forwards 0.1s;
}

#anim_2 {
    animation: drawLetter 1s ease forwards 0.3s;
}

#anim_3 {
    animation: drawLetter 1s ease forwards 0.4s;
}

#anim_4 {
    animation: drawLetter 1s ease forwards 0.5s;
}

#anim_5 {
    animation: drawLetter 1s ease forwards 0.6s;
}

#anim_6 {
    animation: drawLetter 1s ease forwards 0.7s;
}

#anim_7 {
    animation: drawLetter 1s ease forwards 0.8s;
}

#anim_8 {
    animation: drawLetter 1s ease forwards 0.9s;
}

#anim_9 {
    animation: drawLetter 1s ease forwards 1.0s;
}

#anim_10 {
    animation: drawLetter 1s ease forwards 1.1s;
}

#anim_11 {
    animation: drawLetter 1s ease forwards 1.2s;
}



/* END Logo animations */


/* Header non critical */

body.menu-open {
    overflow: hidden;
}


.site-navigation {
    @media (max-width: 1024px) {
        .menu {
            flex-direction: column;
        }
    }
}

.lang_block {
    padding: 5px 10px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -0.16px;

    ul{
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        gap: 5px;

        li:not(:first-child):before {
            content: '/';
            margin-right: 5px;
        }
    }

    a{
        color: var(--color-blue);

    }

    background: var(--color-gray-light);
    border-radius: 5px;


    .current-lang {
        a{
            font-weight: 600;
            color: var(--color-orange);
        }

    }

}


.site-navigation{
    a,
    .lang_block .open{
        &:hover{
            color: var(--color-orange) !important;
        }
    }

    .header_phone {

        &:hover{

            .icon{
                background-color: var(--color-orange) !important;
            }
        }

    }

    .header_info{
        @media (max-width: 1024px) {
            flex-direction: column-reverse;
        }
    }
}

.header_menu{
    .current_page_item > .menu-link{
        color: var(--color-orange);
    }

    @media(max-width: 1024px){
        margin-bottom: 40px;
    }

    li{

        &:hover {
            .sub-menu-wrapper{
                z-index: 10;
                opacity: 1;
                visibility: visible;
                max-height: 500px;
                transform: translateY(0);
            }
        }
    }

    .menu{


        @media(max-width: 1024px){

            text-align: center;

            .sub-menu{
                padding-bottom: 0;
            }

            > .main-menu-item {
                > .menu-link{
                    font-size: 20px;
                    font-weight: 500;
                }

                &:not(:last-child):after{
                    right: 0;
                    left: 0;
                    margin: 0 auto;
                    top: unset;
                    bottom: calc(calc(calc(var(--gap) / 2) + calc(var(--size) / 2)) * -1);
                }
            }

        }
    }
}

.site-navigation.active {
    transform: translateY(-1px);
    opacity: 1;
    visibility: visible;
    max-height: 1000px;
    z-index: 100;
    transition: all ease .3s;
}

.menu-button.open {
    background-color: white;

    .dot {
        background-color: var(--color-blue);
        border-radius: 5px;
        width: 14px;
        height: 2px;


        &:nth-child(1) {
            top: 17px;
            left: 14px;
            transform: rotate(45deg);
            width: 6px;
        }

        &:nth-child(2) {
            top: 21px;
            right: 13px;
            transform: rotate(-45deg);
            width: 16px;
        }

        &:nth-child(3) {
            bottom: 19px;
            left: 13px;
            transform: rotate(-45deg);
            width: 16px;
        }

        &:nth-child(4) {
            bottom: 15px;
            right: 14px;
            transform: rotate(45deg);
            width: 6px;
        }
    }

}

/* END  Header non critical */

/* END CF7 Forms */

.swiper-nav_container {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.swiper-nav {
    position: relative;
    display: flex;
    gap: 24px;
    justify-content: center;
    align-items: center;

    .swiper-button-prev,
    .swiper-button-next {
        left: unset;
        right: unset;
        top: unset;
        margin: 0;
        position: relative;
        background: var(--color-gray-light);
        color: var(--color-blue);
        min-width: 39px;
        height: 39px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 100%;

        &:after {
            font-size: 16px;
        }
    }

    .swiper-pagination {
        position: relative;
        left: unset;
        right: unset;
        top: unset;
        bottom: unset;

        .swiper-pagination-bullet {
            border: 1px solid var(--color-blue);
            width: 7px;
            height: 7px;
            background: #fff;
        }

        .swiper-pagination-bullet-active {
            background: var(--color-orange);
            border-color: var(--color-orange);
        }

    }
}




/* Different blocks */

.section-subtitle {
    text-align: center;
    
    font-weight: 500;
    font-size: 24px;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--color-black);
    margin-top: 20px;

    @media (max-width: 767px) {
        font-size: 18px;
    }
}

.questionnaire {
    background: var(--color-blue);
    border-radius: 10px;
    padding: 30px 46px;
    margin: 40px auto;
    max-width: 895px;
    display: grid;
    grid-template-columns: 64px 1fr auto;
    align-items: center;
    gap: 20px;
    color: #fff;

    .icon {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: var(--color-gray-light);
        border: 1px solid #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        flex-shrink: 0;

        img {
            width: 35px;
            height: 35px;
            object-fit: contain;
        }
    }

    .text-block {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .heading {
        
        font-weight: 600;
        font-size: 24px;
        line-height: 1.1;
        letter-spacing: -0.03em;
    }

    .subheading {
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.3;
        letter-spacing: -0.01em;
    }

    .btn {
        width: 245px;
        min-height: 64px;
        padding: 12px 26px;
        font-size: 18px;
        line-height: 1.1;
        letter-spacing: -0.01em;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        flex-shrink: 0;
    }

    @media (max-width: 768px) {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 24px 20px;

        .icon {
            margin: 0 auto;
        }

        .heading {
            font-size: 20px;
        }

        .btn {
            width: 100%;
        }
    }
}

.category_wrapper {
    --gap: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gap);

    @media (max-width: 1024px) {
        grid-template-columns: repeat(3, 1fr);
    }

    @media (max-width: 768px) {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .category_item {
        border-radius: 10px;
        background: var(--color-gray-light);
        width: calc(calc(100% / 4) - var(--gap));
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 30px;
        position: relative;
        @media (max-width: 1024px) {
            width:calc(calc(100% / 3) - var(--gap))
        }

        @media (max-width: 992px) {
            width:calc(calc(100% / 2) - var(--gap))
        }

        @media (max-width: 767px) {
            width: 100%;
        }

        .name {
            
            font-weight: 600;
            font-size: 20px;
            line-height: 110%;
            letter-spacing: -0.6px;
            color: var(--color-blue);
            text-transform: uppercase;
            display: block;
            margin-bottom: 15px;

            @media (max-width: 768px) {
                grid-column: 1;
                grid-row: 1;
                font-size: 18px;
            }
        }

        .dn {
            margin-top: 15px;
            
            font-weight: 500;
            font-size: 16px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            color: var(--color-black);
            text-transform: capitalize;

            @media (max-width: 768px) {
                grid-column: 1;
                grid-row: 2;
                margin-top: 0;
            }
        }

        .photo {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 135px;
            margin: 20px auto;

            @media (max-width: 768px) {

                width: 135px;
                height: 160px;
                margin: 0;
            }



            img {
                max-width: 100%;
                max-height: 100%;
                height: auto;
                object-fit: contain;
                transition: transform ease .3s;
            }
        }

        .buttons {
            margin-top: auto;
            display: inline-flex;

            @media (max-width: 768px) {
                grid-column: 1;
                grid-row: 3;
                margin-top: 12px;
            }

            .btn {
                width: 151px;
                min-height: 52px;
                padding: 10px 20px;
                font-size: 16px;
                line-height: 1.1;
                letter-spacing: -0.01em;
                display: inline-flex;
                align-items: center;
                justify-content: center;

                @media (max-width: 480px) {
                    width: 100%;
                }
            }
        }

        &:hover {
            .photo img {
                transform: scale(1.05);
            }
        }
    }
}

.catalog_actions {
    margin-top: 50px;
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;

    @media (max-width: 768px) {
        flex-direction: column;
        align-items: center;
        gap: 14px;
    }

    .btn {
        width: 297px;
        min-height: 64px;
        padding: 12px 26px;
        font-size: 18px;
        line-height: 1.1;
        letter-spacing: -0.01em;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;

        @media (max-width: 768px) {
            width: 100%;
            max-width: 297px;
        }
    }
}

/* ==========================================================================
   Article (single post)
   ========================================================================== */

.single-article {
    .article-header {
        padding-top: 40px;
        margin-bottom: 0;

        @media (max-width: 768px) {
            padding-top: 20px;
        }
    }

    .article-header_inner {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        min-height: 86px;
    }

    .article-nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: var(--color-gray-light);
        color: var(--color-blue);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all ease .25s;

        &.prev { left: 0; }
        &.next { right: 0; }

        @media (max-width: 767px) {
            &.prev,
            &.next { display: none }
        }

        &:hover {
            background: var(--color-orange);
            color: #fff;
        }

        @media (max-width: 768px) {
            position: static;
            transform: none;
            width: 40px;
            height: 40px;
        }
    }

    .article-header_center {
        text-align: center;
        max-width: 870px;

        @media (max-width: 768px) {
            order: -1;
            width: 100%;
        }
    }

    .article-meta {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
        color: var(--color-black);
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.2;
        letter-spacing: -0.01em;

        svg {
            color: var(--color-blue);
        }
    }

    .article-title {
        margin: 0;
        font-size: 45px;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -1.35px;

        @media (max-width: 768px) {
            font-size: 26px;
        }
    }

    .article-content {
        margin: 40px 0 60px;

        @media (max-width: 768px) {
            margin: 24px 0 40px;
        }
    }

    .article-content_inner {
        max-width: 1000px;
        margin: 0 auto;
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: -0.01em;
        color: var(--color-black);

        > * + * {
            margin-top: 24px;
        }

        h2 {
            font-weight: 600;
            font-size: 22px;
            line-height: 1.2;
            letter-spacing: -0.02em;
            color: var(--color-blue);
            text-transform: uppercase;
            margin: 40px 0 14px;
        }

        h3 {
            font-weight: 600;
            font-size: 18px;
            line-height: 1.2;
            color: var(--color-blue);
            margin: 30px 0 12px;
        }

        p {
            margin: 0 0 14px;
        }

        ul, ol {
            margin: 14px 0;
            padding-left: 0;
            list-style: none;

            li {
                position: relative;
                padding-left: 22px;
                margin-bottom: 10px;

                &::before {
                    content: "";
                    position: absolute;
                    left: 0;
                    top: 0.55em;
                    width: 8px;
                    height: 8px;
                    border-radius: 50%;
                    background: var(--color-orange);
                }
            }
        }

        ol {
            counter-reset: ol-counter;

            li {
                counter-increment: ol-counter;

                &::before {
                    content: counter(ol-counter);
                    width: auto;
                    height: auto;
                    background: none;
                    color: var(--color-orange);
                    font-weight: 600;
                    top: 0;
                }
            }
        }

        img,
        figure {
            border-radius: 8px;
            overflow: hidden;
            max-width: 100%;
            margin-bottom: 20px;
        }

        figure img {
            border-radius: 0;
        }

        .wp-block-image img {
            border-radius: 8px;
            display: block;
            width: 100%;
            height: auto;
        }

        .wp-block-columns {
            gap: 20px;

            @media (max-width: 640px) {
                gap: 16px;
            }
        }

        a:not(.btn) {
            color: var(--color-orange);
            text-decoration: underline;
            text-underline-offset: 3px;

            &:hover {
                color: var(--color-blue);
            }
        }
    }
}

.news-article{

    .call-engineer{
        margin-bottom: 0;
    }

    .related-articles{

        .related-grid{
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 20px;

            @media(max-width: 767px){
                display: none;
            }
        }

        .related-swiper{
            @media(min-width: 768px){
                display: none;
            }
        }

        .related-card {
            display: grid;
            grid-template-columns: 180px 1fr;
            gap: 10px;
            max-width: 766px;

            @media (max-width: 767px) {
                grid-template-columns: 1fr;
            }




            &:hover {
                .related-card_body {
                    background: #eef0f4;
                }
            }

            .photo {
                display: block;
                aspect-ratio: 1;
                border-radius: 10px;
                overflow: hidden;
                background: #fff;

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

            .related-card_body {
                background: var(--color-gray-light);
                border-radius: 10px;
                padding: 20px;
                transition: background ease .25s;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                gap: 14px;
            }

            .title {
                margin: 0;
                font-weight: 600;
                line-height: 110%;
                letter-spacing: -0.48px;
                text-transform: uppercase;
                color: var(--color-blue);

                a {
                    color: inherit;
                    transition: color ease .25s;

                    &:hover {
                        color: var(--color-orange);
                    }
                }
            }

            .date {
                align-self: flex-start;
                padding: 6px 14px;
                background: var(--color-blue);
                color: #fff;
                border-radius: 20px;
                font-size: 13px;
                font-weight: 500;
                letter-spacing: -0.01em;
            }


        }
    }
}



/* ==========================================================================
   ACF Block: Callout (light / navy)
   ========================================================================== */

.callout {
    position: relative;
    border-radius: 10px;
    padding: 24px 30px;
    display: flex;
    gap: 20px;
    align-items: flex-start;

    &.has-icon {
        padding-left: 30px;
    }

    &.callout--light {
        background: var(--color-gray-light);
        color: var(--color-blue);
    }

    &.callout--navy {
        background: var(--color-blue);
        color: #fff;
    }

    .callout_icon {
        position: absolute;
        left: -16px;
        top: -16px;
        width: 39px;
        height: 39px;
        border-radius: 50%;
        background: var(--color-orange);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .callout_body {
        flex: 1;
        min-width: 0;
    }

    .callout_heading {
        
        font-weight: 600;
        font-size: 18px;
        line-height: 1.2;
        letter-spacing: -0.02em;
        margin-bottom: 10px;
    }

    .callout_text {
        
        font-weight: 500;
        font-size: 15px;
        line-height: 1.5;
        letter-spacing: -0.01em;

        p:last-child {
            margin-bottom: 0;
        }

        a {
            color: inherit;
            text-decoration: underline;
        }
    }

    @media (max-width: 640px) {
        padding: 24px 20px;

        &.has-icon {
            padding-top: 36px;
        }

        .callout_icon {
            left: 16px;
            top: -16px;
        }
    }
}

/* ==========================================================================
   ACF Block: Models list
   ========================================================================== */

.models-list {
    .models-list_heading {
        
        font-weight: 600;
        font-size: 18px;
        line-height: 1.2;
        letter-spacing: -0.02em;
        color: var(--color-blue);
        text-transform: uppercase;
        margin-bottom: 18px;
    }

    .models-list_grid {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        gap: 10px;
    }

    &.cols-1 .models-list_grid { grid-template-columns: 1fr; }
    &.cols-2 .models-list_grid { grid-template-columns: 1fr 1fr; }
    &.cols-3 .models-list_grid { grid-template-columns: repeat(3, 1fr); }

    @media (max-width: 768px) {
        &.cols-2 .models-list_grid,
        &.cols-3 .models-list_grid { grid-template-columns: 1fr; }
    }

    .models-list_item {
        padding: 0;
        margin: 0;

        &::before {
            display: none !important;
        }

        a,
        span {
            display: flex;
            align-items: center;
            min-height: 41px;
            padding: 10px 16px;
            border: 1px solid var(--color-gray);
            border-radius: 6px;
            background: #fff;
            color: var(--color-blue);
            
            font-weight: 500;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            transition: all ease .25s;
            text-decoration: none;
        }

        a:hover {
            border-color: var(--color-orange);
            color: var(--color-orange);
        }
    }
}

/* ==========================================================================
   Blog: archive + single
   ========================================================================== */

.blog-header {
    padding-top: 40px;
    margin-bottom: 40px;

    @media (max-width: 768px) {
        padding-top: 20px;
        margin-bottom: 30px;
    }
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;

    @media (max-width: 1024px) {
        grid-template-columns: repeat(2, 1fr);
    }

    @media (max-width: 640px) {
        grid-template-columns: 1fr;
    }
}

.blog-related-grid{

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;

    @media (max-width: 1024px) {
        grid-template-columns: repeat(2, 1fr);
    }

    @media (max-width: 767px) {
       display: none;
    }
}

.blog-related-swiper{
    @media (min-width: 768px) {
        display: none;
    }
}

.blog-card {
    height: 100%;
    background: var(--color-gray-light);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform ease .25s;

    .photo {
        display: block;
        aspect-ratio: 368 / 245;
        overflow: hidden;
        background: #fff;
        margin: 10px;
        border-radius: 6px;

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

        &:hover img {
            transform: scale(1.04);
        }
    }
}

.blog-card_body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
    padding: 10px 30px 30px;
    gap: 16px;

    .top{
        display: flex;
        flex-direction: column;
        flex: 1;

        gap: 16px;

    }

    .bottom{

        a{
            display: inline-flex;
        }
    }

    .date {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: flex-start;
        padding: 4px 13px;
        background: var(--color-blue);
        border-radius: 20px;
        color: #fff;
        font-weight: 500;
        font-size: 13px;
        line-height: 1.2;
        letter-spacing: -0.01em;
    }

    .title {
        margin: 0;
        
        font-weight: 600;
        font-size: 18px;
        line-height: 1.1;
        letter-spacing: -0.02em;
        color: var(--color-blue);
        text-transform: uppercase;

        a {
            color: inherit;
            transition: color ease .25s;

            &:hover {
                color: var(--color-orange);
            }
        }
    }

    .excerpt {
        
        font-weight: 500;
        font-size: 15px;
        line-height: 1.4;
        letter-spacing: -0.01em;
        color: var(--color-black);
    }

    .blog-card_btn {
        margin-top: auto;
        align-self: flex-start;
        min-width: 150px;
        min-height: 55px;
        padding: 10px 26px;
        font-size: 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

.blog-pagination {
    margin-top: 60px;
    display: flex;
    justify-content: center;

    .page-numbers {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        gap: 8px;
        flex-wrap: wrap;

        li a,
        li span {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 40px;
            height: 40px;
            padding: 0 12px;
            border-radius: 20px;
            background: var(--color-gray-light);
            color: var(--color-blue);
            font-weight: 500;
            font-size: 14px;
            transition: all ease .25s;
        }

        li a:hover,
        li .current {
            background: var(--color-orange);
            color: #fff;
        }
    }
}

.blog-empty {
    text-align: center;
    padding: 60px 0;
    color: var(--color-gray);
}

/* ==========================================================================
   CTA Request (баннер 'Запросите расчёт')
   ========================================================================== */

.cta-request {
    margin: 80px 0;

    @media (max-width: 768px) {
        margin: 40px 0;
    }

    .cta-request_card {
        background: var(--color-blue);
        border-radius: 10px;
        padding: 30px 40px;
        display: grid;
        grid-template-columns: 1.4fr auto 1fr;
        align-items: center;
        gap: 30px;
        color: #fff;

        @media (max-width: 1024px) {
            grid-template-columns: 1fr;
            gap: 24px;
            padding: 30px 24px;
            text-align: center;
        }
    }

    .cta-request_text {
        .heading {
            
            font-weight: 600;
            font-size: 22px;
            line-height: 1.2;
            letter-spacing: -0.03em;
            margin-bottom: 12px;
        }

        .subheading {
            
            font-weight: 500;
            font-size: 14px;
            line-height: 1.3;
            letter-spacing: -0.01em;
            color: rgba(255, 255, 255, 0.85);
        }
    }

    .cta-request_action {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;

        .btn {
            width: 245px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 18px;
            line-height: 1.1;
            letter-spacing: -0.01em;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

        .response-time {
            
            font-weight: 500;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            color: rgba(255, 255, 255, 0.65);
        }

        @media (max-width: 480px) {
            .btn {
                width: 100%;
                max-width: 297px;
            }
        }
    }

    .cta-request_manager {
        display: flex;
        align-items: center;
        gap: 16px;

        @media (max-width: 1024px) {
            justify-content: center;
        }

        .photo {
            position: relative;
            flex-shrink: 0;
            width: 96px;
            height: 96px;
            border-radius: 50%;
            overflow: hidden;
            background: var(--color-gray-light);

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

            .dot {
                position: absolute;
                right: 4px;
                bottom: 4px;
                width: 14px;
                height: 14px;
                border-radius: 50%;
                background: #2ec48a;
                border: 2px solid var(--color-blue);
            }
        }

        .info {
            display: flex;
            flex-direction: column;
            gap: 4px;

            .name {
                
                font-weight: 600;
                font-size: 16px;
                line-height: 1.2;
                letter-spacing: -0.01em;
            }

            .position {
                
                font-weight: 500;
                font-size: 13px;
                line-height: 1.3;
                letter-spacing: -0.01em;
                color: rgba(255, 255, 255, 0.75);
                max-width: 220px;
            }

            .online {
                margin-top: 4px;
                
                font-weight: 500;
                font-size: 13px;
                color: var(--color-orange);
            }

            @media (max-width: 1024px) {
                .position {
                    max-width: none;
                }
            }
        }
    }
}

.top-benefits {
    background: var(--color-gray-light);
    padding: 21px 0;
    margin-bottom: 70px;

    .top-benefits_wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        flex-wrap: wrap;
    }

    .top-benefits_item {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .icon {
        width: 58px;
        height: 58px;
        border-radius: 50%;
        background: var(--color-orange);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;

        img {
            object-fit: contain;
        }
    }

    .text {
        min-width: 200px;
        max-width: 240px;
        height: 58px;
        padding: 8px 17px;
        border-radius: 30px;
        background: var(--color-blue);
        color: #fff;
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.1;
        letter-spacing: -0.01em;
        display: flex;
        align-items: center;
    }

    @media (max-width: 1024px) {
        padding: 20px 0;

        .top-benefits_wrapper {
            gap: 16px;
        }

        .text {
            min-width: 0;
            font-size: 14px;
            height: 52px;
        }

        .icon {
            width: 52px;
            height: 52px;
        }
    }

    @media (max-width: 768px) {
        .top-benefits_wrapper {
            flex-direction: column;
            align-items: stretch;
        }

        .top-benefits_item {
            justify-content: center;
        }

        .text {
            flex: 1;

        }
    }
}

.factory-tour {
    margin-top: 70px;

    @media (max-width: 1024px) {
        .factory-tour_card {
            max-width: 520px;
        }
    }




    .factory-tour_card {
        max-width: 615px;
        margin: 0 auto;
        background: var(--color-blue);
        border-radius: 10px;
        padding: 30px;
        display: flex;
        flex-direction: column;

        @media (max-width: 767px){
            padding: 40px 30px  ;
        }
    }

    .top {

        display: flex;
        align-items: center;
        gap: 16px;
        padding-right: 50px;

        @media (max-width: 767px) {
            padding-right: 0;
        }

        a{
            --size: 112px;
            min-width: var(--size);
            max-width: var(--size);
            padding: 0;
            border: 0;
            background: none;
            position: relative;
            cursor: pointer;



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

            .play {
                --size: 40px;
                position: absolute;
                background: var(--color-orange);
                border: 3px solid var(--color-blue);
                border-radius: 50%;
                width: var(--size);
                height: var(--size);
                display: flex;
                align-items: center;
                justify-content: center;
                right: 0;
                bottom: -10px;
                transition: all ease .3s;

                svg {
                    width: 13px;
                    height: 14px;
                }
            }

            &:hover{
                .play{
                    background: var(--color-orange-hover);
                   border-color: var(--color-orange-hover);
                }
            }

        }

        .heading {
            font-weight: 600;
            font-size: 24px;
            line-height: 1.1;
            letter-spacing: -0.03em;
            color: #fff;

            @media (max-width: 767px){
                font-size: 20px;
            }

        }
    }

    .bottom{
        display: flex;
        justify-content: flex-end;
            margin-top: 20px;

        @media (min-width: 768px){
            margin-top: -20px;


        }

        button {

            min-width: 245px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 18px;
            line-height: 1.1;
            letter-spacing: -0.01em;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            @media (max-width: 767px){
                width: 100%;
            }
        }
    }




}

.faq {
    .faq_grid {
        margin-top: 50px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        align-items: start;

        @media (max-width: 1024px) {
            grid-template-columns: repeat(2, 1fr);
        }

        @media (max-width: 640px) {
            grid-template-columns: 1fr;
        }
    }

    .faq_item {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 20px;
        transition: background ease .25s;

        &.is-open {
            background: var(--color-gray-light);

            .toggle {
                transform: rotate(45deg);
            }
        }
    }

    .faq_question {
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        padding: 0;
        background: transparent;
        border: 0;
        cursor: pointer;
        text-align: left;
        color: var(--color-blue);
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.3;
        letter-spacing: -0.01em;

        .text {
            flex: 1;
        }

        .toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 21px;
            height: 21px;
            color: var(--color-orange);
            flex-shrink: 0;
            transition: transform ease .3s;

            svg {
                width: 100%;
                height: 100%;
                overflow: visible;
            }

            circle {
                display: none;
            }

            .plus-h,
            .plus-v {
                stroke-width: 1.5;
            }

            .plus-v {
                stroke-dasharray: 2.5 5 2.5;
            }
        }
    }

    .faq_answer {
        overflow: hidden;
        max-height: 0;
        margin-top: 0;
        transition: max-height ease .3s, margin-top ease .3s;
        
        font-weight: 500;
        font-size: 14px;
        line-height: 1.4;
        letter-spacing: -0.01em;
        color: var(--color-black);

        p {
            margin: 0 0 10px;

            &:last-child {
                margin-bottom: 0;
            }
        }
    }

    .faq_item.is-open .faq_answer {
        max-height: 800px;
        margin-top: 14px;
    }
}

.testimonials {
    .testimonials_wrapper {
        margin-top: 50px;

        .swiper-slide {
            height: auto;
        }
    }

    .testimonial {
        position: relative;
        display: block;
        height: 100%;
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 20px;
        cursor: zoom-in;
    }

    .frame {
        position: relative;
        width: 100%;
        aspect-ratio: 245 / 280;
        border-radius: 6px;
        overflow: hidden;
        background: #fff;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
    }

    .zoom {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 39px;
        height: 39px;
        border-radius: 50%;
        background: var(--color-orange);
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity ease .25s;
        pointer-events: none;
    }

    .testimonial:hover .zoom {
        opacity: 1;
    }

    .swiper-nav_container {
        margin-top: 30px;
        display: flex;
        justify-content: center;
    }
}

.team {
    .team_wrapper {
        margin-top: 50px;

        .swiper-slide {
            height: auto;
        }
    }

    .member {
        height: 100%;
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 16px;
    }

    .photo {
        width: 100%;
        aspect-ratio: 245 / 164;
        border-radius: 8px;
        overflow: hidden;
        background: var(--color-gray-light);

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: top center;
            display: block;
        }
    }

    .name {
        
        font-weight: 600;
        font-size: 22px;
        line-height: 1.1;
        letter-spacing: -0.03em;
        color: var(--color-blue);
    }

    .position {
        
        font-weight: 500;
        font-size: 14px;
        line-height: 1.3;
        letter-spacing: -0.01em;
        color: var(--color-black);
    }

    .team-navy {
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 40px;
        @media (max-width: 992px) {
            flex-direction: column;
        }
    }

    .team_cta {
        display: flex;
        justify-content: center;
    }

    .swiper-nav_container{
        margin: 0;
    }


}

.industries {

    .container-content{
        display: flex;
        flex-direction: column;
    }
    .industries_content {
        position: relative;
        max-width: 760px;
        margin: 40px auto 0;
        text-align: center;

        @media (max-width: 768px) {
            text-align: left;
        }
    }

    .industries_badges {
        @media (max-width: 1024px) {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
            margin-bottom: 20px;
        }

        @media (max-width: 768px) {
            margin-bottom: 16px;
            gap: 8px;
        }

        .badge {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 6px 14px 6px 6px;
            background: var(--color-blue);
            color: #fff;
            border-radius: 20px;
            
            font-weight: 500;
            font-size: 14px;
            line-height: 1.1;
            letter-spacing: -0.01em;
            white-space: nowrap;

            @media (min-width: 1025px) {
                position: absolute;
                z-index: 2;

                &.badge-0 {
                    left: -160px;
                    top: 30px;
                }

                &.badge-1 {
                    right: -160px;
                    top: 50%;
                    transform: translateY(-50%);
                }

                &.badge-2 {
                    left: -260px;
                    bottom: 80px;
                }
            }

            @media (max-width: 768px) {
                font-size: 12px;
            }

            i {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 17px;
                height: 17px;
                border-radius: 50%;
                background: #fff;
                color: var(--color-blue);
                font-style: normal;
                font-weight: 700;
                font-size: 12px;
            }
        }
    }

    .industries_lead {
        position: relative;
        padding: 12px 40px;
        margin-bottom: 30px;
        
        font-weight: 600;
        font-size: 22px;
        line-height: 1.25;
        letter-spacing: -0.03em;
        color: var(--color-blue);

        @media (max-width: 768px) {
            text-align: center;
            font-size: 18px;
        }

        @media (max-width: 640px) {
            padding: 10px 24px;

            .bracket {
                width: 12px;
            }
        }

        p {
            margin: 0;
        }

        .bracket {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 20px;
            border-top: 1px solid var(--color-blue);
            border-bottom: 1px solid var(--color-blue);
            pointer-events: none;

            &.bracket-left {
                left: 0;
                border-left: 1px solid var(--color-blue);
            }

            &.bracket-right {
                right: 0;
                border-right: 1px solid var(--color-blue);
            }
        }
    }

    .industries_body {
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: -0.01em;
        color: var(--color-black);

        p {
            margin: 0 0 16px;

            &:last-child {
                margin-bottom: 0;
            }
        }

        @media (max-width: 768px) {
            position: relative;
            max-height: 180px;
            overflow: hidden;
            transition: max-height ease .4s;

            &::after {
                content: "";
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 60px;
                background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
                pointer-events: none;
            }
        }
    }



    .industries_show-more {
        display: none;

        @media (max-width: 768px) {
            display: flex;
            align-items: center;
            justify-content: center;

            min-height: 52px;
            padding: 10px 20px;
            margin: 14px auto 0;
            background: transparent;
            border: 1px solid var(--color-orange);
            border-radius: 35px;
            color: var(--color-orange);
            
            font-weight: 500;
            font-size: 16px;
            line-height: 1.1;
            cursor: pointer;
        }

        .less {
            display: none;
        }
    }


    .buttons{
        margin-top: 40px;
        display: flex;
        justify-content: center;

        @media (max-width: 767px) {
            order: 3;
        }
    }

    &.is-expanded {
        @media (max-width: 768px) {
            .industries_body {
                max-height: 4000px;

                &::after {
                    display: none;
                }
            }

            .industries_show-more {
                .more {
                    display: none;
                }

                .less {
                    display: inline;
                }
            }
        }
    }


    .industries_grid {
        margin-top: 60px;


    }

    .industry_card {
        @media (max-width: 768px) {
            flex: 0 0 224px;
            scroll-snap-align: start;
        }

        .photo {
            border-radius: 8px;
            overflow: hidden;
            aspect-ratio: 224 / 175;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
            }
        }

        .name {
            margin-top: 15px;
            text-align: center;
            
            font-weight: 500;
            font-size: 16px;
            line-height: 1.3;
            letter-spacing: -0.01em;
            color: var(--color-black);
        }
    }
}

.what-to-know {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto auto;
    gap: 20px;

    .wtk-main {
        grid-column: 1;
        grid-row: 1 / span 2;
        background: var(--color-gray-light);
        border-radius: 5px;
        padding: 60px 30px 30px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;

        .photo {
            position: relative;

            .image{
                width: 160px;
                height: 185px;
            }

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


        }

        .heading {
            margin-top: 30px;
            
            font-weight: 600;
            font-size: 24px;
            line-height: 1.1;
            letter-spacing: -0.03em;
            color: var(--color-blue);
        }
    }

    .wtk-text {
        background: var(--color-gray-light);
        border-radius: 5px;
        padding: 30px;
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.3;
        letter-spacing: -0.01em;
        color: var(--color-blue);
    }

    .wtk-image {
        border-radius: 5px;
        overflow: hidden;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        @media (max-width: 768px) {
            aspect-ratio: 335 / 221;
        }
    }

    @media (max-width: 1024px) {
        grid-template-columns: 1fr 1fr;

        .wtk-main {
            grid-row: 1;
            grid-column: 1 / span 2;
            padding: 40px 30px;
        }
    }

    @media (max-width: 768px) {
        grid-template-columns: 1fr;
        gap: 18px;

        .wtk-main {
            grid-column: 1;
            grid-row: auto;
            padding: 40px 20px;
        }

        .wtk-text {
            padding: 24px;
        }
    }
}

.why-we {
    overflow-x: clip;

    .advantages_wrapper {
        margin-top: 40px;

        .swiper {
            position: relative;
            padding-bottom: 0;
            overflow: visible;
        }

        .swiper-slide {
            height: auto;
        }
    }

    .item {
        height: 100%;
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 20px;

        .photo {
            width: 100%;
            aspect-ratio: 266 / 160;
            border-radius: 5px;
            overflow: hidden;

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

        .title {
            
            font-weight: 600;
            font-size: 16px;
            line-height: 1.1;
            letter-spacing: -0.01em;
            color: var(--color-blue);
            text-transform: uppercase;
            padding: 0 10px;
        }

        .text {
            
            font-weight: 500;
            font-size: 16px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            color: var(--color-black);
            padding: 0 10px 20px;
        }
    }

    .advantages-navy{
        margin-top: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 40px;
    }

    .swiper-nav_container {
        margin: 0;
        display: flex;
        justify-content: center;


    }

    .advantages_cta {
        display: flex;
        justify-content: center;

        .btn {
            min-width: 297px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 18px;
            line-height: 1.1;
            letter-spacing: -0.01em;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

        @media (max-width: 480px) {
            .btn {
                min-width: 0;
                width: 100%;
            }
        }
    }
}


.our-solutions {

    .section-inner {
        background: var(--color-gray-light);
        border-radius: 20px;
        padding: 50px;

        @media (max-width: 767px) {
            padding: 40px 20px;
        }

    }

    .content-container {
        position: relative;
    }

    .section-title {
        max-width: 870px;
        margin: 0 auto 25px;
    }

    .grid {
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 60px;
        max-width: 800px;
        margin: 0 auto;

        @media (max-width: 767px) {
            grid-template-columns: 1fr;
        }

        .grid-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 20px;
            text-align: center;
        }
    }

    .buttons {
        margin-top: 50px;
        display: flex;
        justify-content: center;
    }

    .fly_text {
        @media (max-width: 767px) {
            display: none;
        }
        .fly_item {
            position: absolute;

            &:first-child {
                left: 0;
                top: 27%;
                @media(max-width: 860px){
                    top: 80%;
                }
            }

            &:nth-child(2) {
                right: 0;
                top: 0;

                @media(max-width: 860px){
                    top: -30px;
                }
            }

            &:nth-child(3) {
                right: 0;
                top: 58%;

                @media(max-width: 860px){
                    top: 90%;
                }
            }

            div {
                display: flex;
                align-items: center;
                gap: 5px;
                background: var(--color-blue);
                border-radius: 20px;
                padding: 5px 12px 6px 6px;
                color: #fff;

                &:before {
                    content: 'i';
                    display: flex;
                    width: 17px;
                    height: 17px;
                    justify-content: center;
                    align-items: center;
                    background: var(--color-orange);
                    color: var(--color-blue);
                    border-radius: 100%;
                }
            }


        }
    }
}

.call-engineer {
    .section-inner {
        background: var(--color-blue);
        color: #fff;
        border-radius: 10px;
        padding: 45px 60px;

        @media (max-width: 767px) {
            padding: 40px 20px;
        }
    }

    .grid {
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 8%;

        @media(min-width: 1200px){
            grid-template-columns: minmax(310px, 1fr) 1fr minmax(275px ,1fr);
        }

        @media(max-width: 860px){
            grid-template-columns: 1fr;
            grid-gap: 30px;
        }
    }

    .title {
        font-size: 36px;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -1.08px;
        margin-bottom: 20px;
        @media (max-width: 767px) {
            text-align: center;
        }
    }
    .subtitle{
        @media (max-width: 767px) {
            text-align: center;
        }
    }

    .button {
        margin-bottom: 15px;
    }

    .mess {
        font-size: 14px;
        line-height: 130%;
        letter-spacing: -0.14px;
    }

    .grid-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .action {
        button {
            min-width: 245px;
        }
    }

    .engineer {
        flex-direction: row;
        align-items: unset;
        gap: 10px;

        .l {
            min-width: 128px;
            max-width: 128px;
            position: relative;
            display: flex;
            align-items: flex-end;

            div{
                border-radius: 100%;
                overflow: hidden;
            }

            &:after {
                content: '';
                position: absolute;
                right: 13%;
                bottom: 8%;
                width: 10px;
                height: 10px;
                border-radius: 100%;
                background: #4EE63D;
            }
        }

        .r {
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: 14px 0 8px;

            @media (max-width: 860px) {
                width: auto;
            }
        }
    }

    .position {
        margin-top: 7px;
        color: var(--color-gray);
    }

    .online {
        color: #4EE63D;
    }


}



.our-clients {

    .swiper {
        margin-top: 40px;

        .swiper-slide {
            height: auto;
        }
    }




    .item {
        display: flex;
        flex-direction: column;
        gap: 15px;
        align-items: center;
        text-align: center;
        padding: 10px 10px 20px;
        background: var(--color-blue);
        color: #fff;
        border-radius: 10px;
        height: 100%;

        .image {
            overflow: hidden;
            border-radius: 10px;
            background: #fff;
            aspect-ratio: 1/1;
            min-height: 96px;
            position: relative;
            display: flex;
            align-items: center;
            padding: 0 20px;
        }

        .name {
            font-size: 16px;
            font-style: normal;
            line-height: 130%;
            letter-spacing: -0.16px;
        }
    }

    .swiper-wrapper {
        transition-timing-function: linear !important;
    }
}


.our-team {

    @media (max-width: 767px) {
        padding: 0 35px;
    }

    .swiper {
        margin-top: 40px;

        .swiper-slide {
            height: auto;
        }
    }


    .item {
        display: flex;
        flex-direction: column;
        gap: 20px;
        align-items: center;
        text-align: center;
        padding: 20px;
        background: var(--color-gray-light);;
        border-radius: 10px;
        height: 100%;

        .image {
            overflow: hidden;
            border-radius: 10px;
            background: #fff;
            width: 100%;
            height: 100%;
            min-height: 96px;
            position: relative;


        }

        .name {
            font-size: 20px;
            font-weight: 600;
            text-transform: uppercase;
            color: var(--color-blue);
            margin-bottom: 10px;
        }

        .position {
            font-size: 16px;
            line-height: 130%;
            letter-spacing: -0.16px;
        }

    }
}

.latest-news {
    counter-reset: news_item 0;

    @media (max-width: 767px) {
        padding: 0 35px;
    }

    .swiper {
        margin-top: 40px;

        .swiper-slide {
            height: auto;
        }
    }



    .item {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 20px;
        background: var(--color-gray-light);
        border-radius: 10px;
        height: 100%;
        counter-increment: news_item;

        .image {
            overflow: hidden;
            border-radius: 10px;
            position: relative;
        }

        .title {
            font-size: 16px;
            line-height: 130%;
            letter-spacing: -0.16px;
            color: var(--color-blue);
            margin-bottom: 5px;
            
            @media (min-width: 768px) {
                min-height: 85px;
            }
        }

        .number {
            &:before {
                content: counter(news_item, decimal-leading-zero);
                width: 25px;
                height: 25px;
                border-radius: 100%;
                background: var(--color-blue);
                display: flex;
                align-items: center;
                justify-content: center;
                color: #fff;
                font-size: 9px;
                letter-spacing: 0.09px;

            }
        }

    }
}




.social {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    row-gap: 20px;

    .answer {
        font-size: 14px;
        line-height: 130%;
        letter-spacing: -0.14px;
    }

    .btn {
        white-space: nowrap;
        min-width: 220px;
        padding: 12px;
        color: var(--color-blue);
        text-align: center;
    }
}

[data-name=user_accesable] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


.additional_services {

    .content {
        max-width: 630px;
        margin: 0 auto;
    }

    .subtitle {
        font-size: 20px;
        line-height: 110%;
        letter-spacing: -0.2px;
        text-align: center;
        margin-bottom: 30px;
    }

    .grid-services {
        --gap: 20px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: var(--gap);
        margin-bottom: 40px;

        @media(max-width: 767px){
            grid-template-columns: 1fr;
            padding: 0 15px;
        }

        .item {

            display: flex;
            flex-direction: column;
            border-radius: 10px;
            overflow: hidden;

            .image {
                height: 51%;
            }

            .texts {
                height: 51%;
                background: var(--color-blue);
                color: #fff;
                padding: 20px;
                text-align: center;

                .title {
                    font-size: 20px;
                    font-weight: 600;
                    line-height: normal;
                    letter-spacing: -0.6px;
                    text-transform: uppercase;
                    margin-bottom: 10px;
                }
            }
        }
    }
}

blockquote {
    border-radius: 10px;
    padding: 15px 20px 15px 40px;
    background: var(--color-gray-light);
    line-height: 130%;
    position: relative;

    @media (max-width: 767px) {
        padding-top: 35px;

    }

    &:before {
        --border: 5px;
        --size: calc(45px + var(--border));
        content: '!';
        border: var(--border) solid #fff;
        background: var(--color-orange);
        border-radius: 100%;
        position: absolute;
        height: var(--size);
        width: var(--size);
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 30px;
        font-style: normal;
        font-weight: 700;
        line-height: 110%;
        letter-spacing: -0.9px;
        color: #fff;
        left: calc(calc(var(--size) / 2) * -1);
        top: calc(50% - calc(var(--size) / 2));

        @media(max-width: 767px){
            left: 0;
            right: 0;
            top: calc(calc(var(--size) / 2) * -1);
            margin: 0 auto;
        }

    }
}


/* END Different blocks */


/* Footer */

.header .flex {
    justify-content: space-between;
    gap: 30px;

    @media (min-width: 1025px) {
        gap: 30px;
    }
}

.site-navigation {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;


}

.header_menu {
    flex: 1;
    display: flex;
    justify-content: center;
}

.header_info {
    flex-shrink: 0;
}



body.home .lang_block {
    @media (min-width: 1025px) {
        color: var(--color-orange);
    }
}

.footer {
    margin-top: 150px;
    position: relative;

    @media (min-width: 860px) {
        background: #232D53;
        background: linear-gradient(90deg, var(--color-blue), var(--color-blue) 41.4%, var(--color-gray-light) 40%, var(--color-gray-light) 100%);
    }
    @media (max-width: 859px) {
        .container{
            --padd: 0;
        }
    }


    @media (max-width: 1024px) {
        margin-top: 80px;
    }

    @media (max-width: 640px) {
        text-align: center;
    }

    a {
        transition: color ease .25s;

    }

    .footer_grid {
        display: grid;
        grid-template-columns: .8fr 1.2fr;

        @media (max-width: 860px) {
            grid-template-columns: 1fr;
        }

    }
    .footer-l{
        padding: 40px 0 ;
        color: #fff;
        background: var(--color-blue);

        @media (max-width: 860px) {
            padding: 40px 40px;
        }
    }
    .footer-r{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 125px;
        padding: 40px 0 40px 40px;
        background: var(--color-gray-light);

        @media (max-width: 860px) {
            padding: 40px;
        }
    }


    .footer-nav-grid{

        display: grid;
        grid-template-columns: repeat(3, 1fr);
        @media (max-width: 1024px) {
            grid-template-columns: 1fr 1fr;
            gap: 32px;
        }

        @media (max-width: 640px) {
            grid-template-columns: 1fr;
            gap: 28px;
            text-align: center;
        }

    }


    .footer-title {
        font-weight: 600;
        font-size: 14px;
        line-height: 1.2;
        letter-spacing: -0.01em;
        color: var(--color-orange);
        text-transform: uppercase;
        margin-bottom: 16px;
    }

    .footer_brand {
        height: 100%;

        display: flex;
        flex-direction: column;
        justify-content: space-between;

        @media (min-width: 768px) and (max-width: 992px){
            flex-direction: row;
        }

        .brand-about{

        }
        .logo {
            max-width: 124px;
            display: block;
            margin-bottom: 20px;

            @media (max-width: 640px) {
                margin: 0 auto 20px;
            }

            a {
                display: block;
            }

            svg {
                width: 100%;
                height: auto;
            }
        }

        .slogan {
            font-weight: 500;

            line-height: 140%;
            letter-spacing: -0.16px;


        }

        .addresses {
            display: flex;
            flex-direction: column;
            gap: 20px;

            @media (max-width: 640px) {
                align-items: center;
            }
        }

        .address-block {
        }

        .address-title {
            font-weight: 600;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            color: var(--color-gray);
            text-transform: uppercase;
        }

        .address-text {
            font-weight: 500;
            font-size: 14px;
            line-height: 1.3;
            letter-spacing: -0.01em;
            max-width: 250px;

            @media (max-width: 640px) {
                max-width: none;
            }
        }
    }

    .footer_contacts {
        .contacts-list {
            display: flex;
            flex-direction: column;
            gap: 10px;

            @media (max-width: 640px) {
                align-items: center;
            }
        }

        .contact-link {
            font-weight: 500;
            font-size: 16px;
            line-height: 1.3;
            letter-spacing: -0.01em;
            color: var(--color-black);
        }
    }

    .footer_nav {



        .footer_menu {
            ul {
                list-style: none;
                margin: 0;
                padding: 0;
                display: flex;
                flex-direction: column;
                gap: 10px;

                @media (max-width: 640px) {
                    align-items: center;
                }
            }

            a {
                color: var(--color-black);
                font-weight: 500;
                font-size: 16px;
                line-height: 1.3;
                letter-spacing: -0.01em;
            }
        }
    }

    .footer_social {
        display: flex;
        flex-direction: column;
        gap: 14px;

        @media (max-width: 640px) {
            align-items: center;
        }

        .social-btn {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 42px;
            padding: 10px 24px;

            border-radius: 28px;
            font-weight: 500;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            text-align: center;



            @media (max-width: 640px) {
                width: 220px;
            }
        }
    }

    .footer_bottom {
        padding-left: 40px;
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 70px;

        @media (max-width: 640px) {
            flex-direction: column-reverse;
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: 16px;
        }

        .privacy-link {
            font-weight: 500;
            line-height: 130%;
            letter-spacing: -0.16px;
            white-space: nowrap;
            color: #8B91A7
        }

        .copyright {
            font-weight: 500;
            line-height: 130%;
            letter-spacing: -0.16px;
            color: #8B91A7;
            max-width: 360px;

            @media (max-width: 640px) {
                margin-left: 0;
                max-width: none;
                text-align: center;
            }
        }
    }
}

/* END Footer */



.pagination,
.pagination a {
    color: rgba(19, 38, 61, 0.5);
    line-height: 170%;
    letter-spacing: -0.32px;
    text-align: right;
}

.pagination a:hover,
.pagination span {
    color: #13263d;
}

.pagination a,
.pagination span {
    margin: 0px 5px;
}

.pagination .prev svg,
.pagination .next svg {
    margin-bottom: 3px;
}



/* Taxonomy */

.guarantee {
    max-width: 930px;
    margin: 0 auto 40px;
    display: flex;
    justify-content: center;



    .guarantee_wrapper {
        display: inline-flex;
        gap: 20px;
        background: var(--color-blue);
        border-radius: 10px;
        padding: 20px 30px;

        @media (max-width: 1128px){
            flex-wrap: wrap;
        }

        @media (max-width: 767px){
            flex-direction: column;
        }

        .item {
            flex-grow: 1;
            display: flex;
            gap: 15px;
            align-items: center;
            background: #fff;
            border-radius: 30px;
            padding: 5px 30px 5px 5px;
            text-transform: capitalize;

            @media(min-width: 1200px){

            }
        }

    }

}

.tax-products .guarantee{
    @media (max-width: 767px){
        display: none;
    }
}

.taxanomy_top {
    margin-bottom: 40px;

    .section-title {
        margin-bottom: 15px;
    }

    .art {
        text-align: center;
        font-size: 20px;
        line-height: 110%;
        letter-spacing: -0.6px;

    }

    .btn_wrapper {
        margin-top: 30px;
        display: flex;
        gap: 30px;
        justify-content: center;


        @media (max-width: 767px) {
            flex-direction: column;
            align-items: center;
        }

        button {
            text-transform: capitalize;
            min-width: 245px;
            display: inline-flex;
            justify-content: center;

        }

    }


}


.products-list {
    margin-bottom: 100px;
}

.taxonomy_wrapper {

    --gap: 20px;
    justify-content: center;

    gap: var(--gap);

    * {
        transition: all ease .3s;
    }

    .item {
        border-radius: 10px;
        background: var(--color-gray-light);
        width: calc(calc(100% / 2) - var(--gap));
        display: flex;
        flex-direction: column;
        padding: 30px;


        @media (max-width: 767px) {
            width: 100%;

        }

        .info {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 50px;

            @media (max-width: 767px){
                padding-top: 20px;
                display: flex;
                flex-direction: column-reverse;
                row-gap: 0;
            }
        }

        .r{
            display: flex;
            align-items: center;
        }

        .l{
            @media (max-width: 767px){
                display: flex;
                flex-direction: column;
                align-items: center;
            }
        }


        .name {
            font-size: 20px;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -0.6px;
            text-transform: uppercase;
            color: var(--color-blue);
            margin-bottom: 10px;
            display: block;
        }

        .art {
            text-transform: uppercase;
        }

        .img {
            max-width: 255px;
            display: flex;
            justify-content: center;
            margin: 0 auto;

            img {
                height: auto;
            }
        }

        .specs {
            padding-top: 30px;
            display: flex;
            flex-direction: column;
            row-gap: 20px;
            font-size: 14px;
            font-weight: 300;
            line-height: 120%;
            letter-spacing: -0.14px;
            margin-bottom: 20px;

            .param {
                display: flex;
                align-items: center;
                gap: 10px;
                background: #fff;
                padding: 6px 30px 6px 6px;
                border-radius: 40px;

                .text {
                    display: flex;
                    flex-direction: column;
                }

                .name {

                }

                .val {
                    font-weight: 500;
                }
            }

            .icon {
                --size: 35px;
                min-width: var(--size);
                max-width: var(--size);
                height: var(--size);
                display: flex;
                justify-content: center;
                align-items: center;
                background: var(--color-blue);
                border-radius: 100%;

            }
        }

        .btn {
            display: inline-flex;
        }

        &:hover {

            .name {
                font-weight: 700;
            }

            .img {
                img {
                    transform: scale(1.05);
                }
            }
        }
    }

}

/* END Taxonomy */


/* Product */
.single-product{

}

.product_top{

    .grid{
        grid-template-columns: 1fr minmax(390px, .4fr);
        grid-gap: 20px;

        @media (max-width: 860px){
            grid-template-columns: 1fr 1fr;
        }

        @media (max-width: 767px){
            grid-template-columns: 1fr;
        }

        .section-title{
            @media (max-width: 767px){
                text-align: center;
            }
        }

        .l{
            background: var(--color-gray-light);
            padding: 40px;
            display: flex;
            border-radius: 20px;
            flex-direction: column;
            justify-content: space-between;
            row-gap: 30px;

            @media (max-width: 767px){

                align-items: center;
                text-align: center;

            }

        }

        .r{
            background: var(--color-gray-light);
            padding: 30px;
            border-radius: 20px;
            display: flex;
            align-items: center;
        }

        .guarantee{
            margin: 20px 0 0 0 ;

            @media (max-width: 860px){
                justify-content: flex-start;

            }

            @media (max-width: 767px){
                justify-content: center;

            }

            .guarantee_wrapper{
                padding: 0;
                justify-content: flex-start;

                @media (max-width: 860px){
                    flex-direction: column;
                    align-items: center;

                }

            }
        }
    }

    .section-title{
        text-align: left;
        margin-bottom: 15px;
    }
    .art{
        font-size: 20px;
    }

    .btn_wrapper{
        display: flex;
        gap: 30px;

        @media (max-width: 767px){
            flex-direction: column;
            align-items: center;
            gap: 20px;
        }

        .btn{
            text-transform: capitalize;

            @media (max-width: 767px){

                min-width: 245px;

            }
        }

    }
}

.characteristics{

    .list{

        column-count: 3;
        column-gap: 30px;

        @media (max-width: 992px){
            column-count: 2;
        }

        @media (max-width: 767px){
            column-count: 1;
        }

        .item{
            break-inside: avoid;
            display: flex;
            gap: 10px;
            align-items: center;
            background: var(--color-gray-light);
            padding: 17px 30px 17px 17px;
            border-radius: 50px;
            margin-bottom: 20px;
            line-height: 122%;

            &:last-child{
                border-radius: 30px;
                align-items: flex-start;
            }

            .icon{
                --size:38px;
                min-width: var(--size);
                max-width: var(--size);
                aspect-ratio: 1/1;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .text{
                display: flex;
                flex-direction: column;

                .val{
                    font-weight: 600;
                }
            }


        }
    }

}

.table_product{
    .table_text{
        margin-top: 30px;
        text-align: center;
    }

    .table_item{
        &:not(:first-child){
            margin-top: 40px;
        }

        .rows_2{
            gap: 20px;
            max-width: 800px;
            margin: 0 auto;

            @media (max-width: 767px) {
                flex-direction: column;
            }
        }
    }
}

.blueprints{
    .schemes{
        display: flex;
        justify-content: center;

        .img{
            max-width: 625px;
        }
    }
}

.product_description{
    padding: 40px;
    background: var(--color-gray-light);
    border-radius: 20px;
    color: var(--color-blue);

    .section-title-mid{
        text-align: left;
        margin: 0 0 20px;
    }

    p:not(:first-child){
        margin-top: 20px;
    }

    ul{
        display: flex;
        flex-direction: column;
        row-gap: 5px;
    }

    .product_galereya{
        margin-top: 40px;
    }

    .swiper-slide{

        .item{
            aspect-ratio: 1/1;
            background: #fff;
            border-radius: 10px;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 20px;

            a{
                display: flex;

            }


        }


    }

}




/* END Product */


/* About page */

.about-company{

    max-width: 700px;
    margin: 0 auto  ;
    background: var(--color-gray-light);
    padding: 40px;
    border-radius: 20px;

    margin-bottom: 50px;

    .text{
        text-align: center;
    }

    .grid{
        margin-top: 40px;
        grid-template-columns: 1fr minmax(260px, .4fr);
        grid-gap: 40px;

        @media (max-width: 767px) {
            grid-template-columns: 1fr;
            text-align: center;
        }

        .img{
            border-radius: 15px;
            overflow: hidden;
        }

        h2{
            margin-bottom: 20px;
            font-size: 36px;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -1.08px;
        }

        ul{
            margin: 0;
            padding: 0 0 0 10px;

            @media (max-width: 767px){
                display: flex;
                flex-direction: column;
                align-items: center;
            }
        }
    }

}

.about_photo{

    .mobile{
        padding: 0 50px;
        text-align: center;
        @media (min-width: 768px){
            display: none;
        }
    }

    .gallery{
        --gap: 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px var(--gap);

        @media (max-width: 767px){
            display: none;
        }

        .item{
            --count: 5;
            width: calc(calc(100% / var(--count)) - var(--gap));
            text-align: center;

            @media (max-width: 1024px){
                --count: 4;
            }
            @media (max-width: 992px){
                --count: 3;

            }@media (max-width: 860px){
            --count: 2;
        }
        }
    }

    .img{
        border-radius: 10px;
        overflow: hidden;
        margin-bottom: 15px;
    }

    .note{
        display: flex;
        gap: 20px;
        max-width: 795px;
        margin: 50px auto 0;

        @media (min-width: 768px){
            align-items: center;
        }

        .photo{
            min-width: 83px;
            aspect-ratio: 1/1;

            @media (max-width: 767px){
                min-width: 53px;
            }
        }

        .text{
            background: var(--color-gray-light);
            padding: 10px;
            border-radius: 5px;
        }
    }
}

.about_advantages{

    .list{
        --gap: 20px;
        margin-top: 40px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--gap);

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

        .item{
            --count: 3;
            width: calc(calc(100% / var(--count)) - var(--gap));
            padding: 20px;
            background: var(--color-gray-light);
            border-radius: 10px;

            @media (max-width: 992px){
                --count: 2;
            }
        }
    }

    .mobile{
        padding: 30px 20px 0;
        @media (min-width: 768px){
            display: none;
        }
        .swiper-slide{
            height: auto;
        }

        .slide-inner{
            height: 100%;
            padding: 20px;
            background: var(--color-gray-light);
            border-radius: 10px;
        }
    }

    .top{
        display: flex;
        gap: 10px;
        margin-bottom: 30px;


        .icon{
            min-width: 58px;
            aspect-ratio: 1 / 1;
        }
        .title{
            border-radius: 30px;
            padding: 11px 11px 11px 17px;
            background: #fff;
            width: 100%;
            display: flex;
            align-items: center;
        }
    }
    .text{
        text-align: center;
    }
}

.partnering{

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

        @media (max-width: 820px){
            grid-template-columns: 1fr;
        }

        .image{
            position: relative;
            border-radius: 20px;
            overflow: hidden;

            img{


                @media (min-width: 821px){
                    position: absolute;
                    left: 0;
                    top: 0;
                    max-width: unset;
                    height: 100%;
                    width: 100%;
                    object-fit: cover;
                }
            }
        }

        .form{
            background: var(--color-blue);
            color: #fff;
            border-radius: 20px;
            padding: 50px;

            .section-title-mid{
                text-align: left;
                margin-bottom: 15px;
            }

            .v-text-field-outlined {
                &.focused label,
                &.has-content label {
                    top: 0;
                    font-size: 13px;
                    background-color: var(--color-blue);
                    padding: 0 4px;
                    transform: translateY(-50%);
                    color: #fff;
                }
            }
        }

    }



}

/* END About page */



/* Contacts page */

.contacts-grid {
    margin-bottom: 60px;

    .items {
        --gap: 20px;

        display: flex;
        gap: var(--gap);

        @media (max-width: 1200px){
            flex-wrap: wrap;
            justify-content: center;
        }
        @media (max-width: 767px){

            flex-direction: column;

        }

        .contact_item{
            width: calc(100% - var(--gap));
            max-width: 240px;
            display: flex;
            flex-direction: column;
            padding: 20px;
            border-radius: 10px;
            background: var(--color-gray-light);
            gap: var(--gap);

            @media (max-width: 767px){

                width: 100%;
                flex-direction: row;
                max-width: unset;
                align-items: center;

            }

            span{
                background: var(--color-blue);
                color: #fff;
                border-radius: 18px;
                padding: 7px 15px;
            }
            span,
            a,
            p{
                white-space: nowrap;
            }

            a{
                color: var(--color-black);
                &:hover{
                    color: var(--color-orange);
                }
            }
        }

        .contact_social{
            --size: 30px;
            gap: 8px;

            a{
                min-width: var(--size);
                aspect-ratio: 1/1;
                color: var(--color-orange);
                line-height: 0;

                &:hover{
                    color: var(--color-blue);
                }
            }

        }

        .site-icon{
            background: transparent;
            min-width: 80px;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: center;

            svg{
                max-width: 37px;
                height: auto;
            }
        }
    }
}

.contact_map{
    border-radius: 20px;
    overflow: hidden;
    height: 500px;
    min-height: 500px;
    filter: grayscale(100%);
}

/* END Contacts page */



/* Blog page */
.blog_wrapper{
    --gap: 20px;
    --column-count: 3;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    counter-reset: article_item 0;

    .img{
        display: flex;
        justify-content: center;
        align-items: center;
        height: 160px;
        position: relative;
        overflow: hidden;
        border-radius: 5px;
        margin: 0;

        img{
            position: absolute;
            left: 0;
            top: 0;
            max-width: unset;
            height: 100%;
            width: 100%;
            object-fit: cover;

        }
    }

    article{
        counter-increment: article_item;
        width: calc(calc(100% / var(--column-count)) - var(--gap) );
        display: flex;
        flex-direction: column;
        gap: 20px;
        border-radius: 10px;
        padding: 20px;
        background: var(--color-gray-light);

        &:not(:first-child){
            .short-text{
                display: none;
            }
        }

        @media (max-width: 767px) {
            width: 100%;
        }

        @media (max-width: 990px) {
            --column-count: 2;
        }

        @media (min-width: 1200px) {
            --column-count: 4;

            &:first-child{
                width: calc(50% - var(--gap));
                flex-direction: row-reverse;

                .img{
                    width: 45%;
                    min-width: 245px;
                    height: 100%;
                    aspect-ratio: 1/1;
                }

            }

            &:nth-child(2),
            &:nth-child(3){
                width: calc(25% - var(--gap));
            }

        }

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

            span{
                display: flex;
                font-size: 9px;
                font-style: normal;
                font-weight: 600;
                line-height: 110%;
                letter-spacing: 0.09px;

                &:before{
                    content: counter(article_item, decimal-leading-zero);
                    background: var(--color-blue);
                    color: #fff;
                    border-radius: 100%;
                    padding: 8px;
                    aspect-ratio: 1/1;
                    height: 100%;
                }
            }

            .name{
                color: var(--color-blue);
                font-weight: 600;
                text-transform: uppercase;
            }

            .short-text{
                padding-top: 10px;

            }
        }
    }


}

/* END Blog page */

/* END Blog post */

.post-header{
    .grid{
        grid-template-columns: 1fr 1fr;
        grid-gap: 20px;

        @media (max-width: 767px){
            grid-template-columns: 1fr;
        }
    }

    .grid-item{
        border-radius: 20px;
        overflow: hidden;
        position: relative;

        @media (min-width: 1200px) {
            min-height: 395px;
        }

        &.media{
            .image{
                height: 100%;
                width: 100%;
                display: flex;
                img{


                    @media(min-width: 768px){

                        position: absolute;
                        left: 0;
                        top: 0;
                        max-width: unset;
                        height: 100%;
                        width: 100%;
                        object-fit: cover;

                    }
                }

            }
        }

        &.about{
            background: var(--color-gray-light);
            padding: 40px;
            display: flex;
            align-items: center;

            @media (max-width: 767px){

                padding: 20px;

            }

            .content{
                display: flex;
                flex-direction: column;
                row-gap: 20px;
            }
        }
    }

    .title{
        font-size: 36px;
        font-style: normal;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -1.08px;
        margin-bottom: 0;
    }

    .additional-info{
        display: flex;
        gap: 20px;
        margin-top: 20px;

        .item{
            padding: 3px 5px;
            background: var(--color-blue);
            border-radius: 3px;
            color: #fff;
            display: flex;
            align-items: center;
            gap: 5px;
            font-size: 13px;

            .icon{
                line-height: 100%;
            }

        }
    }


}

.page-content-container{
    margin-top: 50px;

    .grid{
        grid-template-columns: minmax(250px, .3fr) 1fr;
        grid-gap: 40px;

        @media (max-width: 1024px){
            grid-template-columns: 1fr;
        }

        .grid-item{
            position: relative;
            overflow: hidden;
        }
    }

    h2,
    h3,
    h4,
    h5{
        font-size: 20px;
        font-weight: 600;
        line-height: 115%;
        letter-spacing: -0.6px;
        text-transform: uppercase;
        margin-bottom: 15px;
    }

    .content{
        font-size: 18px;
        font-style: normal;
        font-weight: 500;
        line-height: 130%;
        letter-spacing: -0.54px;


        p:not(:first-child){
            margin-top: 15px;
        }

        section:not(:first-child){
            margin-top: 40px;
        }

        ul{
            display: flex;
            flex-direction: column;
            row-gap: 15px;

            li{
                display: flex;
                gap: 7px;
                padding-left: 10px;

                &:before{
                    content: '·';
                    color: var(--color-orange);
                }
            }
        }
    }

    .post-navigation{
        padding: 30px;
        border-radius: 10px;
        background: var(--color-gray-light);
        width: 100%;

        @media (max-width: 1024px){
            display: none !important;

        }

        .title{
            font-weight: 600;
            line-height: 140%;
            letter-spacing: -0.48px;
            text-transform: uppercase;
        }

        .navy{
            margin-top: 20px;
            display: flex;
            flex-direction: column;
            row-gap: 15px;



            a{
                &:not(.active){
                    color: var(--color-blue);
                }
            }

        }
    }
}
/* Blog post */






/* POPUP */


.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #404040;
    opacity: 0;
    z-index: -10000;
    transition: opacity ease .3s, z-index ease .01s;
}


body.popup-show .overlay {
    opacity: 0.73;
    z-index: 100;

}



.popup {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: -100;
    max-width: 590px;
    width: 100%;
    background: var(--color-blue);
    color: #fff;
    padding: 50px;
    border-radius: 20px;
    transform: scale(0.5) translate(-50%, -50%);
    transition: scale ease .3s;


    .inner {
        margin: 0 auto;
        position: relative;

        .content {
            display: flex;
            flex-direction: column;
            row-gap: 20px;
            align-items: center;
            position: absolute;
            left: 0;
            top: 0;
            opacity: 0;
            z-index: 0;
            max-height: 0;
            transition: all ease .3s;
        }
    }

    .top {
        text-align: center;
    }

    .title {
        font-size: 36px;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -0.33px;
        margin-bottom: 20px;

    }

    .subtitle {
        font-size: 18px;
        font-weight: 500;
        line-height: 25px;
    }



    .buttons{
        display: flex;
        flex-direction: column;
        align-items: center;
        row-gap: 30px;

        a{
            display: inline-flex;
        }
    }



    .close{
        position: absolute;
        right: -30px;
        top: -30px;
        cursor: pointer;
        z-index: 100;

        span{
            display: block;
            position: relative;
            width: 37px;
            height: 37px;
            border-radius: 50%;
            background-color: white;
            cursor: pointer;
            transition: all ease .3s;


            &:before,
            &:after {
                content: '';
                position: absolute;
                top: 50%;
                left: 50%;
                width: 13px;
                height: 2px;
                background-color: #13263D;
            }

            &:before {
                transform: translate(-50%, -50%) rotate(45deg);
            }

            &:after {
                transform: translate(-50%, -50%) rotate(-45deg);
            }

            &:hover{
                background-color: var(--color-orange);
            }
        }
    }


}


body.popup-show {
    .popup {
        opacity: 1;
        visibility: visible;
        z-index: 1000;
        transform: scale(1) translate(-50%, -50%);
        transition: scale ease .3s, opacity ease .3s, visibility ease .3s, z-index ease .3s;
    }

    &[data-popup="order"]{
        .popup .content.order {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 500px;
        }
    }

    &[data-popup="answer"]{
        .popup .content.answer {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 500px;
            max-width: 378px;
            margin: 0 auto;
        }
    }

    &[data-popup="engineer"]{
        .popup .content.engineer {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 500px;
            max-width: 378px;
            margin: 0 auto;
        }
    }

    &[data-popup="thanks"]{
        .popup .content.thanks {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 600px;
            max-width: 378px;
            margin: 0 auto;
        }
    }

    &[data-popup="quiz"]{
        .popup .content.quiz {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 600px;
            max-width: 378px;
            margin: 0 auto;
        }
    }

    &[data-popup="catalog"]{
        .popup .content.catalog {
            position: relative;
            opacity: 1;
            z-index: 10;

            max-height: 600px;
            max-width: 378px;
            margin: 0 auto;
        }
    }

}




/* END POPUPS */


/* TABLES */

.tables {
    --border: 1px solid var(--color-gray);
    --table-gap: 20px;

    .table-container {
        margin-top: 60px
    }

    .text-after {
        margin-top: 30px
    }

    .tables-group {
        display: flex;
        flex-wrap: wrap;
        gap: var(--table-gap)
    }

    .table {
        position: relative;
        margin: 0 auto;
        width: 100%;
        max-width: calc(1200px - var(--padd));
        overflow-X: auto;
        padding-bottom: 30px;
        &.bigdata {
            max-width: unset;
            padding: 0 var(--padd) 30px;
            left: 50%;
            right: 50%;
            margin-left: -50vw;
            margin-right: -50vw;
            width: 100vw;
            cursor: grab;
            user-select: none;
            &:active {
                cursor: grabbing
            }
        }

        @media(min-width: 1200px) {
            &.full {
                width:100%
            }

            &.half {
                width: calc(50% - var(--table-gap))
            }

            &.third {
                width: calc(calc(100% / 3) - var(--table-gap))
            }
        }

        .table_title {
            margin-bottom: 20px;
            text-align: center;
            font-size: 20px
        }

        table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
            thead {
                color: #fff
            }

            th {
                background: var(--color-blue);
                position: sticky;
                top: 0;
                padding: 15px 30px;
                text-align: center;
                box-shadow: inset 0 4px 4px 0 rgb(0 0 0 / .25);
                border-top: var(--border);
                @media (max-width: 1199px) {
                    padding:16px
                }

                &:first-child {
                    border-left: var(--border);
                    border-radius: 10px 0 0 0
                }

                &:last-child {
                    border-right: var(--border);
                    border-radius: 0 10px 0 0
                }
            }

            tr {
                &:nth-child(even) {
                background-color:#F6F8FA
            }

                td {
                    white-space: nowrap;
                    padding: 15px 30px;
                    text-align: center;
                    @media (max-width: 1199px) {
                        padding:16px
                    }

                    &:first-child {
                        border-left: var(--border)
                    }

                    &:last-child {
                        border-right: var(--border)
                    }
                }

                &:last-child {
                    td {
                        border-bottom: var(--border);
                        &:first-child {
                            border-left: var(--border);
                            border-radius: 0 0 0 10px
                        }

                        &:last-child {
                            border-right: var(--border);
                            border-radius: 0 0 10px 0
                        }
                    }
                }
            }
        }
    }
}


/* END TABLES */







/* ==========================================================================
   Catalog (taxonomy-products.php) + product card
   ========================================================================== */

.catalog-tax {
    .catalog-tax_header {
        margin: 30px 0 40px;
        text-align: center;

        .section-title{
            margin-bottom: 15px;
        }
    }

    .catalog-tax_grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;

        @media (max-width: 768px) {
            grid-template-columns: 1fr;
        }
    }

    .catalog-tax_actions {
        margin-top: 40px;
        display: flex;
        gap: 16px;
        justify-content: center;
        flex-wrap: wrap;

        .btn {
            min-width: 245px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        @media (max-width: 480px) {
            .btn { min-width: 0; width: 100%; }
        }
    }

    .catalog-tax_quest {
        margin: 50px 0;
    }

    .catalog-tax_wtk {
        margin: 50px 0;
    }

    .questionnaire{
        margin:150px auto ;
    }
}

.product-card {
    background: var(--color-gray-light);
    border-radius: 10px;
    padding: 24px;


    transition: background ease .25s;

    .product-card-content{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;

        @media (max-width: 480px) {
           display: flex;
            flex-direction: column-reverse;

        }
    }

    @media (max-width: 480px) {
        grid-template-columns: 1fr;
    }

    .product-card_text {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 20px;
    }

    .product-card_name {
        display: block;
        font-weight: 600;
        font-size: 20px;
        line-height: 1.2;
        letter-spacing: -0.02em;
        color: var(--color-blue);
        text-transform: uppercase;
        margin-bottom: 10px;
        &:hover { color: var(--color-orange); }
    }

    .product-card_sku {
        font-weight: 500;
        line-height: 120%;
        letter-spacing: -0.16px;
        text-transform: capitalize;
        color: var(--color-black);
    }

    .product-card_specs {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;

        li {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 6px 10px;
            background: #fff;
            border-radius: 16px;
            font-size: 12px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            color: var(--color-blue);

            &::before { display: none !important; }

            &:hover{
                .icon{
                    img{
                        filter:  invert(1);
                    }
                }
            }
        }

        .icon {
            --size: 35px;
            width: var(--size);
            height: var(--size);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;

            img {
                width: 100%;
                height: 100%;
                object-fit: contain;
                transition: all ease .3s;
            }
        }

        .info {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .key {
            font-weight: 600;
            color: var(--color-blue);
        }

        .val {
            font-weight: 500;
            color: var(--color-black);
        }
    }

    .product-card_btn {
        margin-top: 6px;
        align-self: flex-start;
        min-width: 151px;
        min-height: 52px;
        padding: 12px 24px;
        font-size: 15px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .product-card_photo {

        border-radius: 5px;


        @media (min-width: 490px) {
            background: #fff;
        }

        .image{
            aspect-ratio: 1;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
            transition: transform ease .3s;
        }

        &:hover img { transform: scale(1.04); }
    }
}

/* ==========================================================================
   Single product (single-product.php)
   ========================================================================== */

.single-product-page {
    .product-hero {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 40px;
        margin: 0 0 160px;
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 30px;
        align-items: center;

        @media (max-width: 768px) {
            grid-template-columns: 1fr;
            padding: 0;
            background: #fff;

            .product-hero_photo,
            .product-hero_text{
                background: var(--color-gray-light);
                border-radius: 10px;
                padding: 20px;
            }
        }



        .product-hero_title {
            margin: 0 0 10px;

            font-size: 45px;
            font-style: normal;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -1.35px;
            color: var(--color-blue);

            @media (max-width: 768px) {
                font-size: 22px;
            }
        }

        .product-hero_sku {
            
            font-weight: 500;
            color: var(--color-black);
            margin-bottom: 30px;
        }

        .product-hero_buttons {
            display: flex;
            gap: 14px;
            flex-wrap: wrap;

            .btn {
                min-width: 245px;
                min-height: 56px;
                padding: 12px 24px;
                font-size: 15px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
            }

            @media (max-width: 480px) {
                .btn { min-width: 0; width: 100%; }
            }
        }

        .product-hero_photo {
            display: flex;
            align-items: center;
            justify-content: center;
            aspect-ratio: 1;

            border-radius: 5px;

            @media (min-width: 767px) {
                background-color: #fff;
            }

            img {
                max-width: 100%;
                max-height: 100%;
                object-fit: contain;
            }
        }

        .guarantee{
             margin: 30px 0 0;

            .guarantee_wrapper{
                padding: 0;
                background-color: transparent;




                .item{
                    padding: 5px 15px 5px 5px;
                }
            }
        }

    }

    .product-section {
        margin: 60px 0;

        @media (max-width: 768px) {
            margin: 40px 0;
        }
    }

    .product-section_title {
        text-align: center;
        
        font-weight: 600;
        font-size: 26px;
        line-height: 1.1;
        letter-spacing: -0.03em;
        color: var(--color-blue);
        text-transform: uppercase;
        margin-bottom: 30px;

        @media (max-width: 768px) {
            font-size: 20px;
        }
    }

    .product-specs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px 24px;

        @media (max-width: 640px) {
            grid-template-columns: 1fr;
        }

        li {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 17px;
            border-radius: 50px;
            background: var(--color-gray-light);
            font-size: 14px;
            line-height: 1.3;
            color: var(--color-blue);

            &::before { display: none !important; }

            .icon {
                --size: 35px;
                width: var(--size);
                height: var(--size);
                border-radius: 50%;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                transition: all ease .3s;

                img {
                    width: 100%;
                    height: 100%;
                }
            }
            &:hover{
                .icon{

                    filter:  invert(1);
                }
            }
        }
    }

    .product-drawings {
        column-count: 4;
        text-align: center;
        gap: 16px;

        &.items-1{
            display: flex;
            justify-content: center;

        }

        &.items-2{
            column-count: 2;

        }

        &.items-3{
            column-count: 3;

        }


        @media (max-width: 768px) {
            column-count: 2;
        }

        @media (max-width: 480px) {
            columns: unset;
        }

        .drawing {
            max-height: 70vh;
            background: var(--color-gray-light);
            border-radius: 8px;
            padding: 18px;
            text-align: center;
            aspect-ratio: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 12px;

            img {
                max-width: 100%;
                max-height: 70%;
                object-fit: contain;
            }

            .label {
                font-size: 12px;
                color: var(--color-black);
            }
        }
    }



    .product-table_after{
        blockquote{
            background-color: #fff;
            margin: 40px auto;
            text-align: center;
            &:before{
                display: none;
            }

        }

    }

    .product-description {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 30px;
        
        font-weight: 500;
        font-size: 15px;
        line-height: 1.5;
        color: var(--color-black);

        .heading {
            font-size: 36px;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -1.08px;
            color: var(--color-blue);
            margin-bottom: 20px;

        }

        ul {
            list-style: none;
            padding: 0;
            margin: 14px 0;

            li {
                position: relative;
                padding-left: 22px;
                margin-bottom: 8px;

                &::before {
                    content: "";
                    position: absolute;
                    left: 0;
                    top: 0.6em;
                    width: 8px;
                    height: 8px;
                    border-radius: 50%;
                    background: var(--color-orange);
                }
            }
        }
    }

    .product-gallery{

        margin-top: 40px;

        .gallery-item{
            display: flex;
            height: 100%;
            width: 100%;
            background: #fff;
            border-radius: 5px;
            padding: 20px;
        }

        .swiper-button-prev,
        .swiper-button-next {
            background: #fff;
            color: var(--color-blue);
        }
    }
}

/* ==========================================================================
   404 page
   ========================================================================== */

.not-found-page {
    padding: 60px 0;
}

.not-found {
    .not-found_inner {
        position: relative;
        background: var(--color-gray-light);
        border-radius: 16px;
        padding: 100px 30px;
        overflow: hidden;
        text-align: center;

        @media (max-width: 768px) {
            padding: 60px 20px;
        }
    }

    .not-found_digits {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        
        font-weight: 700;
        font-size: 380px;
        line-height: 0.85;
        letter-spacing: -0.08em;
        color: rgba(255, 255, 255, 0.95);
        pointer-events: none;
        z-index: 0;
        white-space: nowrap;

        @media (max-width: 768px) {
            font-size: 220px;
        }

        @media (max-width: 480px) {
            font-size: 160px;
        }
    }

    .not-found_content {
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .not-found_title {
        margin: 0;
        
        font-weight: 600;
        font-size: 36px;
        line-height: 1.1;
        letter-spacing: -0.03em;
        color: var(--color-blue);

        @media (max-width: 768px) {
            font-size: 26px;
        }
    }

    .not-found_text {
        margin: 0;
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.4;
        letter-spacing: -0.01em;
        color: var(--color-black);
        max-width: 360px;
    }

    .not-found_btn {
        margin-top: 10px;
        min-width: 245px;
        min-height: 56px;
        padding: 12px 26px;
        font-size: 16px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* ==========================================================================
   News page (archive-news.php)
   ========================================================================== */

.news-archive {
    .section-title {
        margin-bottom: 50px;
    }
}

.news-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 30px;
    align-items: start;

    @media (max-width: 1024px) {
        grid-template-columns: 1fr;
    }
}

.news-items {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.news-card {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 10px;


    &:hover {
        .news-card_body {
            background: #eef0f4;
        }
    }

    .photo {
        display: block;
        aspect-ratio: 1;
        border-radius: 10px;
        overflow: hidden;
        background: #fff;

        @media (max-width: 480px) {
            width: 100%;
            max-height: 161px;
        }


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

    .news-card_body {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 20px;
        transition: background ease .25s;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 14px;
    }

    .title {
        margin: 0;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -0.48px;
        text-transform: uppercase;
        color: var(--color-blue);

        a {
            color: inherit;
            transition: color ease .25s;

            &:hover {
                color: var(--color-orange);
            }
        }
    }

    .date {
        align-self: flex-start;
        padding: 6px 14px;
        background: var(--color-blue);
        color: #fff;
        border-radius: 20px;
        font-size: 13px;
        font-weight: 500;
        letter-spacing: -0.01em;
    }

    @media (max-width: 480px) {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 12px;
    }
}

.news-load-more {
    margin-top: 30px;
    display: flex;
    justify-content: flex-start;

    .btn {
        min-width: 220px;
        padding: 16px 32px;
        font-size: 16px;
    }
}

.news-sidebar {
    position: sticky;
    top: 100px;

    @media (max-width: 1024px) {
        position: static;
    }
}

.wpcf7-acceptance.negative{
    display: none !important;
}

.news-form {
    background: var(--color-blue);
    border-radius: 18px;
    padding: 30px;
    color: #fff;


    .news-form_heading {
        display: inline-block;
        background: rgba(255, 255, 255, 0.08);
        border-radius: 8px;
        padding: 8px 16px;
        margin-bottom: 20px;
        font-size: 36px;
        font-style: normal;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -1.08px;
        color: #fff;
    }

    .news-form_sub {
        font-weight: 500;
        margin-bottom: 30px;
    }

    .btn-submit{
        width: 100%;
    }


}


.contact-form-wrapper{
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    margin-bottom: 30px;


}

.wpcf7-form{
    .agreement{
        display: flex;
        gap: 5px;
    }

    .wpcf7-list-item{
        margin:0 ;
    }
}


.blog-empty {
    padding: 40px;
    background: var(--color-gray-light);
    border-radius: 14px;
    text-align: center;
    color: var(--color-black);
}

/* ==========================================================================
   Contacts page (page-contact.php)
   ========================================================================== */

.contacts-page {
    .contacts-header {
        padding-top: 40px;
        margin-bottom: 30px;
        text-align: center;
    }

    .section-subtitle{
        font-size: 20px;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -0.6px;
        text-transform: uppercase;
    }

    .contacts-engineering {
        margin-bottom: 30px;
    }

    .contacts-engineering_card {
        background: var(--color-blue);
        color: #fff;
        border-radius: 10px;
        padding: 20px 30px;
        display: flex;
        align-items: center;
        gap: 30px;
        flex-wrap: wrap;
        margin: 0 auto;
        max-width: 1000px;

        .label {
            
            font-weight: 600;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            text-transform: uppercase;
            max-width: 220px;

            @media (max-width: 767px) {
                margin: 0 auto;
               text-align: center;
            }
        }

        .items {
            display: flex;
            align-items: center;
            gap: 24px;
            flex-wrap: wrap;

            @media (max-width: 767px) {
                width: 100% ;
                justify-content: center;
            }
        }

        .item {
            display: flex;
            align-items: center;
            gap: 12px;

            @media (max-width: 767px) {
                flex-direction: column;
                justify-content: center;
                width: 100%;
            }

            .num {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 24px;
                height: 24px;
                border-radius: 50%;
                background: var(--color-orange);
                color: #fff;
                font-weight: 600;
                font-size: 13px;
            }

            .link {
                color: #fff;
                font-weight: 500;
                font-size: 14px;
                letter-spacing: -0.01em;

                &:hover { color: var(--color-orange); }
            }
        }
    }

    .contacts-addresses_grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;



        @media (max-width: 640px) {
            grid-template-columns: 1fr;
        }
    }

    .address-card {
        --background-color: var(--color-gray-light);
        --text-color: var(--color-blue);
        position: relative;
        background: var(--background-color);
        color: var(--text-color);
        border-radius: 10px;
        padding: 20px;
        transition: all ease .2s;



        &.is-clickable {
            cursor: pointer;

            &:hover {
                transform: translateY(-2px);
            }
        }

        &.is-active {
            --background-color: var(--color-blue);
            --text-color: var(--color-gray-light);
        }

        .flag {
            position: absolute;
            top: 26px;
            left: 20px;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background: var(--color-orange);
            box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
        }

        .title {

            font-weight: 600;
            font-size: 14px;
            line-height: 1.2;
            letter-spacing: -0.01em;
            text-transform: uppercase;
            margin-bottom: 12px;
        }

        .text {
            font-size: 14px;
            line-height: 1.4;
        }
    }

    .contacts-map {
        margin: 30px 0;
    }

    .contacts-map_inner {
        border-radius: 10px;
        overflow: hidden;
        background: var(--color-gray-light);

        iframe {
            display: block;
            width: 100%;
            min-height: 400px;
            border: 0;
        }
    }

    .contacts-map_canvas {
        width: 100%;
        height: 520px;
        background: var(--color-gray-light);

        @media (max-width: 1024px) {
            height: 420px;
        }

        @media (max-width: 640px) {
            height: 360px;
        }

        .leaflet-control-attribution {
            font-size: 10px;
        }
    }

    .zondex-marker_wrap {
        background: transparent !important;
        border: 0 !important;
    }

    .zondex-marker {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 14px 6px 6px;
        background: #fff;
        border-radius: 24px;
        box-shadow: 0 4px 14px rgba(35, 45, 83, 0.18);
        font-weight: 600;
        font-size: 13px;
        line-height: 1;
        color: var(--color-blue);
        white-space: nowrap;
        transform: translate(-50%, calc(-100% - 6px));

        &::after {
            content: "";
            position: absolute;
            left: 50%;
            top: 100%;
            margin-left: -6px;
            border: 6px solid transparent;
            border-top-color: #fff;
        }

        .zondex-marker_dot {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--color-blue);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            flex: 0 0 24px;

            svg {
                width: 12px;
                height: 12px;
            }
        }
    }

    .contacts-map_buttons {
        margin-top: 40px;
        display: flex;
        gap: 16px;
        justify-content: center;
        flex-wrap: wrap;

        .btn {
            min-width: 245px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        @media (max-width: 480px) {
            .btn { min-width: 0; width: 100%; }
        }
    }

    .contacts-form {
        margin-top: 60px;
    }

    .contacts-form_card {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 50px 40px;
        text-align: center;

        .heading {
            
            font-weight: 600;
            font-size: 28px;
            line-height: 1.2;
            letter-spacing: -0.03em;
            color: var(--color-blue);
            margin-bottom: 8px;
        }

        .sub {
            font-size: 14px;
            color: var(--color-black);
            margin-bottom: 28px;
        }

        @media (max-width: 640px) {
            padding: 30px 20px;
            .heading { font-size: 22px; }
        }
    }

    .contacts-form{
        --gap: 20px;
        .form-container{
            padding: 50px 68px;
            background: var(--color-gray-light);
            border-radius: 10px;

            @media (max-width: 767px) {
                padding: 40px 28px;
            }
        }

        .form{
            margin-top: 30px;
            display: flex;
            gap:var(--gap);

            @media (max-width: 767px) {
                flex-direction: column;
            }

            .btn{
                padding: 18px 40px;

                @media (max-width: 767px) {
                   width: 100%;
                }
            }
        }

        .contact-form-wrapper{
            display: flex;
            flex-direction: row;
            gap:var(--gap);
            @media (max-width: 767px) {
                flex-direction: column;
            }

            .input_item{
                width: 50%;

                @media (max-width: 767px) {
                    width: 100%;
                }

                input{
                    border: none;
                }
            }


        }
    }

    .socials-contact{
        margin: 40px auto 150px;

        .social-grid{
            display: flex;
            align-items: center;
            gap: 20px;
            background: var(--color-blue);
            margin: 0 auto;
            max-width: 715px;
            border-radius: 10px;
            padding: 15px 30px;

            @media (max-width: 767px) {
                flex-direction: column;
                padding: 40px;
            }
        }

        .title{
            color: #fff;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -0.16px;
            text-transform: uppercase;
        }
        a{
            display: flex;
        }
    }
}

/*  About page */
.about-page {
    .section-title{
        font-size: 45px;
        font-weight: 600;
        line-height: 110%;
        letter-spacing: -1.35px;
        margin-bottom: 20px;
    }
    .section-subtitle{
        color: var(--color-black);
        text-align: center;
        font-size: 24px;
        font-weight: 500;
        line-height: 110%;
        letter-spacing: -0.72px;
    }
    .about-header {
        margin-bottom: 40px;
        text-align: center;
    }

    .about-factory {
        margin-bottom: 60px;
    }

    .about-factory_card {
        background: var(--color-gray-light);
        border-radius: 10px;
        padding: 40px;
        display: grid;
        grid-template-columns: 265px 1fr;
        gap: 65px;

        @media (max-width: 767px) {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .factory_video_text{
            font-size: 24px;
            font-weight: 600;
            line-height: 110%;
            letter-spacing: -0.72px;
            margin-bottom: 30px;
            color: var(--color-blue);
        }

        .photo {
            position: relative;
            border-radius: 8px;
            overflow: hidden;
            aspect-ratio: 16 / 9;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
            }

            .play {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 70px;
                height: 70px;

                display: flex;
                align-items: center;
                justify-content: center;
                transition: transform ease .25s;

                &:hover { transform: translate(-50%, -50%) scale(1.08); }
            }
        }

        .about-factory_btn {
            justify-self: start;
            min-width: 245px;
            min-height: 64px;
            padding: 12px 26px;
            font-size: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;

            @media (max-width: 767px) {
                display: none;
            }
        }

        @media (max-width: 480px) {
            .about-factory_btn { width: 100%; }
        }
    }

    .about-intro {

        margin: 0 auto 60px;

    }

    .about-intro_grid {
        display: grid;
        grid-template-columns: 490px 1fr;
        gap: 30px;
        align-items: center;

        @media (max-width: 768px) {
            grid-template-columns: 1fr;
        }

        .photo {
            border-radius: 10px;

            aspect-ratio: 490 / 303;
            position: relative;

            img {

            }

            .quote-ico{
                position: absolute;
                top: -15px;
                left: 28px;
            }
        }

        .text {
            
            font-weight: 500;
            font-size: 15px;
            line-height: 1.5;
            letter-spacing: -0.01em;
            color: var(--color-black);

            p:not(:first-child){
                margin-top: 15px;
            }
        }
    }

    .about-gallery {

        .about-gallery_grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-auto-rows: 8px;
            gap: 12px;

            @media (max-width: 1024px) {
                grid-template-columns: repeat(3, 1fr);
            }

            @media (max-width: 640px) {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        .gallery-item {
            display: block;
            grid-row: span 30;
            border-radius: 8px;
            overflow: hidden;
            background: var(--color-gray-light);

            img {
                display: block;
                width: 100%;
                height: 100%;
                object-fit: cover;
                transition: transform ease .35s;
            }

            &:hover img { transform: scale(1.05); }

            &.is-hidden { display: none; }
        }

        .about-gallery_action {
            margin-top: 30px;
            display: flex;
            justify-content: center;

            .btn {
                min-width: 245px;
                min-height: 64px;
                padding: 12px 26px;
                font-size: 16px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
            }

            .about-gallery_more {
                border: 0;
                cursor: pointer;
                font: inherit;
            }
        }
    }

    .about-standards {
        overflow-x: clip;



        .about-standards_video {
            position: relative;
            margin: 30px auto 0;
            max-width: 795px;
            border-radius: 10px;
            overflow: hidden;
            aspect-ratio: 16 / 7;
            background: var(--color-gray-light);

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

            .play {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 61px;
                height: 61px;
                display: flex;
                align-items: center;
                justify-content: center;
            }
        }

        .about-standards_slider {
            margin-top: 30px;

            .swiper{
                overflow: visible;
            }
        }

        .cert {
            display: block;
            border-radius: 8px;
            overflow: hidden;
            background: var(--color-gray-light);
            aspect-ratio: 286 / 222;


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

        .swiper-nav_container {
            margin-top: 24px;
            display: flex;
            justify-content: center;
        }
    }
}


.single-blog{

}


/* ==========================================================================
   ACF Block: Text panel (orange / blue)
   ========================================================================== */

.text-panel {
    border-radius: 10px;
    padding: 24px 30px;
    margin: 24px 0;

    .text-panel_body {

        font-weight: 500;
        font-size: 15px;
        line-height: 1.5;
        letter-spacing: -0.01em;

        p:last-child {
            margin-bottom: 0;
        }

        a {
            color: inherit;
            text-decoration: underline;
        }
    }

    &.text-panel--orange {
        background: var(--color-orange);
        color: #fff;
    }

    &.text-panel--blue {
        background: var(--color-blue);
        color: #fff;
    }

    @media (max-width: 640px) {
        padding: 20px 20px;
    }
}

/* ==========================================================================
   ACF Block: Double image
   ========================================================================== */

.double-image {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 24px 0;

    .double-image_item {
        border-radius: 10px;
        overflow: hidden;

        img {
            display: block;
            width: 100%;
            height: auto;
        }
    }

    @media (max-width: 640px) {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* ==========================================================================
   ACF Block: Image slider
   ========================================================================== */

.image-slider {
    margin: 24px 0;

    .swiper {
        border-radius: 10px;
        overflow: hidden;
    }

    .swiper-slide {
        img {
            display: block;
            width: 100%;
            height: auto;
        }
    }

    .swiper-nav_container {
        margin-top: 24px;
        display: flex;
        justify-content: center;
    }

    .image-slider_preview {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 10px;

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 6px;
        }
    }
}