@import"https://fonts.googleapis.com/css2?family=Epilogue&family=Montserrat:wght@300;400;500;700;800;900&family=Readex+Pro:wght@200;300;400;500;600;700&display=swap";
@import"https://fonts.googleapis.com/css2?family=Nunito&display=swap";
@import"https://fonts.googleapis.com/css2?family=Nunito&family=Rubik:ital,wght@1,300&display=swap";
@import"https://fonts.googleapis.com/css2?family=Readex+Pro&display=swap";

/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
*,
:before,
:after {
    box-sizing: border-box
}

html {
    -moz-tab-size: 4;
    tab-size: 4
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

body {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"
}
.teamBox article {
    margin-left: 20px;
}
hr {
    height: 0;
    color: inherit
}

abbr[title] {
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp,
pre {
    font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    text-indent: 0;
    border-color: inherit
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
select {
    text-transform: none
}

button,
[type=button],
[type=reset],
[type=submit] {
    -webkit-appearance: button
}

::-moz-focus-inner {
    border-style: none;
    padding: 0
}

:-moz-focusring {
    outline: 1px dotted ButtonText
}

:-moz-ui-invalid {
    box-shadow: none
}

legend {
    padding: 0
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0
}

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

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

a {
    color: currentColor;
    text-decoration: none
}

button {
    cursor: pointer
}

img {
    display: block
}

body {
    font-family: Readex Pro, sans-serif
}

@media screen and (min-width: 370px) {
    .container {
        max-width: 350px;
        margin: 0 auto;
        padding: 0
    }
}

@media screen and (min-width: 836px) {
    .container {
        max-width: 672px;
        margin: 0 auto;
        padding: 0
    }
}

@media screen and (min-width: 1444px) {
    .container {
        margin: 0 auto;
        padding: 0;
        max-width: 1280px
    }
}

.animate__medium {
    animation-duration: 1.5s
}

.header-block {
    max-height: 83px
}

.argo-logo {
    fill: #fff;
    transition: fill .25s cubic-bezier(.4, 0, .8, 1)
}

.logo {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    background: #0d7680;
    border-radius: 50%;
    box-shadow: 0 4px 4px #6576801a;
    transition: background .25s cubic-bezier(.4, 0, .8, 1)
}

.logo:hover {
    background: linear-gradient(196deg, #e8c5a48f 51.61%, #b2d9da 88.78%)
}

.logo:hover .argo-logo {
    fill: #64757f
}

.header-container {
    margin-top: 41px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-list {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    padding: 20px 10px;
    flex-wrap: wrap;
}

@media screen and (max-width: 836px) {
    .header-list {
        display: none
    }
}

.header-item {
    padding: 10px 14px;
    background: none;
    border-radius: 8px;
    transition: padding .25s cubic-bezier(.4, 0, .8, 1), background .25s cubic-bezier(.4, 0, .8, 1), box-shadow .25s cubic-bezier(.4, 0, .8, 1), border-radius .25s cubic-bezier(.4, 0, .8, 1)
}

.header-item:hover {
    padding: 10px 20px;
    border-radius: 8px;
    background: linear-gradient(341deg, #e8c5a4cc 30.77%, #b2d9dacc 76.23%);
    box-shadow: 0 4px 4px #e4f2f2;
}

.header-link {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

.toggle-menu-close-point {
    width: 20px;
    height: 20px
}

span {
    color: var(--dark)
}

.hamburger-menu {
    align-self: center;
    display: none
}

@media screen and (max-width: 836px) {
    .hamburger-menu {
        display: inline-block
    }
}

.hamburger {
    display: block;
    width: 29px;
    height: 3px;
    margin-top: 4px;
    background-color: #000;
    border-radius: 3px
}

.menu-container {
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 80px 35px 40px 40px;
    background: #fff;
    box-shadow: 0 2px 1px #2e2f4214, 0 1px 1px #2e2f4229, 0 1px 6px #2e2f4214;
    z-index: 999;
    transform: translate(100%);
    transition: transform .25s ease-in-out
}

.menu-container.is-open {
    transform: translate(0)
}

.toggleMenu-item {
    margin-top: 40px;
    font-weight: 700;
    font-size: 36px;
    line-height: 1.1111111111;
    letter-spacing: .02em;
    text-transform: capitalize;
    color: var(--dark)
}

.toggleMenu-item:first-child {
    margin-top: 0
}

@media screen and (min-width: 370px) and (max-width: 836px) {

    .toggleMenu-item:hover,
    .toggleMenu-item:focus {
        color: #404bbf
    }

    .toggle-menu-close-round {
        display: flex;
        justify-content: center;
        align-items: center;
        position: absolute;
        right: 24px;
        top: 24px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        cursor: pointer;
        background-color: #e7e9fc;
        border: 1px solid rgba(0, 0, 0, .1);
        transition: background-color .25s cubic-bezier(.4, 0, .2, 1)
    }

    .toggle-menu-close-point {
        width: 8px;
        height: 8px;
        cursor: pointer;
        transition: fill .25s cubic-bezier(.4, 0, .2, 1)
    }

    .toggle-menu-close-round:hover,
    .toggle-menu-close-point:hover .toggle-menu-close-round:focus,
    .toggle-menu-close-point:focus {
        background-color: #404bbf;
        border: none;
        fill: #fff
    }
}

.hero {
    padding-top: 170px
}

@media screen and (max-width: 836px) {
    .hero {
        padding-top: 70px
    }
}

@media screen and (min-width: 836px) {
    .hero-container {
        display: flex;
        justify-content: space-between
    }
}

@media screen and (min-width: 836px) {
    .wellcome-box {
        display: flex;
        width: 314px;
        flex-direction: column;
        align-items: flex-start;
        gap: 34px;
        flex-shrink: 0
    }
}

@media screen and (min-width: 1444px) {
    .wellcome-box {
        width: 522px
    }
}

.hero-head {
    margin-top: 11px;
    font-size: 40px;
    color: #000;
    font-style: normal;
    font-weight: 700;
    line-height: 140%
}

@media screen and (min-width: 1444px) {
    .hero-head {
        font-size: 50px
    }
}

.hero-txt {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal
}

@media screen and (min-width: 1444px) {
    .hero-txt {
        width: 523px
    }
}

.hero-btn {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 227px;
    height: 66px;
    gap: 10px;
    border-radius: 39px;
    background-color: #0d7680;
    border: none;
    box-shadow: 0 4px 4px #00000026;
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    transition: background-color .25s cubic-bezier(.4, 0, .8, 1)
}

@media screen and (max-width: 836px) {
    .hero-btn {
        margin-top: 30px
    }
}

.hero-btn:hover {
    background-color: transparent;
    color: #000
}

.hero-btn:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(226deg, #e8c5a466 1.33%, #0e778066 95.31%);
    opacity: 0;
    transition: opacity .25s cubic-bezier(.4, 0, .8, 1);
    z-index: -1
}

.hero-btn:hover:before {
    opacity: 1
}

@media screen and (min-width: 836px) {
    .hero-image-box {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: flex-end
    }
}

@media screen and (min-width: 1444px) {
    .hero-image-box {
        position: relative;
        padding-right: 41px
    }
}

@media screen and (min-width: 836px) {
    .image2-wraper {
        width: 195px;
        height: 264px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat;
        z-index: 2
    }
}

@media screen and (min-width: 1444px) {
    .image2-wraper {
        width: 282px;
        height: 347px;
        margin-top: 14px
    }
}

@media screen and (min-width: 836px) {
    .image1-wraper {
        width: 255px;
        height: 183px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat
    }
}

@media screen and (min-width: 1444px) {
    .image1-wraper {
        width: 469px;
        height: 272px;
        z-index: -1;
        margin-right: 12px
    }
}

@media screen and (min-width: 370px) {
    .hero-wave1 {
        display: none
    }
}

@media screen and (min-width: 836px) {
    .hero-wave1 {
        display: block;
        position: absolute;
        top: 55px;
        width: 357px;
        right: -1px
    }
}

@media screen and (min-width: 1444px) {
    .hero-wave1 {
        width: 632px;
        z-index: 1;
        top: -28px;
        right: 0
    }
}

@media screen and (min-width: 370px) {
    .journey {
        padding-top: 279px
    }
}

@media screen and (min-width: 836px) {
    .journey {
        padding-top: 120px
    }
}

@media screen and (min-width: 1444px) {
    .journey {
        padding-top: 186px
    }
}

.journey-container {
    display: flex;
    gap: 96px;
    justify-content: space-between
}

@media screen and (max-width: 836px) {
    .journey-container {
        display: block
    }
}

.journey-image-box {
    position: relative;
    width: 638px;
    display: flex;
    flex-direction: column
}

@media screen and (max-width: 836px) {
    .journey-image-box {
        width: 10px
    }
}

@media screen and (min-width: 370px) {
    .journey-image {
        display: none
    }
}

@media screen and (min-width: 1444px) {
    .journey-image {
        display: block;
        align-self: end;
        width: 338px;
        height: 232px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat
    }
}

@media screen and (min-width: 370px) {
    .wave3 {
        display: none;
        width: 399px;
        height: 178px;
        position: absolute;
        top: 560px;
        left: -70px
    }
}

@media screen and (min-width: 836px) {
    .wave3 {
        display: block;
        top: 90px
    }
}

@media screen and (min-width: 1444px) {
    .wave3 {
        display: block;
        width: 638px;
        height: 421px;
        top: -110px;
        left: 0
    }
}

@media screen and (min-width: 370px) {
    .joyrney-wave {
        position: absolute;
        top: -232px;
        left: calc(50% + 10px);
        width: 363px;
        height: 210px;
        transform: rotate3d(0, 0, 10, 180deg)
    }
}

@media screen and (min-width: 836px) {
    .joyrney-wave {
        display: none
    }
}

@media screen and (min-width: 370px) {
    .journey-video {
        display: none
    }
}

@media screen and (min-width: 836px) {
    .journey-video {
        display: block;
        margin-top: 236px;
        position: relative;
        width: 258px;
        height: 183px;
        border-radius: 22px;
        overflow: hidden
    }
}

@media screen and (min-width: 1444px) {
    .journey-video {
        margin-top: 0;
        width: 412px;
        height: 291px
    }
}

.video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0
}

@media screen and (max-width: 370px) {
    .video {
        display: none
    }
}

@media screen and (min-width: 370px) {
    .journey-box {
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }
}

@media screen and (min-width: 1444px) {
    .journey-box {
        width: 490px
    }
}

@media screen and (min-width: 370px) {
    .journey-head {
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 1444px) {
    .journey-head {
        font-size: 50px
    }
}

.journey-txt {
    margin-top: 33px;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: normal
}

.journey-btn {
    margin: 66px auto;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 227px;
    height: 66px;
    gap: 10px;
    border-radius: 39px;
    background-color: #0d7680;
    border: none;
    box-shadow: 0 4px 4px #00000026;
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    transition: background-color .25s cubic-bezier(.4, 0, .8, 1);
    cursor: pointer
}

.journey-btn:hover {
    background-color: transparent;
    color: #000
}

.journey-btn:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(226deg, #e8c5a466 1.33%, #0e778066 95.31%);
    opacity: 0;
    transition: opacity .25s cubic-bezier(.4, 0, .8, 1);
    z-index: -1
}

.journey-btn:hover:before {
    opacity: 1
}

@media screen and (min-width: 836px) {
    .journey-btn {
        margin-left: 0
    }
}

.fuel-container {
    padding-top: 40px;
    display: flex;
    gap: 82px;
    flex-direction: column
}

@media screen and (min-width: 836px) {
    .fuel-container {
        flex-direction: column
    }
}

@media screen and (min-width: 1444px) {
    .fuel-container {
        flex-direction: row;
        justify-content: space-between
    }
}

@media screen and (min-width: 1444px) {
    .fuel-image-box {
        display: flex;
        justify-content: flex-end;
        flex-direction: column;
        position: relative;
        padding-top: 335px;
        width: 540px
    }
}

.fuel-image1 {
    display: none
}

@media screen and (min-width: 1444px) {
    .fuel-image1 {
        display: block;
        position: absolute;
        top: 163px;
        right: 0;
        width: 262px;
        height: 189px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat
    }
}

.fuel-image2 {
    display: none
}

@media screen and (min-width: 1444px) {
    .fuel-image2 {
        display: block;
        width: 337px;
        height: 211px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat;
        z-index: 2
    }
}

.fuel-box {
    display: flex;
    flex-direction: column
}

@media screen and (min-width: 1444px) {
    .fuel-box {
        width: 623px
    }
}

@media screen and (min-width: 370px) {
    .fuel-head {
        color: #000;
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .fuel-head {
        font-size: 50px
    }
}

.fuel-txt {
    max-width: 623px;
    margin-top: 30px;
    font-size: 19px;
    font-weight: 400
}

.fuel-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-top: 51px
}

.fuel-list-item {
    display: flex;
    align-items: center;
    gap: 15px
}

.fuel-list-txt {
    font-size: 20px;
    font-weight: 300
}

@media screen and (min-width: 836px) {
    .list-round {
        width: 23px;
        height: 23px
    }
}

@media screen and (min-width: 1444px) {
    .list-round {
        width: 25px;
        height: 25px;
        background-color: #0d7680;
        border-radius: 50%
    }
}

.fuel-wave {
    display: none;
    width: 100%;
    transform: scaleX(-1)
}

@media screen and (min-width: 836px) {
    .fuel-wave {
        width: 100%
    }
}

@media screen and (min-width: 1444px) {
    .fuel-wave {
        display: block;
        position: absolute;
        transform: scaleX(1);
        width: 540px;
        height: 361px;
        top: 65px;
        z-index: 1
    }
}

.our-focus-section-wrap {
    display: flex;
    gap: 40px
}

.our-focus-img {
    width: 100%
}

.bage-name {
    max-width: 58%;
    padding: 55px 30px 55px 50px;
    background-color: #010514
}

@media screen and (min-width: 370px) {
    .our-service {
        padding-top: 150px
    }
}

@media screen and (min-width: 836px) {
    .our-service {
        padding-top: 100px
    }
}

@media screen and (min-width: 370px) {
    .our-service-head {
        text-align: center;
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .our-service-head {
        font-size: 50px
    }
}

.service-wraper {
        margin-top: 83px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 35px;
}

@media screen and (min-width: 370px) {
    .service-card {
        display: flex;
        width: 298px;
        flex-direction: column;
        align-items: flex-start;
        gap: 11px;
        flex-shrink: 0
    }
}

@media screen and (min-width: 1444px) {
    .service-card {
        min-height: 300px
    }
}

.card-head {
    font-size: 30px;
    font-weight: 700
}

.card-text {
    font-size: 20px;
    font-weight: 300;
    height: 113px;
    overflow: hidden;
    transition: height .3s ease
}

.readMore {
    cursor: pointer;
    font-size: 20px;
    font-weight: 700
}

.service-svg {
    width: 43px;
    height: 43px
}

.readMore-box {
    display: flex;
    gap: 5px;
    align-items: center
}

.service-arrow {
    stroke: currentColor;
    fill: currentColor
}

@media screen and (min-width: 370px) {
    .resourses {
        padding-top: 50px
    }
}

@media screen and (min-width: 836px) {
    .resourses {
        padding-top: 100px
    }
}

@media screen and (min-width: 1444px) {
    .resourses {
        padding-top: 130px
    }
}

.resourses-container {
    overflow: hidden
}

.resourses-btn-box {
    display: flex;
    justify-content: end
}

@media screen and (min-width: 370px) {
    .resourses-btn {
        margin-top: 83px;
        display: flex;
        width: 227px;
        height: 66px;
        padding: 10px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 39px;
        border: 1px solid #0D7680;
        box-shadow: 0 4px 4px #00000026;
        background: #fff;
        color: #0d7680;
        font-size: 20px;
        font-weight: 300;
        transition: background .25s cubic-bezier(.4, 0, .8, 1)
    }

    .resourses-btn:hover {
        background: linear-gradient(226deg, #e8c5a466 1.33%, #0e778066 95.31%);
        cursor: pointer
    }
}

@media screen and (min-width: 1444px) {
    .resourses-btn {
        margin-top: 0
    }
}

.swiper {
    margin-top: 35px
}

@media screen and (min-width: 836px) {
    .swiper-action {
        margin-top: 40px;
        display: flex;
        justify-content: flex-end
    }
}

@media screen and (min-width: 1444px) {
    .swiper-action {
        margin-top: 50px
    }
}

.swiper-buttons {
    display: flex;
    gap: 16px
}

.button-prev,
.button-next {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #0D7680;
    transition: border-color .25s cubic-bezier(.4, 0, .8, 1), background-color .25s cubic-bezier(.4, 0, .8, 1)
}

.button-prev:hover,
.button-next:hover {
    cursor: pointer;
    border-color: #e8c5a4;
    background-color: #0d7680
}

.button-prev:hover .button-icon,
.button-next:hover .button-icon {
    stroke: #e8c5a4
}

@media screen and (min-width: 370px) {
    .resourses-head {
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .resourses-head {
        font-size: 50px
    }
}

.button-icon {
    width: 6.65px;
    height: 13.3px;
    stroke: #0d7680;
    transition: stroke .25s cubic-bezier(.4, 0, .8, 1)
}

.resourses-img-block {
    border-radius: 22px;
    width: 316px;
    height: 173px;
    box-shadow: 0 4px 4px #0000001a;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.resoursed-card {
    display: flex;
    width: 305px !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px
}

.resourses-txt-block-head {
    height: 56px;
    font-size: 20px;
    font-weight: 700;
    line-height: 140%
}

.resourses-txt-block-txt {
    width: 291px;
    margin-top: 12px;
    font-size: 20px;
    font-weight: 400
}

.resourses-readMore-box {
    margin-top: 21px;
    cursor: default
}

.resourses-service-arrow {
    stroke: #0d7680;
    fill: #0d7680
}

.resourses-readMore {
    color: #0d7680;
    transition: color .25s cubic-bezier(.4, 0, .8, 1)
}

.resourses-readMore:hover {
    color: #fcd0b1;
    cursor: pointer
}

.resourses-readMore:hover .service-arrow {
    stroke: #fcd0b1;
    fill: #fcd0b1
}

.swiper {
    overflow: visible
}

@media screen and (min-width: 1444px) {
    .swiper-slide-visible {
        filter: blur(4px)
    }
}

@media screen and (min-width: 1444px) {
    .swiper-slide-fully-visible {
        filter: none
    }
}

.slider-content {
    margin-top: 38px
}

.slick-track {
    display: flex;
    margin-left: 0 !important;
    gap: 37px;
    width: 100% !important
}

.slick-list {
    overflow: hidden
}

@media screen and (min-width: 1444px) {
    .slider .slick-slide {
        filter: blur(4px)
    }
}

@media screen and (min-width: 1444px) {
    .slider .slick-active {
        filter: none
    }
}

.slider .slick-arrow {
    position: absolute;
    font-size: 0
}

.slider .slick-arrow.slick-prev {
    background: url(/assets/left-arrow-BDPN3wff.png) no-repeat center center;
    width: 40px;
    height: 40px;
    z-index: 10
}

.slick-arrow.slick-next {
    background: url(./images/icons.svg#icon-right) no-repeat center center;
    background-size: contain;
    width: 40px;
    height: 40px;
    z-index: 10
}

@media screen and (min-width: 370px) {
    .aboutUs {
        padding-top: 50px
    }
}

@media screen and (min-width: 836px) {
    .aboutUs {
        padding-top: 60px
    }
}

@media screen and (min-width: 1444px) {
    .aboutUs {
        padding-top: 100px
    }
}

.aboutUs-container {
    display: grid;
    justify-items: center
}

.aboutUs-head {
    margin-top: 50px
}

@media screen and (min-width: 370px) {
    .aboutUs-head {
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .aboutUs-head {
        font-size: 50px;
        justify-self: start
    }
}

@media screen and (min-width: 1444px) {
    .aboutUs-head {
        font-size: 50px;
        justify-self: center
    }
}

.aboutUs-txt {
    max-width: 859px;
    margin-top: 42px;
    font-size: 20px;
    font-weight: 300
}

.aboutUs-wawe {
    display: none;
    width: 482px;
    height: 217px;
    transform: scaleX(-1)
}

@media screen and (min-width: 836px) {
    .aboutUs-wawe {
        display: block;
        font-size: 50px;
        justify-self: end
    }
}

.impact {
    padding-top: 350px
}

@media screen and (min-width: 1444px) {
    .impact {
        padding-top: 100px
    }
}

.impact-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-top: 1px solid #0D7680;
    border-bottom: 1px solid #0D7680;
    padding-top: 55px;
    padding-bottom: 70px
}

.impact-head {
    font-size: 20px;
    font-weight: 700;
    line-height: 140%
}

.advisory-impact {
    color: #0d7680;
    margin-top: 41px;
    font-family: Rubik;
    font-size: 24px;
    font-style: italic;
    font-weight: 300;
    line-height: normal
}

.statementofPurpose {
    margin-top: 130px;
    position: relative
}

.purpose-container {
    display: flex;
    gap: 135px
}

@media screen and (min-width: 370px) {
    .purpose-left-box {
        position: relative;
        display: none
    }
}

@media screen and (min-width: 1444px) {
    .purpose-left-box {
        padding-top: 217px;
        width: 527px;
        display: flex;
        flex-direction: column
    }
}

.purpose-img1 {
    position: absolute;
    top: 17px;
    right: 0;
    width: 330px;
    height: 225px;
    border-radius: 22px;
    box-shadow: 0 4px 4px #00000040;
    background-size: cover;
    background-position-x: center;
    background-repeat: no-repeat;
    z-index: -1
}

.purpose-img2 {
    width: 397px;
    height: 247px;
    border-radius: 22px;
    box-shadow: 0 4px 4px #00000040;
    background-size: cover;
    background-position-x: center;
    background-repeat: no-repeat
}

.purpose-wave {
    top: -50px;
    width: 100%;
    position: absolute;
    z-index: -1
}

@media screen and (min-width: 370px) {
    .purpose-wave2 {
        position: absolute;
        top: -240px;
        right: 0;
        z-index: -1;
        width: 450px;
        height: 217px;
        transform: rotateY(180deg)
    }
}

@media screen and (min-width: 836px) {
    .purpose-wave2 {
        width: 482px
    }
}

@media screen and (min-width: 1444px) {
    .purpose-wave2 {
        display: none
    }
}

@media screen and (min-width: 370px) {
    .purpose-wave3 {
        display: none;
        position: absolute;
        bottom: -240px;
        left: 0;
        z-index: -1;
        width: 400px;
        height: 217px
    }
}

@media screen and (min-width: 836px) {
    .purpose-wave3 {
        display: none;
        width: 482px;
        height: 217px
    }
}

@media screen and (min-width: 1444px) {
    .purpose-wave3 {
        display: none
    }
}

.purpose-right-box {
    display: flex;
    flex-direction: column;
    gap: 35px;
    max-width: 597px
}

@media screen and (min-width: 370px) {
    .purpose-head {
        color: #000;
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .purpose-head {
        font-size: 50px
    }
}

.purpose-txt {
    color: #000;
    font-size: 20px;
    font-weight: 300
}

.purpose-txt2 {
    margin-top: 18px
}

footer {
    padding-top: 29px;
    padding-bottom: 29px;
    background-color: #0d7680
}

.footer-container {
    padding-right: 36px;
    padding-left: 36px
}

@media screen and (min-width: 836px) {
    .footer-container {
        border-top: 1px solid #FFF;
        border-bottom: 1px solid #FFF
    }
}

@media screen and (max-width: 836px) {
    .footer-container {
        padding-right: 10px;
        padding-left: 10px
    }
}

@media screen and (min-width: 370px) {
    .foter-box {
        display: flex;
        justify-content: space-between;
        gap: 16px
    }
}

@media screen and (min-width: 836px) {
    .foter-box {
        padding-top: 17px;
        padding-bottom: 17px;
        margin: 0 auto;
        align-items: center
    }
}

@media screen and (min-width: 836px) {
    .foter-box {
        justify-content: space-around
    }
}

@media screen and (min-width: 370px) {
    .footer-logo-box {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 18px
    }
}

@media screen and (min-width: 370px) {
    .foter-logo {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 56px;
        height: 57px;
        background-color: #b2d9da;
        border-radius: 50%;
        box-shadow: 0 4px 4px #6576801a;
        transition: background .25s cubic-bezier(.4, 0, .8, 1)
    }

    .foter-logo:hover {
        background: linear-gradient(196deg, #e8c5a48f 51.61%, #b2d9da 88.78%)
    }

    .foter-logo:hover .argo-logo {
        fill: #64757f
    }
}

@media screen and (min-width: 1444px) {
    .foter-logo {
        width: 80px;
        height: 80px
    }
}

@media screen and (min-width: 370px) {
    .footer-logo {
        width: 35px;
        height: 35px
    }
}

@media screen and (min-width: 1444px) {
    .footer-logo {
        width: 47px;
        height: 47px
    }
}

@media screen and (min-width: 370px) {
    .footer-head {
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        line-height: 140%
    }
}

@media screen and (min-width: 1444px) {
    .footer-head {
        font-size: 30px
    }
}

@media screen and (min-width: 370px) {
    .footer-subhead {
        color: #fff;
        font-size: 15px;
        font-weight: 700;
        line-height: 140%
    }
}

@media screen and (min-width: 1444px) {
    .footer-subhead {
        font-size: 20px
    }
}

@media screen and (min-width: 370px) {
    .social-box {
        display: flex;
        align-items: center;
        gap: 6px
    }
}

@media screen and (min-width: 836px) {
    .social-box {
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px
    }
}

@media screen and (min-width: 370px) {
    .footer-legal {
        margin-top: 10px;
        color: #fff;
        font-size: 10px;
        font-weight: 300;
        line-height: 140%;
        text-align: center
    }
}

@media screen and (min-width: 836px) {
    .footer-legal {
        margin-bottom: 10px
    }
}

@media screen and (min-width: 370px) {

    .social-link svg {
        width: 40px;
        height: 40px;
        fill: #b2d9da;
        transition: fill .25s cubic-bezier(.4, 0, .8, 1)
    }
}

.social-link svg {
  width: 40px;
  height: 40px;
  display: block;
}

.social-link:hover svg,
.social-link:focus svg {
  fill: #e8c5a4 !important;
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

@media screen and (min-width: 1444px) {

.social-link svg {
  width: 40px;
  height: 40px;
  display: block;
}

.social-link:hover svg,
.social-link:focus svg {
  fill: #e8c5a4 !important;
  border-radius: 50%;
  width: 40px;
  height: 40px;
}
}

@media screen and (min-width: 370px) {
    .footer-txt {
        width: 162px;
        color: #fff;
        text-align: center;
        font-size: 10px;
        font-weight: 400
    }
}

@media screen and (min-width: 1444px) {
    .footer-txt {
        width: 351px;
        font-size: 15px
    }
}

@media screen and (min-width: 370px) {
    .social-and-txt {
        display: flex;
        flex-direction: column;
        align-items: center;
        align-self: flex-end;
        gap: 14px
    }
}

@media screen and (min-width: 836px) {
    .social-and-txt {
        flex-direction: row;
        align-self: center;
        gap: 50px
    }
}

@media screen and (min-width: 1444px) {
    .social-and-txt {
        gap: 100px
    }
}

@media screen and (min-width: 370px) {
    .getInTouch {
        padding-top: 104px
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch {
        padding-top: 181px;
        padding-bottom: 210px
    }
}

@media screen and (min-width: 836px) {
    .getInTouch-container {
        display: flex;
        flex-direction: column;
        align-items: center;
	    margin-bottom: 70px;
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch-container {
        display: flex;
        flex-direction: row;
        align-items: start;
        gap: 210px;
	    margin-bottom: 70px;
    }
}

@media screen and (min-width: 836px) {
    .getInTouch-leftBox {
        display: flex;
        flex-direction: column;
        align-items: center
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch-leftBox {
        display: flex;
        align-items: start
    }
}

@media screen and (min-width: 370px) {
    .getInTouch-head {
        color: #000;
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .getInTouch-head {
        font-size: 50px
    }
}

@media screen and (min-width: 370px) {
    .getInTouch-subhead {
        margin-top: 35px;
        width: 253px;
        font-size: 20px;
        font-weight: 400
    }
}

@media screen and (min-width: 836px) {
    .getInTouch-subhead {
        margin-top: 35px;
        width: 388px;
        text-align: start
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch-subhead {
        margin-top: 14px;
        margin-left: 0
    }
}

@media screen and (min-width: 370px) {
    .contact-box {
        display: flex;
        width: 350px;
        margin-top: 35px;
        padding: 36px 0 36px 36px;
        flex-direction: column;
        align-items: flex-start;
        gap: 27px;
        border-radius: 22px;
        background: #0d7680;
        box-shadow: 0 4px 4px #0e778033
    }
}

@media screen and (min-width: 836px) {
    .contact-box {
        width: 522px
    }
}

.contact-box-head {
    color: #fff;
    font-size: 22px;
    font-weight: 600
}

.email-svg,
.address-svg {
    margin-top: 5px
}

.email,
.address,
.phone {
    display: flex;
    gap: 27px
}

.email-txt {
    color: #fff;
    font-size: 22px;
    font-weight: 700
}

.email-link {
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    transition: color .25s cubic-bezier(.4, 0, .8, 1)
}

.email-link:hover {
    color: #e8c5a4
}

.email-link2 {
    text-transform: capitalize
}

@media screen and (max-width: 836px) {
    .email-link2 {
        width: 228px
    }
}

.address-link {
    display: flex;
    flex-direction: column;
    gap: 4px
}

@media screen and (min-width: 370px) {
    .getInTouch-rightBox {
        margin-top: 100px;
        display: flex;
        flex-direction: column
    }
}

@media screen and (min-width: 836px) {
    .getInTouch-rightBox {
        margin-top: 71px;
        width: 414px
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch-rightBox {
        margin-top: 0
    }
}

@media screen and (min-width: 370px) {
    .right-box-head {
        text-align: center;
        font-size: 30px;
        font-weight: 700;
        line-height: 140%
    }
}

@media screen and (min-width: 1444px) {
    .right-box-head {
        text-align: start
    }
}

label {
    font-size: 20px;
    font-weight: 400
}

.getInTouch-form {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px
}

input {
    border-radius: 14px;
    border: 2px solid #0D7680;
    height: 55px;
    background: #fff;
    padding: 15px;
    transition: border-color .25s cubic-bezier(.4, 0, .8, 1)
}

input:focus {
    border-color: #e8c5a4;
    outline: none
}

input:invalid {
    border-color: #ec0222
}

textarea {
    border-radius: 14px;
    border: 2px solid #0D7680;
    height: 150px;
    resize: none;
    padding: 15px;
    display: flex;
    text-align: start;
    transition: border-color .25s cubic-bezier(.4, 0, .8, 1)
}

textarea:focus {
    border-color: #e8c5a4;
    outline: none
}

@media screen and (min-width: 370px) {
    .getInTouch-btn {
        position: relative;
        overflow: hidden;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 227px;
        height: 66px;
        gap: 10px;
        border-radius: 39px;
        background-color: #0d7680;
        border: none;
        box-shadow: 0 4px 4px #00000026;
        color: #fff;
        font-size: 20px;
        font-weight: 400;
        transition: background-color .25s cubic-bezier(.4, 0, .8, 1);
        margin: 45px auto 0
    }

    .getInTouch-btn:hover {
        background-color: transparent;
        color: #000
    }

    .getInTouch-btn:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: linear-gradient(226deg, #e8c5a466 1.33%, #0e778066 95.31%);
        opacity: 0;
        transition: opacity .25s cubic-bezier(.4, 0, .8, 1);
        z-index: -1
    }

    .getInTouch-btn:hover:before {
        opacity: 1
    }
}

@media screen and (min-width: 1444px) {
    .getInTouch-btn {
        margin-left: 0
    }
}

.form-status {
    margin-top: 70px;
    font-size: 23px;
    font-weight: 700;
    line-height: 140%
}

.insihts-and-resourses {
    padding-top: 193px
}

@media screen and (min-width: 370px) {
    .insihts-and-resourses {
        padding-top: 70px
    }
}

@media screen and (min-width: 836px) {
    .resourses-list-left-box {
        width: 359px;
        display: flex;
        flex-direction: column
    }
}

@media screen and (min-width: 1444px) {
    .resourses-list-left-box {
        width: 605px
    }
}

@media screen and (min-width: 370px) {
    .resourses-list-left-box-head {
        font-size: 40px;
        font-weight: 700
    }
}

@media screen and (min-width: 836px) {
    .resourses-list-left-box-head {
        font-size: 50px;
        font-weight: 700
    }
}

@media screen and (min-width: 370px) {
    .resourses-list-left-box-txt {
        width: 310px;
        margin-top: 19px;
        font-size: 20px;
        font-weight: 400
    }
}

@media screen and (min-width: 836px) {
    .resourses-list-left-box-txt {
        width: 359px
    }
}

@media screen and (min-width: 1444px) {
    .resourses-list-left-box-txt {
        width: 605px
    }
}

.resourses-list-left-btn {
    margin-top: 50px;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 227px;
    height: 66px;
    gap: 10px;
    border-radius: 39px;
    background-color: #0d7680;
    border: none;
    box-shadow: 0 4px 4px #00000026;
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    transition: background-color .25s cubic-bezier(.4, 0, .8, 1)
}

.resourses-list-left-btn:hover {
    background-color: transparent;
    color: #000
}

.resourses-list-left-btn:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(226deg, #e8c5a466 1.33%, #0e778066 95.31%);
    opacity: 0;
    transition: opacity .25s cubic-bezier(.4, 0, .8, 1);
    z-index: -1
}

.resourses-list-left-btn:hover:before {
    opacity: 1
}

@media screen and (min-width: 836px) {
    .resourses-list {
        margin-top: 83px;
        display: flex;
        flex-wrap: wrap;
        gap: 40px;
        justify-content: center;
        padding-bottom: 87px
    }
}

@media screen and (min-width: 1444px) {
    .resourses-list {
        gap: 41px;
        margin-top: 149px;
        padding-bottom: 100px
    }
}

@media screen and (min-width: 836px) {
    .resourses-list-box {
        display: flex;
        gap: 59px
    }
}

@media screen and (min-width: 1444px) {
    .resourses-list-box {
        gap: 142px
    }
}

@media screen and (min-width: 836px) {
    .resourses-image-wraper {
        position: relative;
        margin-top: 174px;
        width: 217px;
        height: 154px;
        border-radius: 22px;
        box-shadow: 0 4px 4px #00000040;
        background-size: cover;
        background-position-x: center;
        background-repeat: no-repeat
    }
}

@media screen and (min-width: 1444px) {
    .resourses-image-wraper {
        width: 436px;
        height: 291px
    }
}

@media screen and (min-width: 370px) {
    .resourses-wave1 {
        display: none
    }
}

@media screen and (min-width: 836px) {
    .resourses-wave1 {
        display: block;
        position: absolute;
        width: 342px;
        height: 179px;
        right: 0;
        top: 44%;
        z-index: -2;
        transform: rotate3d(0, 0, 10, 180deg)
    }
}

@media screen and (min-width: 1444px) {
    .resourses-wave1 {
        width: 536px;
        height: 272px
    }
}

@media screen and (min-width: 370px) {
    .resourses-wave2 {
        display: none
    }
}

@media screen and (min-width: 836px) {
    .resourses-wave2 {
        display: block;
        position: absolute;
        width: 342px;
        height: 179px;
        bottom: 60%;
        z-index: -1
    }
}

@media screen and (min-width: 1444px) {
    .resourses-wave2 {
        width: 536px;
        height: 272px
    }
}

.resourses-list-head {
    margin-top: 100px;
    font-size: 50px;
    font-weight: 700
}

@media screen and (min-width: 370px) {
    .articles-list-item {
        margin: 100px auto 0;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-bottom: 100px
    }
}

@media screen and (min-width: 1444px) {
    .articles-list-item {
        width: 1051px
    }
}

.articles-list-head-main {
    font-size: 48px;
    font-weight: 700;
    line-height: 140%
}

.articles-list-head {
    font-size: 30px;
    font-weight: 700;
    line-height: 140%
}

.visually-hidden {
    position: absolute;
    white-space: nowrap;
    width: 1px;
    height: 1px;
    overflow: hidden;
    border: 0;
    padding: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    margin: -1px
}

.back-btn {
    width: 40px;
    height: 40px;
    cursor: pointer
}

.back-btn:hover {
    transform: scale(105%)
}

@media screen and (max-width: 836px) {
    .insihts-and-resourses-card {
        margin-top: 40px
    }

    .insihts-and-resourses-card:last-child {
        margin-bottom: 40px
    }
}

.articles-list-sub-head {
    font-size: 20px;
    font-weight: 700
}

.our-team-section {
    overflow: hidden
}

.teamBox {
    display: flex;
    padding-bottom: 50px;
    flex-direction: column
}

.intro-head {
    margin-top: 60px;
    font-weight: 700;
    font-size: 40px
}

@media screen and (min-width: 836px) {
    .intro-head {
        margin-top: 140px;
        margin-left: 0;
        font-size: 50px
    }
}

.intro-txt {
    margin-top: 20px;
    font-weight: 300;
    font-size: 20px
}

@media screen and (min-width: 836px) {
    .intro-txt {
        margin-left: 0
    }
}

@media screen and (min-width: 1444px) {
    .intro-txt {
        width: 855px
    }
}

.our-team-wawe {
    display: none
}

@media screen and (min-width: 836px) {
    .our-team-wawe {
        display: block;
        margin-top: 62px;
        width: 482px;
        height: 217px
    }
}

.our-team-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center
}

@media screen and (min-width: 836px) {
    .our-team-box {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding-left: 0;
        padding-right: 0;
        align-items: flex-start
    }
}

@media screen and (min-width: 1444px) {
    .our-team-box {
        padding-left: 40px;
        padding-right: 40px
    }
}

.our-team-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 64px;
    padding-bottom: 64px
}

@media screen and (min-width: 836px) {
    .our-team-card {
        overflow: visible;
        flex-direction: column;
        align-items: flex-start;
        width: 305px;
        padding-top: 0;
        padding-bottom: 0
    }

    .our-team-card:nth-last-child(1) {
        margin-top: 64px
    }
}

@media screen and (min-width: 1444px) {
    .our-team-card:nth-last-child(1) {
        margin-top: 0
    }
}

.team-wave3 {
    position: absolute;
    z-index: -1;
    top: 275px
}

@media screen and (min-width: 836px) {
    .team-wave3 {
        display: block;
        top: 214px;
        left: 93px
    }
}

@media screen and (min-width: 836px) {
    .our-team-card:nth-child(2) .team-wave3 {
        display: none
    }
}

@media screen and (min-width: 836px) and (min-width: 1444px) {
    .our-team-card:nth-child(2) .team-wave3 {
        display: block
    }

    .our-team-card:nth-child(3) .team-wave3 {
        display: none
    }
}

.team-name {
    margin-top: 24px;
    font-weight: 700;
    font-size: 30px;
    line-height: 140%
}

.team-img {
    width: 250px;
    height: 342px;
    transition: scale .25s cubic-bezier(.4, 0, .8, 1)
}

.team-img:hover {
    scale: 110%
}

.team-bio {
    margin-top: 24px;
    font-weight: 200;
    font-size: 20px
}

.team-wave1 {
    position: absolute;
    z-index: -1;
    top: 213px;
    left: 180px
}

.team-wave2 {
    position: absolute;
    z-index: -1;
    top: 213px;
    left: 630px
}

@media screen and (min-width: 836px) {
    .team-wave2 {
        display: none
    }
}

@media screen and (min-width: 1444px) {
    .team-wave2 {
        display: block;
        position: absolute;
        z-index: -1;
        top: 213px;
        left: 630px
    }
}