/* Equal portrait frames sized to the full LogicLevel screenshot. */
.collage-vita picture,
.collage-trigger picture,
.collage-logic picture,
.collage-scenes picture {
  height: auto;
  aspect-ratio: 591 / 1208;
}
.collage-vita picture img,
.collage-trigger picture img,
.collage-logic picture img,
.collage-scenes picture img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: top center;
}

/* Remove only the empty space above the Scenes logo; retain the lower content. */
.collage-logic picture,
.collage-scenes picture {
  aspect-ratio: 591 / 1117;
  align-items: start;
  padding: 0;
  border: 0;
  outline: .34rem solid var(--paper);
}
.collage-logic picture img,
.collage-scenes picture img {
  height: auto;
  max-height: none;
}
.collage-scenes picture img {
  transform: translateY(-6.25%);
}

/* Equal first-row frames, with TriggerScan starting above its results logo. */
.collage-vita,
.collage-trigger { align-self: start; gap: .6rem; }
.collage-vita picture,
.collage-trigger picture {
  display: block;
  position: relative;
  padding: 0;
  aspect-ratio: 591 / 1208;
  height: auto;
  overflow: hidden;
}
.collage-vita picture img,
.collage-trigger picture img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.collage-trigger picture { background: #fff; }
.collage-trigger picture img {
  height: auto;
  max-height: none;
  transform: translateY(-7%);
}

/* Keep the introduction at the top alongside the taller collage on desktop. */
@media (min-width: 1061px) {
  .home-hero .hero-layout { align-items: start; padding-top: clamp(2rem, 3vw, 3rem); }
}