:root {
    --coverflow-perspective: 500px;
}

.coverflow {
    position: relative;
    overflow: hidden;
}

.coverflow__items {
    position: relative;
    list-style: none;
    display: block;
    padding: 0;
}

.coverflow__item {
    display: block;
    margin: 0 auto;
    width: fit-content;
}

.coverflow__item:nth-child(n+2) {
    display: none;
}


.coverflow.--active {}

.coverflow.--active .coverflow__items {
    perspective: var(--coverflow-perspective);
    transform-style: preserve-3d;
}

.coverflow.--active .coverflow__item {
    display: block;
    position: absolute;
    left: 50%;
    transform: translate3d(-50%, 0, 0);
    transition: transform .3s;
    will-change: transform;
}

.coverflow__item > * {
    max-width: 70vw;
    display: block;
}