/* ==========================================================================
   Real Deal: tour page components (v2)
   Tour pages reuse the homepage system: hero, trust strip, tour cards,
   charter band, FAQ, pre-footer and footer. This file only adds what a
   single-experience page needs on top of it. Loaded only on pages flagged
   _rdbt_tour_components = 1, so no other page receives these rules.
   ========================================================================== */

/* ---------- Tour hero ---------- */
body .elementor .e-con.rdbt-hero.rdbt-hero--tour { min-height: min(86svh, 820px); }
body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .elementor-heading-title { font-size: clamp(2.5rem, 4.4vw, 4.25rem); line-height: 1.06; }
@media (min-width: 768px) {
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .rdbt-hero__line { display: block; white-space: nowrap; }
}
/* Tablets: keep the words in a narrower column on a slightly deeper left-hand shade, whatever the photograph. */
@media (min-width: 768px) and (max-width: 1024px) {
  body .elementor .e-con.rdbt-hero.rdbt-hero--tour::after { background: linear-gradient(90deg, rgba(0, 26, 48, 0.84) 0%, rgba(0, 26, 48, 0.64) 46%, rgba(0, 26, 48, 0.18) 74%, rgba(0, 26, 48, 0) 92%), linear-gradient(0deg, rgba(0, 26, 48, 0.4) 0%, rgba(0, 26, 48, 0) 30%); }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__lede { max-width: 440px; }
}
/* Phones: photograph in the upper half, words anchored to the bottom over a deep gradient. */
@media (max-width: 767px) {
  body .elementor .e-con.rdbt-hero.rdbt-hero--tour { justify-content: flex-end; min-height: calc(100svh - 72px); padding-top: 96px; padding-bottom: 32px; }
  /* Shade is measured from the bottom, where the words sit, so it covers them on any screen height. */
  body .elementor .e-con.rdbt-hero.rdbt-hero--tour::after {
    background:
      linear-gradient(0deg, rgba(0, 26, 48, 0.94) 0, rgba(0, 26, 48, 0.8) 300px, rgba(0, 26, 48, 0.45) 440px, rgba(0, 26, 48, 0) 560px),
      linear-gradient(180deg, rgba(0, 26, 48, 0.5) 0, rgba(0, 26, 48, 0) 140px);
  }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .elementor-heading-title { font-size: 2.25rem; line-height: 1.08; text-wrap: balance; }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .rdbt-hero__eyebrow { margin-bottom: 14px; font-size: 0.75rem; letter-spacing: 0.16em; }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__lede { margin: 16px 0 24px; }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__lede p { font-size: 1rem; line-height: 1.55; }
  body .elementor .rdbt-hero--tour .e-con.rdbt-hero__actions { gap: 12px; }
  /* The fixed phone bar already carries Book Now and WhatsApp, so the hero does not repeat them. */
  body .elementor .rdbt-hero--tour .e-con.rdbt-hero__actions { display: none; }
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__lede { margin-bottom: 8px; }
}
@media (max-width: 380px) {
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .elementor-heading-title { font-size: 2rem; }
}
@media (max-width: 340px) {
  body .elementor .rdbt-hero--tour .elementor-widget.rdbt-hero__title .elementor-heading-title { font-size: 1.875rem; }
}

/* ---------- Photo focal point for any image: set in Elementor (Advanced > CSS Classes) ---------- */
body .elementor .elementor-widget.rdbt-focus-top img { object-position: 50% 25%; }
body .elementor .elementor-widget.rdbt-focus-bottom img { object-position: 50% 80%; }

/* ---------- Charter band, mirrored: photo on the left, so tour pages don't repeat the homepage band ---------- */
@media (min-width: 901px) {
  body .elementor .e-con.rdbt-charter.rdbt-charter--flip .elementor-widget.rdbt-charter__photo { order: -1; }
  body .elementor .e-con.rdbt-charter.rdbt-charter--flip .e-con.rdbt-charter__copy { padding-left: clamp(40px, 5vw, 96px); padding-right: var(--rdbt-inline-vw); }
}

/* ---------- Booking button, outline variant ----------
   Red still means "books a tour", but two solid red buttons never sit side by side. */
