:root{

    --primary-color: #C58156;
    --primary-dark: #A56B47;
    --primary-light: #E8D3C3;

    --heading-color: #1D1D1D;
    --text-color: #555555;

    --bg-light: #FAF8F4;
    --bg-white: #FFFFFF;

    --border-color: #E5DDD6;

    --gold-accent: #D6A574;

}


.form-box input:focus,
.form-box select:focus,
.contact-form-box input:focus,
.contact-form-box select:focus,
.contact-form-box textarea:focus{

    border-color:#C58156;
    outline:none;

    box-shadow:
    0 0 0 4px rgba(197,129,86,.12);

}

/* =========================
RESPONSIVE BASE
========================= */

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

img{
    max-width:100%;
    height:auto;
    display:block;
}

.container{
    width:100%;
    max-width:1400px;
    margin:auto;
    padding:0 20px;
}

section{
    overflow:hidden;
}


/* ===================================
HEADER
=================================== */

#header{

position: fixed;
top:0;
left:0;

width:100%;

z-index:9999;

background:rgba(255,255,255,.92);

backdrop-filter:blur(14px);

border-bottom:1px solid rgba(197,129,86,.08);

transition:.3s ease;

}

.container{

width:100%;
max-width:1400px;

margin:auto;

padding:0 40px;

}

.navbar{

display:flex;

align-items:center;

justify-content:space-between;

height:80px;

}

/* Logo */

.logo img{

height: 85px;
width:auto;

}

/* Menu */

.nav-menu{

display:flex;
align-items:center;

gap:35px;

list-style:none;

}

.nav-menu a{

color:#1D1D1D;

text-decoration:none;

font-size:15px;

font-weight:500;

transition:.3s;

}

.nav-menu a{
color:#C58156;
}

/* Actions */

.header-actions{

display:flex;
align-items:center;

gap:15px;

}

.whatsapp-btn{

width:45px;
height:45px;

border-radius:50%;

background:#25D366;

color:#fff;

display:flex;

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

text-decoration:none;

font-size:20px;

}

.call-btn{

background:#C58156;

color:#fff;

text-decoration:none;

padding:13px 22px;

border-radius:50px;

font-size:14px;

font-weight:600;

transition:.3s;

}

.call-btn{

background:#A56B47;

}

/* Mobile */

.menu-toggle{

display:none;

flex-direction:column;

gap:5px;

cursor:pointer;

}

.menu-toggle span{

width:28px;
height:2px;

background:#A56B47;

}

/* Mobile Menu */

.mobile-menu{

position:fixed;

top:0;
right:-100%;

width:320px;

height:100vh;

background:#fff;

z-index:99999;

transition:.4s;

padding:120px 40px;

}

.mobile-menu.active{

right:0;

}

.mobile-menu ul{

list-style:none;

}

.mobile-menu li{

margin-bottom:25px;

}

.mobile-menu a{

color:#A56B47;

text-decoration:none;

font-size:18px;

}

.mobile-cta{

margin-top:40px;

display:flex;

flex-direction:column;

gap:15px;

}

.mobile-cta a{

background:#C58156;

color:#fff;

text-align:center;

padding:14px;

border-radius:50px;

}

/* Responsive */

@media(max-width:1200px){

.nav-menu,
.header-actions{

    display:none;

}

.menu-toggle{

    display:flex;

}

}

@media(max-width:768px){

.container{

    padding:0 20px;

}

.navbar{

    height:80px;

}

.logo img{

    height:52px;

}

}


/* ===================================
HERO SECTION
=================================== */

#hero{

position:relative;

min-height:100vh;

display:flex;

align-items:center;

overflow:hidden;

}

.hero-bg{

position:absolute;

inset:0;

}

.hero-bg img{

width:100%;
height:100%;

object-fit:cover;

}

.hero-overlay{

position:absolute;

inset:0;

background:
linear-gradient(
rgba(0,0,0,.65),
rgba(0,0,0,.45)
);

}

.hero-content{

position:relative;

z-index:2;

display:grid;

grid-template-columns:1.2fr .8fr;

gap:80px;

align-items:center;

min-height:100vh;

padding-top:50px;

}

