/* ===============================
   1. GLOBAL RESET & BASE STYLES
================================ */

*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial, Helvetica, sans-serif;
}

.container{
width:90%;
max-width:1200px;
margin:auto;
}

/* ===============================
   2. HEADER / NAVBAR
================================ */

.site-header{
    background:#ffffff;
    box-shadow:0 2px 10px rgba(0,0,0,0.05);
    position:sticky;
    top:0;
    z-index:1000;
}

.nav-container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:15px 0;
}

.logo img{
    max-height:60px;
}

.main-nav ul{
    display:flex;
    list-style:none;
    gap:30px;
}

.main-nav a{
    text-decoration:none;
    font-size:16px;
    font-weight:500;
    color:#333;
    transition:0.3s;
}

.main-nav a:hover{
    color:#caa45f;
}

.contact-btn{
    background:#caa45f;
    color:white;
    padding:10px 20px;
    border-radius:4px;
}

.contact-btn:hover{
    background:#b8934e;
}

.menu-toggle{
    display:none;
    font-size:28px;
    background:none;
    border:none;
    cursor:pointer;
}

@media(max-width:900px){

.main-nav{
    position:absolute;
    top:80px;
    left:0;
    width:100%;
    background:white;
    display:none;
}

.main-nav ul{
    flex-direction:column;
    padding:20px;
}

.menu-toggle{
    display:block;
}

.main-nav.active{
    display:block;
}

}

/* ===============================
   3. HERO SECTION / CAROUSEL
================================ */

/* HERO SECTION */

.hero{
width:100%;
height:90vh;
position:relative;
overflow:hidden;
}

.hero-slider{
width:100%;
height:100%;
position:relative;
}

.slides{
display:flex;
width:100%;
height:100%;
transition:transform 0.6s ease;
}

.slide{
min-width:100%;
height:100%;
position:relative;
}

.slide img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}

/* Dark overlay */
.slide::after{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.45);
}
/* Hero text */

.hero-text{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
color:white;
z-index:2;
max-width:700px;
}

.hero-text h1{
font-size:48px;
margin-bottom:10px;
}

.hero-text h2{
font-size:40px;
margin-bottom:10px;
}

.hero-text p{
font-size:18px;
margin-bottom:20px;
}

/* Buttons */

.btn{
background:#c89b3c;
color:white;
padding:12px 25px;
text-decoration:none;
border-radius:4px;
}

/* Slider arrows */

.prev,.next{
position:absolute;
top:50%;
transform:translateY(-50%);
font-size:30px;
background:rgba(0,0,0,0.5);
color:white;
border:none;
padding:10px 15px;
cursor:pointer;
z-index:5;
}

.prev{
left:20px;
}

.next{
right:20px;
}

/* ===============================
   4. SERVICES SECTION
================================ */
/* SERVICES SECTION */

/* SERVICES SECTION */

.services{
padding:70px 0;
text-align:center;
}

.services h2{
font-size:32px;
margin-bottom:10px;
}

.section-intro{
max-width:750px;
margin:auto;
margin-bottom:40px;
color:#555;
line-height:1.6;
}

/* GRID */

.service-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:25px;
}

/* CARD */

.service-card{
background:white;
border-radius:8px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.08);
transition:0.3s;
text-align:left;
}

.service-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.15);
}

/* IMAGE */

.service-card img{
width:100%;
height:200px;
object-fit:cover;
}

/* CONTENT */

.service-content{
padding:20px;
}

.service-content h3{
color:#c89b3c;
margin-bottom:10px;
font-size:20px;
}

.service-content p{
color:#555;
line-height:1.6;
font-size:15px;
}

/* ===============================
   5. WHY CHOOSE US
================================ */

.why-choose{
    background:#fa7d09;
    padding:80px 20px;
    text-align:center;
    color:white;
}

.section-title{
    font-size:36px;
    margin-bottom:60px;
    font-weight:600;
}

