@font-face {
    font-family: PoppinsRegular;
    src: url("../assets/fonts/Poppins/Poppins-Regular.ttf");
}
@font-face {
    font-family: PoppinsBold;
    src: url("../assets/fonts/Poppins/Poppins-ExtraBold.ttf");
}

html,
body{
    padding: 0;
    margin: 0;
    font-family: PoppinsRegular;
    box-sizing: border-box;
}

strong{
    font-family: PoppinsBold;
}

h2{
    font-size: 64px;
    line-height: 68px;
    font-family: PoppinsBold;
    margin: 0;
}

h3{
    font-family: PoppinsBold;
}



.triangle-left,
.triangle-right,
.triangle-bottom,
.triangle-top{
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border-bottom: solid 14px transparent;
    border-top: solid 14px transparent;
    border-left: solid 14px transparent;
    border-right: solid 14px transparent;
}

.triangle-left{
    left: -1px;
    top: 42px;
    border-left-color: #9C9754;
}

    .triangle-left:after{
        content: "";
        width: 0;
        height: 0;
        
        position: absolute;
        border-bottom: solid 13px transparent;
        border-top: solid 13px transparent;
        border-left: solid 13px #ffffff;
        border-right: solid 13px transparent;
        top: -13px;
        left: -14px;
    }

.triangle-right{
    left: 100%;
    top: 42px;
    border-left-color: #9C9754;
}

    .triangle-right:after{
        content: "";
        width: 0;
        height: 0;
        
        position: absolute;
        border-bottom: solid 13px transparent;
        border-top: solid 13px transparent;
        border-left: solid 13px #ffffff;
        border-right: solid 13px transparent;
        top: -13px;
        left: -14px;
    }

.triangle-bottom{
    left: 50%;
    bottom: -1px;
    border-bottom-color: #9C9754;
    margin-left: -7px;
}

    .triangle-bottom:after{
        content: "";
        width: 0;
        height: 0;
        
        position: absolute;
        border-bottom: solid 13px #ffffff;
        border-top: solid 13px transparent;
        border-left: solid 13px transparent;
        border-right: solid 13px transparent;
        bottom: -14px;
        left: -13px;
    }

.triangle-top{
    left: 50%;
    bottom: -34px;
    border-bottom-color: #9C9754;
    margin-left: -7px;
}

    .triangle-top:after{
        content: "";
        width: 0;
        height: 0;
        
        position: absolute;
        border-bottom: solid 13px #ffffff;
        border-top: solid 13px transparent;
        border-left: solid 13px transparent;
        border-right: solid 13px transparent;
        bottom: -14px;
        left: -13px;
    }