.hero-tag{

display:inline-block;

padding:10px 18px;

border:1px solid rgba(255,255,255,.3);

color:#fff;

margin-bottom:25px;

border-radius:50px;

}

.hero-left h1{

color:#fff;

font-size:78px;

line-height:1;

font-family:'Cormorant Garamond', serif;

margin-bottom:25px;

}

.hero-left h1 span{

display:block;

font-size:30px;

margin-top:15px;

color:#E8D3C3;

}

.hero-left p{

color:#fff;

font-size:18px;

line-height:1.8;

max-width:700px;

margin-bottom:30px;

}

.hero-badges{

display:flex;

flex-wrap:wrap;

gap:12px;

margin-bottom:35px;

}

.hero-badges span{

background:rgba(255,255,255,.12);

backdrop-filter:blur(10px);

color:#fff;

padding:10px 16px;

border-radius:50px;

}

.hero-cta{

display:flex;

gap:15px;

}

.primary-btn{

background:#C58156;

color:#fff;

padding:16px 30px;

border-radius:50px;

text-decoration:none;

}

.secondary-btn{

border:1px solid rgba(255,255,255,.4);

color:#fff;

padding:16px 30px;

border-radius:50px;

text-decoration:none;

}

.form-box{

background:rgba(255,255,255,.96);

padding:40px;

border-radius:20px;

}

.form-box h3{

text-align:center;

margin-bottom:25px;

}

.form-box form{

display:flex;

flex-direction:column;

gap:15px;

}

.form-box input,
.form-box select{

height:55px;

border:1px solid #ddd;

padding:0 15px;

border-radius:10px;

}

.form-box button{

height:55px;

background:#C58156;

border:none;

color:#fff;

border-radius:10px;

cursor:pointer;

}

.hero-strip{

position:absolute;

bottom:0;

width:100%;

z-index:3;

background:rgba(197, 129, 86, 0.527);

backdrop-filter:blur(10px);

}

.strip-grid{

display:grid;

grid-template-columns:repeat(5,1fr);

}

.strip-grid div{

padding:25px;

text-align:center;

}

.strip-grid small{

display:block;

color:#ffffff;

margin-bottom:5px;

}

.strip-grid strong{

color:#fff;

}

/* ===================================
WELCOME TO JOI
=================================== */

#welcome-joi{

padding:120px 0;

background:#FAF8F4;

}

.section-heading{

text-align:center;

max-width:1000px;

margin:auto;

}

.sub-heading{

color:#C58156;

text-transform:uppercase;

letter-spacing:3px;

font-size:13px;

font-weight:600;

}

.section-heading h2{

font-size:60px;

margin:20px 0;

color:#1D1D1D;

font-family:'Cormorant Garamond', serif;

}

.section-heading p{

font-size:18px;

line-height:1.9;

color:#555;

}

.joi-stats{

margin-top:80px;

display:grid;

grid-template-columns:repeat(6,1fr);

gap:25px;

}

.stat-box{

text-align:center;

background:#fff;

padding:40px 20px;

border-radius:16px;

border:1px solid #eee;

transition:.4s;

}

.stat-box{

transform:translateY(-8px);

border-color:#C58156;

}

.stat-box h3{

font-size:42px;

color:#C58156;

margin-bottom:10px;

font-family:'Cormorant Garamond', serif;

}

.stat-box span{

color:#555;

font-size:15px;

}

/* ===================================
ABOUT JOI
=================================== */

#about-joi{

padding:120px 0;

background:#ffffff;

}

.about-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

.section-tag{

color:#C58156;

font-size:14px;

font-weight:600;

text-transform:uppercase;

letter-spacing:3px;

}

.about-content h2{

font-size:64px;

line-height:1.1;

margin:20px 0 30px;

color:#1D1D1D;

font-family:'Cormorant Garamond', serif;

}

.about-content p{

color:#555;

font-size:17px;

line-height:1.9;

margin-bottom:20px;

}

.about-features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin:40px 0;

}

.feature{

display:flex;

align-items:center;

gap:12px;

}

.feature i{

color:#C58156;

font-size:18px;

}

