/* ==========================================================================
   THEME TOKENS - single source of truth for brand colours.
   Change a colour here and it updates everywhere. See /THEME_RULES.md.
   ========================================================================== */
:root {
  --wd-gold: #D9A752;         /* PRIMARY: main buttons, accents, highlights */
  --wd-gold-dark: #C8963F;    /* PRIMARY hover / pressed */
  --wd-gold-deep: #B8823A;    /* gold used as TEXT on light backgrounds */
  --wd-gold-soft: #FBF1DF;    /* gold tint: badges, icon circles */
  --wd-green: #10372B;        /* SECONDARY: dark buttons, dark sections */
  --wd-green-dark: #0B261E;   /* SECONDARY hover / pressed */
  --wd-on-primary: #10372B;   /* text / icons on gold (primary) buttons = secondary dark green. Literal: never swapped by the Blog page */
  --wd-heading: #10372B;      /* all h1 / h2 headings (secondary dark green). Literal on purpose: never swapped by the Blog page */
  --wd-primary-soft: #FBF1DF; /* light primary tint that is NOT swapped on the Blog page (hero band) */
}

/* ==========================================================================
   ATLASTRIP THEME DESIGN SYSTEM & BRAND TOKENS
   Reference: https://demo.egenslab.com/html/atlastrip/preview/main-home/
   ========================================================================== */

:root {
  --font-family-base: 'Plus Jakarta Sans', 'Inter', sans-serif;

  /* AtlasTrip Color Palette */
  --color-primary: var(--wd-gold);
  --color-primary-hover: var(--wd-gold-deep);
  --color-primary-light: var(--wd-gold-soft);

  --color-accent-yellow: #FFB800;
  --color-heading-dark: #101828;
  --color-body-text: #475467;
  --color-border-light: #EAECF0;

  --color-dark-bg: #09101D;
  --color-dark-navy: #0B1528;

  /* Legacy Theme Variable Overrides */
  --color-primary-hover: var(--wd-gold-deep);
  --color-primary-button-background: var(--wd-gold);
  --color-primary-button-border: var(--wd-gold);
  --color-primary-button-icon: var(--wd-gold);
  --color-primary-button-hover-background: var(--wd-gold-deep);
  --color-primary-button-hover-border: var(--wd-gold-deep);
  --color-primary-button-hover-icon: var(--wd-gold);

  --color-secondary-button-text: var(--wd-gold);
  --color-secondary-button-border: var(--wd-gold);
  --color-secondary-button-icon-background: var(--wd-gold);
  --color-secondary-button-hover-background: var(--wd-gold);
  --color-secondary-button-hover-border: var(--wd-gold);

  --pagination-item-active-background: var(--wd-gold);
  --pagination-item-active-border: var(--wd-gold);
  --swiper-navigation-background-color: var(--wd-gold);
  --swiper-navigation-hover-background-color: var(--wd-gold-deep);
  --swiper-pagination-color: var(--wd-gold);
}

/* Base Global Typography & Page Background */
body {
  font-family: var(--font-family-base) !important;
  color: #475467 !important;
  background-color: #FAF8F4 !important;
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6,
.heading {
  font-family: var(--font-family-base) !important;
  color: #101828 !important;
  letter-spacing: -0.3px;
}

/* ==========================================================================
   AtlasTrip Header & Navigation Bar
   ========================================================================== */

/* Top Utility Announcement Bar */
.top-utility-bar {
  background-color: #09101D;
  color: #FFFFFF;
  padding: 8px 0;
  font-size: 12.5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.top-utility-bar .rating-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 184, 0, 0.15);
  color: #FFB800;
  padding: 3px 12px;
  border-radius: 50px;
  font-weight: 600;
}

.top-utility-bar .utility-links {
  display: flex;
  align-items: center;
  gap: 20px;
}

.top-utility-bar .utility-links a {
  color: #94A3B8;
  text-decoration: none;
  transition: color 0.25s ease;
}

.top-utility-bar .utility-links a:hover {
  color: #FFFFFF;
}

/* Main Header */
.header-1 {
  --color-background: #FFFFFF !important;
  --color-foreground: #101828 !important;
  --color-foreground-heading: #101828 !important;
  --color-primary-hover: var(--wd-gold) !important;

  background-color: #FFFFFF !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid #EAECF0 !important;
  box-shadow: 0 4px 20px rgba(9, 16, 29, 0.04) !important;

  position: relative !important;
  z-index: 100 !important;
}

.header-1 .header-grid {
  grid-template-columns: 220px 1fr auto;
  align-items: center;
}

.header-1 .menu-link-main {
  padding: 26px 14px !important;
  white-space: nowrap;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #101828 !important;
  transition: all 0.25s ease !important;
  border-radius: 8px;
}

.header-1 .menu-link-main:hover,
.header-1 .nav-item:hover>.menu-link-main,
.header-1 .menu-link-main.active {
  color: var(--wd-gold) !important;
  background-color: var(--wd-gold-soft) !important;
}

.header-menu {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Desktop: nav items sit in a single horizontal row. */
@media (min-width: 992px) {
  .header-menu {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
}

/* Mobile drawer: nav items stack as a normal vertical list instead of
   overflowing sideways off-screen. */
@media (max-width: 991px) {
  .header-menu {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 0 !important;
  }
}

.header-logo img {
  max-height: 52px !important;
  height: auto;
  width: auto;
  object-fit: contain;
}

/* Header Buttons */
.btn-header-cta {
  background-color: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 10px 24px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.3) !important;
  border: none !important;
}

.btn-header-cta:hover {
  background-color: var(--wd-gold-deep) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(217, 167, 82, 0.45) !important;
}

/* ==========================================================================
   5-Star Luxury Hero Page Banner System
   ========================================================================== */

.page-banner {
  position: relative !important;
  width: 100% !important;
  min-height: 280px !important;
  padding: 80px 0 60px 0 !important;
  background: linear-gradient(135deg, #09101D 0%, var(--wd-green) 100%) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 60px !important;
}

.destination-details {
  position: relative !important;
  padding-top: 40px !important;
  margin-top: 0 !important;
  display: block !important;
  clear: both !important;
}

.page-banner .media-bg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  margin: 0 !important;
}

.page-banner .media-bg img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  filter: brightness(0.4) contrast(1.1) !important;
}

.page-banner::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(9, 16, 29, 0.35) 0%, rgba(9, 16, 29, 0.75) 100%) !important;
  z-index: 2 !important;
}

.page-banner-content {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
}

.page-banner-content h1,
.page-banner-content .heading {
  font-size: 38px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 12px !important;
  text-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}

.page-banner-content .breadcrumb {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  padding: 8px 22px !important;
  border-radius: 50px !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  margin: 0 !important;
}

.page-banner-content .breadcrumb li,
.page-banner-content .breadcrumb a {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.page-banner-content .breadcrumb a:hover {
  color: #FFFFFF !important;
}

.page-banner-content .breadcrumb .active {
  color: #F0C878 !important;
}

/* Mega Dropdown AtlasTrip Style */
.header-1 .header-megamenu {
  width: 960px !important;
  max-width: 92vw !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  padding: 0 !important;
  background-color: #FFFFFF !important;
  border-radius: 20px !important;
  box-shadow: 0 20px 60px rgba(9, 16, 29, 0.12) !important;
  border: 1px solid #EAECF0 !important;
  overflow: hidden !important;
}

/* Simple "Properties" nav dropdown — a normal single-column list instead
   of the old full-width megamenu. The scroll/width rules only apply on
   desktop (where this renders as a floating hover panel); on mobile the
   theme's own drawer-menu JS controls it as an expand/collapse accordion
   via an inline max-height, so !important overrides here must not fight
   that — otherwise the panel stays permanently open and un-clickable. */
.properties-dropdown-all {
  color: var(--wd-gold) !important;
  font-weight: 700 !important;
  border-top: 1px solid #EAECF0 !important;
}

@media (min-width: 992px) {
  .properties-dropdown {
    max-height: 360px !important;
    overflow-y: auto !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 40px rgba(9, 16, 29, 0.14) !important;
    border: 1px solid #EAECF0 !important;
  }

  .properties-dropdown .menu-link {
    white-space: nowrap !important;
  }
}

.megamenu-split-wrapper {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
}

.megamenu-brand-sidebar {
  flex: 0 0 260px !important;
  background: linear-gradient(150deg, #09101D 0%, #0B1528 100%) !important;
  padding: 32px 26px !important;
  color: #FFFFFF !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  border-right: 1px solid rgba(217, 167, 82, 0.2) !important;
}

.megamenu-brand-sidebar .brand-tag {
  color: var(--wd-gold);
  background: var(--wd-gold-soft);
  padding: 4px 12px;
  border-radius: 50px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 12px;
}

.megamenu-brand-sidebar .brand-title {
  color: #FFFFFF !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  margin-bottom: 10px !important;
}

.megamenu-brand-sidebar .brand-desc {
  color: #94A3B8 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  margin-bottom: 24px !important;
}

.btn-megamenu-all {
  background-color: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 11px 20px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 15px rgba(217, 167, 82, 0.3) !important;
}

.btn-megamenu-all:hover {
  background-color: #FFFFFF !important;
  color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
}

.megamenu-states-container {
  flex: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  padding: 28px 24px !important;
  background-color: #FFFFFF !important;
}

.megamenu-state-col {
  display: flex !important;
  flex-direction: column !important;
}

.state-badge-header {
  margin-bottom: 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 2px solid #F1F5F9 !important;
}

.state-name {
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1.2px !important;
  color: var(--wd-gold) !important;
  text-transform: uppercase !important;
  display: block !important;
}

.state-properties-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.mega-property-card {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  background-color: #F8FAFC !important;
  border: 1px solid #F1F5F9 !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.mega-property-card:hover {
  background-color: var(--wd-gold-soft) !important;
  border-color: var(--wd-gold) !important;
  transform: translateX(3px) !important;
}

.mega-property-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  flex-grow: 1 !important;
  padding-right: 6px !important;
  text-align: left !important;
}

.mega-property-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  line-height: 1.35 !important;
  display: block !important;
  transition: color 0.2s ease !important;
}

.mega-property-card:hover .mega-property-title {
  color: var(--wd-gold) !important;
}

.mega-property-sub {
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #64748B !important;
  display: block !important;
  line-height: 1.25 !important;
}

.mega-property-arrow {
  color: #94A3B8 !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
}

.mega-property-card:hover .mega-property-arrow {
  color: var(--wd-gold) !important;
  transform: translateX(3px) !important;
}

/* ==========================================================================
   AtlasTrip Hero Banner Slider & Search Widget
   ========================================================================== */

/* Global Page Background Cleanliness */
body,
#root,
.page-wrapper,
main {
  background-color: #FAF8F4 !important;
}

/* Header Action Buttons (Atlastrip style) */
.btn-header-ai {
  background: #F8FAFC !important;
  border: 1px solid #EAECF0 !important;
  color: #101828 !important;
  padding: 8px 18px !important;
  border-radius: 50px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-header-ai:hover {
  background: var(--wd-gold-soft) !important;
  border-color: var(--wd-gold) !important;
  color: var(--wd-gold) !important;
}

.btn-header-phone {
  background: var(--wd-gold) !important;
  border: 1px solid var(--wd-gold) !important;
  color: #FFFFFF !important;
  padding: 8px 22px !important;
  border-radius: 50px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.35) !important;
  transition: all 0.25s ease !important;
}

.btn-header-phone:hover {
  background: var(--wd-gold-deep) !important;
  border-color: var(--wd-gold-deep) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(217, 167, 82, 0.5) !important;
}

/* ==========================================================================
   Hero Slider Outer Container & Centered Text (No Background Image Leaking)
   ========================================================================== */

.hero-slider-outer {
  max-width: 100% !important;
  width: 100% !important;
  margin: 15px auto 0 auto !important;
  padding: 0 24px !important;
  position: relative !important;
  background-color: transparent !important;
}

@media (max-width: 768px) {
  .hero-slider-outer {
    padding: 0 12px !important;
    margin-top: 5px !important;
  }

  .hero-slider-outer .hero-slider,
  .hero-slider-outer .hero-slider .swiper,
  .hero-slider-outer .hero-slider .swiper-wrapper,
  .hero-slider-outer .hero-slider .swiper-slide,
  .hero-slider-outer .slider-card {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
  }
}

/* Strictly clip Swiper, Slides and Images to prevent any image leakage outside the rounded box */
.hero-slider-outer .hero-slider,
.hero-slider-outer .hero-slider .swiper,
.hero-slider-outer .hero-slider .swiper-wrapper,
.hero-slider-outer .hero-slider .swiper-slide {
  border-radius: 28px !important;
  overflow: hidden !important;
  position: relative !important;
  background-color: transparent !important;
  height: 760px !important;
  min-height: 760px !important;
  max-height: 760px !important;
}

.hero-slider-outer .hero-slider {
  box-shadow: 0 15px 40px rgba(9, 16, 29, 0.15) !important;
  height: 760px !important;
  min-height: 760px !important;
  max-height: 760px !important;
}

.hero-slider-outer .slider-card {
  min-height: 760px !important;
  height: 760px !important;
  max-height: 760px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  border-radius: 28px !important;
  overflow: hidden !important;
}

.hero-slider-outer .slider-media {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  border-radius: 28px !important;
  overflow: hidden !important;
}

.hero-slider-outer .slider-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  transform: translateZ(0) scale(1.001) !important;
  backface-visibility: hidden !important;
  border-radius: 28px !important;
}

.hero-slider-outer .slider-card.overlay::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: radial-gradient(circle at center, rgba(9, 16, 29, 0.45) 0%, rgba(9, 16, 29, 0.8) 100%) !important;
  z-index: 2 !important;
  border-radius: 28px !important;
}

.hero-slider-outer .slider-content {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-slider-outer .hero-content-wrapper {
  position: relative !important;
  z-index: 4 !important;
  max-width: 860px !important;
  margin: 0 auto !important;
  padding-top: 25px !important;
  padding-bottom: 45px !important;
  text-align: center !important;
}

.hero-slider-outer .hero-title {
  color: #FFFFFF !important;
  font-size: 48px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  min-height: 2.3em !important;
  margin-bottom: 12px !important;
  letter-spacing: -1.2px !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 768px) {
  .hero-slider-outer .hero-title {
    font-size: 30px !important;
  }
}

.hero-slider-outer .hero-desc {
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 16.5px !important;
  line-height: 1.5 !important;
  min-height: 3em !important;
  margin: 0 auto 16px auto !important;
  max-width: 740px !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.hero-cta-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 8px !important;
}

.btn-hero-gold {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 15px 28px !important;
  border-radius: 50px !important;
  border: none !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-hero-gold:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.45) !important;
}

.btn-hero-outline-light {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 15px 28px !important;
  border-radius: 50px !important;
  border: 1.5px solid rgba(255, 255, 255, 0.75) !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-hero-outline-light:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #FFFFFF !important;
  border-color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}

/* Custom Swiper Controls */
.hero-slider-nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 50px !important;
  height: 50px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #101828 !important;
  border: 1px solid rgba(255, 255, 255, 0.8) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 35 !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
}

.hero-prev-btn {
  left: 30px !important;
}

.hero-next-btn {
  right: 30px !important;
}

.hero-slider-nav:hover {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  transform: translateY(-50%) scale(1.1) !important;
  box-shadow: 0 10px 30px rgba(217, 167, 82, 0.5) !important;
}

.hero-slider .swiper-pagination {
  bottom: 25px !important;
  z-index: 25 !important;
}

.hero-slider .swiper-pagination-bullet-active {
  background: var(--wd-gold) !important;
  width: 34px !important;
  border-radius: 8px !important;
}

/* ==========================================================================
   AtlasTrip Hero Search Filter Widget (Matching Reference Screenshot)
   ========================================================================== */

.atlastrip-hero-search-wrapper {
  position: relative !important;
  margin-top: -65px !important;
  z-index: 10 !important;
  margin-bottom: 60px !important;
}

@media (max-width: 991px) {
  .atlastrip-hero-search-wrapper {
    margin-top: 20px !important;
  }
}

.atlastrip-search-card {
  background: #FFFFFF !important;
  border-radius: 24px !important;
  padding: 24px 30px 20px 30px !important;
  box-shadow: 0 20px 50px rgba(9, 16, 29, 0.12) !important;
  border: 1px solid #EAECF0 !important;
  max-width: 1220px !important;
  margin: 0 auto !important;
}

/* Category Filter Tabs */
.atlastrip-search-tabs {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 20px !important;
  flex-wrap: wrap !important;
}

.atlastrip-tab-pill {
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  border: 1px solid transparent !important;
  padding: 9px 20px !important;
  border-radius: 50px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

.atlastrip-tab-pill:hover,
.atlastrip-tab-pill.active {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 4px 16px rgba(217, 167, 82, 0.35) !important;
}

/* Search Input Box Grid */
.atlastrip-search-boxes-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 150px !important;
  gap: 16px !important;
  align-items: center !important;
}

@media (max-width: 991px) {
  .atlastrip-search-boxes-grid {
    grid-template-columns: 1fr !important;
  }
}

.atlastrip-input-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 14px !important;
  padding: 12px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  transition: all 0.25s ease !important;
  min-height: 62px !important;
}

.atlastrip-input-card:hover,
.atlastrip-input-card:focus-within {
  border-color: var(--wd-gold) !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.12) !important;
}

.atlastrip-input-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: #F8FAFC !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 17px !important;
  flex-shrink: 0 !important;
}

.atlastrip-input-body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  overflow: hidden !important;
}

.atlastrip-input-body select,
.atlastrip-input-body input {
  border: none !important;
  background: transparent !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #101828 !important;
  outline: none !important;
  cursor: pointer !important;
  width: 100% !important;
  padding: 0 !important;
  margin-bottom: 2px !important;
}

