/* Sprint 4 hotfix: prevent WooCommerce clearfix pseudo-elements from becoming grid items */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after,
ul.products::before,
ul.products::after,
ul.products.grid::before,
ul.products.grid::after,
ul.products.columns-4::before,
ul.products.columns-4::after,
ul.products.columns-4.grid::before,
ul.products.columns-4.grid::after {
	content: none !important;
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	grid-column: auto !important;
	grid-row: auto !important;
}

/* Force product grids to start at the first real product card */
.woocommerce ul.products,
.woocommerce-page ul.products,
ul.products.grid,
ul.products.columns-4,
ul.products.columns-4.grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: clamp(16px, 2vw, 28px) !important;
	width: min(100% - 32px, var(--ms-container, 1280px)) !important;
	max-width: var(--ms-container, 1280px) !important;
	margin-inline: auto !important;
	margin-block: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	justify-content: stretch !important;
	align-items: stretch !important;
	overflow: visible !important;
}

/* Reset product items so WooCommerce float/first/last rules cannot shift grid placement */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
ul.products.grid > li.product,
ul.products.grid > li.archive-card,
ul.products.columns-4.grid > li.product,
ul.products.columns-4.grid > li.archive-card {
	float: none !important;
	clear: none !important;
	display: flex !important;
	flex-direction: column !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	grid-column: auto !important;
	grid-row: auto !important;
	transform: none !important;
	position: relative !important;
}

/* Neutralize first/last product placement side effects */
.woocommerce ul.products li.product.first,
.woocommerce ul.products li.product.last,
ul.products.grid > li.first,
ul.products.grid > li.last {
	clear: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	grid-column-start: auto !important;
	grid-column-end: auto !important;
}

/* Product card visual baseline */
.woocommerce ul.products li.product,
ul.products.grid > li.archive-card {
	background: #fff;
	border: 1px solid var(--ms-border, rgba(17, 17, 17, 0.12));
	border-radius: 14px;
	overflow: hidden;
	box-shadow: none;
}

.woocommerce ul.products li.product img,
ul.products.grid > li.archive-card img {
	width: 100% !important;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	display: block;
}

.woocommerce-loop-product__title,
ul.products.grid .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.woocommerce ul.products li.product .button,
ul.products.grid > li.archive-card .button {
	width: 100%;
	min-height: 44px;
	border-radius: 999px;
}

/* Responsive grid */
@media (max-width: 1100px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	ul.products.grid,
	ul.products.columns-4,
	ul.products.columns-4.grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 700px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	ul.products.grid,
	ul.products.columns-4,
	ul.products.columns-4.grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 14px !important;
		width: min(100% - 24px, var(--ms-container, 1280px)) !important;
	}
}

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