/* Animations */
.reveal {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
    will-change: transform, opacity;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Optional: Stagger delays for feature cards if we want smooth sequence */
.feature-card:nth-child(1) {
    transition-delay: 0.1s;
}

.feature-card:nth-child(2) {
    transition-delay: 0.2s;
}

.feature-card:nth-child(3) {
    transition-delay: 0.3s;
}

.feature-card:nth-child(4) {
    transition-delay: 0.4s;
}

/* FIX: Restore hover effects for interactive elements */
/* Since .reveal.active sets transform: translateY(0), it overrides the default hover effect (-5px) */
/* We explicitly re-apply the hover translation for cards and features */
.card.reveal.active:hover,
.feature-card.reveal.active:hover {
    transform: translateY(-5px);
}

.related-product-card.reveal.active:hover {
    transform: translateY(-8px);
}