.feature span{

color:#333;

font-weight:500;

}

.about-image{

position:relative;

}

.about-image img{

width:100%;

border-radius:24px;

display:block;

}

.about-image::before{

content:'';

position:absolute;

top:-20px;

left:-20px;

width:120px;

height:120px;

border:2px solid #C58156;

z-index:-1;

}

.about-image::after{

content:'';

position:absolute;

bottom:-20px;

right:-20px;

width:120px;

height:120px;

border:2px solid #C58156;

z-index:-1;

}

/* ===================================
JOI PHASES
=================================== */

#joi-phases{

padding:120px 0;

background:#FAF8F4;

}

.phase-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:40px;

margin-top:80px;

}

.phase-card{

background:#fff;

border-radius:24px;

overflow:hidden;

transition:.4s;

box-shadow:0 10px 40px rgba(0,0,0,.04);

}

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

.phase-image{

position:relative;

overflow:hidden;

}

.phase-image img{

width:100%;

height:380px;

object-fit:cover;

transition:.5s;

}

.phase-card img{

transform:scale(1.05);

}

.phase-status{

position:absolute;

top:25px;

left:25px;

padding:10px 18px;

border-radius:50px;

color:#fff;

font-size:13px;

font-weight:600;

}

.ready{

background:#2E8B57;

}

.upcoming{

background:#C58156;

}

.phase-content{

padding:40px;

}

.phase-content h3{

font-size:42px;

margin-bottom:20px;

font-family:'Cormorant Garamond', serif;

}

.phase-content p{

color:#555;

line-height:1.8;

margin-bottom:25px;

}

.phase-content ul{

list-style:none;

}

.phase-content li{

padding:12px 0;

border-bottom:1px solid #eee;

}

.phase-content li::before{

content:"✓";

color:#C58156;

margin-right:10px;

}

.phase-footer{

margin-top:30px;

display:flex;

justify-content:space-between;

align-items:center;

}

.phase-price{

font-weight:700;

color:#C58156;

}

.phase-footer a{

background:#C58156;

color:#fff;

text-decoration:none;

padding:14px 22px;

border-radius:50px;

}


/* ===================================
RESALE & RENTAL
=================================== */

#resale-rental{

padding:120px 0;

background:#ffffff;

}

.resale-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

.resale-image{

overflow:hidden;

border-radius:24px;

}

.resale-image img{

width:100%;

/*height:700px;*/

object-fit:cover;

display:block;

}

.resale-content h2{

font-size:62px;

line-height:1.1;

margin:20px 0 30px;

font-family:'Cormorant Garamond', serif;

}

.resale-content p{

color:#555;

line-height:1.9;

margin-bottom:20px;

font-size:17px;

}

.inventory-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin:40px 0;

}

.inventory-box{

background:#FAF8F4;

padding:30px;

border-radius:18px;

border:1px solid #eee;

transition:.3s;

}

.inventory-box{

border-color:#C58156;

transform:translateY(-5px);

}

.inventory-box h3{

color:#1D1D1D;

margin-bottom:10px;

font-size:22px;

}

.inventory-box span{

color:#666;

font-size:14px;

}

.inventory-cta{

display:flex;

gap:15px;

margin-top:30px;

}

.outline-btn{

border:1px solid #C58156;

color:#C58156;

text-decoration:none;

padding:16px 28px;

border-radius:50px;

transition:.3s;

}

.outline-btn{

background:#C58156;

color:#fff;

}


/* ===================================
INVESTMENT
=================================== */

#investment{

padding:120px 0;

background:#FAF8F4;

}

.investment-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

margin-top:80px;

}

.investment-item{

display:flex;

gap:25px;

margin-bottom:35px;

}

.investment-icon{

min-width:70px;

width:70px;

height:70px;

border-radius:50%;

background:#C58156;

display:flex;

align-items:center;

justify-content:center;

color:#fff;

font-size:24px;

}

.investment-item h3{

font-size:24px;

margin-bottom:10px;

color:#1D1D1D;

}

.investment-item p{

color:#666;

line-height:1.8;

}

.investment-image{

overflow:hidden;

border-radius:24px;

}

