/* assets/css/styles.css */

/* ===== BASE & RESET ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Montserrat", sans-serif;
  background-color: #fff;
  color: #000;
  overflow-x: hidden;
  padding-top: 80px;
}

#root,
.bellagio-page {
  width: 100%;
}

/* ===== NAVIGATION ===== */
nav.border-bottom {
  border-bottom: 0.25px solid rgb(223, 221, 221) !important;
  padding: 10px 0 !important;
}

.container-fluid {
  padding: 0 100px !important;
}

.navbar-brand img {
  height: 52px;
  width: auto;
}

.navbar-nav .nav-link {
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0.56px !important;
  padding: 10px !important;
  color: #000 !important;
  transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover {
  color: rgb(189, 151, 92) !important;
}

/* Home link is active by default */
/* .navbar-nav .nav-link:first-child {
  color: rgb(189, 151, 92) !important;
} */

.btn-gold {
  padding: 6px 11px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border: 0.5px solid rgb(255, 255, 255) !important;
  background-color: rgb(189, 151, 92) !important;
  color: white !important;
  transition: all 0.3s ease;
}

.btn-gold:hover {
  background-color: rgb(216, 176, 109) !important;
  border-color: rgb(216, 176, 109) !important;
}

nav.border-bottom {
  border-bottom: 0.25px solid rgb(223, 221, 221) !important;
  padding: 10px 0 !important;
}

/* Desktop fixed navbar */
@media (min-width: 992px) {
  .fixed-desktop {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
    background: #fff;
  }
}
/* Hamburger */
.navbar-toggler {
  border: none;
}

.navbar-toggler:focus {
  box-shadow: none;
}

/* ===== HERO SECTION ===== */
#home {
  position: relative;
  /* height: 672px; */
  overflow: hidden;
  padding: 0 !important;
}

#home img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ===== CROWN/JEWELS SECTION ===== */
#crown {
  padding: 64px 0;
}

#crown .container-fluid {
  padding: 0 100px !important;
}

#crown .text-center {
  text-align: center;
}

#crown .d-flex.flex-column {
  display: flex;
  flex-direction: column;
}

#crown .align-items-center {
  align-items: center;
}

#crown .gap-3 {
  gap: 1rem;
}

#crown h3 {
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  letter-spacing: 0.8px;
  text-align: center;
}

/* ===== HIGHLIGHTS SECTION ===== */
#highlights .container-fluid {
  padding: 0 100px !important;
}

#highlights h4 {
  font-size: 26px;
  font-weight: 400;
  color: #000;
  margin-bottom: 0.5rem;
}

#highlights h2 {
  font-size: 44px;
  font-weight: 400;
  letter-spacing: 13.76px;
  text-transform: uppercase;
  color: rgb(216, 176, 109);
}

/* Highlights list items */
#highlights .d-flex.flex-column.gap-3 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 2rem;
}

#highlights .d-flex.align-items-start.gap-3 {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

#highlights h5 {
  font-size: 16px;
  font-weight: 600;
  line-height: 30px;
  letter-spacing: 0.64px;
  margin-bottom: 0;
}

#highlights p {
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: 0.64px;
  margin-bottom: 0;
}

#highlights p.heading {
  font-size: 24px;
  color: rgb(30, 30, 30);
  letter-spacing: 13.6px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}

/* Navigation buttons */
#highlights .d-flex.gap-3.justify-content-center {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 2.5rem;
}

#highlights .d-flex.gap-3.justify-content-center button {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  border: 1.16667px solid rgb(197, 146, 65);
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

#highlights .d-flex.gap-3.justify-content-center button:hover {
  background-color: rgba(197, 146, 65, 0.1);
}

/* ===== BROCHURE FORM ===== */
#highlights .col-lg-5 > div {
  padding: 40px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: rgba(0, 0, 0, 0.16) 0px 4px 34px;
}

