.card,
.stat-card,
.button,
.option-button {
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.card:hover,
.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 42px rgba(8, 18, 36, 0.1);
}

.button:hover {
    transform: translateY(-1px);
}

.hero,
.section,
.card,
.alert {
    animation: fade-slide-up 480ms ease both;
}

@keyframes fade-slide-up {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}