/* RBR_GH_VISUAL_OPTION_B_V1_20261026
 * Getting Here 3-language, CSS-only refinement after approved Visual Option A.
 * Hero and final CTA retain existing real photographs supplied via RBR Media CMS.
 * No edits to picture files, published content, or Photo Credit data.
 */

/* Transparent navigation floats over the real cover image at page top.
   The existing .scrolled switch restores a legible dark bar on scroll. */
body.rbr-gh-v1 > .site-header {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  width: 100%;
  z-index: 1000;
  background: linear-gradient(180deg,rgba(9,34,34,.42) 0%,rgba(9,34,34,.12) 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: none !important;
  transition: background-color .24s ease, background .24s ease, box-shadow .24s ease;
}
body.rbr-gh-v1 > .site-header.scrolled {
  background: rgba(15,52,48,.96) !important;
  border-bottom-color: rgba(255,255,255,.13) !important;
  box-shadow: 0 7px 23px rgba(8,25,24,.15) !important;
}
body.rbr-gh-v1 > .site-header .wordmark,
body.rbr-gh-v1 > .site-header .wordmark span,
body.rbr-gh-v1 > .site-header .wordmark small,
body.rbr-gh-v1 > .site-header .top-nav a,
body.rbr-gh-v1 > .site-header .menu-button {
  color: #fff !important;
}
body.rbr-gh-v1 > .site-header .wordmark,
body.rbr-gh-v1 > .site-header .top-nav a {
  text-shadow: 0 1px 7px rgba(11,33,31,.38);
}
body.rbr-gh-v1 > .site-header .nav-cta {
  border-color: rgba(255,255,255,.73) !important;
}

/* The header no longer occupies a solid band above the Hero. */
body.rbr-gh-v1 .inner-main {
  padding-top: 0;
}
body.rbr-gh-v1 .rbr-gh-hero {
  min-height: clamp(510px,45vw,650px);
  padding-top: clamp(158px,12vw,188px);
  padding-bottom: clamp(77px,7vw,104px);
  background-color: #d9e7e4;
  background-image:
    linear-gradient(90deg,
      rgba(248,248,243,.69) 0%,
      rgba(248,248,243,.47) 28%,
      rgba(248,248,243,.19) 53%,
      rgba(248,248,243,.035) 79%,
      rgba(248,248,243,0) 100%),
    var(--rbr-gh-hero-photo,url('/assets/uploads/overview.jpg')) !important;
  background-position: center, center 53%;
  background-repeat: no-repeat;
  background-size: cover;
}
body.rbr-gh-v1 .rbr-gh-hero::after {
  height: 34px;
  background: linear-gradient(to bottom,transparent,rgba(248,247,242,.06));
}
body.rbr-gh-v1 .rbr-gh-hero .overline,
body.rbr-gh-v1 .rbr-gh-hero h1,
body.rbr-gh-v1 .rbr-gh-hero .body-copy {
  position: relative;
  z-index: 1;
  text-shadow: 0 1px 10px rgba(248,248,243,.24);
}
/* Preserve jump-to-section usability under the floating header. */
body.rbr-gh-v1 #plan-your-trip,
body.rbr-gh-v1 #cost-clarity,
body.rbr-gh-v1 #rates-2026,
body.rbr-gh-v1 #after-enquiry {
  scroll-margin-top: 105px;
}

/* Restore the exact photo selected in the CMS for the bottom CTA.
   The variable is set by existing rbr-getting-here-media-v1.js for
   published/preview content; the fallback is an existing site image. */
body.rbr-gh-v1 .rbr-gh-end-cta {
  min-height: clamp(365px,33vw,480px);
  padding-top: clamp(62px,6vw,100px);
  padding-bottom: clamp(62px,6vw,100px);
  background-color: #cbdedb !important;
  background-image:
    linear-gradient(90deg,
      rgba(247,248,243,.73) 0%,
      rgba(247,248,243,.54) 23%,
      rgba(247,248,243,.25) 46%,
      rgba(247,248,243,.06) 75%,
      rgba(247,248,243,.025) 100%),
    var(--rbr-gh-cta-photo,url('/assets/uploads/overview.jpg')) !important;
  /* Visual A used background: ... !important (a shorthand resetting size/repeat).
     Match that priority, otherwise the image tiles instead of covering the CTA. */
  background-size: cover !important;
  background-position: center,center 58% !important;
  background-repeat: no-repeat !important;
  border-top: 0;
}
body.rbr-gh-v1 .rbr-gh-end-cta .overline,
body.rbr-gh-v1 .rbr-gh-end-cta h2 {
  color: #143d39 !important;
  text-shadow: 0 1px 10px rgba(245,248,244,.25);
}
/* Photo metadata stays private/in CMS; the previous Option A hides public badges.
   A11Y photo description is restored because the background is visible again. */
body.rbr-gh-v1 .rbr-gh-end-cta [data-rbr-gh-a11y="endCta"] {
  display: block !important;
}
body.rbr-gh-v1 [data-rbr-gh-credit],
body.rbr-gh-v1 .rbr-gh-cms-credit {
  display: none !important;
}

/* Option A made the following Next Step band pale but its inherited text white.
   Ensure readable dark text without replacing its wording or links. */
body.rbr-gh-v1 .journey-band {
  background: #e7eeea !important;
  color: #1a413a !important;
}
body.rbr-gh-v1 .journey-band .journey-kicker,
body.rbr-gh-v1 .journey-band h2,
body.rbr-gh-v1 .journey-band .journey-copy,
body.rbr-gh-v1 .journey-band .journey-actions,
body.rbr-gh-v1 .journey-band .journey-actions a {
  color: #1a413a !important;
  opacity: 1 !important;
}
body.rbr-gh-v1 .journey-band .journey-link {
  border-color: rgba(26,65,58,.45) !important;
}

@media (max-width: 900px) {
  body.rbr-gh-v1 > .site-header .top-nav.is-open {
    background: rgba(15,52,48,.98) !important;
  }
  body.rbr-gh-v1 > .site-header:has(.top-nav.is-open) {
    background: rgba(15,52,48,.98) !important;
  }
  body.rbr-gh-v1 .rbr-gh-hero {
    min-height: 510px;
    padding-top: 145px;
    padding-bottom: 70px;
  }
}
@media (max-width: 640px) {
  body.rbr-gh-v1 .rbr-gh-hero {
    min-height: 475px;
    padding: 127px 25px 61px;
    background-image:
      linear-gradient(180deg,
        rgba(248,248,243,.75) 0%,
        rgba(248,248,243,.57) 43%,
        rgba(248,248,243,.24) 100%),
      var(--rbr-gh-hero-photo,url('/assets/uploads/overview.jpg')) !important;
    background-position: center, 58% center;
  }
  body.rbr-gh-v1 .rbr-gh-end-cta {
    min-height: 370px;
    padding: 60px 25px 72px;
    background-image:
      linear-gradient(90deg,
        rgba(247,248,243,.84) 0%,
        rgba(247,248,243,.66) 65%,
        rgba(247,248,243,.25) 100%),
      var(--rbr-gh-cta-photo,url('/assets/uploads/overview.jpg')) !important;
    background-position: center, 60% center;
  }
  body.rbr-gh-v1 .rbr-gh-end-cta h2 {
    max-width: 15ch;
  }
}
@media(prefers-reduced-motion:reduce) {
  body.rbr-gh-v1 > .site-header {transition:none;}
}
