/**
 * StepDecor Card Primitive
 * Base surface/hover/image-zoom behavior shared by every card-shaped
 * component (portfolio card, blog card, chall-card, trend-card —
 * Phase 06 widgets compose these classes rather than redeclaring them).
 */

.sd-card {
	background: var(--sd-color-surface);
	border: 1px solid var(--sd-color-border);
	border-radius: var(--sd-radius-lg);
	overflow: hidden;
	transition: transform var(--sd-transition-med), box-shadow var(--sd-transition-med);
}

.sd-card--hover-lift:hover {
	transform: translateY(-6px);
	box-shadow: var(--sd-shadow-lg);
}

.sd-card__media {
	overflow: hidden;
}

.sd-card__media img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	transition: transform var(--sd-transition-slow);
}

.sd-card:hover .sd-card__media img {
	transform: scale(1.06);
}

.sd-card__body {
	padding: var(--sd-space-5);
}