.chrome-section-reflection {
    position: relative;

    /* overflow:clip — visually same as hidden but does NOT create stacking context
       so position:fixed dropdowns (mega menu) escape freely and are not clipped */
    overflow: clip;

    background: linear-gradient(105deg, 
        rgba(57,56,56,1) 4%, 
        rgba(254,227,216,1) 8%, 
        rgba(239,240,243,1) 10%, 
        rgba(255,255,229,1) 13%, 
        rgba(254,192,171,1) 17%, 
        rgba(86,87,89,1) 23%, 
        rgba(86,87,89,1) 35%, 
        rgba(194,169,138,1) 39%, 
        rgba(184,184,184,1) 43%, 
        rgba(184,184,184,1) 53%, 
        rgba(229,255,254,1) 58%, 
        rgba(239,240,243,1) 60%, 
        rgba(255,247,234,1) 67%, 
        rgba(249,232,225,1) 69%, 
        rgba(180,178,181,1) 75%, 
        rgba(208,216,248,1) 78%, 
        rgba(89,81,87,1) 82%, 
        rgba(89,81,87,1) 87%, 
        rgba(203,207,219,1) 89%, 
        rgba(89,81,87,1) 92%, 
        rgba(57,56,56,1) 96%
    );

    background-size: 300% 100%;
    background-position: 0% 0%;
    transition: background-position 0.8s ease-out;

    border-top: 1px solid rgba(238,238,220,0.9);
    border-right: 1px solid rgba(40,40,40,0.8);
    border-bottom: 1px solid rgba(40,40,40,0.9);
    border-left: 1px solid rgba(91,107,128,0.7);
    box-shadow: 0 2px 12px rgba(0,0,0,0.7);
}

.chrome-section-reflection:hover {
    background-position: 100% 0%;
}

.chrome-section-reflection.menu-frozen {
    background-position: 0% 0% !important;
    transition: none !important;
}