/* =========================================================
   Homes2U Kadence mega menu unified pane effect
   Desktop only
   Full CSS using JS-tagged nav lists
========================================================= */

@media screen and (min-width: 1025px) {

  :root {
    --h2u-mega-bg: var(--global-palette8);
    --h2u-overlay-bg: rgba(0, 0, 0, 0.38);
    --h2u-header-transition: 180ms ease;
    --h2u-overlay-transition: 180ms ease;
    --h2u-link-transition: 160ms ease;
    --h2u-hover-bridge-height: 18px;
    --h2u-overlay-z: 9990;
    --h2u-header-z: 9992;
    --h2u-menu-z: 9993;
    --h2u-link-light: #ffffff;
    --h2u-link-light-hover: rgba(255, 255, 255, 0.82);
    --h2u-link-dark: var(--global-palette1);
    --h2u-link-dark-hover: #9f8241;
  }

  /* =======================================================
     HEADER STACKING
  ======================================================= */
  header.h2u-home-header.wp-block-kadence-header,
  header.wp-block-kadence-header {
    position: relative;
    z-index: var(--h2u-header-z);
  }

  header.h2u-home-header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container,
  header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container {
    position: relative;
    z-index: var(--h2u-header-z);
    transition:
      background-color var(--h2u-header-transition),
      box-shadow var(--h2u-header-transition),
      color var(--h2u-header-transition);
  }

  /* Keep the top utility row spacing */
  .wp-block-kadence-header-row-top {
    margin-bottom: 30px;
  }

  /* =======================================================
     HOME DEFAULT STATE
  ======================================================= */
  body.home header.h2u-home-header.wp-block-kadence-header,
  body.home header.h2u-home-header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container {
    background-color: transparent;
    transition:
      background-color var(--h2u-header-transition),
      box-shadow var(--h2u-header-transition),
      color var(--h2u-header-transition);
  }

  /* =======================================================
     OPEN STATE
     JS adds .h2u-mega-open to body
  ======================================================= */
  body.h2u-mega-open header.h2u-home-header.wp-block-kadence-header,
  body.h2u-mega-open header.h2u-home-header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container,
  body.h2u-mega-open header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container {
    background-color: var(--h2u-mega-bg) !important;
    box-shadow: none !important;
  }

  /* =======================================================
     MEGA MENU PARENT
  ======================================================= */
  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled {
    position: relative;
    z-index: var(--h2u-menu-z);
  }

  /* =======================================================
     MEGA MENU PANEL
  ======================================================= */
  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled > ul.sub-menu.kb-nav-sub-menu.mega-menu {
    position: absolute;
    top: 100%;
    background-color: var(--h2u-mega-bg) !important;
    margin-top: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
    z-index: var(--h2u-menu-z);
  }

  /* =======================================================
     HOVER BRIDGE
  ======================================================= */
  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: var(--h2u-hover-bridge-height);
    background: transparent;
    pointer-events: auto;
    z-index: var(--h2u-menu-z);
  }

  /* =======================================================
     OVERLAY
  ======================================================= */
  body::before {
    content: "";
    position: fixed;
    inset: 0;
    background: var(--h2u-overlay-bg);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
      opacity var(--h2u-overlay-transition),
      visibility var(--h2u-overlay-transition);
    z-index: var(--h2u-overlay-z);
  }

  body.h2u-mega-open::before {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  /* =======================================================
     KEEP HEADER + MENU ABOVE OVERLAY
  ======================================================= */
  header.h2u-home-header.wp-block-kadence-header,
  header.wp-block-kadence-header,
  .wp-block-kadence-header-desktop.kb-header-container,
  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled {
    position: relative;
  }

  header.h2u-home-header.wp-block-kadence-header,
  header.wp-block-kadence-header,
  .wp-block-kadence-header-desktop.kb-header-container {
    z-index: var(--h2u-header-z);
  }

  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled {
    z-index: var(--h2u-menu-z);
  }

  /* =======================================================
     DUAL LOGO
     Home default = white logo
     Home mega open = dark logo
     Internal = dark logo
  ======================================================= */
  .dual-logo-link {
    display: inline-flex;
    align-items: center;
    line-height: 0;
    vertical-align: middle;
    text-decoration: none;
  }

  .dual-logo {
    position: relative;
    display: block;
    width: 200px;
    height: 32px;
    overflow: visible;
  }

  .dual-logo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: left center;
    display: block;
    transition: opacity 0.2s ease;
  }

  .dual-logo .logo-white {
    opacity: 0;
  }

  .dual-logo .logo-black {
    opacity: 1;
  }

  body.home .dual-logo .logo-white {
    opacity: 1;
  }

  body.home .dual-logo .logo-black {
    opacity: 0;
  }

  body.home.h2u-mega-open .dual-logo .logo-white {
    opacity: 0;
  }

  body.home.h2u-mega-open .dual-logo .logo-black {
    opacity: 1;
  }

  /* =======================================================
     TOP UTILITY ROW BAR
     Restore the brown top bar itself
  ======================================================= */
  header.h2u-home-header .wp-block-kadence-header-row-top,
  header.wp-block-kadence-header .wp-block-kadence-header-row-top {
    background: var(--global-palette1) !important;
  }

  header.h2u-home-header .wp-block-kadence-header-row-top .site-header-row-container-inner,
  header.wp-block-kadence-header .wp-block-kadence-header-row-top .site-header-row-container-inner {
    background: var(--global-palette1) !important;
  }

  /* =======================================================
     TOP UTILITY NAV
     White on both home and internal pages
  ======================================================= */
  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > a.kb-nav-link-content,
  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn,
  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn .kb-nav-arrow-svg {
    color: var(--h2u-link-light) !important;
    fill: currentColor !important;
    transition: color var(--h2u-link-transition), fill var(--h2u-link-transition);
  }

  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > a.kb-nav-link-content:hover,
  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover {
    color: var(--h2u-link-light-hover) !important;
  }

  ul.kb-navigation.menu.h2u-top-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover .kb-nav-arrow-svg {
    fill: currentColor !important;
  }

  /* =======================================================
     MAIN NAV ON INTERNAL PAGES
  ======================================================= */
  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content,
  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn,
  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn .kb-nav-arrow-svg {
    color: var(--h2u-link-dark) !important;
    fill: currentColor !important;
    transition: color var(--h2u-link-transition), fill var(--h2u-link-transition);
  }

  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content:hover,
  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover {
    color: var(--h2u-link-dark-hover) !important;
  }

  body:not(.home) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover .kb-nav-arrow-svg {
    fill: currentColor !important;
  }

  /* =======================================================
     MAIN NAV ON HOME DEFAULT
  ======================================================= */
  body.home ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content,
  body.home ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn,
  body.home ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn .kb-nav-arrow-svg {
    color: var(--h2u-link-light) !important;
    fill: currentColor !important;
    transition: color var(--h2u-link-transition), fill var(--h2u-link-transition);
  }

  body.home:not(.h2u-mega-open) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content:hover,
  body.home:not(.h2u-mega-open) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover {
    color: var(--h2u-link-light-hover) !important;
  }

  body.home:not(.h2u-mega-open) ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover .kb-nav-arrow-svg {
    fill: currentColor !important;
  }

  /* =======================================================
     MAIN NAV ON HOME WHEN MEGA OPEN
  ======================================================= */
  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content,
  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn,
  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn .kb-nav-arrow-svg {
    color: var(--h2u-link-dark) !important;
    fill: currentColor !important;
  }

  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > a.kb-nav-link-content:hover,
  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover {
    color: var(--h2u-link-dark-hover) !important;
  }

  body.home.h2u-mega-open ul.kb-navigation.menu.h2u-main-nav-list > li > .kb-link-wrap > button.kb-nav-dropdown-toggle-btn:hover .kb-nav-arrow-svg {
    fill: currentColor !important;
  }

  /* =======================================================
     OPTIONAL CLEAN-UP
  ======================================================= */
  body.h2u-mega-open header.h2u-home-header.wp-block-kadence-header,
  body.h2u-mega-open header.h2u-home-header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container,
  body.h2u-mega-open header.wp-block-kadence-header .wp-block-kadence-header-desktop.kb-header-container,
  .kb-navigation.menu.h2u-main-nav-list > li.kadence-menu-mega-enabled > ul.sub-menu.kb-nav-sub-menu.mega-menu {
    box-shadow: none !important;
  }
}