
.mobile-nav-toggle{
display:none;
width:48px;
height:48px;
border-radius:14px;
border:1px solid rgba(255,255,255,.12);
background:rgba(255,255,255,.06);
align-items:center;
justify-content:center;
cursor:pointer;
position:relative;
z-index:1201;
backdrop-filter:blur(14px);
}
.mobile-nav-toggle span{
width:22px;
height:2px;
background:#fff;
position:absolute;
border-radius:999px;
transition:.25s ease;
}
.mobile-nav-toggle span:nth-child(1){transform:translateY(-7px);}
.mobile-nav-toggle span:nth-child(3){transform:translateY(7px);}
.mobile-nav-toggle.active span:nth-child(1){transform:rotate(45deg);}
.mobile-nav-toggle.active span:nth-child(2){opacity:0;}
.mobile-nav-toggle.active span:nth-child(3){transform:rotate(-45deg);}

@media (max-width:980px){
body.menu-open{overflow:hidden;}
.mobile-nav-toggle{display:flex;margin-left:auto;}

.public-nav{
position:fixed;
inset:0;
width:100%;
height:100vh;
background:linear-gradient(180deg,#071225 0%,#081121 100%);
display:flex!important;
flex-direction:column;
justify-content:center;
align-items:center;
gap:1.4rem;
padding:120px 24px 40px;
z-index:1200;
opacity:0;
visibility:hidden;
transform:translateY(-12px);
transition:.28s ease;
}

.public-nav.active{
opacity:1;
visibility:visible;
transform:none;
}

.public-nav a{
font-size:1.15rem!important;
width:100%;
max-width:320px;
text-align:center;
padding:16px 20px;
border-radius:18px;
background:rgba(255,255,255,.05);
border:1px solid rgba(255,255,255,.08);
}

.nav-actions{display:none!important;}

.hero,
.clean-hero,
.mme-managed-hero{
padding-top:110px!important;
}

.hero h1,
.clean-hero h1,
.mme-managed-hero h1{
font-size:clamp(2.6rem,12vw,4.1rem)!important;
line-height:.95!important;
}

.hero-actions,
.mme-hero-actions{
width:100%;
flex-direction:column;
align-items:stretch;
}

.hero-actions .btn,
.mme-hero-actions .btn{
width:100%;
text-align:center;
justify-content:center;
}
}


/* Improved mobile dropdown navigation */
@media (max-width:980px){

    .public-site-header,
    .site-header{
        position:sticky;
        top:0;
        z-index:1300;
    }

    .mobile-nav-toggle{
        box-shadow:0 14px 35px rgba(0,0,0,.22);
    }

    .public-nav{
        position:absolute !important;
        top:calc(100% + 12px) !important;
        left:16px !important;
        right:16px !important;
        inset:auto 16px auto 16px !important;
        width:auto !important;
        height:auto !important;
        min-height:0 !important;
        padding:14px !important;
        border:1px solid rgba(255,255,255,.14);
        border-radius:24px;
        background:
            radial-gradient(circle at top right, rgba(96,165,250,.20), transparent 18rem),
            linear-gradient(180deg, rgba(15,30,57,.98), rgba(7,18,37,.98));
        box-shadow:0 28px 90px rgba(0,0,0,.45);
        backdrop-filter:blur(22px);
        display:grid !important;
        grid-template-columns:1fr;
        gap:.65rem !important;
        justify-content:start !important;
        align-items:stretch !important;
        opacity:0;
        visibility:hidden;
        transform:translateY(-10px) scale(.98);
        transform-origin:top center;
        transition:opacity .22s ease, transform .22s ease, visibility .22s ease;
    }

    .public-nav.active{
        opacity:1;
        visibility:visible;
        transform:translateY(0) scale(1);
    }

    .public-nav a{
        width:100% !important;
        max-width:none !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        text-align:left !important;
        font-size:1rem !important;
        padding:15px 16px !important;
        border-radius:16px !important;
        background:rgba(255,255,255,.055) !important;
        border:1px solid rgba(255,255,255,.08) !important;
        color:rgba(255,255,255,.92) !important;
        font-weight:900 !important;
    }

    .public-nav a::after{
        content:"›";
        opacity:.55;
        font-size:1.35rem;
        line-height:1;
    }

    .public-nav a:hover,
    .public-nav a:focus{
        background:rgba(96,165,250,.16) !important;
        border-color:rgba(96,165,250,.35) !important;
    }

    .public-nav::after{
        content:"Start with 1 free migration credit";
        display:block;
        margin-top:.35rem;
        padding:14px 16px;
        border-radius:18px;
        background:linear-gradient(135deg, rgba(96,165,250,.22), rgba(139,92,246,.22));
        border:1px solid rgba(255,255,255,.11);
        color:#dbeafe;
        text-align:center;
        font-weight:900;
        font-size:.92rem;
    }

    body.menu-open{
        overflow:auto !important;
    }

    .nav-actions{
        display:none !important;
    }
}
