* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: Manrope, sans-serif
}

html {
    scroll-behavior: smooth
}

.container {
    width: 100%;
    max-width: 1520px;
    margin: 0 auto
}

@media (width <= 1560px) {
    .container {
        width: calc(100% - 4rem);
        margin: 0 2rem
    }
}

@media (width <= 1024px) {
    .container {
        width: calc(100% - 2rem);
        margin: 0 1rem
    }
}

a {
    color: #0891b2;
    text-decoration: none
}

.btn {
    color: #fff;
    cursor: pointer;
    background: #0891b2;
    border: 1px solid #0891b2;
    border-radius: .5rem;
    justify-content: center;
    align-items: center;
    width: fit-content;
    height: 56px;
    padding-inline: 3rem;
    transition: background-color .2s linear, font-weight .2s linear;
    display: flex
}

.btn:hover {
    background-color: #05647b
}

.btn.large {
    width: 360px
}

.btn.transparent {
    color: #111827;
    background: 0 0;
    border-color: #111827
}

.btn.transparent:hover {
    text-decoration: underline
}

@media (width <= 1024px) {
    .btn, .btn.large {
        width: 100%
    }
}

.title {
    margin-bottom: 2rem;
    font-size: 2.5rem;
    font-weight: 700
}

@media (width <= 1000px) {
    .title {
        font-size: 2rem
    }
}

ul {
    list-style: none
}

.langSelect {
    color: #111827;
    width: max-content;
    font-size: 20px;
    font-weight: 700;
    position: relative
}

.langSelect-btn {
    color: inherit;
    font: inherit;
    cursor: pointer;
    background: 0 0;
    border: 0;
    align-items: center;
    gap: 10px;
    padding: 0;
    display: flex
}

.langSelect-chevron {
    border-bottom: 3px solid;
    border-right: 3px solid;
    width: 12px;
    height: 12px;
    margin-top: -4px;
    transition: transform .25s;
    transform: rotate(45deg)
}

.langSelect.is-open .langSelect-chevron {
    margin-top: 4px;
    transform: rotate(225deg)
}

.langSelect-list {
    opacity: 0;
    visibility: hidden;
    margin: 0;
    padding: 0;
    list-style: none;
    transition: opacity .2s, transform .2s, visibility .2s;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    transform: translateY(-4px)
}