.atlastrip-input-subtext {
  font-size: 12px !important;
  color: #64748B !important;
  font-weight: 500 !important;
  display: block !important;
}

.btn-atlastrip-search-main {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 16px 24px !important;
  border-radius: 14px !important;
  border: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 18px rgba(217, 167, 82, 0.35) !important;
  text-decoration: none !important;
  height: 100% !important;
  min-height: 62px !important;
}

.btn-atlastrip-search-main:hover {
  background: var(--wd-gold-deep) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(217, 167, 82, 0.5) !important;
}

.atlastrip-search-footer-note {
  margin-top: 16px !important;
  font-size: 13px !important;
  color: #64748B !important;
  text-align: left !important;
}

.atlastrip-search-footer-note .promo-highlight,
.atlastrip-search-footer-note strong {
  color: var(--wd-gold) !important;
  font-weight: 700 !important;
}

.btn-atlastrip-search {
  background: var(--wd-gold);
  color: #FFFFFF !important;
  font-size: 15px;
  font-weight: 700;
  padding: 14px 30px;
  border-radius: 50px;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  transition: all 0.3s ease;
  box-shadow: 0 4px 18px rgba(217, 167, 82, 0.35);
  text-decoration: none !important;
}

.btn-atlastrip-search:hover {
  background: var(--wd-gold-deep);
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(217, 167, 82, 0.5);
}

/* ==========================================================================
   Section Headings & AtlasTrip Pill Sub-tags
   ========================================================================== */

.section-sub-tag {
  color: var(--wd-gold) !important;
  background-color: var(--wd-gold-soft) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  display: inline-block !important;
  margin-bottom: 14px !important;
}

.section-main-title {
  color: #101828 !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 18px !important;
}

@media (max-width: 768px) {
  .section-main-title {
    font-size: 30px !important;
  }
}

.section-body-text {
  color: #475467 !important;
  font-size: 16.5px !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
  margin-bottom: 28px !important;
}

/* ==========================================================================
   About Section & About Us Page 5-Star Luxury System
   ========================================================================== */

.luxury-about-image-wrap {
  position: relative !important;
  display: block !important;
}

.luxury-about-main-img {
  width: 100% !important;
  height: var(--about-img-height, auto) !important;
  min-height: 400px !important;
  border-radius: 24px !important;
  box-shadow: 0 20px 50px rgba(9, 16, 29, 0.12) !important;
  object-fit: cover !important;
}

.luxury-about-sm-img-box {
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 4px solid #FFFFFF !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15) !important;
}

/* ==========================================================================
   Trust Highlights Static 4-Grid (Above OUR STORY & PHILOSOPHY)
   ========================================================================== */

.home-trust-features-bar {
  margin-bottom: 45px !important;
  position: relative !important;
  width: 100% !important;
}

.home-trust-features-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  width: 100% !important;
}

.home-trust-feature-item {
  width: 100% !important;
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 0 !important;
  padding: 10px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: 0 4px 16px rgba(9, 16, 29, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  cursor: default !important;
}

.home-trust-feature-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(217, 167, 82, 0.15) !important;
}

.home-trust-feature-item .feature-check-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 6px rgba(217, 167, 82, 0.2) !important;
}

.home-trust-feature-item .feature-content {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
}

.home-trust-feature-item .feature-value {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--wd-gold) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.3px !important;
}

.home-trust-feature-item .feature-text {
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0F172A !important;
  line-height: 1.3 !important;
  letter-spacing: -0.2px !important;
  white-space: nowrap !important;
}

@media (max-width: 1200px) {
  .home-trust-features-grid {
    gap: 12px !important;
  }
  .home-trust-feature-item {
    padding: 10px 14px !important;
    gap: 10px !important;
  }
  .home-trust-feature-item .feature-text {
    font-size: 12.5px !important;
  }
}

@media (max-width: 991px) {
  .home-trust-features-bar {
    margin-bottom: 32px !important;
  }
  .home-trust-features-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  .home-trust-feature-item .feature-text {
    white-space: normal !important;
  }
}

@media (max-width: 575px) {
  .home-trust-features-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .home-trust-feature-item {
    padding: 10px 16px !important;
  }
  .home-trust-feature-item .feature-text {
    font-size: 13px !important;
  }
}

.about-features-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 14px 18px !important;
  margin-top: 24px !important;
  margin-bottom: 28px !important;
}

@media (max-width: 576px) {
  .about-features-grid {
    grid-template-columns: 1fr !important;
  }
}

.about-feature-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: #F8FAFC !important;
  border: 1px solid #EAECF0 !important;
  padding: 12px 18px !important;
  border-radius: 14px !important;
  transition: all 0.25s ease !important;
}

.about-feature-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(217, 167, 82, 0.12) !important;
}

.feature-check-icon {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.feature-text {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #1E293B !important;
}

.luxury-philosophy-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  padding: 32px 24px !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.05) !important;
  height: 100% !important;
  margin-bottom: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  text-align: left !important;
  position: relative !important;
}

.luxury-philosophy-card:hover {
  transform: translateY(-8px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.16) !important;
}

.philosophy-icon-badge {
  width: 54px !important;
  height: 54px !important;
  border-radius: 16px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 22px !important;
  transition: all 0.3s ease !important;
  flex-shrink: 0 !important;
}

.luxury-philosophy-card:hover .philosophy-icon-badge {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  transform: scale(1.1) rotate(4deg) !important;
}

.philosophy-card-title {
  color: #0F172A !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  line-height: 1.25 !important;
  letter-spacing: -0.3px !important;
  text-align: left !important;
}

.philosophy-card-desc {
  color: #475467 !important;
  font-size: 14.5px !important;
  line-height: 1.65 !important;
  margin: 0 !important;
  text-align: left !important;
}

.founder-title-badge {
  display: inline-block !important;
  margin-bottom: 22px !important; /* space before the bio text */
  background: var(--wd-gold-soft) !important;
  border: 1px solid rgba(217, 167, 82, 0.3) !important;
  color: var(--wd-gold) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 8px 20px !important;
  border-radius: 50px !important;
}

.team-social-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 14px !important;
}

.team-social-btn {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #F8FAFC !important;
  border: 1px solid #EAECF0 !important;
  color: #475467 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}

.team-social-btn:hover {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 6px 16px rgba(217, 167, 82, 0.35) !important;
  transform: translateY(-2px) !important;
}

.luxury-team-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  text-align: center !important;
  box-shadow: 0 10px 28px rgba(9, 16, 29, 0.06) !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-team-card:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 18px 40px rgba(217, 167, 82, 0.18) !important;
}

.team-card-img-wrap {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
}

.team-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-team-card:hover .team-card-img {
  transform: scale(1.08) !important;
}

.team-card-body {
  padding: 20px !important;
}

.team-card-name {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 4px !important;
}

.team-card-role {
  font-size: 13.5px !important;
  color: var(--wd-gold) !important;
  font-weight: 600 !important;
  margin-bottom: 0 !important;
}

.team-card-body .team-social-row {
  justify-content: center !important;
}

/* ==========================================================================
   Wedding & Events — Admin-Managed Showcase Cards
   ========================================================================== */

.event-showcase-card {
  border-radius: 20px !important;
  padding: 44px !important;
  margin-bottom: 32px !important;
}

.event-showcase-card:last-child {
  margin-bottom: 0 !important;
}

.event-showcase-card.event-showcase-dark {
  background: linear-gradient(135deg, #09101D 0%, var(--wd-green) 100%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.16) !important;
}

.event-showcase-card.event-showcase-light {
  background: #FFFFFF !important;
  border: 1.5px solid #EAECF0 !important;
  box-shadow: 0 10px 28px rgba(9, 16, 29, 0.06) !important;
}

.event-showcase-img {
  width: 100% !important;
  height: 320px !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  display: block !important;
}

.event-showcase-title {
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  margin-bottom: 10px !important;
}

.event-showcase-dark .event-showcase-title {
  color: #FFFFFF !important;
}

.event-showcase-light .event-showcase-title {
  color: #0F172A !important;
}

.event-showcase-subtitle {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--wd-gold) !important;
  margin-bottom: 18px !important;
}

.event-showcase-desc {
  font-size: 15px !important;
  line-height: 1.75 !important;
  margin-bottom: 16px !important;
}

.event-showcase-desc:last-child {
  margin-bottom: 0 !important;
}

.event-showcase-dark .event-showcase-desc {
  color: rgba(255, 255, 255, 0.85) !important;
}

.event-showcase-light .event-showcase-desc {
  color: #475467 !important;
}

@media (max-width: 991px) {
  .event-showcase-card {
    padding: 28px !important;
  }

  .event-showcase-img {
    height: 220px !important;
    margin-bottom: 24px !important;
  }
}

/* ==========================================================================
   Section-wise Scroll Snap — the actual snapping is driven by JS
   (see frontend/src/hooks/useSectionScrollSnap.js, wired up in
   MainLayout.jsx for every public page). Native CSS `scroll-snap-type:
   mandatory` was tried first but traps normal mouse-wheel scrolling: each
   discrete wheel tick re-snaps to the same spot instead of progressing, so
   it was replaced with a JS wheel handler that animates to the next/
   previous section and can never get stuck. `scroll-behavior: smooth`
   here just makes any *other* scroll (keyboard, links, browser back/
   forward) glide instead of jumping, and has no snapping behaviour.
   ========================================================================== */

html {
  scroll-behavior: smooth;
}

/* ==========================================================================
   Home Page Section Bands — full-width background colour behind each major
   section, alternating cream/white for visual rhythm. Applied directly on
   the section's own full-bleed wrapper (not inside .container), so the
   colour spans edge-to-edge while the content inside stays centered as
   normal. Scoped to these two classes so no other page is affected.
   ========================================================================== */

.home-band-cream {
  background: #FAF8F4 !important;
  padding: 80px 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.home-band-white {
  background: #FFFFFF !important;
  padding: 80px 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .home-band-cream,
  .home-band-white {
    padding: 50px 0 !important;
  }
}

/* Feature items pop cleanly as white cards on cream band */
.home-band-cream .about-feature-item {
  background: #FFFFFF !important;
  border-color: #EAECF0 !important;
}

/* When a band sits immediately after the page banner, .page-banner's own
   60px margin-bottom leaves a plain white strip in front of the colour.
   Pull the band up to close that gap without touching .page-banner itself
   (which every other page still relies on for normal spacing). */
.home-band-after-banner {
  margin-top: -60px !important;
}

/* ==========================================================================
   Why Wanderama — Homepage Section (dynamic, admin-managed via About Page
   Content Editor)
   ========================================================================== */

.why-wanderama-row {
  align-items: flex-start !important;
}

.why-wanderama-col-img {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

.why-wanderama-image-wrap {
  position: relative !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  width: 100% !important;
  box-shadow: 0 20px 48px rgba(9, 16, 29, 0.09) !important;
  background: #EAE6DF !important;
}

.why-wanderama-image-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.why-wanderama-image-wrap:hover img {
  transform: scale(1.04) !important;
}

.why-wanderama-col-content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

.why-wanderama-content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding-left: 0 !important;
  height: auto !important;
}

@media (min-width: 992px) {
  .why-wanderama-content {
    padding-left: 14px !important;
  }
}

.why-sub-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(217, 167, 82, 0.12) !important;
  color: #B58428 !important;
  border: 1px solid rgba(217, 167, 82, 0.28) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.4px !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
  align-self: flex-start !important;
}

.why-tag-dot {
  color: var(--wd-gold) !important;
  font-size: 11px !important;
}

.why-main-heading {
  font-size: clamp(26px, 2.6vw, 36px) !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-bottom: 14px !important;
}

.why-lead-text {
  font-size: 15px !important;
  color: #475467 !important;
  line-height: 1.65 !important;
  margin-bottom: 24px !important;
}

.why-wanderama-features {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 0 30px 0 !important;
}

/* If odd number of items, the last item spans both columns for perfect symmetry */
.why-wanderama-features > .why-feature-item:nth-child(odd):last-child {
  grid-column: 1 / -1 !important;
}

.why-feature-item {
  background: #FFFFFF !important;
  border: 1px solid rgba(217, 167, 82, 0.22) !important;
  border-radius: 16px !important;
  padding: 16px 18px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  height: 100% !important;
  box-shadow: 0 4px 16px rgba(9, 16, 29, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.why-feature-item:hover {
  border-color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(217, 167, 82, 0.16) !important;
}

.why-feature-number {
  flex-shrink: 0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: var(--wd-gold) !important;
  background: var(--wd-green) !important;
  border: 1px solid rgba(217, 167, 82, 0.35) !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 10px rgba(16, 55, 43, 0.25) !important;
  transition: all 0.3s ease !important;
}

.why-feature-item:hover .why-feature-number {
  background: var(--wd-gold) !important;
  color: var(--wd-green) !important;
  border-color: var(--wd-green) !important;
}

.why-feature-text-block {
  flex: 1 !important;
  min-width: 0 !important;
}

.why-feature-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.3 !important;
}

.why-feature-desc {
  font-size: 13px !important;
  color: #64748B !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

.why-button-wrap {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

.btn-why-wanderama {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 13px 32px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  align-self: flex-start !important;
  box-shadow: 0 6px 20px rgba(217, 167, 82, 0.35) !important;
  margin: 0 !important;
}

.btn-why-wanderama .btn-arrow-icon {
  transition: transform 0.25s ease !important;
}

.btn-why-wanderama:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(217, 167, 82, 0.5) !important;
}

.btn-why-wanderama:hover .btn-arrow-icon {
  transform: translateX(4px) !important;
}

@media (max-width: 991px) {
  .why-wanderama-col-img {
    height: auto !important;
    margin-bottom: 32px !important;
  }

  .why-wanderama-image-wrap {
    height: 380px !important;
    min-height: 380px !important;
  }

  .why-wanderama-image-wrap img {
    position: relative !important;
    height: 100% !important;
  }
}

@media (max-width: 640px) {
  .why-wanderama-section {
    padding: 60px 0 !important;
  }

  .why-wanderama-image-wrap {
    height: 280px !important;
    min-height: 280px !important;
    border-radius: 18px !important;
  }

  .why-wanderama-features {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .btn-why-wanderama {
    width: 100% !important;
  }
}

/* ==========================================================================
   Group Travel (Corporate & School) — Static Home Page Section
   ========================================================================== */

.group-travel-section {
  background: #FFFFFF !important;
  padding: 80px 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .group-travel-section {
    padding: 50px 0 !important;
  }
}

.group-travel-header .section-main-title {
  font-size: 34px !important;
}

.group-travel-header .section-body-text {
  padding-top: 4px !important;
}

.group-travel-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 16px !important;
  padding: 28px 24px !important;
  height: 100% !important;
  transition: all 0.3s ease !important;
}

.group-travel-card:hover {
  border-color: var(--wd-gold) !important;
  box-shadow: 0 12px 30px rgba(217, 167, 82, 0.14) !important;
  transform: translateY(-4px) !important;
}

.group-travel-card-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 10px !important;
}

.group-travel-card-desc {
  font-size: 14px !important;
  color: #64748B !important;
  line-height: 1.6 !important;
  margin-bottom: 18px !important;
}

.group-travel-card-link {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--wd-gold) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.group-travel-card-link:hover {
  color: var(--wd-gold-dark) !important;
  text-decoration: underline !important;
}

.luxury-stat-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  padding: 30px 20px !important;
  box-shadow: 0 8px 24px rgba(9, 16, 29, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  margin-bottom: 24px !important;
}

.luxury-stat-card:hover {
  transform: translateY(-5px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 16px 32px rgba(217, 167, 82, 0.15) !important;
}

.stat-number {
  font-size: 42px !important;
  font-weight: 800 !important;
  color: var(--wd-gold) !important;
  margin-bottom: 6px !important;
  line-height: 1 !important;
}

.stat-label {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #64748B !important;
  margin: 0 !important;
}

.amenity-card-luxury {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  padding: 30px 24px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 8px 25px rgba(9, 16, 29, 0.03) !important;
  position: relative !important;
  overflow: hidden !important;
}

.amenity-card-luxury:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 15px 40px rgba(217, 167, 82, 0.15) !important;
}

.amenity-icon-badge {
  width: 54px !important;
  height: 54px !important;
  border-radius: 14px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 20px !important;
  transition: all 0.3s ease !important;
}

.amenity-card-luxury:hover .amenity-icon-badge {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  transform: scale(1.08) rotate(3deg);
}

.amenity-card-title {
  color: #101828 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  line-height: 1.3 !important;
}

.amenity-card-desc {
  color: #64748B !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.luxury-property-amenity-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: #F8FAFC !important;
  border: 1px solid #EAECF0 !important;
  padding: 12px 18px !important;
  border-radius: 14px !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  height: 100% !important;
}

.luxury-property-amenity-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(217, 167, 82, 0.12) !important;
}

.property-amenity-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transition: all 0.25s ease !important;
}

.luxury-property-amenity-item:hover .property-amenity-icon {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
}

.property-amenity-name {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #1E293B !important;
  line-height: 1.3 !important;
}

/* ==========================================================================
   5-Star Luxury Gallery & Visual Showcase System
   ========================================================================== */

.gallery-filter-navigation {
  position: relative !important;
  z-index: 10 !important;
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

.gallery-filter-pills {
  background: #FFFFFF !important;
  border: 1.5px solid #EAECF0 !important;
  padding: 6px 10px !important;
  border-radius: 60px !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.06) !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 4px !important;
}

.gallery-tab-btn {
  background: transparent !important;
  color: #64748B !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 9px 20px !important;
  border-radius: 50px !important;
  border: none !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  cursor: pointer !important;
  outline: none !important;
  white-space: nowrap !important;
}

.gallery-tab-btn:hover {
  color: var(--wd-gold) !important;
  background: #F8FAFC !important;
}

.gallery-tab-btn.active {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(217, 167, 82, 0.28) !important;
}

