/* Works: balanced mobile gutters, without changing desktop or case pages. */
@media (max-width: 850px) {
  body > main.works-archive {
    --works-gutter: clamp(24px, 6.15vw, 36px);
    --works-gap: clamp(22px, 6.15vw, 32px);
    box-sizing: border-box;
    width: 100%;
    margin: 24px 0 44px;
    padding: 0 var(--works-gutter);
    column-gap: var(--works-gap);
    row-gap: 36px;
  }
  .works-archive .archive-image {
    height: auto;
    aspect-ratio: 1 / 1;
    max-height: 300px;
  }
  .works-archive .archive-image img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
}