@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Light.woff2') format('woff2'),
         url('../fonts/Lato-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Regular.woff2') format('woff2'),
         url('../fonts/Lato-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Bold.woff2') format('woff2'),
         url('../fonts/Lato-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Black.woff2') format('woff2'),
         url('../fonts/Lato-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-BoldItalic.woff2') format('woff2'),
         url('../fonts/Lato-BoldItalic.woff') format('woff');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    font-family: 'Lato', sans-serif;
    color: #333333;
    overflow-x: hidden;
}

.container {
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 140px;
}

.hero {
    position: relative;
    display: flex;
    flex-direction: column;
    border-top: 5px solid #0F4C81;
    background-color: #EEEEEE;
    background-image: url('../img/hero1.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    aspect-ratio: 1920 / 879;
    min-height: 879px;
}

.hero__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-top: 35px;
    gap: 16px;
}

.hero__content {
    width: 100%;
    margin-top: 155.67px;
}

.hero__logo {
    display: block;
    width: 260px;
}

.hero__logo img {
    display: block;
    width: 100%;
    height: auto;
}

.hero__vacancies {
    display: inline-flex;
    align-items: center;
    gap: 24.01px;
    height: 60px;
    padding: 0 19.25px 0 20px;
    border: 1px solid #00709E;
    border-radius: 3px;
    color: #00709E;
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.2px;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.hero__vacancies:hover {
    background-color: #00709E;
    color: #FFFFFF;
}

.hero__vacancies svg {
    flex-shrink: 0;
    width: 8.06px;
    height: 14.62px;
}

.hero__title {
    max-width: 820px;
    color: #0F4C81;
    font-size: 60px;
    font-weight: 900;
    line-height: 60px;
    letter-spacing: -0.3px;
}

.hero__text {
    max-width: 674px;
    margin-top: 21px;
    color: #333333;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 300;
    line-height: 36px;
}

.hero__button {
    display: inline-flex;
    align-items: center;
    gap: 18.55px;
    height: 60px;
    margin-top: 35px;
    padding: 0 19.25px 0 20px;
    border-radius: 3px;
    background-color: #0F4C81;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.2px;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.25s ease;
}

.hero__button:hover {
    background-color: #0B3A63;
}

.hero__button svg {
    position: relative;
    top: 3.28px;
    flex-shrink: 0;
    width: 14.62px;
    height: 8.06px;
}

.intro {
    padding: 80px 0;
    background-color: #00709E;
    text-align: center;
}

.intro__title {
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 300;
    line-height: 57px;
    letter-spacing: -0.24px;
    max-width: 828px;
    margin: 0 auto;
}

.intro__text {
    max-width: 1088px;
    margin: 40px auto 0;
    color: #FFFFFF;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 400;
    line-height: 36px;
}

.social {
    padding: 80px 0;
    background-color: #FFFFFF;
}

.social__inner {
    display: flex;
    align-items: center;
    gap: 85px;
}

.social__image {
    flex-shrink: 0;
    width: 812px;
    height: 609px;
    border-radius: 10px;
    object-fit: cover;
}

.social__content {
    flex-grow: 1;
    max-width: 674px;
}

.social__title {
    color: #0F4C81;
    font-size: 36px;
    letter-spacing: -0.18px;
    font-weight: 700;
    line-height: 36px;
}

.social__lead {
    margin-top: 34px;
    color: #0F4C81;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 400;
    line-height: 36px;
}

.social__text {
    margin-top: 32px;
    color: #333333;
    font-size: 24px;
    letter-spacing: 0.24px;
    font-weight: 400;
    line-height: 32px;
}

.social__lead + .social__text {
    margin-top: 19px;
}

.social--grey {
    padding: 80px 0 0;
    background-color: #EEEEEE;
}

.social__inner--reverse {
    justify-content: flex-end;
    gap: 86px;
}

.social__inner--reverse .social__content {
    flex-grow: 0;
    max-width: 674px;
}

.social__cards {
    margin-top: 82px;
    padding-bottom: 100px;
    background-image: linear-gradient(to bottom, #EEEEEE 230px, #FFFFFF 230px);
}

.social__cards-inner {
    display: flex;
}

.social__card {
    flex-basis: 0;
    text-align: center;
    flex-grow: 1;
}

.social__card-image {
    display: block;
    width: 612px;
    max-width: 100%;
    margin: 0 auto;
    height: 459px;
    border-radius: 10px;
    object-fit: cover;
}

.social__card-title {
    max-width: 612px;
    margin: 33px auto 0;
    color: #0F4C81;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 400;
    line-height: 30px;
}

.social__card-text {
    max-width: 612px;
    margin: 27px auto 0;
    color: #333333;
    font-size: 24px;
    letter-spacing: 0.24px;
    font-weight: 400;
    line-height: 32px;
}

.quotes {
    background-color: #FFFFFF;
}

.quotes__head {
    padding-top: 13px;
    padding-bottom: 43px;
    text-align: center;
}

.quotes__title {
    color: #008272;
    font-size: 48px;
    letter-spacing: -0.96px;
    font-weight: 700;
    line-height: 47px;
}

.quotes__subtitle {
    margin-top: 28px;
    color: #333333;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 300;
    line-height: 30px;
}

.quotes__band {
    padding: 123px 0 83px;
    background-color: #008272;
}

.quotes__slider .swiper-slide {
    display: flex;
    align-items: center;
    height: auto;
}

.quotes__slide {
    width: 100%;
    text-align: center;
}

.quotes__question br {
    display: none;
}

.quotes__question {
    color: #FFFFFF;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 400;
    line-height: 30px;
}

.quotes__quote {
    max-width: 886px;
    margin: 43px auto 0;
    color: #EEEEEE;
    font-size: 36px;
    letter-spacing: -0.18px;
    font-weight: 700;
    font-style: italic;
    line-height: 44px;
}

.quotes__author {
    margin-top: 42px;
    color: #EEEEEE;
    font-size: 20px;
    letter-spacing: 0.2px;
    font-weight: 700;
    line-height: 20px;
}

.quotes__pagination {
    position: static;
    margin-top: 82px;
}

.perks {
    padding: 75px 0 80px;
    background-color: #FFFFFF;
}

.perks__head {
    text-align: center;
}

.perks__title {
    color: #0F4C81;
    font-size: 48px;
    letter-spacing: -0.96px;
    font-weight: 700;
    line-height: 47px;
}

.perks__subtitle {
    margin-top: 17px;
    color: #0F4C81;
    font-size: 20px;
    letter-spacing: 0.2px;
    font-weight: 700;
    line-height: 20px;
}

.perks__cards {
    display: flex;
    gap: 40px;
    max-width: 1920px;
    margin: 62px auto 0;
    padding: 0 278px;
}

.perks__card {
    flex-basis: 0;
    flex-grow: 1;
    min-height: 373px;
    padding: 30px 20px 0;
    background-color: #EEEEEE;
    text-align: center;
    border-radius: 3px;
}

.perks__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 130px;
    height: 130px;
    margin: 0 auto;
    border-radius: 50%;
}

.perks__icon img {
    max-width: 75px;
    max-height: 75px;
}

.perks__icon--green {
    background-color: #1C6B24;
}

.perks__icon--pink {
    background-color: #AD005B;
}

.perks__icon--blue {
    background-color: #00709E;
}

.perks__icon--teal {
    background-color: #008272;
}

.br-768,
.br-393,
.br-narrow {
    display: none;
}

.perks__card-title br {
    display: none;
}

.perks__card-title {
    margin-top: 23px;
    color: #333333;
    font-size: 20px;
    letter-spacing: 0.2px;
    font-weight: 700;
    line-height: 20px;
}

.perks__card-text {
    margin-top: 21px;
    color: #333333;
    font-size: 18px;
    letter-spacing: 0.18px;
    font-weight: 400;
    line-height: 24px;
}

.careers {
    position: relative;
    overflow: hidden;
    min-height: 731px;
    padding: 85px 0;
    background-color: #00709E;
}

.careers__inner {
    position: relative;
    z-index: 1;
    max-width: 1920px;
    margin: 0 auto;
    padding-left: 221px;
}

.careers__content {
    max-width: 674px;
}

.careers__image {
    position: absolute;
    top: 0;
    right: -504px;
    width: 1757px;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.careers__title {
    color: #EEEEEE;
    font-size: 48px;
    letter-spacing: -0.96px;
    font-weight: 700;
    line-height: 57px;
}

.careers__lead {
    margin-top: 30px;
    color: #EEEEEE;
    font-size: 30px;
    font-weight: 400;
    line-height: 36px;
    letter-spacing: -0.6px;
    max-width: 518px;
}

.careers__text {
    margin-top: 19px;
    color: #EEEEEE;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: 0.24px;
    max-width: 503px;
}

.careers__note {
    margin-top: 32px;
    color: #EEEEEE;
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    letter-spacing: 0.24px;
    max-width: 503px;
}

.careers__button {
    display: inline-flex;
    align-items: center;
    gap: 25.12px;
    height: 60px;
    margin-top: 38px;
    padding: 0 19.25px 0 20px;
    border-radius: 3px;
    background-color: #FFFFFF;
    color: #333333;
    font-size: 20px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 0.2px;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.careers__button:hover {
    background-color: #EEEEEE;
}

.careers__button svg {
    flex-shrink: 0;
    width: 8.06px;
    height: 14.62px;
}

.quotes__slider .quotes__pagination .swiper-pagination-bullet {
    width: 15px;
    height: 15px;
    margin: 0;
    background-color: #99CDC7;
    opacity: 1;
    transition: background-color 0.25s ease;
}

.quotes__slider .quotes__pagination .swiper-pagination-bullet-active {
    background-color: #FFFFFF;
}

.social__pagination {
    display: none;
}

.footer__social {
    background-color: #FFFFFF;
}

.footer__social-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14.56px;
    height: 130px;
}

.footer__social-label {
    margin-right: 6.44px;
    color: #00709E;
    font-size: 30px;
    letter-spacing: -0.6px;
    font-weight: 900;
    line-height: 30px;
}

.footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 43.7px;
    height: 43.7px;
    border-radius: 50%;
    background-color: #0F4C81;
    color: #FFFFFF;
    transition: background-color 0.25s ease;
}

.footer__social-link:hover {
    background-color: #0B3A63;
}

.footer__nav {
    padding: 40px 0 76px;
    background-color: #0F4C81;
    margin-bottom: 2px;
}

.footer__nav-inner {
    display: flex;
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 278px;
}

.footer__col {
    flex-basis: 463px;
}

.footer__col-title {
    color: #EEEEEE;
    font-size: 20px;
    letter-spacing: 0.2px;
    font-weight: 700;
    line-height: 20px;
}

.footer__list {
    list-style: none;
}

.footer__list li {
    margin-top: 20px;
    font-size: 20px;
    line-height: 20px;
}

.footer__link {
    color: #EEEEEE;
    font-size: 20px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.2px;
    text-decoration: none;
    transition: color 0.25s ease;
}

.footer__link:hover {
    color: #FFFFFF;
    text-decoration: underline;
}

.footer__bottom {
    background-color: #008272;
}

.footer__bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 60px;
}