.luxury-gallery-card {
  position: relative !important;
  display: block !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 10px 28px rgba(9, 16, 29, 0.06) !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  border: 1px solid #EAECF0 !important;
}

.luxury-gallery-card:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 18px 40px rgba(217, 167, 82, 0.18) !important;
}

.gallery-img-wrap {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
}

.gallery-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-gallery-card:hover .gallery-card-img {
  transform: scale(1.08) !important;
}

.gallery-card-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(8, 14, 24, 0.05) 30%, rgba(8, 14, 24, 0.75) 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.35s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
}

.luxury-gallery-card:hover .gallery-card-overlay {
  opacity: 1 !important;
}

.gallery-zoom-icon {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
  transform: scale(0.8) !important;
  transition: transform 0.3s ease !important;
}

.luxury-gallery-card:hover .gallery-zoom-icon {
  transform: scale(1) !important;
}

.gallery-cat-badge {
  position: absolute !important;
  bottom: 16px !important;
  left: 16px !important;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(8px) !important;
  color: #0F172A !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  padding: 4px 12px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Luxury Video Cards */
.luxury-video-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.05) !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  height: 100% !important;
}

.luxury-video-card:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.16) !important;
}

.video-poster-wrap {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 16 / 10 !important;
  overflow: hidden !important;
}

.video-poster-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.5s ease !important;
}

.luxury-video-card:hover .video-poster-img {
  transform: scale(1.06) !important;
}

.video-poster-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(8, 14, 24, 0.35) !important;
}

.luxury-play-btn {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.45) !important;
  transition: all 0.3s ease !important;
  padding-left: 4px !important;
  cursor: pointer !important;
}

.luxury-play-btn:hover {
  transform: translate(-50%, -50%) scale(1.12) !important;
  background: #F0C878 !important;
  color: #080E18 !important;
}

.video-card-body {
  padding: 24px 20px !important;
  text-align: left !important;
}

.video-card-title {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 8px !important;
}

.video-card-caption {
  font-size: 14px !important;
  color: #64748B !important;
  margin: 0 !important;
  line-height: 1.55 !important;
}

/* Luxury Video Modal */
.luxury-video-modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(8, 14, 24, 0.88) !important;
  backdrop-filter: blur(8px) !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
}

.luxury-video-modal-content {
  position: relative !important;
  width: 100% !important;
  max-width: 920px !important;
  background: #000000 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5) !important;
}

.luxury-video-modal-close {
  position: absolute !important;
  top: 15px !important;
  right: 15px !important;
  z-index: 10 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(0, 0, 0, 0.6) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #FFFFFF !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
}

.luxury-video-modal-close:hover {
  background: #EF4444 !important;
  border-color: #EF4444 !important;
}

/* ==========================================================================
   5-Star Luxury Testimonials Card System
   ========================================================================== */

.luxury-testimonial-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  padding: 32px 28px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.04) !important;
  position: relative !important;
}

.luxury-testimonial-card:hover {
  transform: translateY(-8px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.16) !important;
}

.testimonial-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 18px !important;
}

.testimonial-quote-icon {
  display: flex !important;
  align-items: center !important;
}

.testimonial-stay-property {
  display: inline-block !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 5px 14px !important;
  border-radius: 50px !important;
  margin-bottom: 16px !important;
  border: 1px solid rgba(217, 167, 82, 0.2) !important;
  align-self: flex-start !important;
}

.testimonial-quote-text {
  font-size: 15.5px !important;
  font-weight: 500 !important;
  color: #334155 !important;
  line-height: 1.65 !important;
  font-style: italic !important;
  margin-bottom: 24px !important;
  flex-grow: 1 !important;
}

.testimonial-user-footer {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding-top: 18px !important;
  border-top: 1px solid #F1F5F9 !important;
  margin-top: auto !important;
}

.testimonial-user-avatar {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid var(--wd-gold-soft) !important;
  flex-shrink: 0 !important;
}

.testimonial-user-info {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.testimonial-user-name {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin: 0 0 2px 0 !important;
  line-height: 1.2 !important;
}

.testimonial-user-place {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #64748B !important;
}

/* ==========================================================================
   5-Star Luxury Property Details System
   ========================================================================== */

.luxury-attraction-item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  padding: 18px 22px !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px rgba(9, 16, 29, 0.03) !important;
  transition: all 0.25s ease !important;
  min-height: 68px !important;
}

.luxury-attraction-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 8px 25px rgba(217, 167, 82, 0.12) !important;
  transform: translateY(-3px) !important;
}

.attraction-icon-badge {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 4px 10px rgba(217, 167, 82, 0.25) !important;
}

.attraction-text {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #0F172A !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

/* Luxury Property Amenity Item */
.luxury-property-amenity-item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  padding: 16px 20px !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px rgba(9, 16, 29, 0.03) !important;
  transition: all 0.25s ease !important;
  min-height: 64px !important;
}

.luxury-property-amenity-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 8px 25px rgba(217, 167, 82, 0.12) !important;
  transform: translateY(-3px) !important;
}

.property-amenity-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.property-amenity-name {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #1E293B !important;
  line-height: 1.3 !important;
}

/* Subtle Section Divider Line & Spacing */
.property-overview-wrapper,
.property-attractions-wrapper,
.property-amenities-wrapper,
.section-divider-line {
  margin-bottom: 70px !important;
  padding-bottom: 50px !important;
  border-bottom: 1.5px solid #EAECF0 !important;
}

.property-attractions-wrapper .section-main-title,
.property-amenities-wrapper .section-main-title {
  margin-top: 10px !important;
  margin-bottom: 28px !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  letter-spacing: -0.4px !important;
}

.luxury-booking-sidebar {
  background: #FFFFFF !important;
  border: 1.5px solid #EAECF0 !important;
  border-radius: 24px !important;
  padding: 32px 28px !important;
  box-shadow: 0 14px 40px rgba(9, 16, 29, 0.08) !important;
  position: sticky !important;
  top: 120px !important;
  z-index: 10 !important;
}

.booking-sidebar-tag {
  display: inline-block !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  color: var(--wd-gold) !important;
  background: rgba(217, 167, 82, 0.12) !important;
  padding: 5px 14px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  margin-bottom: 16px !important;
  border: 1px solid rgba(217, 167, 82, 0.25) !important;
}

.booking-sidebar-title {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 10px !important;
}

.booking-sidebar-desc {
  font-size: 14.5px !important;
  color: #64748B !important;
  line-height: 1.6 !important;
  margin-bottom: 24px !important;
}

.sidebar-perks-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 24px !important;
  padding-top: 20px !important;
  border-top: 1px solid #F1F5F9 !important;
}

.sidebar-perk-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}

/* ==========================================================================
   5-Star Luxury Contact Us System
   ========================================================================== */

.contact-page {
  position: relative !important;
  background: #FFFFFF !important;
}

.contact-concierge-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  letter-spacing: 1.2px !important;
  color: var(--wd-gold-deep) !important;
  background: linear-gradient(135deg, #FDF7ED 0%, #F8EEDB 100%) !important;
  border: 1px solid rgba(217, 167, 82, 0.35) !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  box-shadow: 0 2px 8px rgba(217, 167, 82, 0.12) !important;
}

.contact-concierge-pill .pulse-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background-color: #22C55E !important;
  display: inline-block !important;
  position: relative !important;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7) !important;
  animation: conciergePulse 2s infinite !important;
}

@keyframes conciergePulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

.text-gold-gradient {
  background: linear-gradient(135deg, var(--wd-gold-deep) 0%, var(--wd-gold) 50%, var(--wd-gold-deep) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  display: inline !important;
}

.luxury-contact-info-card {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1.5px solid rgba(217, 167, 82, 0.2) !important;
  border-radius: 26px !important;
  padding: 8px 24px !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03) !important;
  transition: all 0.3s ease !important;
}

.luxury-contact-info-card:hover {
  border-color: rgba(217, 167, 82, 0.35) !important;
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.08), 0 0 0 1px rgba(217, 167, 82, 0.15) !important;
}

.contact-cards-stack {
  display: flex !important;
  flex-direction: column !important;
}

.luxury-contact-card {
  display: flex !important;
  align-items: flex-start !important;
  gap: 18px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.7) !important;
  padding: 18px 6px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
  text-decoration: none !important;
  min-width: 0 !important;
  transition: all 0.25s ease !important;
}

.luxury-contact-card:hover {
  background: rgba(251, 241, 223, 0.25) !important;
  padding-left: 10px !important;
}

.contact-cards-stack > .luxury-contact-card:last-child {
  border-bottom: none !important;
}

.contact-icon-box {
  width: 48px !important;
  height: 48px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #FDF7ED 0%, #F5E8D0 100%) !important;
  border: 1px solid rgba(217, 167, 82, 0.3) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 4px 12px rgba(217, 167, 82, 0.15) !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.luxury-contact-card:hover .contact-icon-box {
  background: linear-gradient(135deg, var(--wd-gold) 0%, #C49033 100%) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) scale(1.06) !important;
  box-shadow: 0 8px 20px rgba(217, 167, 82, 0.35) !important;
}

.contact-card-title {
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.1px !important;
  color: #8C99A8 !important;
  margin-bottom: 3px !important;
}

.contact-card-value {
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin: 0 !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  line-height: 1.55 !important;
}

a.contact-card-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  position: relative !important;
}

a.contact-card-link:hover {
  color: var(--wd-gold-deep) !important;
  transform: translateX(2px) !important;
}

.contact-action-hint {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--wd-gold) !important;
  opacity: 0 !important;
  transform: translateX(-4px) !important;
  transition: all 0.2s ease !important;
  margin-left: 6px !important;
}

.luxury-contact-card:hover .contact-action-hint {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

a.contact-card-link + a.contact-card-link {
  margin-top: 5px !important;
}

/* VIP WhatsApp Concierge Card */
.luxury-contact-whatsapp-card {
  background: linear-gradient(145deg, #072B22 0%, #0E4236 45%, #082820 100%) !important;
  border: 1px solid rgba(37, 211, 102, 0.3) !important;
  border-radius: 26px !important;
  padding: 28px 26px !important;
  color: #FFFFFF !important;
  box-shadow: 0 16px 40px rgba(7, 43, 34, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.05) inset !important;
  margin-top: 24px !important;
  margin-bottom: 28px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: all 0.35s ease !important;
}

.luxury-contact-whatsapp-card::before {
  content: "" !important;
  position: absolute !important;
  top: -60px !important;
  right: -60px !important;
  width: 160px !important;
  height: 160px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(37, 211, 102, 0.25) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

.luxury-contact-whatsapp-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 22px 50px rgba(7, 43, 34, 0.38), 0 0 25px rgba(37, 211, 102, 0.2) !important;
  border-color: rgba(37, 211, 102, 0.45) !important;
}

.luxury-contact-whatsapp-card .wa-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 1.1px !important;
  color: #6EE7B7 !important;
  padding: 5px 14px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  margin-bottom: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.luxury-contact-whatsapp-card h4 {
  font-size: 21px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  margin-bottom: 8px !important;
  letter-spacing: -0.3px !important;
}

.luxury-contact-whatsapp-card p {
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.88) !important;
  margin-bottom: 16px !important;
  line-height: 1.55 !important;
}

.wa-features-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-weight: 600 !important;
}

.wa-feature-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}

.wa-feature-badge svg {
  color: #25D366 !important;
}

.btn-whatsapp-light {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: #FFFFFF !important;
  color: #072B22 !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  padding: 13px 24px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important;
  width: 100% !important;
}

.btn-whatsapp-light:hover {
  background: #F4FBF7 !important;
  color: #0B3E31 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25) !important;
}

.btn-whatsapp-light svg {
  color: #25D366 !important;
  transition: transform 0.25s ease !important;
}

.btn-whatsapp-light:hover svg {
  transform: scale(1.15) rotate(5deg) !important;
}

/* Full-Width WhatsApp Concierge Banner */
.luxury-whatsapp-fullwidth {
  width: 100% !important;
  margin-top: 36px !important;
  margin-bottom: 0 !important;
  padding: 36px 42px !important;
  border-radius: 28px !important;
}

.luxury-whatsapp-fullwidth h4 {
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.4px !important;
  margin-bottom: 8px !important;
}

.luxury-whatsapp-fullwidth p {
  font-size: 15px !important;
  line-height: 1.6 !important;
  max-width: 720px !important;
  margin-bottom: 18px !important;
}

.btn-whatsapp-fullwidth-cta {
  width: auto !important;
  min-width: 270px !important;
  padding: 16px 32px !important;
  font-size: 15.5px !important;
  display: inline-flex !important;
}

.wa-cta-hint {
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.72) !important;
  font-weight: 500 !important;
}

@media (max-width: 991px) {
  .luxury-whatsapp-fullwidth {
    padding: 26px 20px !important;
  }
  .btn-whatsapp-fullwidth-cta {
    width: 100% !important;
    min-width: unset !important;
  }
}

@media (min-width: 992px) {
  .contact-page .contact-row-stretch {
    display: flex !important;
    align-items: stretch !important;
  }

  .contact-page .contact-col-left {
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .contact-content-left {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .contact-intro-block {
    flex-shrink: 0 !important;
  }

  .contact-page .contact-content-left .luxury-contact-info-card {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    margin-bottom: 0 !important;
    padding: 16px 26px !important;
  }

  .contact-page .contact-content-left .contact-cards-stack {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
  }

  .contact-page .contact-content-left .luxury-contact-card {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    padding: 14px 4px !important;
  }

  .contact-page .contact-col-right {
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-page .contact-form-sticky-wrap {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    position: static !important;
  }

  .contact-page .contact-form-sticky-wrap .luxury-contact-form-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    margin-bottom: 0 !important;
  }

  .contact-page .contact-form-sticky-wrap .luxury-enquiry-form {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
  }
}

/* 5-Star Luxury Enquiry Form Card */
.luxury-contact-form-card {
  background: #FFFFFF !important;
  border: 1.5px solid rgba(217, 167, 82, 0.22) !important;
  border-radius: 28px !important;
  padding: 38px 36px 36px 36px !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.07), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
  position: relative !important;
  overflow: hidden !important;
}

.luxury-contact-form-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 5px !important;
  background: linear-gradient(90deg, var(--wd-gold-deep) 0%, var(--wd-gold) 50%, #F5CE7B 100%) !important;
}

.form-header-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold-deep) !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  padding: 4px 12px !important;
  border-radius: 50px !important;
  letter-spacing: 0.5px !important;
  border: 1px solid rgba(217, 167, 82, 0.25) !important;
}

.form-trust-bar {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  padding: 10px 14px !important;
  background: #F8FAFC !important;
  border: 1px solid #EEF2F6 !important;
  border-radius: 12px !important;
  margin-top: 18px !important;
  margin-bottom: 24px !important;
}

.form-trust-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #475569 !important;
}

.form-trust-item svg {
  color: var(--wd-gold) !important;
}

.luxury-form-label {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #1E293B !important;
  margin-bottom: 8px !important;
}

/* Luxury Input Field Wrappers with Prefix Icons */
.luxury-input-wrapper {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

.luxury-input-icon {
  position: absolute !important;
  left: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #94A3B8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
  transition: color 0.25s ease !important;
  z-index: 2 !important;
}

.luxury-input-icon-textarea {
  position: absolute !important;
  left: 16px !important;
  top: 18px !important;
  color: #94A3B8 !important;
  pointer-events: none !important;
  transition: color 0.25s ease !important;
  z-index: 2 !important;
}

.luxury-form-input,
.luxury-form-select {
  width: 100% !important;
  height: 52px !important;
  margin: 0 !important;
  background: #F8FAFC !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 14px !important;
  padding: 0 16px 0 46px !important;
  font-family: inherit !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: #0F172A !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: all 0.25s ease !important;
}

.luxury-form-textarea {
  width: 100% !important;
  margin: 0 !important;
  background: #F8FAFC !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 14px !important;
  padding: 14px 16px 14px 46px !important;
  font-family: inherit !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: #0F172A !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: all 0.25s ease !important;
  resize: vertical !important;
}

.luxury-input-wrapper:focus-within .luxury-input-icon,
.luxury-input-wrapper:focus-within .luxury-input-icon-textarea {
  color: var(--wd-gold) !important;
}

.luxury-form-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  cursor: pointer !important;
  padding-right: 44px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23D9A752' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 18px center !important;
  background-size: 14px !important;
}

.luxury-form-input:focus,
.luxury-form-select:focus,
.luxury-form-textarea:focus {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 0 0 4px rgba(217, 167, 82, 0.16) !important;
}

.btn-enquiry-submit {
  width: 100% !important;
  padding: 16px 28px !important;
  border-radius: 50px !important;
  background: linear-gradient(135deg, var(--wd-gold) 0%, #E6BB65 50%, #C49033 100%) !important;
  color: #FFFFFF !important;
  border: none !important;
  font-size: 15.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.3px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.35) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-enquiry-submit:hover:not(:disabled) {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 30px rgba(217, 167, 82, 0.45) !important;
  filter: brightness(1.03) !important;
}

.btn-enquiry-submit:disabled {
  opacity: 0.7 !important;
  cursor: not-allowed !important;
}

.form-privacy-guarantee {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  color: #64748B !important;
  margin-top: 14px !important;
  text-align: center !important;
}

.luxury-map-wrapper {
  position: relative !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.08) !important;
  border: 1.5px solid #E2E8F0 !important;
  background: #F8FAFC !important;
  line-height: 0 !important;
  height: 340px !important;
  margin-top: 0 !important;
}

.luxury-map-wrapper iframe {
  display: block !important;
  width: 100% !important;
  height: 340px !important;
  min-height: 340px !important;
  border: 0 !important;
  line-height: 0 !important;
}

.property-map-with-text {
  margin-top: 10px !important;
}

.property-map-info-card {
  background: #FFFFFF !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 22px !important;
  padding: 32px 28px !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.06) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 340px !important;
}