.button{
    cursor: pointer;
    position: relative;
    color: #FFF;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 32px;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    height: 52px;
    padding: 0 24px 0 16px;
    width: auto;
    border-radius: 8px;
    text-transform: uppercase;
    white-space: nowrap;
    transition: all .2s ease-out;
    margin-right: 110px;
}

    .button span{
        position: relative;
        height: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
    }

    .button:before{
        z-index: 0;
        content: '';
        position: absolute;
        right: -24px;
        top: -0.93px;
        height: 100%;
        width: 42px;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 6px;
        border-left: 0;

        -webkit-transform: skew(-18deg);
        -moz-transform: skew(-18deg);
        -o-transform: skew(-18deg);

        transition: all .2s ease-out;
    }

        .button:after{
            content: '';
            z-index: 3;
            position: absolute;
            right: -84px;
            top: -1px;
            bottom: -1px;
            display: block;
            width: 32px;
            background-repeat: no-repeat;
            background-position: center center;
        }

        .button span:before{
            z-index: 2;
            content: '';
            position: absolute;
            right: -108px;
            top: -1px;
            bottom: -1px;
            width: 48px;

            border-top-left-radius: 6px;
            border-bottom-left-radius: 8px;
            border-top-right-radius: 8px;
            border-bottom-right-radius: 6px;

            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

        .button span:after{
            content: '';
            z-index: 1;
            position: absolute;
            right: -122px;
            top: -1px;
            bottom: -1px;
            width: 32px;
            border-top-left-radius: 6px;
            border-bottom-left-radius: 8px;
            border-top-right-radius: 8px;
            border-bottom-right-radius: 6px;
        }


.button_red{
    background-color: #E41E1E;
    border: 1px solid #E41E1E;
}

    .button_red:hover{
        background-color: #FFFFFF;
        color: #E41E1E;
    }

    .button_red:before{
        border: 1px solid #E41E1E;
        border-left: 0;
        background-color: #E41E1E;
    }

    .button_red:after{
        background-image: url(../assets/icons/arrow-right.svg);
    }

    .button_red:hover:before{
        background-color: #FFFFFF;
        right: -28px;
    }

    .button_red span:before,
    .button_red span:after{
        background-color: #E41E1E;
        border: 1px solid #E41E1E;
    }


.button_white{
    background-color: #ffffff;
    border: 1px solid #ffffff;
    color: #000;
}

    .button_white:hover{
        background-color: #203241;
        color: #ffffff;
    }

    .button_white:before{
        border: 1px solid #ffffff;
        border-left: 0;
        background-color: #ffffff;
    }

    .button_white:after{
        background-image: url(../assets/icons/arrow-right.svg);
        filter: invert(100%) sepia(0%) saturate(1%) hue-rotate(343deg) brightness(104%) contrast(102%);
    }

    .button_white:hover:before{
        background-color: #203241;
        right: -28px;
    }

    .button_white span:before,
    .button_white span:after{
        background-color: #ffffff;
        border: 1px solid #ffffff;
    }

.modal {
    z-index: 100;
    position: fixed;
    width: 100vw;
    height: 100vh;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .modal.open {
        visibility: visible;
        opacity: 1;
        transition-delay: 0s;
    }

    .modal-bg {
        position: absolute;
        backdrop-filter: blur(90px);
        width: 100%;
        height: 100%;
    }

    .modal-container {
        border-radius: 10px;
        position: relative;
        padding: 32px;
        max-width: 60%;

        border: 1px solid #9C9754;
        border-radius: 16px;
        background: rgba(232, 231, 215, 0.85);
        box-shadow: 0 0 16px #8b8b8b;
    }

        .modal-container .h5{
            color: #E41E1E;
            font-size: 20px;
            font-style: normal;
            font-weight: 700;
            line-height: 30px;
            text-transform: uppercase;
        }

        .modal-container h2{
            color: #203241;
            font-size: 44px;
            font-style: normal;
            font-weight: 700;
            line-height: 52px;
            margin: 32px 0;
            padding: 0;
        }
        
        .modal-container p{
            color: #203241;
            font-size: 28px;
            font-style: normal;
            font-weight: 400;
            line-height: 45px;
        }

    .modal-close {
        position: absolute;
        right: 16px;
        top: 16px;
        outline: none;
        appearance: none;
        width: 42px;
        height: 42px;
        background: url(../assets/icons/close.svg);
        background-position: center center;
        background-repeat: no-repeat;
        border: 0px;
        font-weight: bold;
        cursor: pointer;
    }

.logo{
    line-height: 100%;
    display: block;
    padding: 0;
    margin: 0;
}

header{
    position: relative;
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 194px;
    overflow: hidden;
}

    .header__container{
        margin: 0 auto;
        max-width: 1440px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .header__logo{
        line-height: 100%;
        padding: 0;
        margin: 0 0 0 92px;
        height: 92px;
    }

    .header__nav{
        position: relative;
        background-color: #203241;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        height: 54px;
        padding: 0 24px;
        border-top-left-radius: 8px;
        border-bottom-left-radius: 8px;
        margin-right: 64px;
    }

        .header__nav span {
            position: absolute;
        }

        .header__nav a{
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            height: 100%;
            white-space: nowrap;
            color: #ffffff;
            text-transform: uppercase;
            text-decoration: none;
            padding: 0 24px;
            font-size: 22px;
            font-weight: 400;
            transition: all .2s ease-out;
        }

            .header__nav span{
                position: absolute;
                right: -12px;
                top: 0;
                bottom: 0;
            }

            .header__nav span:after {
                content: '';
                position: absolute;
                right: -76px;
                top: 0;
                bottom: 0;
                width: 48px;

                border-top-left-radius: 6px;
                border-bottom-left-radius: 8px;
                border-top-right-radius: 8px;
                border-bottom-right-radius: 6px;

                background-color: #203241;

            }

        .header__nav:before{
            content: '';
            position: absolute;
            right: -20px;
            top: 0;
            bottom: 0;
            width: 32px;
            border-top-right-radius: 8px;
            border-bottom-right-radius: 6px;
            
            background-color: #203241;
            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

        .header__nav:after{
            content: '';
            position: absolute;
            right: -76px;
            top: 0;
            bottom: 0;
            width: 48px;
            border-top-left-radius: 6px;
            border-bottom-left-radius: 8px;
            border-top-right-radius: 8px;
            border-bottom-right-radius: 6px;
            background-color: #203241;
            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }



.bitmap{
    width: 100%;
    padding: 90px 0;
    background-image: url(../assets/images/bitmap.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right center;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .bitmap__title{
        position: relative;
        color: #fff;
        font-size: 4.2vi;
        line-height: 6.4vi;
        font-weight: 300;
        text-align: right;
        background-image: url(../assets/images/bitmap.svg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: right;
        width: 82%;
        margin: 0;
        padding: 0.5vi 2vi;
    }

.delivery{
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
    background-color: #203241;
}

    .delivery__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items:flex-start;
    }

        .delivery__container:after{
            z-index: 1;
            content: '';
            position: absolute;
            left: -140px;
            top: 420px;
            height: 100%;
            width: 420px;
            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 14px;

            border: 4px solid #8CAABF;

            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

    .delivery__content{
        width: 60%;
        min-height: 480px;
        color: #fff;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        padding: 0 120px;

        font-size: 2.4vi;
        line-height: 4.2vi;
        font-style: normal;
        font-weight: 300;
    }

        .delivery__content p{
            margin-top: 0;
        }

.del__images{
    position: relative;
    display: block;
    width: 40%;
    height: 480px;
}

    .del__images:before{
        z-index: 2;
        content: '';
        position: absolute;
        right: 320px;
        top: 0;
        bottom: 0;
        width: 200px;
        border-top-left-radius: 14px;
        border-bottom-left-radius: 16px;
        border-top-right-radius: 16px;
        border-bottom-right-radius: 50%;

        background-color: #8CAABF;
    }

    .del__images:after{
        z-index: 1;
        content: '';
        position: absolute;
        right: 260px;
        top: 0;
        bottom: 0;
        width: 180px;
        border-top-left-radius: 14px;
        border-bottom-left-radius: 16px;
        border-top-right-radius: 16px;
        border-bottom-right-radius: 14px;

        background-color: #8CAABF;

        -webkit-transform: skew(-18deg);
        -moz-transform: skew(-18deg);
        -o-transform: skew(-18deg);
    }

    .del__image{
        overflow: hidden;
        position: absolute;
        top: 0;
        right: 0;
        width: 420px;
        height: 480px;
        background-image: url(../assets/images/delivery.png);
        background-repeat: no-repeat;
        background-size: cover;
        border-radius: 16px;
    }

.areyou{
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
}

    .areyou__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items:flex-start;
    }

        .areyou__container h2{
            display: block;
            color: #8CAABF;
            width: 40%;
            text-align: right;
        }

        .areyou__container h2 span{
            display: inline;
            color: #203241;
        }

        .areyou__container p{
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: flex-start;
            width: 60%;
            padding: 0 120px;
            font-size: 28px;
            line-height: 45px;
            margin: 0;
            color: #9C9754;
        }



.white{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
}

    .white__container{
        position: relative;
        max-width: 1440px;
        padding: 0 48px;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

        .white__container h2{
            color: #9C9754;
        }

            .white__container h2 span{
                color: #000000;
            }

        .white__container p{
            font-size: 28px;
            font-style: normal;
            font-weight: 400;
            line-height: 45px;
            margin: 36px 0;
        }

            .white__blocks{
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 32px;
            }

            .white__block{
                padding: 48px;
                border-radius: 16px;
                overflow: hidden;
                background-color: #E8E7D7;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                align-items: flex-start;
            }

                .white__block h3{
                    min-height: 108px;
                    font-size: 42px;
                    color: #203241;
                    font-style: normal;
                    font-weight: 700;
                    line-height: 54px;
                    margin: 0;
                    padding: 0;
                }

                .white__block p{
                    color: #9C9754;
                    margin: 36px 0;
                }

            .white__team{
                display: grid;
                grid-template-columns: 1fr 1fr 1fr;
                gap: 32px;
            }

            .white__user{
                position: relative;
                display: flex;
                flex-direction: column;
                margin-bottom: 48px;
                overflow: hidden;
            }

                .white__user__photo{
                    display: flex;
                    flex-direction: row;
                    justify-content: center;
                    align-items: center;
                    border-radius: 16px;
                    background: #8CAABF;
                    margin-bottom: 24px;
                }

                    .white__user__photo img{
                        border-radius: 16px;
			width: 100%;
                        aspect-ratio: 16/9;
                        display: block;
                    }

                .white__user a{
                    z-index: 1;
                    display: block;
                    position: absolute;
                    right: 0;
                    top: 0;
                    width: 54px;
                    height: 68px;
                    border-bottom-left-radius: 16px;
                    background-color: #fff;
                    background-image: url(../assets/icons/in.svg);
                    background-position: right center;
                    background-repeat: no-repeat;
                }

                .white__user h3{
                    color: #203241;
                    font-size: 28px;
                    font-style: normal;
                    line-height: 45px;
                    margin: 0;
                    padding: 0;
                }

                .white__user p{
                    color: #9C9754;
                    font-size: 28px;
                    font-style: normal;
                    line-height: 45px;
                    margin: 0;
                    padding: 0;
                }

.values{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
}

    .values__container{
        position: relative;
        max-width: 1440px;
        padding: 0 48px;
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .values__container p{
        color: #9C9754;
        font-size: 28px;
        font-style: normal;
        font-weight: 400;
        line-height: 45px;
    }

        .values__blocks{
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 32px;
        }

        .values__block{
            border-radius: 16px;
            overflow: hidden;
            background-color: #E8E7D7;
        }

            .values__block__title{
                height: 320px;
                display: flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;
                background-position: center center;
                background-repeat: no-repeat;
                background-size: cover;
            }

                .values__block__title h3{
                    color: #FFF;
                    text-align: center;
                    font-size: 64px;
                    font-style: normal;
                    font-weight: 700;
                    line-height: 54px;
                }

            .values__block p{
                margin: 36px;
            }

            .values__block strong{
                color: #203241;
            }

.our-services{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 0 90px;
}

.cards{
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
}

    .cards__container{
        position: relative;
        max-width: 1440px;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 48px;
        padding: 0 48px 64px;
    }

        .card{
            background-color: #E8E7D7;
            border-radius: 16px;
            padding: 32px;
            overflow: hidden;
        }

            .card h3{
                display: flex;
                flex-direction: column;
                margin: 0 0 24px;
                font-size: 42px;
                color: #8CAABF;
                line-height: 52px;
            }

                .card h3 span{
                    color: #203241;
                }

                .card .image{
                    overflow: hidden;
                    position: relative;
                    margin-right: -64px;
                    margin-left: 48px;
                    height: 120px;
                    background-color: #000;

                    border-top-left-radius: 24px;
                    border-bottom-left-radius: 16px;

                    -webkit-transform: skew(18deg);
                    -moz-transform: skew(18deg);
                    -o-transform: skew(18deg);
                }

                    .card .image span{
                        position: absolute;
                        top: 0;
                        left: -32px;
                        right: 0;
                        bottom: 0;
                        background-size: cover;
                        background-repeat: no-repeat;
                        background-position: center center;
                        -webkit-transform: skew(-18deg);
                        -moz-transform: skew(-18deg);
                        -o-transform: skew(-18deg);
                    }

                .card p{
                    font-weight: 300;
                    font-size: 28px;
                    line-height: 45px;
                    color: #203241;
                    margin: 32px 0;
                }

                .card a{
                    cursor: pointer;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: flex-start;
                    color: #E41E1E;
                    text-transform: uppercase;
                    font-size: 20px;
                    font-style: normal;
                    font-weight: 400;
                    line-height: 28px;
                    text-decoration: none;
                }

                    .card a:hover{
                        text-decoration: underline;
                    }

                    .card a:after{
                        content: '';
                        width: 22px;
                        height: 20px;
                        background-image: url(../assets/icons/arrow-right-sm.svg);
                        background-position: center center;
                        background-repeat: no-repeat;
                        background-size: cover;
                        margin-left: 16px;
                    }


.talents{
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    background-color: #203241;
}

    .talents__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items:flex-start;
    }

    .talents__text{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        padding: 90px 120px 90px 48px;
        width: calc( 40% - 190px );
    }

        .talents__text h2{
            color: #E41E1E;
            font-style: normal;
            font-weight: 700;
        }

        .talents__text h2 span{
            color: #ffffff;
        }

        .talents__text p{
            color: #FFF;
            font-size: 28px;
            font-style: normal;
            font-weight: 300;
            line-height: 45px;
        }

    .talents__photos{
        height: 100%;
        flex-grow: 1;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

        .talents__photos .p1{
            position: relative;
            background-color: #C6CCB2;
        }

            .talents__photos .p1 img{
                position: absolute;
                bottom: 0;
                left: 0;
                width: 60%;
            }

        .talents__photos .p2{
            position: relative;
            background-color: #E41E1E;
        }

            .talents__photos .p2 img{
                position: absolute;
                top: 0;
                right: 0;
                width: 60%;
            }

        .talents__photos .p3{
            position: relative;
            background-color: #8CAABF;
        }

            .talents__photos .p3 img{
                position: absolute;
                width: 50%;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }

        .talents__photos .p4{
            position: relative;
            background-color: #C6CCB2;
        }

            .talents__photos .p4 img{
                position: absolute;
                top: 0;
                left: 0;
                width: 60%;
            }

.gold{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
    background-color: #9C9754;
    overflow: hidden;
}

    .gold__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        padding: 0 48px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
    }

        .gold h2{
            color: #203241;
            margin: 0 0 42px;
            padding-right: 25%;
        }

            .gold h2 span{
                color: #ffffff;
            }

        .gold p{
            color: #FFF;
            font-size: 28px;
            line-height: 45px;
            margin: 0 0 42px;
            padding-right: 25%;
        }

        .gold .block{
            position: absolute;
            right: 0px;
            top: 120px;

            height: 66%;
            width: 360px;

            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 14px;

            overflow: hidden;
            background-color: #8CAABF;

            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

            .gold .block img{
                z-index: 1;
                content: '';
                
                display: block;
                position: absolute;
                right: -42px;
                top: -4px;

                width: 460px;

                border-top-left-radius: 14px;
                border-bottom-left-radius: 16px;
                border-top-right-radius: 16px;
                border-bottom-right-radius: 14px;

                -webkit-transform: skew(18deg);
                -moz-transform: skew(18deg);
                -o-transform: skew(18deg);
            }

            .gold .entity{
                z-index: 1;
                content: '';
                
                display: block;
                position: absolute;
                right: -42px;
                top: 180px;

                height: 60%;
                width: 360px;

                border-top-left-radius: 14px;
                border-bottom-left-radius: 16px;
                border-top-right-radius: 16px;
                border-bottom-right-radius: 14px;

                border: 1px solid #ffffff;

                -webkit-transform: skew(18deg);
                -moz-transform: skew(18deg);
                -o-transform: skew(18deg);
            }

        

.connect{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
    background-color: #ffffff;
}

    .connect__container{
        position: relative;
        max-width: 1440px;
        padding: 0 48px;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
    }

    .connect__container h2{
        color: #203241;
        margin: 0 0 42px;
    }

    .connect__container p{
        font-size: 28px;
        line-height: 45px;
        margin: 0 0 42px;
    }


.headquarter{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 0 0 90px;
}

    .headquarter__container{
        position: relative;
        max-width: 1440px;
        padding: 0 48px;
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }

    .headquarter__address{
        width: 30%;
        color: #9C9754;
        font-size: 22px;
        font-style: normal;
        font-weight: 300;
        line-height: 34px;
    }

        .headquarter__address h3{
            color: #203241;
            font-size: 30px;
            font-family: PoppinsBold;
            line-height: 52px;
            text-transform: uppercase;
            margin: 0 0 6px;
        }

        .headquarter__address a{
            color: #9C9754;
            font-size: 22px;
            font-style: normal;
            font-weight: 300;
            line-height: 34px;
            text-decoration: underline;
        }

            .headquarter__address a:hover{
                text-decoration: none;
            }

    .headquarter__image{
        width: 40%;
        border-radius: 16px;
        margin-right: 48px;
    }

    .headquarter__text{
        width: 30%;
        color: #9C9754;
        font-size: 22px;
        font-style: normal;
        font-weight: 300;
        line-height: 34px;
        margin: 0;
    }


.usaf{
    background-color: #8CAABF;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
    overflow: hidden;
}

    .usaf__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        padding: 0 48px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
    }

    .usaf h2{
        padding: 0;
        color: #ffffff;
        font-style: normal;
        font-weight: 700;
    }

    .usaf h2 span{
        color: #203241;
    }

    .usaf p{
        margin: 42px 0 0;
        color: #203241;
        font-size: 34px;
        font-style: normal;
        font-weight: 300;
        line-height: 52px;
        padding-right: 30%;
    }

    .usaf__text{
        color: #ffffff;
        font-size: 28px;
        font-style: normal;
        font-weight: 400;
        line-height: 45px;
        margin-top: 42px;
    }

    .usaf .block{
        position: absolute;
        right: 0px;
        top: 120px;

        height: 66%;
        width: 360px;

        border-top-left-radius: 14px;
        border-bottom-left-radius: 16px;
        border-top-right-radius: 16px;
        border-bottom-right-radius: 14px;

        overflow: hidden;
        background-color: #8CAABF;

        -webkit-transform: skew(-18deg);
        -moz-transform: skew(-18deg);
        -o-transform: skew(-18deg);
    }

        .usaf .block img{
            z-index: 1;
            content: '';
            
            display: block;
            position: absolute;
            right: -72px;
            top: -10px;

            height: 420px;

            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 14px;

            -webkit-transform: skew(18deg);
            -moz-transform: skew(18deg);
            -o-transform: skew(18deg);
        }

    .usaf .entity{
        z-index: 1;
        content: '';
        
        display: block;
        position: absolute;
        right: -42px;
        top: 180px;

        height: 60%;
        width: 360px;

        border-top-left-radius: 14px;
        border-bottom-left-radius: 16px;
        border-top-right-radius: 16px;
        border-bottom-right-radius: 14px;

        border: 1px solid #ffffff;

        -webkit-transform: skew(18deg);
        -moz-transform: skew(18deg);
        -o-transform: skew(18deg);
    }

.red{
    background-color: #E41E1E;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 90px 0;
    overflow: hidden;
}

    .red__container{
        position: relative;
        max-width: 1440px;
        width: 100%;
        padding: 0 48px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items:flex-start;
    }

    .red h2{
        padding: 0;
        color: #203241;
        font-style: normal;
        font-weight: 700;
    }

    .red h2 span{
        color: #ffffff;
    }

    .red p{
        margin: 42px 0 0;
        color: #ffffff;
        font-size: 34px;
        font-style: normal;
        font-weight: 300;
        line-height: 52px;
        padding-right: 50%;
    }

    .red__block{
        position: absolute;
        top: 160px;
        right: 0;
    }

    .red__images{
        position: absolute;
        bottom: 0;
        right: 0;
        display: block;
        width: 60%;
        height: 260px;
    }
    
        .red__images:before{
            z-index: 2;
            content: '';
            position: absolute;
            right: 320px;
            top: 0;
            bottom: 0;
            width: 200px;
            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 50%;
    
            background-color: #8CAABF;
        }
    
        .red__images:after{
            z-index: 1;
            content: '';
            position: absolute;
            right: 260px;
            top: 0;
            bottom: 0;
            width: 180px;
            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 14px;
    
            background-color: #8CAABF;
    
            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }
    
        .red__image{
            overflow: hidden;
            position: absolute;
            top: 0;
            right: 0;
            width: 420px;
            height: 100%;
            background-image: url(../assets/images/delivery.png);
            background-repeat: no-repeat;
            background-size: cover;
            border-radius: 16px;
        }


.blogo,
.blogo_md,
.blogo_red{
    position: relative;
    display: flex;
    width: 100%;
    padding: 90px 0;
    flex-direction: row;
    justify-content: center;
}

    .blogo_md{
        background-color: #203241;
    }

        .blogo_md:before{
            content: '';
            display: block;
            height: 48px;
            width: 190px;
            position: absolute;
            left: 50%;
            bottom: 100%;
            background-image: url(../assets/icons/arrow-top.svg);
            background-position: center bottom;
            background-repeat: no-repeat;
            background-size: contain;
            margin-left: -95px;
        }

    .blogo_red{
        background-color: #E41E1E;
    }

    .blogo__container,
    .blogo_md__container,
    .blogo_red__container{
        position: relative;
        max-width: 1440px;
        padding: 0 48px;
        width: 100%;
    }

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


        .blogo__container h2{
            margin: 0;
            padding: 0;
            color: #E41E1E;
        }

        .blogo__container p{
            color: #203241;
            font-size: 28px;
            font-style: normal;
            font-weight: 400;
            line-height: 45px;
            margin: 48px 0;
        }

        .blogo__container .image{
            display: flex;
            justify-content: center;
            margin-bottom: 32px;
        }

    .blogo_md__container{
        display: grid;
        grid-template: 
        "M G"
        "I X";

        gap: 48px;
    }

        .blogo_md__container > div{
            color: #FFF;
            font-size: 28px;
            font-style: normal;
            font-weight: 400;
            line-height: 45px;
        }

        .blogo_md__container > div:nth-child(1){
            grid-area: M;
        }

        .blogo_md__container > div:nth-child(2){
            grid-area: G;

        }

        .blogo_md__container > div:nth-child(3){
            grid-area: I;
        }

        .blogo_md__container > div:nth-child(4){
            grid-area: X;
        }


    .blogo_red__container{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 48px;
        text-align: center;
        color: #ffffff;
    }

        .blogo_red__years{
            font-family: PoppinsBold;
            font-size: 110px;
            font-style: normal;
            font-weight: 700;
            line-height: 100%;
            margin-bottom: 32px;
        }

        .blogo_red__text{
            font-size: 28px;
            font-weight: 400;
            line-height: 45px;
        }

.service-table{
    color: #9C9754;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 32px;
    margin-top: 32px;
    margin-bottom: 32px;
}

    .service-table .block{
        position: relative;
        padding: 32px;
        border: 1px solid #9C9754;
        border-radius: 18px;
    }

    .service-table .block h3{
        width: 100%;
        color: #203241;
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 34px;
        margin: 0 0 32px 0;
    }

    .service-table .block ul{
        padding: 0;
        margin: 0 0 0 12px;
    }

    .service-table .block li{
        padding: 0;
        margin: 0 0 12px 0;
    }

.technolgy-table{
    overflow: hidden;
    border: 1px solid #9C9754;
    border-radius: 18px;
}

    .technolgy-table h3{
        width: 100%;
        text-align: center;
        color: #203241;
        text-align: center;
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 34px;
        margin: 32px 0;
    }

    .technolgy-table-logos{
        margin: -1px;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    }

    .technolgy-table-logos div{
        display: flex;
        min-height: 148px;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        height: 100%;
        border-top: 1px dashed #9C9754;
        border-right: 1px dashed #9C9754;
    }

footer{
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 0 0 90px;
    background-color: #203241;
}

    .footer__container{
        position: relative;
        width: 100%;
        max-width: 1440px;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 48px;
        padding: 0 48px 64px;
    }

        .footer__container h4{
            text-transform: uppercase;
            color: #FFF;
            font-size: 26px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            text-transform: uppercase;
        }
    

        .footer__container ul{
            list-style-type: none;
            padding: 0;
            margin: 0;
        }

        .footer__container li{
            color: rgba(255, 255, 255, 0.40);
            font-size: 14px;
            font-style: normal;
            font-weight: 400;
            line-height: 30px;
        }

        .footer__container a{
            color: rgba(255, 255, 255, 0.40);
            text-decoration: none;
        }

            .footer__container a:hover{
                text-decoration: underline;
            }

.example{
    margin: 42px 0;
}

    .example__header{
        padding-top: 48px;
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 480px;
        margin-right: -48px;
    }

        .example__header h3{
            color: #203241;
            font-size: 44px;
            font-style: normal;
            font-weight: 700;
            line-height: 52px;
            margin: 0;
            padding: 0;
            width: 50%;
        }

        .example__header h4{
            color: #E41E1E;
            font-size: 20px;
            font-style: normal;
            font-weight: 700;
            line-height: 39px;
            margin: 0 0 32px;
            padding: 0;
            text-transform: uppercase;
            width: 50%;
        }


    .example__text{
        position: relative;
        column-count: 2;
        column-gap: 42px;
        color: #FFF;
        font-size: 28px;
        font-style: normal;
        font-weight: 400;
        line-height: 45px;
        margin: 64px 0;
    }

    .example__quote{
        position: relative;
        width: 75%;
        padding: 32px 0;
    }

        .example__quote span{
            z-index: 5;
            position: relative;
            color: #203241;
            font-size: 42px;
            font-style: italic;
            font-weight: 400;
            line-height: 55px;
        }

        .example__quote:before{
            content: '';
            z-index: 1;
            position: absolute;
            top: 0;
            bottom: 0;

            border-top-left-radius: 14px;
            border-bottom-left-radius: 16px;
            border-top-right-radius: 16px;
            border-bottom-right-radius: 14px;

            background-color: #fff;
            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

        .example__quote-left{
            padding-right: 64px;
        }

            .example__quote-left:before{
                right: 64px;
                left: -320px;
            }

        .example__quote-right{
            float: right;
            text-align: right;
            padding-left: 64px;
        }

            .example__quote-right:before{
                left: 64px;
                right: -320px;
            }

@media (min-width: 1440px) {
    .header,
    .delivery{
        overflow-x: visible;
    }
}

@media (max-width: 1200px) {

    h2{
        font-size: 48px;
    }

    .header__logo {
        margin-left: 48px;
        height: 64px;
    }

    .header__nav{
        margin-right: 48px;
    }

    .areyou__container p{
        font-size: 24px;
        line-height: 42px;
    }

    .card h3 {
        font-size: 36px;
    }

    .card p{
        font-size: 18px;
        line-height: 36px;
    }
}

@media (max-width: 980px) {

    header{
        height: 160px;
    }

    .header__logo {
        height: 48px;
    }

    .header__nav{
        height: 48px;
        margin-right: 48px;
        padding: 0 12px;
    }

    .header__nav a{
        padding: 0 12px;
        font-size: 16px;
    }
}

@media (max-width: 720px) {

    h2{
        font-size: 46px;
        font-style: normal;
        font-weight: 700;
        line-height: 50px;
        padding-left: 0;
        padding-right: 0;
    }

    .button{
        font-size: 18px;
        height: 48px;
        padding: 0 0 0 16px;
    }

        .button:after{
            right: -78px;
        }

        .button span:before{
            right: -84px;
        }

        .button span:after{
            right: -92px;
        }

    header{
        height: 96px;
        overflow: visible;
    }

    .logo,
    .header__logo {
        z-index: 101;
    }

    .header__logo {
        height: 32px;
        margin-left: 32px;
    }

    .header__nav{
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        max-width: 96px;
        min-width: 96px;
        height: auto;
        background-color: inherit;
        margin: 0;
        padding: 0;
    }

        .header__nav::before,
        .header__nav::after,
        .header__nav span:after{
            display: none;
        }

        .header__nav a{
            display: none;
        }

        .header__nav span{
            display: block;
            height: 24px;
            width: 24px;
            background-image: url(../assets/icons/menu.svg);
            background-repeat: no-repeat;
            background-position: center center;
            background-size: cover;
            position: absolute;
            right: 36px;
            top: 36px;
            padding: 0;
        }

        .header__nav span:focus{
            background-color: #000;
        }

        .nav-open{
            max-width: 100%;
            min-width: auto;
            left: 0;
            bottom: auto;
            padding: 108px 32px 32px;
            background-color: #fff;
            z-index: 100;
            border-radius: 0;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        .nav-open a{
            position: relative;
            display: block;
            width: 100%;
            padding: 0;
            height: 48px;
            color: #203241;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 50px;
            text-transform: uppercase;
            border-bottom: 1px solid #8CAABF;
        }

            .nav-open a:after{
                position: absolute;
                right: 16px;
                top: 17px;
                content: '';
                width: 24px;
                height: 16px;
                background-image: url(../assets/icons/arrow-right.svg);
                background-position: center center;
                background-repeat: no-repeat;
                background-size: cover;
                filter: invert(100%) sepia(0%) saturate(1%) hue-rotate(343deg) brightness(104%) contrast(102%);
            }

        .nav-open span{
            background-image: url(../assets/icons/menu-close.svg);
        }


    .bitmap{
        padding: 80px 0;
    }

    .delivery{
        padding: 42px 0;
    }

        .delivery__container{
            flex-direction: column-reverse;
        }

            .delivery__container:after{
                display: none;
            }

        .delivery__content{
            min-height: auto;
            padding: 0 32px;
            width: calc( 100% - 64px );
            margin-bottom: 32px;
        }

        .delivery__content p{
            font-size: 20px;
            font-style: normal;
            font-weight: 300;
            line-height: 32px;
        }

    .del__images{
        width: 100%;
        height: 164px;
    }

        .del__image{
            height: 164px;
            right: 32px;
        }

    .areyou{
        padding: 42px 0;
    }

        .areyou__container{
            flex-direction: column;
        }

            .areyou__container h2{
                text-align: left;
                margin-bottom: 32px;
                padding: 0 32px;
                width: calc( 100% - 64px );
            }

            .areyou__container p{
                width: auto;
                padding: 0 32px;
                font-size: 20px;
                font-style: normal;
                font-weight: 300;
                line-height: 32px;
            }

    .gold{
        padding: 42px 0;
    }

        .gold__container{
            padding: 0 32px;
        }

        .gold h2{
            padding: 0;
        }

        .gold p{
            padding-right: 0;
            font-size: 20px;
            line-height: 32px;
        }

        .gold .block{
            position: relative;
            width: 100%;
            height: 164px;
            top: 0;
        }

            .gold .block img{
                width: 280px;
            }

            .gold .entity{
                bottom: 0;
                top: auto;
                right: 240px;
                width: 280px;
                height: 164px;
                background-color: #203241;

                border: 0;

                -webkit-transform: skew(-18deg);
                -moz-transform: skew(-18deg);
                -o-transform: skew(-18deg);
            }

    .blogo{
        padding: 42px 0;
        overflow: hidden;
    }

        .blogo__container{
            padding: 0 32px;
        }

        .blogo__container p{
            padding-right: 0;
            font-size: 20px;
            line-height: 32px;
            margin: 24px 0 32px;
        }

        .blogo_md__container{
            grid-template: 
                "M"
                "I"
                "G"
                "X";
        }

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

    .white{
        overflow: hidden;
        padding: 42px 0;
    }

        .white__container{
            padding: 0 32px;
        }

        .white__container p{
            font-size: 20px;
            line-height: 34px;
        }

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

        .white__user{
            flex-direction: row;
            margin-bottom: 0;
        }

            .white__user__photo{
                width: 92px;
                height: 92px;
                min-width: 92px;
                max-width: 92px;
                border-radius: 50%;
                overflow: hidden;
                margin: 0 32px 0 0;
            }

                .white__user__photo img{
                    height: 92px;
                    width: 92px;
                    aspect-ratio: 1/1;
                }

            .white__user .info{
                display: flex;
                flex-direction: column;
                justify-content: center;
            }

            .white__user h3{
                font-size: 20px;
                line-height: 25px;
                margin-bottom: 6px;
            }

            .white__user p{
                font-size: 20px;
                line-height: 25px;
            }

            .white__user a{
                top: calc( 92px - 24px);
                left: calc( 92px - 24px);
                width: 24px;
                height: 24px;
                border-radius: 4px;
                border: 2px solid #fff;
                background-size: contain;
            }

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

            .white__block{
                padding: 36px 24px;
            }

            .white__block h3{
                font-size: 36px;
                line-height: 42px;
                min-height: 64px;
                margin-bottom: 12px;
            }

            .white__block p{
                font-size: 22px;
                line-height: 36px;
                margin: 0 0 24px 0;
            }

    .service-table{
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .technolgy-table{

    }
        .technolgy-table-logos{
            grid-template-columns: 1fr 1fr 1fr;
        }

            .technolgy-table-logos div{
                padding: 0 12px;
            }

            .technolgy-table-logos img{
                max-width: 100%;
            }

    .cards{
        position: relative;
        overflow-x: scroll;
        align-items: flex-start;
    }

        .cards__container{
            grid-template-columns: 320px 320px 320px;
        }

        .cards > a{
            position: absolute;
            left: 32px;
            bottom: 48px;
        }

        .talents__container{
            flex-direction: column;
        }

            .talents__text{
                padding: 48px 32px;
                width: calc( 100% - 64px);
            }

    
    .headquarter__container{
        flex-direction: column-reverse;
        padding: 0 32px;
    }

        .headquarter__address,
        .headquarter__image,
        .headquarter__text{
            width: 100%;
            margin: 0 0 32px;
        }

    .usaf{
        padding: 42px 0;
    }

    .usaf__container{
        flex-direction: column;
        padding: 0 32px;
    }
    
        .usaf h2{
            margin-bottom: 32px;
        }
        .usaf p{
            font-size: 20px;
            line-height: 32px;
            padding: 0;
            margin: 0 0 24px;
        }

        .usaf .block{
            position: relative;
            width: 100%;
            height: 164px;
            top: 0;
        }

        .usaf .entity{
            position: absolute;
            bottom: 0;
            top: auto;
            right: 240px;
            width: 280px;
            height: 164px;
            background-color: #E41E1E;

            border: 0;

            -webkit-transform: skew(-18deg);
            -moz-transform: skew(-18deg);
            -o-transform: skew(-18deg);
        }

        .usaf__text{
            font-size: 20px;
            line-height: 32px;
            padding: 0;
            margin: 0 0 24px;
        }

    .example{
        margin-top: 0;
    }

        .example__header{
            background-size: 300px;
            padding-bottom: 96px;
        }
        
        .example__header h4{
            width: 100%;
        }

        .example__header h3{
            font-size: 28px;
            line-height: 34px;
            padding: 0;
            width: 100%;
        }

        .example__text{
            column-count: 1;
            font-size: 16px;
            line-height: 28px;
            color: #203241;
            margin: 24px 0;
        }

        .example__quote{
            width: 100%;
            padding-left: 32px;
            padding-right: 32px;
            margin-left: -32px;
            margin-right: -32px;
        }

            .example__quote span{
                font-size: 20px;
                line-height: 32px;
            }

            .example__quote-left{
                padding-right: 64px;
            }

            .example__quote-right{
                padding-left: 64px;
            }


    .values{
        padding: 42px 0;
    }

        .values__container{
            padding: 0;
        }

        .values__container h2,
        .values__container > p{
            padding: 0 32px;
        }

        .values__container p{
            font-size: 20px;
            line-height: 32px;
        }

        .values__wrapper{
            overflow: hidden;
            display: flex;
            flex-direction: column;
            justify-content: center;
            width: 100%;
            position: relative;
            overflow-x: scroll;
            align-items: flex-start;
        }

        .values__blocks{
            grid-template-columns: 320px 320px 320px 320px;
            padding: 32px;
        }

        .values__block__title{
            height: 160px;
        }

        .values__block__title h3{
            font-size: 34px;
        }

        .values__block p{
            padding: 0;
        }

    .red{
        padding: 42px 0;
    }

        .red__container{
            padding: 0 32px;
        }

        .red p{
            font-size: 20px;
            line-height: 32px;
            padding: 0;
            margin: 24px 0;
        }

        .red__images{
            position: relative;
            width: 100%;
            height: 164px;
        }

    .connect{
        padding: 48px 0;
    }

        .connect__container{
            padding: 0 32px;
        }

    .modal-container{
        padding: 16px;
        max-width: 80%;
    }

        .modal-container .h5{
            font-size: 14px;
        }

        .modal-container h2{
            font-size: 32px;
            line-height: 145%;
        }

        .modal-container p{
            font-size: 18px;
            line-height: 32px;
        }

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

    .footer__about{
        display: none;
    }
    
    .triangle-left,
    .triangle-right,
    .triangle-bottom,
    .triangle-top{
        display: none;
    }
}
