/* Base styles for the menu */
.menu {
    transition: transform 300ms ease, opacity 300ms ease;
    transform-origin: top;
    will-change: transform, opacity;
}

 Show the menu 
.show-menu {
    opacity: 1;
    transform: scaleY(1);
    pointer-events: auto;
}

 Hide the menu 
.hide-menu {
    opacity: 0;
    transform: scaleY(0);
    pointer-events: none;
}