.investment-image img{

width:100%;

height:700px;

object-fit:cover;

display:block;

}


/* ===================================
AMENITIES
=================================== */

#amenities{

padding:120px 0;

background:#ffffff;

}

.amenities-grid{

margin-top:80px;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.large-card{

grid-column:span 2;

grid-row:span 2;

}

.amenity-card{

position:relative;

overflow:hidden;

border-radius:24px;

min-height:320px;

}

.amenity-card img{

width:100%;

height:100%;

object-fit:cover;

transition:.6s;

}

.amenity-card img{

transform:scale(1.08);

}

.amenity-overlay{

position:absolute;

inset:0;

display:flex;

align-items:flex-end;

padding:30px;

background:linear-gradient(
transparent,
rgba(0,0,0,.75)
);

}

.amenity-overlay h3{

color:#fff;

font-size:28px;

line-height:1.2;

font-family:'Cormorant Garamond', serif;

}

.amenity-features{

margin-top:60px;

display:flex;

flex-wrap:wrap;

justify-content:center;

gap:15px;

}

.amenity-features span{

padding:14px 24px;

border-radius:50px;

background:#FAF8F4;

border:1px solid #E5DDD6;

color:#333;

font-weight:500;

transition:.3s;

}

.amenity-features span{

background:#C58156;

color:#fff;

border-color:#C58156;

}


/* ===================================
JOI CLUB
=================================== */

#clubhouse{

position:relative;

padding:140px 0;

background:#FAF8F4;

}

.club-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

.club-content h2{

font-size:68px;

line-height:1.1;

margin:20px 0 30px;

font-family:'Cormorant Garamond', serif;

color:#1D1D1D;

}

.club-content p{

font-size:17px;

color:#555;

line-height:1.9;

margin-bottom:20px;

}

.club-features{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin:40px 0;

}

.club-features div{

display:flex;

align-items:center;

gap:12px;

}

.club-features i{

color:#C58156;

font-size:20px;

}

.club-gallery{

display:flex;

flex-direction:column;

gap:20px;

}

.club-main-image img{

width:100%;

height:450px;

object-fit:cover;

border-radius:24px;

}

.club-small-images{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

}

.club-small-images img{

width:100%;

height:180px;

object-fit:cover;

border-radius:18px;

}


/* ===================================
FLOOR PLANS
=================================== */

#floor-plans{

padding:120px 0;

background:#ffffff;

}

.floor-tabs{

display:flex;

justify-content:center;

gap:15px;

margin:60px 0;

}

.tab-btn{

border:none;

background:#F3ECE7;

padding:16px 30px;

border-radius:50px;

cursor:pointer;

font-weight:600;

color:#555;

transition:.3s;

}

.tab-btn.active{

background:#C58156;

color:#fff;

}

.floor-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:35px;

}

.floor-card{

background:#fff;

border-radius:24px;

overflow:hidden;

box-shadow:0 10px 40px rgba(0,0,0,.05);

transition:.3s;

}

.floor-card{

transform:translateY(-8px);

}

.floor-card img{

width:100%;

/*height:450px;*/

object-fit:cover;

}

.floor-content{

padding:30px;

}

.floor-content h3{

font-size:34px;

margin-bottom:10px;

font-family:'Cormorant Garamond', serif;

}

.floor-content span{

color:#C58156;

font-weight:700;

display:block;

margin-bottom:20px;

}

.floor-content a{

display:inline-block;

text-decoration:none;

color:#fff;

background:#C58156;

padding:14px 22px;

border-radius:50px;

}

.floor-cta{

margin-top:80px;

text-align:center;

background:#FAF8F4;

padding:60px;

border-radius:30px;

}

.floor-cta h3{

font-size:42px;

margin-bottom:15px;

font-family:'Cormorant Garamond', serif;

}

.floor-cta p{

max-width:700px;

margin:auto;

margin-bottom:30px;

color:#666;

}


/* ===================================
GALLERY
=================================== */

#gallery{

padding:120px 0;

background:#FAF8F4;

}

.gallery-filter{

display:flex;

justify-content:center;

flex-wrap:wrap;

gap:15px;

margin:60px 0;

}

