@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

.fade-in { animation: fadeIn 0.6s ease-out forwards; }
.fade-up { animation: fadeInUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.carousel-item.active .hero-label { animation: fadeInUp 0.5s ease-out forwards; }
.carousel-item.active .hero-title { animation: fadeInUp 0.7s ease-out 0.15s forwards; opacity: 0; animation-fill-mode: forwards; }
.carousel-item.active .hero-text { animation: fadeInUp 0.7s ease-out 0.3s forwards; opacity: 0; animation-fill-mode: forwards; }
.carousel-item.active .hero-actions { animation: fadeInUp 0.7s ease-out 0.45s forwards; opacity: 0; animation-fill-mode: forwards; }