/* public/assets/css/animations.css */

/* Animations simples au chargement (ex: Hero) */
.animate-on-load .animate-title {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s 0.5s ease-out forwards; /* Durée, Délai, Timing, Remplissage */
}
.animate-on-load .animate-subtitle {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s 0.8s ease-out forwards;
}
.animate-on-load .animate-cta {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 1s 1.1s ease-out forwards;
}

/* Keyframes (utilisé ci-dessus) */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Classes pour Animate.css via JS (ScrollTrigger) */
/* Ces éléments seront cachés jusqu'à ce que JS ajoute la classe d'animation */
.animate-on-scroll {
    opacity: 0;
    transition: opacity 0.5s ease-out; /* Transition douce pour l'apparition */
}
.animate-on-scroll.animated {
    opacity: 1;
}

/* Optionnel: Styles plus complexes avec GSAP (contrôlé par JS) */
/* Par exemple, un effet de "split text" pour les titres */
.split-text-chars span {
    display: inline-block; /* Permet la transformation */
    opacity: 0;
    transform: translateY(50px) rotate(10deg);
}

/* Effet Parallaxe Subtil (contrôlé par GSAP/JS) */
.parallax-bg {
    /* Le JS ajustera background-position ou transform */
}

/* Animation sur les icônes au survol (Exemple) */
.service-card:hover .service-icon i {
    animation: bounceIcon 0.6s ease-in-out;
}

@keyframes bounceIcon {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

/* Autres animations personnalisées ici */