/* GreenKey static navigation + off-canvas fix
   This file replaces the WordPress/Salient runtime menu behavior for the
   flat static export. The custom burger menu is isolated from the original
   #slide-out-widget-area to avoid the white blank panel issue. */

/* Desktop header dropdowns */
#header-outer header#top nav > ul.sf-menu li.menu-item-has-children { position: relative; }
#header-outer header#top nav > ul.sf-menu li.menu-item-has-children:hover > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu li.menu-item-has-children.sfHover > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu li.menu-item-has-children.open > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu li.menu-item-has-children:focus-within > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
#header-outer header#top nav > ul.sf-menu ul.sub-menu { z-index: 99999 !important; }
#header-outer header#top nav > ul.sf-menu > li > ul.sub-menu { top: 100%; }
#header-outer header#top nav > ul.sf-menu ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu ul.sub-menu li.menu-item-has-children.sfHover > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu ul.sub-menu li.menu-item-has-children.open > ul.sub-menu,
#header-outer header#top nav > ul.sf-menu ul.sub-menu li.menu-item-has-children:focus-within > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Keep hamburger white on hero/header */
.slide-out-widget-area-toggle.mobile-icon .lines-button:after,
.slide-out-widget-area-toggle.mobile-icon .lines,
.slide-out-widget-area-toggle.mobile-icon .lines:before,
.slide-out-widget-area-toggle.mobile-icon .lines:after {
  background-color: #fff !important;
}

html.gk-menu-lock,
body.gk-custom-menu-open {
  overflow: hidden !important;
  background: #1c3639 !important;
}

/* While the custom menu is open, completely hide the original Salient panel.
   This is the source of the white blank screen in the static export. */
body.gk-custom-menu-open #slide-out-widget-area,
body.gk-custom-menu-open #slide-out-widget-area-bg {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Dark canvas behind the shifted page */
#gk-static-menu-bg {
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: #003b31 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 2147480000 !important;
  transition: opacity .35s ease, visibility .35s ease !important;
}
body.gk-custom-menu-open #gk-static-menu-bg {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Shift the actual page/hero left like the live GreenKey menu */
.ocm-effect-wrap {
  transition: transform .75s cubic-bezier(.15,.2,.1,1) !important;
  will-change: transform;
}
body.gk-custom-menu-open .ocm-effect-wrap {
  position: relative !important;
  z-index: 2147480001 !important;
  transform: translateX(-47vw) !important;
}
body.gk-custom-menu-open .ocm-effect-wrap-inner,
body.gk-custom-menu-open #ajax-content-wrap {
  transform: none !important;
}

/* Right green navigation panel */
#gk-static-menu-panel {
  display: block !important;
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  width: 62vw !important;
  min-width: 62vw !important;
  max-width: none !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #003b31 !important;
  opacity: 1 !important;
  visibility: hidden !important;
  transform: translateX(100%) !important;
  transition: transform .75s cubic-bezier(.15,.2,.1,1), visibility .75s ease !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  z-index: 2147480003 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}
body.gk-custom-menu-open #gk-static-menu-panel {
  visibility: visible !important;
  transform: translateX(0) !important;
  pointer-events: auto !important;
}

#gk-static-menu-panel .gk-menu-close {
  display: flex !important;
  position: fixed !important;
  top: 52px !important;
  right: 5.3vw !important;
  width: 76px !important;
  height: 76px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #49a64d !important;
  color: #fff !important;
  cursor: pointer !important;
  opacity: 1 !important;
  z-index: 2147480006 !important;
  box-shadow: none !important;
  appearance: none !important;
}
#gk-static-menu-panel .gk-menu-close::before,
#gk-static-menu-panel .gk-menu-close::after {
  content: '' !important;
  position: absolute !important;
  width: 30px !important;
  height: 3px !important;
  background: #fff !important;
  border-radius: 3px !important;
}
#gk-static-menu-panel .gk-menu-close::before { transform: rotate(45deg) !important; }
#gk-static-menu-panel .gk-menu-close::after { transform: rotate(-45deg) !important; }

#gk-static-menu-panel .gk-menu-list-wrap {
  display: block !important;
  position: absolute !important;
  top: 50% !important;
  left: 36% !important;
  width: min(430px, 42%) !important;
  min-width: 330px !important;
  max-width: 460px !important;
  max-height: calc(100vh - 190px) !important;
  overflow: visible !important;
  transform: translateY(-50%) !important;
  z-index: 2147480005 !important;
}