#highlights .col-lg-5 h3 {
  font-size: 40px;
  font-weight: 400;
  color: rgb(27, 27, 27);
  margin-bottom: 30px;
}

#highlights .col-lg-5 p {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1.54px;
  margin-bottom: 30px;
}

/* Form inputs */
#highlights .form-control {
  border-top: none !important;
  border-right: none !important;
  border-bottom: 1px solid rgb(148, 146, 146) !important;
  border-left: none !important;
  border-radius: 0 !important;
  padding: 20px 10px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 1.76px !important;
  color: rgb(136, 118, 104) !important;
  background: transparent !important;
}

#highlights .form-control:focus {
  box-shadow: none !important;
  border-bottom-color: rgb(216, 176, 109) !important;
}

/* Download button */
#highlights .col-lg-5 .btn-primary {
  background: rgb(216, 176, 109) !important;
  border: none !important;
  padding: 10px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 1.76px !important;
  color: rgb(30, 30, 30) !important;
  width: 100%;
  transition: background-color 0.3s ease;
}

#highlights .col-lg-5 .btn-primary:hover {
  background: rgb(197, 146, 65) !important;
}

/* ===== CONFIGURATIONS SECTION ===== */
#configurations {
  position: relative;
}

.configurations-content {
  padding: 61px 102px 60px !important;
}

#configurations p {
  font-size: 44px;
  color: rgb(216, 176, 109);
  letter-spacing: 13.6px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}

#configurations h2 {
  font-size: 24px;
  color: rgb(217, 217, 217);
  letter-spacing: 1.36px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Configuration rows */
#configurations .row.align-items-center {
  padding: 10px 0;
  border-bottom: 0.5px solid rgb(216, 176, 109);
}

#configurations h3 {
  font-size: 18px;
  font-weight: 400;
  line-height: 40px;
  letter-spacing: 0.8px;
  color: rgb(255, 255, 255);
  margin-bottom: 0;
}
#configurations p.heading {
  text-transform: uppercase;
}

#configurations .col-4.text-center p {
  font-size: 18px;
  font-weight: 400;
  line-height: 40px;
  letter-spacing: 0.8px;
  color: rgb(255, 255, 255);
  margin-bottom: 0;
  text-transform: none;
}

/* Unlock button */
#configurations .btn-primary {
  padding: 6px 14px !important;
  border: 0.5px solid rgb(216, 176, 109) !important;
  background: rgb(216, 176, 109) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  letter-spacing: 0.72px !important;
  color: rgb(255, 255, 255) !important;
  transition: all 0.3s ease;
}

#configurations .btn-primary:hover {
  background: rgba(216, 176, 109, 0.9) !important;
}

/* ===== WALKTHROUGH VIDEO SECTION ===== */
section:has(+ #gallery) {
  padding: 70px 0 69px;
}

section:has(+ #gallery) .container-fluid {
  padding: 0 101px !important;
}

section:has(+ #gallery) p {
  font-size: 24px;
  color: rgb(216, 176, 109);
  letter-spacing: 1.36px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}

section:has(+ #gallery) h2 {
  font-size: 24px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.36px;
  text-transform: uppercase;
  font-weight: 400;

  margin: 0 auto 40px;
}

/* Video container */
section:has(+ #gallery) div[style*="position: relative"] {
  position: relative;
  height: 571px;
}

section:has(+ #gallery) img[alt="Walkthrough Video"] {
  width: 100%;
  height: 503px;
  object-fit: cover;
  margin-bottom: 20px;
}

/* Play button */
section:has(+ #gallery) div[style*="position: absolute; top: 50%"] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
}

/* ===== GALLERY SECTION ===== */
#gallery {
  padding: 59px 0;
}

#gallery .container-fluid {
  padding: 0 102px !important;
}

#gallery p {
  font-size: 44px;
  color: rgb(216, 176, 109);
  letter-spacing: 1.36px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}

#gallery h2 {
  font-size: 24px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Gallery tabs */
