/* Product grids — premium card layout */
.home .woocommerce ul.products,
.home .woocommerce-page ul.products,
.woocommerce ul.products,
.woocommerce-page ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.75rem;
  margin: 0 !important;
  padding: 0;
  list-style: none;
}

.home .woocommerce ul.products::before,
.home .woocommerce ul.products::after,
.home .woocommerce-page ul.products::before,
.home .woocommerce-page ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
  content: none !important;
  display: none !important;
}

.home .woocommerce ul.products li.product,
.home .woocommerce-page ul.products li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0;
  display: flex;
  flex-direction: column;
  background: var(--gpfp-surface);
  border: 1px solid var(--gpfp-slate-200);
  border-radius: 0.75rem;
  box-shadow: var(--gpfp-shadow-md);
  overflow: hidden;
  transition:
    box-shadow var(--gpfp-transition, 0.3s ease),
    transform var(--gpfp-transition, 0.3s ease),
    border-color var(--gpfp-transition, 0.3s ease);
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link img,
.woocommerce ul.products li.product > a img {
  border-radius: 0;
  transition: transform var(--gpfp-transition, 0.3s ease);
}

.woocommerce ul.products li.product:hover a.woocommerce-LoopProduct-link img,
.woocommerce ul.products li.product:focus-within a.woocommerce-LoopProduct-link img {
  transform: scale(1.03);
}

.woocommerce ul.products li.product:hover {
  box-shadow: var(--gpfp-shadow-lg), 0 0 36px -10px rgb(212 175 55 / 0.18);
  transform: translateY(-3px);
  border-color: rgb(212 175 55 / 0.28);
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
  display: block;
  overflow: hidden;
}

.woocommerce ul.products li.product img {
  border-radius: 0;
}

@media (max-width: 1024px) {
  .home .woocommerce ul.products,
  .home .woocommerce-page ul.products,
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .home .woocommerce ul.products,
  .home .woocommerce-page ul.products,
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
}

@media (max-width: 360px) {
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    grid-template-columns: 1fr;
  }
}

/* Price */
.price {
  margin-bottom: 0.625rem !important;
  font-weight: 600;
}

del .amount {
  color: var(--product-price);
  font-weight: 500;
}

.amount {
  color: var(--product-discount-price);
}

.woocommerce span.onsale {
  padding: 0.375rem 0.625rem !important;
  border-radius: 9999px !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: linear-gradient(135deg, var(--gpfp-accent-600) 0%, var(--gpfp-accent-700) 100%) !important;
  color: var(--gpfp-on-gold) !important;
  min-height: auto !important;
  line-height: 1.2 !important;
  box-shadow: var(--gpfp-accent-glow-strong);
}

.woocommerce-loop-product__title {
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  color: var(--headline-color);
  line-height: 1.35;
  padding: 0 1rem 0.5rem;
  margin: 0 !important;
}

.woocommerce ul.products li.product .button {
  margin: 0 1rem 1rem !important;
  margin-top: auto !important;
  border-radius: 0.625rem !important;
  font-weight: 600 !important;
  background: var(--gpfp-accent-600) !important;
  color: var(--gpfp-on-gold) !important;
  border: none !important;
  box-shadow: var(--gpfp-accent-glow) !important;
  transition:
    background var(--gpfp-transition, 0.3s ease),
    box-shadow var(--gpfp-transition, 0.3s ease),
    transform var(--gpfp-transition, 0.3s ease) !important;
}

.woocommerce ul.products li.product .button:hover {
  background: var(--gpfp-gold-hover) !important;
  color: var(--gpfp-on-gold) !important;
  box-shadow: var(--gpfp-accent-glow-strong) !important;
  transform: translateY(-2px) scale(1.02);
}