=== assets/css/animations.css ===
/* ANIMATIONS GLOBALES */

@keyframes slideInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

@keyframes shimmer {
    0% {
        background-position: -1000px 0;
    }
    100% {
        background-position: 1000px 0;
    }
}

.animate-slide-down {
    animation: slideInDown 0.6s ease-out;
}

.animate-slide-up {
    animation: slideInUp 0.6s ease-out;
}

.animate-fade {
    animation: fadeIn 0.8s ease-out;
}

.animate-scale {
    animation: scaleIn 0.5s ease-out;
}

.animate-pulse {
    animation: pulse 2s ease-in-out infinite;
}

=== assets/js/form-validation.js ===
// Validation des formulaires

function validateEmail(email) {
    const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return re.test(email);
}

function validatePhone(phone) {
    const re = /^[\d\s\-\+\.]+$/;
    return re.test(phone);
}

function validateName(name) {
    return name.length >= 3;
}

function showError(input, message) {
    const group = input.parentElement;
    let errorEl = group.querySelector('.error-message');

    if (!errorEl) {
        errorEl = document.createElement('p');
        errorEl.className = 'error-message';
        group.appendChild(errorEl);
    }

    errorEl.textContent = message;
    input.classList.add('error');
}

function clearError(input) {
    const group = input.parentElement;
    const errorEl = group.querySelector('.error-message');

    if (errorEl) {
        errorEl.remove();
    }

    input.classList.remove('error');
}

document.addEventListener('DOMContentLoaded', function() {
    const inputs = document.querySelectorAll('.form-input');

    inputs.forEach(input => {
        input.addEventListener('blur', function() {
            clearError(this);

            if (this.id.includes('email')) {
                if (!validateEmail(this.value)) {
                    showError(this, 'Email invalide');
                }
            }

            if (this.id.includes('phone')) {
                if (this.value && !validatePhone(this.value)) {
                    showError(this, 'Téléphone invalide');
                }
            }

            if (this.id.includes('name')) {
                if (!validateName(this.value)) {
                    showError(this, 'Le nom doit contenir au moins 3 caractères');
                }
            }
        });
    });
});
