/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');

/* Root Variables for Colors, Fonts, and Spacing */
:root {
    --font-primary: 'Montserrat', sans-serif;
    --font-secondary: 'Public Sans', sans-serif;
    --color-primary: #34813A;
    --color-secondary: #6C757D;
    --color-bg: #F8F9FA;
    --color-text: #1E1F1E;
    --color-white: #FFFFFF;
    --color-black: #000;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 2rem;
    --radius: 4px;

    --button-padding: 10px 16px;
    --button-font-family: 'Public Sans', sans-serif;
    --button-font-weight: 500;
    --button-font-size: 18px;
    --button-line-height: normal;
    --button-height: 48px;
    --button-color-primary: #FFF;
    --button-bg-primary: #34813A;
    --button-bg-primary-dark: #84CC18;
    --button-border-secondary: 1px solid #34813A;
    --button-bg-secondary: #FFF;
    --button-bg-tertiary: #D9D9D9;
    --button-color-secondary: #3D9544;
    --button-hover-bg-secondary: #f5f5f5;
    --button-font-size-mobile: 14px;
    --button-line-height-mobile: normal;



    --h1-font-family: 'Montserrat', sans-serif;
    --h1-font-size: 48px;
    --h1-font-weight: 600;
    --h1-line-height: 58.51px;
    --h1-text-align: center;
    --h1-font-size-mobile: 28px;
    --h1-line-height-mobile: 34.13px;

    --h2-font-size: 44px;
    --h2-font-weight: 400;
    --h2-line-height: 51.7px;
    --h2-text-align: center;
    --h2-font-size-mobile: 28px;
    --h2-line-height-mobile: 34.13px;

    --h3-font-size: 34px;
    --h3-font-weight: 300;
    --h3-line-height: 41.45px;
    --h3-text-align: left;
    --h3-font-size-mobile: 18px;
    --h3-line-height-mobile: 21.94px;

    --container-width-desktop: 1240px;
}

/* General Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-secondary);
    color: var(--color-text);
    font-size: 18px;
    font-weight: 400;
    line-height: normal;

    @media (max-width:768px) {
        font-size: 14px;

        p,
        li {
            line-height: 18px;
        }
    }

}

.container {
    width: 1240px;
}

ul {

    list-style: none;
    padding: 0;
    margin: 0;
}

.container-middle {
    margin: 0 auto;
    width: 100%;

    @media (min-width: 768px) {
        width: 100%;
        max-width: var(--container-width-desktop);
    }
}

header {
    width: 100%; 
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
    .navbar.bg-light {
        background-color: #fff !important;
    }

    .navbar-collapse {
        flex-grow: 0;
        transition: all ease-in-out 0.2s;

        .logo-mobile {
            display: none;
        }

        @media (max-width: 768px) {
            padding: 9px 24px;
            position: fixed;
            height: 100%;
            z-index: 9;
            width: 85%;
            background-color: #fff;
            right: -85%;
            top: 0;
            padding-bottom: 24px;
            transition: all ease-in 0.5;

            .logo-mobile {
                display: flex;
            }

            .navbar-nav {
                align-items: normal;
            }

            ul {
                padding: 16px;
                margin-top: 32px;
            }

            li.nav-item {
                margin: 0 !important;
                border-bottom: 1px solid #ECECEC;
                text-align: left;
                padding: 20px 0;
            }

            li:last-child {
                display: flex;
                padding: 24px 0;
                flex-direction: row;
                align-items: center;
                justify-content: center;
            }
        }

        /* &.show{
            @media (max-width: 768px) {
            position: fixed;
            background: white;
            top: 80px;
            z-index: 9;
            left: 0;
        } 
        }*/

    }
}

.header_inner-page {
    background-repeat: no-repeat;
    background-position: center top;

    &.header-about {
        background-image: url(./../images/bg-about.jpg);
    }

    &.header-company-profile {
        background-image: url(./../images/bg-company-profile.jpg);
    }

    &.header-gallery {
        background-image: url(./../images/bg-gallery.jpg);
    }

    &.header-contact-us {
        background-image: url(./../images/bg-contact.jpg);
    }
    
    &.header-terms-condition{
        background-image: url(./../images/bg-contact.jpg);

    }
    &.header-privacy-policy{
        background-image: url(./../images/bg-contact.jpg);

    }

    @media (min-width:768px) {
        background-size: cover;
        background-position: center; 

    }
}

section {
    padding-bottom: 100px;

    @media (max-width: 768px) {
        padding: 16px;
        width: 100%;
    }

    &.home_in-house-brand,
    &.home_testimonials,
    &.about_solution,
    &.about_team,
    &.company-profile--infrastructure,
    &.company-profile--compliance,
    &.company-profile--capacity &.collection {
        padding-top: 100px;
    }

}

h2 {
    span {
        color: #34813A;
    }

    @media (max-width: 768px) {
        text-align: center;
    }
}


.home_expertise,
.company-profile--compliance,
.form_header,
footer {
    h2 {
        color: #fff;

        span {
            color: #fff;
        }
    }
}

/* Navbar */
.navbar {
    padding: 35px 0;
}

.navbar-nav {
    align-items: center;

    .nav-item {
        margin: 0 26px;
        padding: 10px 0;
        position: relative;
        font-size: 16px;
        font-weight: 400;
        line-height: 18.8px;
        text-align: center;

        .nav-link {
            text-decoration: none;
            color: #000;
            padding: 5px 0 0 !important;
            text-transform: uppercase;

            &:hover {
                color: #000;
            }

            &.active {
                color: #000;
                font-weight: 700;

                &:after {
                    content: "\00a0";
                    background: var(--button-bg-primary);
                    width: 15px;
                    height: 3px;
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    margin-top: 10px;
                }
            }
        }

    }

    li:last-child {
        margin-left: 26px;
    }

}

.home_company-profile {
    .container-middle {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;

        @media (min-width:768px) {
            flex-direction: row;

            .profile-header {
                order: 2;
            }

            .profile-img {
                order: 1;
                min-width: 540px;
            }

            .profile-header {
                margin-right: 100px;
                padding: 0 32px;

            }
        }
    }

    .profile-img {
        order: 2;

        img {
            width: 100%;
        }
    }

    .profile-header {
        text-align: left;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding: 24px 0 50px;

        h2 {
            font-weight: 300;
            margin-bottom: 40px;
            text-align: left;

            span {
                font-weight: 500;
                color: var(--color-primary);
            }
        }
    }
}

