/* =====================================================================
   Tropical Bound home page refresh (BragDeal, 2026-10-29; client-approved
   design "bolder home page refresh" of 2026-10-20).
   Loaded by frontend/views/home.php only, after index.css and
   mediaQueryHome.css. The sand background is home page only: search and
   property pages keep the steel blue #719AB9.
   Source of truth: tropicalbound-audit/facelift-mockup/html/home-page-refresh-after.html
   ===================================================================== */

:root {
  --tb-coral: #FF7F50; --tb-coral-deep: #C8491B; --tb-coral-soft: #FFB591; --tb-coral-tint: #FFE4D6;
  --tb-sand: #FBF6F0; --tb-sand-deep: #F3EADF; --tb-sand-line: #E8DCCD;
  --tb-maroon: #701B42; --tb-maroon-deep: #5A1535;
  --tb-navy: #004173; --tb-navy-deep: #002945; --tb-navy-band: #0D476D;
  --tb-ink: #1F1418; --tb-body: #3A2E32; --tb-muted: #6B6355;
  --tb-gold: #F2AF0D; --tb-sky: #A9DCF5;
  --radius-card: 20px;
  --shadow-card: 0 10px 30px rgba(0, 20, 40, 0.10);
  --shadow-lift: 0 18px 44px rgba(0, 20, 40, 0.18);
}

body.tb-home { background: var(--tb-sand); color: var(--tb-body); }
.tb-home :focus-visible { outline: 3px solid var(--tb-coral); outline-offset: 3px; }
/* Search card fields show focus with the coral underline on the segment
   (:focus-within); the clipped outline drew a stray line through the label. */
.tb-home .site-search-segment-text :focus-visible { outline: none; }
.tbh-wrap { width: min(1240px, calc(100% - 48px)); margin: 0 auto; }
.tbh-section h2, .tbh-section h3 { margin: 0; color: var(--tb-ink); letter-spacing: -0.02em; line-height: 1.1; font-family: "Urbanist", sans-serif; }
.tbh-brand { color: var(--tb-maroon); }
.tbh-swoosh { position: relative; display: inline-block; }
.tbh-swoosh::after {
  content: ""; position: absolute; left: 2%; right: 2%; bottom: -8px; height: 9px;
  background: url("../../assests/swoosh-coral.svg") no-repeat center / 100% 100%;
}
.tbh-swoosh--ink::after { background-image: url("../../assests/swoosh-ink.svg"); }
.tbh-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 100px; font-weight: 700; cursor: pointer; text-decoration: none; }
.tbh-btn-maroon { background: var(--tb-maroon); color: #fff; }
.tbh-btn-maroon:hover, .tbh-btn-maroon:focus { background: var(--tb-maroon-deep); color: #fff; }

/* ---------- 1. Header nav over the hero ---------- */
.tb-home .navbar-nav .nav-link { font-size: 17px; font-weight: 600; padding-bottom: 6px; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); border-bottom: 2px solid transparent; }
.tb-home .navbar-nav .nav-link:hover, .tb-home .navbar-nav .nav-link.active { border-bottom-color: var(--tb-coral); }
.tb-home .navbar-logo-img { filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.35)); }
@media (max-width: 1199px) {
  .tb-home .navbar-nav .nav-link { text-shadow: none; }
}

/* ---------- 2. Hero: video logic in header.php is untouched; the hero now
   grows with its content instead of pinning the search card to the bottom
   of a one-screen photo. ---------- */
.tb-home-hero > .position-relative {
  min-height: 780px;
  justify-content: center !important;
  align-items: center !important;
}
.tb-home-hero .video-container { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }
.tb-home-hero .hero-static-image { height: 100%; min-height: 0; }
.tb-home-hero .video-container .hero-video { height: 100% !important; }
/* Veil: navy-to-dark gradient, at least 0.45 across the headline band so the
   coral word keeps its contrast on every video frame. */