.gallery-filter button{

border:none;

background:#fff;

padding:14px 26px;

border-radius:50px;

cursor:pointer;

transition:.3s;

}

.gallery-filter button.active{

background:#C58156;

color:#fff;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

}

.gallery-item{

overflow:hidden;

border-radius:24px;

cursor:pointer;

}

.gallery-item.large{

grid-column:span 2;

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

display:block;

transition:.6s;

}

.gallery-item img{

transform:scale(1.08);

}

.gallery-cta{

margin-top:60px;

text-align:center;

}


/* ===================================
LOCATION
=================================== */

#location{

padding:120px 0;

background:#ffffff;

}

.location-grid{

display:grid;

grid-template-columns:1.1fr .9fr;

gap:70px;

align-items:center;

margin-top:80px;

}

.location-map{

overflow:hidden;

border-radius:24px;

}

.location-map img{

width:100%;

display:block;

}

.location-content{

display:grid;

gap:20px;

}

.location-card{

display:flex;

align-items:center;

gap:20px;

background:#FAF8F4;

padding:24px;

border-radius:18px;

transition:.3s;

}

.location-card{

transform:translateX(8px);

border-left:4px solid #C58156;

}

.location-card i{

width:60px;

height:60px;

background:#C58156;

color:#fff;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:22px;

}

.location-card h3{

color:#1D1D1D;

margin-bottom:4px;

}

.location-card span{

color:#666;

}

.location-cta{

margin-top:20px;

}



/* ===================================
TESTIMONIALS
=================================== */

#testimonials{

padding:120px 0;

background:#FAF8F4;

}

.testimonial-grid{

margin-top:80px;

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.testimonial-card{

background:#fff;

padding:40px;

border-radius:24px;

box-shadow:0 10px 30px rgba(0,0,0,.04);

transition:.3s;

}

.testimonial-card{

transform:translateY(-8px);

}

.quote-icon{

color:#C58156;

font-size:30px;

margin-bottom:20px;

}

.testimonial-card p{

color:#555;

line-height:1.9;

margin-bottom:30px;

}

.client-info{

display:flex;

align-items:center;

gap:15px;

}

.client-info img{

width:65px;

height:65px;

border-radius:50%;

object-fit:cover;

}

.client-info h4{

margin-bottom:4px;

color:#1D1D1D;

}

.client-info span{

color:#777;

font-size:14px;

}

.testimonial-video{

margin-top:80px;

}

.video-box{

text-align:center;

background:#fff;

padding:70px;

border-radius:30px;

}

.video-box h3{

font-size:48px;

margin-bottom:20px;

font-family:'Cormorant Garamond', serif;

}

.video-box p{

max-width:700px;

margin:auto;

margin-bottom:30px;

color:#666;

line-height:1.8;

}


/* ===================================
FAQ
=================================== */

#faq{

padding:120px 0;

background:#ffffff;

}

.faq-wrapper{

max-width:1000px;

margin:80px auto 0;

}

.faq-item{

border-bottom:1px solid #E5DDD6;

padding:20px 0;

}

.faq-question{

width:100%;

background:none;

border:none;

text-align:left;

display:flex;

justify-content:space-between;

align-items:center;

cursor:pointer;

font-size:22px;

font-weight:600;

color:#1D1D1D;

padding:15px 0;

}

.faq-question span{

color:#C58156;

font-size:30px;

}

.faq-answer{

display:none;

color:#666;

line-height:1.9;

padding:10px 0 20px;

}

.faq-item.active .faq-answer{

display:block;

}




/* ===================================
CONTACT
=================================== */

#contact{

position:relative;

padding:140px 0;

background:url('../img/contact/contact-bg.webp');

background-size:cover;

background-position:center;

}

.contact-overlay{

position:absolute;

inset:0;

background:rgba(0,0,0,.72);

}

.contact-grid{

position:relative;

z-index:2;

display:grid;

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

gap:80px;

align-items:center;

}

.contact-content{

color:#fff;

}

.contact-content h2{

font-size:72px;

line-height:1.05;

margin:20px 0 30px;

font-family:'Cormorant Garamond', serif;

}