#gk-static-menu-panel ul,
#gk-static-menu-panel li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#gk-static-menu-panel ul.menu > li {
  display: block !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  line-height: 1.25 !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#gk-static-menu-panel ul.menu > li > a {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  color: #f5fff9 !important;
  font-size: clamp(24px, 2.1vw, 32px) !important;
  line-height: 1.32 !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  text-decoration: none !important;
  white-space: normal !important;
  padding: 0 54px 0 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  text-indent: 0 !important;
}
#gk-static-menu-panel ul.menu > li.current-menu-item > a::after,
#gk-static-menu-panel ul.menu > li > a:hover::after {
  content: '' !important;
  display: block !important;
  width: 88px !important;
  height: 2px !important;
  background: #fff !important;
  margin-top: 6px !important;
}

#gk-static-menu-panel li.menu-item-has-children > ul.sub-menu {
  display: block !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 0 0 20px !important;
  opacity: 1 !important;
  visibility: visible !important;
  transition: max-height .3s ease, margin-top .3s ease !important;
}
#gk-static-menu-panel li.menu-item-has-children.open-submenu > ul.sub-menu {
  max-height: 900px !important;
  margin-top: 10px !important;
}
#gk-static-menu-panel ul.sub-menu li {
  margin: 8px 0 !important;
}
#gk-static-menu-panel ul.sub-menu li a {
  display: block !important;
  position: relative !important;
  color: rgba(245,255,249,.88) !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: normal !important;
  padding: 0 38px 0 0 !important;
}
#gk-static-menu-panel ul.sub-menu li a:hover {
  color: #fff !important;
}

.gk-ocm-arrow {
  display: block !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  width: 30px !important;
  height: 30px !important;
  transform: translateY(-50%) !important;
  cursor: pointer !important;
  color: #f5fff9 !important;
  z-index: 2 !important;
}
.gk-ocm-arrow::before,
.gk-ocm-arrow::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  width: 10px !important;
  height: 2px !important;
  background: currentColor !important;
  border-radius: 2px !important;
  transition: transform .25s ease !important;
}
.gk-ocm-arrow::before { right: 50%; transform: translateY(-50%) rotate(45deg); transform-origin: right center; }
.gk-ocm-arrow::after  { left: 50%;  transform: translateY(-50%) rotate(-45deg); transform-origin: left center; }
.open-submenu > a .gk-ocm-arrow::before { transform: translateY(-50%) rotate(-45deg); }
.open-submenu > a .gk-ocm-arrow::after  { transform: translateY(-50%) rotate(45deg); }

@media only screen and (max-width: 999px) {
  body.gk-custom-menu-open .ocm-effect-wrap { transform: translateX(-47vw) !important; }
  #gk-static-menu-panel {
    width: 62vw !important;
    min-width: 62vw !important;
  }
  #gk-static-menu-panel .gk-menu-list-wrap {
    left: 34% !important;
    width: 48% !important;
    min-width: 280px !important;
  }
  #gk-static-menu-panel ul.menu > li > a {
    font-size: clamp(24px, 3vw, 31px) !important;
  }
  #gk-static-menu-panel .gk-menu-close { right: 5vw !important; }
}
@media only screen and (max-width: 560px) {
  body.gk-custom-menu-open .ocm-effect-wrap { transform: translateX(-70vw) !important; }
  #gk-static-menu-panel {
    width: 88vw !important;
    min-width: 88vw !important;
  }
  #gk-static-menu-panel .gk-menu-list-wrap {
    left: 13vw !important;
    width: 72vw !important;
    min-width: 0 !important;
  }
  #gk-static-menu-panel ul.menu > li > a { font-size: 23px !important; }
  #gk-static-menu-panel .gk-menu-close {
    right: 28px !important;
    width: 62px !important;
    height: 62px !important;
  }
}


/* One-click burger fix: suppress every original WordPress off-canvas state unless our custom menu is open. */
body:not(.gk-custom-menu-open) #slide-out-widget-area,
body:not(.gk-custom-menu-open) #slide-out-widget-area-bg {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.gk-custom-menu-open {
  background: #1c3639 !important;
}

body.gk-custom-menu-open #gk-static-menu-bg,
body.gk-custom-menu-open #gk-static-menu-panel {
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

body.gk-custom-menu-open #gk-static-menu-panel,
body.gk-custom-menu-open #gk-static-menu-panel * {
  text-rendering: geometricPrecision;
}

/* Force the menu content into the right panel on the first click. */
body.gk-custom-menu-open #gk-static-menu-panel .gk-menu-list-wrap {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Prevent original Salient transformations from creating the first-click white page. */
body:not(.gk-custom-menu-open).material-ocm-open .ocm-effect-wrap,
body:not(.gk-custom-menu-open).material-ocm-open .ocm-effect-wrap-inner,
body:not(.gk-custom-menu-open).material-ocm-open #ajax-content-wrap {
  transform: none !important;
}

