/*
 * GPIPL product card (Phase 3, conditional: product archives, categories, related products, front page).
 * Instrument photo on a Survey White plate; model number in the narrow data width.
 * No price, no rating, no invented badges: only fields GPIPL manages in the admin.
 */
@layer components {
	.product-card {
		position: relative;
		display: flex;
		flex-direction: column;
		height: 100%;
		border: var(--border);
		border-radius: var(--radius-m);
		background: var(--color-bg);
		transition: border-color var(--dur-base) var(--ease-out);
	}

	.product-card__media {
		position: relative;
		display: grid;
		place-items: center;
		aspect-ratio: 4 / 3;
		padding: var(--space-l);
		overflow: hidden;
		border-radius: var(--radius-m) var(--radius-m) 0 0;
		background: var(--palette-survey); /* always light: product photos are shot on white */
	}
	.product-card__media img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		mix-blend-mode: multiply; /* white photo backgrounds merge into the plate */
		transition: transform var(--dur-slow) var(--ease-out);
	}
	.product-card__placeholder {
		display: grid;
		place-items: center;
		width: 100%;
		height: 100%;
		color: color-mix(in srgb, var(--palette-slate) 30%, var(--palette-survey));
	}

	.product-card__body {
		display: flex;
		flex-direction: column;
		gap: var(--space-2xs);
		flex: 1;
		padding: var(--space-m) var(--space-m) var(--space-l);
	}
	.product-card__category { font-size: var(--step--1); color: var(--color-text-muted); }
	.product-card__title {
		font-size: var(--step-1);
		font-weight: var(--wght-semibold);
		font-stretch: 106%;
		line-height: var(--lh-snug);
		letter-spacing: -0.005em;
	}
	.product-card__title a { color: var(--color-heading); text-decoration: none; }
	.product-card__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
	.product-card__model {
		font-size: var(--step--1);
		font-stretch: var(--wdth-data);
		font-variant-numeric: tabular-nums;
		color: var(--color-text-muted);
	}
	.product-card__model b { font-weight: var(--wght-semibold); color: var(--color-text); }
	.product-card__summary {
		color: var(--color-text-muted);
		font-size: var(--step--1);
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.product-card__cta {
		margin-top: auto;
		padding-top: var(--space-xs);
		color: var(--color-link);
		font-size: var(--step--1);
		font-weight: var(--wght-semibold);
		font-stretch: var(--wdth-ui);
	}

	.product-card:hover { border-color: var(--color-line-strong); }
	.product-card:hover .product-card__media img { transform: scale(1.03); }
	.product-card:hover .product-card__title a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.18em; }
	.product-card:has(.product-card__title a:focus-visible) { outline: var(--focus-ring); outline-offset: var(--focus-offset); }
	.product-card__title a:focus-visible { outline: none; }

	/* Horizontal variant for narrow lists (related products in a sidebar). */
	@media (min-width: 30em) {
		.product-card--row { flex-direction: row; }
		.product-card--row .product-card__media { width: 38%; flex-shrink: 0; aspect-ratio: 1; border-radius: var(--radius-m) 0 0 var(--radius-m); padding: var(--space-s); }
	}
}
