.cd-product-card { box-shadow: var(--cd-shadow-raised-soft); transition: box-shadow var(--cd-depth-transition); --cd-product-card-padding: var(--cd-space-3); display: flex; flex-direction: column; gap: var(--cd-space-3); padding: var(--cd-product-card-padding); }
.cd-product-card__media { --cd-radius-media: calc(var(--cd-radius-card) - var(--cd-product-card-padding)); position: relative; display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; border-radius: var(--cd-radius-media); background: var(--cd-color-surface); }
.cd-product-card__image { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.cd-product-card__badge { position: absolute; top: var(--cd-space-2); inset-inline-start: var(--cd-space-2); }
.cd-product-card h3 { margin: 0; font-size: var(--cd-font-md); }
.cd-product-card h3 a { color: var(--cd-color-text); text-decoration: none; }
.cd-product-card h3 a:hover { color: var(--cd-color-link); }
.cd-product-card__secondary { margin: 0; color: var(--cd-color-muted); font-size: var(--cd-font-sm); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cd-product-card__purchase { display: grid; gap: var(--cd-space-3); margin-top: auto; }
.cd-product-card__price { font-size: var(--cd-font-lg); font-weight: var(--cd-weight-bold); }
.cd-product-card__price del { color: var(--cd-color-muted); font-size: var(--cd-font-sm); font-weight: var(--cd-weight-normal); }
.cd-product-card__price ins { text-decoration: none; }
.cd-product-card__purchase .cd-button { width: 100%; padding-inline: var(--cd-space-3); }
@media (max-width: 40rem) {
	.cd-product-card__price { font-size: var(--cd-font-md); }
	.cd-product-card__purchase .cd-button { font-size: var(--cd-font-sm); }
}

.cd-product-card--catalog { height: 100%; }
.cd-product-card--catalog h3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	line-height: var(--cd-line-height-heading);
	min-height: calc(2em * var(--cd-line-height-heading));
}

.cd-product-card--catalog .cd-product-card__attributes { display: flex; flex-wrap: wrap; gap: var(--cd-space-2); list-style: none; margin: 0; padding: 0; }
.cd-product-card--catalog .cd-product-card__attributes .cd-pill { padding: var(--cd-space-1) var(--cd-space-2); max-width: 100%; }
.cd-product-card--catalog .cd-badge--stock { background: var(--cd-color-background); color: var(--cd-color-muted); font-weight: var(--cd-weight-normal); }

/* Compact catalog only; home cards and desktop keep their existing geometry. */
@media (max-width: 600px) {
	/* Reserve two lines on the wrapper; clamp only the text link. */
	.cd-product-card--catalog h3 {
		display: block;
		-webkit-line-clamp: unset;
		overflow: visible;
		margin: 0;
		line-height: 1.2;
		min-height: 2.4em;
	}
	.cd-product-card--catalog h3 > a {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		overflow: hidden;
		line-height: inherit;
	}
	.cd-product-card--catalog {
		--cd-product-card-padding: var(--cd-space-2);
		height: auto;
		min-height: 0;
		gap: var(--cd-space-2);
	}
	.cd-product-card--catalog .cd-product-card__media { aspect-ratio: 1; min-height: 0; }
	.cd-product-card--catalog .cd-product-card__attributes { gap: var(--cd-space-1); }
	.cd-product-card--catalog .cd-product-card__attributes .cd-pill {
		font-size: calc(var(--cd-font-sm) - var(--cd-space-1) / 2);
		line-height: var(--cd-line-height-heading);
		padding: calc(var(--cd-space-1) / 2) var(--cd-space-1);
		box-shadow: none;
	}
	.cd-product-card--catalog .cd-product-card__attributes .cd-pill:nth-child(n + 3) { display: none; }
	.cd-product-card--catalog .cd-product-card__purchase { margin-top: 0; gap: var(--cd-space-2); }
	.cd-product-card--catalog .cd-product-card__purchase .cd-button {
		min-height: var(--cd-control-size);
		padding-block: var(--cd-space-2);
	}
}

/* Quieter grid CTAs; preserve navy contrast, size and the pressed state. */
.cd-product-card__purchase .cd-button--primary {
	--cd-shadow-primary: var(--cd-shadow-raised-soft);
	--cd-shadow-primary-hover: var(--cd-shadow-raised);
}

@media (hover: hover) { .cd-product-card:hover { box-shadow: var(--cd-shadow-raised); } }
@media (prefers-reduced-motion: reduce) { .cd-product-card { transition: none; } }