/* ==========================================================
   MOBILE HOME HERO FIX
   Purpose: match the live GreenKey mobile hero layout.
   Fixes the exported static version where the hero text became
   too narrow and started underneath/behind the logo.
   ========================================================== */
@media only screen and (max-width: 767px) {
  html,
  body {
    overflow-x: hidden !important;
  }

  /* Keep the first hero full-screen on mobile, like the live site. */
  body.home #hm-sec1,
  body.home #hm-sec1 .nectar-slider-wrap,
  body.home #nectar-slider-instance-1,
  body.home #nectar-slider-instance-1 .swiper-container,
  body.home #nectar-slider-instance-1 .swiper-wrapper,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 {
    min-height: 100svh !important;
    height: 100svh !important;
  }

  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .slide-bg-wrap,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .image-bg {
    min-height: 100svh !important;
    height: 100svh !important;
    background-size: cover !important;
    background-position: center center !important;
  }

  /* Override the exported slider content width/offset that was causing
     one-word-per-line wrapping on mobile. */
  body.home #hm-sec1 .swiper-slide.hm-sec1 > .container,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 > .container {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    transform: none !important;
  }

  body.home #hm-sec1 .swiper-slide.hm-sec1 .content,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .content {
    position: absolute !important;
    top: clamp(188px, 24svh, 230px) !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 26px !important;
    box-sizing: border-box !important;
    text-align: left !important;
    transform: none !important;
    -webkit-transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.home #hm-sec1 .content h1,
  body.home #hm-sec1 .content .ns-heading-el,
  body.home #nectar-slider-instance-1 .content h1.ns-heading-el {
    display: block !important;
    width: 100% !important;
    max-width: calc(100vw - 52px) !important;
    margin: 0 0 22px 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: clamp(38px, 10.8vw, 44px) !important;
    line-height: 1.18 !important;
    letter-spacing: -0.02em !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  body.home #hm-sec1 .content p,
  body.home #hm-sec1 .content p span,
  body.home #nectar-slider-instance-1 .content p,
  body.home #nectar-slider-instance-1 .content p span {
    display: block !important;
    width: 100% !important;
    max-width: calc(100vw - 52px) !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: clamp(20px, 5.7vw, 23px) !important;
    line-height: 1.43 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  /* Keep header elements above the hero and prevent the logo from covering
     the hero headline. */
  body.home #header-outer {
    z-index: 99999 !important;
  }

  body.home #header-outer #top #logo,
  body.home #header-outer #top #logo img,
  body.home #header-outer .slide-out-widget-area-toggle {
    position: relative !important;
    z-index: 100000 !important;
  }
}

@media only screen and (max-width: 374px) {
  body.home #hm-sec1 .swiper-slide.hm-sec1 .content,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .content {
    top: 178px !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  body.home #hm-sec1 .content h1,
  body.home #hm-sec1 .content .ns-heading-el,
  body.home #nectar-slider-instance-1 .content h1.ns-heading-el,
  body.home #hm-sec1 .content p,
  body.home #hm-sec1 .content p span,
  body.home #nectar-slider-instance-1 .content p,
  body.home #nectar-slider-instance-1 .content p span {
    max-width: calc(100vw - 44px) !important;
  }
}

/* ==========================================================
   REDMI / SMALL MOBILE HERO CROP FIX
   The exported slider was using oversized mobile text. On phones like
   Redmi K20 Pro this caused the paragraph to run beyond the visible hero.
   This final override keeps the live-site feel but makes the text fit on
   390px-wide mobile screens without cropping.
   ========================================================== */
@media only screen and (max-width: 430px) {
  body.home #hm-sec1,
  body.home #hm-sec1 .nectar-slider-wrap,
  body.home #nectar-slider-instance-1,
  body.home #nectar-slider-instance-1 .swiper-container,
  body.home #nectar-slider-instance-1 .swiper-wrapper,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 {
    min-height: 100svh !important;
    height: 100svh !important;
    overflow: hidden !important;
  }

  body.home #hm-sec1 .swiper-slide.hm-sec1 .content,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .content {
    top: clamp(156px, 20svh, 184px) !important;
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 26px !important;
    padding-right: 24px !important;
    overflow: visible !important;
  }

  body.home #hm-sec1 .content h1,
  body.home #hm-sec1 .content .ns-heading-el,
  body.home #nectar-slider-instance-1 .content h1.ns-heading-el {
    max-width: calc(100vw - 50px) !important;
    font-size: clamp(34px, 8.9vw, 38px) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.015em !important;
    margin-bottom: 22px !important;
  }

  body.home #hm-sec1 .content p,
  body.home #hm-sec1 .content p span,
  body.home #nectar-slider-instance-1 .content p,
  body.home #nectar-slider-instance-1 .content p span {
    max-width: calc(100vw - 50px) !important;
    font-size: clamp(17px, 4.65vw, 19px) !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }
}

