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

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

@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)
    }
}

.cmp-immersive-asset-scroll {
    padding: 32px 0
}

.cmp-immersive-asset-scroll__container {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1920px;
    min-width: 320px;
    padding: 0 var(--dg-layout-margin)
}

.cmp-immersive-asset-scroll__top {
    padding: 0 var(--dg-layout-margin);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: var(--dg-spacing-s-3)
}

.cmp-immersive-asset-scroll__title {
    text-align: center
}

    .cmp-immersive-asset-scroll__title .cmp-title__text {
        color: var(--dg-color-text-strong,#fafafa);
        font-family: var(--dg-font-family-base);
        font-weight: 300;
        text-transform: uppercase;
        font-size: var(--dg-font-size-headline-m);
        line-height: var(--dg-font-height-headline-m);
        letter-spacing: var(--dg-font-letter-spacing-m);
        word-break: break-word;
        margin: 0
    }

.cmp-immersive-asset-scroll__text {
    text-align: center
}

    .cmp-immersive-asset-scroll__text .cmp-text p {
        color: var(--dg-color-text-medium,#d3d6d9);
        font-family: var(--dg-font-family-base);
        font-weight: 350;
        font-size: var(--dg-font-size-body-l);
        line-height: var(--dg-font-height-body-l);
        letter-spacing: var(--dg-font-letter-spacing-m);
        word-break: break-word
    }

        .cmp-immersive-asset-scroll__text .cmp-text p > a {
            color: var(--dg-color-text-medium,#d3d6d9);
            text-decoration: underline
        }

.cmp-immersive-asset-scroll__ctas-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: var(--dg-spacing-m-2);
    position: relative
}

.cmp-immersive-asset-scroll__cta-button {
    min-width: 178px
}

.cmp-immersive-asset-scroll__asset-background {
    min-height: 200px
}

    .cmp-immersive-asset-scroll__asset-background .cmp-image__image, .cmp-immersive-asset-scroll__asset-background .cmp-video-v2__video {
        border-radius: var(--dg-border-radius-l,20px)
    }

    .cmp-immersive-asset-scroll__asset-background .cmp-video-v2__video {
        width: 100%;
        height: 100%;
        position: relative
    }

    .cmp-immersive-asset-scroll__asset-background .cmp-video-spinner {
        display: none
    }

@media(min-width:480px) {
    .cmp-immersive-asset-scroll {
        padding: 40px 0
    }

    .cmp-immersive-asset-scroll__title {
        word-break: initial
    }
}

@media(min-width:768px) {
    .cmp-immersive-asset-scroll {
        padding: 48px 0
    }

    .cmp-immersive-asset-scroll__top {
        align-items: center;
        justify-content: center
    }

    .cmp-immersive-asset-scroll__title {
        width: 580px
    }

    .cmp-immersive-asset-scroll__ctas-container {
        flex-direction: row;
        gap: 16px
    }
}

@media(min-width:1024px) {
    .cmp-immersive-asset-scroll {
        padding: 64px 0
    }

    .cmp-immersive-asset-scroll__text {
        width: 802px
    }
}

.cmp-immersive-asset-scroll {
    overflow: hidden
}

.cmp-immersive-asset-scroll__container {
    max-width: 100%
}

.cmp-immersive-asset-scroll__asset-background {
    display: flex;
    justify-content: center;
    margin-top: 60px;
    will-change: margin-top
}

    .cmp-immersive-asset-scroll__asset-background .cmp-image__image, .cmp-immersive-asset-scroll__asset-background .cmp-video-v2__video {
        height: 100vh
    }

.cmp-immersive-asset-scroll__ctas-container {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity .5s ease;
    width: inherit
}

    .cmp-immersive-asset-scroll__ctas-container.mod__fixed, .cmp-immersive-asset-scroll__ctas-container.mod__restored {
        opacity: 1;
        pointer-events: auto
    }

    .cmp-immersive-asset-scroll__ctas-container.mod__restored {
        position: relative;
        bottom: 0;
        margin-top: -112px
    }

@media(min-width:480px) {
    .cmp-immersive-asset-scroll__ctas-container {
        bottom: 40px
    }
}

@media(min-width:768px) {
    .cmp-immersive-asset-scroll__asset-background {
        margin-top: 250px
    }

    .cmp-immersive-asset-scroll__ctas-container {
        bottom: 48px
    }

        .cmp-immersive-asset-scroll__ctas-container.mod__restored {
            margin-top: -48px
        }
}

@media(min-width:1024px) {
    .cmp-immersive-asset-scroll__asset-background {
        margin-top: 276px
    }
}

@media(min-width:1440px) {
    .cmp-immersive-asset-scroll__asset-background {
        margin-top: 352px
    }

    .cmp-immersive-asset-scroll__ctas-container {
        bottom: 64px
    }
}