.card {
    background: var(--color-surface);
    border: 1px solid var(--color-border-base);
    border-radius: var(--radius);
    box-shadow: var(--shadow-card);
    padding: var(--space-24);
}

.card:hover,
.card:focus-within {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.card--hover {
    transition: transform var(--transition), box-shadow var(--transition);
}

.card--glass {
    background: var(--gradient-surface-glass);
    border-color: var(--color-border-base);
    backdrop-filter: blur(16px);
}