.property-map-info-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: rgba(16, 55, 43, 0.08) !important;
  color: var(--wd-green) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 5px 12px !important;
  border-radius: 50px !important;
  margin-bottom: 12px !important;
  width: fit-content !important;
}

.property-map-info-title {
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.3px !important;
}

.property-map-info-address {
  font-size: 14px !important;
  color: #64748B !important;
  line-height: 1.55 !important;
  margin: 0 0 16px 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

.property-map-info-features {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 14px 16px !important;
  background: #F8FAFC !important;
  border-radius: 14px !important;
  border: 1px solid #F1F5F9 !important;
  margin-bottom: 16px !important;
}

.property-map-feature-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}

.property-map-feature-icon {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  flex-shrink: 0 !important;
}

.property-map-info-desc {
  font-size: 13.5px !important;
  color: #64748B !important;
  line-height: 1.55 !important;
  margin: 0 0 18px 0 !important;
}

.property-map-actions {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.btn-map-directions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  padding: 11px 22px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
  flex: 1 1 auto !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.35) !important;
}

.btn-map-directions:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(217, 167, 82, 0.5) !important;
}

.btn-map-call {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: #F8FAFC !important;
  color: var(--wd-green) !important;
  border: 1.5px solid #E2E8F0 !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  padding: 11px 20px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-map-call:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-green) !important;
}

@media (max-width: 991px) {
  .luxury-map-wrapper {
    height: 340px !important;
  }
  .luxury-map-wrapper iframe {
    height: 340px !important;
    min-height: 340px !important;
  }
  .property-map-info-card {
    height: auto !important;
    margin-top: 20px !important;
    padding: 24px 20px !important;
  }
}

/* ==========================================================================
   Featured Properties AtlasTrip Card System
   ========================================================================== */

.featured-properties-scroll {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 24px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 6px 4px 10px 4px !important;
  -webkit-overflow-scrolling: touch !important;
  cursor: grab !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

.featured-properties-scroll.is-dragging {
  cursor: grabbing !important;
  user-select: none !important;
}

.featured-property-item {
  flex: 0 0 auto !important;
  width: 420px !important;
  max-width: 85vw !important;
}

.featured-properties-scroll::-webkit-scrollbar {
  display: none !important;
}

.featured-properties-scroll img {
  -webkit-user-drag: none !important;
  user-drag: none !important;
}

@media (max-width: 576px) {
  .featured-property-item {
    width: 320px !important;
  }
}

/* ==========================================================================
   Luxury Property Card & Glass Shine Effect
   ========================================================================== */

.luxury-property-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.04) !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin-bottom: 30px !important;
}

a.luxury-property-card {
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer !important;
}

.luxury-property-card:hover {
  transform: translateY(-8px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.16) !important;
}

.property-card-image-wrap {
  position: relative !important;
  width: 100% !important;
  height: 270px !important;
  overflow: hidden !important;
}

/* Glass Shine Sweep Animation Overlay */
.property-card-image-wrap::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 60% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: skewX(-25deg) !important;
  pointer-events: none !important;
  z-index: 4 !important;
  transition: none !important;
}

.luxury-property-card:hover .property-card-image-wrap::after {
  left: 150% !important;
  transition: all 0.75s ease-in-out !important;
}

.property-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-property-card:hover .property-card-img {
  transform: scale(1.08) !important;
}

.property-card-type-badge {
  position: absolute !important;
  top: 18px !important;
  left: 18px !important;
  background: var(--wd-gold) !important;
  color: var(--wd-on-primary) !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.4) !important;
  z-index: 5 !important;
}

.property-card-rating-badge {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.7) !important;
  color: #0F172A !important;
  font-weight: 800 !important;
  padding: 5px 14px !important;
  border-radius: 50px !important;
  font-size: 12.5px !important;
  box-shadow: 0 4px 14px rgba(9, 16, 29, 0.12) !important;
  z-index: 5 !important;
}

/* Property Card Pill Badges above Explore Property Button */
.property-card-badges-row,
.property-card-badge-pills {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: auto !important;
  margin-bottom: 16px !important;
  padding-top: 2px !important;
}

.property-card-pill-tag {
  background: #F5F2EA !important;
  color: #0F172A !important;
  padding: 4px 13px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.1px !important;
  border: 1px solid #EAE5D9 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  transition: all 0.25s ease !important;
}

.luxury-property-card:hover .property-card-pill-tag {
  background: #FAF7F2 !important;
  border-color: var(--wd-gold) !important;
}

@media (max-width: 575px) {
  .property-card-badges-row,
  .property-card-badge-pills {
    gap: 6px !important;
    margin-bottom: 14px !important;
  }
  .property-card-pill-tag {
    font-size: 11px !important;
    padding: 3px 10px !important;
  }
}

.property-card-content {
  padding: 26px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  background: #FFFFFF !important;
}

.property-card-location {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--wd-gold) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
}

.location-pin-icon {
  width: 15px !important;
  height: 15px !important;
  color: var(--wd-gold) !important;
}

.property-card-title-link,
.property-card-title-link:hover,
.property-card-title-link:focus,
.property-card-title-link * {
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

.property-card-title {
  color: #101828 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  margin-bottom: 10px !important;
  line-height: 1.3 !important;
  transition: color 0.3s ease !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

.luxury-property-card:hover .property-card-title {
  color: var(--wd-gold) !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

.property-card-tagline {
  color: #64748B !important;
  font-size: 14.5px !important;
  line-height: 1.6 !important;
  margin-bottom: 14px !important;
  flex-grow: 1 !important;
}

.property-card-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--wd-gold) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
}

.card-btn-arrow {
  transition: transform 0.3s ease !important;
}

.luxury-property-card:hover .property-card-btn {
  color: var(--wd-gold-deep) !important;
}

.luxury-property-card:hover .card-btn-arrow {
  transform: translateX(6px) !important;
}

/* ==========================================================================
   Contact Page Compact Property Card
   ========================================================================== */
.contact-property-item {
  flex: 0 0 auto !important;
  width: 310px !important;
  max-width: 80vw !important;
}

@media (max-width: 576px) {
  .contact-property-item {
    width: 275px !important;
  }
}

.contact-property-card {
  border-radius: 16px !important;
  margin-bottom: 20px !important;
  height: 100% !important;
  box-shadow: 0 8px 24px rgba(9, 16, 29, 0.05) !important;
}

.contact-property-card .property-card-image-wrap {
  height: 180px !important;
}

.contact-property-card .property-card-content {
  padding: 16px 18px 18px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

.contact-property-card .property-card-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
  line-height: 1.3 !important;
}

.contact-property-card .property-card-contact-address {
  font-size: 13px !important;
  color: #475569 !important;
  line-height: 1.45 !important;
  margin-bottom: 6px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
}

.contact-property-card .property-card-contact-phone {
  font-size: 13px !important;
  color: var(--wd-green) !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.contact-property-card .property-card-contact-phone a {
  color: var(--wd-green) !important;
  text-decoration: none !important;
}

.contact-property-card .property-card-contact-phone a:hover {
  text-decoration: underline !important;
}

.contact-property-card .property-card-footer {
  margin-top: auto !important;
  border-top: 1px dashed #EAE5D9 !important;
  padding-top: 10px !important;
}

.contact-property-card .property-card-btn {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  gap: 6px !important;
}

/* ==========================================================================
   Property Details Luxury Hero Banner
   ========================================================================== */
.property-details-hero-banner {
  position: relative !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

.property-details-hero-banner .property-hero-subheading {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1.6px !important;
  color: var(--wd-gold) !important;
  -webkit-text-fill-color: var(--wd-gold) !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.7) !important;
}

.property-details-hero-banner h1,
.property-details-hero-banner .property-hero-main-title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-size: clamp(32px, 5.2vw, 56px) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 18px !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.75) !important;
}

.property-details-hero-banner p,
.property-details-hero-banner .property-hero-desc {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: clamp(15px, 2vw, 17px) !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
  max-width: 800px !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6) !important;
}

.btn-hero-action-gold {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 13px 30px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  box-shadow: 0 6px 20px rgba(217, 167, 82, 0.4) !important;
  transition: all 0.3s ease !important;
  border: none !important;
}

.btn-hero-action-gold:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(217, 167, 82, 0.55) !important;
}

.btn-hero-action-outline {
  background: rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.6) !important;
  color: var(--wd-gold) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 13px 30px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.3s ease !important;
}

.btn-hero-action-outline:hover {
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   Weddings & Events Page Hero
   ========================================================================== */
.wedding-hero-section {
  position: relative !important;
  width: 100% !important;
  min-height: 560px !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  display: flex !important;
  align-items: flex-end !important;
  padding: 80px 0 44px !important;
}

.wedding-hero-content {
  max-width: 640px !important;
}

.wedding-hero-eyebrow {
  color: var(--wd-gold) !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  letter-spacing: 1.6px !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
}

.wedding-hero-title {
  color: #FFFFFF !important;
  font-weight: 800 !important;
  font-size: clamp(32px, 4.5vw, 54px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 18px !important;
}

.wedding-hero-desc {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  max-width: 560px !important;
  margin-bottom: 26px !important;
}

.wedding-hero-buttons {
  display: flex !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}

.wedding-hero-disclaimer {
  color: rgba(255, 255, 255, 0.6) !important;
  font-size: 12.5px !important;
  margin: 22px 0 0 0 !important;
}

@media (max-width: 767px) {
  .wedding-hero-section {
    min-height: 480px !important;
    padding: 60px 0 32px !important;
  }
}

.wedding-about-checklist {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 24px 0 30px 0 !important;
}

.wedding-about-checklist-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.wedding-about-check-icon {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #EAF6EE !important;
  color: #1E8E4A !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.wedding-about-check-text {
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: #334155 !important;
}

/* ==========================================================================
   Weddings & Events — "Event Planning Options" Cards
   ========================================================================== */
.plan-option-card {
  background: #FFFFFF !important;
  border: 1.5px solid #E2E8F0 !important;
  border-radius: 18px !important;
  padding: 28px 26px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease !important;
}

.plan-option-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.08) !important;
}

.plan-option-card-featured {
  border-color: var(--wd-gold) !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.16) !important;
}

.plan-option-eyebrow {
  font-size: 11.5px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  color: var(--wd-green) !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

.plan-option-title {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  margin: 0 0 10px 0 !important;
  line-height: 1.3 !important;
}

.plan-option-desc {
  font-size: 13.5px !important;
  color: #64748B !important;
  line-height: 1.55 !important;
  margin: 0 0 14px 0 !important;
}

.plan-option-bullets {
  list-style: disc !important;
  padding-left: 18px !important;
  margin: 0 0 22px 0 !important;
  flex-grow: 1 !important;
}

.plan-option-bullets li {
  font-size: 13px !important;
  color: #475569 !important;
  line-height: 1.9 !important;
}

.plan-option-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: flex-start !important;
  padding: 10px 24px !important;
  border-radius: 30px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.plan-option-btn-outline {
  background: #FFFFFF !important;
  color: var(--wd-green) !important;
  border: 1.5px solid var(--wd-green) !important;
}

.plan-option-btn-outline:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
}

.plan-option-btn-solid {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border: 1.5px solid var(--wd-gold) !important;
}

.plan-option-btn-solid:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
}

/* Overview Header Badges */
.badge-luxury-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  background: #F1F5F9 !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  line-height: 1.4 !important;
}

.badge-luxury-type {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  background: #FEF3C7 !important;
  border: 1px solid #FDE68A !important;
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #92400E !important;
  line-height: 1.4 !important;
}

.badge-luxury-featured {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  background: var(--wd-gold-soft) !important;
  border: 1px solid #F0C878 !important;
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--wd-gold-deep) !important;
  line-height: 1.4 !important;
}

.property-about-showcase {
  background: transparent !important;
  margin-bottom: 60px !important;
  padding: 10px 0 !important;
}

.property-about-img-frame {
  border-radius: 26px !important;
  overflow: hidden !important;
  box-shadow: 0 14px 38px rgba(9, 16, 29, 0.09) !important;
  background: #F8FAFC !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease !important;
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  max-height: 480px !important;
}

.property-about-img-frame:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 18px 45px rgba(9, 16, 29, 0.13) !important;
}

.property-about-img-frame img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: 26px !important;
  image-rendering: auto !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
}

.property-about-eyebrow {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.8px !important;
  color: var(--wd-green) !important;
  text-transform: uppercase !important;
  display: inline-block !important;
}

.property-about-title {
  font-size: clamp(24px, 3.2vw, 36px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.5px !important;
}

.property-about-paragraphs p {
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: #475467 !important;
  margin-bottom: 14px !important;
}

.property-about-highlight-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

.property-about-highlight-num {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--wd-green) !important;
  min-width: 32px !important;
  line-height: 1.3 !important;
  letter-spacing: -0.5px !important;
}

.property-about-highlight-title {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #101828 !important;
  margin: 0 0 3px 0 !important;
  line-height: 1.3 !important;
}

.property-about-highlight-desc {
  font-size: 14px !important;
  color: #64748B !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

/* ==========================================================================
   Property Quick Facts / Highlights Strip (Matching User Image)
   ========================================================================== */
.property-quick-facts-wrap {
  width: 100% !important;
  margin-bottom: 50px !important;
}

.property-quick-facts-bar {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.06), 0 2px 4px rgba(16, 24, 40, 0.02) !important;
  padding: 24px 30px !important;
  display: grid !important;
  grid-template-columns: var(--quick-facts-cols, 1.15fr 1fr 1.25fr 1.55fr 1.25fr) !important;
  align-items: center !important;
}

.quick-fact-col {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 4px 22px !important;
  border-right: 1px solid #EAECF0 !important;
}

.quick-fact-col:first-child {
  padding-left: 0 !important;
}

.quick-fact-col:last-child {
  padding-right: 0 !important;
  border-right: none !important;
}

.quick-fact-title {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #101828 !important;
  margin-bottom: 6px !important;
  line-height: 1.3 !important;
  letter-spacing: -0.2px !important;
}

.quick-fact-desc {
  font-size: 13.5px !important;
  font-weight: 400 !important;
  color: #64748B !important;
  line-height: 1.45 !important;
  margin: 0 !important;
}

@media (max-width: 1199px) {
  .property-quick-facts-bar {
    grid-template-columns: repeat(3, 1fr) !important;
    row-gap: 22px !important;
    padding: 22px 20px !important;
  }
  .quick-fact-col {
    padding: 0 16px !important;
  }
  .quick-fact-col:nth-child(3) {
    border-right: none !important;
  }
}

@media (max-width: 767px) {
  .property-quick-facts-bar {
    grid-template-columns: 1fr !important;
    row-gap: 0 !important;
    padding: 16px 20px !important;
    border-radius: 16px !important;
  }
  .quick-fact-col {
    padding: 14px 0 !important;
    border-right: none !important;
    border-bottom: 1px solid #EAECF0 !important;
  }
  .quick-fact-col:first-child {
    padding-top: 4px !important;
  }
  .quick-fact-col:last-child {
    padding-bottom: 4px !important;
    border-bottom: none !important;
  }
}

/* ==========================================================================
   Property Amenities Showcase (Matching User Reference Image)
   ========================================================================== */
.property-amenities-section {
  width: 100% !important;
  margin-bottom: 50px !important;
}

.property-amenities-header {
  margin-bottom: 14px !important;
}

.property-amenities-eyebrow {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  color: var(--wd-green) !important;
  text-transform: uppercase !important;
  display: inline-block !important;
  margin: 0 0 6px 0 !important;
  line-height: 1.3 !important;
}

.property-amenities-heading {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

.property-amenities-subtext {
  font-size: 14.5px !important;
  color: #64748B !important;
  line-height: 1.5 !important;
  max-width: 440px !important;
  text-align: right !important;
}

@media (max-width: 991px) {
  .property-amenities-subtext {
    text-align: left !important;
    max-width: 100% !important;
  }
}

.property-amenity-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 16px !important;
  padding: 18px 22px !important;
  height: 100% !important;
  min-height: 84px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 12px !important;
  justify-content: flex-start !important;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.02) !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
}

.property-amenity-card .svg-wrapper {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  flex-shrink: 0 !important;
  margin-top: 2px !important;
  transition: transform 0.2s ease !important;
}

.property-amenity-card:hover .svg-wrapper {
  transform: scale(1.1) !important;
}

.property-amenity-card:hover {
  transform: translateY(-2px) !important;
  border-color: #D0D5DD !important;
  box-shadow: 0 8px 20px rgba(16, 24, 40, 0.06) !important;
}

.property-amenity-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #101828 !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.3 !important;
}

.property-amenity-subtitle {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #64748B !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

/* ==========================================================================
   Rooms & Accommodation Section
   ========================================================================== */
.property-rooms-section {
  width: 100% !important;
  margin-bottom: 50px !important;
}

.property-rooms-header {
  width: 100% !important;
  margin-bottom: 28px !important;
}

.property-rooms-heading {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .property-rooms-header {
    margin-bottom: 20px !important;
  }
}

.property-room-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  height: 100% !important;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.02) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.property-room-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.1) !important;
}

.property-room-image {
  width: 100% !important;
  height: 190px !important;
  background-size: cover !important;
  background-position: center !important;
}

.property-room-body {
  padding: 18px 20px 20px !important;
}

.property-room-category {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  color: var(--wd-green) !important;
  text-transform: uppercase !important;
  margin-bottom: 6px !important;
}

.property-room-name {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #101828 !important;
  margin: 0 0 6px 0 !important;
  line-height: 1.3 !important;
}

.property-room-description {
  font-size: 13.5px !important;
  color: #64748B !important;
  margin: 0 0 14px 0 !important;
  line-height: 1.5 !important;
}

.property-room-price {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: var(--wd-green) !important;
  margin-bottom: 14px !important;
}

