/* R181: keep homepage/works media in the same compact carousel frame.
   Portrait samples stay inside the shared stage instead of growing the card. */
#selected.r86-selected [data-r78-stage] > .r86-card,
#portfolio-browser [data-r78-stage] > .r86-card {
  min-width: 0;
  width: 100%;
}

#selected.r86-selected [data-r78-stage] .r86-media,
#portfolio-browser [data-r78-stage] .r86-media {
  height: clamp(300px, 34vw, 460px);
  min-height: 0;
  display: grid;
  place-items: center;
  background: #191424;
}

#selected.r86-selected [data-r78-stage] .r86-media > .folio-media,
#selected.r86-selected [data-r78-stage] .r86-media > .r30-case-visual,
#portfolio-browser [data-r78-stage] .r86-media > .folio-media,
#portfolio-browser [data-r78-stage] .r86-media > .r30-case-visual {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  display: grid !important;
  place-items: center;
}

#selected.r86-selected [data-r78-stage] .r86-media > .folio-media > img,
#selected.r86-selected [data-r78-stage] .r86-media > .r30-case-visual > img,
#portfolio-browser [data-r78-stage] .r86-media > .folio-media > img,
#portfolio-browser [data-r78-stage] .r86-media > .r30-case-visual > img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
}

#selected.r86-selected [data-r78-stage] .r86-media > .folio-media > video,
#portfolio-browser [data-r78-stage] .r86-media > .folio-media > video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

@media (max-width: 760px) {
  #selected.r86-selected [data-r78-stage] .r86-media,
  #portfolio-browser [data-r78-stage] .r86-media {
    height: min(72vw, 360px);
  }
}