/*
  Mobile Extreme Overrides
  ----------------------
  Purpose: a small set of safe, high-impact mobile fixes applied site-wide.
  Loaded after trumps.css so we can override legacy rules without fighting specificity.

  Goals:
  - Eliminate horizontal scroll (especially from sliders/carousels)
  - Ensure media never exceeds the viewport
  - Avoid iOS zoom-on-focus by keeping inputs >= 16px
  - Improve tap-target minimum sizing
*/

/* Cross-template overflow containment for decorative waves and media cards. */
.masthead--innerpage,
.image-text,
.image-text__img,
.image-buttons,
.image-button-flex,
.image-button-item,
.image-button,
.half-image-half-accordion__image {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

.masthead--innerpage__wave {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

.image-text__img img.object-fit,
.image-button img.object-fit {
  display: block;
  width: 100%;
  max-width: 100%;
}

.image-button {
  width: 100%;
  max-width: 292px;
}

@media (max-width: 767px) {
  /* Hard stop: never allow mobile pages to horizontally scroll */
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  /* Media should never push layout wider than the viewport */
  img,
  svg,
  video,
  iframe,
  canvas {
    max-width: 100%;
    height: auto;
  }

  /* Slick carousels: ensure the moving track is clipped by its container */
  .slick-slider,
  .slick-list {
    overflow: hidden !important;
    max-width: 100%;
  }

  /* SVG logo loader: avoid visible overlay flashes on mobile. */
  .logo-svg__preloader {
    display: none !important;
  }

  /* Mobile tap-target + iOS input zoom */
  input,
  select,
  textarea,
  button {
    font-size: 16px;
  }

  .btn,
  .button,
  button,
  input[type='submit'],
  input[type='button'],
  a.btn {
    min-height: 44px;
  }

  .image-button {
    height: auto;
    aspect-ratio: 292 / 266;
  }
}