/* ══════════════════════════════════════════════════
   MM-Thai Visa — mobile.css
   Extra responsive styles for subpages
   ══════════════════════════════════════════════════ */

/* PAGE COLS (two-column layout on subpages) */
@media (max-width: 900px) {
  .page-cols, .page-cols.wide {
    grid-template-columns: 1fr !important;
  }
  .page-sidebar { order: -1; }
  .sidebar-box { position: static !important; }
}

/* TOUCH TARGETS */
@media (max-width: 768px) {
  .btn-primary, .btn-white, .btn-ghost, .btn-whatsapp {
    min-height: 48px;
    padding: 0.9rem 1.4rem;
  }
  .sidebar-tel {
    min-height: 48px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.2rem; font-weight: 700;
    color: var(--blue-deep); text-decoration: none;
    display: block; text-align: center; margin-bottom: 0.4rem;
  }

  /* Forms */
  .form-row { grid-template-columns: 1fr !important; }
  input, select, textarea {
    font-size: 16px !important; /* prevents iOS zoom */
    min-height: 48px;
  }

  /* Content sections */
  .content-section { margin-bottom: 2rem; }
  .content-section h2 { font-size: 1.4rem !important; }
  .content-section h3 { font-size: 1.05rem; }
  .content-section p { font-size: 0.88rem; }

  /* Hero meta on subpages */
  .page-hero-meta { flex-direction: column; gap: 0.5rem; }

  /* Steps */
  .step-item { padding: 1rem; }

  /* Related grid */
  .related-grid { grid-template-columns: 1fr !important; }

  /* Trust bar - horizontal scroll */
  .trust-bar {
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }
  .trust-item { flex-shrink: 0; }
}

@media (max-width: 640px) {
  .hero-stats { gap: 1.5rem; justify-content: center; }
  .stat-num { font-size: 1.5rem; }
}

/* ── ADDITIONAL MOBILE FIXES (audit) ── */

/* Topbar: hide address on very small screens */
@media (max-width: 480px) {
  .topbar > div:first-child { display: none; }
  .topbar { justify-content: flex-end; }
}

/* Nav: ensure hamburger is large enough touch target */
@media (max-width: 1024px) {
  .hamburger {
    min-width: 44px;
    min-height: 44px;
  }
}

/* Hero: fix padding on very small screens */
@media (max-width: 400px) {
  .page-hero { padding: 2rem 1rem 1.5rem !important; }
  .page-hero h1 { font-size: 1.5rem !important; }
}

/* Tables / req-box: prevent horizontal overflow on mobile */
@media (max-width: 640px) {
  .req-box, .highlight-box, .warning-box {
    padding: 1rem;
    font-size: 0.85rem;
  }
  .sidebar-two-col {
    grid-template-columns: 1fr !important;
  }
}

/* CTA btns stacking handled in shared.css */

/* Footer single column handled in shared.css */

/* Office gallery on contact page */
@media (max-width: 480px) {
  .office-gallery { grid-template-columns: 1fr !important; }
}
