/* =========================================================
   LEXIUM — Mobile & Responsive Fixes
   ---------------------------------------------------------
   Loaded on every page right after the base stylesheet.
   Additive, low-risk rules only. Does NOT change the
   desktop design — every rule is either a small-screen
   override or a harmless safety net.
   ========================================================= */

/* 1) iOS Safari auto-zoom fix.
      Safari zooms the whole page whenever a focused input has a
      font-size below 16px. Forcing 16px on phones stops that. */
@media (max-width: 768px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* 2) Safety net: media never overflows its container. */
img,
video {
  max-width: 100%;
  height: auto;
}

/* 3) Wide tables (policy pages) scroll horizontally on phones
      instead of stretching the layout. */
@media (max-width: 600px) {
  table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* 4) Readability floor for small body copy on phones.
      Decorative eyebrow / section labels are intentionally
      left small, so they are not targeted here. */
@media (max-width: 600px) {
  .practice-item p,
  .footer-col p,
  .footer-col a,
  .form-note {
    font-size: 13px;
  }
}

/* 5) Comfortable 44px tap targets for primary touch controls. */
@media (max-width: 768px) {
  .portal-btn,
  .btn-primary,
  .btn-outline-white,
  .btn-outline-dark,
  .lang-btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .nav-links.open a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
}