/* ============================================================
   HEADER v2 — Hot pink + travel-motif decoration
   Loaded conditionally based on the active header-theme.
   The "v1" / classic maroon theme is the default in style.css;
   loading this file overrides those rules with the pink theme.
   ============================================================ */

/* Slim contact strip — rose (light-blush palette) */
.royal-topbar {
  background: #DD8E9C;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
/* More specific + later-loaded than the --user-header override, so it wins. */
html[data-user-header] .royal-topbar {
  background: #DD8E9C !important;
}
.royal-topbar .rtb-link,
.royal-topbar .rtb-link:visited { color: #4A2A06 !important; }
.royal-topbar .rtb-link svg { color: rgba(74, 42, 6, 0.8) !important; }
.royal-topbar .rtb-link:hover,
.royal-topbar .rtb-link:hover svg { color: #2B1220 !important; }
.royal-topbar .rtb-sep { color: rgba(74, 42, 6, 0.35) !important; }
.royal-topbar .rtb-follow { color: #4A2A06 !important; }

/* Main bar — pale blush (light palette) */
.royal-strip {
  background: #FAE8E4;
  color: #2B1220;
  border-bottom: 1px solid rgba(157, 32, 123, 0.14);
  box-shadow: 0 6px 18px -12px rgba(157, 32, 123, 0.22);
  min-height: 60px;
  padding: 2px 0;
}
body.scrolled .royal-strip { min-height: 52px; padding: 1px 0; }
.royal-strip::before { display: none; }
.royal-strip .royal-pattern { display: none; }

.rs-decor {
  display: block;
  flex: 1 1 0;
  min-width: 60px;
  align-self: stretch;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  margin: 0 12px 0 -6px;
}
/* Height fixed to one pattern tile (64px) + vertically centred — so the motif
   strip shows once instead of tiling down the taller header band. */
.rs-decor-svg {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 64px;
  display: block;
  pointer-events: none;
}
.royal-strip .rs-frame { flex: 0 1 auto; }

/* Soft radial glow behind the logo — an elliptical light halo that fades fully
   to transparent before any edge, so it never reads as a rectangular "patch".
   Gives the colourful logo enough light backing to stay crisp on the pink. */
.rs-logo-card {
  background: none;
  box-shadow: none;
  position: relative;
  min-width: 210px;
  min-height: 0;
  padding: 6px 36px;   /* trimmed so the bigger logo doesn't grow the header */
}
/* Soft feathered glow behind the logo — a blurred white pill, sized to cover the
   whole logo. The heavy blur feathers every edge, so it never reads as a patch. */
.rs-logo-card::before { display: none; }
.rs-logo-card::after { display: none; }
/* Logo enlarged to 80px tall (native is 150 x 49); card padding trimmed to match,
   so the header strip height is unchanged. */
.rs-logo-img {
  height: 80px; width: auto; max-width: 100%;
  filter: none;
  position: relative;
  z-index: 1;
}

.rs-since-banner { color: #B07A1E; filter: none; }
.rs-since-text {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #B07A1E !important;
  color: #B07A1E !important;
  animation: none !important;
  filter: none !important;
}
.rs-est { color: #B07A1E; }
.rs-diamond { color: rgba(176, 122, 30, 0.7); }
.rs-since-flourish { color: rgba(157, 32, 123, 0.35); opacity: 0.6; filter: none; }

.rs-frame { justify-content: center; }
.rs-frame-text {
  align-items: center !important;
  text-align: center !important;
}
.rs-headline {
  font-size: clamp(20px, 2.4vw, 32px);
  margin: 0;
  text-align: center;
}
/* Headline shimmer disabled — it was a near-white sweeping band that gave the old
   gold text its foil sheen; with solid cream text it just reads as a white patch. */
.rs-headline::before { display: none !important; }

/* Headline — solid bright cream. The gold gradient sat too close in tone to the
   pink header and washed out; a solid cream + dark shadow reads cleanly. */
.rs-h-line1 {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #2B1220 !important;
  color: #2B1220 !important;
  filter: none !important;
  text-shadow: none !important;
  font-weight: 700;
  margin-right: 0 !important;   /* base CSS adds 10px — drop it, keep just a word space */
}

.rs-h-line2 em {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #B07A1E !important;
  color: #B07A1E !important;
  filter: none !important;
  text-shadow: none !important;
  animation: none !important;
  font-weight: 600;
  font-style: italic;
}
.rs-h-line2 em::before,
.rs-h-line2 em::after { display: none !important; }
.rs-h-flourish { color: #B07A1E; opacity: 0.85; filter: none; }

/* Subhead row — operator line + highlighted "Since 2005" badge, centred. */
.rs-subhead {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(5px, 0.9vw, 10px) !important;
  /* Never wrap: keep "Since 2005" on the operator line (line 2), never let it
     drop to a 3rd line when the centre column is squeezed. */
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  max-width: 100%;
  text-align: center !important;
  align-self: center !important;
  margin-top: 6px !important;
}
.rs-sub-main {
  background: none !important;
  -webkit-text-fill-color: #5A4550 !important;
  color: #5A4550 !important;
  filter: none !important;
  text-shadow: none !important;
  animation: none !important;
  font-weight: 700;
  letter-spacing: 0.07em;
  white-space: nowrap;
  /* Scale down a touch on narrow widths so the operator line + badge stay on
     one row instead of wrapping the badge. */
  font-size: clamp(10px, 1.35vw, 14px) !important;
}
/* "Since 2005" — gold pill, the highlighted element of the headline. */
.rs-since-badge {
  display: inline-flex;
  align-items: center;
  font-family: 'Manrope', sans-serif;
  font-size: clamp(9px, 0.72vw, 11px);
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #4A2A06;
  background: linear-gradient(135deg, #FCE08A 0%, #E3AE3C 55%, #C98E22 100%);
  border: 1px solid rgba(160, 110, 20, 0.55);
  padding: 3px 10px;
  border-radius: 999px;
  box-shadow: 0 3px 10px -3px rgba(176, 122, 30, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.5);
  white-space: nowrap;
}

/* Small screens: shrink the operator line + badge enough that they always stay
   together on one row (line 2) instead of the badge wrapping to a 3rd line. */
@media (max-width: 600px) {
  .rs-subhead { gap: 6px !important; }
  .rs-sub-main { font-size: 10px !important; letter-spacing: 0.03em !important; }
  .rs-since-badge { font-size: 9px; letter-spacing: 0.06em; padding: 3px 8px; }
}
@media (max-width: 420px) {
  .rs-subhead { gap: 5px !important; }
  .rs-sub-main { font-size: 9px !important; letter-spacing: 0.02em !important; }
  .rs-since-badge { font-size: 8px; letter-spacing: 0.05em; padding: 2px 7px; }
}

.rs-medallion {
  transform: none;
  animation: none;
  filter: drop-shadow(0 3px 8px rgba(120, 6, 75, 0.25));
  width: auto;
  height: auto;
}
/* Since-2005 seal at its actual size. */
.rs-medallion .rs-seal-img,
.rs-medallion img.rs-seal-img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
}

.rs-rating {
  background: transparent;
  border: none;
  padding: 4px 8px;
  box-shadow: none;
}
.rs-rating:hover { background: rgba(157, 32, 123, 0.06); }
.rs-rating-body strong { color: #2B1220; text-shadow: none; }
.rs-rating-body .rs-stars { color: #E0A82E; }
.rs-rating-body small { color: rgba(43, 18, 32, 0.7); }
.rs-rating .brand-icon {
  background: #FFFDF7;
  padding: 3px;
  border-radius: 50%;
  box-sizing: content-box;
  box-shadow: 0 1px 4px rgba(157, 32, 123, 0.18);
}

.rs-dir-meta strong {
  color: #2B1220;
  font-family: 'Playfair Display', serif;
  font-style: normal;
  letter-spacing: 0.005em;
}
.rs-dir-tag {
  color: #9D207B !important;
  -webkit-text-fill-color: #9D207B !important;
}
.rs-dir-frame {
  background: none;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
}
.rs-dir-frame img {
  width: 85px;
  height: auto;
  border-radius: 0;
  filter: drop-shadow(0 3px 8px rgba(120, 6, 75, 0.35));
}

/* Nav bar — pale blush with dark links */
.pdf-nav {
  background: #FDF4F1 !important;
  border-top: 1px solid rgba(157, 32, 123, 0.12);
  border-bottom: 1px solid rgba(157, 32, 123, 0.18);
}
.pdf-nav.shrunk {
  background: rgba(246, 222, 217, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.pdf-nav-links a {
  color: #2B1220 !important;
  text-shadow: none !important;
  font-weight: 600 !important;
}
.pdf-nav.shrunk .pdf-nav-links a {
  color: #2B1220 !important;
  text-shadow: none !important;
}
.pdf-nav-links a:hover,
.pdf-nav-links a.is-active,
.pdf-nav.shrunk .pdf-nav-links a:hover,
.pdf-nav.shrunk .pdf-nav-links a.is-active {
  color: #9D207B;
  border-color: rgba(157, 32, 123, 0.55);
  background: rgba(157, 32, 123, 0.08);
}
.pdf-nav-links a.enquiry-link,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link {
  background: linear-gradient(135deg, #FFE9A8, #D4A24A);
  color: #4a0631;
  border-color: rgba(255, 233, 168, 0.6);
  text-shadow: none;
}
.pdf-nav-links a.enquiry-link:hover,
.pdf-nav-links a.enquiry-link.is-active,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link:hover,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link.is-active {
  background: linear-gradient(135deg, #FFF1C2, #E8C677);
  color: #4a0631;
  border-color: #FFE9A8;
}

.pdf-submenu,
.pdf-itin-menu {
  background: #F2D3CE;
  border: 1px solid rgba(157, 32, 123, 0.18);
  box-shadow: 0 24px 50px -24px rgba(157, 32, 123, 0.45);
}
.pdf-submenu li,
.pdf-itin-menu li { border-bottom-color: rgba(157, 32, 123, 0.14); }
.pdf-submenu a,
.pdf-itin-menu a { color: #4A0631; }
.pdf-submenu a:hover,
.pdf-itin-menu a:hover {
  background: #9D207B;
  color: #FFFFFF;
}
.pdf-itin-menu a.active,
.pdf-itin-menu a.is-active {
  color: #9D207B;
  border-bottom-color: #9D207B;
}

/* (Switcher widget CSS lives in style.css so it's always available regardless of active theme) */

/* v2 Pink uses the full-bleed video hero — same swap as royal/navy. */
html[data-header-theme="pink"] .hero { display: none !important; }
html[data-header-theme="pink"] .hero-royal { display: block !important; }

/* ============================================================
   TEXT VISIBILITY — tuned for the finalised v2 Pink palette:
   light-mauve page (#cd93bb) + light-pink footer (#ce7cb9) -> dark text;
   dark-magenta cards (#9D207B) -> white text.
   ============================================================ */

/* Section headings, eyebrows + intro text on the light page background -> dark. */
.home-eyebrow, .eyebrow,
.home-head h2, .home-head h2 em,
.section-head h2, .section-head h2 em,
.home-head p, .section-sub {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
  background: none !important;
}

/* Image-overlay card content -> white (text sits over photos + dark shade). */
.hic-body h3, .hic-days,
.hdc-region, .hdc-overlay h3, .hdc-overlay p, .hdc-cta {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
/* Solid-surface card content -> dark (these cards are now soft rose). */
.hfc-body h3, .hfc-cap,
.hs-label strong,
.affil-meta strong,
.vrc-body h3,
.trc-meta h3, .trc-text,
.hfc-body p,
.hs-label small,
.affil-mono, .affil-meta small,
.vrc-body p,
.trc-meta small {
  color: #6A4A5C !important;
  -webkit-text-fill-color: #6A4A5C !important;
}
/* Card link/accent -> brand magenta. */
.hfc-link { color: #9D207B !important; -webkit-text-fill-color: #9D207B !important; }

/* "View all / view more" buttons — solid dark fill + yellow label, so they
   stand out instead of blending into the pink page as faint outlines. */
.btn-ghost.dark {
  background: #2B1220 !important;
  border-color: #2B1220 !important;
  color: #FFD93D !important;
  -webkit-text-fill-color: #FFD93D !important;
}
.btn-ghost.dark:hover {
  background: #45203A !important;
  border-color: #45203A !important;
  color: #FFE066 !important;
  -webkit-text-fill-color: #FFE066 !important;
}

/* ============================================================
   BRAND COLOUR UNIFICATION
   Remap every off-brand base-theme accent (terracotta / teal /
   sage) to the v2 Pink brand palette, so no foreign colour shows
   on any page. Gold is kept — it's a brand accent.
   ============================================================ */
:root {
  --terracotta:   #9D207B;
  --terracotta-d: #7D1862;
  --teal:         #9D207B;
  --teal-soft:    #B0367E;
  --sage:         #9D207B;
  /* Cream "paper" surfaces -> soft blush (every var(--paper*) background, site-wide). */
  --paper:        #FAE8E4;
  --paper-2:      #F6DED9;
  --paper-3:      #FDF4F2;
  --bg-page:      #FAE8E4;
  --bg-page-alt:  #F6DED9;
  --bg-card:      #F2D3CE;
  /* Alternating homepage section bands: blush page (#FAE8E4) ↔ warm white.
     Warm white reads clearly distinct from the blush so the alternation is
     visible (a near-blush tint here would be imperceptible). */
  --band-tint:    #FFFBF7;
}

/* Feature sections that sit on the light page -> blush (no magenta block). */
.why-section,
.themes-section {
  background: #FAE8E4 !important;
}
/* Sections still pending a light pass keep the brand magenta for now. */
.rajasthan-section,
.itin-section {
  background: #9D207B !important;
}
/* Drop the off-brand decorative pattern/gradient overlays. */
.cta-block::before,
.cta-block::after,
.why-section::before,
.rajasthan-section::before {
  display: none !important;
}
/* About "By the Numbers" stats now sit on light -> dark labels. */
.why-section .stat-label {
  color: #6A4A5C !important;
  -webkit-text-fill-color: #6A4A5C !important;
}

/* Internal-page text on the light pink background — keep it dark/readable. */
.section-head h2,
.section-head h2 em,
.section-head .eyebrow,
.section-sub {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}

/* Itineraries page — it carries its own private --pi-* palette
   (hardcoded cream / terracotta / gold). Remap it to the brand. */
.page-itineraries,
body.page-itineraries {
  --pi-bg:      #FAE8E4;
  --pi-bg-2:    #F6DED9;
  --pi-ember:   #9D207B;
  --pi-ivory:   #2B1220;
  --pi-ivory-d: rgba(43, 18, 32, 0.78);
  --pi-ivory-x: rgba(43, 18, 32, 0.55);
  --pi-line:    rgba(43, 18, 32, 0.16);
  --pi-line-2:  rgba(43, 18, 32, 0.26);
}
body.page-itineraries,
.page-itineraries,
.itin-stage {
  background: #FAE8E4 !important;
}
/* Itinerary card sits on soft rose -> dark body text + magenta CTA. */
.itin-card-title,
.itin-soon-card h3,
.itin-soon-card h4 {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}
.itin-card-route,
.itin-soon-card p {
  color: #5A4450 !important;
  -webkit-text-fill-color: #5A4450 !important;
}
.itin-card-cta {
  color: #9D207B !important;
  -webkit-text-fill-color: #9D207B !important;
}

/* Filled CTA / submit buttons -> solid dark + yellow (matches the home buttons). */
.btn-cta-primary, .btn-primary, .btn-submit, .btn-search {
  background: #2B1220 !important;
  border-color: #2B1220 !important;
  color: #FFD93D !important;
  -webkit-text-fill-color: #FFD93D !important;
}
.btn-cta-primary:hover, .btn-primary:hover, .btn-submit:hover, .btn-search:hover {
  background: #45203A !important;
  border-color: #45203A !important;
}
/* Outline CTA button -> dark outline, readable on the light pink page. */
.btn-cta-secondary {
  background: transparent !important;
  border-color: #2B1220 !important;
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}

/* Legacy dark wedding-section text stays white. */
.wedding-section h2, .wedding-section h2 em, .wedding-section p {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
/* Ensure eyebrows inside dark blocks (page-hero & wedding-content) have gold soft for high contrast */
.page-hero .eyebrow,
.wedding-content .eyebrow {
  color: var(--gold-soft) !important;
  -webkit-text-fill-color: var(--gold-soft) !important;
}
/* About "By the Numbers" now sits on light blush -> dark text, magenta numerals. */
.why-section h2, .why-section .section-sub, .why-section .eyebrow {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}
.why-section h2 em, .why-section .stat-num, .why-section .counter {
  color: #9D207B !important;
  -webkit-text-fill-color: #9D207B !important;
}

/* ============================================================
   BRAND PALETTE — ENFORCED UNCONDITIONALLY (!important).
   v2 Pink is the finalised, only theme. These rules do NOT depend
   on the demo --user-* variables, localStorage or admin state, and
   they override inline style="" attributes in the views too.
   ============================================================ */
body { background: #FAE8E4 !important; }

.royal-topbar { background: #DD8E9C !important; }
.royal-strip { background: #FAE8E4 !important; }
.pdf-nav,
.pdf-nav.shrunk { background: #FDF4F1 !important; }
/* Footer: the redesigned .ftr footer (style.css) carries its own finalised
   blush palette — no theme override needed. */

/* Solid / inline-styled content sections -> soft blush page. */
.about-section, .itin-section, .dest-section, .themes-section,
.fleet-section, .reviews-section, .gallery-section, .blog-section,
.article-section, .faq-section, .contact-section, .enquiry-section,
.content-block, .rajasthan-section {
  background: #FAE8E4 !important;
}

/* Photo-overlay cards -> magenta base (hidden behind the photo; shows only
   as a fallback if an image fails). Text sits over the image, so the base
   colour never affects readability. */
.home-itin-card, .home-dest-card,
.dest-card, .review-card {
  background: #9D207B !important;
}
/* CTA bands -> brand rose strip with dark text (matches the top bar). */
.cta-block, .wedding-cta { background: #DD8E9C !important; }
.cta-block h2, .cta-block p,
.wedding-cta h2, .wedding-cta p {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}
.cta-block h2 em, .wedding-cta h2 em {
  color: #7D1850 !important;
  -webkit-text-fill-color: #7D1850 !important;
}
/* Solid-surface cards -> soft rose with dark text (light palette). */
.home-fleet-card, .hs-card, .affil-card,
.video-review-card, .text-review-card,
.service-detail-card, .sidebar-widget,
.itin-card {
  background: #F2D3CE !important;
  border: 1px solid rgba(157, 32, 123, 0.16);
  box-shadow: 0 18px 40px -28px rgba(157, 32, 123, 0.35);
}
.service-detail-card h2, .service-detail-card h3, .service-detail-card h4,
.service-detail-card p, .service-detail-card li,
.sidebar-widget h2, .sidebar-widget h3, .sidebar-widget h4,
.sidebar-widget p, .sidebar-widget ul, .sidebar-widget li {
  color: #4A0631 !important;
  -webkit-text-fill-color: #4A0631 !important;
}
.service-detail-card a, .sidebar-widget a {
  color: #9D207B !important;
  -webkit-text-fill-color: #9D207B !important;
}
.sidebar-widget .cof-label { color: #8A5A72 !important; -webkit-text-fill-color: #8A5A72 !important; }

/* ============================================================
   ENQUIRY PAGE ("Plan My Trip") — light blush theme, matching
   the Write-a-Review page. The form card and sidebar panels are
   light surfaces with dark text (set inline in the view); here we
   only style the form inputs in brand colours.
   ============================================================ */

/* Inputs -> white field, dark text, magenta focus ring. */
.enquiry-card .form-field input,
.enquiry-card .form-field textarea,
.enquiry-card .form-field select {
  background: #FFFFFF !important;
  border: 1px solid rgba(157, 32, 123, 0.20) !important;
  color: #2B1220 !important;
}
.enquiry-card .form-field input::placeholder,
.enquiry-card .form-field textarea::placeholder {
  color: #9A7686 !important;
}
.enquiry-card .form-field input:focus,
.enquiry-card .form-field textarea:focus,
.enquiry-card .form-field select:focus {
  border-color: #9D207B !important;
  box-shadow: 0 0 0 3px rgba(157, 32, 123, 0.15) !important;
}

/* ============================================================
   MOBILE POLISH — added 2026-06
   ============================================================ */

/* Surface the menu wherever the hamburger shows (the nav bar is light blush,
   but the toggle icon was light cream = invisible). Make it dark magenta and
   give it a "Menu" label so it's obviously tappable. */
.pdf-menu-label { display: none; }
@media (max-width: 760px) {
  .pdf-nav-inner { justify-content: flex-start !important; }
  .pdf-menu-toggle {
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    padding: 10px 4px !important;
    color: #9D207B !important;
    -webkit-text-fill-color: #9D207B !important;
  }
  .pdf-menu-label {
    display: inline-block !important;
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9D207B !important;
    -webkit-text-fill-color: #9D207B !important;
  }
  /* The open dropdown panel is dark magenta — its links must be light to read
     (the base theme colours them dark for the light desktop bar). */
  .pdf-nav-links a,
  .pdf-nav-links .pdf-submenu a,
  .pdf-nav-links .pdf-itin-menu a {
    color: #F5EFE3 !important;
    -webkit-text-fill-color: #F5EFE3 !important;
  }

  /* FIX 2026-07-19: the submenu panel inherited the light-blush DESKTOP background
     (#F2D3CE); on the dark mobile drawer that left the (light) links invisible.
     Give the open submenu a dark panel so the light text reads. */
  .pdf-nav-links .pdf-submenu,
  .pdf-nav-links .pdf-itin-menu {
    background: rgba(0, 0, 0, 0.22) !important;
    border-color: rgba(212, 162, 74, 0.30) !important;
    box-shadow: none !important;
  }
  .pdf-nav-links a.is-active {
    color: #FFE9A8 !important;
    -webkit-text-fill-color: #FFE9A8 !important;
    background: rgba(255, 255, 255, 0.06) !important;
  }
  /* Keep the gold "Enquiry" pill's text dark on its gold background. */
  .pdf-nav-links a.enquiry-link {
    color: #4a1330 !important;
    -webkit-text-fill-color: #4a1330 !important;
  }
}

/* Phone screens: condense the brand header + tidy the top contact strip so the
   hero appears sooner, and keep the floating buttons clear of the footer. */
@media (max-width: 600px) {
  /* Top strip → two tidy centred rows; drop the redundant "Follow Us" label. */
  .royal-topbar { font-size: 11px !important; }
  .royal-topbar-inner {
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 6px 12px !important;
  }
  .rtb-left, .rtb-right { gap: 16px !important; }
  .rtb-follow { display: none !important; }

  /* Smaller logo / director + tighter spacing = shorter header. */
  .royal-strip { padding: 8px 0 10px !important; }
  .royal-strip-inner { row-gap: 8px !important; }
  .rs-logo-img { height: 44px !important; }
  .rs-dir-frame img { width: 52px !important; }
  .rs-rating-body strong { font-size: 15px !important; }
  .rs-right { gap: 8px !important; }
  .rs-frame { margin-top: 2px !important; }

  /* Let the pink bottom bar clear the floating Plan / Contact buttons. */
  footer.site-footer .ftr-bar { padding-bottom: 88px !important; }
}

/* ============================================================
   FIX 2026-07-19b — mobile submenu "slides left / disappears on tap"
   The desktop dropdown hover applies transform:translateX(-50%) to centre the
   panel; on the mobile drawer (static submenu) that shifts it off-screen, and
   iOS sticky-:hover keeps it there after a tap. Pin the panel and keep hovered
   text readable.
   ============================================================ */
@media (max-width: 980px) {
  .pdf-nav-links .has-dropdown:hover > .pdf-submenu,
  .pdf-nav-links .has-dropdown:focus-within > .pdf-submenu,
  .pdf-nav-links .has-itin-menu:hover > .pdf-itin-menu,
  .pdf-nav-links .has-itin-menu:focus-within > .pdf-itin-menu {
    transform: none !important;
    left: auto !important;
    right: auto !important;
  }
  .pdf-nav-links .pdf-submenu a:hover,
  .pdf-nav-links .pdf-itin-menu a:hover {
    padding-left: 18px !important;
    background: rgba(157, 32, 123, 0.60) !important;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
  }
}

/* ============================================================
   FIX 2026-07-19c — proper mobile submenu ACCORDION
   Submenus were inconsistent on mobile (some shown inline, Itineraries hidden)
   and tapping a parent navigated away. Now: collapsed until the parent is tapped
   (JS adds .js-accordion + toggles .submenu-open). No-JS fallback keeps them open.
   ============================================================ */
@media (max-width: 980px) {
  .pdf-nav-links.js-accordion .pdf-submenu,
  .pdf-nav-links.js-accordion .pdf-itin-menu {
    position: static !important; transform: none !important; left: auto !important; right: auto !important;
    opacity: 1 !important; visibility: visible !important;
    max-height: 0; overflow: hidden; transition: max-height .32s ease;
    margin: 0 !important; padding: 0 !important; min-width: 0 !important;
    background: rgba(0, 0, 0, 0.22) !important; border: 0 !important; box-shadow: none !important;
  }
  .pdf-nav-links.js-accordion li.submenu-open > .pdf-submenu,
  .pdf-nav-links.js-accordion li.submenu-open > .pdf-itin-menu {
    max-height: 1600px; margin: 2px 0 8px !important;
  }
  .pdf-nav-links.js-accordion .pdf-submenu a,
  .pdf-nav-links.js-accordion .pdf-itin-menu a {
    color: #F5EFE3 !important; -webkit-text-fill-color: #F5EFE3 !important; padding: 12px 18px !important;
  }
  .pdf-nav-links.js-accordion .pdf-submenu a:active,
  .pdf-nav-links.js-accordion .pdf-itin-menu a:active {
    background: rgba(157, 32, 123, 0.6) !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
  }
  .pdf-nav-links.js-accordion .has-dropdown > a .caret,
  .pdf-nav-links.js-accordion .has-itin-menu > a .caret { transition: transform .3s; }
  .pdf-nav-links.js-accordion li.submenu-open > a .caret { transform: rotate(180deg); }
}