:root{--p:#0076bc;--s:#004B63;--a:#6BC048;--bg:#f5fafa}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter,sans-serif;background:var(--bg);color:#1f2937}
.container{width:min(1200px,92%);margin:auto}
.header{    position: fixed;
    top: 0;
    width: 100%;
    padding: 10px 0;
    z-index: 9999;
    background: #ffffff;}
.nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* background: #ffffffcc; */
    /*padding: 10px 25px;*/
    border-radius: 18px;
    backdrop-filter: blur(14px);
}
.logo img {
    width: 150px;
    height: 70px;
    object-fit: cover;
}
nav a{text-decoration:none;color:var(--s);margin:0 14px}
.btn{background:var(--p);color:#fff;text-decoration:none;padding:14px 24px;border-radius:999px;font-weight:700}
.ghost{background:#fff;color:var(--s);border:1px solid #ddd}
.hero{min-height:105vh;display:flex;align-items:center;position:relative;overflow:hidden;background:linear-gradient(135deg,#f5fafa,#fff);    background-image: url(https://agilusbandra.com/wp-content/themes/clikthot/image/banner-7.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center center;}
    .glass h3 {
    font-size: 25px;
    margin-bottom: 10px;
}
.top div>h3 {
    font-size: 25px;
}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:center}
h1{font-family:Poppins,sans-serif;font-size:clamp(29px,6vw,40px);line-height:1.08;color:var(--s);margin:20px 0}
.badge{display:inline-block;background:#dff7f4;color:var(--p);padding:10px 18px;border-radius:999px;font-weight:700}
.hero p{font-size:18px;line-height:1.8}
.actions{margin:30px 0;display:flex;gap:16px}
.ticks{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;list-style:'✓ ';margin-left: 17px;}
.glass{background:#ffffffb5;backdrop-filter:blur(16px);padding:40px;border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.08)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);animation:f 8s infinite ease-in-out}
.b1{width:260px;height:260px;background:#6bc04855;left:-80px;top:-50px}
.b2{width:320px;height:320px;background:#009b8d40;right:-100px;bottom:-100px}
@keyframes f{50%{transform:translateY(-30px)}}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;padding-top:120px}nav{display:none}.actions{justify-content: center;}}





/************************************************ FOOTER ***********************************************/
/*====================================
FOOTER
====================================*/

.footer{

    background:#07171D;

    color:#B9C7CD;

    padding:90px 0 25px;

    position:relative;

}

.footer-grid{

    display:grid;

    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;

    gap:40px;

}

.footer h3{

    color:#fff;

    font-size:24px;

    margin-bottom:28px;

    position:relative;

    padding-left:18px;

}

.footer h3:before{

    content:"";

    position:absolute;

    left:0;

    top:3px;

    width:4px;

    height:28px;

    background:#00B39B;

    border-radius:20px;

}

.footer p{
    line-height: 1.7;
    margin-bottom: 22px;
    font-size: 13px;
    text-align: center;
    margin-top: 9px;

}

.footer ul{

    list-style:none;

    margin:0;

    padding:0;

}

.footer li{

    margin-bottom:14px;

}

.footer a{

    color:#fff;

    text-decoration:none;

    transition:.3s;

}

.footer a:hover{

    color:#00B39B;

    padding-left:6px;

}

.footer-contact li{

    display:flex;

    gap:12px;

    align-items:flex-start;

}

.footer-contact i{

    color:#00B39B;

    margin-top:5px;

}

.newsletter form{

    display:flex;

    margin-top:25px;

}

.newsletter input{

    flex:1;

    height:52px;

    border:none;

    outline:none;

    background:#18262C;

    color:#fff;

    padding:0 18px;

    border-radius:40px 0 0 40px;

}

.newsletter button{

    border:none;

    background:#00B39B;

    color:#fff;

    padding:0 28px;

    border-radius:0 40px 40px 0;

    cursor:pointer;

    font-weight:600;

    transition:.3s;

}

.newsletter button:hover{

    background:#6BC048;

}

.social-icons{

    display:flex;

    gap:12px;

    margin-top:30px;

}

.social-icons a{

    width:44px;

    height:44px;

    border-radius:50%;

    background:#18262C;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    transition:.3s;

}

.social-icons a:hover{

    background:#00B39B;

    transform:translateY(-5px);

}

.footer-bottom{

    margin-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, .08);
    padding-top: 15px;
    text-align: center;

}

.footer-links{

    margin-bottom:18px;

}

.footer-links a{

    margin:0 12px;

}

.scroll-top{

    position:absolute;

    right:35px;

    bottom:35px;

    width:55px;

    height:55px;

    border-radius:50%;

    background:#000;

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    transition:.3s;

}

.scroll-top:hover{
color: #000 !important;
    background:#6BC048;
padding-left:0  !important;
    transform:translateY(-6px);

}

@media(max-width:991px){

.footer-grid{

grid-template-columns:1fr 1fr;

}

}

@media(max-width:768px){
    .pswp__img {
    width: auto !important;
    margin: 0px auto;
    left: 10% !important;
    top: -17% !important;
    height: 500px !important;
}
    .header .logo{
        width: 80% !important;
    }
    .cards{
        grid-template-columns: repeat(1, 1fr) !important;
    }
    .header a.btn{
        display: none !important;
    }
    .logo img {
    width: 121px !important;
    height: 55px !important;
    object-fit: cover;
}
    .hero-content{
        text-align: center;
    }
    .hero-content h1{
                font-size: 36px !important;
        text-align: center !important;
    }
    .bandra-hero{
            padding: 0 0 111px !important;
    }
    .experience-card{
                width: 100%;
    }
.hero{
    background-image: unset;
}
.hero p, .badge {
    text-align: center;
}
.hero h1{
        text-align: center;
}
.ticks {
    grid-template-columns: repeat(1, 1fr);
    margin-left: 73px;
}
.glass {
    padding: 15px;
    margin-bottom: 20px;
    text-align: center;
}
.footer{

padding:70px 0 20px;

}

.footer-grid{

grid-template-columns:1fr;

gap:40px;

}

.newsletter form{

flex-direction:column;

gap:15px;

}

.newsletter input,
.newsletter button{

border-radius:50px;

width:100%;

}

.footer-links a{

display:inline-block;

margin:8px;

}

.scroll-top{

right:20px;

bottom:20px;

}

}