.home_production {
    padding-top: 0;

    .container-middle {
        display: flex;
        flex-direction: column;
        position: relative;

        .home_production--title {
            max-width: 440px;
            clear: both;

            @media (min-width: 768px) {
                padding-bottom: 50px;
            }

        }



        .home_production--title {
            h2 {
                margin-bottom: 12px;

                span {
                    font-weight: 600;
                    color: revert;
                }
            }

            p {
                span {
                    font-weight: 700;
                    color: var(--button-color-secondary);
                }
            }
        }

        .home_production--list {

            @media (max-width: 768px) {
                order: 2;
            }

            ul {
                display: flex;
                flex-wrap: wrap;

                li {
                    padding: 24px;
                    margin-right: 24px;
                    display: flex;
                    flex-direction: column;

                    &>span {
                        width: 38px;
                        height: 38px;
                        margin-bottom: 24px;
                        clear: both;
                        background-position: left center;
                        background-repeat: no-repeat;
                        background-size: 38px;
                    }

                    h2 {
                        margin-bottom: 12px;
                        font-weight: 500;
                    }

                    p {
                        font-weight: 400;
                        margin-bottom: 0;

                        span {
                            font-weight: 700;
                        }
                    }

                    &:nth-child(1) {
                        background: linear-gradient(135deg, #DBFFDB 8.77%, rgba(236, 244, 236, 0.20) 48.92%);

                        &>span {
                            background-size: 28px;
                        }
                    }

                    &:nth-child(4) {
                        background: linear-gradient(-30deg, #DBFFDB 8.77%, rgba(236, 244, 236, 0.20) 48.92%);
                    }
                }
            }
        }

        .home_production--img {
            width: 100%;

            img {
                width: 100%;
            }
        }

        @media (max-width: 768px) {
            h2 {
                text-align: left;
            }

            .home_production--list {
                padding-top: 24px;
            }

            .home_production--img {
                height: 380px;
                display: flex;

                img {
                    min-width: 100%;
                    max-height: 380px;
                }
            }

        }

        @media (min-width: 768px) {

            .home_production--title,
            .home_production--list {
                width: 55%;
            }

            .home_production--img {
                width: 40%;
                position: absolute;
                right: 0;
                height: 100%;

                img {
                    height: 100%;
                    width: auto;
                }
            }

            .home_production--list {
                ul {
                    flex-direction: row;

                    li {
                        flex: 1 1 calc(50% - 24px);
                        line-height: 24px;
                        margin-bottom: 12px;

                        &>span {
                            width: 58px;
                            height: 58px;
                            margin-bottom: 24px;
                            background-size: 50px;
                        }

                        &:nth-child(1) {
                            &>span {
                                background-size: 40px;
                            }
                        }

                        &:nth-child(3) {
                            &>span {
                                background-size: 58px;
                            }
                        }

                        &:nth-child(4) {
                            background: linear-gradient(135deg, #DBFFDB 8.77%, rgba(236, 244, 236, 0.20) 48.92%);
                        }

                        &:nth-child(3),
                        &:nth-child(4) {
                            margin-bottom: 0;

                        }
                    }
                }
            }
        }
    }

}

.home_clients {
    h2 {
        text-align: center;
        margin-bottom: 40px;

        span {
            color: var(--button-color-secondary);
        }
    }

    h3 {
        font-family: var(--font-primary);
        font-size: 40px;
        font-weight: 300;
        margin-bottom: 24px;

        span {
            font-weight: 600;
            color: var(--button-color-secondary);
        }
    }

    p {
        max-width: 420px;
    }

    @media (min-width:768px) {
        h2 {
            margin-bottom: 72px;
        }
    }

    @media (max-width:768px) {
        text-align: center;
        padding-top: 70px;

        h3 {
            font-size: 18px;
        }
    }

    .home_clients--list {
        ul {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;

            li {
                flex: 1 1 33%;
                padding-bottom: 16px !important;
                text-align: center;

                @media (max-width: 768px) {
                    flex: 1 1 50%;

                    &:last-child {
                        padding-bottom: 0 !important;
                    }

                    img {
                        max-width: 100%;
                        height: 54px;
                    }
                }
            }
        }

        @media (min-width:768px) {
            padding-left: 40px;

            li:last-child {

                &:last-child {
                    text-align: left;
                }
            }

        }
    }
}

.home_in-house-brand {
    background: #000;
    color: #fff;

    .brand--list {
        display: flex;
        flex-direction: row;

        li {
            flex: 1 1 50%;
            padding: 0 48px;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;

            p {
                text-align: center;
                margin: 24px 0;

                span {
                    color: #87FF91;

                }
            }

            img {
                height: 90px;
            }

            &:first-child {
                border-right: 1px solid #B4B4B4;
            }
        }

        .button {
            border: 0;
        }

        @media (max-width:768px) {
            flex-direction: column;

            li {
                padding: 40px 0;

                p {
                    line-height: 18px;
                    margin: 16px 16px 24px;
                }

                &:first-child {
                    border-right: 0;
                    border-bottom: 1px solid #B4B4B4;
                }

            }
        }

        @media (min-width:768px) {
            padding: 0;

            li {
                padding: 0 70px;

                p {

                    line-height: 24px;
                }
            }

            li:first-child {
                padding-left: 0;
            }

            li:last-child {
                padding-right: 0;
            }
        }

    }
}

.icon-production-evalution {
    background-image: url(./../images/icon-evaluation.svg);
}

.icon-production-material {
    background-image: url(./../images/icon-material.svg);
}

.icon-production-prototype {
    background-image: url(./../images/icon-prototype.svg);
}

.icon-production-dispatch {
    background-image: url(./../images/icon-production-dispatch.svg);
}

.icon-customer-quality {
    background-image: url(./../images/icon-quality.svg);
}

.icon-customer-centric {
    background-image: url(./../images/icon-customer-centric.svg);
}

.icon-customer-equipment {
    background-image: url(./../images/icon-equipment.svg);
}

.icon-customer-deliveries {
    background-image: url(./../images/icon-deliveries-globally.svg);
}

.home_customer-satisfaction {
    padding: 0;
    margin-bottom: -200px;
    position: relative;
    z-index: 1;

}

.home_customer-satisfaction .container-middle {
    background: #F7F7F7;
    position: relative;

    h2 {
        text-align: center;
    }

    .home_customer-satisfaction--list {
        ul {
            li {
                padding: 80px 0 24px 0;
                margin: 0 24px;
                position: relative;
                display: flex;
                flex-direction: column;
                border-bottom: 1px solid #DCDCDC;
                text-align: center;

                p {
                    margin-bottom: 0;
                }

                &:last-child {
                    border-bottom: 0;
                }

                &::before {
                    content: "";
                    width: 68px;
                    height: 68px;
                    position: absolute;
                    left: calc(50% - 36px);
                    top: 0;
                    border-radius: 50%;
                    background: radial-gradient(circle, #CCF7D0, rgba(236, 244, 236, 0.2) 48.92%);
                }

                &>span {
                    width: 40px;
                    height: 40px;
                    position: absolute;
                    left: calc(50% - 24px);
                    top: 12px;
                    background-repeat: no-repeat;
                    background-position: center;
                    background-size: 28px;

                }
            }
        }
    }

    @media (min-width:768px) {
        padding: 100px 56px;

        h2 {

            margin-bottom: 60px;
        }

        .home_customer-satisfaction--list {
            ul {
                list-style: none;
                padding: 0;
                margin: 0;
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;

                li {
                    flex: 1 1 calc(50% - 48px);
                    padding: 24px 24px 24px 100px;
                    text-align: left;

                    h4 {
                        margin-bottom: 16px;
                    }

                    &:nth-last-child(2) {
                        border-bottom: 0;
                    }

                    &::before {
                        content: "";
                        width: 148px;
                        height: 148px;
                        position: absolute;
                        left: -24px;
                        top: 0;
                        border-radius: 50%;
                        background: radial-gradient(circle, #CCF7D0, rgba(236, 244, 236, 0.2) 48.92%);
                    }

                    &>span {
                        width: 100px;
                        height: 100px;
                        position: absolute;
                        left: 0;
                        top: 24px;
                        background-repeat: no-repeat;
                        background-position: center;
                        background-size: 48px;

                    }
                }
            }

        }
    }

    @media (max-width:768px) {
        width: calc(100% - 40px);
        margin-left: auto;
        margin-right: auto;
        padding-top: 24px;

        h2 {
            font-size: 24px;
        }

        .home_customer-satisfaction--list li {
            h4 {
                font-size: 18px;
            }
        }
    }
}

.home_expertise {
    color: #fff;
    text-align: center;
    padding-top: 240px;

    background: url(./../images/bg-expertise.png) repeat #34813A;
    position: relative;
    overflow: hidden;

    .bg-expertise {
        flex: none;
        position: absolute;
        width: 100vw;
        height: 100%;
        top: 0;
        left: 0;

        svg {
            width: 100%;
            height: auto;
        }

    }

    h2 {
        margin-bottom: 40px;
        color: #fff;

        span {
            display: block;
        }
    }

    .home_expertise--list {

        ul {
            display: flex;
            flex-direction: row;
            justify-content: space-between;

            li {
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                border-right: 1px solid #90D995;
                padding: 0 24px;
                flex-grow: 1;

                &:first-child {
                    padding-left: 0;
                    flex-grow: 0;
                }

                &:last-child {
                    border-right: none;
                    padding-right: 0;
                    flex-grow: 0;
                }

                h4 {
                    font-family: Montserrat;
                    font-size: 54px;
                    font-weight: 600;
                }

                p {
                    font-family: Public Sans;
                    font-size: 24px;
                    font-weight: 400; 
                    text-align: center;
                    margin-bottom: 0;
                    color: #E0E0E0;

                    span {
                        font-size: 16px;
                        font-weight: 300; 
                        display: block;
                        color: #FFF;

                    }

                }
            }
        }

        @media (max-width:768px) {
            ul {
                flex-wrap: wrap;

                li {
                    width: 50%;
                    padding: 0;
                    margin: 20px 0;

                    &:nth-child(2) {
                        border: 0;
                    }

                    h4 {
                        font-size: 32px;
                        line-height: 100%;
                    }

                    p {
                        font-size: 14px;
                        line-height: 18.2px;

                        span {
                            font-size: 12px;
                        }
                    }
                }
            }
        }
    }

    @media (min-width:768px) {
        padding-top: 300px;
        margin-bottom: 100px;

        .home_expertise--list {
            padding: 40px 0 0;

            h4 {
                margin-bottom: 12px;
            }

        }
    }

    @media (max-width:768px) {
        padding-left: 0;
        padding-right: 0;

        h2 {
            font-size: 24px;
            margin-bottom: 20px;
        }

        img {
            max-width: 85%;
        }
    }
}

/* Primary Button */
.button {
    padding: var(--button-padding);
    font-family: var(--button-font-family);
    font-weight: var(--button-font-weight);
    font-size: var(--button-font-size);
    line-height: var(--button-line-height);
    color: var(--button-color-primary);
    background-color: var(--button-bg-primary);
    border: none;
    cursor: pointer;
    text-align: center;
    border-radius: var(--button-height);
    text-decoration: none;
    white-space: nowrap;
    box-sizing: border-box;
    min-height: 48px;
    min-width: 148px;
    display: flex;
    justify-content: center;
    align-items: center;

    @media (max-width:768px) {
        min-height: 38px;
        min-width: 108px;
    }

    &:hover {
        color: var(--button-color-primary);
        background-color: var(--button-bg-primary);
    }

}

/* Secondary Button */
.button--secondary {
    border: var(--button-border-secondary);
    background-color: var(--button-bg-secondary);
    color: var(--color-primary);

    &:hover {
        color: var(--color-primary);
    }
}

/* Hover Effects */
.button:hover {
    opacity: 0.9;
}

.button--secondary:hover {
    background-color: var(--button-hover-bg-secondary);
}

/* Responsive Styles */
@media (max-width: 768px) {
    .button {
        font-size: var(--button-font-size-mobile);
        line-height: var(--button-line-height-mobile);
    }
}


/* Headings */
h1,
h2,
h3 {
    font-family: var(--h1-font-family);
    color: #030303;
}

h1 {
    font-size: var(--h1-font-size);
    font-weight: var(--h1-font-weight);
    line-height: normal;

    span {
        font-weight: 400;
    }
}

h2 {
    font-size: var(--h2-font-size);
    font-weight: var(--h2-font-weight);
    line-height: normal;

    span {
        font-weight: 600;
    }
}

h3 {
    font-size: var(--h3-font-size);
    font-weight: var(--h3-font-weight);
    line-height: normal;

    span {
        font-weight: 400;
    }
}

h4 {


    font-family: var(--font-secondary);
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
}


/* Responsive Styles */
@media (max-width: 768px) {
    .button {
        font-size: var(--button-font-size-mobile);
    }

    h1 {
        font-size: var(--h1-font-size-mobile);
    }

    h2 {
        font-size: var(--h2-font-size-mobile);
    }

    h3 {
        font-size: var(--h3-font-size-mobile);
    }

    h4 {
        font-size: 18px;
    }
}

.home_testimonials {
    background: #EDF0ED;
    text-align: center;
    padding-bottom: 48px;

    h2 span {
        color: var(--button-color-secondary);
        margin-bottom: 40px;
    }

    .swiper_testimonials {
        padding: 40px 0;
        max-width: 860px;

        .avator {
            margin-bottom: 10px;

            img {
                border-radius: 50%;
            }
        }

        h4 {
            font-size: 16px;
            font-weight: 400;
            color: #666;
            margin-bottom: 0;
            padding: 12px 0 10px;
            background: url(./../images/icon-apostrophe.svg) no-repeat left bottom;

            span {
                font-size: 20px;
                font-weight: 500;
                color: var(--button-color-secondary);

            }

        }

        p {
            font-size: 20px;
            font-weight: 400;
            padding: 0 18px;
            margin-bottom: 12px;
        }

        @media (max-width:768px) {
            h4 {
                font-size: 12px;
            }

            h4 span,
            p {
                font-size: 14px;
            }
        }
    }

    @media (min-width:768px) {
        padding-bottom: 88px;

        h2 {
            margin-bottom: 30px;
        }

    }
}



.container_contact {
    display: flex;
    max-width: 1040px;
    margin: 0 auto;
    padding: 32px 24px;
    background: url(./../images/bg-contact.svg) #34813A no-repeat left center;
    align-items: center;
    flex-direction: column;
    margin-bottom: -74px;
    position: relative;

    .button {
        border: 0;
    }

    @media (min-width:768px) {
        padding: 40px 100px;
        flex-direction: row;
        height: 192px;

        h2 {
            font-size: 34px;
            font-weight: 300;
        }
    }

    @media (max-width:768px) {
        width: calc(100% - 35px);

        h2 {
            font-size: 18px;
            margin-bottom: 16px;
        }
    }
}


.container_footer {
    background: #0A260C;
    padding-top: 124px;

    h4 {
        font-family: Public Sans;
        font-size: 18px;
        font-weight: 700;
        color: #FFFFFF;

    }

    &>div:first-child {
        padding: 20px 0 10px;
        border-bottom: 1px solid #254C28;
        align-items: center;

        &>div {
            flex: 1;
        }

        @media (min-width:768px) {
            display: flex;
        }

    }

    .quick-link--list {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        max-width: 300px;

        li {
            padding: 0 15px;
            margin: 12px 0;
            color: #92B495;
            text-decoration: none;
            display: flex;
            flex-direction: row;
            border-left: 1px solid #92B495;

            &:first-child,
            &:nth-child(3) {
                padding-left: 0;
                border-left: 0;
            }

            a {
                font-family: Public Sans;
                font-size: 16px;
                font-weight: 400;
                line-height: 16px;
                text-decoration: none;
                color: #92B495;
            }
        }

        @media (min-width:768px) {
            a {
                font-size: 14px;
            }

        }
    }

    .visit-link--list {
        flex-direction: row;

        li {
            display: flex;
            flex-direction: row;
            align-items: end;
            width: 200px;
            justify-content: space-between;
            padding: 12px;
            height: 44px;
            position: relative;

            border: 1px solid #446647;


            img {
                z-index: 1;
            }

            &::before {
                content: "";
                width: 64px;
                height: 4px;
                position: absolute;
                background: #0A260C;
                left: 7px;
                top: -2px;
            }

            a {
                font-size: 16px;
                font-weight: 400;
                text-align: left;
                color: #4FC858;
                text-decoration: none;
                display: flex;
                align-items: center;

                &:after {
                    content: "";
                    border: 2px solid white;
                    border-left: 0;
                    border-bottom: 0;
                    transform: rotate(45deg);
                    color: #fff;
                    font-weight: 200;
                    width: 8px;
                    height: 8px;
                    margin-left: 8px;
                }


            }

            &:first-child {
                margin-right: 40px;

                img {
                    width: 52px;
                }
            }

            &:nth-child(2) {
                &::before {
                    width: 80px;
                }

                img {
                    width: 80px;
                }
            }

            @media (max-width:768px) {
                width: 100%;
                margin: 48px 0;

                &:last-child {
                    margin-bottom: 20px;
                }
            }
        }

        @media (min-width:768px) {
            display: flex;
        }

        @media (max-width:768px) {
            li {
                height: 56px;
                padding-bottom: 16px;
            }
        }
    }

    @media (max-width:768px) {
        padding-left: 28px;
        padding-right: 28px;
        padding-top: 100px;

        h4 {
            font-size: 16px;
        }
    }
}

.footer_copy-rights {
    flex-direction: row;
    justify-content: space-between;
    font-family: Public Sans;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.1px;
    color: #B4B4B4;
    padding: 24px 0;
    text-align: center;


    a {
        font-family: Public Sans;
        font-size: 12px;
        font-weight: 400;
        line-height: 14.1px;
        text-align: left;
        color: #B4B4B4;
        padding: 0 5px;
        text-decoration-line: underline;

        &:first-child {

            border-right: 1px solid #92B495;
        }

    }

    @media (min-width:768px) {
        display: flex;
    }

    @media (max-width:768px) {
        font-size: 12px;
    }
}

.hero {

    .swiper {
        margin: 0 auto;
        width: 100%;
        position: relative;

        @media (min-width: 768px) {
            height: 583px;
        }

        @media (max-width: 768px) {
            height: 422px;
        }

    }

    .swiper-slide {
        display: flex;
        flex-direction: column;
        align-items: baseline;
        position: relative;
        padding: 100px 24px 0;
        color: #fff;
        text-align: left;
    }
    .swiper-pagination{
        bottom: 32px;
    }

    h2,
    p {
        max-width: 586px;
        padding-bottom: 24px;
        margin-bottom: 0;
        display: block;
        overflow: hidden;

        span {
            color: #87FF91;
        }
    }

    .button {
        background: var(--button-bg-primary-dark);
    }

    h2 {
        color: #fff;
        text-align: left;
    }

    .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .banner-img {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: -1;
        left: 0;
        top: 0;
    }

    @media (min-width:768px) {
        .swiper-slide {
            padding: 132px 100px 0;

            h2,
            p {
                max-width: 585px;
                width: 100%;
                margin: 0 auto;
                margin-left: calc(50% - 600px);
            }

            .button {

                margin: 0 auto;
                margin-left: calc(50% - 600px);
            }

            h2 {
                font-size: 48px;
                font-weight: 300;
            }
        }

        .swiper p {
            margin-bottom: 24px;
        }

    }

    @media (max-width:768px) {
        padding: 0;

            .swiper-slide {
                .banner-img{  
                    img{
                        width: auto;
                    }
                }

    }

    /* .swiper-pagination-bullet-active{
        background-color: #fff;
    } */


}
}
.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    opacity: 1;
    background: var(--button-bg-tertiary);
    transition: ease-in-out 0.2s width;
}

.swiper-pagination-bullet-active {
    background: var(--button-bg-primary);
    width: 25px;
}

.swiper_testimonials {
    max-width: 876px;
    position: relative;
}

.form_header {
    background: url(./../images/bg-contact.png) repeat #29412B;
    background-color: #29412B;
    width: 100%;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 100px 0 130px;

    h2 {

        color: #fff;
        font-weight: 600;
    }

    p {
        color: #F2F2F2;
        text-align: center;

        @media (min-width:768px) {
            margin-bottom: 32px;

        }

    }
}


::placeholder {
    color: #B4B4B4 !important;
    opacity: 1;
    /* Firefox */
}

::-ms-input-placeholder {
    /* Edge 12 -18 */
    color: #B4B4B4 !important;
}

select:not(:focus):invalid {
    color: #B4B4B4;
}

.form-control,
.form-select {

    height: 54px;
}

textarea.form-control {
    min-height: 100px;
}

.contact_form {
    label {
        display: none;
    }
    .alert{
        padding: 12px;
        position: relative;
        p{
            margin-bottom: 0;
        }
        button.close{    border: 0;
            background: transparent;
            position: absolute;
            right: 0;
            top: 0;
            margin: 8px 8px 0 0 !important;
            padding: 0;
            font-size: 24px;
        }
 
    }

    form {
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: center;
    }

    .form-group {
        flex: 1 1 50%;
        padding: 8px 0;

        @media (min-width: 768px) {
            &:nth-child(odd) {
                padding-right: 8px;
            }

            &:nth-child(even) {
                padding-left: 8px;
            }
        }

        &.msg-box {
            flex: 1 1 100%;
            padding-right: 0;
        }
    }

    @media (min-width: 768px) {
        form {

            flex-direction: row;
        }
    }

    @media (max-width: 768px) {
        padding: 0;
    }
}

#formContainer {
    width: calc(100% - 40px);
    margin: 0 auto;
    margin-top: -90px !important;
    position: relative;
    background: white;
    border: 1px solid rgba(238, 238, 238, 1);
    padding: 20px;

    button {
        margin: 0 auto;
        margin-top: 24px;
    }

    @media (min-width:768px) {
        width: 724px;
        padding: 40px;

    }
}

.contact_map {
    .container-middle {
        display: flex;
        flex-direction: column;

        .contact_map_address {
            flex: 1 1 33%;

            @media (min-width:768px) {
                h2 {
                    text-align: left;
                    margin-bottom: 37px;
                }

                li {
                    font-size: 18px;
                    padding: 0 0 44px 48px;

                    &:last-child {
                        padding-bottom: 0;
                    }
                }
            }
        }

        @media (min-width:768px) {
            flex-direction: row;
        }

        @media (max-width:768px) {
            h2 {
                font-size: 28px;
                text-align: left;
            }

            li {
                font-size: 18px;
                padding-left: 38px;

                h4,
                p {

                    font-size: 18px;
                    line-height: normal;
                }
                i{
                    width: 20px;
                    height: 24px;
                    background-size: 20px;
                }

            }

            iframe {
                max-width: 100%;
                height: 280px;
            }
        }
    }

    h2 {
        font-size: 44px;
        font-weight: 600;
        color: #34813A;


    }

    ul {
        li {
            font-size: 24px;
            font-weight: 500;
            line-height: 24px;
            padding: 15px 0 15px 48px;
            position: relative;

            .contact-phone {
                background-image: url(./../images/icon-phone.svg);
            }

            .contact-email {
                background-image: url(./../images/icon-email.svg);
            }

            .contact-map {
                background-image: url(./../images/icon-map.svg);
            }

            i {
                width: 32px;
                height: 32px;
                position: absolute;
                left: 0;
                background-repeat: no-repeat;
                background-position: center;

            }

            a {
                color: #030303;

            }

            h4 {
                font-weight: 600;
                margin-bottom: 12px;

                &+p {
                    font-size: 18px;
                }

            }

        }
    }
}

.about_story,
.about_solution,
.about_team {

    h2,
    h3 {
        font-family: Montserrat;

        span {
            color: #34813A;

        }
    }
}

.about_story {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 30%, #DBFFDB 130%);

}

h2.bt5 {
    position: relative;
    padding-top: 12px;
    margin-bottom: 24px;

    &:before {
        top: 0;
        content: "";
        position: absolute;
        width: 82px;
        height: 5px;
        background: #34813A;
    }

    @media (max-width:768px) {
        align-items: start;
        text-align: left;
        margin-bottom: 24px;
        padding-top: 8px;

        &:before {
            height: 3px;
        }

    }
}

.about_story .container-middle {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    line-height: 24px;

    img {
        width: 100%;
        max-width: 550px;
    }

    h3 {
        font-family: Montserrat;
        font-size: 24px;
        font-weight: 400;
        padding-top: 12px;

        span {
            font-weight: 600;
        }

    }


    .about_list {
        flex: none;
        flex-direction: column;
        width: 100%;
        display: flex;

        .about_list-item {
            padding: 20px 0;
            text-align: center;

            &:first-child {
                border-bottom: 1px solid #B2B2B2;
            }
        }
    }

    @media (min-width:768px) {

        &>div {
            flex: 1 1 50%;
        }

        flex-direction: row;

        .about_list {
            flex-direction: row;
            padding-top: 120px;

            .about_list-item {
                flex: 1 1 calc(50% - 60px);
                text-align: left;

                &:first-child {
                    padding: 0 60px 0 0;
                    border-bottom: 0;
                    border-right: 1px solid #B2B2B2;
                }

                &:nth-child(2) {
                    padding: 0 0 0 60px;
                }

                h3,
                h2 {
                    margin-bottom: 32px;

                }

                p {
                    line-height: 24px;
                    margin-bottom: 0;
                }
            }
        }
    }

    @media (max-width:768px) {

        line-height: 18px;
        padding-top: 40px;

        .container-story {
            padding-top: 32px;

            h3 {
                font-size: 18px;
            }
        }

        .about_list {
            padding-top: 40px;

            .about_list-item:last-child {
                padding-bottom: 0;

                p {
                    margin-bottom: 0;
                }
            }
        }
    }
}

footer.home_footer {
    background: #000;
}

.contact_footer {
    padding-top: 40px;
}

.bg-dark {

    color: #FFF;

    h2.bt5:before {
        background: #87FF91;
    }

    p,
    li {
        span {
            color: #87FF91;
        }
    }
}

.about_solution {
    background: url(./../images/bg-solution.png) repeat;

    h2 span {
        color: #FFF;
    }

    h2,
    p {
        color: #FFF;
    }
}

.about_solution,
.about_team {

    @media (max-width:768px) {
        padding-top: 70px;
        padding-bottom: 70px;

    }
}
.about_solution{
    @media (min-width:768px){
        height: 758px;  
        display: flex;
        flex-direction: column;
        justify-content: center;
        .container-middle{
            position: relative;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .img-list{
            position: absolute;
            right: 0; 
        }
        h2, .about_solution--list{ 
            width: 624px; 
        }
        h2, p{
            margin-bottom: 32px;
        }
    }
}

.about_solution .container-middle {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;

    &>div {
        flex: 1 1 50%;
    }

    .about_solution--list li {
        padding: 12px 0 12px 12px;
        position: relative;

        &::before {
            content: "•";
            color: #87FF91;
            position: absolute;
            left: 0;

        }
    }

    .img-list {
        ul {
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;
            gap: 16px;
            height: 360px;

            li {
                width: 50%;
                border-width: 2px;
                border-style: solid;
                border-image: linear-gradient(to bottom, rgb(135, 255, 145), rgb(102, 102, 102)) 1;

                &:nth-child(2) {
                    border-image: linear-gradient(to right, rgb(135, 255, 145), rgb(102, 102, 102)) 1;
                }

                &:nth-child(3) {
                    border-image: linear-gradient(to left, rgb(135, 255, 145), rgb(102, 102, 102)) 1;
                }

                &:nth-child(4) {
                    border-image: linear-gradient(to top, rgb(135, 255, 145), rgb(102, 102, 102)) 1;
                }

                img {
                    width: 100%;
                }
            }
        }
    }

    @media (min-width:768px) { 


        .img-list ul {
            height: 504px;
            width: 552px;
            padding-left: 70px;
        }
    }

    @media (max-width:768px) {
        .img-list ul { 
            height: 336px;
            max-width: 328px;
            margin-bottom: 16px;
            li{
                width: calc(50% - 10px);
            }
        }
        .about_solution--list li{
            padding-bottom: 0;
        }

    }
}


.about_team .container-middle {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;

    h2+p {
        color: #414341;
    }

    .about_team--list {
        display: flex;
        flex-direction: row;
        margin: 0 auto;
        justify-content: center;
        width: 100%;

        li {

            h4 {
                font-family: Public Sans;
                font-size: 24px;
                font-weight: 600;
                line-height: 28.2px;
            }

            p {
                font-family: Public Sans;
                font-size: 18px;
                font-weight: 500;
                color: #3D9544;


            }
        }

        @media (min-width:768px) {
            padding-top: 70px;

            img {
                max-height: 328px;
            }

            li {
                &:first-child {
                    padding-right: 64px;

                }

                &:last-child {
                    padding-left: 64px;

                }

                h4 {
                    padding-top: 27px;
                    margin-bottom: 12px;
                }

                p {
                    margin-bottom: 0;
                }
            }
        }

        @media (max-width:768px) {

            flex-direction: column;

            li {
                h4 {
                    font-size: 16px;
                }

                p {
                    font-size: 14px;
                }

                &:last-child {
                    p {
                        margin-bottom: 0;
                    }
                }
            }

        }
    }

    @media (min-width:768px) {
        h2 {
            margin-bottom: 24px;
        }

        h2+p {
            line-height: 24px;
            margin-bottom: 0;
            max-width: 720px;
        }
    }

    @media (max-width:768px) {
        li {
            padding-top: 24px;

            h4 {
                padding-top: 16px;
                margin-bottom: 0;
            }
        }
    }
}

.company-profile--why .container-middle {
    display: flex;
    flex-direction: column;

    &>* {
        flex: 1 1 50%;
    }

    ul li {
        font-size: 34px;
        font-weight: 600;
        border-bottom: 1px solid #B4B4B4;
        padding: 32px 0;

        &:first-child {
            padding-top: 0;
        }

        &:last-child {
            border-bottom: 0;
            padding-bottom: 0 !important;
        }

        h3 {
            font-family: Public Sans;
            font-weight: 600;
        }

        p {
            font-weight: 400;
            margin-bottom: 0;

            span {
                color: #3D9544;
                font-weight: 600;
            }

        }

    }

    @media (min-width:768px) {
        flex-direction: row;

        li {
            padding: 40px 0 !important;
        }

        h3 {
            font-size: 34px;
            margin-bottom: 16px;
        }

        p {

            font-size: 18px;
        }
    }

    @media (max-width:768px) {
        ul li p {
            line-height: 18px;
        }
    }


}

.company-profile--compliant {
    background-image: linear-gradient(to left, rgba(0, 0, 0, 1) 67%, rgba(0, 0, 0, 0.3) 101%, rgba(0, 0, 0, 0.1) 100%), url(./../images/bg-compliant.jpg);
    background-repeat: no-repeat;
    background-color: black;
    padding: 76px 0;
    background-size: contain;

    @media (min-width:1800px) {
        background-image: linear-gradient(to left, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 0.3) 101%, rgba(0, 0, 0, 0.1) 100%), url(./../images/bg-compliant.jpg);
    }

    .container-middle {

        display: flex;
        flex-direction: column;
        align-items: center;
    }

    ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;

        li {
            margin: 10px 20px;
            background: linear-gradient(320deg, #DBFFDB 36%, rgb(255 255 255) 80%);
            border-radius: 4px;
            padding: 16px;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;

            h3 {
                font-family: Montserrat;
                color: #34813A;
                font-weight: 700;
                line-height: 32px;

            }

            p {
                font-weight: 400;
                margin: 0;

            }

            img {
                max-width: 82px;
                max-height: 70px;
            }


        }

        .compliant-description {
            padding-left: 24px;
        }

        @media (min-width:768px) {
            li {

                margin: 20px;
                width: 332px;
                height: 162px;
            }

            h3 {
                font-size: 20px;
            }

            p {
                font-size: 18px;
            }

            &:first-child img,
            &:nth-child(3) img {
                width: 82px;
            }

            &:nth-child(2) img {
                width: 55px;
            }

            &:nth-child(4) img {
                width: 87px;
            }

            &:nth-child(5) img {
                width: 95px;
            }
        }
    }

    .compliant-certificate {
        font-weight: 400;
        color: #FFFFFF;
        padding: 20px 40px;
        margin-top: 24px;
        border-radius: 4px;
        text-align: center;
        padding: 10px;
        border-radius: 4px;
        overflow: hidden;
        position: relative;

        &::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            border: 1px solid transparent;
            border-image: repeating-linear-gradient(45deg,
                    #fff 0,
                    #fff 5px,
                    transparent 5px,
                    transparent 10px);
            border-image-slice: 1;
            border-radius: 10px;
            /* Apply border radius */
            pointer-events: none;
            /* Prevent pseudo-element from blocking clicks */
        }

        span {
            font-weight: 800;
            color: #81FF6A;

        }

        @media (min-width:768px) {
            line-height: 32px;
            font-size: 20px;
            width: 700px;
        }

        @media (max-width:768px) {
            margin: 24px 20px 0;
            padding: 20px;
        }
    }

    @media (max-width:768px) {
        background: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 45%, rgba(0, 0, 0, 1) 100%), url(./../images/bg-compliant.jpg);

    }
}

.company-profile--compliance {
    background: url(./../images/bg-compliance.png) repeat #34813A;

    .container-middle {
        color: #FFFFFF;
        display: flex;
        flex-direction: column;
        align-items: center;

    }

    h2 {
        span {
            color: #87FF91;
        }
    }

    h2,
    p {
        text-align: center;

        max-width: 780px;
    }

    p {
        font-weight: 300;

        span {
            font-weight: 600;
        }
    }

    .compliance-list {
        border-left: 1px solid #6E6E6E;
        border-bottom: 1px solid #6E6E6E;

        font-size: 18px;
        font-weight: 400;
        text-align: left;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;

        li {
            padding: 10px;
            border-top: 1px solid #6E6E6E;
            border-right: 1px solid #6E6E6E;
            display: flex;
            flex-direction: row;
            flex: 1 1 50%;
            justify-content: flex-start;
            align-items: center;
            min-height: 90px;

            img {
                flex: 1 1 20%;
                max-width: 28px;
                margin-right: 12px;

            }

            p {
                text-align: left;
                margin: 0;

            }
        }

        @media (min-width:768px) {
            li {
                padding: 24px;
                flex: 1 1 20%;
                max-width: 20%;
                min-height: 142px;

                img {
                    flex: 1 1 20%;
                    height: 48px;
                    width: auto;
                    max-width: 48px;
                    margin-right: 16px;

                }

            }

        }
    }

    @media (min-width:768px) {
        h2 {
            margin-bottom: 24px;
        }

        h2+p {
            margin-bottom: 70px;
        }

    }
}

.company-profile--capacity {
    padding-top: 100px;
}

.company-profile--capacity .container-middle {
    max-width: 1040px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;



    ul {
        display: flex;
        flex-direction: row;
        justify-content: space-between;


        li {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
            border-right: 1px solid #DCDCDC;
            padding: 0 24px;
            flex-grow: 1;

            &:first-child {
                padding-left: 0;
            }

            &:last-child {
                border-right: none;
                padding-right: 0;
            }

            h4 {
                font-family: Montserrat;
                font-weight: 700;
                color: #34813A;
            }

            p {
                font-family: Public Sans;
                font-weight: 600;
                text-align: center;

                span {
                    font-size: 16px;
                    margin-bottom: 16px;
                    font-weight: 300;
                    display: block;

                }

            }
        }
    }

    @media (min-width:768px) {
        flex-direction: row;

        h2+p {
            line-height: 24px;
        }

        ul {

            li {

                padding: 0 60px;

                h4 {

                    font-size: 54px;
                }

                p {

                    font-size: 24px;
                }
            }
        }

        .capacity_header {
            max-width: calc(50% - 80px);
        }
    }
}




.company-profile--infrastructure {
    h2 {
        text-align: center;
        margin-bottom: 68px;
    }
}

.infra-gallery {
    max-width: 1240px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    grid-auto-rows: 130px;
    grid-auto-flow: dense;

    @media (min-width:768px) {
        grid-template-columns: repeat(auto-fit, minmax(258px, 1fr));
        grid-auto-rows: 258px;
        grid-gap: 20px;
    }

    li {
        display: flex;
        justify-content: center;
        align-items: center;

        img {
            max-width: 100%;
            vertical-align: middle;
            display: inline-block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        &.wide {
            grid-column: span 2;
        }

        &.tall {
            grid-row: span 2;
        }
    }
}

.collection {
    h2 {
        margin-bottom: 40px;
    }
}

.collection-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    li {
        flex: 1 1 50%;
        border-right: 1px solid rgba(236, 236, 236, 0.6196);
        border-bottom: 1px solid rgba(236, 236, 236, 0.6196);
        padding: 25px 0 40px;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: end;
        align-items: center;


        img {
            max-width: 100%;
        }


        p {
            margin-bottom: 0;
        }
    }

    @media (max-width:768px) {
        li {
            padding:24px 0 24px;

            &:nth-last-child(-n+2) {
                border-bottom: 0;  
            }
            &:nth-of-type(even) {

                border-right: 0;
            }
            p{ 
                padding-top:12px
            }
        }
    }

    @media (min-width:768px) {
        li {
            flex: 1 1 33%;
            position: relative;
            height: 370px;
            overflow: hidden;
            img{
                -webkit-transition: -webkit-transform 0.4s;
                transition: transform 0.4s;
                &:hover{ 
                    -webkit-transform: scale(1.2) rotate(0.01deg);
                    transform: scale(1.2) rotate(0.01deg);
                }
            }

            &:nth-child(3n+3) {
                border-right: 0;
            }

            &:nth-child(1),
            &:nth-child(2),
            &:nth-child(3) {
                img {
                    margin-top: 24px;
                } 
            }

            &:nth-last-child(-n+3) {
                border-bottom: 0;  
            }

            p {
                /* position: absolute; */
                /* bottom: 16px; */
                padding-top:24px
            }

            img {
                width: auto;
            }
        }
    }
}

.nav-pills {
    background: linear-gradient(278.28deg, #FFFFFF 14.87%, #E5E5E5 110.98%);
    padding: 0 18px;
    margin-bottom: 24px;

    .nav-item {
        padding: 0 25px;

        button {
            background: none;
            color: #000;
            font-family: Public Sans;
            font-size: 28px;
            font-weight: 600;
            line-height: 32.9px;
            padding: 18px 0;
            border-radius: 0;

            &.active {
                border-bottom: 3px solid #34813a;
                background: none;
                color: #000;

            }
        }

    }

    @media (max-width:768px) {
        .nav-item {
            width: 50%;

            button {
                font-size: 18px;
                padding: 4px 0;
            }
        }
    }
}

.header_inner-page {
    height: 365px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #000;
    /* 
    &:after {
        background: linear-gradient(101.98deg, rgba(66, 255, 0, 0.2604) 29.08%, rgba(0, 0, 0, 0.62) 68.7%),
            linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
    } */

    h1 {
        font-family: Montserrat;
        font-size: 28px;
        font-weight: 600; 
        text-align: center;
        color: #fff;
        @media (min-width:768px) {
            font-size: 48px;
        }

    }

}

@media (min-width:768px) {

    .header_inner-page {
        margin-bottom: 100px;
        padding: 16px;
    }

    .is-sticky {
        position: fixed;
      }
      
      .is-sunk {
        position: absolute;
        bottom: 0;
      }
      
      .is-sunk-wrapper {
        position: relative;
      }
     
      .company-profile--why{
        margin-bottom: 100px;
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 100px;
      }
       .company-profile--why .container-middle{
        .js-sticky{
            float: left;
            width: 50%;
            max-width: 500px;
            transition: all 0.4s ease-out;
            h2{
                margin-bottom: 0;
            }
        }
     ul{
            float: right;
            max-width: 718px;
            li{ 
                opacity: 0;
                &.visible{
                    animation: 1s fadeInUp;
                    opacity: 1;
                }
            }
            li:first-child{
                padding-top: 0 !important;
            }
            li:first-child,  li:nth-child(2){
                
                opacity: 1 !important;  
                animation: 1s fadeInUp;
            }
        }
       }
}

@media (max-width: 768px) {
    p {
        font-size: 14px;
    }

    .company-profile--why {
        padding: 70px 16px 36px;

        ul {
            padding-top: 16px;
        }
    }

    .company-profile--compliant {
        padding: 100px 16px 70px;
    }

    .company-profile--infrastructure {
        padding: 70px 16px;

        h2 {
            margin-bottom: 40px;
        }
    }

    .company-profile--compliance {
        padding: 70px 16px;

        h2,
        h2+p {
            margin-bottom: 24px;
        }
    }

    .company-profile--capacity {
        padding: 70px 16px;

        ul {
            padding-top: 16px;
        }

        li h4 {
            font-size: 28px;
        }

        li p span {
            margin-bottom: 8px !important;
            font-size: 12px !important;
        }
    }

    .collection {
        padding: 70px 16px;

        h2 {
            text-align: left;
            margin-bottom: 24px;
        }
    }

    .contact_map {
        padding: 70px 16px;
    }

    .contact_form {
        padding-bottom: 70px;
    }
    .terms-condition{

    }
    .privacy-policy, .terms-condition{ 
        h2{
            margin-bottom: 16px;
        }

    } 

    .navbar-toggler {
        z-index: 10;
        border: 0;
        outline: 0;

        &:focus {
            box-shadow: none;
        }

        .navbar-toggler-icon {
            transition: all ease-in-out 0.5s;

            &::before {
                transition: all ease-in-out 0.5s;
                opacity: 0;
            }
        }
    }

    .navbar-toggler[aria-expanded="true"] {
        z-index: 10;

        .navbar-toggler-icon {
            position: relative;
            background: rgba(255, 255, 255, 0);

            &:before {
                opacity: 1;
                font-size: 56px;
                font-weight: 100;
                content: "×";
                position: absolute;
                top: -13px;
                right: 0px;

            }

        }
    }

    .navbar-collapse.show {
        right: 0;

    }

    .nav-overlay {
        display: none;
        transition: opacity ease-in-out 0.5s;
        overflow: hidden;
    }

    button[aria-expanded="true"]+.nav-overlay {
        display: block;
        content: "";
        position: fixed;
        width: 100%;
        height: 100%;
        background: #00000074;
        left: 0;
        top: 0;
        z-index: 2;
    }

    .navbar {
        padding: 13px 0;

        .navbar-brand img {
            width: 50px;
        }

        .navbar-toggler-icon {
            width: 36px;
            height: 36px;
        }
    }

    .home_company-profile .container-middle {
        align-items: unset;

        .profile-header {
            padding-bottom: 32px;
            h2 {
                margin-bottom: 24px;
            }
        }
    }

    .home_production {

        .home_production--title p {
            margin-bottom: 40px;
        }

        .home_production--list li {
            padding: 24px 32px !important;
            margin: 0 0 12px !important;

            &:last-child {
                margin: 0;
            }

            h4 {
                margin-bottom: 12px;
            }

            p {
                line-height: 18px;
                max-width: 88%;
            }
        }
    }

    .home_customer-satisfaction--list li {
        border-bottom: 0 !important;
        padding-bottom: 32px;

        p {
            line-height: 18px;
        }
    }

    section {
        padding-bottom: 70px;

        &.home_testimonials,
        &.about_solution,
        &.about_team,
        &.company-profile--infrastructure,
        &.company-profile--compliance,
        &.company-profile--capacity &.collection,
        &.terms-condition, &.privacy-policy {
            padding-top: 70px;
        }


        &.home_in-house-brand {
            padding-top: 0;
            padding-bottom: 0;
        }

    }

    .home_expertise {
        padding-top: 264px;
    }

    .home_expertise {
        & .home_expertise--list {
            & ul {
                & li {
                    margin-bottom: 0;
                }
            }
        }
    }

    .home_clients {
        h2 {
            margin-bottom: 24px;
        }

        h3 {
            margin-bottom: 12px;
        }

        p {
            margin-bottom: 40px;
        }
    }

    .form_header {
        padding-left: 16px;
        padding-right: 16px;
    }

}
@keyframes fadeInUp {
    0% {
      transform: translateY(100%);
      opacity: 0;
    }
    100% {
      transform: translateY(0%);
      opacity: 1;
    }
  }
header {
    z-index: 9;
    position: fixed;
    top: 0;
    width: 100%;
}

.hero,
.header_inner-page {
    margin-top: 70px;

    @media (min-width:768px) {
        margin-top: 135px;

    }
}

.terms-condition, 
.privacy-policy{
    
    h2{
        color: var(--color-primary);
        font-weight: 600;
        margin-bottom: 32px;
        margin-top: 40px;
    }
    ol li{
        padding-bottom: 16px;
    }
    ul li{ 
        padding: 0 0 16px 28px;
        position: relative;

        &::before {
            content: "•";
            color: var(--color-text); 
            position: absolute;
            left: 10px;

        }
    }
    p, ol, ul, h4{
        margin-bottom: 16px;
    }
    h4{
        font-size: 18px;
        font-weight: 700;
    }
    li, p, h4{
        line-height: 24px;
        a{
            color: var(--color-text);
            text-decoration: underline;
        }
         
    }
    li:last-child{
        padding-bottom: 0;
    }
    .text-strong{
        font-weight: 700;
    }
    @media (max-width: 768px) { 
        
        h2{
            color: var(--color-primary);
            font-weight: 600;
            margin-bottom: 16px;
            margin-top: 32px;
            text-align: left;
        }
        li, p, h4{
            line-height: 18px;
            font-size: 14px;
        }
        ul li{
            padding: 0 0 16px 22px; 
            &:before{
              left: 8px;  
            }
        }
        ol{
            margin-left: 20px;
            padding-left: 0;
        }
    }
}
.terms-condition{
    @media (max-width: 768px) {
    h2:first-child{
        margin-top: 0;
    }}
}
.privacy-policy{
    counter-reset: heading;
    h2.header-list-item:before {
        content: counter(heading)". ";
        counter-increment: heading;
    }
    h2.header-list-item {
        counter-reset: subheading;
    }
}
p a{
    color: var(--color-text);
    text-decoration: underline;
}
.form-control.is-valid, .was-validated .form-control:valid{
    background-image: none ; 
}

.form-select, .form-select.is-valid, .was-validated .form-select:valid{
    --bs-form-select-bg-icon: none !important

}