.tb-home-hero .video-container.is-home .video-overlay {
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 41, 69, 0.62) 0%, rgba(0, 41, 69, 0.50) 40%, rgba(0, 20, 40, 0.34) 68%, rgba(0, 20, 40, 0.60) 100%);
}
.tb-home-hero .hero-content-block {
  position: relative !important;
  bottom: auto !important;
  z-index: 3;
  width: min(1180px, calc(100% - 48px));
  padding: 150px 0 90px;
  text-align: center;
}
.tb-home-hero .hero-content-block > .mb-5 { margin-bottom: 0 !important; }
.tb-home-hero h1#heroHeading {
  margin: 0;
  font-size: 84px !important;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.02;
  text-shadow: 0 2px 6px rgba(0, 20, 40, 0.55), 0 6px 34px rgba(0, 0, 0, 0.45);
}
.tb-home-hero h1#heroHeading em { font-style: normal; color: var(--tb-coral); }
.tb-home-hero p.banner-p {
  font-size: 23px !important;
  font-weight: 500;
  line-height: 1.4;
  max-width: 760px;
  margin: 18px auto 44px;
  color: #FFF4EC !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
}
.tb-home-hero .search-row { padding: 0 !important; }

/* Search card: same five fields, same submit, now a raised white card */
.tb-home-hero .site-search-bar-wrap { padding: 0; }
.tb-home-hero .site-search-bar {
  max-width: none;
  border: 0;
  border-top: 5px solid var(--tb-coral);
  border-radius: 22px;
  padding: 10px;
  overflow: visible;
  text-align: left;
  box-shadow: 0 30px 70px rgba(0, 10, 30, 0.38), 0 0 0 1px rgba(255, 255, 255, 0.5);
}
.tb-home-hero .site-search-segment { padding: 12px 18px; gap: 12px; border-radius: 14px; cursor: pointer; transition: background 0.15s ease; }
.tb-home-hero .site-search-segment:hover { background: var(--tb-sand); }
.tb-home-hero .site-search-segment--destination { flex: 1.1 1 0; }
.tb-home-hero .site-search-segment--property { flex: 1.35 1 0; }
.tb-home-hero .site-search-segment--dates { flex: 1.5 1 0; }
.tb-home-hero .site-search-segment--guests,
.tb-home-hero .site-search-segment--beds { flex: 0.85 1 0; }
.tb-home-hero .site-search-segment > i { font-size: 17px; color: var(--tb-maroon); }
.tb-home-hero .site-search-segment-text label {
  font-size: 12px; font-weight: 700; color: var(--tb-muted);
  letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 2px;
}
.tb-home-hero .site-search-segment-text select,
.tb-home-hero .site-search-segment-text input {
  font-size: 16px; font-weight: 600; color: var(--tb-ink);
  height: 24px; min-height: 24px; line-height: 24px; cursor: pointer;
}
.tb-home-hero .site-search-segment-text input::placeholder { color: #9A9088; opacity: 1; }
.tb-home-hero .site-search-segment-text select:has(option[value=""]:checked) { color: #9A9088; }
.tb-home-hero .site-search-divider { background: var(--tb-sand-line); margin: 14px 0; }
.tb-home-hero .site-search-more-btn { width: 56px; border-left: 0; background: transparent; color: var(--tb-maroon); font-size: 19px; border-radius: 14px; }
.tb-home-hero .site-search-more-btn:hover { background: var(--tb-sand); }
.tb-home-hero .site-search-more-btn.is-active { background: var(--tb-coral-tint); }
.tb-home-hero .site-search-submit { border-radius: 100px; padding: 0 30px; font-size: 17px; margin-left: 6px; }
.tb-home-hero .site-search-submit:hover { background: var(--tb-maroon-deep); filter: none; }
.tb-home-hero .site-search-more-panel { text-align: left; color: var(--tb-ink); }
.tb-home-hero .site-search-segment--dates.is-open { box-shadow: inset 0 -3px 0 var(--tb-coral); }
/* Picked range shown compactly ("23–29 Oct 2026") so it never overflows the
   field; the real input keeps the value the date picker and form need. */
/* Not absolutely positioned: a positioned .site-search-segment-text (which
   has overflow: hidden) would become the date picker's containing block and
   clip it. A negative top margin lays the label over the input instead. */
.tb-home-hero .tbh-dates-label {
  position: static; margin-top: -24px; height: 24px; line-height: 24px;
  font-size: 16px; font-weight: 600; color: var(--tb-ink); pointer-events: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: none;
}
.tb-home-hero .has-dates-label .tbh-dates-label { display: block; }
.tb-home-hero .has-dates-label #site-search-daterange { color: transparent !important; }

/* Trust line under the search card: plain items, coral icon, white text */
.tbh-trust { margin-top: 24px; display: flex; justify-content: center; flex-wrap: wrap; }
.tbh-trust-item {
  display: inline-flex; align-items: center; gap: 8px; padding: 4px 22px;
  color: #fff; font-size: 15px; font-weight: 600; text-decoration: none;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55); border-left: 1px solid rgba(255, 255, 255, 0.35);
}
.tbh-trust-item:first-child { border-left: 0; }
a.tbh-trust-item:hover, a.tbh-trust-item:focus { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.tbh-trust-item i { color: var(--tb-coral); filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.5)); }

/* Date picker: opens below the search card on desktop (was above it and got
   cut off by the top of the screen); fixed and centred on phones (search_bar.php). */
@media (min-width: 992px) {
  .tb-home-hero #datepicker-site-search-daterange { top: calc(100% + 14px) !important; left: 50% !important; right: auto !important; bottom: auto !important; transform: translateX(-50%); z-index: 40; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  /* stacked card on small tablets: same centred overlay as phones */
  .tb-home-hero #site-search-bar-wrap #datepicker-site-search-daterange {
    position: fixed !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important;
    transform: translate(-50%, -50%); z-index: 1060 !important; max-height: calc(100vh - 24px); overflow-y: auto;
  }
}

