/* ══════════════════════════════════════════════════════════════════
   LA MARVELLA — GLOBAL ACCESSIBILITY & DESIGN FIXES
   v1.0 — 2026-04-09
   Linked from every page: <link rel="stylesheet" href="global-fixes.css">
   Overrides per-page embedded styles where necessary.
══════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────
   1. CSS CUSTOM PROPERTIES — SPACING
──────────────────────────────────────── */
:root {
  --section-spacing-desktop: 80px;
  --section-spacing-tablet: 60px;
  --section-spacing-mobile: 40px;
}

/* ────────────────────────────────────────
   2. SECTION SPACING — STANDARDISED
──────────────────────────────────────── */
#rooms,
#story,
#dining,
#events,
#offers,
#gallery,
#amenities,
#reviews,
#location {
  padding-top: var(--section-spacing-desktop) !important;
  padding-bottom: var(--section-spacing-desktop) !important;
}

@media (max-width: 1024px) {

  #rooms,
  #story,
  #dining,
  #events,
  #offers,
  #gallery,
  #amenities,
  #reviews,
  #location {
    padding-top: var(--section-spacing-tablet) !important;
    padding-bottom: var(--section-spacing-tablet) !important;
  }
}

@media (max-width: 767px) {

  #rooms,
  #story,
  #dining,
  #events,
  #offers,
  #gallery,
  #amenities,
  #reviews,
  #location {
    padding-top: var(--section-spacing-mobile) !important;
    padding-bottom: var(--section-spacing-mobile) !important;
  }
}

/* ────────────────────────────────────────
   3. MINIMUM FONT SIZE — 14px GLOBAL
   Affects body, paragraphs, labels, inputs
──────────────────────────────────────── */
body {
  font-size: clamp(14px, 1.5vw, 18px);
  line-height: 1.6;
}

/* ────────────────────────────────────────
   4. FLUID TYPOGRAPHY — clamp()
──────────────────────────────────────── */

/* H1 / Hero heading */
h1,
.hero-h1 {
  font-size: clamp(28px, 5vw, 64px) !important;
  line-height: 1.1 !important;
}

/* H2 / Section title */
h2,
.sec-title {
  font-size: clamp(22px, 3.5vw, 48px) !important;
  line-height: 1.15 !important;
}

/* H3 */
h3 {
  font-size: clamp(18px, 2.5vw, 32px) !important;
  line-height: 1.25 !important;
}

/* H4 */
h4 {
  font-size: clamp(14px, 1.5vw, 20px) !important;
}

/* Body / descriptive paragraphs */
.sec-body,
.story-quote,
.exp-desc,
.venue-desc,
.footer-desc,
.review-text,
.dining-info p,
.loc-text p,
.loc-text a {
  font-size: clamp(14px, 1.5vw, 18px) !important;
  line-height: 1.8 !important;
}

/* Nav links */
.nav-links a {
  font-size: clamp(14px, 1.1vw, 16px) !important;
}

/* Booking bar labels and inputs */
.bb-lbl {
  font-size: clamp(13px, 1.1vw, 15px) !important;
}

.bb-input-box input,
.bb-input-box select,
.bb-rate-text {
  font-size: clamp(14px, 1.2vw, 16px) !important;
}

.bb-rate-sub {
  font-size: 11px !important;
  /* compact right-column rate sub-label — layout-sensitive */
}

.bb-book-btn {
  font-size: 11px !important;
  /* compact CTA in booking bar — was 10px; letter-spacing .2em */
}

/* Eyebrow / badge labels
   These use text-transform:uppercase + letter-spacing 0.3–0.5em which makes 11–12px
   visually equivalent to ~15px regular text. Forcing 14px broke compact card layouts. */
.ey-text,
.hero-eyebrow-text,
.exp-eyebrow,
.nearby-label {
  font-size: 11px !important;
}

.room-tag,
.room-card-tag,
.offer-badge,
.dining-badge {
  font-size: 11px !important;
}

.venue-stat {
  font-size: 10px !important;
  /* micro metadata inside card overlays — layout-sensitive */
}

.stat-lbl {
  font-size: 11px !important;
}

.amen-lbl {
  font-size: 11px !important;
}

.review-src {
  font-size: 11px !important;
}

/* Stat numbers */
.stat-num {
  font-size: clamp(28px, 3vw, 44px) !important;
}

/* Room / card headings */
.room-big-name {
  font-size: clamp(24px, 3.5vw, 46px) !important;
}

.room-card-name {
  font-size: clamp(18px, 2vw, 26px) !important;
}

/* Offer card text */
.offer-name {
  font-size: clamp(18px, 2vw, 26px) !important;
  /* offer headline in card */
}

.offer-price {
  font-size: clamp(18px, 2vw, 26px) !important;
  /* "Starting from ₹X" */
}

.offer-price small {
  font-size: 11px !important;
  /* "/ night" small unit label */
}

.offer-perks li {
  font-size: 13px !important;
  /* perk bullets inside offer card — was 14px, slightly compact */
}

/* Venue name */
.venue-name {
  font-size: clamp(18px, 2.5vw, 30px) !important;
}

/* Dining item heading */
.dining-info h3 {
  font-size: clamp(18px, 2vw, 26px) !important;
}

/* Room / card meta — micro-labels on image overlays */
.room-card-meta,
.room-meta span {
  font-size: 10px !important;
  /* e.g. "42 sqm · King Bed" on dark card overlay */
}

.room-card-cta {
  font-size: 11px !important;
  /* "Explore Room →" hover CTA on card */
}

/* Hero caption and sub */
.hero-caption,
.hero-sub {
  font-size: clamp(14px, 1.2vw, 16px) !important;
}

/* Hero counter */
.hero-count {
  font-size: 11px !important;
  /* compact vertical slide counter */
}

/* Footer */
.footer-links a {
  font-size: clamp(14px, 1.1vw, 16px) !important;
}

.footer-contact-text,
.footer-contact-text a {
  font-size: clamp(14px, 1.1vw, 16px) !important;
}

.footer-copy,
.footer-btm-links a {
  font-size: clamp(14px, 1vw, 15px) !important;
}

/* Nav reserve button ("Reserve" CTA in top nav — letter-spacing .25em uppercase) */
.nav-reserve {
  font-size: 11px !important;
}

/* Mobile menu items */
.mob-links a {
  font-size: clamp(20px, 3vw, 28px) !important;
  /* main mobile menu links — keep large */
}

.mob-btn {
  font-size: 11px !important;
  /* "Reserve A Room" CTA in mobile menu; letter-spacing .3em uppercase */
}

/* Nearby tags */
.nearby-tag {
  font-size: 11px !important;
  /* compact location pills — padding 6px 11px */
}

/* Location text */
.loc-text h4 {
  font-size: clamp(14px, 1.1vw, 15px) !important;
}

.loc-text p,
.loc-text a {
  font-size: clamp(14px, 1.2vw, 16px) !important;
}

/* Review author */
.review-name {
  font-size: clamp(14px, 1.2vw, 16px) !important;
  /* reviewer name — actual readable content */
}

.review-src {
  font-size: 11px !important;
  /* "via Google ★★★★★" — compact meta below name */
}

.review-badge-link {
  font-size: 11px !important;
  /* TripAdvisor / Google badge links */
}

/* Events CTA */
.events-cta-h {
  font-size: clamp(20px, 2.5vw, 34px) !important;
}

.events-cta-p {
  font-size: clamp(14px, 1.2vw, 16px) !important;
}

/* Fixed CTA bar (mobile bottom bar) */
.fixed-cta-text {
  font-size: clamp(14px, 1.5vw, 18px) !important;
  /* hotel name — readable */
}

.fixed-cta-text span {
  font-size: 11px !important;
  /* "Best Rate Guaranteed" subline — compact bar */
}

.fixed-cta-btn {
  font-size: 11px !important;
  /* "Book Now" — compact bar; letter-spacing .25em uppercase */
}

/* Preloader city label — "BENGALURU" decorative text with heavy letter-spacing */
/* .pl-city {
  font-size: 11px !important;
  letter-spacing: 0.55em !important; 
} */

/* Cookie banner */
.cb-text p,
.cm-group-desc {
  font-size: clamp(14px, 1.1vw, 16px) !important;
  /* readable body text — keep 14px */
}
.cb-text a{
  font-weight: bold;
}

.cb-accept,
.cb-settings,
.cm-save,
.cm-accept-all {
  font-size: 11px !important;
  /* compact action buttons; letter-spacing .25em uppercase */
}

.cm-group-name {
  font-size: 12px !important;
  /* toggle label in cookie modal */
}

/* Concierge chat panel */
.cp-bubble-text {
  font-size: 13px !important;
  /* chat message bubbles — compact panel 370px wide */
}