.stats-container{
    display:flex;
    justify-content:center;
    gap:80px;
    flex-wrap:wrap;
}

.stat-box h3{
    font-size:48px;
    font-weight:700;
    margin-bottom:10px;
}

.stat-box p{
    font-size:16px;
    opacity:0.9;
}

@media(max-width:768px){

.section-title{
    font-size:28px;
}

.stats-container{
    gap:40px;
}

.stat-box h3{
    font-size:36px;
}

}
/* ===============================
   6. PORTFOLIO / PROJECTS
================================ */

.portfolio{
padding:60px 0;
}

.portfolio-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin-top:30px;
}

.portfolio-item{
height:200px;
background:#ddd;
border-radius:5px;
}

/* ===============================
   7. SERVICE AREAS
================================ */

.areas{
padding:80px 5%;
background:#f9f9f9;
text-align:center;
}

.areas h2{
font-size:32px;
margin-bottom:15px;
}

.areas-desc{
max-width:700px;
margin:auto;
margin-bottom:40px;
color:#666;
}

.areas-grid{
display:flex;
flex-wrap:wrap;
gap:15px;
justify-content:center;
}

.areas-grid a{
padding:10px 18px;
background:white;
border-radius:25px;
text-decoration:none;
color:#333;
border:1px solid #ddd;
transition:0.3s;
font-size:14px;
}

.areas-grid a:hover{
background:#fd9308;
color:white;
border-color:#f77b08;
}
/* ===============================
   8. CALL TO ACTION
================================ */

.cta-premium{
position:relative;
padding:120px 20px;
text-align:center;
color:white;
background:url('images/interior-bg.jpg') center/cover no-repeat;
overflow:hidden;
}

.cta-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
}

.cta-content{
position:relative;
max-width:800px;
margin:auto;
z-index:2;
}

.cta-content h2{
font-size:42px;
margin-bottom:20px;
font-weight:700;
}

.cta-content p{
font-size:18px;
margin-bottom:35px;
line-height:1.6;
}

.cta-buttons{
display:flex;
justify-content:center;
gap:20px;
flex-wrap:wrap;
}

.cta-btn{
padding:16px 32px;
border-radius:40px;
font-size:16px;
text-decoration:none;
font-weight:600;
transition:0.3s;
}

.primary-btn{
background:#caa45f;
color:white;
}

.primary-btn:hover{
background:#b8934e;
}

.secondary-btn{
border:2px solid white;
color:white;
}

.secondary-btn:hover{
background:white;
color:#333;
}
.call-btn{
background:#2d7a5f;
color:white;
padding:16px 32px;
border-radius:40px;
text-decoration:none;
font-weight:600;
}

.call-btn:hover{
background:#1f5d47;
}
.whatsapp-btn{
background:#25D366;
color:white;
padding:16px 32px;
border-radius:40px;
text-decoration:none;
font-weight:600;
display:inline-block;
transition:0.3s;
}

.whatsapp-btn:hover{
background:#1ebe5d;
}
/* ===============================
   9. FOOTER
================================ */

.footer{
background:#111;
color:#ddd;
padding:80px 5% 30px;
}

.footer-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:40px;
margin-bottom:40px;
}

.footer-col h3{
color:white;
margin-bottom:15px;
}

.footer-col h4{
color:white;
margin-bottom:15px;
}

.footer-col p{
font-size:14px;
line-height:1.6;
}

.footer-col ul{
list-style:none;
padding:0;
}

.footer-col ul li{
margin-bottom:8px;
}

.footer-col ul li a{
color:#ccc;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.footer-col ul li a:hover{
color:#caa45f;
}

.footer-map{
margin-top:30px;
border-radius:8px;
overflow:hidden;
}

.footer-bottom{
text-align:center;
border-top:1px solid #333;
padding-top:20px;
margin-top:30px;
font-size:14px;
}
.footer-logo{
width:160px;
margin-bottom:15px;
}