/* ---------- 3. Welcome ---------- */
.tbh-welcome { padding: 96px 0 72px; text-align: center; }
.tbh-welcome h2 { font-size: 46px; font-weight: 800; }
.tbh-welcome p { max-width: 860px; margin: 30px auto 36px; font-size: 20px; line-height: 1.55; color: var(--tb-body); }
.tb-home .trust-badges-row { margin-top: 0; gap: 16px; }
.tb-home .trust-badge {
  border: 1px solid var(--tb-sand-line); border-left: 5px solid var(--tb-coral);
  box-shadow: var(--shadow-card); color: var(--tb-ink);
}
.tb-home .trust-badge:hover { box-shadow: var(--shadow-lift); }
.tb-home .trust-badge-sep { background: var(--tb-sand-line); }
.tb-home .trust-badge-eyebrow { letter-spacing: 0.12em; }
.tb-home .trust-badge-score strong { color: var(--tb-navy); }

/* ---------- 4. Trending Destinations ---------- */
.tbh-trending { background: #fff; padding: 80px 0 90px; border-top: 1px solid var(--tb-sand-line); }
.tbh-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.tbh-head h2 { font-size: 42px; font-weight: 800; }
.tbh-dest-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.tbh-dest {
  position: relative; display: block; aspect-ratio: 16 / 10.5; border-radius: var(--radius-card);
  overflow: hidden; text-decoration: none; color: var(--tb-ink); box-shadow: var(--shadow-card);
  transition: transform 0.2s ease, box-shadow 0.2s ease; isolation: isolate;
}
.tbh-dest img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
.tbh-dest::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 20, 40, 0) 55%, rgba(0, 20, 40, 0.45) 100%); }
.tbh-dest__name {
  position: absolute; left: 16px; bottom: 16px; z-index: 1; padding: 10px 18px; border-radius: 100px;
  font-size: 22px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: var(--tb-ink);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.tbh-dest__go {
  position: absolute; right: 16px; bottom: 16px; z-index: 1; width: 44px; height: 44px; border-radius: 50%;
  background: var(--tb-coral); color: var(--tb-ink); display: grid; place-items: center; font-size: 16px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
}
.tbh-dest:hover, .tbh-dest:focus { transform: translateY(-6px); box-shadow: var(--shadow-lift); color: var(--tb-ink); }
.tbh-dest:hover img { transform: scale(1.05); }

/* ---------- 5. Aloha Deals: the coral band ---------- */
.tbh-deals { background: var(--tb-coral); color: var(--tb-ink); padding: 84px 0 90px; }
.tbh-deals .tbh-head h2, .tbh-deals .tbh-head h2 .tbh-brand { color: var(--tb-ink); }
.tbh-deal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.tbh-deal {
  background: #fff; border-radius: var(--radius-card); overflow: hidden; box-shadow: 0 14px 34px rgba(90, 21, 53, 0.22);
  display: flex; flex-direction: column; color: var(--tb-ink); text-decoration: none; transition: transform 0.2s ease;
}
.tbh-deal:hover, .tbh-deal:focus { transform: translateY(-6px); color: var(--tb-ink); }
.tbh-deal__photo { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--tb-sand-deep); }
.tbh-deal__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tbh-deal__price {
  position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: baseline; gap: 8px;
  padding: 8px 14px; border-radius: 100px; font-weight: 800; font-size: 18px; color: var(--tb-ink);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}
