body{margin:0;font-family:Poppins,sans-serif;color:#fff;background:#3b2417;}
header{background:rgba(0,0,0,0.4);padding:15px 20px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:50;}
.logo{font-size:20px;font-weight:600;}
.menu-toggle{font-size:30px;cursor:pointer;color:#f4d9c6;}
#nav-menu{display:none;flex-direction:column;background:rgba(0,0,0,0.75);padding:15px;border-radius:10px;position:absolute;top:70px;right:20px;width:200px;z-index:999;}
#nav-menu.open{display:flex;}
#nav-menu a{padding:10px 5px;color:#f4d9c6;text-decoration:none;}

.beautiful-hero{position:relative;height:100vh;display:flex;justify-content:center;align-items:center;padding:0 20px;}
.hero-bg{position:absolute;inset:0;background:url('hero.jpg') center/cover no-repeat;filter:brightness(.75);}
.beautiful-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(45,30,20,.55),rgba(90,60,45,.55));}
.hero-glass{position:relative;z-index:3;padding:35px 25px;background:rgba(255,255,255,0.07);border-radius:20px;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.25);text-align:center;}

.btn-primary,.btn-outline{padding:14px 32px;border-radius:50px;text-decoration:none;font-weight:600;}
.btn-primary{background:linear-gradient(135deg,#caa588,#eed1b8);color:#4b3228;}
.btn-outline{border:2px solid #eed1b8;color:#eed1b8;}

.about-section{padding:80px 20px;display:flex;justify-content:center;}
.about-glass{max-width:820px;width:100%;padding:45px 35px;background:rgba(255,255,255,0.08);border-radius:22px;backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,0.20);text-align:center;}
.about-photo{width:100%;max-width:300px;margin:20px auto;border-radius:18px;}

.rates-section{padding:80px 20px;position:relative;display:flex;justify-content:center;overflow:hidden;}
.rates-section::before{content:'';position:absolute;inset:0;background:url('rates-bg.jpg') center/cover no-repeat;filter:brightness(.75) saturate(1.1);z-index:1;}
.rates-section::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(40,25,18,.55),rgba(130,105,85,.45));z-index:2;}
.rates-glass{position:relative;z-index:3;max-width:820px;width:100%;padding:45px 35px;background:rgba(255,255,255,0.10);backdrop-filter:blur(14px);border-radius:22px;border:1px solid rgba(255,255,255,0.18);}
.rate-item{display:flex;justify-content:space-between;padding:14px 18px;background:rgba(255,255,255,0.08);border-radius:14px;margin-bottom:10px;}