.footer-brand h3{
margin-top:5px;
color:white;
}

/* ===============================
   10. MOBILE RESPONSIVE
================================ */

@media(max-width:768px){

.nav-links{
display:none;
flex-direction:column;
background:#111;
position:absolute;
top:70px;
right:0;
width:200px;
padding:20px;
}

.nav-links.active{
display:flex;
}

.menu-toggle{
display:block;
}

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

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

}


/* HERO FORM */

.lead-form{
position:absolute;
right:80px;
top:50%;
transform:translateY(-50%);
background:white;
padding:35px;
border-radius:12px;
width:340px;
box-shadow:0 10px 30px rgba(0,0,0,0.25);
z-index:10;
}

.lead-form h2{
font-size:24px;
margin-bottom:20px;
color:#333;
}

.lead-form input{
width:100%;
padding:12px;
margin-bottom:15px;
border:1px solid #ddd;
border-radius:6px;
font-size:14px;
}

.whatsapp-check{
font-size:14px;
display:flex;
align-items:center;
gap:8px;
margin-bottom:20px;
}

.lead-form button{
width:100%;
padding:14px;
background:#e75858;
color:white;
border:none;
border-radius:30px;
font-size:16px;
cursor:pointer;
}

.form-note{
font-size:12px;
margin-top:15px;
color:#777;
}
@media(max-width:768px){

.lead-form{
position:relative;
right:auto;
top:auto;
transform:none;
margin:30px auto;
width:90%;
}

}


/*steps*/

/* STEPS SECTION */

/* DREAM HOME PROCESS */
/* SECTION BACKGROUND */

.steps-section{
padding:80px 20px;
background:#f7f7f7;
}

/* GOLD OUTER BORDER */

.steps-wrapper{
border:3px solid #c89b3c;
border-radius:15px;
padding:60px 40px;
background:white;
}

/* TITLE */

.steps-title{
text-align:center;
font-size:34px;
margin-bottom:50px;
}

/* GRID */

.steps-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;
}

/* CARD */

.step-card{
background:#fafafa;
padding:30px;
border-radius:10px;
text-align:center;
transition:0.3s;
}

.step-card:hover{
transform:translateY(-8px);
box-shadow:0 10px 30px rgba(0,0,0,0.1);
}
.step-card{
position:relative;
background:#fafafa;
padding:30px;
border-radius:10px;
text-align:center;
transition:0.3s;
overflow:hidden;
z-index:1;
}

/* GOLD THUNDER BORDER */

.step-card::before{
content:"";
position:absolute;
inset:-2px;
border-radius:12px;
background:linear-gradient(
120deg,
#c89b3c,
#ffd700,
#c89b3c,
#fff3b0,
#c89b3c
);
background-size:300% 300%;
z-index:-1;
animation:goldThunder 3s linear infinite;
}

.step-card::after{
content:"";
position:absolute;
inset:2px;
background:#fafafa;
border-radius:10px;
z-index:-1;
}

@keyframes goldThunder{
0%{
background-position:0% 50%;
}
50%{
background-position:100% 50%;
}
100%{
background-position:0% 50%;
}
}

.step-card:hover{
transform:translateY(-8px);
box-shadow:0 10px 30px rgba(0,0,0,0.1);
}
/* BUTTON */

.steps-cta{
text-align:center;
margin-top:40px;
}

.steps-cta button{
background:#c89b3c;
color:white;
padding:14px 35px;
border:none;
border-radius:30px;
cursor:pointer;
font-size:16px;
}

/* MOBILE */

@media(max-width:768px){

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

}

/* POPUP FORM */

.popup-form{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
justify-content:center;
align-items:center;
}

.popup-content{
background:white;
padding:40px;
border-radius:10px;
width:350px;
position:relative;
}