.cp-chip {
  font-size: 10px !important;
  /* quick-reply chips; letter-spacing .18em uppercase */
  padding: 5px 12px !important;
  /* restore original padding */
}

.cp-logo-name {
  font-size: clamp(16px, 1.5vw, 20px) !important;
  /* hotel name in chat header — keep larger */
}

.cp-logo-city {
  font-size: 8px !important;
  /* "Bengaluru" micro-label; letter-spacing .5em — decorative */
}

.cp-status-text {
  font-size: 9px !important;
  /* "Available now" status; letter-spacing .18em uppercase */
}

.cp-input-bar input {
  font-size: 16px !important;
  /* prevents iOS auto-zoom on focus */
}

.cp-input-bar input::placeholder {
  font-size: 16px !important;
}

.cp-header-hero-text {
  font-size: 13px !important;
  /* hero overlay text in chat header */
}

/* Rate toast — compact fixed-width widget (max-width: 320px)
   Reverting to near-original sizes; 14px breaks the flex row layout */
.rt-title {
  font-size: 10px !important;
  /* "BEST RATE GUARANTEE" — letter-spacing .15em uppercase */
}

.rt-ota {
  font-size: 13px !important;
  /* strikethrough OTA price */
}

.rt-direct {
  font-size: 20px !important;
  /* direct price — large serif number */
}

.rt-save {
  font-size: 10px !important;
  /* "SAVE 15%" gold badge — padding 2px 7px, letter-spacing .18em */
}

.rt-link {
  font-size: 10px !important;
  /* "BOOK DIRECT & SAVE" — letter-spacing .2em uppercase */
}

/* Nav dropdown & language switcher
   These are compact dropdowns — 14px pushes items too wide */
.nav-dropdown a {
  font-size: 11px !important;
  /* was 9px; letter-spacing .2em uppercase — slight bump */
}

.lang-dropdown a {
  font-size: 12px !important;
  /* was 10px; readable at 12px in the dropdown context */
}

/* BB rooms & guests panel (overlay modal) */
.bb-rg-hdr-title {
  font-size: clamp(16px, 1.5vw, 20px) !important;
  /* "Rooms & Guests" — panel title, ok at 16px+ */
}

.bb-rg-label {
  font-size: clamp(14px, 1.2vw, 16px) !important;
  /* "Adults", "Children" row labels — keep 14px */
}

.bb-rg-label small {
  font-size: 11px !important;
  /* "(ages 0-12)" sub-label — compact modal */
}

.bb-rg-remove,
.bb-rg-add {
  font-size: 10px !important;
  /* "Remove room" / "+ Add room" — letter-spacing uppercase */
}

.bb-rg-done {
  font-size: 11px !important;
  /* "Done" confirm button — compact */
}

.bb-rg-val {
  font-size: clamp(16px, 1.5vw, 18px) !important;
  /* numeric stepper value — keep larger */
}

/* Screen-reader only utility */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ────────────────────────────────────────
   5. HERO TEXT VISIBILITY
──────────────────────────────────────── */
.hero-content,
.hero-h1,
.hero-sub,
.hero-caption,
.hero-eyebrow-text,
.hero-eyebrow-line {
  color: #FFFFFF !important;
}

.hero-h1,
.hero-sub,
.hero-caption {
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.80) !important;
}

/* Stronger vignette for better contrast */
.hero-vignette {
  background: linear-gradient(to bottom,
      rgba(0, 0, 0, 0.40) 0%,
      rgba(0, 0, 0, 0.15) 35%,
      rgba(0, 0, 0, 0.72) 70%,
      rgba(0, 0, 0, 0.92) 100%) !important;
}

/* Inner page hero text */
.page-hero-content h1,
.page-hero-content .page-hero-eyebrow,
.page-hero-content p,
.page-hero-content .hero-eyebrow-text,
.page-hero-body h1,
.page-hero-body .hero-eyebrow-text {
  color: #FFFFFF !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.80) !important;
}

/* ────────────────────────────────────────
   6. TEXT-ON-IMAGE VISIBILITY — SITEWIDE
   White text + text-shadow on all image overlays.
   Dark overlay gradients strengthened.
──────────────────────────────────────── */

/* ── Room Feature Strip (wide banner card) ── */
/* Darken the veil so left-side text is always readable */
.room-feat-veil {
  background: linear-gradient(to right,
      rgba(0, 0, 0, 0.80) 0%,
      rgba(0, 0, 0, 0.45) 45%,
      rgba(0, 0, 0, 0.05) 70%) !important;
}

.room-tag {
  color: var(--gold, #B5922A) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.60) !important;
}

.room-big-name {
  color: #FFFFFF !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65) !important;
}

.room-meta span {
  color: rgba(255, 255, 255, 0.90) !important;
  /* was 0.60 — much more readable */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55) !important;
}

/* ── Room Cards (grid of 3) ── */
/* Raise default veil opacity from 0.7→1 and deepen gradient */
.room-card-veil {
  background: linear-gradient(to top,
      rgba(0, 0, 0, 0.90) 0%,
      rgba(0, 0, 0, 0.55) 40%,
      rgba(0, 0, 0, 0.10) 70%,
      transparent 100%) !important;
  opacity: 1 !important;
  /* was 0.7 at rest — always full */
}

.room-card-tag {
  color: var(--gold, #B5922A) !important;
}

/* ── Experience Panels (full-bleed dark panels) ── */
.exp-veil {
  background: rgba(0, 0, 0, 0.58) !important;
  /* was 0.52 */
}

.exp-eyebrow {
  color: #FFFFFF !important;
  /* color: var(--gold, #B5922A) !important; */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.60) !important;
}

.exp-title {
  color: #FFFFFF !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65) !important;
}

.exp-desc {
  color: rgba(255, 255, 255, 0.90) !important;
  /* was 0.62 */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45) !important;
}

/* ── Venue / Banquet Cards ── */
/* .venue-body {
  background: linear-gradient(to top,
      rgba(0, 0, 0, 0.95) 0%,
      rgba(0, 0, 0, 0.65) 45%,
      transparent 70%) !important;
}

.venue-name {
  color: #FFFFFF !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65) !important;
}

.venue-stat {
  color: rgba(255, 255, 255, 0.85) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55) !important;
}

.venue-stat i {
  color: var(--gold, #B5922A) !important;
}

.venue-desc {
  color: rgba(255, 255, 255, 0.88) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45) !important;
} */

/* ── Offer Cards ── */
.offer-veil {
  background: linear-gradient(to top,
      rgba(0, 0, 0, 0.96) 0%,
      rgba(0, 0, 0, 0.55) 45%,
      rgba(0, 0, 0, 0.12) 75%) !important;
}

.offer-badge {
  color: var(--gold, #B5922A) !important;
  background: rgba(0, 0, 0, 0.35) !important;
  /* dark backing for gold badge */
  text-shadow: none !important;
}

.offer-name {
  color: #FFFFFF !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.65) !important;
}

.offer-perks li {
  color: rgba(255, 255, 255, 0.90) !important;
  /* was 0.52 */
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45) !important;
}

