.menu-icon {
    display: none;
    /* Hidden by default on desktop */
    align-items: center;
    cursor: pointer;
    color: #777;
}

.menu-icon svg {
    transition: color 0.3s ease-in-out;
}

.menu-icon:hover svg {
    color: #111;
}

.menu-icon svg {
    display: block;
    width: 28px;
    height: 28px;
}

@media (max-width: 768px) {
    .menu-icon {
        display: flex;
        /* Displayed on mobile */
        margin-left: 0.5rem;
        /* Left margin instead of right */
    }
}