/* ═══════════════════════════════════════════════════════════════════
   EIM Navigation Styles  —  mega-menu.css
   Targets: HFE (header-footer-elementor) Navigation Menu widget
   Brand: #292746 navy · #ff914d orange · Inter / Libre Baskerville
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Prevent horizontal overflow from Elementor header at ≤1024px ─ */
/* At tablet/mobile breakpoints the hidden desktop nav retains its   */
/* full width in the DOM, causing the body to expand to ~1400px.     */
body {
  max-width: 100%;
  overflow-x: hidden;
}

/* ─── Top-level nav link styling ──────────────────────────────────── */

nav.hfe-nav-menu__layout-horizontal a.hfe-menu-item {
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #292746;
  transition: color 0.2s;
}

nav.hfe-nav-menu__layout-horizontal a.hfe-menu-item:hover,
nav.hfe-nav-menu__layout-horizontal .current-menu-item > a.hfe-menu-item,
nav.hfe-nav-menu__layout-horizontal .current-menu-ancestor > a.hfe-menu-item {
  color: #ff914d;
}

/* ─── Standard dropdown: top accent ──────────────────────────────── */

nav.hfe-nav-menu__layout-horizontal .hfe-nav-menu > li > .sub-menu {
  border-top: 3px solid #ff914d;
}

/* ─── Standard dropdown sub-links ────────────────────────────────── */

nav.hfe-nav-menu__layout-horizontal .sub-menu a.hfe-sub-menu-item {
  font-family: "Inter", sans-serif;
  font-size: 13.5px;
  color: #292746;
  transition:
    color 0.15s,
    padding-left 0.15s;
}

nav.hfe-nav-menu__layout-horizontal .sub-menu a.hfe-sub-menu-item:hover {
  color: #ff914d;
  background-color: transparent;
}

/* ═══════════════════════════════════════════════════════════════════
   MEGA MENU  —  Desktop only (> 1024 px)
   ═══════════════════════════════════════════════════════════════════ */

@media (min-width: 1025px) {
  nav.hfe-nav-menu__layout-horizontal {
    position: relative !important;
    overflow: visible !important;
  }

  .eim-mega {
    position: relative !important;
  }

  .eim-mega::after {
    content: "";
    position: absolute;
    bottom: calc(-1 * var(--eim-bridge-gap, 25px));
    left: 0;
    right: 0;
    height: var(--eim-bridge-gap, 25px);
    background: transparent;
    pointer-events: auto;
  }

  .eim-mega > .sub-menu {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    top: var(--eim-header-bottom, 78px) !important;
    width: min(95vw, 760px) !important;
    z-index: 9999 !important;
    min-width: 0 !important;
    max-width: none !important;
    border-top: 3px solid #ff914d !important;
    background: #ffffff !important;
    box-shadow: 0 8px 32px rgba(41, 39, 70, 0.14) !important;
    border-radius: 0 !important;
    padding: 32px 40px 36px !important;
    pointer-events: none !important;
  }

  .eim-mega:hover > .sub-menu {
    pointer-events: auto !important;
  }

  .eim-mega--grid > .sub-menu {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 48px !important;
    row-gap: 0 !important;
  }

  .eim-mega--grid > .sub-menu > li.menu-item {
    display: block !important;
    border-bottom: 1px solid #f0eff6 !important;
  }

  .eim-mega--grid > .sub-menu > li.menu-item:last-child,
  .eim-mega--grid > .sub-menu > li.menu-item:nth-last-child(2) {
    border-bottom: none !important;
  }

  .eim-mega--sections > .sub-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    column-gap: 64px !important;
    row-gap: 16px !important;
    align-items: flex-start !important;
  }

  .eim-mega--sections > .sub-menu > li.menu-item {
    flex: 1 !important;
    display: block !important;
    border-bottom: none !important;
  }

  .eim-mega--sections > .sub-menu > li.eim-panel-header {
    flex: 0 0 100% !important;
    border-bottom: 1px solid #f0eff6 !important;
    padding-bottom: 12px !important;
  }

  .eim-mega--sections > .sub-menu > li.eim-panel-header > a.hfe-sub-menu-item {
    font-family: "Inter", sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #292746 !important;
    padding: 0 !important;
    display: inline-block !important;
    transition: color 0.2s !important;
  }

  .eim-mega--sections > .sub-menu > li.eim-panel-header > a.hfe-sub-menu-item:hover {
    color: #ff914d !important;
    background: transparent !important;
    padding-left: 0 !important;
  }

  .eim-section-head > a.hfe-sub-menu-item {
    font-family: "Libre Baskerville", serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #292746 !important;
    border-bottom: 2px solid #ff914d !important;
    padding: 0 0 8px 0 !important;
    margin-bottom: 8px !important;
    display: block !important;
    text-transform: none !important;
    transition: color 0.15s !important;
  }

  .eim-section-head > a.hfe-sub-menu-item:hover {
    color: #ff914d !important;
    background: transparent !important;
  }

  .eim-sub-expand > .hfe-has-submenu-container > a.hfe-sub-menu-item {
    font-family: "Libre Baskerville", serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #292746 !important;
    border-bottom: 2px solid #ff914d !important;
    padding: 0 0 8px 0 !important;
    margin-bottom: 8px !important;
    display: block !important;
    text-transform: none !important;
    transition: color 0.15s !important;
  }

  .eim-sub-expand > .hfe-has-submenu-container > a.hfe-sub-menu-item:hover {
    color: #ff914d !important;
    background: transparent !important;
  }

  .eim-sub-expand .hfe-menu-toggle {
    display: none !important;
  }

  .eim-mega--sections:hover > .sub-menu .eim-sub-expand > .sub-menu {
    position: static !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    border-radius: 0 !important;
  }

  .eim-mega--sections:hover > .sub-menu .eim-2col > .sub-menu {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
  }

  .eim-mega--sections > .sub-menu .eim-sub-expand > .sub-menu a.hfe-sub-menu-item {
    font-size: 13.5px !important;
    color: #6b6887 !important;
    padding: 6px 0 !important;
    border-bottom: none !important;
    transition: color 0.15s, padding-left 0.15s !important;
  }

  .eim-mega--sections > .sub-menu .eim-sub-expand > .sub-menu a.hfe-sub-menu-item:hover {
    color: #ff914d !important;
    padding-left: 6px !important;
    background: transparent !important;
  }

  .eim-mega--sections > .sub-menu .eim-sub-expand > .sub-menu li.menu-item {
    border-bottom: none !important;
  }

  .eim-dd {
    position: relative !important;
  }

  .eim-dd::after {
    content: "";
    position: absolute;
    bottom: calc(-1 * var(--eim-bridge-gap, 25px));
    left: 0;
    right: 0;
    height: var(--eim-bridge-gap, 25px);
    background: transparent;
    pointer-events: auto;
  }

  .eim-dd > .sub-menu {
    position: fixed !important;
    left: var(--eim-dd-left, auto) !important;
    top: var(--eim-header-bottom, 78px) !important;
    right: auto !important;
    transform: none !important;
    pointer-events: none !important;
  }

  .eim-dd:hover > .sub-menu {
    pointer-events: auto !important;
  }
}
/* End mega menu desktop-only */