.contact-content p{

max-width:650px;

font-size:18px;

line-height:1.9;

margin-bottom:40px;

}

.contact-highlights{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

margin-bottom:40px;

}

.contact-highlights div{

display:flex;

gap:12px;

align-items:center;

}

.contact-highlights i{

color:#C58156;

}

.contact-details{

display:flex;

gap:25px;

flex-wrap:wrap;

}

.contact-details a{

color:#fff;

text-decoration:none;

font-weight:600;

}

.contact-form-box{

background:#fff;

padding:45px;

border-radius:24px;

}

.contact-form-box h3{

margin-bottom:25px;

font-size:32px;

font-family:'Cormorant Garamond', serif;

}

.contact-form-box form{

display:flex;

flex-direction:column;

gap:15px;

}

.contact-form-box input,
.contact-form-box select,
.contact-form-box textarea{

width:100%;

border:1px solid #ddd;

border-radius:12px;

padding:15px;

font-size:15px;

}

.contact-form-box button{

border:none;

background:#C58156;

color:#fff;

height:58px;

border-radius:12px;

cursor:pointer;

font-weight:600;

}





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

#footer{

background:#161616;

padding:100px 0 40px;

position:relative;

overflow:hidden;

}

#footer::before{

content:'';

position:absolute;

top:0;
left:50%;

transform:translateX(-50%);

width:150px;
height:2px;

background:#C58156;

}

.footer-top{

text-align:center;

max-width:800px;

margin:auto;
justify-content: center;

}

.footer-top img{

height:80px;

width:auto;

margin-bottom:25px;

}

.footer-top h3{

color:#fff;

font-size:42px;

margin-bottom:20px;

font-family:'Cormorant Garamond', serif;

}

.footer-top p{

color:#BDBDBD;

line-height:1.9;

max-width:650px;

margin:auto;

}

/* Contact */

.footer-contact{

display:flex;

justify-content:center;

gap:20px;

margin:50px 0;

flex-wrap:wrap;

}

.footer-contact a{

text-decoration:none;

color:#fff;

padding:14px 28px;

border:1px solid rgba(255,255,255,.1);

border-radius:50px;

transition:.3s;

}

.footer-contact a{

background:#C58156;

border-color:#C58156;

}

/* Links */

.footer-links{

display:flex;

justify-content:center;

flex-wrap:wrap;

gap:30px;

margin-bottom:70px;

}

.footer-links a{

color:#CFCFCF;

text-decoration:none;

transition:.3s;

}

.footer-links a{

color:#C58156;

}

/* RERA Section */

.footer-rera{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

margin-bottom:60px;

}

.rera-box{

background:rgba(255,255,255,.03);

border:1px solid rgba(255,255,255,.08);

padding:35px 30px;

border-radius:20px;

text-align:center;

transition:.3s;

}

.rera-box{

border-color:#C58156;

transform:translateY(-5px);

}

.rera-box h4{

color:#C58156;

margin-bottom:12px;

font-size:14px;

text-transform:uppercase;

letter-spacing:2px;

}

.rera-box p{

color:#fff;

font-size:16px;

font-weight:600;

line-height:1.6;

}

/* RERA Link */

.rera-link{

text-align:center;

margin-bottom:50px;

}

.rera-link a{

color:#C58156;

text-decoration:none;

}

/* Disclaimer */

.footer-disclaimer{

max-width:1100px;

margin:auto;

padding-top:50px;

border-top:1px solid rgba(255,255,255,.08);

}

.footer-disclaimer p{

color:#9B9B9B;

font-size:13px;

line-height:1.9;

text-align:center;

margin-bottom:15px;

}

/* Copyright */

.copyright{

margin-top:40px;

text-align:center;

color:#777;

font-size:14px;

}

/* Mobile */

@media(max-width:991px){

.footer-rera{

    grid-template-columns:1fr;

}

.footer-top h3{

    font-size:34px;

}

}

@media(max-width:768px){

#footer{

    padding:80px 0 30px;

}

.footer-contact{

    flex-direction:column;

}

.footer-contact a{

    text-align:center;

}

}






