.card {
  background: var(--color-bg-secondary);
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.card:hover { border-color: var(--color-border-strong); }
.card--interactive:hover { box-shadow: var(--shadow-glow); }
.card__header {
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-border-subtle);
  display: flex; align-items: center; justify-content: space-between;
}
.card__body { padding: var(--space-5); }
.card__image {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}
.card__footer {
  padding: var(--space-4) var(--space-5);
  border-top: 1px solid var(--color-border-subtle);
  background: var(--color-bg-primary);
}
.card--nested {
  background: var(--color-bg-tertiary);
  border-color: var(--color-border-subtle);
}