.dt-card {
	display: block;
	border-radius: var(--radius-card);
	border: var(--border-thin);
	background: var(--dt-surface);
	color: var(--dt-ink);
	text-decoration: none;
	transition: transform var(--duration-2) var(--ease-out),
	            box-shadow var(--duration-2) var(--ease-out),
	            border-color var(--duration-2) var(--ease-out);
}

a.dt-card:hover { text-decoration: none; color: inherit; }

.dt-card--default { background: var(--dt-surface); }
.dt-card--accent  { background: var(--dt-primary-soft); color: var(--dt-primary-700); border-color: transparent; }
.dt-card--dark    { background: var(--dt-surface-dark); color: var(--dt-on-dark); border-color: transparent; }
.dt-card--bare    { background: transparent; border-color: transparent; }

.dt-card--pad-sm { padding: var(--space-5); }
.dt-card--pad-md { padding: var(--space-6); }
.dt-card--pad-lg { padding: var(--space-8); }

.dt-card--interactive:hover {
	box-shadow: var(--shadow-card);
	transform: translateY(-2px);
	border-color: var(--dt-border-hover);
}

.dt-card--interactive.dt-card--bare:hover {
	background: var(--dt-surface);
	border-color: var(--dt-border);
}