.offer-price {
  color: var(--gold, #B5922A) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.50) !important;
}

.offer-price small {
  color: rgba(255, 255, 255, 0.90) !important;
  /* was 0.75 */
}

/* ── Gallery card overlay ── */
.gc-icon,
.gc-label {
  color: #FFFFFF !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.70) !important;
}

/* ── Events CTA (dark section, but still needs good contrast) ── */
.events-cta-p {
  color: rgba(255, 255, 255, 0.85) !important;
  /* was 0.55 */
}

.events-hdr .sec-body {
  color: rgba(255, 255, 255, 0.80) !important;
  /* was 0.55 */
}

/* ── Inner page hero text (used on rooms/, banquets/, etc.) ── */
.page-h1,
.page-hero-body h1,
.page-hero-content h1 {
  color: #FFFFFF !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.80) !important;
}

.page-hero-eyebrow,
.page-eyebrow-text {
  color: var(--gold, #B5922A) !important;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.65) !important;
}

.page-hero-sub,
.page-hero-caption {
  color: rgba(255, 255, 255, 0.92) !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.70) !important;
}

/* Strengthen inner page hero veil */
.page-hero-veil {
  background: linear-gradient(to bottom,
      rgba(0, 0, 0, 0.38) 0%,
      rgba(0, 0, 0, 0.12) 35%,
      rgba(0, 0, 0, 0.68) 70%,
      rgba(0, 0, 0, 0.92) 100%) !important;
}

/* ── Inner page "Other Rooms" cards (same pattern as room-card) ── */
.other-card-veil {
  background: linear-gradient(to top,
      rgba(0, 0, 0, 0.90) 0%,
      rgba(0, 0, 0, 0.55) 40%,
      rgba(0, 0, 0, 0.10) 70%,
      transparent 100%) !important;
  opacity: 1 !important;
  /* was 0.7 at rest */
}

.other-card-tag {
  color: var(--gold, #B5922A) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.60) !important;
}

.other-card-name {
  color: #FFFFFF !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.65) !important;
}

.other-card-meta {
  color: rgba(255, 255, 255, 0.90) !important;
  /* was 0.55 */
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55) !important;
}

/* ── ADA — Colour contrast on light backgrounds ── */
/* Body text on cream (#F8F4EC) */
.sec-body,
.story-quote {
  color: #4A443E !important;
  /* contrast ~5.2:1 on cream */
}

/* Muted labels on cream */
.stat-lbl,
.amen-lbl,
.nearby-label {
  color: #5C554D !important;
  /* contrast ~4.6:1 on cream */
}

/* Footer text on dark — boost all low-opacity instances sitewide */
.footer-links a {
  color: rgba(255, 255, 255, 0.82) !important;
}

.footer-contact-text,
.footer-contact-text a {
  color: rgba(255, 255, 255, 0.80) !important;
}

.footer-copy,
.footer-btm-links a,
.footer-btm-links a:hover {
  color: rgba(255, 255, 255, 0.78) !important;
  /* was .22 on inner pages — critical fix */
}

.footer-desc {
  color: rgba(255, 255, 255, 0.78) !important;
}

/* Footer column headings — inner pages had .32 which is near-invisible */
.footer-col h4,
h3.footer-col-h {
  color: rgba(255, 255, 255, 0.68) !important;
  /* was .32-.55 — raised to readable */
}

/* Banquet/dining enquiry CTA paragraph on dark */
.enquiry-cta p {
  color: rgba(255, 255, 255, 0.82) !important;
  /* was .45 */
}

/* Banquet/dining detail body text on dark sections */
.venue-detail-desc,
.dining-detail-desc,
.detail-body p {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Cookie banner body */
.cb-text p {
  color: rgba(255, 255, 255, 0.72) !important;
}

/* ────────────────────────────────────────
   7. ADA — FOCUS VISIBILITY
──────────────────────────────────────── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #B5922A !important;
  outline-offset: 3px !important;
  border-radius: 2px !important;
}

/* Skip link */
.skip-link:focus {
  top: 8px !important;
  z-index: 99999 !important;
  font-size: clamp(14px, 1.2vw, 16px) !important;
}

/* ────────────────────────────────────────
   8. TAP TARGETS — 44×44px minimum (ADA)
──────────────────────────────────────── */
.nav-burger,
.mob-close,
.hero-pause,
.offer-arrow,
.rev-btn,
.bb-rg-stepper button,
#scrolltop,
#wa-fab,
#phone-fab,
#cp-fab,
.footer-social a,
.mob-contact a,
.rc-arr,
.rc-day,
.cp-close {
  min-width: 44px !important;
  min-height: 44px !important;
}

/* ────────────────────────────────────────
   9. OFFERS SLIDER — RESPONSIVE
   6 slides total
   Desktop (>1024px): 4 visible
   Tablet  (768–1024px): 3 visible
   Mobile  (<768px): 1 visible
──────────────────────────────────────── */
/* Desktop: track 150%, each slide = 100%/6 → 4 visible */
.offers-track {
  width: 150% !important;
}

.offer-slide {
  width: calc(100% / 6) !important;
}

/* Tablet: track 200%, each slide = 100%/6 → 3 visible */
@media (max-width: 1024px) and (min-width: 768px) {
  .offers-track {
    width: 200% !important;
  }

  .offer-slide {
    width: calc(100% / 6) !important;
  }
}

/* Mobile: track 600%, each slide = 100%/6 → 1 visible */
@media (max-width: 767px) {
  .offers-track {
    width: 600% !important;
  }

  .offer-slide {
    width: calc(100% / 6) !important;
  }
}

/* ────────────────────────────────────────
   10. REVIEWS SLIDER — RESPONSIVE CSS
   Controlled by JS: global-fixes.js patches breakpoints
──────────────────────────────────────── */
/* Desktop: 3 slides */
.review-slide {
  box-sizing: border-box;
}

/* ────────────────────────────────────────
   11. NO HORIZONTAL OVERFLOW
──────────────────────────────────────── */
html,
body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}

/* Ensure images never overflow */
img {
  max-width: 100% !important;
  height: auto;
}

/* ────────────────────────────────────────
   12. MOBILE PORTRAIT (320–480px) FIXES
──────────────────────────────────────── */
@media (max-width: 480px) {

  /* Hero buttons stack */
  .hero-btns {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .hero-btns a,
  .hero-btns button {
    justify-content: center !important;
    text-align: center !important;
  }

  /* Events CTA */
  .events-cta {
    padding: 28px 20px !important;
  }

  /* Footer bottom */
  .footer-bottom-inner {
    flex-direction: column !important;
    gap: 10px !important;
    text-align: center !important;
  }

  /* Stat numbers on tiny screens */
  .stat-num {
    font-size: clamp(22px, 6vw, 36px) !important;
  }

  /* Room feature image */
  .room-feat img {
    aspect-ratio: 16 / 9 !important;
  }

  /* Experience panels — taller min on mobile */
  .exp-panel {
    min-height: 320px !important;
  }

  /* Booking bar date fields full-width on tiny screens */
  .bb-col {
    flex: 1 1 100% !important;
  }
}

/* ────────────────────────────────────────
   13. TABLET (768–1024px) IMPROVEMENTS
──────────────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .venues-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .rooms-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .amenities-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  /* Dining grid: single column on tablet */
  .dining-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  /* Story inner */
  .story-inner {
    gap: 48px !important;
  }
}

/* ────────────────────────────────────────
   14. GENERAL RESPONSIVE IMPROVEMENTS
──────────────────────────────────────── */
/* Prevent text overflow in cards */
.offer-body,
.room-card-body,
.venue-body,
.exp-body {
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

/* Gallery on small tablet */
@media (max-width: 900px) {
  .gallery-collage {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-auto-rows: 180px !important;
  }

  .gc-big,
  .gc-wide,
  .gc-tall {
    grid-column: span 1 !important;
    grid-row: span 1 !important;
  }
}

/* Footer grid — 1 col on mobile */
@media (max-width: 580px) {
  .footer-top {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 40px 6% 30px !important;
  }
}

/* ────────────────────────────────────────
   15. INNER PAGES — PAGE HERO TEXT
──────────────────────────────────────── */
/* Breadcrumbs */
.breadcrumb {
  font-size: clamp(14px, 1.1vw, 15px) !important;
}

/* Inner page section headings */
.inner-sec-title {
  font-size: clamp(22px, 3.5vw, 48px) !important;
}

/* ────────────────────────────────────────
   16. ADA — VISUALLY HIDDEN LABELS
   .sr-only is already defined above.
   Apply to booking bar inputs.
──────────────────────────────────────── */

/* Ensure all form elements have visible or sr-only labels */
.bb-input-box input[placeholder]::before {
  content: attr(aria-label);
}

/* ────────────────────────────────────────
   17. REDUCED MOTION SUPPORT
──────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {

  .hero-slide,
  .offers-track,
  .reviews-track {
    transition: none !important;
  }
}

/* ────────────────────────────────────────
   18. HEADING HIERARCHY — SEMANTIC FIXES
   H4→H3 conversions styled to match original design
──────────────────────────────────────── */

/* Footer column headings (h3.footer-col-h matches original h4 style) */
h3.footer-col-h {
  font-size: clamp(14px, 1.1vw, 15px) !important;
  font-family: var(--sans, 'Montserrat', sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: 0.4em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.55) !important;
  margin-bottom: 20px !important;
  line-height: 1.4 !important;
}

/* Location detail headings (h3.loc-text-h matches original h4 style) */
h3.loc-text-h {
  font-size: clamp(14px, 1.1vw, 15px) !important;
  font-family: var(--sans, 'Montserrat', sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: 0.3em !important;
  text-transform: uppercase !important;
  color: #6E6660 !important;
  margin-bottom: 5px !important;
  line-height: 1.4 !important;
}

/* Inner page footer headings (applies when inner pages also use h3.footer-col-h) */
.footer-col h3.footer-col-h {
  color: rgba(255, 255, 255, 0.55) !important;
}

/* Breadcrumb font size */
.page-breadcrumb a,
.page-breadcrumb span {
  font-size: clamp(14px, 1vw, 15px) !important;
}

/* ────────────────────────────────────────
   19. INLINE FONT-SIZE OVERRIDES
   Remove bad clamp(10px,...) from inline styles on headings
──────────────────────────────────────── */
/* These !important rules override the inline style="font-size:clamp(10px,...)" */
h2.sec-title[style*="clamp(10px"] {
  font-size: clamp(22px, 3.5vw, 48px) !important;
}

/* ════════════════════════════════════════════════════════════
   20. COMPREHENSIVE RESPONSIVE SYSTEM — La Marvella
   Single source of truth for all breakpoints sitewide.
   Breakpoints: 1200 | 1024 | 900 | 768 | 580 | 480
════════════════════════════════════════════════════════════ */

/* ── Global base ── */
*, *::before, *::after { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe, embed { max-width: 100%; height: auto; }

/* ══════════════ 1200px — wide tablet / small desktop ══════════════ */
@media (max-width: 1200px) {
  /* Section padding */
  #rooms,#story,#dining,#events,#offers,#gallery,#amenities,#reviews,#location {
    padding-left: 5% !important;
    padding-right: 5% !important;
  }
  /* Dining gap */
  .dining-grid { gap: 52px !important; }
  /* Story gap */
  .story-inner { gap: 56px !important; }
  /* Footer */
  .footer-top { grid-template-columns: 1.4fr 1fr 1fr 1fr !important; gap: 40px !important; padding-left: 5% !important; padding-right: 5% !important; }
}

/* ══════════════ 1024px — tablet landscape ══════════════ */
@media (max-width: 1024px) {
  /* Section padding */
  #rooms,#story,#dining,#events,#offers,#gallery,#amenities,#reviews,#location {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  /* Booking bar */
  .bb-inner { flex-wrap: wrap !important; gap: 10px !important; padding: 14px 4% !important; }
  .bb-col   { flex: 1 1 calc(50% - 10px) !important; min-width: 130px !important; }
  .bb-right { flex: 1 1 100% !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; max-width: none !important; gap: 14px !important; }
  .bb-book-btn { width: auto !important; flex-shrink: 0 !important; }
  /* Stats */
  .stats-row { grid-template-columns: repeat(2,1fr) !important; }
  .stat:nth-child(2) { border-right: none !important; }
  /* Rooms */
  .rooms-grid { grid-template-columns: repeat(2,1fr) !important; }
  .room-feat img { aspect-ratio: 16/7 !important; }
  .room-feat-body { left: 5% !important; right: 5% !important; }
  .room-big-name { font-size: clamp(22px,3.5vw,40px) !important; }
  /* Room cards — always show on non-hover devices */
  .room-card-veil { opacity: 1 !important; }
  .room-card-cta  { opacity: 1 !important; transform: translateY(0) !important; }
  /* Story */
  .story-inner { grid-template-columns: 1fr 1fr !important; gap: 44px !important; }
  .story-img-accent { display: none !important; }
  /* Dining */
  .dining-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  .dining-float { display: none !important; }
  .dining-vis .dining-main { aspect-ratio: 16/7 !important; }
  /* Events */
  .events-cta { padding: 40px 32px !important; }
  /* Amenities */
  .amenities-grid { grid-template-columns: repeat(4,1fr) !important; gap: 26px !important; }
  /* Location */
  .location-inner { grid-template-columns: 1fr 1.2fr !important; gap: 48px !important; }
  /* Footer */
  .footer-top { grid-template-columns: 1fr 1fr !important; gap: 36px !important; }
}

/* ══════════════ 900px — tablet portrait / large phone ══════════════ */
@media (max-width: 900px) {
  /* Section padding */
  #rooms,#story,#dining,#events,#offers,#gallery,#amenities,#reviews,#location {
    padding: 68px 6% !important;
  }
  /* Booking bar */
  .bb-inner { flex-wrap: wrap !important; padding: 14px 5% !important; gap: 10px !important; }
  .bb-col   { flex: 1 1 calc(50% - 10px) !important; min-width: 140px !important; }
  .bb-right { flex: 1 1 100% !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; max-width: none !important; gap: 14px !important; padding-top: 0 !important; }
  .bb-book-btn { width: auto !important; flex-shrink: 0 !important; }
  .bb-rate-text, .bb-rate-sub { text-align: left !important; }
  .bb-sub-links { justify-content: flex-start !important; }
  /* Room feature strip */
  .room-feat img { aspect-ratio: 16/7 !important; }
  .room-feat-veil { background: linear-gradient(to right, rgba(0,0,0,.85) 0%, rgba(0,0,0,.6) 55%, rgba(0,0,0,.15) 100%) !important; }
  .room-feat-body { left: 5% !important; right: 28% !important; top: 50% !important; transform: translateY(-50%) !important; }
  .room-big-name  { font-size: clamp(20px,4.5vw,36px) !important; margin-bottom: 10px !important; }
  /* Room cards */
  .rooms-grid     { grid-template-columns: repeat(2,1fr) !important; }
  .room-card-veil { opacity: 1 !important; background: linear-gradient(to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,.35) 55%, transparent 100%) !important; }
  .room-card-cta  { opacity: 1 !important; transform: translateY(0) !important; }
  /* Story */
  .story-inner    { grid-template-columns: 1fr !important; gap: 40px !important; }
  .story-img-main { aspect-ratio: 16/9 !important; width: 100% !important; }
  .story-img-accent { display: none !important; }
  /* Dining */
  .dining-grid  { grid-template-columns: 1fr !important; gap: 36px !important; }
  .dining-float { display: none !important; }
  .dining-vis .dining-main { width: 100% !important; aspect-ratio: 16/9 !important; }
  /* Events */
  .venues-track { width: 300% !important; }
  .events-cta   { flex-direction: column !important; text-align: center !important; padding: 36px 28px !important; gap: 20px !important; }
  .events-cta-btns { justify-content: center !important; }
  /* Offers */
  .offers-track { width: 300% !important; }
  /* Gallery */
  .gallery-collage { grid-template-columns: repeat(2,1fr) !important; grid-auto-rows: 200px !important; }
  .gc-big,.gc-wide,.gc-tall { grid-column: span 1 !important; grid-row: span 1 !important; }
  /* Amenities */
  .amenities-grid { grid-template-columns: repeat(4,1fr) !important; gap: 24px !important; }
  /* Reviews */
  .review-slide { min-width: 50% !important; }
  /* Location */
  .location-inner { grid-template-columns: 1fr !important; gap: 40px !important; }
  .map-frame { aspect-ratio: 16/9 !important; }
  /* Footer */
  .footer-top { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
  footer { padding-bottom: 72px !important; }
  /* Fixed bottom CTA spacing — scrolltop moves left so it never overlaps FAB */
  #fab-container { bottom: 76px !important; right: 16px !important; }
  #scrolltop     { bottom: 76px !important; right: auto !important; left: 16px !important; }
}

/* ══════════════ 768px — standard mobile ══════════════ */
@media (max-width: 768px) {
  /* Section padding */
  #rooms,#story,#dining,#events,#offers,#gallery,#amenities,#reviews,#location {
    padding: 60px 6% !important;
  }
  /* Section headings */
  .rooms-hdr, .offers-hdr, .gallery-hdr {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }
  /* Room feature */
  .room-feat img { aspect-ratio: 4/3 !important; }
  .room-feat-veil { background: linear-gradient(to bottom, rgba(0,0,0,.1) 0%, rgba(0,0,0,.8) 70%, rgba(0,0,0,.92) 100%) !important; }
  .room-feat-body {
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    padding: 28px 22px !important;
  }
  .room-big-name { font-size: clamp(22px,5.5vw,32px) !important; }
  /* Room cards — full column */
  .rooms-grid { grid-template-columns: 1fr !important; }
  .room-card img { aspect-ratio: 16/9 !important; }
  /* Story */
  .story-inner { grid-template-columns: 1fr !important; }
  /* Experience */
  .exp-panel { min-height: 320px !important; }
  .exp-title { font-size: clamp(22px,5vw,34px) !important; }
  /* Dining */
  .dining-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
  .dining-item { grid-template-columns: 40px 1fr !important; }
  .dining-num  { font-size: 22px !important; }
  /* Events */
  .venues-track { width: 600% !important; }
  .events-cta   { flex-direction: column !important; text-align: center !important; padding: 32px 20px !important; }
  /* Offers */
  .offers-track { width: 600% !important; }
  /* Gallery */
  .gallery-collage { grid-template-columns: repeat(2,1fr) !important; grid-auto-rows: 160px !important; gap: 6px !important; }
  .gallery-filter  { flex-wrap: wrap !important; gap: 8px !important; }
  .filter-btn      { font-size: 11px !important; padding: 7px 14px !important; }
  /* Amenities */
  .amenities-grid { grid-template-columns: repeat(3,1fr) !important; gap: 20px !important; }
  /* Reviews */
  .review-slide { min-width: 100% !important; }
  /* Location */
  .location-inner { grid-template-columns: 1fr !important; }
  .map-frame { aspect-ratio: 4/3 !important; }
  /* Pre-footer */
  .pre-footer { padding: 52px 6% !important; }
  .pre-footer-links { gap: 10px !important; flex-wrap: wrap !important; justify-content: center !important; }
  /* Footer */
  .footer-top { grid-template-columns: 1fr 1fr !important; gap: 28px !important; padding: 48px 6% 32px !important; }
  .footer-bottom { padding: 16px 6% !important; }
  .footer-bottom-inner { flex-direction: column !important; gap: 10px !important; text-align: center !important; }
  /* Inner pages */
  .dining-detail-inner, .venue-detail-inner { grid-template-columns: 1fr !important; gap: 32px !important; }
  .contact-grid, .dept-grid { grid-template-columns: 1fr !important; }
  .eq-form-grid { grid-template-columns: 1fr !important; }
  .eq-form { padding: 32px 20px !important; }
}

/* ══════════════ 580px — small phone ══════════════ */
@media (max-width: 580px) {
  /* Section padding */
  #rooms,#story,#dining,#events,#offers,#gallery,#amenities,#reviews,#location {
    padding: 52px 5% !important;
  }
  /* Booking bar — full stack */
  .bb-col   { flex: 1 1 100% !important; }
  .bb-right { flex-direction: column !important; align-items: stretch !important; gap: 8px !important; }
  .bb-book-btn { width: 100% !important; height: 46px !important; }
  .bb-rate-text, .bb-rate-sub { text-align: center !important; }
  .bb-sub-links { justify-content: center !important; }
  /* Stats */
  .stats-row { grid-template-columns: repeat(2,1fr) !important; }
  .stat { border-right: none !important; border-bottom: 1px solid rgba(58,53,48,.12) !important; padding: 20px 16px !important; }
  .stat:last-child { border-bottom: none !important; }
  .stat-num { font-size: clamp(26px,8vw,36px) !important; }
  /* Room feature */
  .room-feat img { aspect-ratio: 4/3 !important; }
  .room-feat-body { padding: 20px 18px !important; }
  .room-big-name  { font-size: clamp(20px,6vw,28px) !important; margin-bottom: 8px !important; }
  .room-meta      { gap: 10px !important; margin-bottom: 14px !important; }
  /* Room cards */
  .rooms-grid { grid-template-columns: 1fr !important; }
  .room-card img { aspect-ratio: 4/3 !important; }
  .room-card-body { padding: 18px !important; }
  .room-card-name { font-size: 20px !important; }
  /* Story */
  .story-img-main { aspect-ratio: 4/3 !important; }
  /* Experience */
  .exp-panel { min-height: 280px !important; }
  /* Dining */
  .dining-item { grid-template-columns: 36px 1fr !important; gap: 12px !important; padding: 18px 0 !important; }
  .dining-num  { font-size: 20px !important; }
  /* Venues */
  .venues-track { width: 600% !important; }
  /* Offers */
  .offers-track { width: 600% !important; }
  /* Gallery */
  .gallery-collage { grid-template-columns: repeat(2,1fr) !important; grid-auto-rows: 130px !important; gap: 5px !important; }
  /* Amenities */
  .amenities-grid { grid-template-columns: repeat(2,1fr) !important; gap: 18px !important; }
  .amen-icon { width: 44px !important; height: 44px !important; font-size: 15px !important; }
  /* Reviews */
  .review-slide { min-width: 100% !important; }
  .review-card  { padding: 24px 20px !important; }
  .review-text  { font-size: 14px !important; }
  .pay-help-inner{
    flex-direction: column !important;;
  }
  /* Location */
  .map-frame { aspect-ratio: 1/1 !important; }
  /* Pre-footer */
  .pre-footer { padding: 44px 5% !important; }
  .pre-footer .sec-body { font-size: 14px !important; }
  .pre-footer-links { flex-direction: column !important; align-items: stretch !important; gap: 8px !important; }
  .pre-footer-links a { text-align: center !important; justify-content: center !important; }
  /* Footer */
  .footer-top { grid-template-columns: 1fr !important; gap: 28px !important; padding: 44px 5% 28px !important; }
  .footer-bottom-inner { flex-direction: column !important; gap: 10px !important; text-align: center !important; }
  .footer-btm-links { justify-content: center !important; }
  .footer-desc { max-width: 100% !important; }
  /* Capacity table (banquets) */
  .cap-table { font-size: 12px !important; }
  .cap-table th, .cap-table td { padding: 8px 10px !important; }
  /* Fixed bottom elements */
  #fab-container { bottom: 72px !important; right: 14px !important; }
  #rate-toast    { bottom: 80px !important; left: 12px !important; right: auto !important; max-width: calc(100vw - 24px) !important; }
  #scrolltop     { bottom: 72px !important; right: auto !important; left: 14px !important; }
  /* WBD tooltip — left-align to link, arrow near link start */
  .wbd-tip { right: auto !important; left: 0 !important; transform: none !important; width: min(88vw, 320px) !important; }
  .wbd-tip-arrow { right: auto !important; left: 22px !important; transform: none !important; }
}

