/* Hero Section Component - Only unique styles */
.hero-slide {
    transform: translateX(100%);
    transition: transform 0.8s ease-in-out;
}

.hero-slide.active {
    transform: translateX(0) !important;
}

/* Animation specific styles */
@keyframes slideIn {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

@keyframes slideOut {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}