/* ================================================================
   temp_prod_list.css
   Dynamic animations and architecture overrides for listing templates.
   Eliminates all inline styling from product grids.
   ================================================================ */

.shop-page .container { max-width: 2500px; margin: 0 auto; padding: 0 24px; }

/* Pure CSS staggered entry engine replacing inline dynamic style loops */
.product-grid .product-card:nth-child(1) { animation-delay: 40ms; }
.product-grid .product-card:nth-child(2) { animation-delay: 80ms; }
.product-grid .product-card:nth-child(3) { animation-delay: 120ms; }
.product-grid .product-card:nth-child(4) { animation-delay: 160ms; }
.product-grid .product-card:nth-child(5) { animation-delay: 200ms; }
.product-grid .product-card:nth-child(6) { animation-delay: 240ms; }
.product-grid .product-card:nth-child(7) { animation-delay: 280ms; }
.product-grid .product-card:nth-child(8) { animation-delay: 320ms; }
.product-grid .product-card:nth-child(9) { animation-delay: 360ms; }
.product-grid .product-card:nth-child(10) { animation-delay: 400ms; }
.product-grid .product-card:nth-child(11) { animation-delay: 440ms; }
.product-grid .product-card:nth-child(12) { animation-delay: 480ms; }

/* Responsive tweaks for spec value density */
@media (max-width: 480px) {
  .product-spec {
    flex-direction: row;
    justify-content: space-between;
  }
  .spec-value {
    text-align: right;
  }
}