/* ══════════════ 480px — very small phone ══════════════ */
@media (max-width: 480px) {
  /* Hero */
  .hero-h1 { font-size: clamp(24px,7.5vw,32px) !important; }
  .hero-eyebrow-text { font-size: 9px !important; letter-spacing: .25em !important; }
  .hero-btns { flex-direction: column !important; align-items: stretch !important; }
  .hero-btns a, .hero-btns button { justify-content: center !important; text-align: center !important; }
  /* Booking bar */
  .bb-inner { padding: 12px 5% !important; }
  /* Stats */
  .stat-num { font-size: clamp(22px,7vw,30px) !important; }
  /* Amenities */
  .amenities-grid { grid-template-columns: repeat(2,1fr) !important; gap: 14px !important; }
  .amen-lbl { font-size: 11px !important; }
  /* Events CTA */
  .events-cta { padding: 28px 18px !important; }
  .events-cta-h { font-size: clamp(18px,5.5vw,24px) !important; }
  /* Footer */
  .footer-top { padding: 36px 5% 24px !important; }
  .footer-logo-img { height: 48px !important; }
  /* Concierge */
  #cp-panel { width: calc(100vw - 20px) !important; right: 10px !important; }
  /* FAB */
  #fab-container { bottom: 70px !important; right: 12px !important; }
  #fab-toggle    { width: 46px !important; height: 46px !important; }
}