@media (max-width:1024px){

.container{
    padding:0 30px;
}

.hero-content,
.about-grid,
.resale-grid,
.investment-grid,
.location-grid,
.contact-grid,
.club-grid{
    grid-template-columns:1fr !important;
    gap:50px;
}

.phase-grid{
    grid-template-columns:repeat(2,1fr);
}

.floor-grid{
    grid-template-columns:repeat(2,1fr);
}

.gallery-grid{
    grid-template-columns:repeat(2,1fr);
}

.testimonial-grid{
    grid-template-columns:repeat(2,1fr);
}

.hero-left h1{
    font-size:54px;
    line-height:1.1;
}

.section-heading h2{
    font-size:42px;
}

}


@media (max-width:991px){

.nav-menu,
.header-actions{
    display:none;
}

.menu-toggle{
    display:flex;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
}

.menu-toggle span{
    width:28px;
    height:2px;
    background:#A56B47;
}

.mobile-menu{
    position:fixed;
    top:0;
    right:-100%;
    width:280px;
    height:100%;
    background:#111;
    z-index:99999;
    transition:.4s;
    padding:100px 30px;
    overflow-y:auto;
}

.mobile-menu.active{
    right:0;
}
}



@media (max-width:767px){

.container{
    padding:0 18px;
}

section{
    padding:70px 0;
}

.hero-content,
.about-grid,
.resale-grid,
.investment-grid,
.location-grid,
.contact-grid,
.club-grid{
    grid-template-columns:1fr !important;
}

.phase-grid,
.floor-grid,
.gallery-grid,
.testimonial-grid,
.joi-stats,
.amenities-grid{
    grid-template-columns:1fr !important;
}

.hero-left{
    text-align:center;
}

.hero-left h1{
    font-size:36px;
    line-height:1.15;
}

.hero-left p{
    font-size:15px;
}

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

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

.hero-cta a{
    width:100%;
    text-align:center;
}

.hero-form{
    width:100%;
}

.form-box{
    padding:25px;
}

.section-heading{
    text-align:center;
}

.section-heading h2{
    font-size:32px;
    line-height:1.2;
}

.section-heading p{
    font-size:15px;
}

.about-content,
.resale-content,
.contact-content{
    text-align:center;
}

.about-features{
    justify-content:center;
}

.inventory-grid{
    grid-template-columns:1fr;
}

.club-small-images{
    grid-template-columns:1fr;
}

.location-content{
    grid-template-columns:1fr;
}

.footer-rera{
    grid-template-columns:1fr;
    gap:20px;
}

.footer-contact{
    flex-direction:column;
    gap:15px;
}

.footer-top h3{
    font-size:24px;
}

}

.hero-strip{
    overflow-x:auto;
}

.strip-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    min-width:900px;
}

@media(max-width:767px){

.strip-grid{
    min-width:750px;
}

}



.gallery-grid{
    display:grid;
    gap:20px;
}

.gallery-item img{
    width:100%;
    height:100%;
    object-fit:cover;
}

@media(max-width:767px){

.gallery-filter{
    overflow-x:auto;
    white-space:nowrap;
    padding-bottom:10px;
}

.gallery-filter button{
    display:inline-block;
}

}

@media(max-width:767px){

.large-card{
    grid-column:auto !important;
    grid-row:auto !important;
}

.amenity-card{
    height:280px;
}

.amenity-card img{
    height:100%;
    object-fit:cover;
}

}



.floor-card img{
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover;
}





@media(max-width:767px){

.contact-form-box{
    padding:25px;
}

.contact-form-box input,
.contact-form-box textarea,
.contact-form-box select{
    width:100%;
    font-size:16px;
}

.contact-form-box button{
    width:100%;
}

}



.gallery-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
}

@media(max-width:768px){

.gallery-grid{
    grid-template-columns:1fr;
}

}



.mobile-bottom-bar{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    display:none;
    z-index:99999;
    background:#A56B47;
}

.mobile-bottom-bar a{
    flex:1;
    text-align:center;
    padding:16px;
    color:#fff;
    font-weight:600;
    text-decoration:none;
}

.mobile-bottom-bar a:first-child{
    background:#A56B47;
}