.property-room-price-unit {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #64748B !important;
}

.property-room-enquire-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 22px !important;
  border: 1.5px solid var(--wd-green) !important;
  border-radius: 30px !important;
  color: var(--wd-green) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}

.property-room-enquire-btn:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
}

/* ==========================================================================
   Things To Do / Experiences Section
   ========================================================================== */
.property-experiences-section {
  width: 100% !important;
  margin-bottom: 55px !important;
}

.property-experiences-header {
  width: 100% !important;
  margin-bottom: 28px !important;
}

.property-experiences-heading {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .property-experiences-header {
    margin-bottom: 20px !important;
  }
}

.property-experience-card {
  position: relative !important;
  height: 290px !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background-color: #0F172A !important;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.08) !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  cursor: pointer !important;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.35s ease, border-color 0.35s ease !important;
}

.property-experience-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.2) !important;
  border-color: rgba(217, 167, 82, 0.45) !important;
}

.property-experience-bg {
  position: absolute !important;
  inset: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

.property-experience-card:hover .property-experience-bg {
  transform: scale(1.08) !important;
}

.property-experience-gradient {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.15) 0%,
    rgba(15, 23, 42, 0.05) 30%,
    rgba(15, 23, 42, 0.6) 65%,
    rgba(10, 17, 30, 0.95) 100%
  ) !important;
  pointer-events: none !important;
  transition: background 0.35s ease !important;
}

.property-experience-card:hover .property-experience-gradient {
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.2) 0%,
    rgba(15, 23, 42, 0.1) 25%,
    rgba(15, 23, 42, 0.65) 60%,
    rgba(10, 17, 30, 0.98) 100%
  ) !important;
}

.property-experience-badge {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  background: rgba(15, 23, 42, 0.6) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: var(--wd-gold) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.8px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  text-transform: uppercase !important;
  z-index: 2 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.property-experience-arrow {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: rgba(15, 23, 42, 0.5) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #FFFFFF !important;
  z-index: 2 !important;
  transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.property-experience-card:hover .property-experience-arrow {
  background: var(--wd-gold) !important;
  border-color: var(--wd-gold) !important;
  color: #0F172A !important;
  transform: translate(2px, -2px) scale(1.08) !important;
}

.property-experience-content {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 20px 18px !important;
  z-index: 2 !important;
}

.property-experience-title {
  font-size: 17.5px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  margin: 0 0 6px 0 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.3px !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6) !important;
}

.property-experience-subtitle {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  margin: 0 !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) !important;
}

/* ==========================================================================
   Guest Reviews Section
   ========================================================================== */
.property-reviews-section {
  width: 100% !important;
  margin-bottom: 55px !important;
}

.property-reviews-header {
  width: 100% !important;
  margin-bottom: 28px !important;
}

.property-reviews-heading {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .property-reviews-header {
    margin-bottom: 20px !important;
  }
}

.property-reviews-grid {
  display: flex !important;
  gap: 16px !important;
  align-items: stretch !important;
}

.property-reviews-feedback-card {
  flex: 0 0 28% !important;
  background: var(--wd-green) !important;
  border-radius: 18px !important;
  padding: 30px 26px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.property-reviews-stars {
  color: var(--wd-gold) !important;
  font-size: 16px !important;
  letter-spacing: 2px !important;
  margin-bottom: 14px !important;
}

.property-reviews-feedback-title {
  font-size: 24px !important;
  font-weight: 800 !important;
  color: var(--wd-gold) !important;
  margin: 0 0 12px 0 !important;
  line-height: 1.25 !important;
}

.property-reviews-feedback-desc {
  font-size: 13.5px !important;
  color: rgba(255, 255, 255, 0.72) !important;
  line-height: 1.55 !important;
  margin: 0 0 22px 0 !important;
}

.property-reviews-feedback-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: flex-start !important;
  padding: 10px 26px !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-radius: 30px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background 0.2s ease, transform 0.2s ease !important;
}

.property-reviews-feedback-btn:hover {
  background: var(--wd-gold-dark) !important;
  transform: translateY(-2px) !important;
  color: #FFFFFF !important;
}

.property-reviews-cards {
  flex: 1 1 72% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}

.property-review-card {
  background: #FDFBF7 !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
}

.property-review-stars {
  color: var(--wd-gold) !important;
  font-size: 13px !important;
  letter-spacing: 1.5px !important;
  margin-bottom: 8px !important;
}

.property-review-quote {
  font-size: 13.5px !important;
  color: #64748B !important;
  line-height: 1.5 !important;
  margin: 0 0 10px 0 !important;
}

/* Admin rich-text fields (amenity/experience subtitles, review quotes) save
   their value wrapped in a <p> tag. Rendered here as short inline text next
   to a heading or quote marks, so any inner <p>/<div> must stay inline
   instead of breaking onto its own line the way a block element normally would. */
.property-review-quote-inner p,
.property-review-quote-inner div,
.property-amenity-subtitle p,
.property-amenity-subtitle div,
.property-experience-subtitle p,
.property-experience-subtitle div,
.testimonial-quote-inner p,
.testimonial-quote-inner div {
  display: inline !important;
  margin: 0 !important;
}

.property-review-guest {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #101828 !important;
}

@media (max-width: 991px) {
  .property-reviews-grid {
    flex-direction: column !important;
  }

  .property-reviews-feedback-card {
    flex: none !important;
  }
}

@media (max-width: 575px) {
  .property-reviews-cards {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   Property FAQs Accordion Section
   ========================================================================== */
.property-faqs-section {
  width: 100% !important;
  margin-bottom: 55px !important;
}

.property-faqs-header {
  width: 100% !important;
  margin-bottom: 28px !important;
}

.property-faqs-heading {
  font-size: clamp(22px, 2.8vw, 30px) !important;
  font-weight: 800 !important;
  color: #101828 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.4px !important;
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

.property-faqs-subtext {
  font-size: 14.5px !important;
  color: #64748B !important;
  line-height: 1.5 !important;
  max-width: 620px !important;
}

.property-faqs-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.property-faq-item {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.property-faq-item.is-open {
  border-color: var(--wd-gold) !important;
  box-shadow: 0 4px 16px rgba(16, 24, 40, 0.06) !important;
}

.property-faq-question {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 18px 22px !important;
  background: transparent !important;
  border: none !important;
  text-align: left !important;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  color: #101828 !important;
  cursor: pointer !important;
}

.property-faq-toggle {
  flex-shrink: 0 !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: #FDFBF7 !important;
  border: 1px solid #E2D9C8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--wd-green) !important;
}

.property-faq-toggle svg {
  display: block !important;
}

.property-faq-toggle-vline.is-hidden {
  display: none !important;
}

.property-faq-item.is-open .property-faq-toggle {
  background: var(--wd-gold) !important;
  border-color: var(--wd-gold) !important;
  color: #FFFFFF !important;
}

.property-faq-answer {
  padding: 0 22px 20px 22px !important;
  font-size: 14px !important;
  color: #64748B !important;
  line-height: 1.6 !important;
}

/* ==========================================================================
   Destination Highlights Overlay Cards
   ========================================================================== */

/* ==========================================================================
   Destination Highlights Overlay Cards & Glass Shine Effect
   ========================================================================== */

.luxury-state-card {
  display: block !important;
  text-decoration: none !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid #EAECF0 !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.08) !important;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  height: 380px !important;
  margin-bottom: 25px !important;
  position: relative !important;
  background: #0F172A !important;
}

.luxury-state-card:hover {
  transform: translateY(-8px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.25) !important;
}

.state-card-img-wrap {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
}

.state-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-state-card:hover .state-card-img {
  transform: scale(1.08) !important;
}

/* Glass Shine Sweep Animation Overlay */
.state-card-img-wrap::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 60% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: skewX(-25deg) !important;
  pointer-events: none !important;
  z-index: 4 !important;
  transition: none !important;
}

.luxury-state-card:hover .state-card-img-wrap::after {
  left: 150% !important;
  transition: all 0.75s ease-in-out !important;
}

.state-card-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.1) 0%,
    rgba(15, 23, 42, 0.3) 50%,
    rgba(15, 23, 42, 0.85) 100%
  ) !important;
  z-index: 2 !important;
  transition: opacity 0.3s ease !important;
}

.state-count-badge {
  position: absolute !important;
  top: 18px !important;
  left: 18px !important;
  background: var(--wd-gold) !important;
  color: var(--wd-on-primary) !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.4) !important;
  z-index: 5 !important;
}

.state-card-content {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 24px !important;
  z-index: 5 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.state-card-title {
  color: var(--wd-gold) !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

.state-card-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #FFFFFF !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  opacity: 0.9 !important;
  transition: all 0.3s ease !important;
}

.state-arrow {
  transition: transform 0.3s ease !important;
}

.luxury-state-card:hover .state-card-link {
  color: #60A5FA !important;
  opacity: 1 !important;
}

.luxury-state-card:hover .state-arrow {
  transform: translateX(6px) !important;
}

/* ==========================================================================
   Video Showcase & Lightbox & Glass Shine Effect
   ========================================================================== */

.luxury-video-card {
  position: relative !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  margin-bottom: 25px !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
}

.luxury-video-card:hover {
  transform: translateY(-8px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.35) !important;
}

.video-card-thumb-wrap {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
}

/* Glass Shine Sweep Animation Overlay */
.video-card-thumb-wrap::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 60% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: skewX(-25deg) !important;
  pointer-events: none !important;
  z-index: 5 !important;
  transition: none !important;
}

.luxury-video-card:hover .video-card-thumb-wrap::after {
  left: 150% !important;
  transition: all 0.75s ease-in-out !important;
}

.video-card-thumb {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  pointer-events: none !important;
}

.luxury-video-card:hover .video-card-thumb {
  transform: scale(1.08) !important;
}

.video-play-pulse-btn {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 64px !important;
  height: 64px !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 0 0 0 rgba(217, 167, 82, 0.6) !important;
  z-index: 6 !important;
  pointer-events: none !important;
  transition: all 0.35s ease !important;
  animation: pulse-blue-glow 2s infinite !important;
}

@keyframes pulse-blue-glow {
  0% {
    box-shadow: 0 0 0 0 rgba(217, 167, 82, 0.7);
  }

  70% {
    box-shadow: 0 0 0 18px rgba(217, 167, 82, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(217, 167, 82, 0);
  }
}

.luxury-video-card:hover .video-play-pulse-btn {
  transform: translate(-50%, -50%) scale(1.15) !important;
  background: #FFFFFF !important;
  color: var(--wd-gold) !important;
}

.video-tag-badge {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-radius: 50px !important;
  padding: 5px 16px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  position: absolute !important;
  top: 18px !important;
  left: 18px !important;
  z-index: 6 !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.4) !important;
}

.video-duration-badge {
  background: rgba(15, 23, 42, 0.8) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  color: #FFFFFF !important;
  border-radius: 50px !important;
  padding: 4px 12px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  z-index: 6 !important;
}

/* ==========================================================================
   Full-Screen Video Lightbox Modal Overlay (Fixes bottom inline play bug)
   ========================================================================== */

.custom-video-modal-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(9, 16, 29, 0.88) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  z-index: 999999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  animation: fadeInModal 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

@keyframes fadeInModal {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.custom-video-modal-container {
  position: relative !important;
  width: 100% !important;
  max-width: 900px !important;
  background: #0F172A !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5) !important;
  display: flex !important;
  flex-direction: column !important;
  animation: scaleUpModal 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

@keyframes scaleUpModal {
  from {
    transform: scale(0.92);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

.video-modal-close-btn {
  position: absolute !important;
  top: 16px !important;
  right: 20px !important;
  background: rgba(255, 255, 255, 0.15) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  font-size: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 10 !important;
  transition: all 0.25s ease !important;
}

.video-modal-close-btn:hover {
  background: #EF4444 !important;
  color: #FFFFFF !important;
  border-color: #EF4444 !important;
  transform: rotate(90deg) scale(1.1) !important;
}

.video-modal-header-title {
  color: #FFFFFF !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  padding: 20px 24px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding-right: 65px !important;
}

.video-player-wrapper {
  position: relative !important;
  width: 100% !important;
  padding-top: 56.25% !important;
  background: #000000 !important;
}

.video-element-frame {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border: none !important;
  outline: none !important;
}

/* ==========================================================================
   Testimonials Luxury Cards & Compact Avatar Layout
   ========================================================================== */

.luxury-testimonial-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 20px !important;
  padding: 32px 28px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  transition: all 0.38s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.04) !important;
  margin-bottom: 25px !important;
  position: relative !important;
}

.luxury-testimonial-card:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 20px 45px rgba(217, 167, 82, 0.15) !important;
}

.testimonial-card-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
}

.testimonial-quote-icon svg {
  width: 32px !important;
  height: 32px !important;
  fill: var(--wd-gold) !important;
  opacity: 0.85 !important;
}

.testimonial-stay-property {
  color: var(--wd-gold) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
  letter-spacing: 0.2px !important;
}

.testimonial-quote-text {
  color: #334155 !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  font-style: italic !important;
  margin-bottom: 24px !important;
  flex-grow: 1 !important;
}

.testimonial-user-footer {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding-top: 18px !important;
  border-top: 1px solid #F1F5F9 !important;
  margin-top: auto !important;
}

.testimonial-user-avatar {
  width: 52px !important;
  min-width: 52px !important;
  height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 2px solid var(--wd-gold) !important;
  box-shadow: 0 4px 10px rgba(217, 167, 82, 0.2) !important;
}

.testimonial-user-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.testimonial-user-name {
  color: #0F172A !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

.testimonial-user-place {
  color: #64748B !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

/* ==========================================================================
   Photo Gallery Cards & Glass Shine Effect
   ========================================================================== */

/* Shared "1 large + 4 small" gallery layout: used on the Home page preview
   and on every full-image group (in chunks of 5) on the Gallery page.
   Scoped to .home-gallery-grid only, so any leftover/odd-sized group of
   images (rendered with the plain .row.grid-gap fallback) is untouched. */
.home-gallery-grid {
  display: grid !important;
  grid-template-columns: 1.15fr 1fr 1fr !important;
  grid-template-rows: repeat(2, 210px) !important;
  gap: 18px !important;
}

.home-gallery-grid .gallery-img-wrap {
  height: 100% !important;
  aspect-ratio: unset !important;
}

.home-gallery-item-large {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
}

.home-gallery-grid .luxury-gallery-card {
  height: 100% !important;
  width: 100% !important;
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .home-gallery-grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 220px repeat(2, 160px) !important;
  }

  .home-gallery-item-large {
    grid-column: 1 / span 2 !important;
    grid-row: 1 !important;
  }
}

/* fewer than 5 photos in a category: fill the space without repeating photos */
.home-gallery-grid--n1 { grid-template-columns: 1fr !important; grid-template-rows: 438px !important; }
.home-gallery-grid--n1 .home-gallery-item-large { grid-row: 1 !important; }
.home-gallery-grid--n2 { grid-template-columns: 1.15fr 1fr !important; }
.home-gallery-grid--n2 .home-gallery-item:nth-child(2) { grid-row: 1 / span 2 !important; }
.home-gallery-grid--n3 { grid-template-columns: 1.15fr 1fr !important; }
.home-gallery-grid--n4 .home-gallery-item:nth-child(4) { grid-column: 2 / span 2 !important; }

@media (max-width: 768px) {
  .home-gallery-grid--n1,
  .home-gallery-grid--n2,
  .home-gallery-grid--n3,
  .home-gallery-grid--n4 {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 220px !important;
    grid-auto-rows: 160px !important;
  }
  .home-gallery-grid--n1 .home-gallery-item-large { grid-column: 1 / span 2 !important; }
  .home-gallery-grid--n2 .home-gallery-item:nth-child(2),
  .home-gallery-grid--n4 .home-gallery-item:nth-child(4) { grid-row: auto !important; grid-column: 1 / span 2 !important; }
}

.luxury-gallery-card {
  display: block !important;
  position: relative !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  height: 220px !important;
  margin-bottom: 25px !important;
  box-shadow: 0 8px 24px rgba(9, 16, 29, 0.08) !important;
  border: 1px solid #EAECF0 !important;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-gallery-card:hover {
  transform: translateY(-6px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 16px 36px rgba(217, 167, 82, 0.25) !important;
}

/* Glass Shine Sweep Animation Overlay */
.luxury-gallery-card::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 60% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 50%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: skewX(-25deg) !important;
  pointer-events: none !important;
  z-index: 5 !important;
  transition: none !important;
}

.luxury-gallery-card:hover::after {
  left: 150% !important;
  transition: all 0.75s ease-in-out !important;
}

.gallery-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.luxury-gallery-card:hover .gallery-card-img {
  transform: scale(1.1) !important;
}

.gallery-card-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(15, 23, 42, 0.4) !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
  z-index: 2 !important;
}

.luxury-gallery-card:hover .gallery-card-overlay {
  opacity: 1 !important;
}

.gallery-card-zoom-icon {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) scale(0.7) !important;
  width: 46px !important;
  height: 46px !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0 !important;
  transition: all 0.35s ease !important;
  z-index: 6 !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.5) !important;
}

.luxury-gallery-card:hover .gallery-card-zoom-icon {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

/* Home Gallery Carousel & Category Navigation */
.home-gallery-grid {
  transition: opacity 0.22s cubic-bezier(0.4, 0, 0.2, 1), transform 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.home-gallery-grid.is-changing {
  opacity: 0.15 !important;
  transform: scale(0.985) !important;
}

.home-gallery-nav-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  margin-top: 36px !important;
}

.home-gallery-nav-bar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  background: #FFFFFF !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 30px rgba(9, 16, 29, 0.08) !important;
  border: 1.5px solid rgba(217, 167, 82, 0.3) !important;
  max-width: 100% !important;
}