.footer__bottom-link {
    color: #EEEEEE;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.54px;
    text-decoration: none;
}

.footer__bottom-link:hover {
    text-decoration: underline;
}

.footer__copy {
    color: #EEEEEE;
    font-size: 18px;
    letter-spacing: 0.54px;
    font-weight: 500;
    line-height: 20px;
}

@media (max-width: 1900px) {
    .hero {
        min-height: 0;
    }

    .container {
        padding: 0 123px;
    }

    .hero__header {
        padding-top: 32px;
    }

    .hero__content {
        margin-top: 137px;
    }

    .hero__logo {
        width: 229px;
    }

    .hero__vacancies {
        gap: 26px;
        height: 53px;
        padding: 0 17px;
        font-size: 19px;
        line-height: 19px;
    }

    .hero__vacancies svg {
        width: 9px;
        height: 15px;
    }

    .hero__title {
        max-width: 752px;
        font-size: 53px;
        line-height: 53px;
    }

    .hero__text {
        max-width: 752px;
        margin-top: 32px;
        font-size: 26px;
        line-height: 32px;
    }

    .hero__button {
        gap: 18px;
        height: 53px;
        margin-top: 26px;
        padding: 0 17px 0 19px;
        font-size: 19px;
        line-height: 19px;
    }

    .hero__button svg {
        top: 3px;
        width: 15px;
        height: 9px;
    }

    .intro {
        padding: 70px 0;
    }

    .intro__title {
        font-size: 45px;
        line-height: 54px;
    }

    .intro__text {
        max-width: 1056px;
        margin-top: 40px;
        font-size: 27px;
        line-height: 34px;
    }

    .social {
        padding: 88px 0;
    }

    .social__inner {
        gap: 72px;
    }

    .social__image {
        width: 715px;
        height: 536px;
    }

    .social__title {
        font-size: 31px;
        line-height: 39px;
    }

    .social__lead {
        margin-top: 27px;
        font-size: 25px;
        line-height: 32px;
    }

    .social__text {
        margin-top: 27px;
        font-size: 22px;
        line-height: 28px;
    }

    .social__lead + .social__text {
        margin-top: 16px;
    }

    .social--grey {
        padding: 88px 0 0;
    }

    .social__inner--reverse .social__content {
        max-width: 591px;
    }

    .social__cards {
        margin-top: 71px;
        padding-bottom: 88px;
        background-image: linear-gradient(to bottom, #EEEEEE 202px, #FFFFFF 202px);
    }

    .social__card-image {
        width: 539px;
        height: 404px;
    }

    .social__card-title {
        max-width: 539px;
        margin-top: 24px;
        font-size: 26px;
        line-height: 33px;
    }

    .social__card-text {
        max-width: 539px;
        margin-top: 19px;
        font-size: 22px;
        line-height: 28px;
    }

    .quotes__head {
        padding-top: 32px;
        padding-bottom: 29px;
    }

    .quotes__title {
        line-height: 58px;
    }

    .quotes__subtitle {
        margin-top: 13px;
        font-size: 26px;
        line-height: 32px;
    }

    .quotes__band {
        padding: 102px 0 88px;
    }

    .quotes__question {
        font-size: 26px;
        line-height: 33px;
    }

    .quotes__quote {
        max-width: 880px;
        margin-top: 33px;
        font-size: 33px;
        line-height: 39px;
    }

    .quotes__author {
        margin-top: 35px;
        font-size: 18px;
        line-height: 25px;
    }

    .quotes__pagination {
        margin-top: 70px;
    }

    .quotes__slider .quotes__pagination .swiper-pagination-bullet {
        width: 14px;
        height: 14px;
        margin: 0 19px;
    }

    .perks {
        padding: 70px 0 88px;
    }

    .perks__title {
        font-size: 42px;
        line-height: 51px;
    }

    .perks__subtitle {
        margin-top: 8px;
        line-height: 26px;
    }

    .perks__cards {
        gap: 35px;
        margin-top: 53px;
        padding: 0 245px;
    }

    .perks__card {
        min-height: 328px;
        padding: 27px 18px;
    }

    .perks__icon {
        width: 114px;
        height: 114px;
    }

    .perks__icon img {
        max-width: 66px;
        max-height: 66px;
    }

    .perks__card-title {
        margin-top: 13px;
        line-height: 26px;
    }

    .perks__card-text {
        margin-top: 15px;
        font-size: 17px;
        line-height: 21px;
    }

    .careers {
        min-height: 643px;
        padding: 69px 0 75px;
    }

    .careers__inner {
        padding-left: 191px;
    }

    .careers__content {
        max-width: 480px;
    }

    .careers__image {
        left: 580px;
        right: auto;
        width: 1546px;
    }

    .careers__title {
        font-size: 42px;
        line-height: 50px;
    }

    .careers__lead {
        margin-top: 28px;
        font-size: 26px;
        line-height: 32px;
    }

    .careers__text {
        margin-top: 17px;
        font-size: 22px;
        line-height: 28px;
    }

    .careers__note {
        margin-top: 28px;
        font-size: 22px;
        line-height: 28px;
    }

    .careers__button {
        gap: 24px;
        height: 55px;
        margin-top: 36px;
        padding: 0 18px 0 19px;
        font-size: 18px;
        line-height: 18px;
    }

    .footer__social-inner {
        gap: 11px;
        height: 113px;
    }

    .footer__social-label {
        margin-right: 9px;
        font-size: 29px;
        line-height: 29px;
    }

    .footer__social-link {
        width: 40px;
        height: 40px;
    }

    .footer__social-link svg {
        width: 19px;
        height: 19px;
    }

    .footer__nav {
        padding: 28px 0 64px;
    }

    .footer__nav-inner {
        padding: 0 245px;
        gap: 16px;
    }

    .footer__col {
        flex-basis: 405px;
    }

    .footer__col-title {
        line-height: 26px;
    }

    .footer__list li {
        margin-top: 11px;
    }

    .footer__link {
        line-height: 24px;
    }

    .footer__bottom-inner {
        height: 48px;
    }

    .footer__bottom-link,
    .footer__copy {
        font-size: 18px;
        line-height: 18px;
    }
}

@media (max-width: 1650px) {
    .container {
        padding: 0 109px;
    }

    .hero__header {
        padding-top: 28px;
    }

    .hero__content {
        margin-top: 121px;
    }

    .hero__logo {
        width: 203px;
    }

    .hero__vacancies {
        gap: 23px;
        height: 47px;
        padding: 0 15px;
        font-size: 17px;
        line-height: 17px;
    }

    .hero__vacancies svg {
        width: 8px;
        height: 13px;
    }

    .hero__title {
        max-width: 666px;
        font-size: 47px;
        line-height: 47px;
    }

    .hero__text {
        max-width: 666px;
        margin-top: 28px;
        font-size: 23px;
        line-height: 28px;
    }

    .hero__button {
        gap: 16px;
        height: 47px;
        margin-top: 23px;
        padding: 0 15px 0 17px;
        font-size: 17px;
        line-height: 17px;
    }

    .hero__button svg {
        top: 2px;
        width: 13px;
        height: 8px;
    }

    .intro {
        padding: 62px 0;
    }

    .intro__title {
        font-size: 40px;
        line-height: 48px;
    }

    .intro__text {
        max-width: 936px;
        margin-top: 36px;
        font-size: 24px;
        line-height: 30px;
    }

    .social {
        padding: 78px 0;
    }

    .social__inner {
        gap: 64px;
    }

    .social__image {
        width: 633px;
        height: 475px;
    }

    .social__title {
        font-size: 27px;
        line-height: 34px;
    }

    .social__lead {
        margin-top: 24px;
        font-size: 22px;
        line-height: 28px;
    }

    .social__text {
        margin-top: 24px;
        font-size: 20px;
        line-height: 25px;
    }

    .social__lead + .social__text {
        margin-top: 14px;
    }

    .social--grey {
        padding: 78px 0 0;
    }

    .social__inner--reverse .social__content {
        max-width: 524px;
    }

    .social__cards {
        margin-top: 63px;
        padding-bottom: 78px;
        background-image: linear-gradient(to bottom, #EEEEEE 179px, #FFFFFF 179px);
    }

    .social__card-image {
        width: 477px;
        height: 358px;
    }

    .social__card-title {
        max-width: 477px;
        margin-top: 21px;
        font-size: 23px;
        line-height: 30px;
    }

    .social__card-text {
        max-width: 477px;
        margin-top: 17px;
        font-size: 20px;
        line-height: 25px;
    }

    .quotes__head {
        padding-top: 28px;
        padding-bottom: 26px;
    }

    .quotes__title {
        font-size: 42px;
        line-height: 51px;
    }

    .quotes__subtitle {
        margin-top: 12px;
        font-size: 23px;
        line-height: 28px;
    }

    .quotes__band {
        padding: 90px 0 78px;
    }

    .quotes__question {
        font-size: 23px;
        line-height: 30px;
    }

    .quotes__quote {
        max-width: 780px;
        margin-top: 29px;
        font-size: 30px;
        line-height: 34px;
    }

    .quotes__author {
        margin-top: 31px;
        font-size: 16px;
        line-height: 22px;
    }

    .quotes__pagination {
        margin-top: 62px;
    }

    .quotes__slider .quotes__pagination .swiper-pagination-bullet {
        width: 12px;
        height: 12px;
        margin: 0 17px;
    }

    .perks {
        padding: 62px 0 78px;
    }

    .perks__title {
        font-size: 37px;
        line-height: 45px;
    }

    .perks__subtitle {
        margin-top: 7px;
        font-size: 18px;
        line-height: 23px;
    }

    .perks__cards {
        gap: 31px;
        margin-top: 47px;
        padding: 0 217px;
    }

    .perks__card {
        min-height: 291px;
        padding: 24px 16px;
    }

    .perks__icon {
        width: 101px;
        height: 101px;
    }

    .perks__icon img {
        max-width: 58px;
        max-height: 58px;
    }

    .perks__card-title {
        margin-top: 12px;
        font-size: 18px;
        line-height: 23px;
    }

    .perks__card-text {
        margin-top: 13px;
        font-size: 15px;
        line-height: 19px;
    }

    .careers {
        min-height: 570px;
        padding: 61px 0 66px;
    }

    .careers__inner {
        padding-left: 150px;
    }

    .careers__content {
        max-width: 400px;
    }

    .careers__image {
        left: 473px;
        width: 1370px;
    }

    .careers__title {
        font-size: 37px;
        line-height: 44px;
    }

    .careers__lead {
        margin-top: 25px;
        font-size: 23px;
        line-height: 28px;
    }

    .careers__text {
        margin-top: 15px;
        font-size: 20px;
        line-height: 25px;
    }

    .careers__note {
        margin-top: 25px;
        font-size: 20px;
        line-height: 25px;
    }

    .careers__button {
        gap: 21px;
        height: 48px;
        margin-top: 32px;
        padding: 0 16px 0 17px;
        font-size: 16px;
        line-height: 16px;
    }

    .footer__social-inner {
        gap: 10px;
        height: 100px;
    }

    .footer__social-label {
        margin-right: 8px;
        font-size: 26px;
        line-height: 26px;
    }

    .footer__social-link {
        width: 35px;
        height: 35px;
    }

    .footer__social-link svg {
        width: 17px;
        height: 17px;
    }

    .footer__nav {
        padding: 25px 0 57px;
    }

    .footer__nav-inner {
        padding: 0 217px;
    }

    .footer__col {
        flex-basis: 359px;
    }

    .footer__col-title {
        font-size: 18px;
        line-height: 23px;
    }

    .footer__list li {
        margin-top: 10px;
    }

    .footer__link {
        font-size: 18px;
        line-height: 21px;
    }

    .footer__bottom-inner {
        height: 43px;
    }

    .footer__bottom-link,
    .footer__copy {
        font-size: 16px;
        line-height: 16px;
    }
}

@media (max-width: 1280px) {
    .container {
        padding: 0 45px;
    }

    .hero {
        display: block;
        min-height: 501px;
        aspect-ratio: auto;
        border-top-width: 9px;
        background-position: 50% bottom;
        background-size: auto 492px;
    }

    .hero__header {
        position: static;
        padding-top: 43px;
        padding-right: 80px;
    }

    .hero__logo {
        width: 183.5px;
    }

    .hero__vacancies {
        gap: 18.29px;
        height: 48px;
        padding: 0 9.67px 0 11px;
        background-color: #F5F5F5;
        font-size: 14px;
        line-height: 14px;
        align-self: flex-start;
        margin-top: 4px;
        letter-spacing: 0.14px;
    }

    .hero__vacancies svg {
        width: 6.27px;
        height: 11.04px;
    }

    .hero__content {
        margin-top: 74.46px;
    }

    .hero__title {
        max-width: 343px;
        font-size: 37px;
        line-height: 37px;
        letter-spacing: -0.185px;
    }

    .hero__text {
        max-width: 343px;
        margin-top: 14px;
        font-size: 17px;
        line-height: 21px;
        letter-spacing: -0.34px;
    }

    .hero__text br {
        display: none;
    }

    .hero__button {
        gap: 40.81px;
        height: 48px;
        margin-top: 30px;
        padding: 0 9.67px 0 11px;
        font-size: 14px;
        line-height: 14px;
        letter-spacing: 0.14px;
        color: #EEEEEE;
    }

    .hero__button svg {
        top: 2.4px;
        width: 11.04px;
        height: 6.27px;
    }

    .intro {
        padding: 30px 0 9px;
    }

    .intro__title {
        max-width: 452px;
        font-size: 24px;
        line-height: 30px;
        letter-spacing: -0.12px;
    }

    .intro__title .br-1920 {
        display: none;
    }

    .br-768,
    .br-narrow {
        display: inline;
    }

    .intro__text {
        max-width: 534px;
        margin-top: 12px;
        font-size: 17px;
        line-height: 21px;
        letter-spacing: -0.34px;
        color: #EEEEEE;
    }

    .social {
        padding: 30px 0;
    }

    .social__inner {
        align-items: flex-start;
        gap: 24px;
        padding-left: 80px;
        padding-right: 76px;
    }

    .social__image {
        width: 269px;
        height: 421px;
        border-radius: 3px;
    }

    .social:not(.social--grey) .social__image {
        object-view-box: inset(5.911% 49.138% 0.031% 5.788%);
    }

    .social--grey .social__image {
        object-view-box: inset(3.284% 49.507% 0.089% 4.187%);
    }

    .social__title {
        font-size: 24px;
        line-height: 30px;
        letter-spacing: -0.12px;
    }

    .social__lead {
        margin-top: 12px;
        font-size: 17px;
        line-height: 21px;
        letter-spacing: -0.34px;
    }

    .social__text {
        margin-top: 21px;
        font-size: 17px;
        line-height: 21px;
        letter-spacing: -0.34px;
        max-width: 319px;
    }

    .social__lead + .social__text {
        margin-top: 13px;
    }

    .social--grey {
        padding: 30px 0 0;
    }

    .social__inner--reverse {
        gap: 12px;
        padding-right: 80px;
    }

    .social__inner--reverse .social__content {
        max-width: 327px;
        padding-top: 38px;
    }

    .social__inner--reverse .social__lead {
        margin-top: 42px;
    }

    .social__cards {
        margin-top: 30px;
        padding-bottom: 40px;
        background-image: linear-gradient(to bottom, #EEEEEE 107px, #FFFFFF 107px);
    }

    .social__cards-inner {
        padding: 0 80px;
    }

    .social__cards-inner .swiper-wrapper {
        gap: 30px;
    }

    .social__card {
        flex-basis: calc(50% - 15px);
    }

    .social__card-image {
        width: 100%;
        height: 214px;
        border-radius: 3px;
    }

    .social__card-title {
        max-width: none;
        margin-top: 30px;
        font-size: 24px;
        font-weight: 700;
        letter-spacing: -0.12px;
    }

    .social__card-text {
        max-width: none;
        margin-top: 12px;
        font-size: 17px;
        line-height: 21px;
        letter-spacing: -0.34px;
    }

    .quotes__head {
        padding-top: 23px;
        padding-bottom: 32px;
    }

    .quotes__title {
        font-size: 24px;
        line-height: 24px;
        letter-spacing: -0.12px;
        max-width: 323px;
        margin: 0 auto;
    }

    .quotes__subtitle {
        max-width: 490px;
        margin: 17px auto 0;
        font-size: 17px;
        line-height: 17px;
        font-weight: 400;
        letter-spacing: -0.34px;
    }

    .quotes__band {
        padding: 65px 0 47px;
        min-height: 364px;
    }

    .quotes__question {
        font-size: 17px;
        line-height: 17px;
        letter-spacing: -0.34px;
        max-width: 452px;
        margin: 0 auto;
    }

    .quotes__quote {
        max-width: 480px;
        margin-top: 22px;
        font-size: 24px;
        line-height: 30px;
        font-style: normal;
        letter-spacing: -0.12px;
        color: #FFFFFF;
    }

    .quotes__slider .swiper-slide {
        align-items: flex-start;
    }

    .quotes__author {
        font-size: 14px;
        line-height: 14px;
        letter-spacing: -0.28px;
        font-weight: 400;
        color: #FFFFFF;
    }

    .quotes__pagination {
        margin-top: 41px;
        display: flex;
        justify-content: center;
        gap: 10px;
    }

    .quotes__slider .quotes__pagination .swiper-pagination-bullet {
        width: 11px;
        height: 11px;
        margin: 0;
    }

    .perks {
        padding: 30px 0;
    }

    .perks__title {
        font-size: 24px;
        line-height: 30px;
        max-width: 323px;
        margin: 0 auto;
        letter-spacing: -0.12px;
    }

    .perks__subtitle {
        max-width: 452px;
        margin: 12px auto 0;
        font-size: 17px;
        line-height: 21px;
        font-weight: 400;
        letter-spacing: -0.34px;
    }

    .perks__cards {
        gap: 10px;
        margin-top: 30px;
        padding: 0 35px;
    }

    .perks__card {
        min-height: 289px;
        padding: 20px 10px 0;
    }

    .perks__icon {
        width: 105px;
        height: 105px;
    }

    .perks__icon img {
        max-width: 60.42px;
        max-height: 60.42px;
    }

    .perks__card-title {
        margin-top: 20px;
        color: #0F4C81;
        font-size: 17px;
        line-height: 22px;
        letter-spacing: 0.17px;
        max-width: 175px;
        margin-inline: auto;
    }

    .perks__card-title br {
        display: inline;
    }

    .perks__card-text {
        margin-top: 9px;
        font-size: 14px;
        line-height: 18px;
        letter-spacing: -0.28px;
        max-width: 140px;
        margin: 9px auto 0;
    }

    .careers {
        min-height: 669px;
        padding: 43px 0 0;
    }

    .careers__inner {
        padding-left: 80px;
        padding-right: 80px;
    }

    .careers__content {
        max-width: none;
    }

    .careers__title {
        font-size: 24px;
        line-height: 24px;
        letter-spacing: -0.12px;
        max-width: 484px;
        color: #FFFFFF;
    }

    .careers__title br {
        display: none;
    }

    .careers__lead {
        margin-top: 15px;
        font-size: 17px;
        line-height: 21px;
        max-width: 456px;
        letter-spacing: -0.34px;
        color: #FFFFFF;
    }

    .careers__text {
        margin-top: -8px;
        font-size: 17px;
        line-height: 21px;
        max-width: 442px;
        letter-spacing: -0.34px;
        color: #FFFFFF;
    }

    .careers__note {
        margin-top: 21px;
        font-size: 17px;
        line-height: 21px;
        max-width: 442px;
        letter-spacing: -0.34px;
        color: #FFFFFF;
    }

    .careers__button {
        gap: 40.16px;
        margin-top: 9px;
        padding: 0 9.25px 0 11px;
        font-size: 14px;
        line-height: 14px;
        color: #0F4C81;
        letter-spacing: 0.14px;
    }

    .careers__button svg {
        width: 6.27px;
        height: 11.04px;
    }

    .careers__image {
        display: block;
        width: 1527px;
        max-width: none;
        height: 397px;
        object-position: 40% bottom;
        left: -264px;
        bottom: 0;
        top: auto;
    }

    .footer__social-inner {
        height: 66px;
    }

    .footer__social-label {
        margin-right: 1.38px;
        font-size: 17px;
        line-height: 17px;
        letter-spacing: 0.17px;
    }

    .footer__social-link {
        width: 31.87px;
        height: 31.87px;
    }

    .footer__social-link svg {
        width: auto;
        height: auto;
        transform: scale(0.7293);
    }

    .footer__nav {
        padding: 32px 0 8px;
        margin-bottom: 3px;
    }

    .footer__nav-inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 66px;
        row-gap: 16px;
        padding: 0 80px;
    }

    .footer__col:nth-child(1) {
        grid-column: 1;
        grid-row: 1;
    }

    .footer__col:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .footer__col:nth-child(3) {
        grid-column: 2;
        grid-row: 2;
    }

    .footer__col-title {
        font-size: 17px;
        line-height: 17px;
        letter-spacing: 0.17px;
    }

    .footer__list {
        margin-top: 11px;
    }

    .footer__list li {
        margin-top: 0;
        font-size: 14px;
    }

    .footer__link {
        font-size: 14px;
        line-height: 20px;
        letter-spacing: 0.14px;
        display: inline-block;
        max-width: 231px;
    }

    .footer__bottom-inner {
        height: 57px;
        padding-left: 80px;
        padding-right: 80px;
    }

    .footer__bottom-link,
    .footer__copy {
        font-size: 14px;
        line-height: 14px;
        letter-spacing: 0.14px;
    }

    .footer__bottom-link,
    .footer__copy {
        font-size: 16px;
        line-height: 16px;
    }
}

@media (max-width: 767px) {
    .container {
        padding: 0 15px;
    }

    .hero {
        height: auto;
        padding-bottom: 412px;
        background-position: calc(50% - 150px) bottom;
        background-size: auto 412px;
    }

    .hero__header {
        padding-top: 43px;
        padding-right: 15px;
    }

    .hero__vacancies {
        gap: 12.29px;
        padding: 0 9.67px 0 10px;
        background-color: transparent;
        align-self: center;
        margin-top: 0;
    }

    .hero__content {
        margin-top: 24.46px;
    }

    .intro {
        padding: 30px 0;
    }

    .intro__title {
        max-width: 364px;
    }

    .br-768 {
        display: none;
    }

    .br-393 {
        display: inline;
    }

    .intro__text {
        max-width: 322px;
    }

    .social__inner {
        flex-direction: column-reverse;
        gap: 30px;
        padding-left: 14px;
        padding-right: 15px;
    }

    .social__content {
        padding: 0 21px;
    }

    .social__image {
        width: 100%;
        height: 270px;
    }

    .social:not(.social--grey) .social__image {
        object-view-box: inset(5.090% 5.172% 6.971% 5.911%);
    }

    .social--grey .social__image {
        object-view-box: inset(9.031% 11.576% 6.684% 3.202%);
    }

    .social__inner--reverse {
        flex-direction: column;
        justify-content: flex-start;
    }

    .social__inner--reverse .social__content {
        max-width: none;
        padding: 0 19px;
    }

    .social__cards {
        margin-top: 29px;
        background-image: linear-gradient(to bottom, #EEEEEE 301px, #FFFFFF 301px);
    }

    .social__cards-inner {
        display: block;
        padding: 0;
    }

    .social__cards-inner .swiper-wrapper {
        gap: 0;
    }

    .social__card {
        display: flex;
        flex-direction: column;
        flex-basis: auto;
        padding: 0 15px 0 14px;
    }

    .social__card-image {
        order: 3;
        height: 270px;
        margin-top: 30px;
    }

    .social__card-title {
        max-width: 323px;
        margin: 0 auto;
        padding: 0;
    }

    .social__card-text {
        max-width: 323px;
        margin: 13px auto 0;
        padding: 0;
    }

    .social__pagination {
        display: flex;
        position: static;
        margin-top: 30px;
        justify-content: center;
        gap: 10px;
    }

    .social__cards-inner .social__pagination .swiper-pagination-bullet {
        width: 12px;
        height: 12px;
        margin: 0;
        background-color: #C7C7C7;
        opacity: 1;
    }

    .social__cards-inner .social__pagination .swiper-pagination-bullet-active {
        background-color: #333333;
    }

    .quotes__head {
        padding-top: 23px;
        padding-bottom: 30px;
    }

    .quotes__subtitle {
        max-width: 323px;
        margin: 15px auto 0;
        line-height: 21px;
    }

    .quotes__band {
        padding: 60px 0;
    }

    .quotes__question {
        max-width: 323px;
        line-height: 21px;
    }

    .quotes__question br {
        display: inline;
    }

    .quotes__quote {
        max-width: 323px;
        margin-top: 20px;
    }

    .perks__subtitle {
        max-width: 323px;
    }

    .perks__cards {
        flex-wrap: wrap;
        padding: 0 15px;
    }

    .perks__card {
        flex-basis: calc(50% - 5px);
        flex-grow: 0;
        min-height: 281px;
        min-width: 0;
    }

    .perks__card:nth-child(3),
    .perks__card:nth-child(4) {
        min-height: 277px;
    }

    .perks__card-text {
        max-width: 156px;
    }

    .perks__card:nth-child(2) .perks__card-title br {
        display: none;
    }

    .careers {
        padding: 30px 0 0;
    }

    .careers__inner {
        padding-left: 35px;
        padding-right: 35px;
    }

    .careers__title {
        line-height: 30px;
    }

    .careers__title br {
        display: inline;
    }

    .careers__lead {
        margin-top: 12px;
        max-width: 323px;
    }

    .careers__text {
        margin-top: 13px;
        max-width: 323px;
    }

    .careers__note {
        max-width: 323px;
    }

    .careers__button {
        margin-top: 30px;
    }

    .careers__image {
        height: 287px;
        aspect-ratio: auto;
        margin-top: 0;
        width: 1105px;
        left: -316px;
    }

    .footer__social-label {
        margin-right: 0.63px;
    }

    .footer__nav {
        padding: 27px 0 35px;
        margin-bottom: 2px;
    }

    .footer__nav-inner {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 0 15px;
    }

    .footer__col {
        flex-basis: auto;
    }

    .footer__col + .footer__col {
        margin-top: 27px;
    }

    .footer__col:nth-child(3) {
        margin-top: 21px;
    }

    .footer__col:first-child .footer__list {
        margin-top: 7px;
    }

    .footer__link {
        max-width: none;
    }

    .footer__bottom-inner {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 21px;
        height: 94px;
        padding-top: 20px;
        padding-bottom: 0;
    }

}

@media (min-width: 394px) and (max-width: 767px) {
    .hero__title,
    .hero__text {
        max-width: none;
    }

    .intro__title,
    .intro__text {
        max-width: 560px;
    }

    .social__inner {
        padding-left: 24px;
        padding-right: 24px;
    }

    .social__content {
        padding: 0;
    }

    .social__lead,
    .social__text {
        max-width: 560px;
    }

    .social__image {
        height: auto;
        aspect-ratio: 364 / 270;
    }

    .social__card {
        padding: 0 24px;
    }

    .social__card-image {
        height: auto;
        aspect-ratio: 364 / 270;
    }

    .social__card-title,
    .social__card-text {
        max-width: 560px;
    }

    .quotes__title,
    .quotes__subtitle,
    .quotes__question,
    .quotes__quote {
        max-width: 560px;
    }

    .perks__cards {
        padding: 0 24px;
    }

    .perks__card-text {
        max-width: none;
    }

    .careers {
        min-height: 0;
        padding-bottom: 73%;
    }

    .careers__inner {
        padding-left: 24px;
        padding-right: 24px;
    }

    .careers__title,
    .careers__lead,
    .careers__text,
    .careers__note {
        max-width: 560px;
    }

    .careers__image {
        width: 281.2%;
        height: auto;
        aspect-ratio: 1105 / 287;
        left: -80.4%;
    }

    .footer__nav-inner,
    .footer__bottom-inner {
        padding-left: 24px;
        padding-right: 24px;
    }
}

@media (min-width: 1901px) {
    .social__inner {
        align-items: flex-start;
    }

    .social__content {
        padding-top: 51px;
    }

    .social__inner--reverse .social__title {
        line-height: 44px;
    }

    .social__inner--reverse .social__lead {
        margin-top: 30px;
    }

    .social__inner--reverse .social__content {
        padding-top: 103px;
    }

    .social__cards-inner {
        padding: 0 240px;
    }

    .social__cards-inner .swiper-wrapper {
        gap: 216px;
    }

    .quotes__pagination {
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .footer__col {
        flex-shrink: 0;
    }

    .footer__col:nth-child(2) {
        flex-basis: 457px;
    }

    .footer__col:nth-child(3) {
        flex-basis: 342px;
    }

    .footer__col:first-child .footer__list li {
        margin-top: 30px;
    }
}
