/* mp-fixes.css
   Purpose:
   - Prevent horizontal "page wiggle" on mobile
   - Ensure full-bleed/parallax elements don't create overflow
   - Adjust active link style (HOME) to color-only
*/

html, body { width: 100%; overflow-x: hidden; }
body { position: relative; }

/* If any section uses 100vw, it can cause overflow due to scrollbar width. */
*[style*="100vw"], [class*="vw"] { max-width: 100%; }

/* Media should never exceed container */
img, video, iframe, svg { max-width: 100%; height: auto; }

/* Guard wrapper(s) */
#mpxIndex, #mpxIndex .mpx-wrap { overflow-x: hidden; }

/* Safer parallax positioning on small screens */
@media (max-width: 575.98px){
  #mpxIndex .mpx-event-hero .mpx-event-media { inset: 0 !important; }
  #mpxIndex .mpx-event-hero .mpx-event-shade { inset: 0 !important; }
}

/* Active menu item: remove border/background; keep accent color */
.mp-modern-header .mp-menu-item.mp-active > .mp-menu-link{
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--mp-accent) !important;
}

/* If any container/row causes overflow due to negative margins, clip within sections */
#mpxIndex section, #mpxIndex .mpx-section { overflow: hidden; }

/* Owl stage sometimes triggers overflow in edge cases */
.owl-stage-outer { overflow: hidden; }