/* Effektgruppe: backgrounds/scroll-color; Reihenfolge in inc/assets.php. */

/* Die Spalte, die die Farbe ändert */
.color-transition-col {
    transition: background-color 1s ease;
    /* PERFORMANCE BOOST */
    will-change: background-color; 
    /* Ein kleiner Trick: translateZ(0) stellt sicher, dass der 
       Browser für die Spalte eine eigene GPU-Ebene erstellt. */
    transform: translateZ(0);
    background-color: var(--global-palette1); /* Startfarbe */
}

/* Zustände für die verschiedenen Drittel */
.state-first { background-color: var(--global-palette1) !important; }
.state-second { background-color: var(--global-palette2) !important; }
.state-third { background-color: var(--global-palette3) !important; }