.tbh-deal__price s { font-size: 13px; font-weight: 600; color: var(--tb-body); }
.tbh-deal__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.tbh-deal__name { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 20px; font-weight: 800; color: var(--tb-ink); line-height: 1.25; }
.tbh-deal__name .tbh-rate { font-size: 14px; font-weight: 700; color: var(--tb-body); white-space: nowrap; }
.tbh-deal__name .tbh-rate i { color: var(--tb-gold); margin-right: 3px; }
.tbh-deal__meta { font-size: 14px; color: var(--tb-muted); display: flex; align-items: center; gap: 7px; }
.tbh-deal__meta i { color: var(--tb-coral-deep); }
.tbh-deal__when { margin-top: 2px; padding: 10px 12px; background: var(--tb-coral-tint); border-radius: 10px; font-size: 14px; font-weight: 700; color: var(--tb-ink); display: flex; align-items: center; gap: 8px; }
.tbh-deal__when i { color: var(--tb-coral-deep); }
.tbh-deal__link { margin-top: auto; padding-top: 6px; font-weight: 800; color: var(--tb-maroon); display: inline-flex; align-items: center; gap: 8px; }
.tbh-deal__link i { transition: transform 0.15s ease; }
.tbh-deal:hover .tbh-deal__link i { transform: translateX(4px); }
.tbh-deals .tbh-center { text-align: center; }
.tbh-deals .tbh-btn-maroon { padding: 16px 30px; font-size: 17px; margin-top: 36px; box-shadow: 0 10px 26px rgba(90, 21, 53, 0.3); }

