
/* =========================================================
   ELCHPOWER V5.3.5 – UNIFIED MOBILE MENU
   Same mobile header/menu on every page.
   ========================================================= */

@media (max-width:979px) {
  /* Never show page-specific dev ribbons on mobile */
  .dev-banner {
    display:none !important;
  }

  /* identical mobile header everywhere */
  .site-header {
    width:100% !important;
    height:148px !important;
    min-height:148px !important;
    padding:0 26px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    border-bottom:1px solid rgba(213,170,80,.18) !important;
    background:#06140d !important;
    position:relative !important;
    top:auto !important;
    z-index:120 !important;
  }

  .site-header .brand {
    display:flex !important;
    align-items:center !important;
    position:relative !important;
    z-index:122 !important;
  }

  .site-header .brand img {
    width:112px !important;
    height:112px !important;
    object-fit:contain !important;
  }

  .menu-button {
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:116px !important;
    height:58px !important;
    padding:0 24px !important;
    border:1px solid rgba(213,170,80,.26) !important;
    border-radius:999px !important;
    background:rgba(7,20,13,.92) !important;
    color:#d6ddd8 !important;
    font:inherit !important;
    font-size:1.02rem !important;
    font-weight:500 !important;
    cursor:pointer !important;
    position:relative !important;
    z-index:122 !important;
  }

  .menu-button[aria-expanded="true"] {
    color:#e5d6ad !important;
    border-color:rgba(213,170,80,.42) !important;
    background:rgba(213,170,80,.045) !important;
  }

  /* closed state */
  .main-nav {
    display:none !important;
  }

  /* open state: same card on every page */
  .main-nav.mobile-open,
  .main-nav.is-open,
  .menu-open .main-nav,
  .site-header.menu-open .main-nav {
    display:flex !important;
    position:absolute !important;
    top:calc(100% + 1px) !important;
    left:20px !important;
    right:20px !important;
    width:auto !important;
    height:auto !important;
    min-height:0 !important;
    padding:20px 28px 24px !important;
    margin:0 !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:0 !important;
    border:1px solid rgba(213,170,80,.20) !important;
    border-radius:24px !important;
    background:#06140d !important;
    box-shadow:0 18px 40px rgba(0,0,0,.22) !important;
    z-index:121 !important;
    overflow:visible !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
  }

  .main-nav.mobile-open a,
  .main-nav.is-open a,
  .menu-open .main-nav a,
  .site-header.menu-open .main-nav a {
    width:100% !important;
    min-height:72px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    padding:0 14px !important;
    margin:0 !important;
    border:0 !important;
    border-bottom:1px solid rgba(243,240,230,.035) !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#8d9992 !important;
    font-size:1.05rem !important;
    font-weight:450 !important;
    line-height:1.2 !important;
    text-align:left !important;
    white-space:normal !important;
  }

  .main-nav.mobile-open a:last-child,
  .main-nav.is-open a:last-child,
  .menu-open .main-nav a:last-child,
  .site-header.menu-open .main-nav a:last-child {
    margin-top:14px !important;
    min-height:58px !important;
    border:1px solid rgba(213,170,80,.18) !important;
    border-radius:14px !important;
    color:#9ca8a1 !important;
  }

  .main-nav.mobile-open a.active-page,
  .main-nav.is-open a.active-page,
  .menu-open .main-nav a.active-page,
  .site-header.menu-open .main-nav a.active-page {
    color:#e3d5ae !important;
  }

  .main-nav.mobile-open a:hover,
  .main-nav.is-open a:hover,
  .menu-open .main-nav a:hover,
  .site-header.menu-open .main-nav a:hover {
    color:#d5aa50 !important;
  }

  /* prevent any old menu rules from introducing huge gaps */
  .main-nav a::before,
  .main-nav a::after {
    display:none !important;
  }
}

@media (max-width:480px) {
  .site-header {
    height:142px !important;
    min-height:142px !important;
    padding:0 22px !important;
  }

  .site-header .brand img {
    width:104px !important;
    height:104px !important;
  }

  .menu-button {
    min-width:108px !important;
    height:56px !important;
    padding:0 20px !important;
    font-size:1rem !important;
  }

  .main-nav.mobile-open,
  .main-nav.is-open,
  .menu-open .main-nav,
  .site-header.menu-open .main-nav {
    left:18px !important;
    right:18px !important;
    padding:18px 24px 22px !important;
  }

  .main-nav.mobile-open a,
  .main-nav.is-open a,
  .menu-open .main-nav a,
  .site-header.menu-open .main-nav a {
    min-height:68px !important;
    font-size:1rem !important;
  }
}
