html { overflow-x: hidden; }
img, svg, video { max-width: 100%; height: auto; }
.hero > *, .section-wrap > *, .artist-hero > *, .artist-section > * { min-width: 0; }

/* Keep the parent hub editorial, but reduce the amount of empty travel between
   useful choices on laptop and desktop screens. */
@media (min-width: 821px) {
  .hero { min-height: 560px; max-height: 740px; padding-top: 38px; padding-bottom: 42px; }
  .hero-illustration { width: min(100%, 360px); }
  .section-wrap { padding: 60px 8vw; }
  .campus-playlist { min-height: 172px; }
  .path-card { min-height: 222px; }
  .pujo-feature { padding-top: 26px; }
  .pujo-playlist { min-height: 205px; }
  .journal-section { padding-top: 60px; padding-bottom: 70px; }
  .journal-entry { min-height: 190px; }
  .submission-section { padding-top: 78px; padding-bottom: 80px; }
}

@media (max-width: 820px) {
  .site-header { position: relative; }
  .main-nav { overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; justify-content: flex-start; padding-bottom: 3px; }
  .main-nav::-webkit-scrollbar { display: none; }
  .main-nav a { min-height: 42px; display: inline-flex; align-items: center; flex: 0 0 auto; }
  .artist-local-nav a { min-height: 44px; display: inline-flex; align-items: center; }
}

@media (max-width: 520px) {
  .site-header { padding-right: 16px; padding-left: 16px; }
  .wordmark, .wordmark-lockup { min-width: 0; }
  .wordmark-title-en { font-size: 17px; letter-spacing: 1px; }
  .wordmark-bengali { font-size: 16px; }
  .main-nav { margin-right: -16px; margin-left: -16px; padding-right: 16px; padding-left: 16px; }
  .main-nav a { font-size: 10px; }
  .hero { padding-right: 18px; padding-left: 18px; }
  .hero h1 { font-size: clamp(48px, 16vw, 68px); overflow-wrap: anywhere; }
  .hero-actions .button, .hero-actions .text-link { width: 100%; justify-content: space-between; }
  .index-grid, .campus-playlist-grid, .path-grid { grid-template-columns: 1fr; }
  .index-grid > a { min-height: 52px; font-size: 12px; }
  .campus-playlist, .path-card { min-height: 0; }
  .search-form { align-items: stretch; height: auto; min-height: 52px; }
  .search-form button { min-width: 82px; }
  .filter-chip, .button, .text-link, .service-link { min-height: 44px; }
  .collection-row { padding-right: 54px; }
  .submission-copy h2 { font-size: clamp(43px, 14vw, 58px); }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer > *, .footer-links, .copyright { grid-column: 1; }
  .artist-hero h1 { font-size: clamp(44px, 14vw, 56px); overflow-wrap: anywhere; }
  .artist-promise li { grid-template-columns: 72px 1fr; }
  .artist-heading h2, .guide-copy h2, .explainer-intro h2, .quick-guides h2, .guide-offer-copy h2 { font-size: clamp(35px, 11vw, 48px); }
  .bengal-motif-rail { height: 22px; gap: 10px; opacity: .2; }
  .bengal-motif-rail .motif { width: 21px; height: 21px; }
  .section-wrap { padding-top: 50px; padding-bottom: 50px; }
  .pujo-feature { margin-right: 14px; margin-left: 14px; padding: 25px 17px 16px; box-shadow: 0 0 0 4px #e4dbcd; }
  .pujo-kali-row { grid-template-columns: 28px minmax(0, 1fr); }
  .pujo-kali-row > a { grid-column: 1 / -1; width: 100%; }
  .service-actions, .row-service-actions { width: 100%; }
  .service-actions > a, .row-service-actions > a { flex: 1 1 0; justify-content: space-between; }
}
