/* Square media viewport, except the two full-card scenes. */
@media (min-width: 768px) {
  .products > .product-card:not(.product-card--gochi):not(.product-card--giga-concierge) {
    min-height: 0;
  }
}
.products > .product-card:not(.product-card--gochi):not(.product-card--giga-concierge) .product-media {
  position: relative;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 1 / 1;
  margin: 0;
  align-self: center;
  overflow: hidden;
}
@media (min-width: 768px) {
  .products > .product-card:not(.product-card--gochi):not(.product-card--giga-concierge) .product-media {
    grid-area: 1 / 2;
  }
}
/* Multitool is a square scene rather than a full-card background. */
.products > .product-card--giga-tool .product-media > video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
}
/* Keep the existing window framing inside a square viewport. */
.products > .product-card--koroche .product-media > video,
.products > .product-card--disrupt-radar .product-media > img {
  position: absolute;
  top: 24px;
  left: 0;
  width: auto;
  min-width: 0;
  max-width: none;
  height: calc(100% - 48px);
  object-fit: contain;
  object-position: left top;
}
.products > .product-card--memento .memento-window {
  position: absolute;
  top: 24px;
  left: 0;
  width: auto;
  height: calc(100% - 48px);
}
@media (max-width: 767px) {
  .products > .product-card--koroche .product-media > video,
  .products > .product-card--disrupt-radar .product-media > img,
  .products > .product-card--memento .memento-window {
    left: 24px;
  }
}
