/* ============================================================
   Shared mobile navigation (hamburger) — BaigOps
   Works with BOTH nav structures used on the site:
     • Homepage / landing:  <nav class="nav"> … .nav-links … .nav-cta
     • Inner pages:         <nav class="navbar"> … .nav-links … .nav-right/.btn-primary
   The button + dropdown are injected by /mobile-nav.js, so these
   styles only activate once JS has added .has-mobile-nav to <html>.
   That guarantees no regression if JS fails to load.
   ============================================================ */

/* The CTA cloned into .nav-links by mobile-nav.js belongs to the
   phone dropdown only — never show it in the desktop link row */
@media (min-width:901px){
    .nav-links .nav-mobile-cta{ display:none !important; }
}

.nav-burger{
    display:none;
    position:absolute;
    top:50%;
    right:20px;
    transform:translateY(-50%);
    width:44px;
    height:44px;
    padding:11px;
    box-sizing:border-box;
    background:transparent;
    border:0;
    cursor:pointer;
    z-index:120;
}
.nav-burger span{
    display:block;
    width:22px;
    height:2px;
    margin:4px 0;
    border-radius:2px;
    background:#0e1957;
    transition:transform .25s ease, opacity .2s ease;
}
nav.nav-open .nav-burger span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
nav.nav-open .nav-burger span:nth-child(2){ opacity:0; }
nav.nav-open .nav-burger span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

@media (max-width:900px){
    .has-mobile-nav .nav,
    .has-mobile-nav .navbar{ position:relative; }

    /* show the hamburger, hide the inline desktop links + bar CTA */
    .has-mobile-nav .nav-burger{ display:block; }
    .has-mobile-nav .nav-links{ display:none !important; }
    .has-mobile-nav nav .nav-cta,
    .has-mobile-nav nav .nav-right{ display:none !important; }

    /* the open dropdown panel */
    .has-mobile-nav nav.nav-open .nav-links{
        display:flex !important;
        flex-direction:column;
        align-items:flex-start;
        gap:4px;
        position:absolute;
        top:100%;
        left:0;
        right:0;
        margin:0;
        padding:14px 24px calc(18px + env(safe-area-inset-bottom));
        background:#ffffff;
        border-bottom:1.5px solid #0e1957;
        box-shadow:0 22px 44px rgba(7,14,58,.16);
        z-index:110;
    }
    .has-mobile-nav nav.nav-open .nav-links a{
        display:block;
        width:100%;
        padding:12px 0;
        font-size:1.05rem;
        line-height:1.2;
        color:#0e1957;
    }
    /* the booking CTA cloned into the menu */
    .has-mobile-nav nav.nav-open .nav-links a.nav-mobile-cta{
        margin-top:8px;
        padding:14px 18px;
        text-align:center;
        background:#0e1957;
        color:#ffffff !important;
        border-radius:8px;
        font-weight:600;
    }
}