body .elementor .elementor-widget-button.rdbt-w-bookline .elementor-button { background: transparent; border-color: var(--rdbt-cta); color: var(--rdbt-cta); }
body .elementor .elementor-widget-button.rdbt-w-bookline .elementor-button:hover,
body .elementor .elementor-widget-button.rdbt-w-bookline .elementor-button:focus-visible { background: var(--rdbt-cta); border-color: var(--rdbt-cta); color: #FFFFFF; }

/* ---------- Two-up tour cards: the homepage card, larger, for a single experience's options ---------- */
body .elementor .e-con.rdbt-tours.rdbt-tours--two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; max-width: 1080px; }
body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__media { aspect-ratio: 3 / 2; }
body .elementor .rdbt-tours--two .e-con.rdbt-tour-card__body { gap: 14px; padding: 32px 32px 34px; }
body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__title .elementor-heading-title { min-height: 0; font-size: clamp(1.625rem, 2.2vw, 2rem); }
body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__desc p { min-height: 4.95em; font-size: 1.0625rem; line-height: 1.65; }
body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__facts li { font-size: 1rem; }
body .elementor .rdbt-tours--two .e-con.rdbt-tour-card__actions { padding-top: 22px; gap: 14px 22px; }
@media (max-width: 767px) {
  body .elementor .e-con.rdbt-tours.rdbt-tours--two { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  body .elementor .rdbt-tours--two .e-con.rdbt-tour-card__body { padding: 24px 22px 26px; }
  body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__desc p { min-height: 0; }
}
/* Smallest phones: long values sit under their label instead of wrapping right-aligned. */
@media (max-width: 400px) {
  body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__facts li { flex-direction: column; gap: 2px; }
  body .elementor .rdbt-tours--two .elementor-widget.rdbt-tour-card__facts li strong { text-align: left; }
}

/* ---------- Stops list inside the dark charter band ---------- */
body .elementor .rdbt-charter .elementor-widget.rdbt-stops__list { width: 100%; max-width: 560px; }
body .elementor .rdbt-charter .elementor-widget.rdbt-stops__list dl { margin: 6px 0 4px; border-bottom: 1px solid rgba(255, 255, 255, 0.16); }
body .elementor .rdbt-charter .elementor-widget.rdbt-stops__list dt { margin: 0; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.16); font-family: var(--rdbt-font-display); font-size: 1.5rem; line-height: 1.2; color: #FFFFFF; }
body .elementor .rdbt-charter .elementor-widget.rdbt-stops__list dd { margin: 6px 0 0; padding-bottom: 20px; font-size: 1rem; line-height: 1.6; color: rgba(255, 255, 255, 0.8); }
body .elementor .rdbt-charter .elementor-widget.rdbt-stops__note p { margin: 0; font-size: 0.9375rem; line-height: 1.6; color: rgba(255, 255, 255, 0.72); }

/* ---------- Included / what to bring: two tinted panels ---------- */
body .elementor .e-con.rdbt-inc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; width: 100%; max-width: 1080px; margin: 0 auto; }
body .elementor .e-con.rdbt-inc__col { display: flex; flex-direction: column; gap: 18px; padding: clamp(28px, 3vw, 40px); background: var(--rdbt-surface); border-radius: var(--rdbt-radius); }
body .elementor .rdbt-ground-surface .e-con.rdbt-inc__col { background: #FFFFFF; border: 1px solid var(--rdbt-line); }
body .elementor .elementor-widget.rdbt-inc__title .elementor-heading-title { margin: 0; font-family: var(--rdbt-font-display); font-weight: 400; font-size: 1.625rem; line-height: 1.2; color: var(--rdbt-ink); }
body .elementor .elementor-widget.rdbt-inc__list ul { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
body .elementor .elementor-widget.rdbt-inc__list li { position: relative; margin: 0; padding-left: 30px; font-size: 1.0625rem; line-height: 1.5; color: var(--rdbt-ink); }
body .elementor .elementor-widget.rdbt-inc__list li::before { content: ""; position: absolute; left: 2px; top: 0.42em; width: 12px; height: 7px; border-left: 2px solid var(--rdbt-accent); border-bottom: 2px solid var(--rdbt-accent); transform: rotate(-45deg); }
body .elementor .elementor-widget.rdbt-inc__list.rdbt-inc__list--bring li::before { top: 0.72em; width: 14px; height: 0; border-left: 0; border-bottom: 2px solid var(--rdbt-accent); transform: none; }
@media (max-width: 767px) { body .elementor .e-con.rdbt-inc { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Guest quotes: short attributed excerpts ---------- */
body .elementor .e-con.rdbt-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; width: 100%; max-width: 1080px; margin: 0 auto; }
body .elementor .elementor-widget.rdbt-quote blockquote { display: flex; flex-direction: column; gap: 18px; height: 100%; margin: 0; padding: clamp(28px, 3vw, 40px); background: #FFFFFF; border: 1px solid var(--rdbt-line); border-radius: var(--rdbt-radius); }
body .elementor .elementor-widget.rdbt-quote .rdbt-stars { font-size: 1rem; letter-spacing: 0.12em; color: var(--rdbt-sun); }
body .elementor .elementor-widget.rdbt-quote blockquote p { margin: 0; font-family: var(--rdbt-font-display); font-size: 1.375rem; line-height: 1.45; color: var(--rdbt-ink); }
body .elementor .elementor-widget.rdbt-quote blockquote footer { margin-top: auto; font-size: 0.9375rem; color: var(--rdbt-ink-muted); }
body .elementor .elementor-widget.rdbt-quote blockquote footer strong { color: var(--rdbt-ink); font-weight: 700; }
@media (max-width: 767px) {
  body .elementor .e-con.rdbt-quotes { grid-template-columns: minmax(0, 1fr); }
  body .elementor .elementor-widget.rdbt-quote blockquote p { font-size: 1.1875rem; }
}

/* ---------- Info panel: cancellation and weather, once the wording is confirmed ---------- */
body .elementor .elementor-widget.rdbt-info { width: 100%; max-width: 880px; margin: 0 auto; }
body .elementor .elementor-widget.rdbt-info .rdbt-info__box { padding: 26px 32px; background: var(--rdbt-surface); border-left: 3px solid var(--rdbt-accent); border-radius: var(--rdbt-radius); }
body .elementor .elementor-widget.rdbt-info p { margin: 0 0 10px; font-size: 1rem; line-height: 1.65; color: var(--rdbt-ink-muted); }
body .elementor .elementor-widget.rdbt-info p:last-child { margin-bottom: 0; }
body .elementor .elementor-widget.rdbt-info strong { color: var(--rdbt-ink); }