.popup-content input{
width:100%;
padding:12px;
margin-bottom:15px;
border:1px solid #ccc;
border-radius:5px;
}

.popup-content button{
width:100%;
padding:12px;
background:#e74c3c;
color:white;
border:none;
border-radius:25px;
}

.close-btn{
position:absolute;
top:10px;
right:15px;
font-size:22px;
cursor:pointer;
}

.step-icon{
  font-size:40px;
  color:#c89b3c; /* gold color */
  margin-bottom:20px;
  transition:0.3s;
}

.step-card:hover .step-icon{
  color:#ffd700; /* brighter gold on hover */
  transform:scale(1.2);
}



/*jj*/

.reasons-section{
  padding:80px 20px;
  background:#f7f7f7;
}

.reasons-wrapper{
  border:3px solid #c89b3c;
  border-radius:15px;
  padding:60px 40px;
  background:white;
  text-align:center;
}

.reasons-title{
  font-size:32px;
  margin-bottom:50px;
}

.reasons-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}

.reason-card{
  background:#fafafa;
  padding:30px;
  border-radius:10px;
  text-align:center;
  position:relative;
  transition:0.3s;
  overflow:hidden;
}

.reason-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:12px;
  background:linear-gradient(
    120deg,
    #c89b3c,
    #ffd700,
    #c89b3c,
    #fff3b0,
    #c89b3c
  );
  background-size:300% 300%;
  z-index:-1;
  animation:goldThunder 3s linear infinite;
}

.reason-card::after{
  content:"";
  position:absolute;
  inset:2px;
  background:#fafafa;
  border-radius:10px;
  z-index:-1;
}

.reason-card:hover{
  transform:translateY(-8px);
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

.reason-icon{
  font-size:40px;
  color:#c89b3c;
  margin-bottom:20px;
  transition:0.3s;
}

.reason-card:hover .reason-icon{
  color:#ffd700;
  transform:scale(1.2);
}

/* GOLD THUNDER ANIMATION */
@keyframes goldThunder{
  0%{ background-position:0% 50%; }
  50%{ background-position:100% 50%; }
  100%{ background-position:0% 50%; }
}

/* MOBILE */
@media(max-width:768px){
  .reasons-grid{
    grid-template-columns:1fr;
  }
}



/*kitchen section*/

.kitchen-section{
padding:60px 5%;
background:#f5f5f5;
text-align:center;
}

.kitchen-section h2{
font-size:32px;
margin-bottom:40px;
}

.slider-wrapper{
position:relative;
display:flex;
align-items:center;
}

.kitchen-container{
display:flex;
gap:25px;
overflow-x:auto;
scroll-behavior:smooth;
}

.kitchen-container::-webkit-scrollbar{
display:none;
}

.kitchen-card{
min-width:300px;
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
}

.kitchen-card img{
width:100%;
height:220px;
object-fit:cover;
}

.kitchen-card p{
padding:15px;
font-weight:500;
}

.slide-btn{
position:absolute;
top:40%;
background:#fff;
border:none;
font-size:28px;
cursor:pointer;
padding:10px 15px;
box-shadow:0 4px 10px rgba(0,0,0,0.2);
}

.left{
left:-10px;
}

.right{
right:-10px;
}

/*living room*/

.living-section{
padding:60px 5%;
background:#f5f5f5;
}

.living-section h2{
font-size:32px;
margin-bottom:40px;
}

.living-container{
display:flex;
gap:30px;
flex-wrap:wrap;
}

.living-card{
flex:1;
min-width:300px;
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
transition:0.3s;
}

.living-card:hover{
transform:translateY(-8px);
}

.living-card img{
width:100%;
height:260px;
object-fit:cover;
}

.living-card p{
padding:15px;
font-size:16px;
font-weight:500;
}

/*living room*/

.living-section{
padding:60px 5%;
background:#f5f5f5;
}

.living-section h2{
font-size:32px;
margin-bottom:40px;
}

.slider-wrapper{
position:relative;
display:flex;
align-items:center;
}

.living-container{
display:flex;
gap:25px;
overflow-x:auto;
scroll-behavior:smooth;
}

.living-container::-webkit-scrollbar{
display:none;
}

.living-card{
min-width:320px;
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
}

.living-card img{
width:100%;
height:230px;
object-fit:cover;
}

.living-card p{
padding:15px;
font-weight:500;
}

.slide-btn{
position:absolute;
top:40%;
background:#fff;
border:none;
font-size:28px;
cursor:pointer;
padding:10px 15px;
box-shadow:0 4px 10px rgba(0,0,0,0.2);
z-index:10;
}

.left{
left:-10px;
}

.right{
right:-10px;
}
.living-container{
display:flex;
gap:25px;
overflow-x:auto;
scroll-behavior:smooth;
flex-wrap:nowrap;   /* important */
}

.living-card{
min-width:300px;    /* card width */
flex:0 0 auto;      /* prevents shrinking */
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
}
/*Budget Cards Section*/

.budget-section{
padding:80px 5%;
background:#f7f7f7;
}

.budget-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:40px;
}

