/* Mission CSS - Styles spécifiques à la page Notre Mission */

/* Hero Mission - Extension de hero-base */
.mission-hero::before {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" patternUnits="userSpaceOnUse" width="20" height="20"><circle cx="10" cy="10" r="1" fill="rgba(255,255,255,0.1)"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
}

/* Pillars spécifiques */
.pillar-card {
    border: 3px solid transparent;
}

.pillar-card:hover {
    border-color: #b8956d;
}

/* Values spécifiques */
.values-list {
    margin-top: 50px;
}

/* Team section spécifique */
.team-message {
    margin-bottom: 40px;
}

/* Responsive spécifique mission */
@media (max-width: 768px) {
    .pillar-card {
        padding: 30px 20px;
    }
}

/* Animations */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.6s ease forwards;
}

.fade-in:nth-child(1) { animation-delay: 0.1s; }
.fade-in:nth-child(2) { animation-delay: 0.2s; }
.fade-in:nth-child(3) { animation-delay: 0.3s; }

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}