#gallery .nav-tabs {
  border: none !important;
  margin-bottom: 40px;
}

#gallery .nav-item {
  flex: 1 1 0%;
}

#gallery .nav-link {
  border-bottom: 1px solid rgb(0, 0, 0) !important;
  color: rgb(27, 27, 27) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 45px !important;
  text-align: center !important;
  background: transparent !important;
  border-radius: 0 !important;
}

#gallery .nav-link:not(.active) {
  border-bottom: 1px solid rgb(148, 146, 146) !important;
  color: rgb(148, 146, 146) !important;
}

#gallery .nav-link.active {
  border-bottom: 1px solid rgb(0, 0, 0) !important;
  color: rgb(27, 27, 27) !important;
}

/* Gallery image */
/* #gallery .d-flex.flex-column.align-items-center img {
  width: 100%;
  max-height: 413px;
  object-fit: cover;
  margin-bottom: 20px;
} */

/* Gallery navigation buttons */
#gallery .d-flex.gap-3 button {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  border: 1.16667px solid rgb(197, 146, 65);
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

#gallery .d-flex.gap-3 button:hover {
  background-color: rgba(197, 146, 65, 0.1);
}

/* ===== AMENITIES SECTION ===== */
#amenities {
  padding: 60px 0 60px;
  background: rgb(216, 176, 109);
}

#amenities .container-fluid {
  padding: 0 102px !important;
}

#amenities h2 {
  font-size: 24px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Amenities tabs */
#amenities .nav {
  border: none !important;
  margin-bottom: 30px;
}

#amenities .nav-item {
  flex: 1 1 0%;
}

#amenities .nav-link {
  border-bottom: 2px solid rgb(0, 0, 0) !important;
  color: rgb(27, 27, 27) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 45px !important;
  text-align: center !important;
  background: rgb(216, 176, 109) !important;
  border-radius: 0 !important;
}

#amenities .nav-link:not(.active) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.5) !important;
  color: rgba(0, 0, 0, 0.8) !important;
  font-weight: 400 !important;
}

/* Amenities grid */
#amenities .col-lg-3 {
  margin-bottom: 20px;
}

/* Perfect alignment for icon + text rows */
#amenities .d-flex.gap-2 {
  align-items: flex-start;
}

#amenities .amenities-icons-column {
  justify-content: space-between;
}

#amenities .amenities-icons-column img {
  display: block;
  height: 58px;
  margin-bottom: 8px;
  width: auto;
}

#amenities .d-flex.gap-2 > div:last-child p {
  display: flex;
  align-items: center;
  height: 58px; /* Same as icon height */
  line-height: 28px; /* Remove tall line-height */
  margin-left: 4px;
}

/* Load more button */
#amenities .text-center .btn-primary {
  border: 1px solid rgb(0, 0, 0) !important;
  background: transparent !important;
  padding: 10px !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 27px !important;
  letter-spacing: 0.72px !important;
  color: rgb(0, 0, 0) !important;
  width: 314px;
  transition: all 0.3s ease;
}

#amenities .text-center .btn-primary:hover {
  background: rgba(0, 0, 0, 0.1) !important;
}

/* ===== LOCATION SECTION ===== */
#location {
  padding: 93px 0;
  background: rgb(248, 248, 248);
}

#location .container-fluid {
  padding: 0 102px !important;
}

#location p {
  font-size: 44px;
  color: rgb(216, 176, 109);
  letter-spacing: 13.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}

#location h2 {
  font-size: 24px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Location accordion items */
#location .d-flex.flex-column.gap-4 > div {
  padding: 20px;
  border-bottom: 1px solid rgb(216, 176, 109);
  cursor: pointer;
  transition: background-color 0.3s ease;
}

#location .d-flex.flex-column.gap-4 > div:hover {
  background-color: rgba(216, 176, 109, 0.1);
}

#location h3 {
  font-size: 24px;
  font-weight: 400;
  margin: 0;
  color: rgb(0, 0, 0);
}

