/* Hide hamburger on desktop */
.menu-toggle {
    display: none;
}

/* Mobile */
@media (max-width:768px){

    .navbar .container{
        flex-direction:row;
        justify-content:space-between;
        align-items:center;
    }

    /* Hamburger */
    .menu-toggle{
        display:block;
        width:44px;
        height:44px;
        border:none;
        background:none;
        cursor:pointer;
        font-size:30px;
        color:var(--primary);
    }

    .menu-toggle::before{
        content:"☰";
    }

    /* Hidden menu */
    #mobileMenu{
        display:none;
        position:absolute;
        top:100%;
        right:0;
        width:240px;              /* NOT full screen */
        background:#fff;
        box-shadow:0 10px 25px rgba(0,0,0,.15);
        border-radius:12px;
        padding:10px 0;
        flex-direction:column;
        gap:0;
        z-index:999;
    }

    /* Show menu */
    #mobileMenu.show{
        display:flex;
    }

    #mobileMenu a{
        display:block;
        padding:15px 20px;
        text-decoration:none;
        color:var(--primary);
        font-size:1rem;
        border-bottom:1px solid #eee;
    }

    #mobileMenu a:last-child{
        border-bottom:none;
    }

    #mobileMenu a:hover{
        background:#f5f5f5;
    }
}