:root {
      --gold: #805b3a;
      --gold-dark: #805b3a;
      --black: #000000;
      --white: #ffffff;
      --light: #f7e7d2;
      --dark : #805b3a;
    }

    body {
      font-family: 'Poppins', sans-serif;
      background-color: var(--white);
      color: var(--black);
      scroll-behavior: smooth;
      width:100vw;
      overflow-x:hidden;
    }

    /* ---------- NAVBAR ---------- */
    .navbar {
      transition: background-color 300ms ease, box-shadow 300ms ease, padding 300ms ease;
      background-color: var(--light);
      padding: 1rem 0;
    }
    .navbar .navbar-brand,
    .navbar .nav-link {
      color: var(--black) !important;
      transition: color 250ms ease;
    }
    .navbar.scrolled {
      background-color: var(--dark);
      padding: 0.6rem 0;
    }
    .navbar.scrolled .navbar-brand,
    .navbar.scrolled .nav-link {
      color: var(--white) !important;
    }
    .btn-enquire {
      background-color: var(--gold);
      color: var(--black);
      border: 1px solid rgba(0,0,0,0.06);
      transition: all 0.25s ease;
    }
    .navbar.scrolled .btn-enquire {
      background: transparent;
      color: var(--white);
      border-color: rgba(255,255,255,0.2);
    }

    /* ---------- HERO CAROUSEL ---------- */
    .hero .carousel-item {
      height: 85vh;
      min-height: 400px;
    }
    .hero .carousel-item img {
      object-fit: cover;
      height: 100%;
      width: 100%;
    }
    .carousel-caption {
      top:0;
      left:0 !important;
      display:flex !important;
      align-items:center;
      justify-content:center;
      width:100%;
      height:100%;
      background:rgb(0,0,0,0.3);
    }
    .carousel-caption h1 {
      font-size: clamp(2rem, 4vw, 3.25rem);
      font-weight: 700;
      color: #d6ae8e;
      text-shadow: 0 0 1px white;
    }
    .carousel-caption p.lead { color: #fff; opacity: 0.9; }
    .carousel-caption .btn { font-weight: 600; }

    /* ---------- SECTION TITLES ---------- */
    .section-title {
      text-align: center;
      font-weight: 700;
      margin-bottom: 1.5rem;
      color: var(--black);
      position: relative;
      letter-spacing: 0.02em;
    }
    .section-title::after {
      content: "";
      display: block;
      height: 3px;
      width: 70px;
      background: var(--gold);
      margin: 12px auto 0;
      border-radius: 2px;
    }

    /* ---------- PROJECT CARDS ---------- */
    .project-card {
      border-radius: 12px;
      overflow: hidden;
      transition: transform 300ms ease, box-shadow 300ms ease;
      background: #fff;
    }
    .project-card img {
      width: 100%;
      height: 220px;
      object-fit: cover;
    }
    .project-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 18px 40px rgba(0,0,0,0.12);
    }

    /* ---------- WHY US ---------- */
    .why-box {
      background: #f7e7d2;
      color: black;
      padding: 1.8rem;
      border-left: 5px solid var(--gold);
      border-radius: 6px;
      transition: transform 250ms ease, background 250ms;
      height: 100%;
    }
    .why-box h5 { color: var(--gold); }

    /* ---------- AMENITIES ---------- */
    .amenity {
      border-radius: 8px;
      text-align: center;
      padding: 1.2rem;
      transition: transform 200ms ease, box-shadow 200ms;
      background: #fff;
      border: 1px solid #eee;
    }
    .amenity:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.08); }
    .amenity .icon { font-size: 1.8rem; color: var(--gold); margin-bottom: 0.6rem; }

    /* ---------- TESTIMONIAL ---------- */
    .testimonial {
      background: linear-gradient(180deg,#fff,#f8f8f8);
      padding: 1.25rem;
      border-radius: 10px;
      text-align: left;
      min-height: 140px;
    }
    .testimonial p{
        color:black;
    }
    .testimonial .name { font-weight: 700; color: var(--black); margin-top: 0.75rem; }

    /* ---------- CONTACT ---------- */
    .contact-card {
      background: var(--white);
      border-radius: 10px;
      padding: 1.25rem;
      box-shadow: 0 8px 26px rgba(0,0,0,0.06);
    }

    /* ---------- FOOTER ---------- */
    footer {
      background: var(--black);
      color: var(--white);
      padding: 2.5rem 0;
    }
    footer a { color: var(--gold); }

    /* GOLD HEADER MODAL */
    .bg-gold { background-color: var(--gold) !important; }
    .text-gold { color: var(--gold) !important; }


@media screen and (max-width:600px){
  .banner-main{
    position: relative;
    width: 100%;
    overflow: hidden;
  }
}
@media screen and (min-width:601px) and (max-width:991px){
  .banner-main{
    position: relative;
    width: 100%;
    overflow: hidden;
  }
}
@media screen and (min-width:992px){
  .banner-main{
    position: relative;
    width: 100%;
    overflow: hidden;
  }
}

/* about us */
.aboutus b{
  color:#805b3a;
  font-weight:600;
}
.aboutclass{
  position:relative;
}
.aboutclass .abt1{
  width:100%;
  border:0.5rem solid #805b3a;
}
.aboutclass .abt2{
  width:50%;
  position:absolute;
  bottom:-2rem;
  right:-10%;
  border:0.5rem solid #805b3a;
}
.wbimg:hover{
  filter: grayscale(0%);
}
.wbimg{
  filter: grayscale(100%);
  width:100%;
}

/* packages */
.packages{
  background-size:100% !important;
  background-attachment: fixed !important;
}
.singlepackage{
  background:#d6ae8e;
  padding:1rem;
  border-radius:1rem;
}
.packicon{
  font-size:5rem;
  margin-bottom:1rem;
}
.singlepackage span{
  font-size:1.2rem;
  padding:0.2rem 2rem;
  border-radius:10px;
}


/* footer */
.footer .container div div h5{
  color:white;
  font-size:1.6rem;
}
.footer .container div div p{
  margin:0;
  color:white;
}
.footer .container div div p a{
  text-decoration:none;
  color:white;
}
.social-icons{
  margin-top:1rem;
}
.social-icons i{
  color:#805b3a;
  font-size:1.2rem;
  background:#f7e7d2;
  padding:0.3rem;
  border-radius:10px;
}

/* packages page */
.innerpackage{
  background:#FFD600;
  padding:1rem;
}
.singleproject{
  background:#000;
  padding:0.5rem;
  border-radius:1rem;
  box-shadow:0 0 1rem black;
}
.imagesection{
  background-size:cover !important;
  background-position:center center !important;
  background-repeat: no-repeat !important;
  width:100%;
  height:18rem;
  box-shadow:0 0 5px black;
  border-radius:1rem;
}
.contentsection{
  width:96%;
  color:white;
  margin-left:2%;
  margin-top:-3rem;
  background:#000;
  height:6rem;
  border-radius: 1rem;
  box-shadow:0 0 10px #ffd600;
  padding:1rem;
  overflow: hidden;
}