@media only screen and (max-width: 430px) and (max-height: 760px) {
  body.home #hm-sec1 .swiper-slide.hm-sec1 .content,
  body.home #nectar-slider-instance-1 .swiper-slide.hm-sec1 .content {
    top: 140px !important;
  }

  body.home #hm-sec1 .content h1,
  body.home #hm-sec1 .content .ns-heading-el,
  body.home #nectar-slider-instance-1 .content h1.ns-heading-el {
    font-size: clamp(31px, 8.4vw, 35px) !important;
    line-height: 1.14 !important;
    margin-bottom: 16px !important;
  }

  body.home #hm-sec1 .content p,
  body.home #hm-sec1 .content p span,
  body.home #nectar-slider-instance-1 .content p,
  body.home #nectar-slider-instance-1 .content p span {
    font-size: clamp(16px, 4.3vw, 18px) !important;
    line-height: 1.38 !important;
  }
}

/* ==========================================================
   MOBILE STICKY NAV BANNER FIX
   Keeps the mobile logo/hamburger banner visible after scrolling,
   matching the live site behavior: transparent on the hero, white
   sticky banner after the user scrolls down.
   ========================================================== */
@media only screen and (max-width: 999px) {
  body:not(.gk-custom-menu-open) #header-outer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 2147479000 !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    transition: background-color .22s ease, box-shadow .22s ease, height .22s ease, padding .22s ease !important;
    will-change: background-color, box-shadow !important;
  }

  body:not(.gk-mobile-scrolled):not(.gk-force-white-header) #header-outer.transparent {
    background: transparent !important;
    box-shadow: none !important;
  }

  body.gk-mobile-scrolled #header-outer,
  body:not(.home) #header-outer,
  body.gk-force-white-header #header-outer,
  /* Also target .transparent class baked into the exported HTML – the live
     Salient JS would normally remove it on scroll, but the static export has
     no live JS so we must beat it with explicit selectors. */
  body.gk-mobile-scrolled #header-outer.transparent,
  body:not(.home) #header-outer.transparent,
  body.gk-force-white-header #header-outer.transparent {
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .08) !important;
    border-bottom: none !important;
  }

  body.gk-mobile-scrolled #header-outer,
  body.gk-mobile-scrolled #header-outer header#top,
  body.gk-mobile-scrolled #header-outer header#top .container,
  body.gk-mobile-scrolled #header-outer header#top .row,
  body:not(.home) #header-outer,
  body:not(.home) #header-outer header#top,
  body:not(.home) #header-outer header#top .container,
  body:not(.home) #header-outer header#top .row {
    min-height: 92px !important;
    height: 92px !important;
  }

  body.gk-mobile-scrolled #header-outer header#top,
  body:not(.home) #header-outer header#top {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body.gk-mobile-scrolled #header-outer header#top .container,
  body:not(.home) #header-outer header#top .container {
    display: flex !important;
    align-items: center !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  body.gk-mobile-scrolled #header-outer header#top .row,
  body:not(.home) #header-outer header#top .row {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
  }

  body.gk-mobile-scrolled #header-outer #logo,
  body:not(.home) #header-outer #logo {
    display: inline-flex !important;
    align-items: center !important;
    height: 70px !important;
    line-height: 70px !important;
  }

  body.gk-mobile-scrolled #header-outer #logo img.stnd,
  body:not(.home) #header-outer #logo img.stnd {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: 62px !important;
    max-height: 62px !important;
    width: auto !important;
  }

  body.gk-mobile-scrolled #header-outer #logo img.starting-logo,
  body:not(.home) #header-outer #logo img.starting-logo {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  body.gk-mobile-scrolled .slide-out-widget-area-toggle.mobile-icon,
  body:not(.home) .slide-out-widget-area-toggle.mobile-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    top: 50% !important;
    right: 27px !important;
    transform: translateY(-50%) !important;
    position: absolute !important;
  }

  body.gk-mobile-scrolled .slide-out-widget-area-toggle.mobile-icon .lines-button:after,
  body.gk-mobile-scrolled .slide-out-widget-area-toggle.mobile-icon .lines,
  body.gk-mobile-scrolled .slide-out-widget-area-toggle.mobile-icon .lines:before,
  body.gk-mobile-scrolled .slide-out-widget-area-toggle.mobile-icon .lines:after,
  body:not(.home) .slide-out-widget-area-toggle.mobile-icon .lines-button:after,
  body:not(.home) .slide-out-widget-area-toggle.mobile-icon .lines,
  body:not(.home) .slide-out-widget-area-toggle.mobile-icon .lines:before,
  body:not(.home) .slide-out-widget-area-toggle.mobile-icon .lines:after {
    background-color: #7b7b7b !important;
  }

  body.gk-mobile-scrolled #header-space,
  body:not(.home) #header-space {
    display: block !important;
    height: 92px !important;
  }
}