.langSelect.is-open .langSelect-list {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

.langSelect-option {
    color: inherit;
    font: inherit;
    cursor: pointer;
    background: 0 0;
    border: 0;
    padding: 0
}

.colaboration {
    background-color: #f1f7f9;
    border: 1px solid #e5e7eb;
    border-radius: 2rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    padding: 2rem;
    display: flex
}

@media (width <= 1024px) {
    .colaboration {
        text-align: center;
        padding: 2rem 1rem
    }
}

.inputWrap {
    flex-direction: column;
    gap: .5rem;
    width: 100%;
    display: flex
}

.inputWrap input, .inputWrap textarea {
    background-color: #f1f7f9;
    border-color: #0000;
    border-radius: .7rem;
    outline: none;
    width: 100%;
    padding: .8rem;
    display: block
}

.hero {
    background: url(/data/img/mainBg-BLmr19Xz.webp) 100% 100%/cover no-repeat;
    padding-top: 10rem;
    padding-bottom: 8rem;
    position: relative
}

.hero:after {
    content: "";
    pointer-events: none;
    background: linear-gradient(#fafafa00 18.28%, #fff 100%);
    height: 230px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

@media (width <= 1024px) {
    .hero {
        background-image: url(data:image/webp;base64,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);
        background-position: bottom;
        background-size: 100%;
        padding-bottom: 0
    }
}

.hero-wrap {
    flex-direction: column;
    gap: 2rem;
    display: flex
}

.hero-wrap h2 {
    max-width: 960px;
    font-size: 5rem;
    font-weight: 700;
    line-height: 1
}

.hero-wrap p {
    color: #7c8597;
    max-width: 740px;
    font-size: 1.2rem;
    line-height: 1.5
}

@media (width <= 1024px) {
    .hero-wrap h2 {
        font-size: 2rem
    }
}

.hero-btns {
    z-index: 1;
    justify-content: space-between;
    gap: 1rem;
    max-width: 740px;
    display: flex;
    position: relative
}

@media (width <= 1024px) {
    .hero-btns {
        width: 100%;
        max-width: initial;
        flex-direction: column
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.header {
    z-index: 100;
    justify-content: space-between;
    align-items: center;
    width: calc(100% - 4rem);
    max-width: 1520px;
    padding: 2rem 0;
    display: flex;
    position: absolute;
    left: calc(50% - 760px)
}

.header .header-logo {
    z-index: 20;
    position: relative
}

.header nav ul {
    gap: 1rem;
    display: flex
}

.header nav ul li a {
    color: #000;
    font-size: 1.1rem;
    font-weight: 600
}

.header nav ul li a:hover {
    text-decoration: underline
}

.header .header-rightBlock {
    justify-content: space-between;
    align-items: center;
    width: 300px;
    display: flex
}

.header .burgerBtn {
    cursor: pointer;
    z-index: 20;
    background: 0 0;
    border: none;
    outline: none;
    flex-direction: column;
    gap: 5px;
    display: none
}

.header .burgerBtn .burgerBtn-stick {
    background: #000;
    border-radius: 4px;
    width: 30px;
    height: 3px;
    transition: transform .2s linear
}

.header .burgerBtn.opened .burgerBtn-stick:nth-child(2) {
    display: none
}

.header .burgerBtn.opened .burgerBtn-stick:first-child {
    transform: rotate(45deg) translate(5px)
}

.header .burgerBtn.opened .burgerBtn-stick:nth-child(3) {
    transform: rotate(-45deg) translate(5px)
}

.header .header-mobMenu {
    background: #fff;
    border-bottom-right-radius: 1.5rem;
    border-bottom-left-radius: 1.5rem;
    padding: 7rem 1rem 1rem;
    animation: .2s linear reverse forwards fadeIn;
    display: none;
    position: absolute;
    top: 0;
    left: -2rem;
    right: -2rem
}

.header .header-mobMenu nav {
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
    display: flex
}

.header .header-mobMenu nav ul {
    flex-direction: column
}

.header .header-mobMenu nav a {
    color: #000;
    font-weight: 600
}

@media (width <= 1560px) {
    .header {
        margin: 0;
        left: 2rem;
        right: 2rem
    }
}

@media (width <= 1024px) {
    .header nav, .header .header-rightBlock {
        display: none
    }

    .header .burgerBtn {
        display: flex
    }

    .header .header-mobMenu.opened {
        animation: .2s linear forwards fadeIn;
        display: block;
        box-shadow: 0 9px 10px #0c172326
    }
}

.solutions {
    gap: 2rem;
    padding-block: 3rem;
    display: flex
}

.solutions .solutions-pic img {
    width: 100%
}

.solutions h3 {
    max-width: 740px;
    margin-bottom: 1.5rem;
    font-size: 4rem;
    line-height: 1.1
}

.solutions .solutions-txt {
    color: #7c8597;
    flex-direction: column;
    gap: 1rem;
    font-size: 1.2rem;
    display: flex
}

@media (width <= 1024px) {
    .solutions h2 {
        text-align: center
    }
}

@media (width <= 768px) {
    .solutions {
        flex-direction: column
    }

    .solutions h3 {
        font-size: 2rem
    }

    .solutions .solutions-pic {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .solutions .solutions-pic img {
        max-width: 300px
    }
}

.offer {
    padding-block: 3rem
}

.offer-list {
    grid-gap: 1rem;
    grid-template-columns:repeat(auto-fill, minmax(270px, 350px));
    justify-content: center;
    display: grid
}

.offer-item {
    border-radius: 2rem;
    padding: 2rem;
    box-shadow: 0 4px 12px #0c172326
}

.offer-item img {
    width: 64px;
    margin-bottom: 1rem
}

.offer-item h4 {
    margin-bottom: .7rem;
    font-size: 1.5rem;
    line-height: 1.2
}

.offer-item p {
    color: #7c8597
}

.services {
    padding-block: 3rem
}

.services-row {
    grid-gap: 1rem;
    grid-template-columns:repeat(3, 1fr);
    margin-bottom: 1.3rem;
    display: grid
}

.services-row.long {
    grid-template-columns:repeat(2, 1fr)
}

.services-row .services-item {
    background-color: #fff;
    border-radius: 2rem;
    flex-direction: column;
    gap: 1rem;
    padding: 2rem;
    display: flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 12px #0c172326
}

.services-row .services-item:after {
    content: "";
    opacity: .05;
    background: radial-gradient(circle, #0081a5 10%, #0068b2 20%, #fff 70%) 0 0/cover;
    border-radius: 2rem;
    width: 160px;
    height: 160px;
    position: absolute;
    top: -40px;
    right: -40px
}

.services-row .services-item img {
    width: 64px
}

.services-row .services-item p {
    color: #7c8597
}

@media (width <= 1024px) {
    .services-row, .services-row.long {
        grid-template-columns:1fr
    }
}

.roadmap {
    background: #5f8da6 url(/data/img/cellBg-A1BARGkZ.webp) 100% 0 no-repeat;
    border-radius: 2rem;
    margin-block: 2rem;
    padding: 4rem
}

.roadmap h3 {
    color: #fff;
    max-width: 660px;
    margin-bottom: 1.5rem;
    font-size: 3rem
}

.roadmap p {
    color: #e5e7eb;
    max-width: 665px;
    font-size: 1.1rem;
    line-height: 1.3
}

@media (width <= 768px) {
    .roadmap {
        padding: 4rem 1rem
    }

    .roadmap h3 {
        font-size: 2rem
    }
}

.roadmap-steps {
    margin-inline: auto;
    width: 100%;
    max-width: 880px;
    margin-top: 2rem;
    position: relative
}

.roadmap-steps:after {
    content: "";
    background-color: #fff;
    width: 2px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%
}

@media (width <= 768px) {
    .roadmap-steps:after {
        left: 0
    }
}

.roadmap-stepRow {
    justify-content: flex-end;
    display: flex;
    position: relative
}

.roadmap-stepRow:nth-child(2n) {
    justify-content: start
}

.roadmap-stepRow:after {
    content: "";
    background-color: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    position: absolute;
    top: calc(50% - 7px);
    left: calc(50% - 7px)
}

@media (width <= 768px) {
    .roadmap-stepRow {
        justify-content: flex-start;
        margin-bottom: 1rem;
        margin-left: 1.5rem
    }

    .roadmap-stepRow:after {
        left: -1.9rem
    }
}

.roadmap-step {
    background-color: #f1f7f9;
    border-radius: 1rem;
    width: 400px;
    padding: 2rem;
    box-shadow: 0 4px 12px #0c172326
}

.roadmap-step .roadmap-stepNum {
    color: #0891b2;
    font-size: 4rem;
    font-weight: 700
}

.roadmap-step h4 {
    color: #111827;
    margin-block: 1rem
}

.roadmap-step p {
    color: #7c8597
}

.approach {
    grid-gap: 1rem;
    grid-template-columns:repeat(2, 1fr);
    padding-block: 3rem;
    display: grid
}

@media (width <= 768px) {
    .approach {
        grid-template-columns:1fr
    }
}

.approach-txtBlock h2 {
    margin-bottom: 1rem;
    font-size: 2.1rem
}

.approach-txtBlock p {
    color: #7c8597;
    margin-bottom: .7rem
}

@media (width <= 768px) {
    .approach-txtBlock h2 {
        font-size: 2rem
    }
}

.approach-expertise h3 {
    margin-bottom: 1.5rem
}

.approach-expertise .approach-expetiseList {
    grid-gap: 1rem;
    grid-template-columns:repeat(2, 1fr);
    display: grid
}

.approach-expertise .approach-expetiseItem {
    border-radius: .5rem;
    align-items: center;
    gap: .4rem;
    padding: .5rem;
    display: flex;
    box-shadow: 0 4px 12px #0c172326
}

@media (width <= 768px) {
    .approach-expertise .approach-expetiseList {
        grid-template-columns:1fr
    }
}

.suggestion {
    background: radial-gradient(48.38% 37.87% at 79.74% 44.09%, #dce7edcc 0%, #fffc 100%) 100% 0/100% no-repeat;
    margin-block: 3rem
}

.suggestion-wrap {
    background: url(/data/img/suggestion-DW-XpXPU.webp) 100% 0/30% no-repeat
}

.suggestion-wrap h3 {
    margin-bottom: 2rem
}

@media (width <= 768px) {
    .suggestion-wrap {
        background-image: none
    }
}

.suggestion-heading {
    max-width: 700px;
    margin-bottom: 2rem
}

.suggestion-heading h2 {
    margin-bottom: 2rem;
    font-size: 3rem;
    line-height: 1.1
}

.suggestion-heading p {
    color: #7c8597;
    font-size: 1.2rem
}

@media (width <= 768px) {
    .suggestion-heading h2 {
        font-size: 2rem
    }
}

.suggestion-mobPic {
    display: none
}

@media (width <= 768px) {
    .suggestion-mobPic {
        width: 100%;
        margin-bottom: 1rem;
        display: block
    }
}

.foundation {
    margin-block: 3rem
}

.foundation h2 {
    max-width: 700px;
    font-size: 2.5rem
}

@media (width <= 1024px) {
    .foundation h2 {
        font-size: 2rem
    }
}

.foundation-list {
    border-radius: 1rem;
    grid-template-columns:repeat(3, 1fr);
    margin-block: 2rem;
    display: grid;
    box-shadow: 0 4px 12px #0c172326
}

.foundation-list .foundation-item {
    background-color: #fff;
    padding: 2rem
}

.foundation-list .foundation-item p {
    color: #7c8597
}

.foundation-list .foundation-item h4 {
    align-items: center;
    gap: .4rem;
    margin-bottom: 1.4rem;
    display: flex
}

.foundation-list .foundation-item:first-child {
    border-top-left-radius: 1rem
}

.foundation-list .foundation-item:nth-child(3) {
    border-top-right-radius: 1rem
}

.foundation-list .foundation-item:nth-child(4) {
    border-bottom-left-radius: 1rem
}

.foundation-list .foundation-item:last-child {
    border-bottom-right-radius: 1rem
}

.foundation-list .foundation-item:nth-child(2n) {
    background-color: #5f8da6
}

.foundation-list .foundation-item:nth-child(2n) p, .foundation-list .foundation-item:nth-child(2n) h4 {
    color: #fff
}

@media (width <= 1024px) {
    .foundation-list {
        grid-template-columns:1fr
    }

    .foundation-list .foundation-item:first-child {
        border-top-right-radius: 1rem
    }

    .foundation-list .foundation-item:nth-child(3) {
        border-top-right-radius: 0
    }

    .foundation-list .foundation-item:nth-child(4) {
        border-bottom-left-radius: 0
    }

    .foundation-list .foundation-item:last-child {
        border-bottom-left-radius: 1rem
    }
}

.feedbacks {
    padding-block: 3rem
}

.feedbacks h2 {
    font-size: 3rem
}

@media (width <= 1024px) {
    .feedbacks {
        padding-bottom: 1.5rem
    }

    .feedbacks h2 {
        font-size: 2rem
    }
}

.feedbacks-list {
    grid-gap: 1rem;
    grid-template-columns:repeat(3, 1fr);
    margin-block: 2rem;
    display: grid
}

@media (width <= 1024px) {
    .feedbacks-list {
        grid-template-columns:1fr;
        justify-items: center
    }
}

.feedbacks-item {
    grid-gap: 1rem;
    border-radius: 2rem;
    grid-template-rows:40px 1fr 60px;
    max-width: 480px;
    height: 450px;
    padding: 2rem;
    display: grid;
    box-shadow: 0 4px 12px #0c172326
}

.feedbacks-item > img {
    width: 30px
}

.feedbacks-item > p {
    font-size: 1.2rem;
    line-height: 1.5
}

.feedbacks-item .feedback-author {
    border-top: 1px solid #e5e7eb;
    align-items: center;
    gap: .5rem;
    padding-top: .5rem;
    display: flex
}

.feedbacks-item .feedback-author img {
    border-radius: 50%;
    width: 45px;
    height: 45px;
}

.feedbacks-img {
    border-radius: 50%;
    width: 45px;
    height: 45px;
    background: #2f73ac;
    text-align: center;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    padding: 8px;
}

.feedbacks-item .feedback-author p {
    flex-direction: column;
    display: flex
}

.feedbacks-item .feedback-author p .feedback-authorPosition {
    color: #7c8597
}

@media (width <= 1024px) {
    .feedbacks-item {
        height: auto;
        min-height: 400px;
        margin-block: 0
    }
}

.joinUs {
    padding-block: 3rem
}

@media (width <= 1024px) {
    .joinUs {
        padding-block: 0
    }
}

.joinUs-wrap {
    grid-gap: 4rem;
    grid-template-columns:repeat(2, 1fr);
    margin-block: 2rem;
    display: grid
}

.joinUs-wrap .joinUs-ourTeam {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

.joinUs-wrap .joinUs-ourTeam h2 {
    font-size: 2.5rem
}

.joinUs-wrap .joinUs-ourTeam p {
    color: #7c8597;
    max-width: 700px
}

.joinUs-wrap .joinUs-directionList {
    grid-gap: 1rem;
    grid-template-columns:repeat(2, 1fr);
    margin-block: 1rem;
    display: grid
}

.joinUs-wrap .joinUs-directionList .joinUs-directionItem {
    border-radius: .5rem;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    display: flex;
    box-shadow: 0 4px 12px #0c172326
}

@media (width <= 1024px) {
    .joinUs-wrap, .joinUs-wrap .joinUs-directionList {
        grid-template-columns:1fr
    }
}

.contactUs {
    grid-gap: 1rem;
    grid-template-columns:repeat(2, 1fr);
    margin-block: 3rem;
    display: grid
}

@media (width <= 1024px) {
    .contactUs {
        grid-template-columns:1fr
    }
}

.contactUs-info {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

.contactUs-info p {
    color: #7c8597
}

.contacts-list {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

.contacts-item {
    align-items: center;
    gap: 1rem;
    display: flex
}

.contacts-item p span:first-child {
    color: #7c8597
}

.contacts-item p span:last-child {
    color: #000
}

.contacts-item img {
    border-radius: .7rem;
    transition: box-shadow .2s linear
}

a.contacts-item:hover img {
    box-shadow: 0 0 6px 2px #0891b280
}

a.contacts-item:hover p span:last-child {
    text-decoration: underline
}

.contactUs-form {
    border-radius: 1.5rem;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    padding: 2rem;
    display: flex;
    box-shadow: 0 4px 12px #0c172326
}

.contactUs-form h3 {
    text-align: left;
    width: 100%
}

.contactUs-form .submit-notice {
    color: #7c8597
}

.contactUs-msg {
    color: #0891b2;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    width: 100%;
    height: 100%;
    font-size: 1.4rem;
    font-weight: 600;
    display: flex
}

footer {
    background-color: #5f8da6;
    padding-block: 3rem
}

footer .footer-sections {
    grid-gap: 1.5rem;
    grid-template-columns:repeat(3, 1fr);
    margin-bottom: 2rem;
    display: grid
}

footer .footer-sections h4 {
    color: #fff;
    margin-bottom: 1rem
}

footer .footer-sections .footer-company p {
    color: #fff
}

footer .footer-sections .footer-nav nav {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

footer .footer-sections .footer-nav nav a {
    color: #fff
}

footer .footer-sections .footer-contactsList {
    flex-direction: column;
    gap: 1rem;
    display: flex
}

@media (width <= 1024px) {
    footer .footer-sections {
        grid-template-columns:1fr
    }
}

footer .footer-rightsBlock {
    border-top: 1px solid #e5e7eb;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 2rem 0;
    display: flex
}

footer .footer-rightsBlock p, footer .footer-rightsBlock a {
    color: #fff
}

@media (width <= 1024px) {
    footer .footer-rightsBlock {
        flex-direction: column-reverse;
        align-items: center
    }

    footer .footer-rightsBlock p {
        text-align: center
    }
}

footer .footer-contactsItem {
    align-items: center;
    gap: 1rem;
    display: flex
}

footer .footer-contactsItem span {
    color: #fff
}

footer a.footer-contactsItem:hover span:last-child {
    text-decoration: underline
}