/* =========================================================================
   Postmark Travel — home page hero (edge-to-edge) + section spacing.
   Scoped to index.html only. Add/remove via a single <link> tag.
   ========================================================================= */

/* ---------- Full-width hero video banner ---------- */

/* The section holding the video: kill horizontal padding so the video can
   spread edge-to-edge in the viewport. */
.elementor-10 .e-parent:has(> .e-con-inner > .elementor-background-video-container),
.elementor-10 .e-parent:has(.elementor-background-video-container),
.elementor-10 .e-con.e-parent:has(.elementor-background-video-container) {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

/* Elementor's e-con-inner is what actually caps the width to 1140px.
   For the hero specifically, remove the cap. */
.elementor-10 .e-parent:has(.elementor-background-video-container) > .e-con-inner {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* The background-video-container itself: fill its parent (the section,
   which is 100% wide) — no explicit width so we don't fight the layout. */
.elementor-10 .elementor-background-video-container {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  transform: none !important;
  z-index: 0 !important;
  overflow: hidden !important;
}

.elementor-10 .elementor-background-video-container video.elementor-background-video-hosted {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  transform: none !important;
}

/* Make the hero section tall (near-full-viewport). */
.elementor-10 .e-parent:has(.elementor-background-video-container) {
  min-height: 92vh !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ensure the inner content ("Travel Redefined" title) sits above the video */
.elementor-10 .e-parent:has(.elementor-background-video-container) > .e-con-inner {
  position: relative !important;
  z-index: 2 !important;
}

/* ---------- Reduce excess vertical spacing between home sections ---------- */

/* IMPORTANT: DO NOT touch the "Tailored Packages" section (IDs
   `elementor-element-6aa7d79` and `elementor-element-5864263` and its inner
   `elementor-element-e3bb234`) — user explicitly asked to keep it as-is.
   Rules below use :not() to exclude those. */

/* Zero the padding on the hero section itself */
body .elementor-10 .e-con.e-parent:has(.elementor-background-video-container) {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body .elementor-10 .e-con.e-parent:has(.elementor-background-video-container) > .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ---------- CONSISTENT SECTION + TITLE SPACING ----------
   Every VISIBLE content section gets a uniform 32px top/bottom band, and
   every section title gets a uniform 16px gap to the content below it.

   Intentionally NOT normalised:
     - 8d5636a  hero video        → 0 (edge-to-edge, handled above)
     - 83c1fe2  Tailored Packages → left as-is per client request
     - 95e7cea  hidden statement  → 0
     - fa291cb  pre-footer spacer  → 0

   Section-title gaps come from three different mechanisms, so each is
   pinned to 16px at its own source:
     - fc8c77d "The Journey is yours"  → flex gap on inner 2522bd9
     - 9109ff8 "What sets us apart"    → flex gap on inner 52c139b
     - adce1d8 "Echoes of Journeys Past" → heading widget padding-bottom  */

/* Standalone content sections: 32px vertical band. */
body .elementor-10 .elementor-element-fc8c77d.e-con-full,
body .elementor-10 .elementor-element-9109ff8.e-con-full {
  padding-top: 32px !important;
  padding-bottom: 32px !important;
}

/* "Echoes of Journeys Past" (adce1d8) is a title that heads the carousel
   (d4f4b26) below it — treat the two as ONE unit: 32px above the title,
   32px below the carousel, and a tight 16px flow between them (set via the
   title's padding-bottom below). */
body .elementor-10 .elementor-element-adce1d8.e-con-full {
  padding-top: 32px !important;
  padding-bottom: 0 !important;
}
body .elementor-10 .elementor-element-d4f4b26.e-con-full {
  padding-top: 0 !important;
  padding-bottom: 32px !important;
}

/* Hidden statement + pre-footer spacer stay collapsed. */
body .elementor-10 .elementor-element-95e7cea.e-con-full,
body .elementor-10 .elementor-element-fa291cb.e-con {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Uniform 16px gap below every section title. */
body .elementor-10 .elementor-element-2522bd9,
body .elementor-10 .elementor-element-52c139b {
  gap: 16px !important;
  row-gap: 16px !important;
}
body .elementor-10 .elementor-element-adce1d8 .elementor-widget-heading > .elementor-widget-container {
  padding-top: 0 !important;
  padding-bottom: 16px !important;
}

/* ---------- MOBILE (≤767px): tighten section band to 20px ----------
   The rest of the site (country/product pages) drops its section band to
   20px on mobile; home was left pinned at 32px. Match that rhythm for the
   NON-Tailored home content sections only.

   Unchanged on mobile (intentionally omitted here so the all-viewport rules
   above still apply):
     - 83c1fe2  Tailored Packages → stays 40px (client request)
     - 8d5636a  hero video        → stays 0 (edge-to-edge)
     - 95e7cea / fa291cb          → stay 0
     - 16px title→content gaps    → untouched (not referenced below)

   adce1d8 (title) + d4f4b26 (carousel) still flow as one unit: 20px above
   the title, 0 between, 20px below the carousel. */
@media (max-width: 767px) {
  body .elementor-10 .elementor-element-fc8c77d.e-con-full,
  body .elementor-10 .elementor-element-9109ff8.e-con-full {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  body .elementor-10 .elementor-element-adce1d8.e-con-full {
    padding-top: 20px !important;
    padding-bottom: 0 !important;
  }
  body .elementor-10 .elementor-element-d4f4b26.e-con-full {
    padding-top: 0 !important;
    padding-bottom: 20px !important;
  }
}

/* ---------- Client-requested removals ----------
   - 76e5d67: the scroll-down arrow (Group-25.png, links to #vision) inside
     the hero video.
   - 06cb3a2: the "VIEW MORE" button lower on the home page. */
.elementor-10 .elementor-element-76e5d67,
.elementor-10 .elementor-element-06cb3a2 {
  display: none !important;
}