/* src/custom-colors.css */
.bg-dark-green { background-color: #1a4d2e; }
.text-dark-green { color: #1a4d2e; }
.bg-light-green { background-color: #4f9d69; }
.text-light-green { color: #4f9d69; }


/* CSS personnalisé minimal - uniquement ce qui ne peut pas être fait en Tailwind */

/* Animations */
@keyframes float-vivid {
    0%, 100% { transform: translateY(0) rotate(0deg) scale(1); opacity: 0.12; }
    25% { transform: translateY(-40px) rotate(8deg) scale(1.05); opacity: 0.18; }
    50% { transform: translateY(-70px) rotate(-5deg) scale(1.1); opacity: 0.2; }
    75% { transform: translateY(-35px) rotate(5deg) scale(1.05); opacity: 0.18; }
}

@keyframes orb-float {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.6; }
    33% { transform: translate(50px, -60px) scale(1.2); opacity: 0.8; }
    66% { transform: translate(-40px, -30px) scale(0.9); opacity: 0.7; }
}

@keyframes particle-rise {
    0% { transform: translateY(0) translateX(0); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(-500px) translateX(50px); opacity: 0; }
}

@keyframes line-pulse {
    0%, 100% { stroke-opacity: 0.5; stroke-width: 1.5; }
    50% { stroke-opacity: 0.9; stroke-width: 2; }
}

@keyframes slideDown {
    from {
        opacity: 0;
        max-height: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        max-height: 500px;
        transform: translateY(0);
    }
}

@keyframes slideUp {
    from {
        opacity: 1;
        max-height: 500px;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        max-height: 0;
        transform: translateY(-10px);
    }
}

/* Classes d'animation */
.svg-illustration { 
    animation: float-vivid 15s infinite ease-in-out; 
}

.purple-orb { 
    animation: orb-float 20s infinite ease-in-out; 
}

.purple-particle { 
    animation: particle-rise 12s infinite ease-in-out; 
}

.hourglass-line-animated { 
    animation: line-pulse 3s infinite ease-in-out; 
}

.faq-answer {
    animation: slideDown 0.3s ease forwards;
}

.faq-answer.closing {
    animation: slideUp 0.3s ease forwards;
}

/* Bordures gradients pour les cartes */
.card-border-red {
    border: 2px solid transparent;
    background: 
        linear-gradient(white, white) padding-box,
        linear-gradient(135deg, #ef4444, #dc2626, #b91c1c) border-box;
}

.card-border-green {
    border: 2px solid transparent;
    background: 
        linear-gradient(white, white) padding-box,
        linear-gradient(135deg, #22c55e, #16a34a, #15803d) border-box;
}

/* Bento Grid */
.bento-grid { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: 1rem;
}

.large { 
    grid-column: span 2; 
}

.tall { 
    grid-row: span 2; 
}

/* Responsive Bento Grid */
@media (max-width: 968px) {
    .bento-grid { 
        grid-template-columns: repeat(2, 1fr); 
    }
}

@media (max-width: 640px) {
    .bento-grid { 
        grid-template-columns: 1fr; 
    }
    .large, .tall { 
        grid-column: span 1; 
        grid-row: span 1; 
    }
}