/* Animate.css - Animazioni aggiuntive */

/* Animazione per il titolo nella hero section */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 40px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

.hero h2 {
    animation: fadeInUp 1s ease-out forwards;
}

.hero p {
    animation: fadeInUp 1s ease-out 0.3s forwards;
    opacity: 0;
}

.hero .btn {
    animation: fadeInUp 1s ease-out 0.6s forwards;
    opacity: 0;
}

/* Effetto glitter per i bottoni */
@keyframes glitter {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.btn:hover {
    background: linear-gradient(90deg, #0056b3, #007bff, #0056b3);
    background-size: 200% 200%;
    animation: glitter 2s linear infinite;
    color: white;
    border: none;
}

/* Effetto di rotazione per le icone dei servizi */
@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.service-card:hover i {
    animation: rotate 1s ease-in-out;
}

/* Effetto di evidenziazione per le card dei progetti */
.project-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0,86,179,0.3) 0%, rgba(0,123,255,0) 50%, rgba(0,86,179,0.3) 100%);
    opacity: 0;
    transition: opacity 0.5s;
}

.project-card:hover::after {
    opacity: 1;
}

/* Effetto di zoom per le immagini dei progetti */
.project-card img {
    transition: transform 0.5s;
}

.project-card:hover img {
    transform: scale(1.05);
}