.quote-btn{
background:#ff5a5f;
color:white;
border:none;
padding:14px 28px;
border-radius:30px;
font-weight:600;
cursor:pointer;
}

.budget-cards{
display:flex;
gap:25px;
flex-wrap:wrap;
}

.budget-card{
position:relative;
overflow:hidden;
border-radius:12px;
cursor:pointer;
flex:1;
min-width:280px;
}

.budget-card img{
width:100%;
height:350px;
object-fit:cover;
}

.price-tag{
position:absolute;
top:15px;
left:15px;
background:#5e4968;
color:white;
padding:8px 15px;
border-radius:20px;
font-size:14px;
}

.card-title{
position:absolute;
bottom:15px;
left:15px;
color:white;
font-size:20px;
font-weight:600;
}

.note{
margin-top:15px;
font-size:14px;
}


/*FAQ SECGTION */

.faq-section{
padding:80px 5%;
background:#f9f9f9;
}

.faq-section h2{
text-align:center;
margin-bottom:40px;
font-size:32px;
}

.faq-item{
background:white;
margin-bottom:15px;
border-radius:8px;
overflow:hidden;
box-shadow:0 3px 10px rgba(0,0,0,0.08);
}

.faq-question{
width:100%;
padding:18px;
text-align:left;
background:white;
border:none;
font-size:16px;
font-weight:600;
cursor:pointer;
}

.faq-answer{
display:none;
padding:18px;
border-top:1px solid #eee;
color:#555;
line-height:1.6;
}

.faq-answer{
display:none;
}


/*google review */

.reviews{
padding:80px 5%;
background:#f9f9f9;
}

.reviews h2{
text-align:center;
font-size:32px;
margin-bottom:40px;
}

.review-slider{
display:flex;
gap:25px;
overflow-x:auto;
scroll-snap-type:x mandatory;
padding-bottom:10px;
}

.review-slider::-webkit-scrollbar{
height:8px;
}

.review-slider::-webkit-scrollbar-thumb{
background:#ccc;
border-radius:10px;
}

.review-card{
min-width:320px;
background:white;
padding:25px;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
scroll-snap-align:start;
}

.review-header{
display:flex;
align-items:center;
gap:12px;
margin-bottom:12px;
}

.google-logo{
width:26px;
}

.stars{
color:#fbbc04;
}

.review-card p{
font-size:14px;
color:#555;
line-height:1.6;
}


/*whatsapp button*/
.floating-contact{
position:fixed;
right:20px;
bottom:25px;
display:flex;
flex-direction:column;
gap:12px;
z-index:999;
}

.float-btn{
width:55px;
height:55px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
box-shadow:0 5px 20px rgba(0,0,0,0.3);
transition:0.3s;
cursor:pointer;
}

