/* AMPC's portrait film keeps its original frame. These rules affect only this case study. */
.ampc-project-page .ampc-showreel {
  aspect-ratio: 9 / 16;
  background: #000;
}

.ampc-project-page .ampc-showreel video {
  object-fit: contain;
}

.ampc-project-page .ampc-collage {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  aspect-ratio: 16 / 10;
  background: #000;
}

.ampc-project-page .ampc-collage img {
  display: block;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ampc-project-page .ampc-collage__portrait {
  object-position: center 42%;
}

.ampc-project-page .ampc-collage__orange {
  object-position: center bottom;
}

.ampc-project-page .ampc-collage__new-york {
  object-position: center 42%;
}

.ampc-project-page .ampc-motion {
  aspect-ratio: 3 / 2;
  background: #000;
}

.ampc-project-page .ampc-motion video {
  object-fit: contain;
}

.ampc-project-page .ampc-motion--abstract video {
  object-fit: cover;
  object-position: center;
}

@media (min-width: 981px) {
  .ampc-project-page .project-case-info { grid-column: 1; grid-row: 1; }
  .ampc-project-page .ampc-venue { grid-column: 1; grid-row: 2; }
  .ampc-project-page .ampc-collage { grid-column: 1; grid-row: 3; }
  .ampc-project-page .ampc-showreel { grid-column: 2; grid-row: 1 / span 3; }
}

@media (min-width: 768px) and (max-width: 980px) {
  .ampc-project-page .project-case-info { grid-column: 1; grid-row: 1; }
  .ampc-project-page .ampc-venue { grid-column: 1; grid-row: 2; }
  .ampc-project-page .ampc-showreel { grid-column: 2; grid-row: 1 / span 2; }
  .ampc-project-page .ampc-collage { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  .ampc-project-page .ampc-collage { aspect-ratio: 1; }
  .ampc-project-page .ampc-motion--logo { aspect-ratio: 16 / 9; }
  .ampc-project-page .ampc-motion--abstract { aspect-ratio: 1; }
}