@media(max-width:900px) {
  .product-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 20px
  }
}

@media(max-width:540px) {
  .shop-toolbar {
    flex-direction: column;
    align-items: stretch
  }

  .shop-search input {
    width: 100%;
    font-size: 16px
  }

  .product-grid {
    gap: 25px 15px
  }

  .product-card h3 {
    font-size: 22px
  }

  .product-description {
    font-size: 11px
  }

  .product-card .button {
    font-size: 11px;
    padding: 10px 8px;
    gap: 6px
  }

  .shop-foot {
    align-items: flex-start;
    flex-direction: column
  }

  .product-option select {
    font-size: 16px
  }
}

@media(max-width:350px) {
  .product-grid {
    grid-template-columns: 1fr
  }
}