/* ── MOBILE LAYOUT FIXES ──
   Loaded last on every page so it wins over inline styles. */

/* Never let anything widen the page. `clip` (unlike `hidden`) doesn't turn
   html/body into scroll containers, so the sticky nav keeps working. */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
@supports (overflow: clip) {
  html, body { overflow-x: clip; }
}

@media (max-width: 768px) {
  /* Side-slide reveal animations start 40px off-screen; slide up instead */
  .reveal-left,
  .reveal-right { transform: translateY(24px); }
  .reveal-left.visible,
  .reveal-right.visible { transform: none; }

  /* Location pages: "Serving X Since 1987" / "Services in X" two-column block */
  div[style*="grid-template-columns:1fr 1fr;gap:48px"] {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  /* Grid/flex children default to min-width:auto, so one long word can push
     a column past the screen edge */
  [style*="display:grid"] > *,
  [style*="display:flex"] > * { min-width: 0; }
  p, li, h1, h2, h3 { overflow-wrap: break-word; }

  /* Top trust bar: stack into a tight list instead of a tall wrapped block */
  div[role="banner"][style*="background:#29a8c4"] {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 4px !important;
    padding: 8px 14px !important;
    text-align: center;
  }
  div[role="banner"][style*="background:#29a8c4"] > * {
    justify-content: center !important;
    line-height: 1.3;
  }
  div[role="banner"][style*="background:#29a8c4"] > span:nth-of-type(n+3) {
    display: none !important;
  }

  /* Hero: the generic `section` padding stacked on top of .hero-inner padding */
  .hero { padding: 0 !important; }
  .hero-inner { padding: 40px 20px 32px !important; }

  /* Location / service page heroes and full-width sections */
  section[style*="padding:72px 24px 64px"] { padding: 44px 20px 40px !important; }
  section[style*="padding:80px 24px"] { padding: 56px 20px !important; }
}
