.mobile-popup{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.7);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 99999;
    padding:20px;
}

.mobile-popup.show{
    display:flex;
}

.popup-box{
    width:100%;
    max-width:385px;
    background:#fbfafb;
    border-radius:20px;
    overflow:hidden;
    position:relative;
    animation:popup .3s ease;
    box-shadow:0 15px 40px rgba(0,0,0,.18);
}

.popup-img{
    width:100%;
    display:block;
}

.close-popbtn{
    position:absolute;
    top:10px;
    right:10px;
    width:30px;
    height:30px;
    border:none;
    border-radius:50%;
    background:#fff;
    font-size:22px;
    cursor:pointer;
    line-height:30px;
    box-shadow:0 2px 8px rgba(0,0,0,.2);
}

@keyframes popup{
    from{
        transform:scale(.8);
        opacity:0;
    }
    to{
        transform:scale(1);
        opacity:1;
    }
}

/*******************************/
.popup{
    /* width:320px; */
    background:#fbfafb;
    /* border-radius:22px; */
    padding:18px;
    position:relative;
    
}

.lopopgo{
    display:block;
    width:120px;
    margin:0 auto 15px;
}

.banppner img{
    width:100%;
    border-radius:8px;
    display:block;
}

.heading{
    text-align:center;
    margin:18px 0;
}

.heading .official {
    font-size:14px;
    letter-spacing:4px;
    color:#444;
    position:relative;
    display:inline-block;
}

.official {text-align: center; margin-top: 5px;}


.heapopding h2{
    margin-top:8px;
    font-size:19px;
    font-weight:700;
    color:#333;
    letter-spacing:1px;
    text-align: center;
}

.heapopding h2 span{
    color:#ff4b1f;
}

.heapopding p{
    margin-top:5px;
    font-size:11px;
    color:#666;
    text-align: center;
}

.player{
    width:100%;
    display:block;
    margin:10px auto 15px;
}

.servpopices{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.servipop{
    border:1px solid #ececec;
    border-radius:8px;
    padding:10px;
    display:flex;
    align-items:center;
    gap:8px;
    font-size:12px;
    color:#333;
}

.servipop img{
    width:22px;
    height:22px;
}

.call-popbtn{
    margin-top:18px;
    background:#0f2d6d;
    color:#fff;
    border-radius:8px;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:10px;
}

.call-icon{
    width:38px;
    height:38px;
    background:#fff;
    border-radius:50%;
    color:#ff5722;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:18px;
    font-weight:bold;
}

.call-text small{
    display:block;
    font-size:11px;
}

.call-text strong{
    font-size:23px;
    line-height:1;
    display:block;
}

.footerpup{
    margin-top:14px;
    text-align:center;
    font-size:11px;
    color:#777;
    position:relative;
}


@media(max-width:340px){

.popup{
    width:95%;
    padding:15px;
}

.heapopding h2{
    font-size:17px;
}

.call-text strong{
    font-size:22px;
}

.service{
    font-size:13px;
}

}

.movinn  {
    animation-name: trin;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes trin {
    from {
        transform:rotate3d(0, 0, 1, 0deg);
    }
    20%, 32%, 44%, 56%, 68% {
        transform: rotate3d(0, 0, 1, 0deg);
    }
    23%, 35%, 47%, 59%, 71% {
        transform: rotate3d(0,0,1,15deg);
    }
    26%, 38%, 50%, 62%, 74% {
        transform: rotate3d(0,0,1,0deg);
    }
    29%, 41%, 53%, 65%, 77% {
        transform: rotate3d(0,0,1,-15deg);
    }
    80% {
        transform:rotate3d(0, 0, 1, 0deg);
    }
    
}