#location .col-lg-6:last-child img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 20px;
}

.location-content {
  display: none;
  padding: 15px 0 0 10px;
}

.location-content.open {
  display: block;
}

.location-content li {
  font-size: 16px;
  line-height: 28px;
  color: #333;
}
.location-item.active {
  background-color: rgba(216, 176, 109, 0.1);
}

/* ===== ABOUT SECTION ===== */
#about {
  padding: 84px 0 83px;
}

#about .container-fluid {
  padding: 0 100px !important;
}

#about p:first-of-type {
  font-size: 44px;
  font-weight: 400;
  letter-spacing: 13.36px;
  margin-bottom: 20px;
  color: #000;
}

#about h2 {
  font-size: 24px;
  font-weight: 300;
  letter-spacing: 1.76px;
  text-transform: uppercase;
  color: rgb(216, 176, 109);
  line-height: 1.2;
  margin-bottom: 30px;
}

/* About content */
#about .col-lg-9 p {
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: 0.64px;
  margin-bottom: 0;
}

/* Read more button */
#about .btn-primary {
  width: 290px;
  padding: 20px !important;
  background: rgb(197, 146, 65) !important;
  border: none !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 27px !important;
  letter-spacing: 0.72px !important;
  text-transform: capitalize !important;
  color: rgb(0, 0, 0) !important;
  transition: background-color 0.3s ease;
}

#about .btn-primary:hover {
  background: rgb(216, 176, 109) !important;
}

/* ===== TESTIMONIALS SECTION ===== */
.testimonial-section {
  padding: 107px 0;
  background: #d8b06d;
}

.testimonial-section .container-fluid {
  padding: 0 100px !important;
}

.testimonial-section p {
  font-size: 24px;
  color: rgb(0, 0, 0);
  letter-spacing: 13.6px;

  font-weight: 400;
  margin-bottom: 10px;
}

.testimonial-section h2 {
  font-size: 34px;
  color: rgb(30, 30, 30);
  letter-spacing: 13.6px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}

/* Testimonial cards */
.testimonial-section .position-relative {
  position: relative;
  height: 400px;
}

/* 🔒 LOCK ALL TESTIMONIAL CARD SIZES */
.testimonial-section .position-absolute {
  height: 340px; /* adjust if needed */
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.testimonial-section .position-absolute:first-child {
  left: 0;
  top: 12px;
  opacity: 0.7;
}

.testimonial-section .position-absolute:nth-child(2) {
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 462px; /* SAME as others */
  z-index: 2;
}

.testimonial-section .position-absolute:last-child {
  right: 0;
  top: 12px;
  opacity: 0.7;
}

/* Testimonial text */
.testimonial-section p.text-center {
  max-height: 110px;
  overflow: hidden;
}

/* Testimonial author */
.testimonial-section .d-flex.justify-content-center.align-items-center.gap-3 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}

.testimonial-section div[style*="width: 97px"] {
  width: 97px;
  height: 97px;
  border-radius: 50%;
  background: url("../images/testimonials.png") center/cover;
}

.testimonial-section div[style*="font-family: Inter"] p {
  font-size: 16px;
  margin-bottom: 0;
  letter-spacing: normal;
  text-transform: none;
  color: #000;
}

.testimonial-section div[style*="font-family: Inter"] p:first-child {
  font-weight: 600;
}

/* Pagination dots */
.testimonial-section .d-flex.justify-content-center.gap-2 {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 40px;
}

.testimonial-section .d-flex.justify-content-center.gap-2 > div {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.testimonial-section .d-flex.justify-content-center.gap-2 > div:first-child {
  background: rgb(0, 0, 0);
}

/* ===== MAP SECTION ===== */
section:has(img[alt="Location Map"]:last-child) img {
  width: 100%;
  height: auto;
}

/* ===== FAQ SECTION ===== */
#faq {
  padding: 54px 0 53px;
  display: none; /* Hidden by default as per HTML */
}