/* ---------- 6. Stats ---------- */
.tbh-stats { background: #fff; padding: 56px 0; border-bottom: 1px solid var(--tb-sand-line); }
.tbh-stats .tbh-wrap { display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 40px; }
.tbh-stats h2 { font-size: 40px; font-weight: 800; color: var(--tb-navy); max-width: 540px; }
.tbh-stat-row { display: flex; justify-content: flex-end; }
.tbh-stat { padding: 6px 44px; border-left: 4px solid var(--tb-coral); }
.tbh-stat b { display: block; font-size: 60px; font-weight: 800; color: var(--tb-maroon); line-height: 1; letter-spacing: -0.03em; }
.tbh-stat span { display: block; margin-top: 8px; font-size: 17px; font-weight: 600; color: var(--tb-body); }

/* ---------- 7. Testimonials (same owl carousel, same data) ---------- */
.tbh-reviews { padding: 90px 0 96px; }
.tbh-rev-carousel .owl-stage { display: flex; }
.tbh-rev-carousel .owl-item { display: flex; padding: 4px 0 26px; }
.tbh-rev {
  position: relative; flex: 1 1 auto; width: 100%; background: #fff; border: 1px solid var(--tb-sand-line);
  border-radius: var(--radius-card); padding: 34px 30px 30px; box-shadow: var(--shadow-card);
  display: flex; flex-direction: column;
}
.tbh-rev__quote { font-size: 58px; line-height: 0.6; color: var(--tb-coral); font-weight: 800; margin-bottom: 18px; font-family: Georgia, "Times New Roman", serif; }
.tbh-rev__stars { color: var(--tb-gold); font-size: 15px; letter-spacing: 2px; }
.tbh-section .tbh-rev h3 { font-size: 22px; color: var(--tb-navy); margin: 10px 0 12px; font-weight: 800; word-break: break-word; }
.tbh-rev__text { margin: 0; font-size: 16px; line-height: 1.6; color: var(--tb-body); overflow-wrap: anywhere; }
.tbh-rev.is-clamped .tbh-rev__text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 11; overflow: hidden; }
.tbh-rev__more { align-self: flex-start; margin-top: 10px; padding: 0; border: 0; background: none; color: var(--tb-maroon); font-weight: 700; font-size: 15px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.tbh-rev__more[hidden] { display: none; }
.tbh-rev-carousel.owl-theme .owl-nav { display: flex; gap: 10px; justify-content: center; margin-top: 10px; }
.tbh-rev-carousel.owl-theme .owl-nav.disabled { display: none; }
.tbh-rev-carousel.owl-theme .owl-nav button.owl-prev,
.tbh-rev-carousel.owl-theme .owl-nav button.owl-next {
  width: 44px; height: 44px; margin: 0; border-radius: 50%; border: 2px solid var(--tb-maroon);
  background: #fff; color: var(--tb-maroon); font-size: 15px; display: grid; place-items: center;
}
.tbh-rev-carousel.owl-theme .owl-nav button.owl-prev:hover,
.tbh-rev-carousel.owl-theme .owl-nav button.owl-next:hover { background: var(--tb-coral); border-color: var(--tb-coral); color: var(--tb-ink); }

/* ---------- 8. Feature band ---------- */
.tbh-features { background: linear-gradient(135deg, var(--tb-navy-deep) 0%, var(--tb-navy-band) 100%); color: #fff; padding: 84px 0; }
.tbh-feat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.tbh-feat { text-align: center; padding: 10px 20px; }
.tbh-feat__disc { width: 84px; height: 84px; margin: 0 auto 22px; border-radius: 50%; background: var(--tb-coral); display: grid; place-items: center; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.3); }
.tbh-feat__disc i { font-size: 34px; color: var(--tb-ink); }
.tbh-section .tbh-feat h3 { color: #fff; font-size: 24px; font-weight: 800; margin-bottom: 10px; }
.tbh-feat p { margin: 0; color: #D9E4EE; font-size: 16px; line-height: 1.55; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .tb-home-hero h1#heroHeading { font-size: 64px !important; }
  .tbh-dest-grid, .tbh-deal-grid, .tbh-feat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 991.98px) {
  /* stacked search card (phones and small tablets) */
  .tb-home-hero .site-search-bar { padding: 8px; border-radius: 20px; }
  .tb-home-hero .site-search-segment { padding: 11px 16px; min-height: 54px; border-radius: 12px 12px 0 0; border-bottom: 1px solid var(--tb-sand-line); }
  .tb-home-hero .site-search-more-btn { width: 100%; border-bottom: 1px solid var(--tb-sand-line); border-radius: 0; min-height: 52px; }
  .tb-home-hero .site-search-submit { margin: 6px 0 0; padding: 18px; border-radius: 100px; }
}
@media (max-width: 860px) {
  .tbh-wrap { width: calc(100% - 32px); }
  .tb-home-hero > .position-relative { min-height: 0; }
  .tb-home-hero .hero-content-block { width: calc(100% - 32px); padding: 120px 0 56px; }
  .tb-home-hero h1#heroHeading { font-size: 44px !important; }
  .tb-home-hero p.banner-p { font-size: 18px !important; margin: 14px auto 26px; }
  .tbh-trust { flex-direction: column; align-items: center; gap: 8px; }
  .tbh-trust-item { border-left: 0; padding: 2px 0; font-size: 14px; }
  .tbh-welcome { padding: 60px 0 48px; text-align: left; }
  .tbh-welcome h2 { font-size: 36px; }
  .tbh-welcome p { font-size: 18px; margin: 20px 0 24px; }
  .tb-home .trust-badges-row { justify-content: flex-start; }
  /* keep the Google badge inside a 358px column (it was 381px wide at 390) */
  .tb-home .trust-badge { max-width: 100%; min-width: 0; padding: 12px 14px; gap: 10px; }
  .tb-home .trust-badge-body { min-width: 0; }
  .tb-home .trust-badge-score { white-space: normal; }
  .tbh-trending, .tbh-reviews, .tbh-deals { padding: 56px 0; }
  .tbh-head { flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 22px; }
  .tbh-head h2 { font-size: 34px; }
  .tbh-dest-grid, .tbh-deal-grid {
    display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 0 18px;
    margin-right: -16px; padding-right: 16px; -webkit-overflow-scrolling: touch;
  }
  .tbh-dest { flex: 0 0 78%; scroll-snap-align: start; aspect-ratio: 4 / 3; }
  .tbh-deal { flex: 0 0 84%; scroll-snap-align: start; }
  .tbh-deals .tbh-btn-maroon { margin-top: 10px; width: 100%; }
  .tbh-stats { padding: 40px 0; }
  .tbh-stats .tbh-wrap { grid-template-columns: 1fr; gap: 26px; }
  .tbh-stats h2 { font-size: 30px; }
  .tbh-stat-row { justify-content: flex-start; }
  .tbh-stat { padding: 4px 22px 4px 18px; }
  .tbh-stat b { font-size: 44px; }
  .tbh-rev { padding: 28px 22px 24px; }
  .tbh-features { padding: 56px 0; }
  .tbh-feat-grid { grid-template-columns: 1fr; gap: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .tbh-dest, .tbh-dest img, .tbh-deal, .tb-home .trust-badge { transition: none; }
  .tbh-dest:hover, .tbh-deal:hover { transform: none; }
  .tbh-dest:hover img { transform: none; }
}

/* ---------- QA fixes 2026-10-29 ---------- */
/* F-05: the destination photos have the area name baked into the image at
   about 80% of their height; centre-cropping showed the top of those letters
   under the card's own label. Crop from higher up so they stay out of frame. */
.tbh-dest img { object-position: 50% 30%; }
/* F-06: tighter review clamp on two- and three-up rows, so short reviews
   no longer sit in a tall empty card. Read more still opens the full text. */
@media (min-width: 700px) {
  .tbh-rev.is-clamped .tbh-rev__text { -webkit-line-clamp: 7; }
}
/* F-04: the review carousel and the phone/tablet scrollers clipped the
   card shadows. Room for the shadow inside the clipping box, offset by an
   equal negative margin so nothing moves. */
.tbh-rev-carousel .owl-stage-outer { padding: 10px 12px 0; margin: -10px -12px 0; }
.tbh-rev-carousel .owl-item { padding-bottom: 40px; }
.tbh-rev-carousel.owl-theme .owl-nav { margin-top: -4px; }
@media (max-width: 860px) {
  .tbh-dest-grid, .tbh-deal-grid {
    padding: 14px 16px 34px; margin: -10px -16px -16px; scroll-padding-inline: 16px;
  }
}

/* ---------- Hero 20% taller (Dan, 2026-10-29). Measured before: 780px at
   1440, 812px at 820, 882px at 390. Headline, search card and trust line keep
   their current offset (so the desktop date picker opens exactly where it did);
   the extra height is added under them, so more of the video shows. The video,
   poster and veil already fill the hero (inset 0, object-fit cover). ---------- */
.tb-home-hero > .position-relative { min-height: 936px; }
.tb-home-hero .hero-content-block { padding-bottom: 246px; }
@media (max-width: 860px) {
  .tb-home-hero > .position-relative { min-height: 0; }
  /* +162px at 820, +176px at 390: 20% of each measured height */
  .tb-home-hero .hero-content-block { padding-bottom: calc(244.7px - 3.256vw); }
}

/* ---------- QA R-01: the hero content block (z-index 3, 120-150px top
   padding) sat over the hero nav (z-index 1), so the hamburger and mobile
   logo could not be tapped under 1200px. The block's empty padding now lets
   taps through (its children stay interactive), and while the menu is open
   the nav is lifted above the headline and search card. ---------- */
.tb-home-hero .hero-content-block { pointer-events: none; }
.tb-home-hero .hero-content-block > * { pointer-events: auto; }
.tb-home-hero > .position-relative > nav.navbar:has(#navbarText.show),
.tb-home-hero > .position-relative > nav.navbar:has(#navbarText.collapsing) { z-index: 10; }