.bp-card {
	position: relative;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--bp-color-border);
	border-radius: var(--bp-radius-md);
	background: var(--bp-color-surface);
	box-shadow: var(--bp-shadow-card);
	transition:
		border-color var(--bp-transition-standard),
		box-shadow var(--bp-transition-standard),
		transform var(--bp-transition-standard);
}

.bp-card:hover {
	border-color: var(--bp-color-border-strong);
	box-shadow: var(--bp-shadow-elevated);
	transform: translateY(-0.125rem);
}

.bp-card__media {
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--bp-color-surface-subtle);
}

.bp-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bp-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--bp-space-3);
	padding: var(--bp-space-6);
}

.bp-card__meta {
	color: var(--bp-color-accent-hover);
	font-size: var(--bp-font-size-caption);
	font-weight: var(--bp-font-weight-bold);
	letter-spacing: var(--bp-letter-spacing-eyebrow);
	text-transform: uppercase;
}

.bp-card__title {
	font-size: var(--bp-font-size-h4);
}

.bp-card__description {
	color: var(--bp-color-text-muted);
	font-size: var(--bp-font-size-small);
}

.bp-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bp-space-3);
	margin-top: auto;
	padding-top: var(--bp-space-2);
}

.bp-card--feature,
.bp-card--trust {
	padding: var(--bp-space-6);
}

.bp-card--product .bp-card__media {
	aspect-ratio: 1 / 1;
}

.bp-card--path[aria-current="true"],
.bp-card--selected {
	border-color: var(--bp-color-accent);
	box-shadow: var(--bp-focus-ring);
}