/* Utilities — shared cross-module helpers. */

/* No sideways scroll — clip anything that pokes past the viewport's right edge so the page can't
   be dragged horizontally (mobile). overflow-x only → vertical scrolling is untouched; carousels
   clip their own content internally, so they're unaffected. clip (sticky-safe) + hidden fallback. */
html,
body {
  overflow-x: hidden;
  overflow-x: clip;
}

/* The root guard above is NOT enough on its own. Divi puts an inline `overflow-y: hidden` on
   #page-container; per spec, when one axis is non-visible the other axis's `visible` computes to
   `auto` — so #page-container's overflow-x was silently `auto`, i.e. an INNER horizontal scroll
   container. A few px of sub-pixel/margin bleed (the Smash Balloon reviews carousel) then leaves
   it draggable ~9px on touch — a finger-swipe scrolls #page-container itself, which the html/body
   guard can't reach. Setting overflow-x: clip here computes to `hidden` (clip + non-visible-y →
   hidden), which blocks the user drag. Verified via a real touch-drag in Chrome + WebKit. */
#page-container {
  overflow-x: clip;
}

/* .fill-image — image covers its column; put on a Divi Image module alone in a column, or an <img>. */
.fill-image {
  width: 100%;
  height: 100%;
  align-self: stretch;
  object-fit: cover;
  object-position: center;
  max-width: none;
}
.fill-image .et_pb_image_wrap,
.fill-image > a,
.fill-image > span,
.fill-image picture {
  display: block !important;   /* beats Divi's ≤980px fit-content on the image wrap */
  width: 100% !important;
  height: 100%;
}
.fill-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  max-width: none;
}

/* Mobile menu (Divi Plus .pa-open-mobile-menu) — shared by header + footer navs. */
@media (max-width: 980px) {
  .pa-open-mobile-menu .et_pb_menu__menu {
    display: flex !important;
    flex-direction: column !important;
  }
  .pa-open-mobile-menu .et_mobile_nav_menu {
    display: none !important;
  }
}