/* Mobile-only layout fixes: desktop styles remain unchanged. */
@media (max-width: 768px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  *, *::before, *::after { box-sizing: border-box; }
  img, video, iframe { max-width: 100%; height: auto; }
  .container, .wrapper, .content, .main, .page-container {
    max-width: 100%;
  }
  table { display: block; width: 100%; overflow-x: auto; }
  pre, code { max-width: 100%; overflow-x: auto; }
  .row { margin-left: 0; margin-right: 0; }
  [class*="col-"] { max-width: 100%; }
}
@media (max-width: 576px) {
  .container, .wrapper, .content, .main, .page-container {
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
  }
  h1 { font-size: clamp(24px, 7vw, 36px); }
  h2 { font-size: clamp(21px, 6vw, 30px); }
  h3 { font-size: clamp(18px, 5vw, 25px); }
  input, select, textarea, button { max-width: 100%; }
}