#faq .container-fluid {
  padding: 0 102px !important;
}

#faq h2 {
  font-size: 44px;
  font-weight: 300;
  color: rgb(197, 146, 65);
  margin-bottom: 60px;
}

/* FAQ accordion */
#faq .accordion-item {
  border-top: none !important;
  border-right: none !important;
  border-bottom: 1px solid rgb(216, 176, 109) !important;
  border-left: none !important;
  background: transparent !important;
}

#faq .accordion-header:first-child {
  background: rgb(237, 224, 193) !important;
  border-radius: 0 !important;
}

#faq .accordion-header:not(:first-child) {
  background: transparent !important;
  border-radius: 0 !important;
}

#faq .accordion-button {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 12px;
  background: transparent;
  border: none;
  cursor: pointer;
}

#faq h3 {
  font-size: 24px;
  font-weight: 400;
  color: rgb(0, 0, 0);
  margin: 0;
}

#faq svg[width="48"] {
  width: 48px;
  height: 50px;
  transform: rotate(180deg);
  transition: transform 0.3s;
}

#faq .collapsed svg[width="48"] {
  transform: rotate(0deg);
}

#faq .accordion-body {
  padding: 30px 20px;
  background: rgb(237, 224, 193);
  font-size: 14px;
  font-weight: 400;
  color: rgb(0, 0, 0);
}

/* ===== FOOTER ===== */
footer[style*="background: rgb(0, 0, 0)"] {
  padding: 99px 0 98px;
  background: rgb(0, 0, 0) !important;
}

footer .container-fluid {
  padding: 0 100px !important;
}

/* Footer logo */
footer .mb-4 img {
  width: 293px;
  height: auto;
}

/* Footer headings */
footer h5 {
  font-size: 20px;
  font-weight: 400;
  line-height: 38px;
  color: rgb(255, 255, 255);
  margin-bottom: 8px;
}

/* Footer text */
footer p,
footer li {
  font-size: 14px;
  font-weight: 400;
  color: rgb(255, 255, 255);
  margin-bottom: 0;
}

/* Footer links list */
footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

footer ul li {
  font-size: 16px;
  font-weight: 400;
  line-height: 34px;
  color: rgb(255, 255, 255);
  cursor: pointer;
  transition: color 0.3s ease;
}

footer ul li:hover {
  color: rgb(216, 176, 109);
}

/* Social icons */
footer .d-flex.gap-3 {
  display: flex;
  gap: 12px;
}

footer .d-flex.gap-3 img {
  width: 26px;
  height: 26px;
  cursor: pointer;
  transition: opacity 0.3s ease;
}

footer .d-flex.gap-3 img:hover {
  opacity: 0.8;
}

/* Disclaimer section */
footer > div > div:has(> strong) {
  padding: 30px 0;
  border-top: 1px solid rgb(148, 146, 146);
  border-bottom: 1px solid rgb(148, 146, 146);
  margin-bottom: 30px;
}

/* Copyright section */
footer .d-flex.justify-content-between.align-items-center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

footer .d-flex.justify-content-between.align-items-center p {
  font-size: 12px;
  font-weight: 400;
  line-height: 38px;
  text-transform: uppercase;
  color: rgb(255, 255, 255);
}

/* ===== UTILITY CLASSES ===== */

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 1200px) {
  .container-fluid {
    padding: 0 50px !important;
  }

  #crown .container-fluid,
  #highlights .container-fluid,
  .configurations-content,
  section:has(+ #gallery) .container-fluid,
  #gallery .container-fluid,
  #amenities .container-fluid,
  #location .container-fluid,
  #about .container-fluid,
  .testimonial-section .container-fluid,
  #faq .container-fluid,
  footer .container-fluid {
    padding: 0 50px !important;
  }

  #highlights h2,
  #about h2 {
    font-size: 36px;
  }
}