.float-btn img{
width:28px;
}

.whatsapp{
background:#25D366;
}

.call{
background:#007bff;
}

.top{
background:#333;
color:white;
font-size:20px;
border:none;
}

.float-btn:hover{
transform:scale(1.1);
}
.float-btn img{
width:28px;
height:28px;
object-fit:contain;
}.float-btn i{
color:white;
font-size:24px;
}

/*ABOUT PAGE*/

/* ABOUT HERO */

.about-hero-section{
background:#111;
color:#fff;
text-align:center;
padding:100px 20px;
}

.about-hero-section h1{
font-size:42px;
margin-bottom:15px;
}

.about-hero-section p{
font-size:18px;
max-width:700px;
margin:auto;
opacity:0.9;
}


/* ABOUT MAIN */

.about-main-section{
padding:80px 0;
}

.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
align-items:center;
}

.about-image-box img{
width:100%;
border-radius:10px;
}

.about-content-box h2{
font-size:32px;
margin-bottom:20px;
}

.about-content-box p{
margin-bottom:15px;
line-height:1.7;
color:#555;
}


/* WHY CHOOSE */

.about-why-section{
background:#f7f7f7;
padding:80px 0;
}

.about-why-section h2{
text-align:center;
margin-bottom:50px;
font-size:32px;
}

.about-why-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:30px;
}

.about-why-card{
background:#fff;
padding:30px;
border-radius:10px;
text-align:center;
box-shadow:0 5px 15px rgba(0,0,0,0.08);
}

.about-why-card i{
font-size:36px;
color:#c59d5f;
margin-bottom:10px;
}

.about-why-card h3{
margin-bottom:10px;
}


/* CTA */

.about-cta-section{
background:#43929c;
color:#fff;
text-align:center;
padding:80px 20px;
}

.about-cta-section h2{
font-size:32px;
margin-bottom:15px;
}

.about-cta-btn{
display:inline-block;
margin-top:20px;
background:#c59d5f;
color:#fff;
padding:12px 30px;
text-decoration:none;
border-radius:5px;
}



/*about contact form */

/* ABOUT CONTACT SECTION */

.about-contact-section{
padding:100px 20px;
background:linear-gradient(135deg,#f7f7f7,#ffffff);
}

.about-contact-wrapper{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
max-width:1200px;
margin:auto;
}

/* LEFT SIDE */

.about-contact-left h2{
font-size:38px;
margin-bottom:15px;
}

.about-contact-left p{
color:#666;
line-height:1.7;
margin-bottom:25px;
}

.contact-highlights{
list-style:none;
padding:0;
}

.contact-highlights li{
margin-bottom:10px;
font-weight:500;
}

/* FORM CARD */

.about-contact-right{
background:#fff;
padding:40px;
border-radius:10px;
box-shadow:0 15px 40px rgba(0,0,0,0.1);
}

/* FORM */

.premium-contact-form{
display:flex;
flex-direction:column;
gap:18px;
}

.form-group input,
.form-group select,
.form-group textarea{

width:100%;
padding:14px;
border:1px solid #ddd;
border-radius:6px;
font-size:14px;
transition:0.3s;
}

.form-group textarea{
min-height:110px;
resize:none;
}

/* INPUT FOCUS */

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{

border-color:#c59d5f;
outline:none;
box-shadow:0 0 0 2px rgba(197,157,95,0.2);
}

/* BUTTON */

.contact-submit-btn{

background:#c59d5f;
color:#fff;
border:none;
padding:15px;
font-size:16px;
font-weight:600;
border-radius:6px;
cursor:pointer;
transition:0.3s;
}

.contact-submit-btn:hover{

background:#000;
transform:translateY(-2px);
}

/* RESPONSIVE */

@media(max-width:900px){

.about-contact-wrapper{
grid-template-columns:1fr;
}

.about-contact-left{
text-align:center;
}

}
/* BRANCHES SECTION */

/* AREAS WE SERVE */

.about-branches{
padding:90px 20px;
background:#f9f9f9;
text-align:center;
}

.about-branches h2{
font-size:34px;
margin-bottom:10px;
font-weight:700;
}

.branches-subtitle{
max-width:750px;
margin:auto;
color:#666;
margin-bottom:50px;
line-height:1.6;
}

.branches-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
max-width:1100px;
margin:auto;
}