.gallery-nav-arrow-btn {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--wd-gold) !important;
  background: #FCF9F5 !important;
  color: #09101D !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  flex-shrink: 0 !important;
  outline: none !important;
  padding: 0 !important;
}

.gallery-nav-arrow-btn:hover {
  background: linear-gradient(135deg, #E2B767, var(--wd-gold)) !important;
  color: #FFFFFF !important;
  transform: scale(1.08) !important;
  box-shadow: 0 6px 20px rgba(217, 167, 82, 0.45) !important;
  border-color: var(--wd-gold) !important;
}

.gallery-nav-arrow-btn:active {
  transform: scale(0.95) !important;
}

.gallery-nav-info-pill {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 6px 14px !important;
  user-select: none !important;
}

.gallery-nav-pill-tag {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--wd-gold) !important;
  background: rgba(217, 167, 82, 0.12) !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  line-height: 1.2 !important;
}

.gallery-nav-pill-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #09101D !important;
  white-space: nowrap !important;
  font-family: inherit !important;
}

.gallery-nav-pill-count {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #667085 !important;
  background: #F2F4F7 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  line-height: 1.2 !important;
}

.gallery-nav-dots-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

.gallery-nav-dot {
  width: 10px !important;
  height: 10px !important;
  border-radius: 999px !important;
  border: none !important;
  background: #D0D5DD !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  padding: 0 !important;
  outline: none !important;
}

.gallery-nav-dot:hover {
  background: var(--wd-gold) !important;
}

.gallery-nav-dot.active {
  width: 28px !important;
  background: linear-gradient(90deg, var(--wd-gold), #B9832A) !important;
  box-shadow: 0 2px 8px rgba(217, 167, 82, 0.4) !important;
}

/* Home gallery: arrow - dots - arrow in one row */
.home-gallery-nav-bar--split {
  gap: 28px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

.home-gallery-nav-bar--split .gallery-nav-dots-wrapper {
  gap: 9px !important;
  flex-wrap: wrap !important;
}

.home-gallery-nav-bar--split .gallery-nav-dot {
  width: 9px !important;
  height: 9px !important;
}

.home-gallery-nav-bar--split .gallery-nav-dot.active {
  width: 36px !important;
  box-shadow: none !important;
}

@media (max-width: 576px) {
  .home-gallery-nav-bar {
    padding: 6px 8px !important;
    gap: 8px !important;
  }
  .gallery-nav-arrow-btn {
    width: 40px !important;
    height: 40px !important;
  }
  .home-gallery-nav-bar--split {
    gap: 14px !important;
  }
  .home-gallery-nav-bar--split .gallery-nav-dot.active {
    width: 24px !important;
  }
  .gallery-nav-info-pill {
    gap: 6px !important;
    padding: 4px 6px !important;
  }
  .gallery-nav-pill-tag {
    display: none !important;
  }
  .gallery-nav-pill-title {
    font-size: 13px !important;
  }
  .gallery-nav-pill-count {
    font-size: 11px !important;
    padding: 2px 6px !important;
  }
}


/* ==========================================================================
   Enquiry CTA Banner & WhatsApp Button Styling
   ========================================================================== */

.luxury-cta-banner {
  background: var(--wd-gold-soft) !important;
  border: 1.5px solid var(--wd-gold) !important;
  border-radius: 24px !important;
  padding: 60px 40px !important;
  box-shadow: 0 12px 35px rgba(217, 167, 82, 0.08) !important;
}

.cta-buttons-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin-top: 32px !important;
}

.btn-whatsapp-luxury {
  background: #25D366 !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 13px 32px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 4px 16px rgba(37, 211, 102, 0.35) !important;
  border: none !important;
}

.btn-whatsapp-luxury,
.btn-whatsapp-luxury:hover,
.btn-whatsapp-luxury:focus,
.btn-whatsapp-luxury * {
  text-decoration: none !important;
}

.btn-whatsapp-luxury:hover {
  background: #1DA851 !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.5) !important;
}

/* ==========================================================================
   AtlasTrip Dark Navy Footer Design System
   ========================================================================== */

/* ==========================================================================
   AtlasTrip Dark Navy Footer Design System
   ========================================================================== */

footer,
.luxury-footer,
.footer-main,
.footer-top {
  background: linear-gradient(135deg, #09101D 0%, var(--wd-green) 100%) !important;
  color: #CBD5E1 !important;
}

.luxury-footer {
  padding-top: 50px !important;
}

.footer-header-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-bottom: 25px !important;
  flex-wrap: wrap !important;
}

.footer-brand-logo {
  display: inline-block !important;
}

.footer-call-box {
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 10px 24px !important;
  background: rgba(217, 167, 82, 0.1) !important;
  border: 1px solid rgba(217, 167, 82, 0.4) !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 4px 16px rgba(217, 167, 82, 0.15) !important;
}

.footer-call-box:hover {
  background: var(--wd-gold) !important;
  border-color: var(--wd-gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.35) !important;
}

.footer-call-box:hover .call-number,
.footer-call-box:hover .call-subtext {
  color: #FFFFFF !important;
}

.footer-call-box:hover .call-icon-badge {
  background: #FFFFFF !important;
}

.footer-call-box:hover .call-icon-badge svg {
  stroke: var(--wd-gold) !important;
}

.call-icon-badge {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: var(--wd-gold-soft) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s ease !important;
}

.call-info {
  display: flex !important;
  flex-direction: column !important;
}

.call-subtext {
  font-size: 11px !important;
  color: #94A3B8 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-weight: 600 !important;
}

.call-number {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--wd-gold) !important;
  letter-spacing: 0.2px !important;
}

.footer-divider-gold {
  height: 1px !important;
  background: linear-gradient(90deg, rgba(217, 167, 82, 0.5) 0%, rgba(217, 167, 82, 0.15) 50%, transparent 100%) !important;
  margin-bottom: 30px !important;
}

.luxury-footer-title {
  color: #FFFFFF !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
  letter-spacing: -0.2px !important;
}

.footer-contact-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.footer-contact-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: #CBD5E1 !important;
  font-size: 14.5px !important;
}

.contact-link {
  color: #CBD5E1 !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.contact-icon-svg {
  display: inline-flex !important;
  align-items: center !important;
  color: var(--wd-gold) !important;
  flex-shrink: 0 !important;
}

.contact-link:hover {
  color: #F0C878 !important;
}

.social-tag {
  color: var(--wd-gold) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  display: block !important;
  margin-top: 14px !important;
  margin-bottom: 12px !important;
}

.social-icons-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.social-circle-btn {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #CBD5E1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}

.social-circle-btn:hover {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 6px 18px rgba(217, 167, 82, 0.45) !important;
  transform: translateY(-3px) !important;
}

.luxury-footer-links {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.luxury-footer-links a {
  color: #CBD5E1 !important;
  text-decoration: none !important;
  font-size: 14.5px !important;
  transition: all 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.luxury-footer-links a:hover {
  color: #F0C878 !important;
  transform: translateX(5px) !important;
}

.properties-grid-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.property-footer-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 18px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 50px !important;
  color: #F1F5F9 !important;
  text-decoration: none !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  transition: all 0.28s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.pill-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: var(--wd-gold) !important;
  transition: background 0.25s ease !important;
}

.property-footer-pill:hover {
  background: var(--wd-gold) !important;
  border-color: var(--wd-gold) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(217, 167, 82, 0.35) !important;
}

.property-footer-pill:hover .pill-dot {
  background: #FFFFFF !important;
}

.all-properties-gold-link {
  color: #F0C878 !important;
  font-weight: 700 !important;
  font-size: 14.5px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.25s ease !important;
}

.all-properties-gold-link:hover {
  color: #FFFFFF !important;
  transform: translateX(4px) !important;
}

.gold-accent-text {
  color: #F0C878 !important;
  font-weight: 600 !important;
}

.footer-bottom-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: #050B08 !important;
  padding: 22px 0 !important;
  color: #94A3B8 !important;
  font-size: 13.5px !important;
}

.bottom-bar-flex {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
}

.footer-legal-links {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.footer-legal-links a {
  color: #94A3B8 !important;
  text-decoration: none !important;
  transition: color 0.25s ease !important;
}

.footer-legal-links a:hover {
  color: #F0C878 !important;
}

/* ==========================================================================
   Header Navigation Hover & Action Button Fixes
   ========================================================================== */

.header-1 .menu-link,
.header-nav .menu-link,
.header-menu .menu-link {
  background: transparent !important;
  color: #1E293B !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
  transition: all 0.25s ease !important;
  border: none !important;
  box-shadow: none !important;
}

.header-1 .menu-link:hover,
.header-nav .menu-link:hover,
.header-menu .menu-link:hover {
  color: var(--wd-gold) !important;
  background: rgba(217, 167, 82, 0.07) !important;
}

.header-1 .menu-link.active,
.header-nav .menu-link.active,
.header-menu .menu-link.active {
  color: var(--wd-gold) !important;
  font-weight: 600 !important;
  background: rgba(217, 167, 82, 0.1) !important;
  border: none !important;
  box-shadow: none !important;
}

.btn-header-contact {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  padding: 10px 24px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 4px 14px rgba(217, 167, 82, 0.3) !important;
  letter-spacing: 0.2px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.btn-header-contact:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(217, 167, 82, 0.45) !important;
}

/* Header Height, Sticky Positioning & High Stacking Order (z-index) */
sticky-header {
  display: block !important;
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 99999 !important;
  background: #FFFFFF !important;
}

header.header-1,
.header-1,
.header-sticky {
  position: relative !important;
  top: auto !important;
  width: 100% !important;
  z-index: 99999 !important;
  background: #FFFFFF !important;
}

.header-1 {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
  min-height: 88px !important;
  display: flex !important;
  align-items: center !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

.header-1 .header-grid {
  align-items: center !important;
}

/* ==========================================================================
   Welcome To Wanderama Hospitality (About Section) Luxury Styling
   ========================================================================== */

.image-text-about {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 80px 0 !important;
}

@media (max-width: 768px) {
  .image-text-about {
    margin-top: 0 !important;
    padding: 50px 0 !important;
  }
}

.about-content-wrapper {
  padding-right: 15px !important;
}

.about-content-wrapper .section-sub-tag {
  display: inline-block !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  padding: 6px 16px !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  margin-bottom: 14px !important;
}

.about-content-wrapper .section-main-title {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  line-height: 1.25 !important;
  margin-bottom: 16px !important;
}

.about-content-wrapper .section-body-text {
  font-size: 15.5px !important;
  color: #475569 !important;
  line-height: 1.7 !important;
  margin-bottom: 28px !important;
}

.intro-text-clamp {
  display: -webkit-box !important;
  -webkit-line-clamp: 8 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.intro-see-more-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: -18px 0 24px 0 !important;
  color: var(--wd-gold) !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

.intro-see-more-btn:hover {
  color: var(--wd-gold-dark) !important;
  text-decoration: underline !important;
}

.about-features-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px 20px !important;
  margin-bottom: 32px !important;
}

@media (max-width: 576px) {
  .about-features-grid {
    grid-template-columns: 1fr !important;
  }
}

.about-feature-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: #F8FAFC !important;
  padding: 12px 16px !important;
  border-radius: 12px !important;
  border: 1px solid #E2E8F0 !important;
  transition: all 0.25s ease !important;
}

.about-feature-item:hover {
  background: #FFFFFF !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 4px 15px rgba(217, 167, 82, 0.1) !important;
  transform: translateY(-2px) !important;
}

.feature-check-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 4px 10px rgba(217, 167, 82, 0.3) !important;
}

.feature-text {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #1E293B !important;
  line-height: 1.3 !important;
}

.btn-about-more,
.btn-hero-primary {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 13px 32px !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: 0 4px 16px rgba(217, 167, 82, 0.35) !important;
}

.btn-about-more:hover,
.btn-hero-primary:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(217, 167, 82, 0.5) !important;
}

.btn-hero-primary .btn-arrow-icon {
  transition: transform 0.25s ease !important;
}

.btn-hero-primary:hover .btn-arrow-icon {
  transform: translateX(4px) !important;
}

/* Force all data-aos elements to be 100% visible immediately */
[data-aos] {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  transition: opacity 0.3s ease, transform 0.3s ease !important;
}

/* Optimized Spacing for Properties & Inner Pages */
.blog-list.mt-100,
.blog-list.mt-40 {
  margin-top: 40px !important;
}

.blog-list .section-headings {
  margin-bottom: 25px !important;
}

.blog-list .tab-buttons {
  margin-bottom: 35px !important;
}

.subscribe-2 {
  margin-top: 80px !important;
  margin-bottom: 90px !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  clear: both !important;
}

.subscribe-2 .subscribe-wrap {
  padding: 48px 24px !important;
  margin-top: 40px !important;
  margin-bottom: 40px !important;
  border-radius: 20px !important;
}

/* Pixel-Perfect Luxury CTA Card (Ref Design) */
.luxury-cta-card {
  background: #FDF7ED !important;
  border: 1.5px solid #F0C878 !important;
  border-radius: 28px !important;
  padding: 54px 36px 46px 36px !important;
  box-shadow: 0 12px 36px rgba(217, 167, 82, 0.12) !important;
  margin: 0 auto !important;
  max-width: 1080px !important;
}

.luxury-cta-card .cta-sub-tag {
  color: var(--wd-gold-deep) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  margin-bottom: 12px !important;
}

.luxury-cta-card .cta-title {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  letter-spacing: -0.5px !important;
  margin-bottom: 14px !important;
}

.luxury-cta-card .cta-text {
  font-size: 15.5px !important;
  color: #475569 !important;
  max-width: 640px !important;
  margin: 0 auto 30px !important;
  line-height: 1.6 !important;
}

.btn-cta-blue {
  background: var(--wd-gold) !important;
  color: #FFFFFF !important;
  padding: 13px 32px !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  box-shadow: 0 8px 20px rgba(217, 167, 82, 0.35) !important;
  border: none !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.25s ease !important;
}

.btn-cta-blue:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(217, 167, 82, 0.45) !important;
}

.btn-cta-whatsapp {
  background: #25D366 !important;
  color: #FFFFFF !important;
  padding: 13px 28px !important;
  border-radius: 50px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  box-shadow: 0 8px 20px rgba(37, 211, 102, 0.35) !important;
  border: none !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.25s ease !important;
}

.btn-cta-whatsapp:hover {
  background: #1EBE5D !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(37, 211, 102, 0.45) !important;
}

/* Luxury Gallery Showcase Card Hover Effects */
.luxury-gallery-card-item:hover img {
  transform: scale(1.06) !important;
}

.luxury-gallery-card-item:hover .gallery-card-hover-overlay {
  opacity: 1 !important;
}

/* ==========================================================================
   Property Photo Showcase — Bento Grid Layout
   ========================================================================== */
.property-gallery-bento {
  display: flex !important;
  gap: 12px !important;
  height: 480px !important;
  transition: opacity 0.2s ease !important;
}

.property-gallery-bento.is-changing {
  opacity: 0.3 !important;
}

.property-gallery-bento.property-gallery-bento-single {
  height: 420px !important;
}

.property-gallery-main-col {
  flex: 1 1 55% !important;
  min-width: 0 !important;
  display: flex !important;
}

.property-gallery-main-col .property-gallery-tile {
  flex: 1 !important;
}

.property-gallery-side-col {
  flex: 1 1 45% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.property-gallery-side-row {
  flex: 1 !important;
  min-height: 0 !important;
  display: flex !important;
  gap: 12px !important;
}

.property-gallery-tile {
  position: relative !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  background: #0F172A !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  flex: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

.property-gallery-tile img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}

.property-gallery-tile .gallery-card-hover-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to top, rgba(15, 23, 42, 0.7) 0%, rgba(15, 23, 42, 0.1) 60%, transparent 100%) !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