@media only screen and (max-width: 430px) {
  body.gk-mobile-scrolled #header-outer,
  body.gk-mobile-scrolled #header-outer header#top,
  body.gk-mobile-scrolled #header-outer header#top .container,
  body.gk-mobile-scrolled #header-outer header#top .row,
  body:not(.home) #header-outer,
  body:not(.home) #header-outer header#top,
  body:not(.home) #header-outer header#top .container,
  body:not(.home) #header-outer header#top .row {
    min-height: 90px !important;
    height: 90px !important;
  }

  body.gk-mobile-scrolled #header-outer #logo img.stnd,
  body:not(.home) #header-outer #logo img.stnd {
    height: 58px !important;
    max-height: 58px !important;
  }

  body.gk-mobile-scrolled #header-space,
  body:not(.home) #header-space {
    height: 90px !important;
  }
}

@media only screen and (max-width: 999px) {
  body.gk-mobile-scrolled #header-outer,
  body:not(.home) #header-outer {
    display: block !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* ==========================================================
   HARD MOBILE STICKY HEADER FIX
   A separate static header is injected by js/static-nav-fix.js.
   This avoids Salient/WordPress hiding the original header on scroll.
   ========================================================== */
#gk-mobile-sticky-header {
  display: none;
}

@media only screen and (max-width: 999px) {
  #gk-mobile-sticky-header {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 96px !important;
    min-height: 96px !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 28px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    color: #7b7b7b !important;
    box-shadow: 0 2px 14px rgba(0,0,0,.08) !important;
    transform: translateY(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: transform .22s ease, opacity .22s ease, visibility .22s ease !important;
    z-index: 2147482500 !important;
  }

  body.gk-mobile-scrolled:not(.gk-custom-menu-open) #gk-mobile-sticky-header,
  body:not(.home):not(.gk-custom-menu-open) #gk-mobile-sticky-header {
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-logo {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: 220px !important;
    height: 68px !important;
    text-decoration: none !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-logo img {
    display: block !important;
    height: 68px !important;
    max-height: 68px !important;
    width: auto !important;
    max-width: 220px !important;
    object-fit: contain !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-burger {
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-burger span,
  #gk-mobile-sticky-header .gk-mobile-sticky-burger span::before,
  #gk-mobile-sticky-header .gk-mobile-sticky-burger span::after {
    content: '' !important;
    display: block !important;
    width: 30px !important;
    height: 3px !important;
    border-radius: 2px !important;
    background: #8a8a8a !important;
    position: relative !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-burger span::before {
    position: absolute !important;
    top: -9px !important;
    left: 0 !important;
  }

  #gk-mobile-sticky-header .gk-mobile-sticky-burger span::after {
    position: absolute !important;
    top: 9px !important;
    left: 0 !important;
  }

  body.gk-mobile-scrolled #header-outer,
  body.gk-mobile-scrolled #header-outer.transparent {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

@media only screen and (max-width: 430px) {
  #gk-mobile-sticky-header {
    height: 92px !important;
    min-height: 92px !important;
    padding: 12px 24px !important;
  }
  #gk-mobile-sticky-header .gk-mobile-sticky-logo,
  #gk-mobile-sticky-header .gk-mobile-sticky-logo img {
    height: 64px !important;
    max-height: 64px !important;
  }
}

/* ==========================================================
   DESKTOP / WEB STICKY WHITE HEADER FIX
   Shows a clean white navigation banner after scrolling on desktop too.
   This is independent of the original WordPress/Salient sticky behavior,
   so it remains visible in the static export.
   ========================================================== */
#gk-desktop-sticky-header {
  display: none;
}

