/* Webtech Software Solution - mobile-only bottom navigation */
.mobile-bottom-nav,
.mobile-nav-overlay,
.mobile-nav-drawer{
    display:none;
}

@media (max-width:860px){
    :root{
        --mobile-nav-primary:#072f83;
        --mobile-nav-accent:#ec0b17;
        --mobile-nav-green:#14b85a;
        --mobile-nav-ink:#15213b;
    }

    body{
        padding-bottom:calc(92px + env(safe-area-inset-bottom));
    }
    body.mobile-nav-open{
        overflow:hidden;
        touch-action:none;
    }

    .mobile-bottom-nav{
        position:fixed;
        left:50%;
        bottom:max(10px,env(safe-area-inset-bottom));
        z-index:1650;
        width:min(calc(100% - 20px),520px);
        min-height:68px;
        padding:7px 9px 6px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        align-items:end;
        border:1px solid rgba(7,47,131,.09);
        border-radius:22px;
        background:rgba(255,255,255,.96);
        box-shadow:0 18px 44px rgba(6,17,38,.24),0 3px 12px rgba(6,17,38,.08);
        backdrop-filter:blur(20px);
        -webkit-backdrop-filter:blur(20px);
        transform:translateX(-50%);
        isolation:isolate;
    }
    .mobile-bottom-nav::before{
        content:"";
        position:absolute;
        left:50%;
        top:-20px;
        width:78px;
        height:42px;
        border-radius:50% 50% 0 0;
        background:rgba(255,255,255,.97);
        border-top:1px solid rgba(7,47,131,.08);
        transform:translateX(-50%);
        z-index:-1;
    }

    .mobile-nav-item{
        min-width:0;
        height:54px;
        padding:4px 2px 2px;
        border:0;
        outline:0;
        background:transparent;
        color:#63708b;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:4px;
        border-radius:14px;
        font-family:inherit;
        font-size:10px;
        font-weight:800;
        line-height:1;
        letter-spacing:.01em;
        cursor:pointer;
        -webkit-tap-highlight-color:transparent;
        transition:color .22s ease,background .22s ease,transform .22s ease;
    }
    .mobile-nav-item i{
        font-size:19px;
        line-height:1;
        transition:transform .22s ease;
    }
    .mobile-nav-item:hover,
    .mobile-nav-item:focus-visible,
    .mobile-nav-item.is-active{
        color:var(--mobile-nav-primary);
        background:rgba(7,47,131,.07);
    }
    .mobile-nav-item:active{
        transform:scale(.94);
    }
    .mobile-nav-item:active i{
        transform:scale(.9);
    }
    .mobile-nav-item.mobile-nav-home i{color:#ff6a22}
    .mobile-nav-item.mobile-nav-menu i{color:#33415c}
    .mobile-nav-item.mobile-nav-services i{color:#00a7a0}
    .mobile-nav-item.mobile-nav-contact i{color:#16a45b}

    .mobile-nav-whatsapp{
        position:relative;
        height:60px;
        overflow:visible;
        color:#128c45;
        background:transparent!important;
        transform:translateY(-19px);
    }
    .mobile-nav-whatsapp .mobile-whatsapp-icon{
        position:relative;
        width:58px;
        height:58px;
        display:grid;
        place-items:center;
        border:4px solid #fff;
        border-radius:50%;
        background:linear-gradient(145deg,#23d366,#0cae49);
        color:#fff;
        box-shadow:0 12px 26px rgba(18,180,80,.34),0 0 0 1px rgba(18,180,80,.08);
        animation:mobileWhatsappPulse 2.2s ease-in-out infinite;
    }
    .mobile-nav-whatsapp .mobile-whatsapp-icon::after{
        content:"";
        position:absolute;
        inset:-7px;
        border:1px solid rgba(24,196,88,.30);
        border-radius:50%;
        animation:mobileWhatsappRing 2.2s ease-out infinite;
    }
    .mobile-nav-whatsapp i{
        font-size:29px;
    }
    .mobile-nav-whatsapp .mobile-nav-label{
        position:absolute;
        top:61px;
        left:50%;
        transform:translateX(-50%);
        color:#188649;
        white-space:nowrap;
    }

    @keyframes mobileWhatsappPulse{
        0%,100%{transform:scale(1)}
        50%{transform:scale(1.08)}
    }
    @keyframes mobileWhatsappRing{
        0%{transform:scale(.82);opacity:.75}
        75%,100%{transform:scale(1.22);opacity:0}
    }

    .mobile-nav-overlay{
        position:fixed;
        inset:0;
        z-index:1690;
        display:block;
        background:rgba(3,12,31,.58);
        backdrop-filter:blur(3px);
        -webkit-backdrop-filter:blur(3px);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transition:opacity .3s ease,visibility .3s ease;
    }
    .mobile-nav-overlay.is-open{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }

    .mobile-nav-drawer{
        position:fixed;
        top:0;
        left:0;
        bottom:0;
        z-index:1700;
        width:min(86vw,360px);
        display:flex;
        flex-direction:column;
        padding:18px 18px calc(24px + env(safe-area-inset-bottom));
        background:linear-gradient(180deg,#fff 0%,#f4f7ff 100%);
        box-shadow:24px 0 70px rgba(6,17,38,.24);
        transform:translateX(-104%);
        visibility:hidden;
        transition:transform .36s cubic-bezier(.2,.8,.2,1),visibility .36s ease;
        overflow-y:auto;
        overscroll-behavior:contain;
    }
    .mobile-nav-drawer.is-open{
        transform:translateX(0);
        visibility:visible;
    }
    .mobile-drawer-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:14px;
        padding:4px 2px 18px;
        border-bottom:1px solid rgba(7,47,131,.10);
    }
    .mobile-drawer-brand{
        display:flex;
        align-items:center;
        min-width:0;
    }
    .mobile-drawer-brand img{
        width:190px;
        max-height:58px;
        object-fit:contain;
    }
    .mobile-drawer-close{
        flex:0 0 42px;
        width:42px;
        height:42px;
        border:0;
        border-radius:14px;
        display:grid;
        place-items:center;
        background:rgba(236,11,23,.09);
        color:var(--mobile-nav-accent);
        font-size:20px;
        cursor:pointer;
    }
    .mobile-drawer-title{
        display:flex;
        align-items:center;
        gap:9px;
        margin:20px 4px 10px;
        color:var(--mobile-nav-ink);
        font:800 13px/1.2 'Inter',sans-serif;
        letter-spacing:.09em;
        text-transform:uppercase;
    }
    .mobile-drawer-title::before{
        content:"";
        width:4px;
        height:18px;
        border-radius:99px;
        background:linear-gradient(180deg,var(--mobile-nav-primary),var(--mobile-nav-accent));
    }
    .mobile-drawer-links{
        display:grid;
        gap:6px;
    }
    .mobile-drawer-links a{
        min-height:48px;
        padding:10px 12px;
        display:flex;
        align-items:center;
        gap:12px;
        border:1px solid transparent;
        border-radius:15px;
        color:#263553;
        font-size:14px;
        font-weight:800;
        transition:.22s ease;
    }
    .mobile-drawer-links a i{
        width:30px;
        height:30px;
        display:grid;
        place-items:center;
        border-radius:10px;
        background:rgba(7,47,131,.08);
        color:var(--mobile-nav-primary);
        font-size:13px;
    }
    .mobile-drawer-links a:hover,
    .mobile-drawer-links a:focus-visible,
    .mobile-drawer-links a.is-active{
        color:var(--mobile-nav-primary);
        border-color:rgba(7,47,131,.10);
        background:#fff;
        box-shadow:0 10px 26px rgba(7,47,131,.08);
        transform:translateX(4px);
    }
    .mobile-drawer-contact{
        margin-top:auto;
        padding-top:20px;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
    }
    .mobile-drawer-contact a{
        min-height:46px;
        display:flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        border-radius:14px;
        color:#fff;
        font-size:13px;
        font-weight:900;
        box-shadow:0 12px 25px rgba(6,17,38,.13);
    }
    .mobile-drawer-contact .drawer-call{
        background:linear-gradient(135deg,#072f83,#0b48bd);
    }
    .mobile-drawer-contact .drawer-whatsapp{
        background:linear-gradient(135deg,#17bb58,#0b9a43);
    }

    .back-to-top{
        right:18px!important;
        bottom:calc(98px + env(safe-area-inset-bottom))!important;
        z-index:1200!important;
    }
}

@media (max-width:390px){
    .mobile-bottom-nav{
        width:calc(100% - 14px);
        padding-inline:5px;
        border-radius:20px;
    }
    .mobile-nav-item{
        font-size:9px;
    }
    .mobile-nav-item i{
        font-size:18px;
    }
    .mobile-nav-whatsapp .mobile-whatsapp-icon{
        width:54px;
        height:54px;
    }
    .mobile-nav-whatsapp i{
        font-size:27px;
    }
    .mobile-nav-whatsapp .mobile-nav-label{
        top:58px;
    }
}

@media (prefers-reduced-motion:reduce){
    .mobile-nav-whatsapp .mobile-whatsapp-icon,
    .mobile-nav-whatsapp .mobile-whatsapp-icon::after{
        animation:none!important;
    }
    .mobile-nav-drawer,
    .mobile-nav-overlay,
    .mobile-nav-item{
        transition:none!important;
    }
}