@media (max-width: 992px) {
  .container-fluid {
    padding: 0 30px !important;
  }

  #crown .container-fluid,
  #highlights .container-fluid,
  .configurations-content,
  section:has(+ #gallery) .container-fluid,
  #gallery .container-fluid,
  #amenities .container-fluid,
  #location .container-fluid,
  #about .container-fluid,
  .testimonial-section .container-fluid,
  #faq .container-fluid,
  footer .container-fluid {
    padding: 0 30px !important;
  }

  #highlights h2,
  #about h2 {
    font-size: 32px;
  }

  #highlights .col-lg-5 h3 {
    font-size: 36px;
  }

  .testimonial-section .position-absolute {
    width: 100%;
    position: relative !important;
    opacity: 1 !important;
    margin-bottom: 20px;
  }

  .testimonial-section .position-absolute:nth-child(2) {
    left: 0;
    transform: none;
    width: 100%;
  }

  .testimonial-section .position-relative {
    height: auto;
  }
}

@media (max-width: 768px) {
  .container-fluid {
    padding: 0 20px !important;
  }

  #crown .container-fluid,
  #highlights .container-fluid,
  .configurations-content,
  section:has(+ #gallery) .container-fluid,
  #gallery .container-fluid,
  #amenities .container-fluid,
  #location .container-fluid,
  #about .container-fluid,
  .testimonial-section .container-fluid,
  #faq .container-fluid,
  footer .container-fluid {
    padding: 0 12px !important;
  }

  #home {
    /* height: 400px; */
  }

  #highlights h2,
  #about h2 {
    font-size: 28px;
  }

  #highlights .col-lg-5 h3 {
    font-size: 28px;
  }

  .navbar-nav .nav-link {
    font-size: 12px !important;
    padding: 6px !important;
  }

  .btn-gold {
    font-size: 12px !important;
    padding: 4px 8px !important;
  }

  section:has(+ #gallery) div[style*="position: relative"] {
    height: 400px;
  }

  section:has(+ #gallery) img[alt="Walkthrough Video"] {
    height: 350px;
  }

  #amenities .text-center .btn-primary {
    width: 100%;
  }
}

@media (max-width: 576px) {
  #highlights h2,
  #about h2 {
    font-size: 24px;
  }

  #highlights .col-lg-5 h3 {
    font-size: 24px;
  }

  #highlights .col-lg-5 > div {
    padding: 20px;
  }

  #configurations .btn-primary,
  #about .btn-primary {
    width: 100%;
  }

  footer .d-flex.justify-content-between.align-items-center {
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }
}
.testimonialController {
  display: block !important;
  margin-top: 40px;
}

.testimonialController .swiper-pagination {
  position: static;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.testimonialController .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  background: rgba(0, 0, 0, 0.3);
  opacity: 1;
}

.testimonialController .swiper-pagination-bullet-active {
  background: #000;
}
.walkthrough-video {
  font-size: 44px;
  color: rgb(216, 176, 109);
  letter-spacing: 1.36px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}
.testimonial-heading {
  font-size: 44px;
  color: rgb(0, 0, 0);
  letter-spacing: 13.6px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 10px;
}
.gallery-heading {
  font-size: 44px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}
#location p {
  font-size: 44px;
  color: rgb(30, 30, 30);
  letter-spacing: 1.76px;
  text-transform: uppercase;
  font-weight: 400;
  margin-bottom: 40px;
}
#galleryDisplay img {
  max-width: 100%;
}

.floor-carousel {
  display: flex;
  gap: 30px;
  justify-content: center;
}

.floor-card {
  width: 260px;
  text-align: center;
  position: relative;
}

.floor-card img {
  width: 100%;
}

.floor-card.locked img {
  filter: blur(6px);
}

.lock-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lock-overlay button {
  background: white;
  padding: 12px 24px;
  border: none;
  cursor: pointer;
}
.configuration-heading-heading{
font-size: 44px;
    color: rgb(216, 176, 109);
    letter-spacing: 13.6px;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 10px;
  }