/* The site's existing hero, overlay, type and controls remain the common components. */
.band-detail-page .page-hero,
.band-detail-page .section,
.band-detail-page .cta-band,
.band-detail-page .footer-grid,
.band-detail-page .footer-bottom,
.band-detail-page .band-return {
  width: calc(100% - 48px);
  max-width: var(--content);
  margin-left: auto;
  margin-right: auto;
}
.band-detail-page .section,
.band-detail-page .cta-band,
.band-detail-page .footer-grid,
.band-detail-page .footer-bottom,
.band-detail-page .band-return {
  padding-left: 24px;
  padding-right: 24px;
}
.band-detail-page .band-return { margin-top: 24px; margin-bottom: 32px; }
.band-detail-page .page-title .title-line > span { display: inline-block; white-space: nowrap; }
.band-detail-page .video-embed { border-color: var(--orange); width: 100%; max-width: var(--video-poster-width, 1280px); margin-inline: 0 auto; }
.band-detail-page .band-video-grid > article { min-width: 0; }
.artists-page #kapely { scroll-margin-top: 100px; }
@media (max-width: 680px) {
  .band-detail-page .page-hero,
  .band-detail-page .section,
  .band-detail-page .cta-band,
  .band-detail-page .footer-grid,
  .band-detail-page .footer-bottom {
    width: 100%;
  }
  .band-detail-page .band-return {
    width: 100%;
    margin-top: 0;
    margin-bottom: 8px;
  }
  /* Text and photograph occupy independent rows, regardless of image ratio. */
  .band-detail-page .page-hero {
    display: flex;
    flex-direction: column;
    height: auto;
    min-width: 0;
    padding: 0 16px 24px;
    overflow: visible;
  }
  .band-detail-page .hero-intro {
    order: 1;
    width: 100%;
    min-width: 0;
    padding: 28px 0 24px;
  }
  .band-detail-page .page-overlay { display: none; }
  .band-detail-page .page-hero-photo {
    position: static;
    inset: auto;
    order: 2;
    width: 100%;
    height: auto;
    opacity: 1;
    object-fit: contain;
    object-position: center;
  }
  .artists-page #kapely { scroll-margin-top: 88px; }
}