@media only screen and (min-width: 1000px) {
  #gk-desktop-sticky-header {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 96px !important;
    min-height: 96px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 46px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    box-shadow: 0 2px 18px rgba(0,0,0,.08) !important;
    transform: translateY(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: transform .24s ease, opacity .24s ease, visibility .24s ease !important;
    z-index: 2147482400 !important;
  }

  body.gk-desktop-scrolled:not(.gk-custom-menu-open) #gk-desktop-sticky-header,
  body:not(.home):not(.gk-custom-menu-open) #gk-desktop-sticky-header {
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1420px !important;
    height: 100% !important;
    margin: 0 auto !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-logo {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 230px !important;
    height: 78px !important;
    text-decoration: none !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-logo img {
    display: block !important;
    height: 72px !important;
    max-height: 72px !important;
    width: auto !important;
    max-width: 230px !important;
    object-fit: contain !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.sf-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li {
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav a {
    display: block !important;
    color: #0a3d33 !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: .01em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
    padding: 36px 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li.current-menu-item > a,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > a:hover {
    color: #49a64d !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 250px !important;
    padding: 14px 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 16px 35px rgba(0,0,0,.14) !important;
    border-radius: 0 0 10px 10px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(10px) !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
    z-index: 2147482501 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:hover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.sfHover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.open > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:focus-within > ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li {
    display: block !important;
    width: 100% !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu a {
    color: #0a3d33 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    padding: 11px 22px !important;
    white-space: normal !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu a:hover {
    color: #49a64d !important;
    background: rgba(73,166,77,.06) !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-burger {
    display: inline-flex !important;
    width: 42px !important;
    height: 42px !important;
    margin-left: 34px !important;
    border: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-burger span,
  #gk-desktop-sticky-header .gk-desktop-sticky-burger span::before,
  #gk-desktop-sticky-header .gk-desktop-sticky-burger span::after {
    content: '' !important;
    display: block !important;
    width: 29px !important;
    height: 3px !important;
    border-radius: 2px !important;
    background: #777777 !important;
    position: relative !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-burger span::before {
    position: absolute !important;
    top: -9px !important;
    left: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-burger span::after {
    position: absolute !important;
    top: 9px !important;
    left: 0 !important;
  }

  /* Hide the original exported header after scroll so it cannot disappear,
     overlap, or fight with the independent sticky header. */
  body.gk-desktop-scrolled:not(.gk-custom-menu-open) #header-outer {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1180px) {
  #gk-desktop-sticky-header {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.sf-menu {
    gap: 18px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-nav a {
    font-size: 13px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-logo img {
    height: 64px !important;
    max-height: 64px !important;
  }
}


/* ==========================================================
   DESKTOP STICKY HEADER MATCH FIX
   Rebuilds the desktop sticky header to match the live website:
   dark green top contact/logo bar + white navigation row + Step Inside CTA.
   This overrides the earlier simplified single white row.
   ========================================================== */
@media only screen and (min-width: 1000px) {
  #gk-desktop-sticky-header {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 184px !important;
    min-height: 184px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: transform .24s ease, opacity .24s ease, visibility .24s ease !important;
    z-index: 2147482400 !important;
  }

  body.gk-desktop-scrolled:not(.gk-custom-menu-open) #gk-desktop-sticky-header,
  body:not(.home):not(.gk-custom-menu-open) #gk-desktop-sticky-header {
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-inner {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-topbar {
    display: block !important;
    width: 100% !important;
    height: 88px !important;
    min-height: 88px !important;
    background: #0a3d33 !important;
    color: #ffffff !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-mainbar {
    display: block !important;
    width: 100% !important;
    height: 96px !important;
    min-height: 96px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 18px rgba(0, 0, 0, .08) !important;
  }

  #gk-desktop-sticky-header .gk-sticky-row-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 1440px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 34px !important;
    box-sizing: border-box !important;
  }

  #gk-desktop-sticky-header .gk-sticky-contact,
  #gk-desktop-sticky-header .gk-sticky-brand-links {
    display: flex !important;
    align-items: center !important;
    gap: 32px !important;
    min-width: 0 !important;
  }

  #gk-desktop-sticky-header .gk-sticky-contact a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: .01em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  #gk-desktop-sticky-header .gk-sticky-contact img {
    display: block !important;
    width: 23px !important;
    height: auto !important;
    max-height: 23px !important;
    object-fit: contain !important;
    filter: none !important;
  }

  #gk-desktop-sticky-header .gk-sticky-brand-links a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
  }

  #gk-desktop-sticky-header .gk-sticky-brand-links .gk-zoma-logo {
    height: 30px !important;
    width: auto !important;
    max-width: 150px !important;
    object-fit: contain !important;
    padding-right: 24px !important;
    margin-right: 4px !important;
    border-right: none !important;
  }

  #gk-desktop-sticky-header .gk-sticky-brand-links .gk-life-logo {
    height: 64px !important;
    width: auto !important;
    max-width: 185px !important;
    object-fit: contain !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-logo {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 160px !important;
    height: 78px !important;
    text-decoration: none !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-logo img {
    display: block !important;
    height: 70px !important;
    max-height: 70px !important;
    width: auto !important;
    max-width: 160px !important;
    object-fit: contain !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    padding: 0 22px !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.sf-menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li {
    display: block !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav a {
    display: block !important;
    color: #4f4f4f !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
    padding: 38px 0 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li.current-menu-item > a,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > a:hover {
    color: #0a3d33 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li.current-menu-item > a::after,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > a:hover::after {
    content: '' !important;
    display: block !important;
    height: 2px !important;
    background: #0a3d33 !important;
    margin-top: 8px !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 250px !important;
    padding: 14px 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 16px 35px rgba(0,0,0,.14) !important;
    border-radius: 0 0 10px 10px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(10px) !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
    z-index: 2147482501 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:hover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.sfHover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.open > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:focus-within > ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li {
    display: block !important;
    width: 100% !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu a {
    color: #0a3d33 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    padding: 11px 22px !important;
    white-space: normal !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu a:hover {
    color: #49a64d !important;
    background: rgba(73,166,77,.06) !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-step {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    min-width: 154px !important;
    height: 45px !important;
    padding: 0 27px !important;
    border-radius: 999px !important;
    background: #49a64d !important;
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-step::after {
    content: "\203A" !important;
    display: inline-block !important;
    margin-left: 12px !important;
    font-size: 24px !important;
    line-height: .8 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-burger {
    display: none !important;
  }
}

@media only screen and (min-width: 1000px) and (max-width: 1240px) {
  #gk-desktop-sticky-header .gk-sticky-row-inner {
    padding-left: 26px !important;
    padding-right: 26px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul.sf-menu {
    gap: 17px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-nav a {
    font-size: 14px !important;
  }
  #gk-desktop-sticky-header .gk-desktop-sticky-step {
    min-width: 135px !important;
    padding-left: 21px !important;
    padding-right: 21px !important;
  }
}


/* ==========================================================
   FINAL FIXES
   - Hide GreenKey4Life logo everywhere
   - Desktop sticky header appears only after scrolling
   - Desktop sticky dropdowns match the live green dropdown
   - Remove dropdown gap
   ========================================================== */

a[href*="greenkey4life.com"],
img[src*="Greenkey-For-Life"],
img[srcset*="Greenkey-For-Life"],
.gk-life-logo {
  display: none !important;
  visibility: hidden !important;
}

.img-with-aniamtion-wrap:has(a[href*="greenkey4life.com"]),
.img-with-animation-wrap:has(a[href*="greenkey4life.com"]),
.img-with-aniamtion-wrap:has(img[src*="Greenkey-For-Life"]),
.img-with-animation-wrap:has(img[src*="Greenkey-For-Life"]) {
  display: none !important;
}

@media only screen and (min-width: 1000px) {
  html:not(.gk-desktop-sticky-visible) body #gk-desktop-sticky-header {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(-100%) !important;
  }

  html.gk-desktop-sticky-visible body #gk-desktop-sticky-header {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > a,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu a {
    font-weight: 500 !important;
  }

  #gk-desktop-sticky-header,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul {
    overflow: visible !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li {
    position: relative !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu {
    display: block !important;
    position: absolute !important;
    top: calc(100% - 1px) !important;
    left: 0 !important;
    width: 295px !important;
    min-width: 295px !important;
    padding: 22px 0 !important;
    margin: 0 !important;
    list-style: none !important;
    background: #4fa34f !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;
    transition: opacity .18s ease, visibility .18s ease !important;
    z-index: 999999 !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li:hover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:hover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.sfHover > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li.open > ul.sub-menu,
  #gk-desktop-sticky-header .gk-desktop-sticky-nav li:focus-within > ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li a {
    display: block !important;
    width: 100% !important;
    padding: 12px 26px !important;
    color: #ffffff !important;
    background: transparent !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
  }

  #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li a:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
  }
}

@media only screen and (max-width: 999px) {
  #gk-desktop-sticky-header {
    display: none !important;
  }
}


/* =========================================================
   ABSOLUTE FINAL DROPDOWN FIX
   - Removes mojibake mojibake arrow problem by using CSS unicode escape
   - 2nd level child dropdown opens to the RIGHT, not inside the same box
   - Current/active child is highlighted only when actual exact page/hash matches
   - Applies to original transparent header and custom white sticky header
========================================================= */
@media only screen and (min-width: 1000px) {

  /* Keep nav/dropdown containers unclipped */
  body #header-outer,
  body #header-outer header#top,
  body #header-outer header#top nav,
  body #header-outer header#top nav > ul,
  body #gk-desktop-sticky-header,
  body #gk-desktop-sticky-header .gk-sticky-navrow,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul {
    overflow: visible !important;
  }

  /* Parent LI positioning */
  body #header-outer header#top nav ul li,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul li {
    position: relative !important;
  }

  /* Base dropdown state */
  body #header-outer header#top nav ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu {
    display: block !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 300px !important;
    min-width: 300px !important;
    background: #4fa34f !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: none !important;
    transition: none !important;
    z-index: 2147483000 !important;
  }

  /* First level dropdown: directly below the nav item */
  body #header-outer header#top nav > ul > li > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav > ul > li > ul.sub-menu {
    position: absolute !important;
    top: calc(100% - 1px) !important;
    left: 0 !important;
  }

  /* Nested dropdown: open to the right side of its parent item */
  body #header-outer header#top nav ul.sub-menu li > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li > ul.sub-menu {
    position: absolute !important;
    top: 0 !important;
    left: 100% !important;
    right: auto !important;
  }

  /* Show first and nested dropdowns on real hover/focus/open classes */
  body #header-outer header#top nav li:hover > ul.sub-menu,
  body #header-outer header#top nav li.sfHover > ul.sub-menu,
  body #header-outer header#top nav li.open > ul.sub-menu,
  body #header-outer header#top nav li:focus-within > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav li:hover > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav li.sfHover > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav li.open > ul.sub-menu,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav li:focus-within > ul.sub-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  /* Dropdown rows */
  body #header-outer header#top nav ul.sub-menu li,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li {
    display: block !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #4fa34f !important;
  }

  /* Dropdown links */
  body #header-outer header#top nav ul.sub-menu li > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li > a {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding: 14px 46px 14px 22px !important;
    margin: 0 !important;
    color: #ffffff !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    white-space: normal !important;
  }

  /* Reset wrong WP/Salient active states inside dropdowns.
     This prevents "Our Team" from looking active when only About Us is hovered/open. */
  body #header-outer header#top nav ul.sub-menu li.current-menu-item > a,
  body #header-outer header#top nav ul.sub-menu li.current_page_item > a,
  body #header-outer header#top nav ul.sub-menu li.current-menu-ancestor > a,
  body #header-outer header#top nav ul.sub-menu li.current_page_ancestor > a,
  body #header-outer header#top nav ul.sub-menu li.current-menu-parent > a,
  body #header-outer header#top nav ul.sub-menu li.sfHover > a,
  body #header-outer header#top nav ul.sub-menu li.open > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.current-menu-item > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.current_page_item > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.current-menu-ancestor > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.current_page_ancestor > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.current-menu-parent > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.sfHover > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.open > a {
    background: transparent !important;
    color: #ffffff !important;
  }

  /* Only actual hover or exact current page gets dark green */
  body #header-outer header#top nav ul.sub-menu li:hover > a,
  body #header-outer header#top nav ul.sub-menu li.gk-current-page > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li:hover > a,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.gk-current-page > a {
    background: #003c2f !important;
    color: #ffffff !important;
  }

  /* Remove any old broken textual arrows from links */
  body #header-outer header#top nav ul.sub-menu li > a .sf-sub-indicator,
  body #header-outer header#top nav ul.sub-menu li > a .ocm-dropdown-arrow,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li > a .sf-sub-indicator,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li > a .ocm-dropdown-arrow {
    display: none !important;
  }

  /* Arrow ONLY when the dropdown item actually has children.
     Unicode escape avoids the  / aE mojibake issue. */
  body #header-outer header#top nav ul.sub-menu li.menu-item-has-children > a::after,
  body #header-outer header#top nav ul.sub-menu li:has(> ul.sub-menu) > a::after,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li.menu-item-has-children > a::after,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li:has(> ul.sub-menu) > a::after {
    content: "\203A" !important;
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #ffffff !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 22px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
  }

  /* Make sure non-parent items have no arrow */
  body #header-outer header#top nav ul.sub-menu li:not(.menu-item-has-children) > a::after,
  body #gk-desktop-sticky-header .gk-desktop-sticky-nav ul.sub-menu li:not(.menu-item-has-children) > a::after {
    content: none !important;
  }

  /* Sticky Step Inside arrow also uses unicode escape, no mojibake */
  body #gk-desktop-sticky-header .gk-desktop-sticky-step::after {
    content: "\203A" !important;
  }
}