/* --- Transition Overlay Setup --- */
.transitionContainer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    z-index: 10000; /* Places transition blocks above everything else */
    pointer-events: none; /* Allows user to click things underneath */
}

.transition-row {
    flex: 1;
    display: flex;
}

.transition-row.row-1 .block {
    transform-origin: top;
}

.transition-row.row-2 .block {
    transform-origin: bottom;
}

.block {
    flex: 1;
    background-color: #000;
    transform: scaleY(1); /* Initial state: Blocks cover the screen fully */
    will-change: transform; 
}