/* ClearPath Step 8N — larger hero + navigation login. */
.cp8n-layout{
  display:flex!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:none!important;
  gap:0!important;
  overflow:visible!important;
  position:relative!important;
}

/* Give more of the hero to the photography. */
.cp8n-copy{
  flex:0 0 34%!important;
  width:34%!important;
  max-width:34%!important;
  box-sizing:border-box!important;
  padding-left:max(4vw,38px)!important;
  padding-right:26px!important;
  position:relative!important;
  z-index:4!important;
}

.cp8n-image-branch{
  flex:0 0 66%!important;
  width:66%!important;
  max-width:66%!important;
  box-sizing:border-box!important;
  position:relative!important;
  overflow:visible!important;
  padding:0!important;
  margin:0!important;
  z-index:2!important;
}

.cp8n-image-branch .elementor-widget-image,
.cp8n-image-branch .elementor-widget-image .elementor-widget-container{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

.cp8n-image{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:675px!important;
  object-fit:cover!important;
  object-position:68% top!important;
  margin:0!important;
  border-radius:0 0 0 30px!important;
}

.cp8n-original-heading-widget{display:none!important;}

.cp8n-overlay{
  position:absolute!important;
  z-index:100!important;
  top:58px!important;
  left:calc(34% - 34px)!important;
  width:min(48%,680px)!important;
  box-sizing:border-box!important;
  padding:23px 30px 26px!important;
  margin:0!important;
  border-radius:18px!important;
  background:linear-gradient(90deg,rgba(7,39,51,.92) 0%,rgba(7,39,51,.80) 68%,rgba(7,39,51,.40) 100%)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.18)!important;
  pointer-events:none!important;
}

.cp8n-title{
  display:block!important;
  margin:0!important;
  padding:0!important;
  font-size:clamp(38px,3.45vw,61px)!important;
  line-height:1.0!important;
  letter-spacing:-1.6px!important;
  font-weight:800!important;
  font-family:inherit!important;
  text-shadow:0 2px 12px rgba(0,0,0,.28)!important;
}
.cp8n-title span{display:block!important;}
.cp8n-white{color:#fff!important;}
.cp8n-pink{color:#f02c78!important;margin-top:4px!important;}

.cp8n-feature{
  position:absolute!important;
  z-index:60!important;
  left:3%!important;
  bottom:-32px!important;
  width:94%!important;
  max-width:none!important;
  margin:0!important;
}

.cp8n-image-branch,
.cp8n-image-branch .elementor-element,
.cp8n-image-branch .elementor-widget-wrap,
.cp8n-layout{overflow:visible!important;}

/* Login / logout link appended to the existing teal navigation. */
.cp8n-login-link{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:36px!important;
  padding:8px 16px!important;
  margin-left:8px!important;
  border-radius:18px!important;
  background:#f02c78!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.25px!important;
  white-space:nowrap!important;
  box-shadow:0 4px 12px rgba(240,44,120,.22)!important;
  transition:transform .18s ease, box-shadow .18s ease!important;
}
.cp8n-login-link:hover,
.cp8n-login-link:focus{
  color:#fff!important;
  transform:translateY(-1px)!important;
  box-shadow:0 6px 16px rgba(240,44,120,.32)!important;
}
.cp8n-nav-host{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:wrap!important;
}

@media (max-width:1100px) and (min-width:901px){
  .cp8n-copy{flex-basis:36%!important;width:36%!important;max-width:36%!important;padding-left:28px!important;padding-right:20px!important;}
  .cp8n-image-branch{flex-basis:64%!important;width:64%!important;max-width:64%!important;}
  .cp8n-image{height:625px!important;object-position:70% top!important;}
  .cp8n-overlay{left:calc(36% - 24px)!important;top:42px!important;width:55%!important;padding:20px 24px 22px!important;}
  .cp8n-title{font-size:clamp(34px,4.1vw,51px)!important;}
}

@media (max-width:900px){
  .cp8n-layout{display:block!important;}
  .cp8n-copy,.cp8n-image-branch{width:100%!important;max-width:100%!important;flex:0 0 100%!important;}
  .cp8n-copy{padding-left:24px!important;padding-right:24px!important;}
  .cp8n-image-branch{margin-top:22px!important;}
  .cp8n-image{height:500px!important;object-position:center top!important;border-radius:18px!important;}
  .cp8n-overlay{top:auto!important;left:4%!important;bottom:82px!important;width:92%!important;padding:18px 20px!important;}
  .cp8n-title{font-size:clamp(32px,7vw,48px)!important;line-height:1.02!important;}
  .cp8n-feature{position:relative!important;left:auto!important;bottom:auto!important;width:94%!important;margin:-38px auto 0!important;}
  .cp8n-login-link{margin:5px 6px!important;padding:8px 14px!important;}
}

@media (max-width:600px){
  .cp8n-copy{padding-left:18px!important;padding-right:18px!important;}
  .cp8n-image{height:430px!important;}
  .cp8n-overlay{left:3%!important;bottom:72px!important;width:94%!important;padding:15px 16px!important;border-radius:14px!important;}
  .cp8n-title{font-size:clamp(28px,8.5vw,40px)!important;letter-spacing:-1px!important;}
}

/* Step 8N — fixed, predictable clearance for the actual site header/navigation.
   The previous auto-measurement was unreliable on this HostGator/Elementor stack. */
@media (min-width:901px){
  .cp8n-layout{
    margin-top:118px!important;
  }
}
@media (max-width:1100px) and (min-width:901px){
  .cp8n-layout{
    margin-top:104px!important;
  }
}

/* Keep common WordPress/Elementor header containers above the hero even when the
   theme uses absolute/sticky positioning or its own stacking context. */
header,
.site-header,
#masthead,
.elementor-location-header,
.elementor-location-header > .elementor-element,
header.elementor-section,
header .elementor-section,
nav,
.elementor-nav-menu--main,
.elementor-widget-nav-menu{
  position:relative!important;
  z-index:2147483000!important;
}

/* Ensure the hero itself cannot paint over the header. */
.cp8n-layout,
.cp8n-image-branch,
.cp8n-overlay,
.cp8n-feature{
  z-index:1!important;
}
.cp8n-overlay{z-index:20!important;}
.cp8n-feature{z-index:15!important;}


/* Step 8N — SAFE full-width teal navigation background.
   Do not stretch or recolor any page/content wrapper. The existing menu stays
   at its normal width; a pseudo-element paints teal behind it edge-to-edge. */
.cp8n-nav-bar{
  position:relative!important;
  z-index:2147483000!important;
  overflow:visible!important;
  isolation:isolate!important;
  background:transparent!important;
}
.cp8n-nav-bar::before{
  content:""!important;
  position:absolute!important;
  z-index:-1!important;
  top:0!important;
  bottom:0!important;
  left:50%!important;
  width:100vw!important;
  transform:translateX(-50%)!important;
  background:#087d86!important;
  pointer-events:none!important;
}
.cp8n-nav-bar ul,
.cp8n-nav-host{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  box-sizing:border-box!important;
}
.cp8n-nav-bar .menu-item,
.cp8n-nav-bar li{flex:0 0 auto!important;}
@media (max-width:900px){
  .cp8n-nav-bar ul,.cp8n-nav-host{flex-wrap:wrap!important;}
}

/* Keep the headline anchored near the left edge of the photo rather than centered. */
@media (min-width:1101px){
  .cp8n-overlay{
    left:calc(34% - 34px)!important;
    width:min(46%,650px)!important;
  }
}