.branch-card{
background:#fff;
padding:18px;
border-radius:8px;
border:1px solid #eee;
font-size:15px;
font-weight:500;
transition:all 0.3s ease;
box-shadow:0 4px 12px rgba(0,0,0,0.05);
}

.branch-card:hover{
background:#c59d5f;
color:#fff;
transform:translateY(-5px);
box-shadow:0 8px 20px rgba(0,0,0,0.15);
cursor:default;
}
/* MOBILE */

@media(max-width:900px){

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

.about-why-grid{
grid-template-columns:1fr 1fr;
}

}



.popup-form{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
justify-content:center;
align-items:center;
z-index:9999;
}

.popup-content{
background:white;
padding:30px;
border-radius:10px;
width:350px;
}

.close-btn{
float:right;
cursor:pointer;
font-size:22px;
}

.top-marquee{
background:#c59d5f;
color:#fff;
font-size:15px;
padding:8px 0;
font-weight:500;
}

.top-marquee marquee{
max-width:1200px;
margin:auto;
}


/*SERVICES */
/* SERVICES SECTION */

/* SERVICES PAGE */

.services-page-section{
padding:80px 20px;
text-align:center;
}

.services-page-section h2{
font-size:34px;
margin-bottom:15px;
}

.services-page-intro{
max-width:800px;
margin:auto;
margin-bottom:50px;
color:#666;
line-height:1.7;
}

.services-page-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}

.services-page-card{
background:#fff;
border-radius:10px;
overflow:hidden;
box-shadow:0 6px 18px rgba(0,0,0,0.08);
transition:0.3s;
}

.services-page-card img{
width:100%;
height:200px;
object-fit:cover;
}

.services-page-content{
padding:20px;
text-align:left;
}

.services-page-content h3{
margin-bottom:10px;
font-size:20px;
}

.services-page-content p{
color:#555;
font-size:14px;
line-height:1.6;
}

.services-page-card:hover{
transform:translateY(-6px);
box-shadow:0 12px 25px rgba(0,0,0,0.15);
}









/* TITLES */

.services-title{
font-size:38px;
font-weight:700;
margin-bottom:15px;
text-align:center;
}

.services-subtitle{
max-width:800px;
margin:auto;
text-align:center;
color:#666;
line-height:1.7;
margin-bottom:70px;
}



/* PROCESS SECTION */

.services-page-process{
padding:100px 20px;
background:#f9f9f9;
}

.process-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:30px;
max-width:1200px;
margin:auto;
}

.process-card{
background:#fff;
padding:40px 30px;
border-radius:10px;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
transition:0.35s;
position:relative;
}

.process-number{
font-size:40px;
font-weight:700;
color:#c59d5f;
margin-bottom:15px;
}

.process-card h3{
margin-bottom:10px;
}

.process-card p{
color:#666;
font-size:14px;
line-height:1.6;
}

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



/* WHY CHOOSE US */

.services-page-why{
padding:100px 20px;
background:#fff;
}

.why-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:30px;
max-width:1100px;
margin:auto;
}

.why-card{
background:#f7f7f7;
padding:35px;
border-radius:10px;
transition:0.35s;
border-left:4px solid #c59d5f;
}

.why-card h3{
margin-bottom:10px;
}

.why-card p{
color:#666;
line-height:1.6;
}

.why-card:hover{
background:#c59d5f;
color:#fff;
transform:translateY(-6px);
}