/* ── Tap targets — all interactive elements ≥ 44px on touch ── */
@media (max-width: 900px) {
  .nav-burger, .hero-pause, .filter-btn,
  .bb-book-btn, .btn-gold, .btn-outline-white,
  .btn-ghost-gold, .btn-outline-dark,
  .fixed-cta-btn, .fixed-cta-call,
  .rev-btn, .offer-arrow, .venue-arr,
  .fab-action-icon { min-height: 44px !important; }
  .hero-dot { min-width: 24px !important; min-height: 24px !important; }
  .fab-action-icon{min-width: 44px;}
}

/* ── Inner page banner / hero ── */
@media (max-width: 768px) {
  .page-hero, .inner-hero, .page-banner, .hero-banner {
    min-height: 200px !important;
    padding: 80px 6% 36px !important;
  }
  .page-hero-title, .inner-hero-title, .banner-title {
    font-size: clamp(22px,6vw,36px) !important;
  }
}

h3.exp-title[style*="clamp(10px"] {
  font-size: clamp(18px, 2.5vw, 32px) !important;
}

/* ────────────────────────────────────────
   20. PRE-FOOTER EXPLORE WIDGET
──────────────────────────────────────── */
.pre-footer {
  padding: 48px 6%;
  background: var(--cream2);
  text-align: center;
}
.pre-footer-inner {
  max-width: 900px;
  margin: 0 auto;
}
.pre-footer .sec-body {
  margin: 0 auto 20px;
}
.pre-footer-links {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

section.pre-footer {
    background:rgba(248,244,236,.97);
}

/* ────────────────────────────────────────
   21. MINIMUM FONT SIZE — 12px ENFORCEMENT
   Rule: no text element smaller than 12px sitewide.
   Overrides inline styles and per-page embedded CSS.
──────────────────────────────────────── */

/* UI chrome elements previously at 10–11px */
.venue-stat         { font-size: 12px !important; }
.room-card-meta,
.room-meta span     { font-size: 12px !important; }
.room-card-cta      { font-size: 12px !important; }

.ey-text,
.hero-eyebrow-text,
.exp-eyebrow,
.nearby-label       { font-size: 12px !important; }

.room-tag,
.room-card-tag,
.offer-badge,
.dining-badge       { font-size: 12px !important; }

.stat-lbl,
.amen-lbl           { font-size: 12px !important; }

.review-src,
.review-badge-link  { font-size: 12px !important; }

.hero-count         { font-size: 12px !important; }
.nearby-tag         { font-size: 12px !important; }

.nav-reserve        { font-size: 12px !important; }
.nav-dropdown a     { font-size: 12px !important; }
.mob-btn            { font-size: 12px !important; }

.bb-rate-sub        { font-size: 12px !important; }
.bb-book-btn        { font-size: 12px !important; }
.bb-rg-done         { font-size: 12px !important; }
.bb-rg-remove,
.bb-rg-add          { font-size: 12px !important; }
.bb-rg-label small  { font-size: 12px !important; }

.fixed-cta-text span { font-size: 12px !important; }
.fixed-cta-btn      { font-size: 12px !important; }

.offer-price small  { font-size: 12px !important; }
.offer-perks li     { font-size: 12px !important; }

.cb-accept,
.cb-settings,
.cm-save,
.cm-accept-all      { font-size: 12px !important; }
.cm-group-name      { font-size: 12px !important; }

.rt-title           { font-size: 12px !important; }
.rt-save            { font-size: 12px !important; }
.rt-link            { font-size: 12px !important; }

/* Concierge chat panel */
.cp-chip            { font-size: 12px !important; }
.cp-logo-city       { font-size: 12px !important; }
.cp-status-text     { font-size: 12px !important; }

/* ────────────────────────────────────────
   22. INLINE LINK VISIBILITY (Rule 4)
   All inline anchor tags within body/content
   must be visually distinct at rest (not only on hover).
──────────────────────────────────────── */
.sec-body a,
.ls-body a,
.faq-a-inner a,
.detail-body a,
.venue-detail-desc a,
.dining-detail-desc a,
.footer-desc a,
.loc-text a {
  color: var(--gold, #B5922A) !important;
  text-decoration: none !important;
}

/* ────────────────────────────────────────
   23. FOOTER TAGLINE FONT CONSISTENCY (Rule 13)
   .footer-desc (tagline) must match .footer-contact-text
   (address & phone) — both set to clamp(14px,1.1vw,16px).
──────────────────────────────────────── */
.footer-desc {
  font-size: clamp(14px, 1.1vw, 16px) !important;
}

/* ────────────────────────────────────────
   24. SPA SECTION FULL-WIDTH HEIGHT
   After removing the banquet panel from #experience,
   the single spa panel spans full width.
   Increase min-height so the section has proper visual weight.
──────────────────────────────────────── */

#experience .exp-panel {
  max-height: 600px !important;
}

/* ────────────────────────────────────────
   26. MOBILE UI REFINEMENT PASS
   All rules below are mobile-only.
   Desktop layout is not modified.
──────────────────────────────────────── */

/* ── Mobile nav: logo + separator ── */
@media (max-width: 900px) {
    .nav-logo-img {
        height: 40px !important;
    }
}
.mob-logo {
  position: absolute;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  line-height: 0;
}
.mob-logo-img {
  height: 40px;
  width: auto;
  display: block;
}
/* Utility-link separator inside mob-links */
.mob-sep {
  height: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
  padding: 0 !important;
  margin: 6px 0 !important;
  pointer-events: none;
}

/* ── Footer (mobile ≤ 768px) ── */
@media (max-width: 768px) {
  /* Tighter padding, less vertical bulk */
  .footer-top {
    padding: 32px 6% 20px !important;
    gap: 20px !important;
  }

  /* Hide the "Quick Links" column heading — its links merge visually under Explore */
  .footer-top > .footer-col:nth-child(3) h3.footer-col-h,
  .footer-top > .footer-col:nth-child(3) h4 {
    display: none !important;
  }

  /* Explore column: spans full width, 2-col link grid for compactness */
  .footer-top > .footer-col:nth-child(2) {
    grid-column: 1 / -1 !important;
  }
  .footer-top > .footer-col:nth-child(2) .footer-links {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 20px !important;
  }

  /* Quick Links links: span full width, same 2-col grid, minimal top gap */
  .footer-top > .footer-col:nth-child(3) {
    grid-column: 1 / -1 !important;
    margin-top: -8px !important;
  }
  .footer-top > .footer-col:nth-child(3) .footer-links {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 20px !important;
  }

  /* Back-to-top: clear of footer bottom bar */
  #scrolltop {
    bottom: 80px !important;
    right: 16px !important;
  }
}

