/* RT17 responsive hardening - intentionally conservative, loaded last. */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, svg { max-width: 100%; }
iframe { max-width: 100%; }
.kontak-maps-wrapper, .kontak-maps-wrapper iframe { width: 100% !important; }
.table-responsive { -webkit-overflow-scrolling: touch; }
.modal-dialog { max-width: calc(100vw - 24px); margin-left: auto; margin-right: auto; }

@media (max-width: 991.98px) {
  .navbar .container-lg { padding-left: 14px; padding-right: 14px; }
  .navbar-brand { min-width: 0; max-width: calc(100% - 64px); display: flex; align-items: center; gap: 8px; }
  .navbar-brand span { white-space: normal; line-height: 1.15; font-size: 1rem; }
  .navbar-logo { flex: 0 0 auto; width: 42px !important; height: 42px !important; object-fit: cover; }
  .navbar-collapse { margin-top: 10px; max-height: calc(100vh - 90px); overflow-y: auto; padding-bottom: 12px; }
  .navbar-nav .nav-link, .navbar-nav .btn-login { width: 100%; justify-content: flex-start; margin: 2px 0; }
  .kontak-grid { grid-template-columns: 1fr !important; }
  .kontak-card { min-width: 0; }
  .struktur-grid, .pengurus-grid, .galeri-grid { min-width: 0; }
}

@media (max-width: 767.98px) {
  .container, .container-lg, .container-md, .container-sm { padding-left: 14px; padding-right: 14px; }
  .kontak-maps-wrapper iframe { min-height: 280px !important; }
  .pengurus-header-premium, .kontak-header-premium { padding-left: 14px !important; padding-right: 14px !important; }
  .pengurus-header-title, .kontak-header-title { overflow-wrap: anywhere; }
  .pengurus-ketua-card { max-width: 100%; }
  .pengurus-card img, .pengurus-img-large, .member-card-image img { object-fit: cover; }
  .slider-image { width: 100%; height: auto; min-height: 220px; object-fit: cover; }
}

@media (max-width: 575.98px) {
  .navbar-brand span { font-size: .9rem; }
  .navbar-logo { width: 36px !important; height: 36px !important; }
  .kontak-maps-wrapper iframe { min-height: 250px !important; }
  .kontak-card-content, .card-body { overflow-wrap: anywhere; }
  .pengurus-header-title, .section-title { font-size: clamp(1.55rem, 8vw, 2.2rem) !important; }
  .pengurus-header-premium { padding-top: 72px !important; padding-bottom: 72px !important; }
}