.property-gallery-tile-counter {
  position: absolute !important;
  bottom: 12px !important;
  right: 12px !important;
  background: rgba(15, 23, 42, 0.75) !important;
  color: #FFFFFF !important;
  backdrop-filter: blur(4px) !important;
  padding: 4px 12px !important;
  border-radius: 14px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.property-gallery-more-badge {
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

@media (max-width: 767px) {
  .property-gallery-bento {
    flex-direction: column !important;
    height: auto !important;
  }

  .property-gallery-bento.property-gallery-bento-single {
    height: 280px !important;
  }

  .property-gallery-main-col {
    height: 260px !important;
    flex: none !important;
    width: 100% !important;
  }

  .property-gallery-side-col {
    height: auto !important;
    flex: none !important;
    width: 100% !important;
  }

  .property-gallery-side-row {
    height: 140px !important;
    flex: none !important;
  }

  .property-gallery-side-col > .property-gallery-tile {
    height: 140px !important;
    flex: none !important;
  }
}

/* ==========================================================================
   Weddings & Events — "From Past Celebrations" Gallery Bento Grid
   ========================================================================== */
.wedding-gallery-bento {
  display: flex !important;
  gap: 14px !important;
  height: 460px !important;
  transition: opacity 0.2s ease !important;
}

.wedding-gallery-bento.is-changing {
  opacity: 0.3 !important;
}

.wedding-gallery-bento.wedding-gallery-bento-single {
  height: 400px !important;
}

.wedding-gallery-main-col {
  flex: 1 1 55% !important;
  min-width: 0 !important;
  display: flex !important;
}

.wedding-gallery-main-col .wedding-gallery-tile {
  flex: 1 !important;
}

.wedding-gallery-side-col {
  flex: 1 1 45% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

.wedding-gallery-side-row {
  flex: 1 !important;
  min-height: 0 !important;
  display: flex !important;
  gap: 14px !important;
}

.wedding-gallery-tile {
  position: relative !important;
  display: block !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  border: 1px solid #EAECF0 !important;
  box-shadow: 0 10px 28px rgba(9, 16, 29, 0.06) !important;
  transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  flex: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

.wedding-gallery-tile:hover {
  transform: translateY(-4px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 16px 36px rgba(217, 167, 82, 0.18) !important;
}

.wedding-gallery-tile .gallery-card-img {
  width: 100% !important;
  height: 100% !important;
}

.wedding-gallery-tile:hover .gallery-card-img {
  transform: scale(1.08) !important;
}

@media (max-width: 767px) {
  .wedding-gallery-bento {
    flex-direction: column !important;
    height: auto !important;
  }

  .wedding-gallery-bento.wedding-gallery-bento-single {
    height: 280px !important;
  }

  .wedding-gallery-main-col {
    height: 260px !important;
    flex: none !important;
    width: 100% !important;
  }

  .wedding-gallery-side-col {
    height: auto !important;
    flex: none !important;
    width: 100% !important;
  }

  .wedding-gallery-side-row {
    height: 140px !important;
    flex: none !important;
  }

  .wedding-gallery-side-col > .wedding-gallery-tile {
    height: 140px !important;
    flex: none !important;
  }
}

/* Star Rating — yellow/gold fill everywhere (Home & Testimonials pages) */
.rating-list .rating-item svg {
  color: #FFC107 !important;
}

/* ==========================================================================
   ADMIN PANEL — RESPONSIVE SIDEBAR (mobile & tablet)
   Desktop keeps the always-visible 260px sidebar (inline styles, unchanged).
   Below 992px it becomes an off-canvas drawer toggled by the hamburger button.
   ========================================================================== */
.admin-sidebar-overlay {
  display: none;
}

@media (max-width: 991.98px) {
  .admin-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    height: 100vh !important;
    transform: translateX(-100%);
    transition: transform 0.28s ease;
    z-index: 1050 !important;
  }

  .admin-sidebar.admin-sidebar--open {
    transform: translateX(0);
  }

  .admin-sidebar-overlay {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    z-index: 1040;
  }
}

@media (min-width: 992px) {
  .admin-menu-toggle {
    display: none !important;
  }
}

/* Fix: the theme's own .badge rule (an absolutely-positioned offer-ribbon
   style meant for product cards) collides with Bootstrap's .badge utility
   class used for status/type pills inside the Admin Dashboard tables —
   without this override every pill renders pinned to the top-left corner
   of the page instead of inline. Scoped to the admin panel only so the
   theme's real offer-ribbon badges elsewhere are untouched. */
.admin-dashboard-root .badge {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  box-shadow: none !important;
  border-radius: 6px !important;
}

/* ==========================================================================
   WANDERAMA LUXURY BLOG DETAILS DESIGN SYSTEM (V2 - ULTRA PREMIUM EDITORIAL)
   ========================================================================== */

.blog-toast-notification {
  position: fixed;
  bottom: 32px;
  right: 32px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--wd-green);
  color: #FFFFFF;
  padding: 14px 24px;
  border-radius: 50px;
  box-shadow: 0 10px 30px rgba(16, 55, 43, 0.35);
  font-size: 14px;
  font-weight: 600;
  border: 1px solid rgba(217, 167, 82, 0.4);
  animation: slideUpFade 0.35s ease forwards;
}

@keyframes slideUpFade {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==========================================================================
   Blog Details page: Primary <-> Secondary swapped.
   Inside this section the brand tokens are exchanged, so everything that uses
   var(--wd-*) flips: gold becomes dark green, dark green becomes gold.
   ========================================================================== */
.blog-details-section {
  --wd-gold: #10372B;
  --wd-gold-dark: #0B261E;
  --wd-gold-deep: #10372B;
  --wd-gold-soft: #E7F0EC;
  --wd-green: #D9A752;
  --wd-green-dark: #C8963F;
}

.blog-details-section {
  padding: 40px 0 100px 0 !important;
  background-color: #FAFAF9 !important;
  min-height: 80vh !important;
}

.blog-details-layout-wrapper {
  display: grid !important;
  grid-template-columns: 290px minmax(0, 1fr) 300px !important;
  gap: 28px !important;
  max-width: 1480px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  align-items: start !important;
}

.blog-details-layout-wrapper.no-left-sidebar {
  grid-template-columns: minmax(0, 1fr) 300px !important;
}

.blog-details-left-sidebar {
  grid-column: auto !important;
  width: 100% !important;
  align-self: stretch !important;
}

.blog-details-main-content {
  grid-column: auto !important;
  width: 100% !important;
  background: #FFFFFF !important;
  border-radius: 24px !important;
  padding: 40px 44px !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04) !important;
}

.blog-details-sidebar {
  grid-column: auto !important;
  width: 100% !important;
  align-self: stretch !important;
}

/* Breadcrumb Navigation */
.blog-breadcrumbs {
  margin-bottom: 24px !important;
}

.blog-breadcrumbs ol {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13.5px !important;
}

.blog-breadcrumbs li a {
  color: #64748B !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  transition: color 0.2s ease !important;
}

.blog-breadcrumbs li a:hover {
  color: var(--wd-green) !important;
}

.blog-breadcrumbs .bc-sep {
  color: #CBD5E1 !important;
}

.blog-breadcrumbs .bc-current {
  color: var(--wd-gold) !important;
  font-weight: 600 !important;
}

/* Category Pill & Headline */
.blog-header-box {
  margin-bottom: 28px !important;
}

.blog-category-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold-deep) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  padding: 6px 14px !important;
  border-radius: 50px !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
  margin-bottom: 18px !important;
  border: 1px solid rgba(16, 55, 43, 0.22) !important;
}

.blog-main-heading {
  font-size: 38px !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  line-height: 1.28 !important;
  letter-spacing: -0.6px !important;
  margin-bottom: 16px !important;
  text-transform: none !important;
}

.blog-main-excerpt {
  font-size: 18.5px !important;
  line-height: 1.65 !important;
  color: #475569 !important;
  font-weight: 400 !important;
  margin-bottom: 0 !important;
  padding-left: 16px !important;
  border-left: 3.5px solid var(--wd-gold) !important;
}

/* Metadata Bar */
.blog-meta-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  padding: 16px 20px !important;
  background: #F8FAFC !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 16px !important;
  margin-top: 28px !important;
  margin-bottom: 36px !important;
}

.meta-author-group {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.author-avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, var(--wd-green) 0%, #E6BB65 100%) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 800 !important;
  font-size: 17px !important;
  border: 2px solid var(--wd-gold) !important;
  box-shadow: 0 4px 12px rgba(217, 167, 82, 0.2) !important;
}

.author-text {
  display: flex !important;
  flex-direction: column !important;
}

.author-name {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  line-height: 1.2 !important;
}

.author-role {
  font-size: 12px !important;
  color: #64748B !important;
  font-weight: 500 !important;
}

.meta-info-group {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
}

.meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13.5px !important;
  color: #475569 !important;
  font-weight: 500 !important;
}

.meta-item svg {
  color: var(--wd-gold) !important;
}

.meta-dot {
  width: 4px !important;
  height: 4px !important;
  border-radius: 50% !important;
  background-color: #CBD5E1 !important;
}

.verified-story-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: var(--wd-gold-soft) !important;
  color: var(--wd-gold-deep) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  border-radius: 30px !important;
  border: 1px solid rgba(16, 55, 43, 0.2) !important;
}

/* Featured Hero Image Container */
.blog-hero-image-box {
  width: 100% !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08) !important;
  margin-bottom: 40px !important;
  background-color: #F1F5F9 !important;
  border: 1px solid #EAECF0 !important;
}

.blog-hero-image-box img {
  width: 100% !important;
  max-height: 480px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}

.blog-hero-image-box:hover img {
  transform: scale(1.015) !important;
}

/* ==========================================================================
   Blog Details Hero: title + meta on the left, featured image on the right
   ========================================================================== */
.blog-hero {
  width: 100% !important;
  background: var(--wd-primary-soft) !important;
  margin: -40px 0 44px 0 !important;
  padding: 52px 24px 56px 24px !important;
  border-bottom: 1px solid rgba(217, 167, 82, 0.25) !important;
}

.blog-hero-inner {
  max-width: 1432px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important;
  gap: 56px !important;
  align-items: center !important;
}

.blog-hero .blog-breadcrumbs {
  margin-bottom: 18px !important;
}

.blog-hero-title {
  font-size: clamp(30px, 3.4vw, 46px) !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  line-height: 1.16 !important;
  letter-spacing: -0.8px !important;
  margin: 0 !important;
  text-transform: none !important;
}

.blog-hero .blog-meta-bar {
  margin: 28px 0 0 0 !important;
  background: #FFFFFF !important;
}

.blog-hero-media {
  width: 100% !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background-color: #F1F5F9 !important;
  border: 1px solid #EAECF0 !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08) !important;
}

.blog-hero-media img {
  width: 100% !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

@media (max-width: 991px) {
  .blog-hero {
    padding: 32px 16px 36px 16px !important;
    margin-bottom: 32px !important;
  }
  .blog-hero-inner {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .blog-hero-title {
    font-size: 30px !important;
  }
}

/* Rich Content Body Formatting */
.blog-rich-content {
  font-size: 18px !important;
  line-height: 1.85 !important;
  color: #334155 !important;
}

.blog-rich-content p {
  margin-bottom: 24px !important;
  color: #334155 !important;
  font-size: 18px !important;
  line-height: 1.85 !important;
}

.blog-rich-content h1,
.blog-rich-content h2,
.blog-rich-content h3,
.blog-rich-content h4 {
  color: #0F172A !important;
  font-weight: 800 !important;
  margin-top: 42px !important;
  margin-bottom: 18px !important;
  scroll-margin-top: 110px !important;
  line-height: 1.3 !important;
  letter-spacing: -0.3px !important;
}

.blog-rich-content h2 {
  font-size: 26px !important;
  padding-left: 14px !important;
  border-left: 4px solid var(--wd-green) !important;
}

.blog-rich-content h3 {
  font-size: 22px !important;
}

.blog-rich-content h4 {
  font-size: 19px !important;
}

.blog-rich-content blockquote {
  position: relative !important;
  margin: 32px 0 !important;
  padding: 24px 28px !important;
  background: linear-gradient(135deg, #F8FAFC 0%, #FBF8F3 100%) !important;
  border-left: 4px solid var(--wd-green) !important;
  border-radius: 0 16px 16px 0 !important;
  font-style: italic !important;
  font-size: 18.5px !important;
  line-height: 1.7 !important;
  color: #1E293B !important;
  box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
}

.blog-rich-content ul,
.blog-rich-content ol {
  margin: 24px 0 !important;
  padding-left: 24px !important;
}

.blog-rich-content li {
  margin-bottom: 12px !important;
  color: #334155 !important;
  font-size: 17.5px !important;
  line-height: 1.7 !important;
}

.blog-rich-content a {
  color: var(--wd-gold-deep) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  transition: color 0.2s ease !important;
}

.blog-rich-content a:hover {
  color: var(--wd-green) !important;
}

/* Article Author Card & Footer Share */
.blog-article-footer {
  margin-top: 48px !important;
  padding-top: 36px !important;
  border-top: 1px solid #E2E8F0 !important;
}

.blog-author-card {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 28px !important;
  background: linear-gradient(135deg, var(--wd-green) 0%, #C8963F 100%) !important;
  border-radius: 20px !important;
  color: #FFFFFF !important;
  margin-bottom: 32px !important;
  border: 1px solid rgba(16, 55, 43, 0.3) !important;
  box-shadow: 0 12px 30px rgba(217, 167, 82, 0.15) !important;
}

.author-card-avatar {
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, var(--wd-gold) 0%, var(--wd-gold-deep) 100%) !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
  border: 2px solid #FFFFFF !important;
  box-shadow: 0 6px 16px rgba(16, 55, 43, 0.4) !important;
}

.author-card-content h4 {
  color: #FFFFFF !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  margin: 0 0 4px 0 !important;
}

.author-card-subtitle {
  display: block !important;
  color: var(--wd-gold) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

.author-card-content p {
  color: #FFFFFF !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.blog-share-nav-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
}

.share-section {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.share-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #475569 !important;
}

.share-buttons {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.share-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: #F8FAFC !important;
  border: 1px solid #E2E8F0 !important;
  color: #475569 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  text-decoration: none !important;
}

.share-btn:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-green) !important;
  transform: translateY(-2px) !important;
}

.share-btn.whatsapp-btn:hover {
  background: #25D366 !important;
  border-color: #25D366 !important;
}

.share-btn.twitter-btn:hover {
  background: #000000 !important;
  border-color: #000000 !important;
}

.share-btn.facebook-btn:hover {
  background: #1877F2 !important;
  border-color: #1877F2 !important;
}

.btn-back-to-blogs {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #F8FAFC !important;
  color: var(--wd-green) !important;
  border: 1.5px solid #E2E8F0 !important;
  padding: 10px 22px !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.btn-back-to-blogs:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-green) !important;
  transform: translateX(-3px) !important;
}

/* Right Sidebar Layout & Widgets */
.blog-details-sidebar {
  width: 100% !important;
}

.sidebar-sticky-inner {
  position: sticky !important;
  top: 110px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}


.sidebar-widget {
  background: #FFFFFF !important;
  border-radius: 20px !important;
  border: 1px solid #E2E8F0 !important;
  padding: 28px 24px !important;
  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.04) !important;
}

/* CTA Widget */
.sidebar-cta-widget {
  background: linear-gradient(135deg, var(--wd-green) 0%, #C8963F 100%) !important;
  border-radius: 20px !important;
  padding: 30px 24px !important;
  text-align: center !important;
  color: #FFFFFF !important;
  box-shadow: 0 10px 28px rgba(217, 167, 82, 0.2) !important;
  border: 1px solid rgba(16, 55, 43, 0.25) !important;
}

.sidebar-cta-widget .cta-icon-badge {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: rgba(16, 55, 43, 0.15) !important;
  color: var(--wd-gold) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 16px auto !important;
  border: 1px solid rgba(16, 55, 43, 0.3) !important;
}

.sidebar-cta-widget .cta-heading {
  color: #FFFFFF !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  margin-bottom: 12px !important;
  text-align: center !important;
}

.sidebar-cta-widget .cta-subtext {
  color: #FFFFFF !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  margin-bottom: 22px !important;
  text-align: center !important;
}

.sidebar-cta-widget a,
.sidebar-cta-widget .cta-action-btn,
.cta-action-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  background: #FFFFFF !important;
  color: var(--wd-gold) !important; /* dark green on this page (tokens swapped) */
  padding: 13px 24px !important;
  border-radius: 50px !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 15px rgba(16, 55, 43, 0.3) !important;
  border: none !important;
}

.sidebar-cta-widget a:hover,
.sidebar-cta-widget .cta-action-btn:hover,
.cta-action-btn:hover {
  background: var(--wd-gold-dark) !important;
  color: #FFFFFF !important;
  text-decoration: none !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(16, 55, 43, 0.45) !important;
}

/* TOC Widget */
.sidebar-toc-widget {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04) !important;
  background: #FFFFFF !important;
}

.toc-widget-header {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  padding: 16px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 2px solid var(--wd-gold) !important;
}

.toc-widget-toggle {
  width: 100% !important;
  border: none !important;
  cursor: default !important;
  font-family: inherit !important;
}

.toc-header-right {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.toc-expand-icon {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.25s ease !important;
}

.toc-header-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #FFFFFF !important;
}

.toc-count-badge {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #FFFFFF !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
}

.toc-nav-list ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 12px 0 !important;
}

.toc-nav-item a {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 12px 20px !important;
  text-decoration: none !important;
  border-left: 3px solid transparent !important;
  transition: all 0.2s ease !important;
}

.toc-number {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--wd-gold) !important;
  line-height: 1.4 !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  margin: 0 !important;
}

.toc-text-wrap {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  gap: 3px !important;
}

.toc-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1E293B !important;
  line-height: 1.4 !important;
  display: block !important;
}

.toc-desc {
  font-size: 12.5px !important;
  font-weight: 400 !important;
  color: #64748B !important;
  line-height: 1.45 !important;
  display: block !important;
}

.toc-item-sub a {
  padding-left: 32px !important;
}

/* Contact / Help Widget */
.sidebar-contact-widget h4 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #0F172A !important;
  margin-bottom: 8px !important;
}

.sidebar-contact-widget p {
  font-size: 13.5px !important;
  color: #64748B !important;
  line-height: 1.5 !important;
  margin-bottom: 18px !important;
}

.contact-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}

.contact-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 10px 14px !important;
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.contact-btn.phone-btn {
  background: #F1F5F9 !important;
  color: #1E293B !important;
  border: 1px solid #CBD5E1 !important;
}

.contact-btn.phone-btn:hover {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  border-color: var(--wd-green) !important;
}

.contact-btn.whatsapp-btn {
  background: #DCFCE7 !important;
  color: #166534 !important;
  border: 1px solid #BBF7D0 !important;
}

.contact-btn.whatsapp-btn:hover {
  background: #25D366 !important;
  color: #FFFFFF !important;
  border-color: #25D366 !important;
}

/* Share Widget (Right Sidebar Bottom) */
.sidebar-share-widget {
  background: #F8FAFC !important;
  border-radius: 16px !important;
  border: 1px solid #E2E8F0 !important;
  padding: 24px 20px !important;
  text-align: center !important;
}

.share-widget-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1E293B !important;
  margin-bottom: 16px !important;
}

.share-social-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}

.share-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: 8px !important;
  background: #475569 !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  transition: all 0.25s ease !important;
}

.share-btn:hover {
  transform: translateY(-2px) !important;
  opacity: 0.9 !important;
}

