
.scrollCardHolder {
    --scroll-amount: 1;
    --visible-sibling-count: 6;
    --active-card-index: -3;
    
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;

    position: relative;
    width: fit-content;
/* 
    background-color: red;
    border: 4px solid orange; */
}

.scrollCard {
    position: relative;
    --sibling-index: 0;
    --cardPos: calc(var(--sibling-index) - var(--active-card-index));
    
    bottom: 0;
    --priority: calc(var(--visible-sibling-count)*var(--cardPos) - var(--cardPos)*var(--cardPos));
    z-index: var(--priority);

    /* --opacity: calc(var(--priority)/(0.25*var(--visible-sibling-count)*var(--visible-sibling-count)) + 0.2);
    opacity: var(--opacity); */
}