/* Figma Card component: fixed 160x160 image, flex row that wraps to a
   stacked layout at narrow card widths (matches Examples/Portfolio). */
.hdv-card-image,
.hdv-card-image img {
	width: 100%;
	height: auto;
	flex-shrink: 0;
}

.hdv-card-image img {
	object-fit: cover;
}

.hdv-card-body {
	flex: 1 1 0%;
	min-width: 160px;
	gap: var(--wp--preset--spacing--400);
}

.hdv-card {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--200, 8px);
	padding: var(--wp--preset--spacing--600);
	gap: var(--wp--preset--spacing--600);
	transition: border-color 0.15s ease;
}

.hdv-card:hover {
	border-color: var(--wp--preset--color--brand);
}

@media (max-width: 600px) {
	.hdv-card-grid .wp-block-post-template.is-flex-container > li {
		width: 100% !important;
	}
}