.mobile-bottom-bar a:last-child{
    background:#25D366;
}

@media(max-width:991px){

.mobile-bottom-bar{
    display:flex;
}

body{
    padding-bottom:60px;
}

}



/* ===================================
GLOBAL HOVER EFFECTS
=================================== */

/* Smooth Transition */

a,
button,
.phase-card,
.stat-box,
.inventory-box,
.floor-card,
.testimonial-card,
.location-card,
.rera-box,
.amenity-card,
img{
    transition:all .35s ease;
}


/* NAV MENU */

.nav-menu a:hover{
    color:#C58156;
}


/* BUTTONS */

.primary-btn:hover,
.call-btn:hover,
.phase-footer a:hover,
.floor-content a:hover,
.contact-form-box button:hover{

    background:#A56B47;
    transform:translateY(-3px);
    box-shadow:0 10px 25px rgba(197,129,86,.25);

}

.secondary-btn:hover{

    background:#fff;
    color:#1D1D1D;

}

.outline-btn:hover{

    background:#C58156;
    color:#fff;

}


/* WHATSAPP */

.whatsapp-btn:hover{

    transform:scale(1.08);

}


/* HERO BADGES */

.hero-badges span:hover{

    background:#C58156;

}


/* STAT BOX */

.stat-box:hover{

    transform:translateY(-10px);
    border-color:#C58156;
    box-shadow:0 15px 35px rgba(0,0,0,.08);

}


/* PHASE CARD */

.phase-card:hover{

    transform:translateY(-12px);
    box-shadow:0 20px 50px rgba(0,0,0,.12);

}

.phase-card:hover img{

    transform:scale(1.08);

}


/* INVENTORY BOX */

.inventory-box:hover{

    transform:translateY(-8px);
    border-color:#C58156;
    background:#fff;

}


/* AMENITIES */

.amenity-card:hover img{

    transform:scale(1.12);

}

.amenity-card:hover .amenity-overlay{

    background:linear-gradient(
        transparent,
        rgba(0,0,0,.85)
    );

}


/* AMENITY TAGS */

.amenity-features span:hover{

    background:#C58156;
    color:#fff;
    transform:translateY(-3px);

}


/* FLOOR CARD */

.floor-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 50px rgba(0,0,0,.12);

}

.floor-card:hover img{

    transform:scale(1.05);

}


/* GALLERY */

.gallery-item:hover img{

    transform:scale(1.12);

}


/* LOCATION */

.location-card:hover{

    transform:translateX(10px);
    background:#fff;
    box-shadow:0 10px 30px rgba(0,0,0,.08);

}


/* TESTIMONIAL */

.testimonial-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.10);

}


/* FAQ */

.faq-question:hover{

    color:#C58156;

}


/* FORM FIELDS */

.form-box input:focus,
.form-box select:focus,
.contact-form-box input:focus,
.contact-form-box select:focus,
.contact-form-box textarea:focus{

    border-color:#C58156;
    outline:none;
    box-shadow:0 0 0 4px rgba(197,129,86,.12);

}


/* FOOTER */

.footer-contact a:hover{

    background:#C58156;
    border-color:#C58156;
    transform:translateY(-3px);

}

.footer-links a:hover{

    color:#C58156;

}

.rera-box:hover{

    transform:translateY(-8px);
    border-color:#C58156;
    background:rgba(255,255,255,.05);

}


/* IMAGES */

.about-image img:hover,
.resale-image img:hover,
.investment-image img:hover,
.location-map img:hover,
.club-main-image img:hover,
.club-small-images img:hover{

    transform:scale(1.04);

}


/* MOBILE BOTTOM BAR */

.mobile-bottom-bar a:hover{

    opacity:.92;

}


.primary-btn,
.call-btn,
.floor-content a,
.phase-footer a{

    position:relative;
    overflow:hidden;

}

.primary-btn::before,
.call-btn::before,
.floor-content a::before,
.phase-footer a::before{

    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:rgba(255,255,255,.15);
    transition:.5s;

}

.primary-btn:hover::before,
.call-btn:hover::before,
.floor-content a:hover::before,
.phase-footer a:hover::before{

    left:100%;

}