
/* =========================================================
   TREZO — MOBILE ONLY RESPONSIVE PATCH
   Desktop styles/layout/navigation are intentionally untouched.
   ========================================================= */
@media screen and (max-width: 767px) {
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }

  *, *::before, *::after {
    box-sizing: border-box;
  }

  img, video, iframe, svg, canvas {
    max-width: 100%;
    height: auto;
  }

  table {
    max-width: 100%;
  }

  input, textarea, select, button {
    max-width: 100%;
    min-width: 0;
  }

  /* Keep the existing mobile navigation above page content. */
  header, nav {
    position: relative;
    z-index: 1000;
  }

  /* Common existing mobile-menu states; no desktop selectors are changed. */
  .mobile-menu,
  .mobile-nav,
  .menu-mobile,
  .navbar-collapse,
  .nav-menu,
  .offcanvas,
  .offcanvas-menu {
    max-width: 100vw;
  }

  .mobile-menu.show,
  .mobile-menu.open,
  .mobile-nav.show,
  .mobile-nav.open,
  .menu-mobile.show,
  .navbar-collapse.show,
  .navbar-collapse.in,
  .offcanvas.show,
  .offcanvas.open,
  .offcanvas-menu.show {
    visibility: visible;
    opacity: 1;
  }

  /* Stop long menu labels from widening the viewport. */
  nav a,
  .mobile-menu a,
  .mobile-nav a,
  .navbar a {
    overflow-wrap: anywhere;
  }

  /* Prevent fixed-width page sections from causing sideways scrolling. */
  .container,
  .container-fluid,
  .wrapper,
  .content,
  main,
  section,
  .row {
    max-width: 100%;
  }
}

@media screen and (max-width: 480px) {
  input, textarea, select, button {
    max-width: 100%;
  }
}
