/* responsive.css - Corrections responsives et animations */

/* Garantir la visibilité */
.header,
.navbar,
.footer,
.whatsapp-float {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Menu Desktop visible sur grand écran */
@media (min-width: 901px) {
    .nav-menu-container,
    .nav-cta {
        display: flex !important;
    }
    
    .hamburger {
        display: none !important;
    }
    
    .mobile-menu {
        display: none !important;
    }
}

/* Menu Mobile visible sur petit écran */
@media (max-width: 900px) {
    .nav-menu-container,
    .nav-cta {
        display: none !important;
    }
    
    .hamburger {
        display: flex !important;
    }
}

/* Corrections pour les très petits écrans */
@media (max-width: 360px) {
    .logo-text {
        min-width: 120px !important;
    }
    
    .logo-main {
        font-size: 18px !important;
    }
    
    .logo-sub {
        font-size: 8px !important;
    }
    
    .mobile-menu {
        padding: 20px !important;
    }
}

/* WhatsApp position correcte sur tous les écrans */
.whatsapp-float {
    right: 30px !important;
    bottom: 30px !important;
    left: auto !important;
    margin: 0 !important;
    transform-origin: center !important;
}

@media (max-width: 768px) {
    .whatsapp-float {
        right: 25px !important;
        bottom: 25px !important;
    }
}

@media (max-width: 480px) {
    .whatsapp-float {
        right: 20px !important;
        bottom: 20px !important;
    }
}

/* Animation pour le menu mobile */
.mobile-menu {
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-menu.active {
    transform: translateX(0);
}

/* Smooth transitions */
.nav-menu a,
.nav-cta,
.btn-primary,
.whatsapp-float {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Performance optimizations */
.nav-menu a::before,
.nav-menu a::after,
.whatsapp-float::before {
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Scroll behavior */
html {
    scroll-behavior: smooth;
}

/* Focus states pour accessibilité */
.nav-menu a:focus,
.nav-cta:focus,
.whatsapp-float:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* Correction pour le contenu principal */
main {
    min-height: calc(100vh - 120px);
    position: relative;
    z-index: 1;
}

/* Loading states */
.btn-primary:active,
.nav-cta:active {
    transform: translateY(-1px) !important;
}

/* Optimisation des images */
.logo-img,
.footer .logo-img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

/* Support pour les navigateurs modernes */
@supports (backdrop-filter: blur(10px)) {
    .header.scrolled,
    .header.transparent.scrolled {
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
}

/* Fallback pour les anciens navigateurs */
@supports not (backdrop-filter: blur(10px)) {
    .header.scrolled,
    .header.transparent.scrolled {
        background: rgba(255, 255, 255, 0.95);
    }
}