@media only screen and (min-width:767px) {
    .hero .content-wrap {
        gap: 50px;
        padding: 80px 0 40px 0
    }

    .hero .content-wrap h1 {
        font-size: 55px
    }

    .hero .content-wrap p {
        margin-bottom: 10px
    }

    .hero .content-wrap .btns-wrap {
        flex-direction: row;
        gap: 32px
    }

    .hero .content-wrap .btns-wrap .orange-btn {
        max-width: 180px
    }

    .benefits.bg .benefits-slider {
        flex-wrap: wrap;
        justify-content: center
    }

    .benefits.bg .benefits-slider .p-slide {
        flex: 0 0 33.333%;
        margin: 0
    }

    .benefits.bg .benefits-slider .p-slide .content {
        padding: 0 32px 32px 32px
    }

    .cta .row {
        gap: 15px
    }

    .cta .row h3 {
        font-size: 32px;
        line-height: 120%;
        text-align: left;
        flex: 1
    }

    .cta .row .orange-btn {
        flex: 0 0 212px
    }

    .preferences h4 {
        font-size: 50px
    }

    .preferences .cards-row {
        flex-direction: unset;
        flex-wrap: wrap;
        align-items: stretch
    }

    .preferences .cards-row .card-img {
        flex: 0 0 calc(50% - 8px)
    }
}

@media only screen and (min-width:1023px) {
    .hero .content-wrap {
        padding: 154px 0 80px 0
    }

    .hero .content-wrap h1 {
        padding: 0 110px
    }

    .hero .content-wrap p {
        padding: 0 146px
    }

    .benefits, .preferences {
        padding: 80px 0
    }

    .benefits.bg .benefits-slider .content .img-wrap {
        width: 100px
    }

    .benefits.bg .benefits-slider .content .img-wrap img {
        max-height: 100px
    }

    .benefits.bg .benefits-slider .content h3 {
        font-size: 24px
    }

    .benefits.bg .benefits-slider .content p {
        font-size: 18px
    }

    .cta .row {
        justify-content: space-between
    }

    .cta .row h3 {
        max-width: 645px
    }

    .preferences h4 {
        margin-bottom: 92px
    }

    .preferences .card-img .text h4 {
        font-size: 24px;
        margin-bottom: 15px
    }

    .preferences .card-img .text p {
        font-size: 18px
    }
}

@media only screen and (min-width:1440px) {
    .hero .content-wrap h1 {
        font-size: 80px
    }

    .hero .content-wrap p {
        font-size: 20px
    }
}