/*==================================================
            LAPTOP (1200px)
==================================================*/

@media (max-width:1200px){

.container{
    width:92%;
}

.hero-content h1{
    font-size:68px;
}

.about-container,
.founder-container{
    gap:50px;
}

.property-grid,
.projects-grid,
.gallery-grid,
.testimonial-grid{
    gap:25px;
}

}

/*==================================================
            TABLET (991px)
==================================================*/

@media (max-width:991px){

.header .container{
    height:80px;
}

.menu-btn{
    display:block;
    color:#fff;
    font-size:30px;
}

.call-btn{
    display:none;
}

.navbar{
    position:fixed;
    top:80px;
    left:-100%;
    width:100%;
    background:#111;
    transition:.4s;
    padding:30px 0;
}

.navbar.active{
    left:0;
}

.navbar ul{
    flex-direction:column;
    text-align:center;
    gap:25px;
}

.hero{
    height:auto;
    min-height:100vh;
    padding:170px 0 280px;
}

.hero-content{
    text-align:center;
    margin:auto;
}

.hero-content h1{
    font-size:56px;
}

.hero-content p{
    margin:auto auto 35px;
}

.hero-buttons{
    justify-content:center;
}

.hero-search{
    position:relative;
    left:auto;
    bottom:auto;
    transform:none;
    width:100%;
    margin-top:60px;
    grid-template-columns:1fr 1fr;
}

.about-container,
.founder-container{
    grid-template-columns:1fr;
}

.property-grid,
.projects-grid,
.why-grid,
.gallery-grid,
.testimonial-grid,
.footer-grid,
.stats-grid{
    grid-template-columns:repeat(2,1fr);
}

.founder-image{
    max-width:500px;
    margin:auto;
}

.section-title h2,
.about-content h2,
.founder-content h2,
.cta h2{
    font-size:42px;
}

}
/*==================================================
                MOBILE (768px)
==================================================*/

@media (max-width:768px){

.hero{
    padding:140px 0 220px;
}

.hero-content h1{
    font-size:42px;
    line-height:1.2;
}

.hero-content p{
    font-size:16px;
}

.hero-tag{
    font-size:13px;
    padding:10px 18px;
}

.hero-buttons{
    flex-direction:column;
    gap:15px;
}

.btn{
    width:100%;
    justify-content:center;
}

.hero-search{
    grid-template-columns:1fr;
    padding:20px;
}

.about,
.founder,
.properties,
.projects,
.why-us,
.stats,
.banks,
.testimonials,
.gallery,
.faq,
.cta{
    padding:80px 0;
}

.property-grid,
.projects-grid,
.why-grid,
.gallery-grid,
.testimonial-grid,
.footer-grid,
.stats-grid{
    grid-template-columns:1fr;
}

.about-content h2,
.founder-content h2,
.section-title h2,
.cta h2{
    font-size:34px;
}

.experience-box{
    position:relative;
    right:0;
    bottom:0;
    margin-top:20px;
}

.founder-stats{
    grid-template-columns:1fr;
}

.footer{
    text-align:center;
}

.footer-logo{
    margin:0 auto 20px;
}

.whatsapp-btn,
.call-float{
    width:55px;
    height:55px;
    font-size:22px;
}

}

/*==================================================
                SMALL MOBILE (576px)
==================================================*/

@media (max-width:576px){

.container{
    width:94%;
}

.header .container{
    height:70px;
}

.logo img{
    height:45px;
}

.hero{
    min-height:auto;
    padding:120px 0 180px;
}

.hero-content h1{
    font-size:32px;
}

.hero-content p{
    font-size:15px;
    line-height:1.7;
}

.section-title h2,
.about-content h2,
.founder-content h2,
.cta h2{
    font-size:28px;
}

.property-image img,
.gallery-item img{
    height:230px;
}

.project-card img{
    height:320px;
}

.scroll-indicator{
    display:none;
}

.hero-search{
    gap:15px;
}

.search-item select{
    padding:14px;
}

.stat-box h2{
    font-size:40px;
}

.property-content h3{
    font-size:22px;
}

.property-bottom{
    flex-direction:column;
    align-items:flex-start;
    gap:15px;
}

.view-btn{
    width:100%;
    text-align:center;
}

.whatsapp-btn{
    right:15px;
    bottom:15px;
}

.call-float{
    right:15px;
    bottom:85px;
}

}