/* ── Footer (mobile ≤ 580px) ── */
@media (max-width: 580px) {
  .footer-top {
    padding: 28px 5% 16px !important;
    gap: 18px !important;
  }
  .footer-top > .footer-col:nth-child(2) .footer-links,
  .footer-top > .footer-col:nth-child(3) .footer-links {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ── Pre-footer buttons (mobile ≤ 580px) ── */
@media (max-width: 580px) {
  /* 2-column equal-width grid — uniform button size */
  .pre-footer-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    max-width: 360px !important;
    margin: 0 auto !important;
  }
  .pre-footer-links a {
    width: 100% !important;
    min-width: 0 !important;
    padding: 14px 12px !important;
    text-align: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }
}

/* ── Booking bar — stable layout in all states (≤ 768px) ── */
@media (max-width: 768px) {
  /* Uniform height for every field row */
  .bb-col {
    padding-bottom: 0 !important;
  }
  .bb-lbl {
    min-height: 20px !important;
    display: block !important;
  }
  .bb-input-box {
    height: 44px !important;
  }
  /* Rate + Book row: keep items vertically centred and stable */
  .bb-right {
    align-items: center !important;
    padding-top: 4px !important;
  }
  .bb-book-btn {
    min-height: 44px !important;
    align-self: stretch !important;
  }
}
/* At smallest breakpoint ensure Book button spans full width */
@media (max-width: 580px) {
  .bb-right {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  .bb-book-btn {
    width: 100% !important;
    height: 46px !important;
  }
}

/* ── Card text overlays (mobile ≤ 768px) ── */
@media (max-width: 768px) {
  /* Reduce gradient coverage: text only occupies bottom ~35% */
  .room-card-veil {
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, .80) 0%,
      rgba(0, 0, 0, .40) 30%,
      rgba(0, 0, 0, .05) 55%,
      transparent 100%
    ) !important;
  }
  /* Dining cards and offer overlays — same treatment */
  .dining-main::after,
  .offer-img::after {
    background: linear-gradient(
      to top,
      rgba(0, 0, 0, .75) 0%,
      rgba(0, 0, 0, .30) 35%,
      transparent 60%
    ) !important;
  }
}

/* ── Mobile text alignment (≤ 768px) ── */
/* Default: left-align body copy and section titles in content sections.  */
/* Exceptions (hero, events header, pre-footer) keep centred layout.      */
@media (max-width: 768px) {
  /* Content sections — left-align */
  #rooms  .sec-body, #rooms  .sec-title,
  #story  .sec-body, #story  .sec-title,
  #dining .sec-body, #dining .sec-title,
  #offers .sec-body, #offers .sec-title,
  #amenities .sec-body, #amenities .sec-title,
  #reviews   .sec-body, #reviews   .sec-title,
  #location  .sec-body, #location  .sec-title {
    text-align: left !important;
  }
  /* Eyebrows inside content sections — left-aligned */
  #rooms .eyebrow, #story .eyebrow, #dining .eyebrow,
  #offers .eyebrow, #amenities .eyebrow, #reviews .eyebrow,
  #location .eyebrow {
    justify-content: flex-start !important;
  }
  /* Inner-page .sec-body blocks (dining detail, spa, etc.) */
  .sec-body { text-align: left !important; }
  /* Override: hero and centred layout sections keep centre */
  .hero-content .sec-body,
  .hero-content .sec-title,
  #events .events-hdr .sec-body,
  #events .events-hdr .sec-title,
  section.pre-footer .sec-body {
    text-align: center !important;
  }
  #events .events-hdr .eyebrow {
    justify-content: center !important;
  }
}

/* ── First scroll section / rooms — breathing space (≤ 768px) ── */
@media (max-width: 768px) {
  /* More gap between the feature strip and the card grid */
  .rooms-grid {
    margin-top: 28px !important;
  }
  /* More headroom for the section header */
  .rooms-hdr {
    margin-bottom: 28px !important;
  }
  /* Give the dark room cards a little more internal padding */
  .room-card-body {
    padding: 20px !important;
  }
}

/* ── Contact page — CAPTCHA area (global) ── */
#g-recaptcha-contact,
[id^="g-recaptcha"] {
  margin-top: 12px !important;
  margin-bottom: 28px !important;
}

/* ────────────────────────────────────────
   25b. DATE PICKER FIX — enquiry form
   The picker indicator must be position:relative on the input
   so the absolute-positioned invisible indicator covers the icon.
   Extends to full input width so any tap/click opens the calendar.
──────────────────────────────────────── */
.eq-field input[type="date"] {
  position: relative !important;
}
.eq-field input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  cursor: pointer !important;
}

