/*
  Oloropa O11 index hero boundary overlay fix
  Root cause: the homepage accumulated several viewport/scroll rescue layers that made
  the first hero behave like a delayed block. This final index-only layer re-establishes
  one root scrollbar, keeps the concierge header out of document flow, and forces the
  hero media plane to start at y=0 so no dark spacer can appear above the image/video.
*/
html:has(body[data-oloropa-page="index.php"]),
html[data-ol-index-o11-boundary-stable="true"]{
  width:100%!important;
  max-width:100%!important;
  min-height:100%!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior-y:auto!important;
  scrollbar-gutter:auto!important;
  background:#2B211A!important;
}

html body[data-oloropa-page="index.php"],
html body[data-oloropa-page="index.php"].ix-scroll-locking,
html body[data-oloropa-page="index.php"].ol-phase1-structure-ready{
  width:100%!important;
  max-width:100%!important;
  min-height:100%!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow-x:clip!important;
  overflow-y:visible!important;
  overscroll-behavior-y:auto!important;
  background:#2B211A!important;
}

@supports not (overflow:clip){
  html body[data-oloropa-page="index.php"]{overflow-x:hidden!important;}
}

html body[data-oloropa-page="index.php"] > :is(.ix-progress,.ol-cc-mobile-drawer,.ol-es-sound-dock,[data-ol-sound-dock]){
  margin:0!important;
}

/* The header is an overlay, never a block that reserves vertical document space. */
html body[data-oloropa-page="index.php"] > header.ol-cc-header[data-oloropa-concierge-header],
html body[data-oloropa-page="index.php"] header.ol-cc-header[data-oloropa-concierge-header]{
  position:fixed!important;
  top:max(0px,env(safe-area-inset-top,0px))!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate3d(-50%,0,0)!important;
  margin:0!important;
  width:min(1180px,calc(100vw - 32px))!important;
  max-width:calc(100vw - 32px)!important;
  height:auto!important;
  min-height:0!important;
  z-index:10000!important;
  pointer-events:auto!important;
  will-change:transform!important;
}

html body[data-oloropa-page="index.php"] > header.ol-cc-header[data-oloropa-concierge-header].is-compact{
  top:max(0px,env(safe-area-inset-top,0px))!important;
  margin:0!important;
  transform:translate3d(-50%,0,0)!important;
}

html body[data-oloropa-page="index.php"] > #main-content,
html body[data-oloropa-page="index.php"].ol-phase1-structure-ready > #main-content{
  position:relative!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  flex:none!important;
  gap:0!important;
  overflow-x:clip!important;
  overflow-y:visible!important;
  contain:none!important;
  content-visibility:visible!important;
  contain-intrinsic-size:none!important;
  background:#2B211A!important;
  transform:none!important;
  translate:none!important;
}

html body[data-oloropa-page="index.php"]::before,
html body[data-oloropa-page="index.php"]::after,
html body[data-oloropa-page="index.php"] #main-content::before,
html body[data-oloropa-page="index.php"] #main-content::after{
  content:none!important;
  display:none!important;
}

html body[data-oloropa-page="index.php"] #main-content > *,
html body[data-oloropa-page="index.php"] #main-content > section,
html body[data-oloropa-page="index.php"] #main-content > [id]{
  margin-top:0!important;
  margin-bottom:0!important;
  margin-block:0!important;
  transform:none!important;
  translate:none!important;
  content-visibility:visible!important;
  contain-intrinsic-size:none!important;
  box-sizing:border-box!important;
}

/* First visual block: sits at the document ceiling and paints its media from the top edge. */
html body[data-oloropa-page="index.php"] #main-content > #home-hero.ol-o5-award-hero,
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero{
  order:0!important;
  position:relative!important;
  inset:auto!important;
  top:0!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:100svh!important;
  height:auto!important;
  margin:0!important;
  margin-block:0!important;
  padding-top:calc(var(--ol-public-header-height,76px) + clamp(.95rem,2svh,1.55rem))!important;
  padding-right:clamp(1rem,5vw,5rem)!important;
  padding-bottom:clamp(2.15rem,5.8svh,5rem)!important;
  padding-left:clamp(1rem,5vw,5rem)!important;
  display:grid!important;
  align-items:end!important;
  align-content:end!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#2B211A!important;
}