.why-card:hover p{
color:#fff;
}



/* AREAS SECTION */

.services-page-areas{
padding:100px 20px;
background:#f4f4f4;
text-align:center;
}

.areas-intro{
max-width:750px;
margin:auto;
margin-bottom:40px;
color:#666;
}

.areas-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
gap:15px;
max-width:900px;
margin:auto;
}

.areas-grid span{
background:#fff;
padding:14px;
border-radius:6px;
font-weight:500;
border:1px solid #eee;
transition:0.3s;
}

.areas-grid span:hover{
background:#c59d5f;
color:#fff;
transform:translateY(-4px);
}




/* SMALL FOOTER MAP - ABOUT PAGE */

.footer-map-small{
max-width:450px;
margin:30px auto 0;
border-radius:8px;
overflow:hidden;
box-shadow:0 6px 20px rgba(0,0,0,0.15);
}

.footer-map-small iframe{
width:100%;
height:160px;
border:0;
}




/*AREAS CSS*/
/* HERO */

.areas-hero{

padding:120px 20px;
background:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),
url(images/interior-bg.jpg);

background-size:cover;
background-position:center;
color:white;
text-align:center;

}

.areas-hero h1{
font-size:48px;
margin-bottom:20px;
}

.areas-hero p{
max-width:800px;
margin:auto;
line-height:1.7;
opacity:0.9;
}



/* SECTION */

.areas-section{

padding:100px 20px;
text-align:center;

}

.areas-section h2{
font-size:36px;
margin-bottom:50px;
}



/* GRID */

.areas-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:25px;
max-width:1200px;
margin:auto;

}



/* CARD */

.area-card{

padding:25px;
background:white;
border-radius:10px;
font-size:18px;
font-weight:600;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
transition:all 0.3s ease;

}



/* HOVER */

.area-card:hover{

background:#c59d5f;
color:white;
transform:translateY(-6px);
box-shadow:0 20px 40px rgba(0,0,0,0.2);

}



/* DARK SECTION */

.areas-section.dark{

background:#f7f7f7;

}

/* SEO Text Styling for Areas Page */
.areas-seo {
    font-size: 16px;             /* Readable size */
    line-height: 1.8;            /* Comfortable line spacing */
    color: #555;                 /* Soft grey for elegance */
    max-width: 900px;            /* Keeps text nicely centered */
    margin: 40px auto 0;         /* Spacing from top and bottom */
    text-align: center;          /* Centered for neat layout */
    padding: 0 20px;             /* Padding for small screens */
    font-family: 'Poppins', 'Roboto', sans-serif; /* Modern, premium font */
}

/* Optional: subtle highlight for keywords */
.areas-seo strong {
    color: #c59d5f;              /* Gold highlight for luxury feel */
    font-weight: 600;
}



/*GALLERY */

.gallery-page{
padding:100px 20px;
background:#f9f9f9;
text-align:center;
}

.gallery-title{
font-size:40px;
margin-bottom:10px;
}

.gallery-subtitle{
max-width:700px;
margin:auto;
margin-bottom:40px;
color:#666;
line-height:1.7;
}


/* FILTER BUTTONS */

.gallery-filter{
margin-bottom:40px;
}

.gallery-filter button{

border:none;
background:#eee;
padding:10px 20px;
margin:5px;
border-radius:5px;
cursor:pointer;
font-weight:500;
transition:0.3s;

}

.gallery-filter button:hover,
.gallery-filter button.active{

background:#c59d5f;
color:white;

}


/* GRID */

.gallery-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:20px;

}


/* IMAGE */

.gallery-item{

overflow:hidden;
border-radius:10px;
box-shadow:0 10px 25px rgba(0,0,0,0.1);

}

.gallery-item img{

width:100%;
height:250px;
object-fit:cover;
transition:0.4s;

}

.gallery-item:hover img{

transform:scale(1.1);

}