/* ────────────────────────────────────────
   25a. FOOTER CONTACT ICON ALIGNMENT
   Strategy: icon becomes its own flex container, exactly 22px tall
   (= 14px font × 1.6 line-height ≈ one text line-box). With
   align-items:flex-start on the parent, the icon spans only the first
   text line and its glyph is centred within that one-line box.
──────────────────────────────────────── */
.footer-contact-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}
.footer-contact-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 22px !important;   /* = 14px × 1.6 — one text line-box */
  margin-top: 0 !important;
  flex-shrink: 0 !important;
}

/* ────────────────────────────────────────
   25. BUTTON CONTRAST FIXES
   Raise border opacity on outline buttons so they meet
   WCAG 3:1 minimum contrast for UI components.
   Dark-section override: border was 32% white (too faint);
   raised to 65%. Hover background raised from 10% to 18%.
   btn-outline-white border raised from 40% to 65%.
   Hover transition kept consistent (full border opacity on hover).
──────────────────────────────────────── */

/* Dark-section outline buttons — higher-contrast border */
.sec-dark .btn-outline-dark {
  border-color: rgba(255, 255, 255, .65) !important;
}
.sec-dark .btn-outline-dark:hover {
  background: rgba(255, 255, 255, .18) !important;
  border-color: rgba(255, 255, 255, 1) !important;
}

/* White outline buttons — higher-contrast border */
.btn-outline-white {
  border-color: rgba(255, 255, 255, .65) !important;
}
.btn-outline-white:hover {
  border-color: rgba(255, 255, 255, 1) !important;
  background: rgba(255, 255, 255, .12) !important;
}

/* ────────────────────────────────────────
   27. UI/UX PASS — HOMEPAGE & SITEWIDE
──────────────────────────────────────── */

/* ── Remove yellow tag captions on room cards ── */
.room-card-tag {
  display: none !important;
}

/* ── Remove yellow badge captions on offer cards ── */
.offer-badge {
  display: none !important;
}

/* ── Nearby Landmarks — more visual prominence ── */
.nearby-label {
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .22em !important;
  color: var(--white) !important;
  margin-bottom: 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .18) !important;
  display: inline-block !important;
}
/* Tags: brighter text and more legible border in dark context */
.sec-dark .nearby-tag {
  color: rgba(248, 244, 236, .82) !important;
  border-color: rgba(255, 255, 255, .28) !important;
  font-size: 12px !important;
  font-weight: 300 !important;
}

/* ── Consistent button font size: 12px sitewide ── */
.btn-gold,
.btn-outline-dark,
.btn-outline-white,
.btn-ghost-gold {
  font-size: 12px !important;
}
/* Inline hero Book Now override */
a.btn-gold[style*="font-size"] {
  font-size: 12px !important;
}

/* ── Spa widget text: 120 px left padding (desktop only) ── */
@media (min-width: 901px) {
  .exp-body {
    padding-left: 120px !important;
  }
}

/* ── Offer cards: remove bullet points, align perk text flush-left ── */
/* The ::before pseudo-element adds a gold bullet dot; remove it so       */
/* offer text starts at the same left edge as the offer name above it.    */
.offer-perks li::before {
  display: none !important;
}
.offer-perks li {
  gap: 0 !important;
  padding-left: 0 !important;
}

/* ── Location section headings: match Nearby Landmarks white colour ── */
/* .loc-text-h is the label above address / reservations / email / times */
.sec-dark .loc-text-h {
  color: var(--white) !important;
}

/* ════════════════════════════════════════════════════════════
   29a. GLOBAL FORM LABEL FONT SIZE — 12px
   All form field labels, input labels, and meta-labels sitewide.
════════════════════════════════════════════════════════════ */

/* Contact form labels */
.cf-field label         { font-size: 14px !important; }

/* Event enquiry form labels (banquets page + all inner venue pages) */
.eq-field label         { font-size: 14px !important; }

/* Booking bar labels */
.bb-lbl                 { font-size: 14px !important; }
.bb-rg-label            { font-size: 14px !important; }
.bb-rg-age-label        { font-size: 14px !important; }

/* Contact info labels (phone / email / address labels) */
.ci-label               { font-size: 14px !important; }

/* Venue capacity labels */
.venue-cap-label        { font-size: 14px !important; }

/* Location / map labels */
.mp-addr-label          { font-size: 14px !important; }
.pm-label               { font-size: 14px !important; }

/* Booking detail labels */
.bd-label               { font-size: 14px !important; }

/* Rate label */
.rate-label             { font-size: 14px !important; }

/* Generic inline form labels (fallback) */
form label              { font-size: 14px !important; }

/* ════════════════════════════════════════════════════════════
   29. GLOBAL BUTTON & LINK MINIMUM FONT SIZE — 12px
   All interactive text elements site-wide.
   Covers inline styles, per-page CSS, and breakpoint overrides.
════════════════════════════════════════════════════════════ */

/* ── Primary CTA buttons ── */
.btn-gold,
.btn-outline-dark,
.btn-outline-white,
.btn-ghost-gold {
  font-size: 12px !important;
}

/* ── Nav reserve button ── */
.nav-reserve { font-size: 12px !important; }

/* ── Nav links — all breakpoints ── */
.nav-links a,
.nav-overflow-dropdown a { font-size: 12px !important; }

/* ── Nav dropdown items ── */
.nav-dropdown a { font-size: 12px !important; }

/* ── Mobile menu ── */
.mob-btn { font-size: 12px !important; }

/* ── Booking bar ── */
.bb-book-btn { font-size: 12px !important; }

/* ── Fixed bottom CTA bar ── */
.fixed-cta-btn  { font-size: 12px !important; }
.fixed-cta-text span { font-size: 12px !important; }

/* ── Room card CTAs ── */
.room-card-book,
.room-card-more,
.room-card-cta  { font-size: 12px !important; }

/* ── Offer card CTAs ── */
.offer-book-btn,
.offer-cta,
.of-btn         { font-size: 12px !important; }

/* ── Venue / banquet card CTA ── */
.venue-cta      { font-size: 12px !important; }

/* ── Gallery filter buttons ── */
.filter-btn     { font-size: 12px !important; }

/* ── Eyebrow labels (uppercase badge-style) ── */
.ey-text,
.hero-eyebrow-text,
.exp-eyebrow,
.page-eyebrow-text,
.nearby-label   { font-size: 12px !important; }

/* ── Nearby / location tags ── */
.nearby-tag     { font-size: 12px !important; }

/* ── Facility / dining / room tags ── */
.room-tag,
.room-card-tag,
.offer-badge,
.dining-badge,
.venue-tag,
.fac-tag,
.corp-tag       { font-size: 12px !important; }

/* ── Stat labels / amenity labels ── */
.stat-lbl,
.amen-lbl       { font-size: 12px !important; }

/* ── Review meta ── */
.review-src,
.review-badge-link { font-size: 12px !important; }

/* ── Rate toast CTA ── */
.rt-title,
.rt-save,
.rt-link        { font-size: 12px !important; }

/* ── Concierge chat chips ── */
.cp-chip        { font-size: 12px !important; }

/* ── Cookie banner buttons ── */
.cb-accept,
.cb-settings,
.cm-save,
.cm-accept-all  { font-size: 12px !important; }
.cm-group-name  { font-size: 12px !important; }

/* ── FAQ category buttons ── */
.faq-cat        { font-size: 12px !important; }

/* ── Location / map direction button ── */
.mp-dir         { font-size: 12px !important; }

/* ── "Learn more" style links ── */
.lmot-link,
.lmot-badge,
.lmot-tab-lbl  { font-size: 12px !important; }

/* ── "Back" navigation links ── */
.ls-back        { font-size: 12px !important; }

/* ── Footer bottom links & copyright ── */
.footer-copy,
.footer-btm-links a { font-size: 12px !important; }

/* ── Explore column — always 2-column link grid with extra width ── */
.footer-col .footer-links {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 40px !important;
  min-width: 260px !important;
}

/* ── Hero counter ── */
.hero-count     { font-size: 12px !important; }

/* ── Room spec labels ── */
.room-spec-label { font-size: 12px !important; }

/* ── Gal label ── */
.gal-label      { font-size: 12px !important; }

/* ── Rate / price labels ── */
.rate-label,
.rate-soldout   { font-size: 12px !important; }

/* ── Reach / location tag ── */
.reach-tag      { font-size: 12px !important; }

/* ── Legal page TOC ── */
.legal-toc-title { font-size: 12px !important; }

