

        @media (min-width: 1536px) {
            .max-w-7xl { max-width: 1536px; }
            .max-w-6xl { max-width: 1400px; }
        }

        @media (min-width: 1280px) {
            .max-w-7xl { max-width: 1280px; }
            .max-w-6xl { max-width: 1200px; }
        }

      
        @media (min-width: 1024px) {
            /* Desktop */
            .max-w-7xl { max-width: 1024px; }
            .max-w-6xl { max-width: 1024px; }
        }

       
        @media (max-width: 768px) {/* Mobile */
            .faq-comptable-section {
                padding: 60px 15px;
            }

            .faq-comptable-title {
                font-size: 2.2rem;
                margin-bottom: 30px;
            }

            .faq-comptable-subtitle {
                font-size: 1.1rem;
                margin-bottom: 40px;
            }

            .faq-comptable-grid {
                grid-template-columns: 1fr;
                gap: 20px;
            }

            .faq-comptable-question {
                padding: 20px;
            }

            .faq-comptable-question h3 {
                font-size: 1.1rem;
            }

            .faq-comptable-icon {
                width: 25px;
                height: 25px;
                margin-left: 15px;
            }

            .faq-comptable-icon::before {
                font-size: 1.2rem;
            }

            .faq-comptable-answer-content {
                padding: 0 20px 25px 20px;
                font-size: 1rem;
            }

            #hero {
                padding-top: 6rem;
                padding-bottom: 3rem;
            }
    
            /* Animations mobiles optimisées */
           .animate-fadeInUp {
               animation: fadeInUpMobile 0.6s ease-out forwards;
             }
    
            @keyframes fadeInUpMobile {
        from {
            opacity: 0;
            transform: translateY(20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
          }
    
        /* Optimisation des images mobiles */
           .group img {
        transition: transform 0.3s ease;
         }
    
          .group:active img {
        transform: scale(0.98);
           }
    
     /* Touch targets optimisés */
        .group {
        min-height: 44px;
        }

            .access-buttons {
                flex-direction: column;
                align-items: center;
            }

            .btn-client {
                width: 100%;
                max-width: 300px;
            }

            .client-access-section h2 {
                font-size: 28px;
            }
     
            .article-card:hover {
                transform: translateY(-6px) scale(1.01);
            }
    
            .hero-gradient-bg {
                min-height: 100vh;
                padding-top: 2rem;
                padding-bottom: 2rem;
            }
            
            .message-container { 
                min-height: 120px; 
                padding: 0.8rem; 
                margin: 0 0.5rem;
            }
           
            .message-horizontal { 
                flex-direction: column; 
                text-align: center; 
                gap: 0.8rem; 
            }
            
            .message-icon-container { 
                width: 50px; 
                height: 50px; 
                margin: 0 auto;
            }
            
            .message-content-container { 
                text-align: center; 
            }
            
            .question .message-content { 
                font-size: 1rem;
                line-height: 1.2;
            }
            
            .answer .message-content { 
                font-size: 0.95rem;
                line-height: 1.3;
            }
            
            .special-offer .message-content { 
                font-size: 1rem;
                line-height: 1.2;
            }
            
            .floating-card { 
                padding: 1rem 0.8rem; 
                min-height: 80px; 
                border-radius: 16px;
            }
            
            .message-text {
                font-size: 0.9em;
                margin-top: 0.2rem;
            }
            
            .progress-bar { width: 240px; }
            
            /* Masquer certains éléments décoratifs sur mobile */
            .morph-primary, .morph-secondary { display: none; }
            .float-gold { width: 4rem; height: 4rem; }

.progress-bar-container {
        margin: 1.5rem 0 1rem 0;
    }
    
    .progress-bar {
        width: 240px;
        height: 3px;
    }


            .message-content {
                word-wrap: break-word;
                overflow-wrap: break-word;
                hyphens: auto;
            }
            
            .message-content strong {
                font-size: 1.05em;
                line-height: 1.2;
            }
            
            .message-content em {
                display: block;
                margin-top: 0.5rem;
                font-style: normal;
                opacity: 0.8;
                font-size: 0.9em;
            }

           .footer-title {
        /* Fallback simple pour mobile */
        background: none !important;
        color: #cfb96a !important;
        -webkit-background-clip: unset !important;
        -webkit-text-fill-color: #cfb96a !important;
        background-clip: unset !important;
           }

            .max-w-7xl { max-width: 768px; }
            .max-w-6xl { max-width: 768px; }
        }
        /* CORRECTIONS CRITIQUES MOBILE */
@media (max-width: 768px) {
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
        position: relative !important;
    }
    
    * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Correction containers débordants */
    .container, .max-w-7xl, .max-w-6xl {
        max-width: 100% !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    /* Correction des grilles responsive */
    .grid {
        display: block !important;
    }
    
    .grid > * {
        margin-bottom: 1rem !important;
    }

            .hero-container {
                grid-template-columns: 1fr;
                gap: 2rem;
                text-align: center;
            }
            
            .hero-content h1 {
                font-size: 2.5rem;
            }
            
            .hero-stats {
                grid-template-columns: repeat(3, 1fr);
                gap: 1rem;
            }
            
          
            .grid-2,
            .grid-3,
            .grid-4 {
                grid-template-columns: 1fr;
            }
            
            .timeline-item {
                flex-direction: column;
                text-align: center;
            }
            
            .timeline-number {
                margin-right: 0;
                margin-bottom: 1rem;
            }
            
            .cta-buttons {
                flex-direction: column;
                align-items: center;
            }
        }

        @media (min-width: 640px) {/*mobile standard*/
            .max-w-7xl { max-width: 640px; }
            .max-w-6xl { max-width: 640px; }
        }

        @media (max-width: 480px) {/*mobile*/
    .progress-bar-container {
        margin: 1rem 0 0.8rem 0;
    }
    
    .progress-bar {
        width: 200px;
    }

            .message-container { 
                min-height: 110px; 
                padding: 0.6rem; 
                margin: 0 0.3rem;
            }
            
            .message-icon-container { 
                width: 45px; 
                height: 45px; 
            }
            
            .question .message-content { 
                font-size: 0.95rem;
                line-height: 1.2;
            }
            
            .answer .message-content { 
                font-size: 0.9rem;
                line-height: 1.2;
            }
            
            .special-offer .message-content { 
                font-size: 0.95rem;
                line-height: 1.2;
            }
            
            .floating-card { 
                padding: 0.8rem 0.6rem; 
                min-height: 75px; 
                border-radius: 14px;
            }
            
            .message-text {
                font-size: 0.85em;
                margin-top: 0.2rem;
            }
            
            .special-text {
                font-size: 1em !important;
            }
            
            .progress-bar { width: 200px; }
      
            .faq-comptable-title {
                font-size: 1.8rem;
            }

            .faq-comptable-subtitle {
                font-size: 1rem;
            }

            .faq-comptable-question {
                padding: 18px;
            }

            .faq-comptable-question h3 {
                font-size: 1rem;
            }
   
    #hero {
        padding-top: 4rem;
        padding-bottom: 2rem;
    }
    
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Images plus petites sur très petit écran */
    .h-48 {
        height: 10rem; /* 160px au lieu de 192px */
    }
    
    .h-32 {
        height: 7rem; /* 112px au lieu de 128px */
    }

}
  @media (max-width: 380px) {/*très petit ecran*/
            .message-container { 
                min-height: 100px; 
                padding: 0.5rem; 
                margin: 0 0.2rem;
            }
            
            .message-icon-container { 
                width: 40px; 
                height: 40px; 
            }
            
            .question .message-content { 
                font-size: 0.9rem;
                line-height: 1.1;
            }
            
            .answer .message-content { 
                font-size: 0.85rem;
                line-height: 1.1;
            }
            
            .special-offer .message-content { 
                font-size: 0.9rem;
                line-height: 1.1;
            }
            
            .floating-card { 
                padding: 0.7rem 0.5rem; 
                min-height: 70px; 
                border-radius: 12px;
            }
            
            .message-text {
                font-size: 0.8em;
                margin-top: 0.15rem;
            }
            
            .special-text {
                font-size: 0.95em !important;
            }
            
            .progress-bar { width: 180px; }
             .progress-bar-container {
        margin: 0.6rem 0 0.5rem 0; /* Ultra-compact */
           }
     .progress-bar {
        width: 180px;
    }
              }