.services-section{padding:80px 20px;display:flex;justify-content:center;}
.services-glass{max-width:820px;width:100%;padding:45px 35px;background:rgba(255,255,255,0.08);border-radius:22px;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,0.18);text-align:center;}
.services-section h2{color:#f9e8dd;font-size:40px;margin-bottom:25px;}
.extras-title{margin-top:40px;font-size:30px;color:#f6ddcc;}

.service-list, .extras-list{list-style:none;padding:0;}
.service-list li, .extras-list li{padding:12px 0;border-bottom:1px solid rgba(255,255,255,0.15);color:#f4d9c6;font-size:19px;display:flex;justify-content:space-between;}
.extras-list li span{color:#e8c6ab;}

.section{text-align:center;padding:60px 20px;}
.booking-section{display:flex;justify-content:center;padding:80px 20px;}
.booking-glass{max-width:820px;width:100%;padding:45px 35px;background:rgba(30,18,12,0.86);backdrop-filter:blur(14px);border-radius:22px;border:1px solid rgba(255,255,255,0.18);text-align:left;}
.booking-glass h2{font-size:36px;margin-bottom:15px;color:#f9e8dd;text-align:center;}
.booking-intro{text-align:center;margin-bottom:25px;color:#f4d9c6;font-size:15px;}
.booking-form{display:flex;flex-direction:column;gap:18px;}
.booking-row{display:flex;gap:16px;flex-wrap:wrap;}
.form-field{flex:1;min-width:220px;display:flex;flex-direction:column;font-size:14px;color:#f9e8dd;}
.form-field label{margin-bottom:6px;font-weight:500;}
.form-field label span{color:#f7c9b0;margin-left:3px;}
.form-field input,.form-field select,.form-field textarea{padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,0.35);background:rgba(0,0,0,0.35);color:#fff;font-family:inherit;font-size:14px;outline:none;}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#eed1b8;box-shadow:0 0 0 1px rgba(238,209,184,0.4);}
.booking-submit{margin-top:10px;width:100%;text-align:center;cursor:pointer;border:none;}
@media(max-width:600px){
.booking-glass{padding:30px 20px;}
}


/* Booking Brown Glow Overlay */

#booking {
  background-image: url("IMG_2575.JPG");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  padding: 60px 0;
}

#booking::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
      rgba(120, 90, 60, 0.35),
      rgba(100, 75, 50, 0.35)
  );
  z-index: 1;
}

#booking .booking-glass {
  position: relative;
  z-index: 2;
  background: rgba(255, 255, 255, 0.22);
  backdrop-filter: blur(10px);
  border-radius: 15px;
}



/* Contact Icon Styling */
.contact-icons {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 25px;
  flex-wrap: wrap;
}

.contact-btn {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  border: 2px dotted #7a4e2b;
  padding: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(5px);
  transition: 0.3s ease;
}

.contact-btn img {
  width: 70%;
  height: 70%;
  object-fit: contain;
}

.contact-btn:hover {
  transform: scale(1.12);
  background: rgba(255, 255, 255, 0.7);
}



/* Updated Hero Buttons - Stacked */
.hero-btns {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-top: 25px;
  align-items: center;
}

.hero-btns a {
  width: 220px;
  text-align: center;
}


.review {
  background: rgba(255,255,255,0.25);
  padding: 15px;
  margin: 15px 0;
  border-radius: 10px;
  backdrop-filter: blur(6px);
}

.review-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 20px;
}

.review-form input, .review-form textarea {
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #d4c2b2;
}




/* TERMS & CONDITIONS STYLING */
.terms-section {
  padding: 50px 20px;
}

.terms-glass {
  background: rgba(255,255,255,0.25);
  backdrop-filter: blur(10px);
  padding: 25px;
  border-radius: 15px;
}

.terms-glass h2, .terms-glass h3 {
  color: #5a3c28;
}

.terms-glass ul {
  margin: 10px 0 20px 20px;
  list-style: disc;
}

/* Brown FAQ styles placeholder */

/* FAQ Section */
.faq-section {
  margin: 40px 0;
}

.faq-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #4a2e18; /* deep brown */
}

.faq-item {
  border-bottom: 1px solid #c9b29a; /* light brown */
  padding: 10px 0;
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  font-size: 18px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  color: #4a2e18;
}

.faq-question:hover {
  color: #7a4f2b;
  transition: 0.3s ease;
}

.faq-arrow {
  transition: transform 0.3s ease;
  color: #4a2e18;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  padding: 0;
  color: #4a2e18;
  line-height: 1.6;
  transition: max-height 0.4s ease, padding 0.3s ease;
}

.faq-item.active .faq-answer {
  max-height: 500px;
  padding: 10px 0;
}

.faq-item.active .faq-arrow {
  transform: rotate(180deg);
}



#gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
  padding: 20px;
}

.gallery-img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  object-fit: cover;
}



#faq {
  background-image: url('faq-background.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 60px 20px;
  color: white;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8);
  backdrop-filter: brightness(0.8);
}



.faq-section {
  background-image: url('faq-background.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 60px 20px;
  color: white;
  text-shadow: 0 1px 3px rgba(0,0,0,0.8);
  backdrop-filter: brightness(0.8);
}