body{font-family:Poppins,sans-serif}.navbar{transition:.3s}.navbar.scrolled{background:#fff;box-shadow:0 5px 20px rgba(0,0,0,.15)}.logo{height:50px}.navbar-brand span,.nav-link{color:#fff!important}.navbar.scrolled .navbar-brand span,.navbar.scrolled .nav-link{color:#222!important}.hero{background:linear-gradient(135deg,#1b2559,#f57c00)}.glass{background:rgba(255,255,255,.12);backdrop-filter:blur(12px);padding:50px;border-radius:24px;color:#fff}.placeholder-img{height:380px;background:linear-gradient(135deg,#1b2559,#f57c00);border-radius:24px;color:#fff;display:flex;align-items:center;justify-content:center}.card{border-radius:20px;transition:.3s}.card:hover{transform:translateY(-8px)}
.service-card{transition:.3s;border-radius:18px}
.service-card:hover{transform:translateY(-8px);box-shadow:0 1rem 2rem rgba(0,0,0,.12)!important}

.wc{transition:.3s}.wc:hover{transform:translateY(-8px)}
.client-box{background:#fff;border:1px solid #eee;border-radius:16px;padding:40px;font-weight:bold;box-shadow:0 8px 20px rgba(0,0,0,.08)}
.gallery-box{height:220px;border-radius:18px;background:linear-gradient(135deg,#1b2559,#f57c00);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:bold;transition:.3s}
.gallery-box:hover{transform:scale(1.03)}

.footer{background:#1b2559;color:#fff}
#waFloat,#backTop{position:fixed;right:20px;width:55px;height:55px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 8px 20px rgba(0,0,0,.2);z-index:999}
#waFloat{bottom:20px;background:#25D366;font-size:28px}
#backTop{bottom:90px;background:#1b2559}

html{scroll-behavior:smooth}
section{scroll-margin-top:90px}
#loader{position:fixed;inset:0;background:#fff;display:flex;align-items:center;justify-content:center;z-index:99999}
body.loaded #loader{display:none}
.btn{transition:.3s}
.btn:hover{transform:translateY(-3px)}
.service-card,.card,.feature{transition:.35s}
.service-card:hover,.card:hover,.feature:hover{transform:translateY(-8px)}


/* ===== Mobile Improvements ===== */
@media (max-width:991.98px){

    .navbar{
        background:#1b2559 !important;
        padding:12px 0;
    }

    .navbar-brand span{
        font-size:15px;
    }

    .navbar-collapse{
        margin-top:12px;
        background:#ffffff;
        border-radius:12px;
        padding:12px;
        box-shadow:0 10px 30px rgba(0,0,0,.15);
    }

    .navbar-collapse .nav-link{
        color:#333 !important;
        padding:12px 8px;
        border-bottom:1px solid #eee;
    }

    .navbar-collapse .btn{
        width:100%;
        margin-top:12px;
    }

    .hero{
        padding-top:110px;
        text-align:center;
    }

    .hero h1{
        font-size:2rem !important;
        line-height:1.3;
    }

    .hero p{
        font-size:1rem;
    }

    .hero img,
    .hero .glass{
        margin-top:30px;
    }

    section{
        padding-top:60px !important;
        padding-bottom:60px !important;
    }

    .card,
    .service-card,
    .feature{
        margin-bottom:20px;
    }

    .counter-section h2{
        font-size:2rem;
    }

    footer{
        text-align:center;
    }

    #waFloat{
        right:15px;
        bottom:15px;
    }

    #backTop{
        right:15px;
        bottom:85px;
    }

    .client-box{
        height:120px;
        padding:15px;
    }

    .client-logo{
        max-width:90%;
        max-height:70px;
    }
}

.placeholder-img{
    position:relative;
    height:450px;
    border-radius:24px;
    overflow:hidden;

    background:linear-gradient(135deg,#1B2559,#F57C00);
}

.placeholder-img::before{

    content:"";

    position:absolute;
    inset:0;

    /* background:rgba(255,255,255,.18); */

    z-index:1;
}

.about-bg{
    position:relative;
    z-index:2;

    width:100%;
    height:100%;

    display:flex;
    justify-content:center;
    align-items:center;

    background:transparent;
}

.about-img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
}



.service-card{
    position:relative;
    overflow:hidden;
    border-radius:20px;
    min-height:280px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
}

.service-recruitment{
    background:url("../img/recruitment.webp");
    background-size:cover;
    background-position:center;
}
.service-recruitment::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-training{
    background:url("../img/training.webp");
    background-size:cover;
    background-position:center;
}
.service-training::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-payroll{
    background:url("../img/payroll.webp");
    background-size:cover;
    background-position:center;
}
.service-payroll::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-performance{
    background:url("../img/performance.webp");
    background-size:cover;
    background-position:center;
}
.service-performance::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-building{
    background:url("../img/building.webp");
    background-size:cover;
    background-position:center;
}
.service-building::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-housekeeping{
    background:url("../img/housekeeping.webp");
    background-size:cover;
    background-position:center;
}
.service-housekeeping::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-security{
    background:url("../img/security.jpg");
    background-size:cover;
    background-position:center;
}
.service-security::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-garden{
    background:url("../img/garden.webp");
    background-size:cover;
    background-position:center;
}
.service-garden::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-pest{
    background:url("../img/pest.webp");
    background-size:cover;
    background-position:center;
}
.service-pest::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.78),
        rgba(245,124,0,.55)
    );
}

.service-card .card-body{
    position:relative;
    z-index:2;
}

.service-card{
    transition:.35s;
}

.service-card:hover{
    transform:translateY(-10px);
}

.service-card:hover::before{
    background:linear-gradient(
        rgba(27,37,89,.65),
        rgba(245,124,0,.35)
    );
}



.client-box{
    background:#fff;
    border-radius:20px;
    padding:20px;
    height:180px;
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
}

.client-logo{
    max-width:70%;
    max-height:100%;
    width:auto;
    height:auto;
    object-fit:contain;
    display:block;
    filter:grayscale(60%);
}

.client-box:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.15);
}

.client-box:hover .client-logo{
    filter:grayscale(0);
    transform:scale(1.08);
}



.hero-logo{
    width:180px;
    max-width:100%;
    height:auto;
    transition:.4s;
    filter:drop-shadow(0 10px 25px rgba(0,0,0,.25));
}

.hero-logo:hover{
    transform:scale(1.05);
}




.gallery-box{
    position:relative;
    height:260px;
    border-radius:20px;
    overflow:hidden;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:.35s;
    background-size:cover;
    background-position:center;
}

.gallery-box::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(27,37,89,.70),
        rgba(245,124,0,.45)
    );
    transition:.35s;
}

.gallery-content{
    position:relative;
    z-index:2;
    color:white;
    text-align:center;
}

.gallery-box:hover{
    transform:translateY(-8px);
}

.gallery-box:hover::before{
    background:linear-gradient(
        rgba(27,37,89,.45),
        rgba(245,124,0,.25)
    );
}

.gallery-project-1{
    background-image:url("../img/project1.webp");
}

.gallery-project-2{
    background-image:url("../img/project2.webp");
}

.gallery-project-3{
    background-image:url("../img/pest.webp");
}