/* The original Webflow CSS remains untouched. These selectors only give newly
   database-created cards the same grid behavior as the original hard-coded IDs. */
.database-product-card {
  grid-area: span 1 / span 3 / span 1 / span 3;
}

.database-gallery-image {
  height: 460px;
  background-position: 50%;
  background-size: cover;
  grid-column: span 7 / span 7;
}

.database-gallery-text {
  grid-column: span 5 / span 5;
}

@media screen and (max-width: 767px) {
  .database-gallery-image,
  .database-gallery-text {
    grid-column: span 8 / span 8;
  }
}