/* ────────────────────────────────────────
   28. DYNAMIC FIXED-CTA CLEARANCE
   --_cta-clear is written by the ResizeObserver JS in index.html and
   equals (CTA height + 14 px).  The fallback value (84px) covers the
   worst-case text-wrapping scenario (~85 px bar) without JS.
   These rules are placed LAST so they win over every earlier !important
   declaration that used a hardcoded bottom pixel value.
──────────────────────────────────────── */
@media (max-width: 900px) {
  /* Safe CSS fallback — JS will override this at runtime.
     110px covers the worst-case two-line CTA text wrap (~88px bar + 14px gap).
     JS ResizeObserver in index.html updates --_cta-clear dynamically. */
  :root { --_cta-clear: 110px; }
  #fab-container { bottom: var(--_cta-clear) !important; right: 16px !important; }
  #scrolltop     { bottom: var(--_cta-clear) !important; left: 16px !important; right: auto !important; }
  #rate-toast    { bottom: calc(var(--_cta-clear) + 8px) !important; }
}

/* ────────────────────────────────────────
   30. UI FIXES — 2026-04-17
──────────────────────────────────────── */

/* ── Navbar menu items: larger font ── */
.nav-links{
  gap: 20px !important;
}
.nav-links a,
.nav-overflow-dropdown a {
  font-size: 14px !important;
}
/* Scale down gracefully at smaller desktop widths */
@media (max-width: 1280px) {
  .nav-links a,
  .nav-overflow-dropdown a { font-size: 13px !important; }
}
@media (max-width: 1100px) {
  .nav-links a,
  .nav-overflow-dropdown a { font-size: 12px !important; }
}

/* ── Booking form: Why Book Direct & Manage Booking links ── */
/* Increase size and switch to --sans (was 11px serif italic) */
.bb-sub-link {
  font-family: var(--sans, 'Montserrat', sans-serif) !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
}

/* ── Booking form: "From ₹X INR/Night" rate text ── */
.bb-rate-text,
.bb-rate-loading {
  font-family: var(--sans, 'Montserrat', sans-serif) !important;
  font-size: 14px !important;
  font-style: normal !important;
}

/* ── Nearby Landmarks: increase font sizes ── */
.nearby-label {
  font-size: 13px !important;
}
.nearby-tag {
  font-size: 13px !important;
}
.sec-dark .nearby-tag {
  font-size: 13px !important;
}

/* ── Back-to-top button: visible on both light and dark backgrounds ── */
/* Solid semi-opaque dark background + white icon so it's legible everywhere */
#scrolltop {
  background: rgba(20, 18, 16, 0.72) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}
#scrolltop:hover {
  background: rgba(181, 146, 42, 0.90) !important;
  border-color: rgba(181, 146, 42, 1) !important;
  color: #ffffff !important;
}

/* ── Venues collage: 1 / 2 / 3 pyramid layout ── */
.venues-collage {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 3px !important;
  margin-top: 0 !important;
}
/* Row 1 — LeRoi: full width */
.venues-collage .room-card:nth-child(1) {
  grid-column: span 6 !important;
}
.venues-collage .room-card:nth-child(1) img {
  aspect-ratio: 21/9 !important;
}
/* Row 2 — Colosseum + Sky Marvella: half width each */
.venues-collage .room-card:nth-child(2),
.venues-collage .room-card:nth-child(3) {
  grid-column: span 3 !important;
}
.venues-collage .room-card:nth-child(2) img,
.venues-collage .room-card:nth-child(3) img {
  aspect-ratio: 16/9 !important;
}
/* Row 3 — Aurum, Vista, Boardroom: third width each */
.venues-collage .room-card:nth-child(4),
.venues-collage .room-card:nth-child(5),
.venues-collage .room-card:nth-child(6) {
  grid-column: span 2 !important;
}
/* Responsive: tablet → 1 / 1+1 / 1+1+1 collapses to 2-col */
@media (max-width: 1024px) {
  .venues-collage {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  .venues-collage .room-card:nth-child(1) { grid-column: span 4 !important; }
  .venues-collage .room-card:nth-child(2),
  .venues-collage .room-card:nth-child(3) { grid-column: span 2 !important; }
  .venues-collage .room-card:nth-child(4),
  .venues-collage .room-card:nth-child(5),
  .venues-collage .room-card:nth-child(6) { grid-column: span 2 !important; }
}
/* Mobile → single column, match Accommodation card height (16/9) */
@media (max-width: 640px) {
  .venues-collage {
    grid-template-columns: 1fr !important;
  }
  .venues-collage .room-card:nth-child(n) {
    grid-column: span 1 !important;
  }
  .venues-collage .room-card img,
  .venues-collage .room-card:nth-child(1) img,
  .venues-collage .room-card:nth-child(2) img,
  .venues-collage .room-card:nth-child(3) img {
    aspect-ratio: 4/3 !important;
  }
}

/* ── Dining summary page: main h2 center, individual restaurant h3s left ── */
#dining-section > .dining-inner > h2.sec-title {
  text-align: center !important;
}
#dining-section .dining-card .sec-title {
  text-align: left !important;
}
#dining-section .dining-card .eyebrow {
  justify-content: flex-start !important;
}

/* ── OUR HOTELS DROPDOWN (desktop) ── */
.nav-prop-group-wrap{position:relative;display:inline-block;margin:0 8px;}
.nav-prop-toggle{font-family:var(--sans);font-size:14px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.72);padding:10px 14px;display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;cursor:pointer;transition:color .3s;}
#nav.scrolled .nav-prop-toggle{color:var(--ink);}
.nav-prop-toggle:hover{color:var(--gold);}
.nav-prop-chevron{font-size:10px;transition:transform .35s ease;}
#nav-properties.open .nav-prop-chevron{transform:rotate(180deg);}
.nav-prop-dropdown{position:absolute;top:100%;right:0;min-width:max-content;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.18);padding:14px 22px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease,visibility .3s;z-index:600;border-top:2px solid var(--gold);}
#nav-properties.open .nav-prop-dropdown{opacity:1;visibility:visible;transform:translateY(6px);}
.nav-prop-group{padding:0;}
.nav-prop-list{list-style:none;margin:0;padding:0;}
.nav-prop-list li{padding:6px 0;}
.nav-prop-soon{display:block;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);white-space:nowrap;}
.nav-prop-group-wrap button#nav-properties-btn {
    white-space:nowrap;
}
/* ── MOBILE: Our Hotels entry in burger menu ── */
.mob-hotels-item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 0 !important;}
.mob-links li.mob-sep{border:none !important;margin:0 !important;padding:0 !important;height:0 !important;}
.mob-hotels-label{font-family:var(--sans);font-size:13px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.8);}
.mob-hotels-soon{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);background:rgba(255,255,255,.04);padding:8px 18px;border:1px solid rgba(181,146,42,.35);}

/* responsive font-size match .nav-links a */
@media (max-width:1200px){
  .nav-prop-toggle{font-size:12px;letter-spacing:.07em;padding:8px 10px;}
}
@media (max-width:1024px){
  .nav-prop-toggle{font-size:11px;letter-spacing:.06em;padding:6px 8px;}
}
/* hide desktop dropdown on mobile */
@media (max-width:900px){
  #nav-properties{display:none;}
}

/* ── NAV OVERFLOW FLICKER GUARD ──
   Hide right-side cluster (links, Our Hotels, Book Now) until JS adds .nav-ready on #nav.
   Logo stays visible. Pinned (last) nav item is overflow-only, pre-hidden via CSS. */
#nav .nav-links-group,
#nav #nav-properties,
#nav #nav-right{visibility:hidden;transition:opacity .18s ease;}
#nav.nav-ready .nav-links-group,
#nav.nav-ready #nav-properties,
#nav.nav-ready #nav-right{opacity:1 !important;visibility:visible;}
.nav-links > li:last-child{display:none;}

#nav .nav-inner{
    justify-content:center;
}
#nav .nav-logo{
    margin-right:auto;
}
#nav #nav-right{
    margin-left:auto;
}

/* ── NUDGE CLOSE — real box ≥24×24 (WCAG 2.5.5) + spacing from link ── */
#lm-nudge-close{position:absolute;width:32px !important;height:32px !important;top:6px !important;right:6px !important;font-size:14px !important;}
.lm-nudge-link{padding-right:48px !important;}

/* offers innerpage changes */
section.why-direct.sec-dark{
    border-bottom: 2px solid var(--gold);
}
section.why-direct .why-direct-card p{
    font-size:14px;
}

/* banquet grid change */
@media (max-width: 1200px) {
    section .eq-inner,
    section .contact-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

.amen-item span {
    font-size: 14px !important;
    text-align:left !important;
    letter-spacing: 0.1em !important;
}

.other-card-tag {
  display: none;
}

.nav-links a.active {
    font-weight: bold;
}