/* Image fallback below the videos so the above-the-fold area is never a flat dark block. */
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero::before{
  content:""!important;
  position:absolute!important;
  inset:-3px 0 0 0!important;
  z-index:0!important;
  display:block!important;
  background:
    linear-gradient(365deg,rgba(43,33,26,.72),rgba(43,33,26,.38) 50%,rgba(43,33,26,.28)),
    url('../media/cinematic/photos/balloon dawn wide Masai Mara.avif') center center/cover no-repeat!important;
  transform:scale(1.025)!important;
  pointer-events:none!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero > :is(.ol-o5-award-media,.ol-o5-award-telemetry),
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero :is(.ol-o5-award-video,.ol-o5-award-placeholder,.ol-o5-award-depth,.ol-o5-award-mask){
  position:absolute!important;
  inset:-3px 0 0 0!important;
  width:100%!important;
  height:calc(100% + 3px)!important;
  min-height:calc(100% + 3px)!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  translate:none!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero > .ol-o5-award-media{
  z-index:1!important;
  overflow:hidden!important;
  pointer-events:none!important;
  background:
    linear-gradient(365deg,rgba(43,33,26,.76),rgba(43,33,26,.32)),
    url('../media/cinematic/photos/balloon dawn wide Masai Mara.avif') center center/cover no-repeat!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-placeholder{
  z-index:0!important;
  opacity:.96!important;
  background:
    linear-gradient(365deg,rgba(43,33,26,.72),rgba(43,33,26,.26)),
    url('../media/cinematic/photos/balloon dawn wide Masai Mara.avif') center center/cover no-repeat!important;
  filter:saturate(1.05) contrast(1.04) brightness(.74)!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-video{
  z-index:1!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  opacity:0!important;
  filter:saturate(1.06) contrast(1.07) brightness(.76)!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-video.is-active,
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-video[autoplay]{
  opacity:1!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-depth{
  z-index:2!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 68% 18%,rgba(253,251,247,.14),transparent 23rem),
    linear-gradient(365deg,rgba(43,33,26,.86),rgba(43,33,26,.52) 48%,rgba(43,33,26,.18)),
    linear-gradient(365deg,rgba(43,33,26,.08),rgba(43,33,26,.88))!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-mask{
  z-index:3!important;
  pointer-events:none!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero > .ol-o5-award-telemetry{
  z-index:4!important;
  opacity:.24!important;
  pointer-events:none!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-content,
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-hero-morph,
html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-hero-sr{
  position:relative!important;
  z-index:5!important;
  transform:none!important;
  translate:none!important;
}

html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero .ol-o5-award-content{
  width:min(1440px,100%)!important;
  max-width:1440px!important;
  margin:0 auto!important;
}

html body[data-oloropa-page="index.php"] #route-intelligence-theatre,
html body[data-oloropa-page="index.php"] :is(#package-paths,#conservation-pulse,#serenity-homepage,#homepage-brief,#final-decision){
  margin-top:0!important;
  margin-bottom:0!important;
  margin-block:0!important;
}

html body[data-oloropa-page="index.php"] #main-content + footer.ol-cc-footer,
html body[data-oloropa-page="index.php"] > footer.ol-cc-footer{
  position:relative!important;
  display:block!important;
  flex:none!important;
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  margin-block:0!important;
  padding-bottom:max(1.25rem,env(safe-area-inset-bottom))!important;
  transform:none!important;
  translate:none!important;
  clear:both!important;
  overflow:hidden!important;
  contain:none!important;
  content-visibility:visible!important;
  contain-intrinsic-size:none!important;
  background:#2B211A!important;
}

html body[data-oloropa-page="index.php"] > footer.ol-cc-footer::after{
  content:none!important;
  display:none!important;
}

html body[data-oloropa-page="index.php"] > footer.ol-cc-footer ~ :is(script,style,template){
  display:none!important;
  width:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
}

@media(max-width:900px){
  html body[data-oloropa-page="index.php"] > header.ol-cc-header[data-oloropa-concierge-header],
  html body[data-oloropa-page="index.php"] header.ol-cc-header[data-oloropa-concierge-header]{
    top:max(0px,env(safe-area-inset-top,0px))!important;
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
  }
  html body[data-oloropa-page="index.php"] #main-content > #home-hero.ol-o5-award-hero,
  html body[data-oloropa-page="index.php"] #home-hero.ol-o5-award-hero{
    min-height:100svh!important;
    padding-top:calc(var(--ol-public-header-height,66px) + 1rem)!important;
    padding-right:1rem!important;
    padding-bottom:2.2rem!important;
    padding-left:1rem!important;
  }
}