.secuencia-scroll {
    height: 200vh;
    position: relative;
    view-timeline-name: --timeline-secuencia;
    view-timeline-axis: block;
}
.secuencia-sticky {
    position: sticky;
    top: 0;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.secuencia-imagen {
    width: min(100%, 1200px);
    aspect-ratio: 16 / 9;
    background-image: url("https://cl-paris-media-hub.ecomm.cencosud.com/files/landing/mi-descanso/secuencia_canvas.webp?v=1");
    background-repeat: no-repeat;
    background-size: 600% 1000%;
    background-position: 0% 0%;
}
/* MOBILE */
@media screen and (max-width: 767px) {
    .secuencia-scroll {
        height: auto;
        position: relative;
        view-timeline-name: --timeline-secuencia;
        view-timeline-axis: block;
    }
}

@supports (animation-timeline: view()) {
    .secuencia-imagen {
    animation-name: reproducir-secuencia;
    animation-duration: 1s;
    animation-timing-function: steps(1, end);
    animation-fill-mode: both;
    animation-timeline: --timeline-secuencia;
    animation-range:
        contain 0%
        contain 100%;
    }
}
@keyframes reproducir-secuencia {
    0% {
    background-position: 0% 0%;
    }
    1.666667% {
    background-position: 20% 0%;
    }
    3.333333% {
    background-position: 40% 0%;
    }
    5% {
    background-position: 60% 0%;
    }
    6.666667% {
    background-position: 80% 0%;
    }
    8.333333% {
    background-position: 100% 0%;
    }
    10% {
    background-position: 0% 11.111111%;
    }
    11.666667% {
    background-position: 20% 11.111111%;
    }
    13.333333% {
    background-position: 40% 11.111111%;
    }
    15% {
    background-position: 60% 11.111111%;
    }
    16.666667% {
    background-position: 80% 11.111111%;
    }
    18.333333% {
    background-position: 100% 11.111111%;
    }
    20% {
    background-position: 0% 22.222222%;
    }
    21.666667% {
    background-position: 20% 22.222222%;
    }
    23.333333% {
    background-position: 40% 22.222222%;
    }
    25% {
    background-position: 60% 22.222222%;
    }
    26.666667% {
    background-position: 80% 22.222222%;
    }
    28.333333% {
    background-position: 100% 22.222222%;
    }
    30% {
    background-position: 0% 33.333333%;
    }
    31.666667% {
    background-position: 20% 33.333333%;
    }
    33.333333% {
    background-position: 40% 33.333333%;
    }
    35% {
    background-position: 60% 33.333333%;
    }
    36.666667% {
    background-position: 80% 33.333333%;
    }
    38.333333% {
    background-position: 100% 33.333333%;
    }
    40% {
    background-position: 0% 44.444444%;
    }
    41.666667% {
    background-position: 20% 44.444444%;
    }
    43.333333% {
    background-position: 40% 44.444444%;
    }
    45% {
    background-position: 60% 44.444444%;
    }
    46.666667% {
    background-position: 80% 44.444444%;
    }
    48.333333% {
    background-position: 100% 44.444444%;
    }
    50% {
    background-position: 0% 55.555556%;
    }
    51.666667% {
    background-position: 20% 55.555556%;
    }
    53.333333% {
    background-position: 40% 55.555556%;
    }
    55% {
    background-position: 60% 55.555556%;
    }
    56.666667% {
    background-position: 80% 55.555556%;
    }
    58.333333% {
    background-position: 100% 55.555556%;
    }
    60% {
    background-position: 0% 66.666667%;
    }
    61.666667% {
    background-position: 20% 66.666667%;
    }
    63.333333% {
    background-position: 40% 66.666667%;
    }
    65% {
    background-position: 60% 66.666667%;
    }
    66.666667% {
    background-position: 80% 66.666667%;
    }
    68.333333% {
    background-position: 100% 66.666667%;
    }
    70% {
    background-position: 0% 77.777778%;
    }

    71.666667% {
    background-position: 20% 77.777778%;
    }

    73.333333% {
    background-position: 40% 77.777778%;
    }

    75% {
    background-position: 60% 77.777778%;
    }

    76.666667% {
    background-position: 80% 77.777778%;
    }

    78.333333% {
    background-position: 100% 77.777778%;
    }


    /* Fila 9 — Frames 49 a 54 */

    80% {
    background-position: 0% 88.888889%;
    }

    81.666667% {
    background-position: 20% 88.888889%;
    }

    83.333333% {
    background-position: 40% 88.888889%;
    }

    85% {
    background-position: 60% 88.888889%;
    }

    86.666667% {
    background-position: 80% 88.888889%;
    }

    88.333333% {
    background-position: 100% 88.888889%;
    }


    /* Fila 10 — Frames 55 a 60 */

    90% {
    background-position: 0% 100%;
    }

    91.666667% {
    background-position: 20% 100%;
    }

    93.333333% {
    background-position: 40% 100%;
    }

    95% {
    background-position: 60% 100%;
    }

    96.666667% {
    background-position: 80% 100%;
    }

    98.333333%,
    100% {
    background-position: 100% 100%;
    }
}
@media (prefers-reduced-motion: reduce) {
    .secuencia-scroll {
    height: 100vh;
    height: 100svh;
    }

    .secuencia-imagen {
    animation: none;
    background-position: 0% 0%;
    }
}
.contenido-siguiente {
    min-height: 100vh;
    padding: 80px 5vw;

    display: grid;
    place-items: center;

    background: #f3f3f3;
}

.contenido-siguiente h2 {
    margin: 0;
    font-size: clamp(32px, 5vw, 72px);
}