@font-face {
    font-family: 'Poppins';
    src: url("../fonts/subset-Poppins-Medium.woff2") format("woff2"), url("../fonts/subset-Poppins-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("../fonts/subset-Poppins-Regular.woff2") format("woff2"), url("../fonts/subset-Poppins-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url("../fonts/subset-Poppins-SemiBold.woff2") format("woff2"), url("../fonts/subset-Poppins-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

body {
    line-height: 1;
}

ol,
ul {
    list-style: none;
}

blockquote,
q {
    quotes: none;
}

    blockquote:before,
    blockquote:after,
    q:before,
    q:after {
        content: "";
        content: none;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
}

body {
    font-family: "Poppins";
}

a {
    text-decoration: none;
}

.container {
    padding: 0 7%;
    margin: 0 auto;
}

.education {
    position: relative;
    height: 100%;
}

    .education:hover .education__main__drp {
        display: flex;
    }

    .education:hover svg {
        transition: all 0.3s ease;
        rotate: 180deg;
    }

    .education .education__main__drp {
        position: absolute;
        z-index: 999;
        top: 38px;
        left: 0;
        box-shadow: 0 4px 8px 6px rgba(16, 24, 40, 0.08);
        border: 1px solid #e6e6fd;
        background-color: #fff;
        border-radius: 12px;
        display: none;
        transition: all 0.3s ease;
    }

        .education .education__main__drp .education__drp {
            position: relative;
            padding: 20px 0;
        }

            .education .education__main__drp .education__drp .cascade__drp {
                width: max-content;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 14px;
                position: absolute;
                z-index: 2;
                left: 97%;
                top: 0;
                padding: 25px 60px 25px 25px;
                box-shadow: 0 4px 8px 6px rgba(16, 24, 40, 0.08);
                border: 1px solid #e6e6fd;
                background-color: #fff;
                border-radius: 12px;
                transition: all 0.2s ease;
                display: none;
            }

                .education .education__main__drp .education__drp .cascade__drp li {
                    cursor: pointer;
                }

            .education .education__main__drp .education__drp .cascade__drp1 {
                width: max-content;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 14px;
                position: absolute;
                z-index: 2;
                left: 97%;
                top: 0;
                padding: 25px 60px 25px 25px;
                box-shadow: 0 4px 8px 6px rgba(16, 24, 40, 0.08);
                border: 1px solid #e6e6fd;
                background-color: #fff;
                border-radius: 12px;
                display: none;
                transition: all 0.2s ease;
            }

                .education .education__main__drp .education__drp .cascade__drp1 li {
                    cursor: pointer;
                }

        .education .education__main__drp .education__drp__item {
            display: flex;
            cursor: pointer;
            padding: 13px 26px;
        }

            .education .education__main__drp .education__drp__item a {
                font-size: 16px;
                font-weight: 500;
                line-height: 24px;
                color: #191919;
            }

            .education .education__main__drp .education__drp__item:hover {
                background-color: #e6e6fd;
            }

            .education .education__main__drp .education__drp__item .drp-text {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
                flex-wrap: nowrap;
                width: 100%;
                gap: 32px;
                padding-left: 20px;
            }

            .education .education__main__drp .education__drp__item img {
                width: 24px;
                height: 24px;
            }

        .education .education__main__drp .cascade__main:hover .cascade__drp {
            display: flex;
        }

        .education .education__main__drp .cascade__main:hover .svg-rotate {
            transition: all 0.3s ease;
            rotate: 360deg;
        }

        .education .education__main__drp .cascade__main1:hover .cascade__drp1 {
            display: flex;
        }

        .education .education__main__drp .cascade__main1:hover .svg-rotate {
            transition: all 0.3s ease;
            rotate: 360deg;
        }

.aside-menu {
    transition: 0.3s all;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 300;
    width: 100%;
    height: 100%;
    background-color: #000081;
    padding: 23px 20px 20px 20px;
    transform: translateX(-100%);
}

    .aside-menu.active {
        transform: translateX(0);
    }

.aside-menu__wrp {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

    .aside-menu__wrp .close {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        flex-wrap: nowrap;
        margin-bottom: 30px;
    }

.aside-menu__list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 50px;
}

    .aside-menu__list a {
        color: #e6fcfd;
        font-size: 24px;
        font-weight: 500;
        line-height: 32px;
    }

.aside-menu__brands {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}

.aside-menu__education {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}

.star {
    margin-bottom: 2px;
}

.slick-initialized .slick-slide {
    display: flex;
}

.star-slider {
    padding: 24px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    background-image: linear-gradient(#0000ea, #000081);
}

@media only screen and (max-width: 768px) {
    .star-slider {
        padding: 18px 0;
    }
}

.star-slider__items {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 768px) {
    .star-slider__items svg {
        width: 24px;
        height: 24px;
    }
}

.star-slider__text {
    height: 34.4px;
    text-align: center;
}

    .star-slider__text span {
        transform: translateX(50%);
        color: #b0f7f9;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
    }

@media only screen and (max-width: 768px) {
    .star-slider__text span {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

.accordion-menu {
    padding: 18px 22px 51px 20px;
    background-color: #000081;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    transform: translateX(-100%);
    transition: all 0.3s;
}

    .accordion-menu.active {
        transform: translateX(0);
    }

.accordion-menu__wrp ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 24px;
}

    .accordion-menu__wrp ul span {
        font-size: 24px;
        font-weight: 500;
        line-height: 32px;
        color: #e6e6fd;
    }

    .accordion-menu__wrp ul a {
        font-size: 20px;
        font-weight: 400;
        line-height: 28px;
        color: #b0b0f8;
    }

.accordion-menu__header {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 52px;
}

.accordion-menu .close {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

header {
    padding: 24px 0;
    border-bottom: 1px solid #8a8af5;
}

@media only screen and (max-width: 768px) {
    header .logo svg {
        width: 147px;
        height: 28px;
    }
}

header .navbar {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

    header .navbar nav {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;
    }

        header .navbar nav.page-nav li .nav-list-text.active {
            color: #191919;
        }

        header .navbar nav.page-nav li .nav-list-text:not(.active) {
            opacity: 50%;
        }

        header .navbar nav .burger__menu {
            display: none;
        }

@media only screen and (max-width: 1030px) {
    header .navbar nav .burger__menu {
        display: initial;
    }
}

header .navbar nav .nav-list {
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    gap: 40px;
}

@media only screen and (max-width: 1030px) {
    header .navbar nav .nav-list {
        display: none;
    }
}

header .navbar nav .nav-list li {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}

    header .navbar nav .nav-list li .nav-list-text {
        color: #191919;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
    }

        header .navbar nav .nav-list li .nav-list-text:hover {
            color: #0000ea;
        }

            header .navbar nav .nav-list li .nav-list-text:hover svg path {
                stroke: #0000ea;
            }

.footer {
    padding: 60px 0 37px 0;
    background-color: #000062;
}

    .footer .footer-main {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
        flex-wrap: nowrap;
    }

@media only screen and (max-width: 768px) {
    .footer .footer-main {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }
}

.footer .footer-main .footer-main__logo {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    width: 24%;
    gap: 30px;
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__logo {
        width: 100%;
    }
}

@media only screen and (max-width: 1024px) {
    .footer .footer-main .footer-main__logo {
        width: 40%;
    }
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__logo svg {
        width: 157px;
        height: 29px;
    }
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__logo .footer-main__text {
        width: 100%;
    }
}

.footer .footer-main .footer-main__logo .footer-main__text p {
    color: #e6fcfd;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__logo .footer-main__text p {
        font-size: 8px;
        font-weight: 400;
        line-height: 14px;
    }
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__logo .footer-main__social {
        display: none;
    }
}

.footer .footer-main .footer-main__logo .footer-main__social ul {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 32px;
}

.footer .footer-main .footer-main__education {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    width: 38%;
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__education {
        display: none;
    }
}

@media only screen and (max-width: 1024px) {
    .footer .footer-main .footer-main__education {
        width: 50%;
    }
}

.footer .footer-main .footer-main__education .footer-main__list ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 8px;
}

    .footer .footer-main .footer-main__education .footer-main__list ul li a {
        color: #8a8af5;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
    }

        .footer .footer-main .footer-main__education .footer-main__list ul li a:hover {
            color: #8af3f6;
        }

    .footer .footer-main .footer-main__education .footer-main__list ul .active {
        color: #e6e6fd;
    }

        .footer .footer-main .footer-main__education .footer-main__list ul .active:hover {
            color: #8af3f6;
        }

.footer .footer-main .footer-main__education .footer-main__about ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 14px;
}

    .footer .footer-main .footer-main__education .footer-main__about ul li a {
        color: #8a8af5;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
    }

        .footer .footer-main .footer-main__education .footer-main__about ul li a:hover {
            color: #8af3f6;
        }

    .footer .footer-main .footer-main__education .footer-main__about ul .active {
        color: #e6e6fd;
    }

        .footer .footer-main .footer-main__education .footer-main__about ul .active:hover {
            color: #8af3f6;
        }

.footer .footer-main .footer-main__education-responsive {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    display: none;
}

@media only screen and (max-width: 768px) {
    .footer .footer-main .footer-main__education-responsive {
        display: flex;
    }
}

.footer .footer-main .footer-main__education-responsive .edication-responsive-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 14px;
}

    .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__list ul {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 8px;
    }

        .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__list ul li a {
            color: #8a8af5;
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
        }

            .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__list ul li a:hover {
                color: #8af3f6;
            }

        .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__list ul .active {
            color: #e6e6fd;
        }

            .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__list ul .active:hover {
                color: #8af3f6;
            }

    .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__about ul {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 14px;
    }

        .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__about ul li a {
            color: #8a8af5;
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
        }

            .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__about ul li a:hover {
                color: #8af3f6;
            }

        .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__about ul .active {
            color: #e6e6fd;
        }

            .footer .footer-main .footer-main__education-responsive .edication-responsive-list .footer-main__about ul .active:hover {
                color: #8af3f6;
            }

.footer .footer-main .footer-main__education-responsive .footer-main__social-responsive ul {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    height: 100%;
}

.law {
    padding: 14px 0;
}

    .law a {
        font-size: 12px;
        font-weight: 400;
        line-height: 24px;
        color: #000062;
    }

        .law a:hover {
            cursor: pointer;
        }

.header-banner {
    padding-top: 32px;
}

.header-banner__main {
    position: relative;
    background-image: url(/assets/images/Vector.svg);
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 60px;
    padding: 88px 0 83px 0;
}

@media only screen and (max-width: 768px) {
    .header-banner__main {
        padding: 88px 20px 83px 20px;
    }
}

.header-banner__title {
    text-align: center;
    width: 45%;
}

@media only screen and (max-width: 768px) {
    .header-banner__title {
        width: 100%;
    }
}

.header-banner__title h1 {
    font-size: 48px;
    font-weight: 600;
    line-height: 64px;
    color: #0000a6;
    margin-bottom: 20px;
}

@media only screen and (max-width: 768px) {
    .header-banner__title h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.header-banner__title span {
    font-size: 34px;
    font-weight: 400;
    line-height: 40px;
    color: #0000a6;
}

@media only screen and (max-width: 768px) {
    .header-banner__title span {
        font-size: 20px;
        font-weight: 400;
        line-height: 28px;
    }
}

.header-banner__images {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 40px;
}

@media only screen and (max-width: 768px) {
    .header-banner__images img {
        width: 335px;
        height: 233px;
    }
}

.header-banner__images a {
    padding: 16px 72px;
    background-color: #00e4eb;
    border: none;
    border-radius: 8px;
    color: #0000a6;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
}

    .header-banner__images a:hover {
        transition: all 0.3s ease;
        background-color: #b0f7f9;
    }

.header-banner__svg {
    position: absolute;
}

.header-banner .star-1 {
    top: 23%;
    left: 7%;
}

.header-banner .star-2 {
    top: 27%;
    left: 90%;
}

.header-banner .star-3 {
    top: 39%;
    left: 70%;
}

@media only screen and (max-width: 768px) {
    .header-banner .star-3 {
        top: 73%;
    }
}

.header-banner .star-4 {
    bottom: 15%;
    left: 76%;
}

.header-banner .star-5 {
    left: 25%;
    bottom: 40%;
}

@media only screen and (max-width: 1024px) {
    .header-banner .star-5 {
        left: 18%;
    }
}

.header-banner .star-6 {
    left: 15%;
    bottom: 18%;
}

@media only screen and (max-width: 768px) {
    .header-banner .star-4,
    .header-banner .star-5,
    .header-banner .star-6 {
        display: none;
    }
}

.header-banner .line {
    bottom: 5%;
    left: 32%;
}

@media only screen and (max-width: 768px) {
    .header-banner .line {
        bottom: 0;
    }
}

@media only screen and (max-width: 1024px) {
    .header-banner .line {
        bottom: 0;
        left: 43%;
    }
}

.educational-programs {
    padding: 140px 0;
}

    .educational-programs .educational-programs-main {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }

.educational-programs__title {
    text-align: center;
}

    .educational-programs__title h2 {
        font-size: 58px;
        font-weight: 600;
        line-height: 72px;
        color: #000081;
    }

@media only screen and (max-width: 1024px) {
    .educational-programs__title h2 {
        font-size: 46px;
        font-weight: 600;
        line-height: 64px;
    }
}

.educational-programs__cards {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 20px;
}

@media only screen and (max-width: 768px) {
    .educational-programs__cards {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.educational-programs__cards .programming-card {
    position: relative;
    border: 2px solid #e6e6fd;
    border-radius: 16px;
    padding: 14px 14px 24px 24px;
    width: calc((100% - 40px) / 3);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 162px;
}

@media only screen and (max-width: 768px) {
    .educational-programs__cards .programming-card {
        width: 100%;
    }
}

.educational-programs__cards .programming-card:hover #icon {
    background-color: #e6fcfd;
}

.educational-programs__cards .programming-card:hover .card-first-svg {
    display: none;
}

.educational-programs__cards .programming-card:hover .card-arrow-svg {
    display: initial;
}

.educational-programs__cards .programming-card:hover {
    border: 2px solid #0000a6;
}

.educational-programs__cards .programming-card__head {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
}

    .educational-programs__cards .programming-card__head #icon {
        padding: 10px;
        background-color: #e6e6fd;
        border-radius: 8px;
    }

    .educational-programs__cards .programming-card__head .card-arrow-svg {
        display: none;
    }

.educational-programs__cards .programming-card__footer {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 8px;
}

    .educational-programs__cards .programming-card__footer span {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: #0000d5;
    }

@media only screen and (max-width: 1024px) {
    .educational-programs__cards .programming-card__footer span {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .educational-programs__cards .programming-card__footer span {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
    }
}

.educational-programs__cards .programming-card__footer h5 {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    color: #000081;
}

@media only screen and (max-width: 1024px) {
    .educational-programs__cards .programming-card__footer h5 {
        font-size: 20px;
        font-weight: 600;
        line-height: 28px;
    }
}

.educational-programs__cards .programming-card .click {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
}

.educational-programs__btn a {
    padding: 16px 72px;
    border: 1px solid #0000ea;
    border-radius: 8px;
    color: #0000ea;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    display: inline-block;
    width: 100%;
    text-align: center;
}

    .educational-programs__btn a:hover {
        background-color: #0000ea;
        transition: all 0.3s ease;
        color: #e6e6fd;
    }

.about {
    padding: 31px 20px 0 100px;
    background-image: url(/assets/images/bc-img.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left 0;
}

@media only screen and (max-width: 768px) {
    .about {
        padding: 80px 20px 0 20px;
    }
}

.about .about-main {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 1024px) {
    .about .about-main {
        position: relative;
    }
}

@media only screen and (max-width: 768px) {
    .about .about-main {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.about .about-main__imgs {
    position: relative;
    width: 60%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: end;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 1024px) {
    .about .about-main__imgs {
        width: 60%;
    }
}

@media only screen and (max-width: 768px) {
    .about .about-main__imgs {
        width: 100%;
    }
}

.about .about-main__imgs .about-image {
    max-width: 800px;
    width: 100%;
    height: 838px;
    border-radius: 10px;
    overflow: hidden;
}

@media only screen and (max-width: 768px) {
    .about .about-main__imgs .about-image {
        height: max-content;
    }
}

.about .about-main__imgs .about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about .about-main__imgs .about-line svg {
    position: absolute;
    right: 95%;
    top: 8%;
}

@media only screen and (max-width: 1024px) {
    .about .about-main__imgs .about-line svg {
        width: 74px;
        height: 168px;
    }
}

@media only screen and (max-width: 768px) {
    .about .about-main__imgs .about-line svg {
        right: 95%;
    }
}

.about .about-main__text {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: end;
    flex-wrap: nowrap;
    width: 30%;
    padding-bottom: 100px;
}

@media only screen and (max-width: 1024px) {
    .about .about-main__text {
        width: 40%;
        padding-bottom: 80px;
    }
}

@media only screen and (max-width: 768px) {
    .about .about-main__text {
        width: 100%;
    }
}

.about .about-main__text .context {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: start;
    flex-wrap: nowrap;
    gap: 32px;
    height: 100%;
    width: 100%;
}

@media only screen and (max-width: 768px) {
    .about .about-main__text .context {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.about .about-main__text .context h2 {
    font-size: 58px;
    font-weight: 600;
    line-height: 72px;
    color: #000062;
}

@media only screen and (max-width: 1024px) {
    .about .about-main__text .context h2 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .about .about-main__text .context h2 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.about .about-main__text .context p {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: #0000a6;
}

@media only screen and (max-width: 1024px) {
    .about .about-main__text .context p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

.about .about-main__text .context a {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: #0000a6;
    padding: 16px 72px;
    border-radius: 8px;
    border: none;
    background-color: #00e4eb;
}

    .about .about-main__text .context a:hover {
        transition: all 0.3s ease;
        background-color: #b0f7f9;
    }

.projects {
    padding: 120px 0;
}

    .projects .projects-main {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }

    .projects .projects-main__text {
        text-align: center;
    }

        .projects .projects-main__text h2 {
            font-size: 58px;
            font-weight: 600;
            line-height: 72px;
            color: #000081;
        }

@media only screen and (max-width: 1024px) {
    .projects .projects-main__text h2 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .projects .projects-main__text h2 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

@media only screen and (max-width: 768px) {
    .projects .projects-main .projects-slider {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.projects .projects-main .projects-slider__items {
    margin-right: 20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 20px;
    border: 1px solid #b0b0f8;
    border-radius: 16px;
    padding: 10px 10px 10px 24px;
}

@media only screen and (max-width: 768px) {
    .projects .projects-main .projects-slider__items {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        padding: 20px;
        margin: 0;
    }
}

.projects .projects-main .projects-slider__items:hover {
    border: 1px solid #0000ea;
}

    .projects .projects-main .projects-slider__items:hover .items-left span {
        color: #00e4eb;
        transition: all 0.3s ease;
    }

.projects .projects-main .projects-slider__items .items-left {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 768px) {
    .projects .projects-main .projects-slider__items .items-left {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }
}

.projects .projects-main .projects-slider__items .items-left span {
    font-size: 93px;
    font-weight: 400;
    line-height: 93px;
    color: #e6e6fd;
}

.projects .projects-main .projects-slider__items .items-left p {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #0000d5;
}

.projects .projects-main .projects-slider__items .items-right {
    width: 60%;
    overflow: hidden;
}

@media only screen and (max-width: 768px) {
    .projects .projects-main .projects-slider__items .items-right {
        width: 100%;
    }
}

.projects .projects-main .projects-slider__items .items-right figure {
    border-radius: 10px;
    overflow: hidden;
    height: 340px;
}

    .projects .projects-main .projects-slider__items .items-right figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.projects .projects-main__btn {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}

    .projects .projects-main__btn a {
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        color: #0000ea;
        padding: 10px 48px;
        border: 1px solid #0000ea;
        background: none;
        border-radius: 8px;
    }

        .projects .projects-main__btn a:hover {
            transition: all 0.3s ease;
            color: #e6e6fd;
            background-color: #0000ea;
        }

.projects .projects-main .projects-main__btn svg:hover rect {
    stroke: #8a8af5;
}

.projects .projects-main .projects-main__btn svg:hover path {
    stroke: #0000ea;
}

.regions {
    padding-bottom: 80px;
}

    .regions .regions-main {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 80px;
    }

    .regions .regions-main__text {
        max-width: 440px;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }

        .regions .regions-main__text .text-head {
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            align-items: stretch;
            flex-wrap: nowrap;
            gap: 20px;
        }

            .regions .regions-main__text .text-head h2 {
                font-size: 58px;
                font-weight: 600;
                line-height: 72px;
                color: #000081;
            }

@media only screen and (max-width: 1024px) {
    .regions .regions-main__text .text-head h2 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .regions .regions-main__text .text-head h2 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.regions .regions-main__text .text-head h2 span {
    color: #0000ea;
}

.regions .regions-main__text .text-head p {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: #000081;
}

.regions .regions-main__text .text-head a {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #0000ea;
    text-decoration: underline;
}

    .regions .regions-main__text .text-head a:hover {
        transition: all 0.3s ease;
        color: #00cfd6;
    }

.regions .regions-main__text .text-body {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
}

    .regions .regions-main__text .text-body .text-body-left {
        width: 73%;
        /*style the items (options), including the selected item:*/
        /*style items (options):*/
        /*hide the items when the select box is closed:*/
    }

        .regions .regions-main__text .text-body .text-body-left .custom-select {
            position: relative;
            width: 100%;
            padding: 10px 14px;
            border: 1px solid #b0b0f8;
            border-radius: 8px;
            outline: none;
            color: #b0b0f8;
            font-size: 14px;
            font-weight: 400;
            line-height: 24px;
            box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
        }

            .regions .regions-main__text .text-body .text-body-left .custom-select select {
                display: none;
                /*hide original SELECT element:*/
            }

        .regions .regions-main__text .text-body .text-body-left .select-selected {
            background-color: #fff;
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: stretch;
            flex-wrap: nowrap;
            position: relative;
        }

            .regions .regions-main__text .text-body .text-body-left .select-selected:after {
                position: absolute;
                content: url(/assets/images/chevron-down.svg);
                right: 0;
                top: 9%;
                display: flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;
                flex-wrap: nowrap;
            }

            .regions .regions-main__text .text-body .text-body-left .select-selected.select-arrow-active::after {
                transform: rotate(180deg);
                position: absolute;
                right: 0;
                bottom: 39%;
            }

        .regions .regions-main__text .text-body .text-body-left .select-items {
            position: absolute;
            background-color: #fff;
            top: 100%;
            left: 0;
            right: 0;
            z-index: 99;
            border: 1px solid #b0b0f8;
            border-radius: 8px;
        }

            .regions .regions-main__text .text-body .text-body-left .select-items div {
                position: relative;
                padding: 10px 14px;
                outline: none;
                color: #000062;
                font-size: 14px;
                font-weight: 400;
                line-height: 24px;
                display: flex;
                flex-direction: row;
                justify-content: flex-start;
                align-items: stretch;
                flex-wrap: nowrap;
            }

                .regions .regions-main__text .text-body .text-body-left .select-items div:after {
                    position: absolute;
                    content: url(/assets/images/check.svg);
                    top: 14px;
                    right: 10%;
                    width: 0;
                    height: 0;
                    display: none;
                }

            .regions .regions-main__text .text-body .text-body-left .select-items .same-as-selected {
                position: relative;
            }

                .regions .regions-main__text .text-body .text-body-left .select-items .same-as-selected:after {
                    position: absolute;
                    content: url(/assets/images/check.svg);
                    top: 14px;
                    right: 10%;
                    width: 0;
                    height: 0;
                    display: initial;
                }

        .regions .regions-main__text .text-body .text-body-left .select-hide {
            display: none;
        }

        .regions .regions-main__text .text-body .text-body-left .select-items div:hover,
        .regions .regions-main__text .text-body .text-body-left .same-as-selected {
            background-color: #e6e6fd;
        }

.regions .regions-main__text .text-body-right {
    width: 27%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
}

    .regions .regions-main__text .text-body-right button {
        padding: 10px 37px;
        background-color: #0000d5;
        border: none;
        border-radius: 8px;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }

        .regions .regions-main__text .text-body-right button:hover {
            transition: all 0.3s ease;
            background-color: #b0b0f8;
            color: #000081;
        }

@media only screen and (max-width: 768px) {
    .regions .regions-main__text .text-body-right button {
        padding: 10px 22px;
    }
}

.regions .regions-main__text .text-body-right button .search-text {
    color: #e6e6fd;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}

@media only screen and (max-width: 768px) {
    .regions .regions-main__text .text-body-right button .search-text {
        display: none;
    }
}

.regions .regions-main__text .text-body-right button .search-btn {
    display: none;
}

@media only screen and (max-width: 768px) {
    .regions .regions-main__text .text-body-right button .search-btn {
        display: initial;
        color: #e6e6fd;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

.regions .regions-main__map figure {
    position: relative;
}

@media only screen and (max-width: 1024px) {
    .regions .regions-main__map figure {
        max-width: 857px;
        width: 100%;
    }

        .regions .regions-main__map figure .main-svg {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover;
        }
}

@media only screen and (max-width: 768px) {
    .regions .regions-main__map figure {
        max-width: 375px;
        width: 100%;
        overflow-x: auto;
    }

        .regions .regions-main__map figure::-webkit-scrollbar {
            height: 4px;
        }

        .regions .regions-main__map figure::-webkit-scrollbar-thumb {
            background-color: #8af3f6;
            outline: 1px solid #8af3f6;
        }

        .regions .regions-main__map figure::-webkit-scrollbar-track {
            background: #e6fcfd;
            box-shadow: inset 0 0 5px #e6fcfd;
            border-left: 2px solid #e6fcfd;
            border-right: 2px solid #e6fcfd;
        }

        .regions .regions-main__map figure .main-svg {
            width: initial;
        }
}

.regions .regions-main__map .main-svg .hover-region {
    fill: #0000ea;
}

.not-found {
    position: relative;
}

    .not-found .not-found-main {
        height: 100vh;
        background-image: url(/assets/images/not-found-bg.svg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 90%;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
    }

    .not-found .not-found-main__body {
        max-width: 590px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 40px;
    }

@media only screen and (max-width: 768px) {
    .not-found .not-found-main__body {
        width: 100%;
    }
}

.not-found .not-found-main__body h1 {
    font-size: 300px;
    font-weight: 600;
    line-height: 300px;
    color: #000081;
}

@media only screen and (max-width: 768px) {
    .not-found .not-found-main__body h1 {
        font-size: 170px;
        font-weight: 600;
        line-height: 300px;
    }
}

.not-found .not-found-main__body h5 {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
    color: #000081;
}

.not-found .not-found-main__body button {
    padding: 12px 48px;
    border: 1px solid #0000ea;
    background: none;
    border-radius: 8px;
}

    .not-found .not-found-main__body button:hover {
        border: 1px solid #b0b0f8;
        background-color: #b0b0f8;
        transition: all 0.3s ease;
    }

        .not-found .not-found-main__body button:hover a {
            color: #000062;
        }

    .not-found .not-found-main__body button a {
        color: #0000ea;
        font-size: 16px;
        font-weight: 500;
        line-height: 20px;
    }

.not-found .NF_star1 {
    position: absolute;
    left: 6.5%;
    top: 40%;
}

@media only screen and (max-width: 768px) {
    .not-found .NF_star1 {
        left: 46%;
        top: 16%;
    }
}

.not-found .NF_star2 {
    position: absolute;
    right: 6.5%;
    top: 40%;
}

@media only screen and (max-width: 768px) {
    .not-found .NF_star2 {
        display: none;
    }
}

.about-page .about-page-nav {
    padding: 14px 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 12px;
}

    .about-page .about-page-nav figure {
        display: flex;
    }

    .about-page .about-page-nav span, .about-page .about-page-nav a {
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        color: #000062;
    }

.about-page .about-page-main {
    position: relative;
    padding: 100px 0 180px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 87px;
}

    .about-page .about-page-main .about-page-head {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 40px;
    }

@media only screen and (max-width: 768px) {
    .about-page .about-page-main .about-page-head {
        width: 100%;
    }
}

.about-page .about-page-main .about-page-head h1 {
    font-size: 58px;
    font-weight: 600;
    line-height: 72px;
    color: #000081;
}

@media only screen and (max-width: 1024px) {
    .about-page .about-page-main .about-page-head h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 1024px) and (max-width: 768px) {
    .about-page .about-page-main .about-page-head h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.about-page .about-page-main .about-page-head img {
    width: 566px;
    height: 640px;
}

@media only screen and (max-width: 768px) {
    .about-page .about-page-main .about-page-head img {
        width: 344px;
        height: 390px;
    }
}

.about-page .about-page-main .about-page-body {
    text-align: center;
    max-width: 891px;
}

    .about-page .about-page-main .about-page-body p {
        font-size: 16px;
        font-weight: 400;
        line-height: 28px;
        color: #000062;
    }

@media only screen and (max-width: 1024px) {
    .about-page .about-page-main .about-page-body p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .about-page .about-page-main .about-page-body p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

.about-page .about-page-main .about-page-line {
    position: absolute;
    left: 16%;
    top: 16%;
}

@media only screen and (max-width: 1400px) {
    .about-page .about-page-main .about-page-line {
        position: absolute;
        left: 7%;
        top: 16%;
    }
}

@media only screen and (max-width: 1024px) {
    .about-page .about-page-main .about-page-line {
        position: absolute;
        left: 0;
        top: 16%;
    }
}

@media only screen and (max-width: 768px) {
    .about-page .about-page-main .about-page-line {
        display: none;
    }
}

.about-page .about-page-main .about-page-line2 {
    position: absolute;
    right: 14%;
    bottom: 47%;
    rotate: 180deg;
}

@media only screen and (max-width: 1400px) {
    .about-page .about-page-main .about-page-line2 {
        position: absolute;
        right: 7%;
        bottom: 47%;
    }
}

@media only screen and (max-width: 1024px) {
    .about-page .about-page-main .about-page-line2 {
        position: absolute;
        right: 0;
        bottom: 47%;
    }
}

@media only screen and (max-width: 768px) {
    .about-page .about-page-main .about-page-line2 {
        display: none;
    }
}

.advantage {
    padding-bottom: 120px;
}

    .advantage .advantage-main {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 60px;
    }

    .advantage .advantage-main__text {
        text-align: center;
    }

        .advantage .advantage-main__text span {
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
            color: #0000ea;
        }

        .advantage .advantage-main__text h3 {
            font-size: 34px;
            font-weight: 600;
            line-height: 40px;
            color: #000062;
            margin-top: 12px;
        }

    .advantage .advantage-main__box {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
        gap: 24px;
    }

@media only screen and (max-width: 768px) {
    .advantage .advantage-main__box {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 60px;
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 1024px) {
    .advantage .advantage-main__box {
        margin-bottom: 60px;
    }
}

.advantage .advantage-main__box .advantage-box-items {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 20px;
    width: calc((100% - 48px) / 3);
}

    .advantage .advantage-main__box .advantage-box-items figure {
        text-align: center;
    }

    .advantage .advantage-main__box .advantage-box-items .box-items-text {
        text-align: center;
    }

        .advantage .advantage-main__box .advantage-box-items .box-items-text h5 {
            font-size: 20px;
            font-weight: 500;
            line-height: 28px;
            color: #000062;
            margin-bottom: 10px;
        }

        .advantage .advantage-main__box .advantage-box-items .box-items-text p {
            font-size: 14px;
            font-weight: 400;
            line-height: 24px;
            color: #0000ea;
        }

@media only screen and (max-width: 768px) {
    .advantage .advantage-main__box .advantage-box-items {
        width: 100%;
    }
}

.projects-page .projects-page-nav {
    padding: 14px 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 12px;
}

    .projects-page .projects-page-nav figure {
        display: flex;
    }

    .projects-page .projects-page-nav a, .projects-page .projects-page-nav span {
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        color: #000062;
    }

.projects-page .projects-page-main {
    padding: 100px 0 120px 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 40px;
}

.projects-page .projects-page-main__text {
    text-align: center;
}

    .projects-page .projects-page-main__text h1 {
        font-size: 58px;
        font-weight: 600;
        line-height: 72px;
        color: #000081;
    }

@media only screen and (max-width: 1024px) {
    .projects-page .projects-page-main__text h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 1024px) and (max-width: 768px) {
    .projects-page .projects-page-main__text h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.projects-page .projects-page-main__cards {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 20px;
}

@media only screen and (max-width: 768px) {
    .projects-page .projects-page-main__cards {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: wrap;
        gap: 20px;
    }
}

.projects-page .projects-page-main__cards .card-items {
    width: calc((100% - 40px) / 2);
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 20px;
    border: 1px solid #b0b0f8;
    border-radius: 16px;
    padding: 10px 10px 10px 24px;
}

@media only screen and (max-width: 768px) {
    .projects-page .projects-page-main__cards .card-items {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        padding: 20px;
        margin: 0;
    }
}

.projects-page .projects-page-main__cards .card-items:hover {
    border: 1px solid #0000ea;
}

    .projects-page .projects-page-main__cards .card-items:hover .items-left span {
        color: #00e4eb;
        transition: all 0.3 ease;
    }

.projects-page .projects-page-main__cards .card-items .items-left {
    width: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 768px) {
    .projects-page .projects-page-main__cards .card-items .items-left {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }
}

.projects-page .projects-page-main__cards .card-items .items-left span {
    font-size: 93px;
    font-weight: 400;
    line-height: 93px;
    color: #e6e6fd;
}

@media only screen and (max-width: 1024px) {
    .projects-page .projects-page-main__cards .card-items .items-left span {
        font-size: 58px;
        font-weight: 400;
        line-height: 72px;
    }
}

.projects-page .projects-page-main__cards .card-items .items-left p {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #0000d5;
}

.projects-page .projects-page-main__cards .card-items .items-right {
    width: 60%;
    overflow: hidden;
}

@media only screen and (max-width: 768px) {
    .projects-page .projects-page-main__cards .card-items .items-right {
        width: 100%;
    }
}

.projects-page .projects-page-main__cards .card-items .items-right figure {
    height: 340px;
    border-radius: 10px;
    overflow: hidden;
}

    .projects-page .projects-page-main__cards .card-items .items-right figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.projects-page .projects-page-main__btn button {
    padding: 16px 72px;
    border: 1px solid #0000ea;
    background: none;
    border-radius: 8px;
    width: 100%;
}

    .projects-page .projects-page-main__btn button:hover {
        background-color: #0000ea;
        transition: all 0.3s ease;
    }

        .projects-page .projects-page-main__btn button:hover a {
            color: #e6e6fd;
        }

    .projects-page .projects-page-main__btn button a {
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        color: #0000ea;
    }

.projects-name {
    background-image: url(/assets/images/projects-bg.svg);
    background-repeat: no-repeat;
    background-size: 1145px;
    background-position: left 0;
}

@media only screen and (max-width: 768px) {
    .projects-name {
        padding: 0 20px;
    }
}

.projects-name .projects-name-main {
    position: relative;
    padding: 100px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 60px;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main {
        padding-top: 64px;
    }
}

.projects-name .projects-name-main__head {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 40px;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main__head {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: nowrap;
        gap: 20px;
    }
}

.projects-name .projects-name-main__head h1 {
    font-size: 58px;
    font-weight: 600;
    line-height: 72px;
    color: #000081;
}

@media only screen and (max-width: 1024px) {
    .projects-name .projects-name-main__head h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 1024px) and (max-width: 768px) {
    .projects-name .projects-name-main__head h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.projects-name .projects-name-main__head figure {
    max-width: 505px;
    height: 543px;
    border-radius: 10px;
    overflow: hidden;
}

    .projects-name .projects-name-main__head figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.projects-name .projects-name-main__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 20px;
    max-width: 820px;
    text-align: center;
}

    .projects-name .projects-name-main__body .body-text {
        max-width: 610px;
    }

        .projects-name .projects-name-main__body .body-text h5 {
            font-size: 20px;
            font-weight: 600;
            line-height: 28px;
            color: #000062;
        }

    .projects-name .projects-name-main__body p {
        font-size: 16px;
        font-weight: 400;
        line-height: 28px;
        color: #000062;
    }

.projects-name .projects-name-main .projects__svg {
    position: absolute;
}

.projects-name .projects-name-main .star-1 {
    top: 10%;
    left: 3.5%;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main .star-1 {
        top: 4%;
        left: 0;
    }
}

.projects-name .projects-name-main .star-2 {
    top: 15%;
    left: 90%;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main .star-2 {
        right: 0;
        top: 0;
    }
}

.projects-name .projects-name-main .star-3 {
    top: 23%;
    left: 70%;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main .star-3 {
        top: 73%;
    }
}

@media only screen and (max-width: 1280px) {
    .projects-name .projects-name-main .star-3 {
        left: 80%;
        top: 23%;
    }
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main .star-3 {
        display: none;
    }
}

.projects-name .projects-name-main .star-4 {
    top: 50%;
    left: 76%;
}

.projects-name .projects-name-main .star-5 {
    left: 25%;
    top: 35%;
}

@media only screen and (max-width: 1024px) {
    .projects-name .projects-name-main .star-5 {
        left: 18%;
    }
}

.projects-name .projects-name-main .star-6 {
    left: 15%;
    top: 50%;
}

@media only screen and (max-width: 768px) {
    .projects-name .projects-name-main .star-4,
    .projects-name .projects-name-main .star-5,
    .projects-name .projects-name-main .star-6 {
        display: none;
    }
}

.projects-page-nav {
    padding: 14px 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 12px;
}

    .projects-page-nav figure {
        display: flex;
    }

    .projects-page-nav span {
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        color: #000062;
    }

.education-page {
    padding: 100px 0 120px 0;
}

    .education-page .education-page-text {
        text-align: center;
        margin-bottom: 40px;
    }

        .education-page .education-page-text h1 {
            font-size: 58px;
            font-weight: 600;
            line-height: 72px;
            color: #000081;
        }

@media only screen and (max-width: 1024px) {
    .education-page .education-page-text h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .education-page .education-page-text h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.education-page .education-card-main {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 20px;
}

@media only screen and (max-width: 768px) {
    .education-page .education-card-main {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.education-page .education-card-main__items {
    width: calc((100% - 40px) / 3);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 4px;
}

@media only screen and (max-width: 768px) {
    .education-page .education-card-main__items {
        width: 100%;
    }
}

.education-page .items-head {
    border: 2px solid #e6e6fd;
    border-radius: 16px;
    padding: 14px 14px 24px 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 162px;
}

@media only screen and (max-width: 768px) {
    .education-page .items-head {
        width: 100%;
    }
}

.education-page .items-head:hover a {
    background-color: #e6fcfd;
}

.education-page .items-head:hover {
    border: 2px solid #0000a6;
}

.education-page .items-head__icons {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
}

    .education-page .items-head__icons a {
        padding: 10px;
        background-color: #e6e6fd;
        border-radius: 8px;
    }

    .education-page .items-head__icons .card-arrow-svg {
        display: none;
    }

.education-page .items-head__text {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 8px;
}

    .education-page .items-head__text span {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: #0000d5;
    }

@media only screen and (max-width: 1024px) {
    .education-page .items-head__text span {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .education-page .items-head__text span {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
    }
}

.education-page .items-head__text h5 {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    color: #000081;
}

@media only screen and (max-width: 1024px) {
    .education-page .items-head__text h5 {
        font-size: 20px;
        font-weight: 600;
        line-height: 28px;
    }
}

.education-page .items-footer ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 4px;
}

    .education-page .items-footer ul li {
        width: 100%;
        border: 2px solid #e6e6fd;
        border-radius: 16px;
    }

        .education-page .items-footer ul li:hover {
            border: 2px solid #8a8af5;
            box-shadow: 0px 4px 10px 0px rgba(121, 61, 33, 0.15);
        }

            .education-page .items-footer ul li:hover span {
                color: #0000ea;
            }

        .education-page .items-footer ul li a {
            font-size: 20px;
            font-weight: 500;
            line-height: 28px;
            color: #000081;
            padding: 26px 24px;
            display: inline-block;
            width: 100%;
        }

.design-page {
    background-image: url(/assets/images/design-bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 100%;
    position: relative;
}

@media only screen and (max-width: 768px) {
    .design-page {
        padding: 0 20px;
    }
}

.design-page__title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    text-align: center;
    gap: 20px;
    padding: 100px 0 300px 0;
}

    .design-page__title h1 {
        font-size: 58px;
        font-weight: 600;
        line-height: 72px;
        color: #000081;
    }

@media only screen and (max-width: 1024px) {
    .design-page__title h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .design-page__title h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

.design-page__title p {
    max-width: 820px;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    color: #000062;
}

@media only screen and (max-width: 1024px) {
    .design-page__title p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

@media only screen and (max-width: 768px) {
    .design-page__title p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
    }
}

.design-page .slider-wrp {
    position: absolute;
    max-width: 1030px;
    width: 100%;
    transform: translateX(-50%);
    left: 50%;
    top: 72%;
}

@media only screen and (max-width: 1024px) {
    .design-page .slider-wrp {
        padding: 0 20px;
    }
}

.design-page .slider-wrp figure {
    width: 100%;
    height: 400px;
}

    .design-page .slider-wrp figure img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 20px;
    }

.design-page .slider-wrp .slick-slider-dots {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    display: flex;
}

    .design-page .slider-wrp .slick-slider-dots ul {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
    }

        .design-page .slider-wrp .slick-slider-dots ul li {
            margin: 0 14px;
        }

            .design-page .slider-wrp .slick-slider-dots ul li button {
                background: #8a8af5;
                width: 6px;
                height: 6px;
                overflow: hidden;
                border: none;
                color: #8a8af5;
                border-radius: 50%;
                font-size: 0;
            }

            .design-page .slider-wrp .slick-slider-dots ul li.slick-active button {
                background: #0000d5;
                color: #0000d5;
                width: 8px;
                height: 8px;
                border-radius: 50%;
            }

.design-page .design-star {
    position: absolute;
    left: 50%;
    top: 62%;
}

.details {
    padding-top: 300px;
}

    .details figure {
        text-align: center;
    }

    .details .details-title {
        text-align: center;
    }

        .details .details-title span {
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
            color: #0000ea;
        }

        .details .details-title h3 {
            font-size: 34px;
            font-weight: 600;
            line-height: 40px;
            color: #000062;
            margin-top: 12px;
        }

.apply {
    padding: 56px;
    background-image: url(/assets/images/apply-bg.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}

.apply__title {
    text-align: center;
    max-width: 610px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 24px;
}

    .apply__title h3 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
        color: #000062;
    }

    .apply__title p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        color: #000062;
    }

    .apply__title a {
        padding: 16px 72px;
        border-radius: 8px;
        background-color: #00e4eb;
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        color: #0000a6;
    }

        .apply__title a:hover {
            background-color: #b0f7f9;
            transition: all .3s ease;
        }

.advantage .box-items-number {
    width: 48px;
    height: 48px;
    background-color: #e6e6fd;
    border-radius: 50%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}

    .advantage .box-items-number span {
        color: #0000ea;
        font-size: 14px;
        font-weight: 600;
        line-height: 14px;
    }

.container .projects-page-nav span, .container .projects-page-nav a {
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    color: #000062;
}

.contact-page {
    padding-top: 100px;
}

@media only screen and (max-width: 1024px) {
    .contact-page {
        padding: 100px 20px 0 20px;
    }
}

.contact-page__wrp {
    background-image: url(/assets/images/contact-bg.svg);
    background-repeat: no-repeat;
    background-position: 100%;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 120px;
    padding-bottom: 120px;
}

    .contact-page__wrp .contact-main {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 104px;
        max-width: 1030px;
        width: 100%;
    }

        .contact-page__wrp .contact-main iframe {
            border-radius: 16px;
            width: 100%;
        }

    .contact-page__wrp .contact-adress {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
        flex-wrap: nowrap;
    }

@media only screen and (max-width: 768px) {
    .contact-page__wrp .contact-adress {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 40px;
    }
}

.contact-page__wrp .contact-adress .adress, .contact-page__wrp .contact-adress .phone, .contact-page__wrp .contact-adress .mail {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
}

@media only screen and (max-width: 768px) {
    .contact-page__wrp .contact-adress .adress, .contact-page__wrp .contact-adress .phone, .contact-page__wrp .contact-adress .mail {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.contact-page__wrp .contact-adress .adress a, .contact-page__wrp .contact-adress .adress span, .contact-page__wrp .contact-adress .phone a, .contact-page__wrp .contact-adress .phone span, .contact-page__wrp .contact-adress .mail a, .contact-page__wrp .contact-adress .mail span {
    color: #00036C;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
}

.contact-page__wrp .contact-apply {
    width: 100%;
    max-width: 650px;
    text-align: center;
}

    .contact-page__wrp .contact-apply h5 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
        color: #000081;
        margin-bottom: 40px;
    }

    .contact-page__wrp .contact-apply .contact-input {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
        flex-wrap: nowrap;
        gap: 10px;
        margin-bottom: 10px;
    }

@media only screen and (max-width: 768px) {
    .contact-page__wrp .contact-apply .contact-input {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        flex-wrap: nowrap;
    }
}

.contact-page__wrp .contact-apply .contact-input .contact-items {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 6px;
}

    .contact-page__wrp .contact-apply .contact-input .contact-items input {
        width: 100%;
        border-radius: 8px;
        padding: 10px 14px;
        border: 1px solid #b0b0f8;
        outline: none;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        color: #8a8af5;
        box-shadow: 0px 1px 2px 0px rgba(121, 61, 33, 0.15);
    }

@media only screen and (max-width: 768px) {
    .contact-page__wrp .contact-apply .contact-input .contact-items input {
        width: 100%;
    }
}

.contact-page__wrp .contact-apply .contact-input .contact-items #name-error {
    text-align: start;
    color: #F04438;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    border: none;
    margin-bottom: 22px;
}

.contact-page__wrp .contact-apply .contact-input .contact-items #surname-error {
    text-align: start;
    color: #F04438;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    border: none;
    margin-bottom: 22px;
}

.contact-page__wrp .contact-apply .contact-input .contact-items #email-error {
    text-align: start;
    color: #F04438;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    border: none;
    margin-bottom: 22px;
}

.contact-page__wrp .contact-apply .contact-input .contact-items #telephone-error {
    text-align: start;
    color: #F04438;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    border: none;
    margin-bottom: 22px;
}

.contact-page__wrp .contact-apply .contact-input .contact-items .error {
    border: 1px solid #F04438;
}

.contact-page__wrp .contact-apply .textarea-items {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 6px;
}

    .contact-page__wrp .contact-apply .textarea-items #textBox {
        width: 100%;
        border-radius: 8px;
        padding: 10px 14px;
        border: 1px solid #b0b0f8;
        outline: none;
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        color: #8a8af5;
        box-shadow: 0px 1px 2px 0px rgba(121, 61, 33, 0.15);
        font-family: 'Poppins';
        margin-bottom: 40px;
    }

    .contact-page__wrp .contact-apply .textarea-items #textBox-error {
        text-align: start;
        color: #F04438;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        border: none;
        margin-bottom: 22px;
    }

    .contact-page__wrp .contact-apply .textarea-items #textBox.error {
        border: 1px solid #F04438;
        margin-bottom: 0;
    }

.contact-page__wrp .contact-apply button {
    padding: 16px 72px;
    border-radius: 8px;
    background-color: #00e4eb;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: #0000a6;
    border: none;
}

    .contact-page__wrp .contact-apply button:hover {
        background-color: #b0f7f9;
        transition: all .3s ease;
    }

.contact-page__title {
    text-align: center;
    margin-bottom: 40px;
}

    .contact-page__title h1 {
        font-size: 58px;
        font-weight: 600;
        line-height: 72px;
        color: #000081;
    }

@media only screen and (max-width: 1024px) {
    .contact-page__title h1 {
        font-size: 48px;
        font-weight: 600;
        line-height: 64px;
    }
}

@media only screen and (max-width: 768px) {
    .contact-page__title h1 {
        font-size: 34px;
        font-weight: 600;
        line-height: 40px;
    }
}

/*service*/

.service {
    padding-bottom: 140px;
}

    .service .service-wrp .title {
        text-align: center;
    }

    .service .service-wrp {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }

        .service .service-wrp .title h2 {
            font-size: 58px;
            line-height: 72px;
            font-weight: 600;
            color: #000081;
        }

        .service .service-wrp .cards {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
        }

            .service .service-wrp .cards .card-item {
                width: calc((100% - 40px) / 3);
                border: 1px solid #b0b0f8;
                border-radius: 16px;
                padding: 10px 10px 10px 24px;
                display: flex;
                flex-direction: row-reverse;
                gap: 30px;
            }

                .service .service-wrp .cards .card-item .content {
                    height: 100%;
                    display: flex;
                    flex-direction: column;
                    justify-content: end;
                }

                    .service .service-wrp .cards .card-item .content h5 {
                        font-size: 24px;
                        line-height: 32px;
                        font-weight: 600;
                        color: #000081;
                    }

                    .service .service-wrp .cards .card-item .content p {
                        font-size: 16px;
                        line-height: 24px;
                        font-weight: 400;
                        color: #0000d5;
                    }

                .service .service-wrp .cards .card-item figure {
                    width: 300px;
                    height: 200px;
                    overflow: hidden;
                    border-radius: 10px;
                }

                    .service .service-wrp .cards .card-item figure img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }

        .service .service-wrp .btn a {
            display: inline-flex;
            padding: 10px 48px;
            border-radius: 8px;
            border: 1px solid #0000ea;
            font-size: 16px;
            line-height: 20px;
            font-weight: 500;
            color: #0000EA;
        }

            .service .service-wrp .btn a:hover {
                color: #fff;
                background-color: #0000EA;
                transition: all 0.3s ease;
            }


/*service responsive*/

@media only screen and (max-width: 1024px) {
    .service .service-wrp .title h2 {
        font-size: 48px;
        line-height: 64px;
    }
    .service .service-wrp .cards .card-item {
        width: calc( ( 100% - 20px ) / 2 );
        padding: 6px 6px 6px 16px;
        gap: 20px;
    }
        .service .service-wrp .cards .card-item .content h5 {
            font-size: 20px;
            line-height: 28px;
        }
        .service .service-wrp .cards .card-item .content p {
            font-size: 14px;
        }
}
@media only screen and (max-width: 768px){
    .service .service-wrp .title h2 {
        font-size: 34px;
        line-height: 40px;
    }
    .service .service-wrp .cards .card-item {
        width: 100%;
        padding: 14px 20px 20px 20px;
        gap: 20px;
        flex-direction:column;
    }
        .service .service-wrp .cards .card-item figure {
            width:100%;
            height:318px;
        }
        .service .service-wrp .cards .card-item .content{
            height:max-content;
        }
}