/* Scoped Salient header overlay for Parade full-bleed hero templates. */
body.poh-transparent-hero-nav #header-space {height:0!important;min-height:0!important;display:none!important}
body.poh-transparent-hero-nav #header-outer,
body.poh-transparent-hero-nav #header-outer[data-transparent-header="true"] {
  position:absolute!important;top:0!important;left:0;right:0;width:100%;background:transparent!important;
  border:0!important;box-shadow:none!important;-webkit-box-shadow:none!important;
  transition:background-color .25s ease,box-shadow .25s ease!important;
}
body.admin-bar.poh-transparent-hero-nav #header-outer {top:32px!important}
body.poh-transparent-hero-nav #header-outer #top,
body.poh-transparent-hero-nav #header-outer .container {background:transparent!important}
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #top nav > ul > li > a,
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #top nav > ul > li > a .menu-title-text,
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #top .sf-menu > li > a,
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #top .slide-out-widget-area-toggle a,
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #top #logo {color:#fff!important}
/* Once the hero passes, preserve navigation usability with a solid header. */
body.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer {
  position:fixed!important;top:0!important;background:#fff!important;
  box-shadow:0 3px 18px rgba(10,29,49,.11)!important;
}
body.admin-bar.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer{top:32px!important}
body.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer #top nav > ul > li > a,
body.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer #top nav > ul > li > a .menu-title-text,
body.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer #top #logo{color:#193753!important}
body.poh-transparent-hero-nav .poh-hero,
body.poh-transparent-hero-nav .poh-builders-hero,
body.poh-transparent-hero-nav .poh-cprofile-hero {margin-top:0!important}
body.poh-transparent-hero-nav .poh-cprofile-hero{height:100svh;min-height:590px}
body.poh-transparent-hero-nav .poh-cprofile-hero-inner{padding-top:clamp(115px,12vh,170px)}
body.poh-transparent-hero-nav .poh-builder-profile-hero{min-height:100svh}
@media(max-width:782px){body.admin-bar.poh-transparent-hero-nav #header-outer,body.admin-bar.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer{top:46px!important}}
@media(max-width:650px){body.poh-transparent-hero-nav .poh-cprofile-hero{min-height:530px;height:85svh}body.poh-transparent-hero-nav .poh-cprofile-hero-inner{padding-top:120px}}

/* v0.11.10: Salient can reserve a secondary-header strip even when the main header is overlaid. */
body.poh-transparent-hero-nav #header-secondary-outer {display:none!important;height:0!important;min-height:0!important;}
body.poh-transparent-hero-nav #ajax-content-wrap {padding-top:0!important;margin-top:0!important;}
/* The ordinary Salient logo is a blue image, so changing #logo color does not affect it.
   Render the existing raster/SVG logo white over the hero, then restore it on scroll. */
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #logo img,
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled) #header-outer #logo picture img {filter:grayscale(1) brightness(0) invert(1)!important;-webkit-filter:grayscale(1) brightness(0) invert(1)!important;}
body.poh-transparent-hero-nav.poh-hero-nav-scrolled #header-outer #logo img {filter:none!important;-webkit-filter:none!important;}

/* v0.13.35: Shorter contrast veil sits over the top of full-bleed Parade heroes, but
   below Salient's clickable header. It scrolls away with the page. */
body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled)::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:180px;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(7,21,43,.75) 0%,rgba(7,21,43,.30) 50%,rgba(7,21,43,0) 100%);
}
/* Salient owns the search overlay, hamburger and mobile-menu layers.
   Do not force header z-index or icon colors here. */
@media(max-width:767px){body.poh-transparent-hero-nav:not(.poh-hero-nav-scrolled)::before{height:160px;}}