.share-btn.share-facebook:hover { background: #1877F2 !important; }
.share-btn.share-twitter:hover { background: #000000 !important; }
.share-btn.share-linkedin:hover { background: #0A66C2 !important; }
.share-btn.share-email:hover { background: var(--wd-green) !important; }

/* Related Stories Section */
.blog-related-section {
  padding-top: 80px !important;
}

/* Mobile & Tablet Responsive Adjustments */
@media (max-width: 1200px) and (min-width: 992px) {
  .blog-details-layout-wrapper {
    grid-template-columns: 250px minmax(0, 1fr) 260px !important;
    gap: 20px !important;
  }
  .blog-details-layout-wrapper.no-left-sidebar {
    grid-template-columns: minmax(0, 1fr) 260px !important;
  }
}

@media (max-width: 991px) {
  .blog-details-layout-wrapper,
  .blog-details-layout-wrapper.no-left-sidebar {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding: 0 16px !important;
  }

  .blog-details-left-sidebar {
    grid-column: auto !important;
    order: 1 !important;
    margin-bottom: 8px !important;
  }

  .blog-details-main-content {
    grid-column: auto !important;
    order: 2 !important;
    padding: 28px 24px !important;
  }

  .blog-details-sidebar,
  .blog-details-right-sidebar {
    grid-column: auto !important;
    order: 3 !important;
  }

  .blog-main-heading {
    font-size: 28px !important;
  }

  .blog-main-excerpt {
    font-size: 16.5px !important;
  }

  .sidebar-sticky-inner {
    position: static !important;
  }

  /* Table of Contents is collapsed by default on mobile/tablet; tap the
     header to expand it. Desktop keeps it always open (see the non-media
     rules above), this only changes behaviour at this breakpoint. */
  .toc-widget-toggle {
    cursor: pointer !important;
  }

  .toc-expand-icon {
    display: inline-flex !important;
  }

  .toc-widget-toggle[aria-expanded="true"] .toc-expand-icon {
    transform: rotate(180deg) !important;
  }

  .toc-nav-list {
    display: none !important;
  }

  .toc-nav-list.is-open {
    display: block !important;
  }
}

@media (max-width: 576px) {
  .blog-details-main-content {
    padding: 20px 16px !important;
    border-radius: 16px !important;
  }

  .blog-author-card {
    flex-direction: column !important;
    text-align: center !important;
    padding: 20px !important;
  }

  .blog-share-nav-bar {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .share-section {
    justify-content: center !important;
  }

  .btn-back-to-blogs {
    justify-content: center !important;
  }
}


/* ==========================================================================
   Photo & Video Media Showcase Section Spacing
   ========================================================================== */
.property-media-showcase-section {
  width: 100% !important;
  margin-top: 40px !important;
  padding-top: 45px !important;
  border-top: 1px solid #EAECF0 !important;
}

.property-gallery-wrapper {
  margin-bottom: 45px !important;
  padding-bottom: 45px !important;
  border-bottom: 1px solid #EAECF0 !important;
}

.property-video-wrapper {
  width: 100% !important;
  margin-bottom: 50px !important;
  padding-top: 0 !important;
  border: none !important;
}

.property-gallery-header,
.property-video-header {
  text-align: center !important;
  margin-bottom: 30px !important;
}

.property-gallery-header .badge-luxury-tag,
.property-video-header .badge-luxury-tag {
  margin-bottom: 12px !important;
}

.property-gallery-header .section-main-title {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  font-size: clamp(24px, 2.5vw, 30px) !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  letter-spacing: -0.4px !important;
  line-height: 1.3 !important;
}

.property-video-header .section-main-title {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: clamp(24px, 2.5vw, 30px) !important;
  font-weight: 800 !important;
  color: #0F172A !important;
  letter-spacing: -0.4px !important;
  line-height: 1.3 !important;
}

.property-gallery-header .gallery-subtext {
  font-size: 14px !important;
  color: #64748B !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

@media (max-width: 767px) {
  .property-media-showcase-section {
    margin-top: 30px !important;
    padding-top: 32px !important;
  }
  .property-gallery-wrapper {
    margin-bottom: 35px !important;
    padding-bottom: 35px !important;
  }
  .property-gallery-header,
  .property-video-header {
    margin-bottom: 22px !important;
  }
}
/* Floating WhatsApp button (bottom-right, sits below the scroll-to-top button) */
.whatsapp-float {
  position: fixed !important;
  right: 20px !important;
  bottom: 20px !important;
  width: 54px !important;
  height: 54px !important;
  border-radius: 50% !important;
  background: #25D366 !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45) !important;
  z-index: 1000 !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

.whatsapp-float:hover {
  transform: scale(1.08) !important;
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.55) !important;
  color: #FFFFFF !important;
}

.scroll-to-top {
  bottom: 86px !important;
}

@media (max-width: 767px) {
  .whatsapp-float {
    width: 48px !important;
    height: 48px !important;
    right: 16px !important;
    bottom: 16px !important;
  }
  .whatsapp-float svg {
    width: 26px !important;
    height: 26px !important;
  }
  .scroll-to-top {
    right: 20px !important;
    bottom: 76px !important;
  }
}

/* ==========================================================================
   HEADINGS - every h1 / h2 uses the secondary colour (--wd-heading).
   Headings that sit on photos / dark backgrounds keep their white text: they
   are set by more specific rules and are intentionally not listed here.
   Only h1 / h2 are targeted; h3 and below are unchanged.
   ========================================================================== */
h1.heading,
h2.heading,
h1.section-main-title,
h2.section-main-title,
h2.why-main-heading,
h2.property-about-title,
h2.property-amenities-heading,
h2.property-reviews-heading,
h2.property-faqs-heading,
h2.cta-title,
h1.blog-hero-title,
.about-content-wrapper h1.section-main-title,
.about-content-wrapper h2.section-main-title,
.property-amenities-wrapper h2.section-main-title,
.luxury-cta-card h2.cta-title,
.blog-rich-content h1,
.blog-rich-content h2 {
  color: var(--wd-heading) !important;
}

/* ==========================================================================
   CARD TITLES - titles of cards on light backgrounds use --wd-heading too.
   Cards with white titles on photos / dark surfaces (state cards, experience
   cards, footer, CTA cards) are intentionally not listed. Hover colours that
   have their own more specific rule (e.g. property card title -> gold) stay.
   ========================================================================== */
.property-card-title-link,
h3.property-card-title,
h3.amenity-card-title,
h3.group-travel-card-title,
h3.philosophy-card-title,
h3.plan-option-title,
h3.property-map-info-title,
h3.team-card-name,
h3.video-card-title,
h4.testimonial-user-name,
h4.why-feature-title,
h4.property-about-highlight-title,
h4.property-amenity-title,
h4.property-room-name,
.sidebar-widget h4.widget-title,
.luxury-contact-form-card h3.section-main-title,
div.quick-fact-title {
  color: var(--wd-heading) !important;
}

/* ==========================================================================
   PRIMARY (GOLD) BUTTONS - text and icons use the secondary dark green.
   Any new gold-filled button must use color: var(--wd-on-primary).
   ========================================================================== */
.btn-cta-blue,
.btn-cta-blue:hover,
.btn-cta-blue:focus,
.btn-enquiry-submit,
.btn-enquiry-submit:hover,
.btn-enquiry-submit:focus,
.btn-header-contact,
.btn-header-contact:hover,
.btn-header-contact:focus,
.btn-hero-action-gold,
.btn-hero-action-gold:hover,
.btn-hero-action-gold:focus,
.btn-hero-gold,
.btn-hero-gold:hover,
.btn-hero-gold:focus,
.btn-hero-primary,
.btn-hero-primary:hover,
.btn-hero-primary:focus,
.btn-about-more,
.btn-about-more:hover,
.btn-about-more:focus,
.btn-map-directions,
.btn-map-directions:hover,
.btn-map-directions:focus,
.btn-why-wanderama,
.btn-why-wanderama:hover,
.btn-why-wanderama:focus,
.plan-option-btn-solid,
.plan-option-btn-solid:hover,
.plan-option-btn-solid:focus,
.property-reviews-feedback-btn,
.property-reviews-feedback-btn:hover,
.property-reviews-feedback-btn:focus,
.gallery-tab-btn.active,
.gallery-tab-btn.active:hover,
.gallery-tab-btn.active:focus,
.button.button--slim.button--primary,
.button.button--slim.button--primary:hover,
.button.button--slim.button--primary:focus,
.luxury-play-btn,
.luxury-play-btn:hover,
.luxury-play-btn:focus {
  color: var(--wd-on-primary) !important;
}

.btn-cta-blue svg,
.btn-enquiry-submit svg,
.btn-hero-action-gold svg,
.btn-hero-primary svg,
.btn-map-directions svg,
.btn-why-wanderama svg,
.luxury-play-btn svg,
.scroll-to-top svg {
  color: var(--wd-on-primary) !important;
}

/* ==========================================================================
   HERO TITLES on photos - primary (gold). Dark green is unreadable on the
   dark photo overlay, so hero titles use the primary colour instead.
   ========================================================================== */
h1.hero-title,
h2.hero-title,
.hero-slider-outer h1.hero-title,
.hero-slider-outer h2.hero-title,
h1.wedding-hero-title {
  color: var(--wd-gold) !important;
  -webkit-text-fill-color: var(--wd-gold) !important;
}

/* Inner page banners (About, Properties, Blog...) - page title is white */
.page-banner-content h1.heading,
.page-banner-content h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Property page hero title is white (not gold) on the photo */
h1.property-hero-main-title,
.property-details-hero-banner h1.property-hero-main-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ==========================================================================
   Page loader shown while a lazy-loaded page chunk downloads
   ========================================================================== */
.page-loader {
  min-height: 70vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
}

.page-loader-mark {
  position: relative !important;
  width: 150px !important;
  height: 150px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.page-loader-spinner {
  position: absolute !important;
  inset: 0 !important;
  border-radius: 50% !important;
  border: 3px solid var(--wd-gold-soft) !important;
  border-top-color: var(--wd-gold) !important;
  animation: wd-spin 0.9s linear infinite !important;
}

.page-loader-logo {
  animation: wd-pulse 1.6s ease-in-out infinite !important;
}

@keyframes wd-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(0.94); }
}

@keyframes wd-spin {
  to { transform: rotate(360deg); }
}

/* Blog Details swaps primary/secondary: its "You May Also Like" chips are dark green there, so keep their text white. */
.blog-details-section .property-card-type-badge {
  color: #FFFFFF !important;
}

/* ==========================================================================
   Header Topbar — email, phone, location & social icons above the main nav.
   Lives inside <sticky-header>, so it stays fixed at the very top along with
   the nav when the page scrolls.
   ========================================================================== */
.header-topbar {
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  width: 100% !important;
}

.header-topbar-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 9px 0 !important;
  font-size: 12.5px !important;
}

.header-topbar-info {
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.header-topbar-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: var(--wd-gold) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color 0.2s ease !important;
}

a.header-topbar-item:hover {
  color: #FFFFFF !important;
}

.header-topbar-item svg {
  flex-shrink: 0 !important;
  color: var(--wd-gold) !important;
}

.header-topbar-location {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  min-width: 0 !important;
}

.header-topbar .team-social-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 0 !important;
  flex-shrink: 0 !important;
}

.header-topbar-social-btn {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--wd-gold) !important;
  transition: all 0.2s ease !important;
}

.header-topbar-social-btn:hover {
  background: var(--wd-gold) !important;
  color: var(--wd-green) !important;
}

@media (max-width: 1279px) {
  .header-topbar-location {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .header-topbar-inner {
    gap: 6px 12px !important;
    padding: 7px 0 !important;
    /* When phones + social icons do not fit in one line the icons move to a
       second line instead of being cut off at the screen edge. */
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  .header-topbar-info {
    gap: 6px 14px !important;
    flex: 0 1 auto !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  .header-topbar-item span {
    display: none !important;
  }
  /* Phone numbers stay as text even on mobile (tap-to-call is the main
     reason a guest opens this bar); email/address stay icon-only. */
  a.header-topbar-item[href^="tel:"] span {
    display: inline !important;
  }
  /* Email is hidden on phones - it stays in the footer and on the contact page. */
  a.header-topbar-item[href^="mailto:"] {
    display: none !important;
  }
  .header-topbar-social-btn {
    flex-shrink: 0 !important;
  }
}

/* Small phones: two phone numbers + the email icon need a little less room
   so the email icon is not pushed against / past the screen edge. */
@media (max-width: 420px) {
  .header-topbar-inner {
    font-size: 11.5px !important;
  }
  .header-topbar-info {
    gap: 6px 10px !important;
    max-width: 100% !important;
  }
  .header-topbar-item {
    gap: 5px !important;
  }
  .header-topbar-item svg {
    width: 12px !important;
    height: 12px !important;
  }
}

/* Dots indicator moved above the gallery images (was below the arrows). */
.gallery-nav-dots-top {
  margin-bottom: 24px !important;
}

/* ==========================================================================
   Partner With Us — "What We Do" services grid (below the hero banner)
   ========================================================================== */
.partner-services-section {
  padding: 90px 0 !important;
  margin-top: -60px !important;
  background: #FFFFFF !important;
}

.partner-services-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin-top: 50px !important;
}

.partner-service-card {
  background: var(--wd-gold-soft) !important;
  border-radius: 18px !important;
  padding: 40px 36px !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(9, 16, 29, 0.04) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.partner-service-card:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 28px rgba(9, 16, 29, 0.08) !important;
}

.partner-service-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: transparent !important;
}

.partner-service-card.is-featured::before {
  background: linear-gradient(90deg, var(--wd-gold) 0%, var(--wd-gold-dark) 100%) !important;
}

.partner-service-icon {
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--wd-heading) !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 12px rgba(9, 16, 29, 0.06) !important;
}

.partner-service-icon svg {
  width: 26px !important;
  height: 26px !important;
}


.partner-service-title {
  font-size: 23px !important;
  font-weight: 700 !important;
  color: var(--wd-heading) !important;
  margin-bottom: 12px !important;
}

.partner-service-desc {
  font-size: 15px !important;
  color: #6B5D4F !important;
  line-height: 1.65 !important;
  margin-bottom: 22px !important;
}

.partner-service-divider {
  border-top: 1px solid rgba(16, 55, 43, 0.12) !important;
  margin-bottom: 20px !important;
}

.partner-service-items {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.partner-service-items li {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  font-size: 14.5px !important;
  color: #4B463F !important;
}

.partner-service-items svg {
  flex-shrink: 0 !important;
  color: var(--wd-gold-deep) !important;
}

@media (max-width: 767px) {
  .partner-services-section {
    padding: 60px 0 !important;
  }
  .partner-services-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    margin-top: 32px !important;
  }
  .partner-service-card {
    padding: 28px 22px !important;
  }
}

/* ==========================================================================
   Partner With Us — "Why Partner With Us" 6-card benefits grid
   ========================================================================== */
.partner-why-section {
  padding: 90px 0 !important;
}

.partner-why-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin-top: 50px !important;
}

.partner-why-card {
  background: #FFFFFF !important;
  border: 1px solid #EAECF0 !important;
  border-radius: 18px !important;
  padding: 36px 28px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  box-shadow: 0 6px 20px rgba(9, 16, 29, 0.04) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}

.partner-why-card:hover {
  transform: translateY(-4px) !important;
  border-color: var(--wd-gold) !important;
  box-shadow: 0 14px 30px rgba(217, 167, 82, 0.14) !important;
}

.partner-why-icon {
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  background: var(--wd-green) !important;
  color: #FFFFFF !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 20px !important;
  transition: all 0.3s ease !important;
}

.partner-why-card:hover .partner-why-icon {
  background: var(--wd-gold) !important;
  color: var(--wd-green) !important;
}

.partner-why-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--wd-heading) !important;
  margin-bottom: 10px !important;
  line-height: 1.3 !important;
}

.partner-why-desc {
  font-size: 14px !important;
  color: #64748B !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

@media (max-width: 991px) {
  .partner-why-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 575px) {
  .partner-why-section {
    padding: 60px 0 !important;
  }
  .partner-why-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-top: 32px !important;
  }
}

/* ==========================================================================
   Admin panel — RichTextEditor (used for every "description" field so admin
   can add bold/italic/links instead of only plain text).
   ========================================================================== */
.rich-text-editor-wrap {
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #FFFFFF !important;
}

.rich-text-editor-wrap .tox-tinymce {
  border-radius: 8px !important;
}

.rich-text-toolbar {
  display: flex !important;
  gap: 4px !important;
  padding: 6px 8px !important;
  background: #F8FAFC !important;
  border-bottom: 1px solid #E2E8F0 !important;
}

.rich-text-toolbar button {
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #334155 !important;
  font-size: 12.5px !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.rich-text-toolbar button:hover {
  background: #E2E8F0 !important;
  border-color: #CBD5E1 !important;
}

.rich-text-editable {
  padding: 8px 12px !important;
  font-size: 14px !important;
  border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  overflow-y: auto !important;
}

.rich-text-editable:empty::before {
  content: attr(data-placeholder);
  color: #94A3B8;
}

.rich-text-editable p {
  margin: 0 0 8px 0;
}

.rich-text-editable ul {
  margin: 0 0 8px 0;
  padding-left: 20px;
}

/* The template's global "form input" rule (style.css) forces every <input>
   inside a <form> to min-height:50px/width:100%/display:block, which also
   hits admin checkboxes since Bootstrap's .form-check-input is still just an
   <input> nested in a <form>. Restore normal checkbox sizing wherever that
   class is used (admin panel only — the public template never uses it). */
.form-check-input {
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin-top: 0.2em !important;
  vertical-align: top !important;
}

/* Footer: space between the property pills and "View All Resorts & Getaways" */
.luxury-footer .all-properties-link-wrapper {
  margin-top: 12px !important;
}

/* Map info card: grows with its text, button always has space around it */
.property-map-info-card {
  height: auto !important;
  min-height: 340px !important;
  gap: 20px !important;
}
.property-map-actions {
  margin-top: auto !important;
}
.property-map-with-text .luxury-map-wrapper,
.property-map-with-text .luxury-map-wrapper iframe {
  height: 100% !important;
  min-height: 340px !important;
}