@keyframes spin {
    0 {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes rotateImageLoading {
    from {
        transform: translate(-50%,-50%) rotateY(0) scale(1.01)
    }

    to {
        transform: translate(-50%,-50%) rotateY(360deg) scale(1.01)
    }
}

@keyframes shine-skeleton-lines {
    0 {
        background-position: -100px
    }

    40%,100% {
        background-position: 600px
    }
}

.banner-container {
    background-color: var(--color-bg-03)
}

    .banner-container.mod__dark {
        background: var(--color-bg-01)
    }

        .banner-container.mod__dark .cmp-title__text {
            color: var(--color-bg-03)
        }

        .banner-container.mod__dark .cmp-text p {
            color: var(--color-bg-03)
        }

            .banner-container.mod__dark .cmp-text p > a {
                color: var(--color-bg-03);
                text-decoration: underline
            }

    .banner-container.banner-container--image .banner-wrapper-card {
        padding-top: 0 !important
    }

    .banner-container .banner-wrapper * {
        -webkit-font-smoothing: antialiased
    }

    .banner-container .banner-wrapper.hideOnMobile .banner-wrapper-card {
        padding-top: 32px;
        padding-bottom: 32px
    }

    .banner-container .banner-wrapper.hideOnMobile .wrapper-image {
        display: none
    }

    .banner-container .banner-wrapper.hideOnMobile.banner-wrapper__bg-image .wrapper-image {
        display: block
    }

    .banner-container .banner-wrapper .banner-wrapper-card {
        display: flex;
        flex-flow: column;
        justify-content: space-between
    }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description {
            padding: 0 32px 16px;
            order: 1
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-buttons {
            display: flex;
            padding-top: 16px;
            flex-direction: column;
            row-gap: 16px;
            max-width: max-content;
            margin: auto
        }

            .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-buttons .cmp-button {
                min-width: 136px
            }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-title .cmp-title__text, .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-text p {
            margin-top: 0;
            margin-bottom: 8px;
            text-align: center
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-title .cmp-title__text {
            font-size: 20px;
            line-height: 1.2;
            font-family: 'CupraRegular',sans-serif;
            font-weight: 400;
            text-transform: uppercase
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-text p {
            font-size: 16px;
            line-height: 1.2;
            font-family: 'CupraBook',sans-serif;
            font-weight: 350
        }

    .banner-container .banner-wrapper__bg-image .wrapper-description {
        z-index: 2;
        padding: 16px
    }

    .banner-container .banner-wrapper__bg-image .wrapper-image {
        position: relative
    }

    .banner-container .banner-wrapper__bg-image .wrapper-image__background-solid {
        display: none
    }

    .banner-container .banner-wrapper__bg-image .wrapper-image__background-image {
        display: block
    }

        .banner-container .banner-wrapper__bg-image .wrapper-image__background-image .cmp-image__image {
            width: 100%;
            height: 133px
        }

    .banner-container .banner-wrapper__bg-image .wrapper-image::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50px;
        background: linear-gradient(180deg,transparent 0,var(--color-bg-01) 80%);
        z-index: 1
    }

    .banner-container .banner-wrapper__solid .wrapper-image__background-solid {
        display: block;
        width: 100%;
        height: 100%
    }

        .banner-container .banner-wrapper__solid .wrapper-image__background-solid .cmp-image__image {
            object-fit: cover;
            width: 100%;
            height: 100%
        }

    .banner-container .banner-wrapper__solid .wrapper-image__background-image {
        display: none
    }

    .banner-container .banner-wrapper .wrapper-image .cmp-image__image {
        object-fit: cover
    }

    .banner-container .banner-wrapper .mod__secondary-button:has(.app-store), .banner-container .banner-wrapper .mod__light-secondary-button:has(.app-store), .banner-container .banner-wrapper .mod__primary-button:has(.app-store), .banner-container .banner-wrapper .mod__light-primary-button:has(.app-store), .banner-container .banner-wrapper .mod__secondary-button:has(.play-store), .banner-container .banner-wrapper .mod__light-secondary-button:has(.play-store), .banner-container .banner-wrapper .mod__primary-button:has(.play-store), .banner-container .banner-wrapper .mod__light-primary-button:has(.play-store), .banner-container .banner-wrapper .mod__secondary-button:has(.cmp-qr__button), .banner-container .banner-wrapper .mod__light-secondary-button:has(.cmp-qr__button), .banner-container .banner-wrapper .mod__primary-button:has(.cmp-qr__button), .banner-container .banner-wrapper .mod__light-primary-button:has(.cmp-qr__button) {
        min-width: 136px
    }

    .banner-container .banner-wrapper .mod__secondary-button .app-store, .banner-container .banner-wrapper .mod__light-secondary-button .app-store, .banner-container .banner-wrapper .mod__primary-button .app-store, .banner-container .banner-wrapper .mod__light-primary-button .app-store, .banner-container .banner-wrapper .mod__secondary-button .play-store, .banner-container .banner-wrapper .mod__light-secondary-button .play-store, .banner-container .banner-wrapper .mod__primary-button .play-store, .banner-container .banner-wrapper .mod__light-primary-button .play-store {
        justify-content: flex-start
    }

@media(min-width:764px) {
    .banner-container .banner-wrapper.hideOnMobile .banner-wrapper-card {
        padding: 21px 32px
    }

    .banner-container .banner-wrapper.hideOnMobile .wrapper-image {
        display: block
    }

    .banner-container .banner-wrapper .banner-wrapper-card {
        flex-flow: row;
        align-items: center
    }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description {
            order: 0;
            padding: 21px 32px;
            max-width: 391px;
            width: 65%
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-buttons {
            flex-direction: row;
            margin: unset;
            max-width: unset;
            gap: 0 32px
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-title .cmp-title__text {
            font-size: 24px;
            text-align: start
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-text p {
            max-width: unset;
            font-size: 16px;
            text-align: start
        }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-image .cmp-image__image {
            max-height: none
        }

    .banner-container .banner-wrapper__bg-image {
        position: relative;
        overflow: hidden
    }

        .banner-container .banner-wrapper__bg-image .banner-wrapper-card {
            position: relative;
            width: 100%;
            min-height: 209px
        }

            .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-description {
                padding: 16px 32px;
                flex-flow: row;
                align-items: center
            }

            .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-image {
                position: absolute;
                top: 0;
                right: 0;
                bottom: 0;
                left: 0
            }

                .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-image .cmp-image__image {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    position: absolute;
                    top: 0;
                    left: 0;
                    z-index: 0
                }

            .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-image__background-solid {
                display: none
            }

            .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-image__background-image {
                display: block
            }

            .banner-container .banner-wrapper__bg-image .banner-wrapper-card .wrapper-image::before {
                width: 50%;
                height: 100%;
                background: linear-gradient(to left,transparent,var(--color-bg-01));
                z-index: 1
            }

    .banner-container .banner-wrapper__solid .wrapper-image {
        width: 50%
    }

        .banner-container .banner-wrapper__solid .wrapper-image .cmp-image__image {
            max-height: none;
            max-width: 320px
        }

    .banner-container .banner-wrapper__solid .wrapper-image__left {
        order: -1;
        margin-right: 32px;
        margin-left: 16px
    }

    .banner-container .banner-wrapper__solid .wrapper-image__right {
        order: 1;
        margin-left: 32px;
        margin-right: 16px;
        text-align: end
    }
}

@media(min-width:1016px) {
    .banner-container .banner-wrapper.banner-wrapper__bg-image .banner-wrapper-card {
        padding: 32px 50px;
        min-height: 241px
    }

    .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description {
        max-width: 459px
    }

    .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-text p {
        font-size: 20px
    }

    .banner-container .banner-wrapper__solid .wrapper-image .cmp-image__image {
        max-width: 481px
    }
}

@media(min-width:1436px) {
    .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description {
        max-width: 537px
    }

    .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-title {
        margin-bottom: 16px
    }

        .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-title .cmp-title__text {
            font-size: 30px
        }

    .banner-container .banner-wrapper .banner-wrapper-card .wrapper-description-text p {
        font-size: 24px;
        line-height: 1.3
    }

    .banner-container .banner-wrapper__solid .wrapper-image .cmp-image__image {
        max-width: 717px
    }

    .banner-container .banner-wrapper.banner-wrapper__bg-image .banner-wrapper-card {
        min-height: 300px
    }
}