/* ---------- Header & Mobile Menu ---------- */

/* Header height variable (adjust if your header is taller) */
:root {
  --header-height: 70px;
}

/* Sticky header */
.main-header-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--header-height);
  z-index: 9999;
  background-color: rgba(255,255,255,0.95);
  transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
  display: flex;
  align-items: center;
}

/* ensure page content doesn't hide under fixed header */
body {
  padding-top: var(--header-height);
}

/* shadow when scrolled */
body.scrolled .main-header-bar {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* Desktop menu link styles */
.main-header-menu li a {
  color: #000;
  padding: 8px 6px;
  transition: all 0.3s ease;
}
.main-header-menu li a:hover {
  background-color: rgba(0,0,255,0.6);
  color: #fff !important;
  border-radius: 4px;
}

/* Industries list */
.industries-list ul { list-style: none; padding-left:0; margin-top:10px; }
.industries-list ul li { position:relative; padding-left:28px; margin-bottom:10px; font-size:16px; line-height:1.6; }
.industries-list ul li::before { content: "✔"; position:absolute; left:0; top:0; color:#28a745; font-weight:bold; }
.industries-list ul li:hover { color:#333; transform:translateX(3px); transition:all 0.2s ease-in-out; }

/* ---------- Mobile-specific (<=921px) ---------- */
@media (max-width: 921px) {

  /* Keep any builtin mobile header wrapper visually under the sticky header
     BUT only make it fixed when our menu is open (class added by JS) */
  .ast-mobile-header-wrap {
    position: absolute;   /* default: do not force fixed unless menu open */
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9998;
    background-color: rgba(255,255,255,0.95);
  }

  /* When our menu is open, make the mobile wrap fixed and sit below header */
  body.my-mobile-open .ast-mobile-header-wrap {
    position: fixed !important;
    top: var(--header-height);
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9998;
    -webkit-overflow-scrolling: touch;
  }

  /* Prevent page jump when the theme adds a class for active mobile state */
  .ast-header-break-point.ast-header-break-point-active {
    overflow: hidden;
  }

  /* Ensure menu items stay readable */
  .ast-mobile-header-wrap .main-header-menu a,
  .ast-mobile-header-wrap .menu-item a {
    color: #000;
    display: block;
    padding: 12px 16px;
  }
}
