@media screen and (min-width: 1100px) and (max-height: 760px) {
    /* Homapge | .key-features */
    .key-features__left-wrapper,
    .key-features__left .img,
    .key-features__left .img img {
        max-height: 500px;
    }

    .steps-slider__item .img img {
        max-height: 400px;
        object-fit: contain;
        aspect-ratio: none;
    }
}

@media screen and (min-width: 1100px) and (max-height: 600px) {
    /* Homepage | .key-features */
    .key-features__left-wrapper,
    .key-features__left .img,
    .key-features__left .img img {
        max-height: 70vh;
    }

    .steps-slider__item .img img {
        max-height: 70vh;
        object-fit: contain;
        aspect-ratio: none;
    }

    .key-features__progress .progress {
        height: 50vh;
    }
}

@media screen and (max-width: 1600px) {
    .numbered-section .section-title {
        max-width: 42vw;
    }
}

@media screen and (max-width: 1100px) {

    main > *:first-child {
        padding-top: 92px;
    }

    .breadcrumbs + main > *:first-child {
        padding-top: 109px;
    }

    /* Homepage | .hero */
    .hero__wrapper {
        gap: 0;
        flex-direction: column;
        align-items: center;
        grid-template-columns: repeat(2, 1fr);
    }

    .hero__left {
        grid-column: span 2;
        max-width: 100%;
    }

    .hero__left .product-label + .section-title {
        margin-top: 24px;
    }

    .hero__description-wrapper {
        /* margin-top: 30px; */
        margin-top: 24px;
        flex-direction: column-reverse;
        gap: 24px;
    }

    .hero__description-wrapper .default-button {
        min-width: 123px;
    }

    .hero__description-wrapper .description {
        margin-left: 0;
        /* margin-top: -3px; */
        margin-top: 0;
    }

    .hero__description-wrapper .description .subtitle {
        line-height: 150% !important;
    }

    .hero__description-wrapper .description .text {
        margin-top: 16px;
        line-height: 150% !important;
        
    }

    .hero__right {
        grid-column: span 2;
        position: relative;
        padding: 78px 28px;
        width: auto;
        min-width: auto;
        margin: 34px -7px 0 -7px;
    }

    .-payment-gateway .hero__right {
        /* max-width: 328px; */
        margin-left: auto;
        margin-right: auto;
        padding: 48px 22px;
        width: 100%;
    }

    .-payment-gateway .hero__right__wrapper {
        position: relative;
        aspect-ratio: 17/19;
        width: 100%;
    }

    .-payment-gateway .hero__right__wrapper .animated-hero-card {
        align-items: center;
        position: absolute;
    }

    .-payment-gateway .hero-card-wrapper {
        width: 100%;
    }

    .-payment-gateway .animated-hero-card .step .inputs input {
        /* font-size: 8px; */
        font-size: 38%;
    }


    /* .-apple .hero__description-wrapper {
        margin-top: 24px;
    } */
    /* .-apple .hero__left .section-label+.section-title {
        margin-top: 24px;
    } */
    /* .-apple .hero__description-wrapper .description {
        margin-top: 0;
    } */
    .hero__right-bg {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

    .hero__right-bg img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .hero__right__wrapper {
        width: 100%;
    }

    .hero__right__wrapper img {
        display: block;
        width: 100%;
    }


    .-apple .hero__right__wrapper .apple-helper {
        display: none;
    }

    .-apple .hero__right__wrapper .animated-hero-card {
        position: relative;
    }


    .hero-card {
        position: relative;
        z-index: 1;
        border-radius: 6.4px;
        background: var(--shark-shark-550, #1A1B21);
        box-shadow: 0px 6.400000095367432px 16px 0px rgba(10, 11, 13, 0.08);
    }

    .hero-cards {
        margin: 158px 0 0 0;
    }

    .hero-cards:after {
        height: 140px;
    }

    .hero-card__wrapper {
        margin: 0 auto -42px auto;
        min-width: 508px;
        grid-template-columns: repeat(3, 1fr);
        gap: 9px;
        padding: 0;
    }

    .hero-cards .container {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .hero-card__item {
        order: 3;
        min-width: 163px;
    }

    .hero-card__item:nth-child(1) {
        order: 1;
    }

    .hero-card__item:nth-child(3) {
        order: 2;
    }


    /* .-apple .succes-story .colored-tabs {
        margin-top: 40px;
    } */
    /* Homepage | key-features */
    .key-features__wrapper {
        display: block;
        gap: 0;
        margin-top: 46px;
    }

    .key-features__left {
        display: none;
    }

    .key-features__right .img {
        display: block;
        margin-bottom: 24px;
        border-radius: 9px;
        background: var(--shark-shark-550, #1A1B21);
    }

    .key-features__right .img img {
        display: block;
        width: 100%;
        object-fit: contain;
        aspect-ratio: 29/36;
    }

    .key-features.-services .key-features__right .img img {
        aspect-ratio: auto;
    }


    .key-features__right .key-features__slide {
        opacity: 1;
    }


    .key-features__right .key-features__slide:not(.-active) {
        pointer-events: auto;
    }

    .key-features__right .key-features__slide.-active + .key-features__slide {
        opacity: 1;
    }


    .key-features__right .checked-list {
        margin-top: 24px;
    }

    .key-features__right .key-features__slide + .key-features__slide {
        margin-top: 64px;
    }

    .key-features__right .key-features__slide .text {
        margin-top: 24px;
        max-width: 100%;
    }

    /* Homepage | steps-section */
    .steps-section .section-title {
        margin-bottom: 40px;
    }

    /* .-apple .steps-section .section-title {
        margin-top: 40px;
    } */
    /* .-apple .reviews .reviews-slider {
        margin-top: 40px;
    } */
    /* text-page |  text-page */
    .text-page {
        margin-bottom: 100px;
    }

    .text-page .subtitle {
        margin-top: 16px;
    }

    .text-page__container {
        max-width: 100%;
        margin: 0 auto;
    }


    /** banking | platform-modules */
    .platform-modules__wrapper {
        margin-top: 40px;
        grid-template-columns: repeat(1, 1fr);
        gap: 16px;
    }

    .platform-modules__item {
        border-radius: 16px;
    }

    .platform-modules__item .img {
        border-radius: 16px 16px 0 0;
    }

    .platform-modules__item .title {
        margin-top: 16px;
    }

    .platform-modules__item .text {
        margin-top: 8px;
    }

    .platform-modules__item .content {
        padding: 0 16px 24px 16px;
    }

    .platform-modules__item:last-child {
        flex-direction: column;
        align-items: center;
        grid-column: span 1;
        gap: 16px;
    }

    .platform-modules__item:last-child .content {
        flex-basis: 100%;
        padding: 16px;
    }

    .platform-modules__item:last-child .img {
        flex-basis: 100%;
        margin-top: 0;
    }


    .simple-swipe-slider {
        margin-top: 40px;
    }

    .simple-swipe__slide {
        border-radius: 16px;
        padding: 16px;
        width: 100%;
    }

    .simple-swipe-slider .swiper-wrapper {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .simple-swipe-slider.-always-slider .swiper-wrapper {
        flex-direction: row;
        gap: 0;
    }

    .simple-swipe__slide.swiper-slide-prev {
        transform: none;
    }

    .simple-swipe__slide .img {
        border-radius: 16px;
        width: 48px;
        height: 48px;
    }

    .simple-swipe__slide .img img {
        display: block;
        width: 20px;
        aspect-ratio: 1/1;
    }

    .simple-swipe__slide .title {
        margin-top: 48px;
    }

    .simple-swipe__slide .text {
        margin-top: 8px;
    }


    /* banking | scroll-progress-slider */
    .scroll-progress-slider {
        margin: var(--smaller-section-margin) 0 0 0;
    }

    .scroll-progress-slider__wrapper {
        position: relative;
        max-width: 100%;
        margin: 0 auto;
        border-radius: 16px;
        border: 1px solid var(--shark-shark-475, #3C3D42);
    }

    .scroll-progress-slider__item {
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        opacity: 0;
        padding: 0 0 56px 0;
    }

    .scroll-progress-slider__left {
        padding: 16px 16px 16px 16px;
    }

    .scroll-progress-slider__left .tag {
        border-radius: 40px;
        padding: 0 10px;
        height: 24px;
        padding-top: 3px;
    }

    .scroll-progress-slider__left .tag + .title {
        margin-top: 16px;
    }

    .scroll-progress-slider__left .title + .text {
        margin-top: 8px;
    }

    .scroll-progress-slider__right {
        width: 100%;
        height: 100%;
        min-width: auto;
        max-width: 380px;
        max-height: 230px;
        aspect-ratio: auto;
    }

    .scroll-progress-slider__right img,
    .scroll-progress-slider__right picture {
        max-height: inherit;
        object-fit: contain;
    }

    .scroll-progress-slider__progressbar {
        position: absolute;
        top: auto;
        bottom: 16px;
        transform: none;
        right: 16px;
        left: 16px;
    }

    .scroll-progress-slider__progressbar.progress {
        flex-direction: row;
    }

    .scroll-progress-slider__progressbar.progress .progress {
        height: 2px;
        width: 100%;
    }

    .scroll-progress-slider__progressbar.progress .progress-active {
        width: 1px;
        height: 3px;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
    }


    /* About us | why-choose-us */
    .sticky-progress-slider .sticky-progress__right {
        width: 100%;
        margin: 0 24px 0 auto;
    }

    .sticky-progress__progress {
        position: sticky;
        margin-right: -8px;
        margin-top: 0;
    }

    .sticky-progress__progress .progress {
        height: 270px;
        width: 1px;
        border-radius: 20px;
    }

    .sticky-progress__progress .progress-active {
        width: 2px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 20px;
    }

    .sticky-progress__slide + .sticky-progress__slide {
        margin-top: 40px;
    }

    .sticky-progress__slide .img {
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

    .sticky-progress__slide .img img {
        width: 20px;
        height: 20px;
    }

    .sticky-progress__slide .title {
        margin-top: 24px;
    }

    .sticky-progress__slide .text {
        margin-top: 16px;
    }


    .why-choose-us.-slider-on-mob .simple-swipe-slider .sticky-progress__slide {
        opacity: 1;
        pointer-events: auto;
    }

    .why-choose-us-double .simple-swipe-slider .sticky-progress__slide .title,
    .why-choose-us.-slider-on-mob .simple-swipe-slider .sticky-progress__slide .title {
        margin-top: 16px;
    }

    /* .why-choose-us-double .simple-swipe-slider .sticky-progress__slide .slide-part {
        max-width: 304px;
    } */
    .--black-section .swiper-slider .swiper-pagination:before {
        background: var(--shark-shark-450, #48494D);
    }

    .--black-section .swiper-slider .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
        background: var(--White, #FFF);
    }

    .why-choose-us-double .swiper-slider .progress,
    .why-choose-us.-slider-on-mob .swiper-slider .progress {
        margin-top: 40px;
    }

    .why-choose-us-double .sticky-progress__slide + .sticky-progress__slide,
    .why-choose-us.-slider-on-mob .sticky-progress__slide + .sticky-progress__slide {
        margin-top: 0 !important;
        opacity: 1;
    }


    /* page-404 */
    .page-404 .title {
        margin-top: 24px;
    }

    .page-404 .text {
        margin-top: 16px;
    }

    .page-404 .default-button {
        margin: 16px auto 0 auto;
        min-width: 140px;
    }


}

@media screen and (max-width: 576px) {
    .hero__description-wrapper .description {
        max-width: 280px;
    }

    .hero__description-wrapper .description .subtitle {
        max-width: 280px;
    }

    .hero__description-wrapper .description .text {
        max-width: 280px;
    }
}