/* Phone layouts keep photographs and their captions in separate, readable rows. */
@media (max-width: 760px) {
  html body:is(.cinematic-interior, .sample-cinematic):is([data-page-type], .journal-cinematic, .journal-category-cinematic, .article-cinematic) main
  :is(.hero-visual, .sample-journeys-hero-visual, .growth-hero-visual) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 14px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body:is(.cinematic-interior, .sample-cinematic):is([data-page-type], .journal-cinematic, .journal-category-cinematic, .article-cinematic) main
  :is(.hero-visual, .sample-journeys-hero-visual, .growth-hero-visual)
  :is(.hero-card.hero-card-large, .hero-card.hero-card-small, .hero-stat) {
    position: static !important;
    inset: auto !important;
    display: block !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none !important;
    box-sizing: border-box;
  }

  html body:is(.cinematic-interior, .sample-cinematic):is([data-page-type], .journal-cinematic, .journal-category-cinematic, .article-cinematic) main
  :is(.hero-visual, .sample-journeys-hero-visual, .growth-hero-visual)
  :is(.hero-card.hero-card-large, .hero-card.hero-card-small) > img {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    transform: none !important;
    border: 0 !important;
  }

  /* The public inquiry component uses ID-scoped grid placement. */
  html body[data-page-type="inquire"] #inquiry-landing .hero-visual {
    gap: 14px !important;
    grid-template-rows: auto !important;
  }
  html body[data-page-type="inquire"] #inquiry-landing
  :is(.hero-card-large, .hero-card-small, .hero-stat) {
    grid-area: auto !important;
    position: static !important;
    align-self: start !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  /* Let editorial photographs keep their composition on narrow phones. */
  html body:is(.cinematic-interior, .sample-cinematic) main
  :is(.editorial-break-image, .reflection-band-media, .audience-image-figure) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  html body:is(.cinematic-interior, .sample-cinematic) main
  :is(.editorial-break, .reflection-band) :is(.editorial-break-image, .reflection-band-media) img,
  html body.cinematic-interior:is([data-page-type], .article-cinematic) main .audience-image-figure img {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
  }

  /* Reset the inherited desktop columns before sizing the city photographs. */
  html body.cinematic-interior[data-page-type="cities-hub"] main .city-atlas-visual,
  html body.cinematic-interior[data-page-type="heritage-journey"] main .audience-image-figure {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body.cinematic-interior[data-page-type="cities-hub"] main .city-atlas-panel img,
  html body.cinematic-interior[data-page-type="heritage-journey"] main .audience-image-figure img,
  html body.cinematic-interior[data-page-type] main .growth-image-figure img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
  }
}
