@media (min-width: 1200px) {
  .shell {
    width: 96vw;
    max-width: none;
  }

  .layout {
    grid-template-columns: minmax(300px, 340px) minmax(0, 1fr);
  }

  .collection-grid {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  }

  .results {
    grid-template-columns: repeat(auto-fill, minmax(390px, 1fr));
  }
}

@media (min-width: 2200px) {
  .shell {
    width: 97vw;
  }

  .layout {
    grid-template-columns: minmax(320px, 380px) minmax(0, 1fr);
  }

  .collection-grid {
    grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
  }
}

@media (min-width: 3200px) {
  .shell {
    width: 98vw;
  }

  .collection-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  }
}