img[data-src],img[loading=lazy]{opacity:0;transition:opacity .3s ease-in}img.lazy-loaded{opacity:1}.btn:hover,.modal,.product-card:hover{will-change:transform}.notification,.scroll-to-top{will-change:transform,opacity}.modal-content,.product-card{transform:translateZ(0);backface-visibility:hidden}.cgv-content,.modal-body{overflow-y:scroll;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.product-img{image-rendering:-webkit-optimize-contrast}.product-card{contain:layout style paint;transform:translate3d(0,0,0)}.modal-content{contain:layout paint}@font-face{font-family:'Segoe UI';font-display:swap}.footer-section{content-visibility:auto;contain-intrinsic-size:0 500px}.faq-item{contain:layout style}.product-image.loading{background:linear-gradient(90deg,#f0f0f0 0,#f8f8f8 50%,#f0f0f0 100%);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}100%{background-position:-200% 0}}.scroll-to-top{contain:layout paint}.scrolling .modal,.scrolling .notification,.scrolling .product-card{transition:none!important}.low-end-device .modal,.low-end-device .notification,.low-end-device .product-card{animation-duration:.1s!important;transition-duration:.1s!important}@media (prefers-reduced-motion:reduce){:not(.nav-toggle):not(.cart-icon):not(.nav-links){animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}.product-image img{position:relative;width:100%;height:100%;object-fit:contain}.modal-content,.notification,.scroll-to-top{transform:translateZ(0);will-change:transform}.product-card::after,.product-card::before{content:none}@media (max-width:768px){.modal,.notification,.product-card,.scroll-to-top{animation-duration:.25s;transition-duration:.25s}.products-grid{grid-template-columns:1fr!important;gap:1rem}.btn,a:not(.logo):not(.nav-links a),button:not(.nav-toggle):not(.close-modal):not(.remove-item-btn){min-height:34px;min-width:34px}.product-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.1)!important}}.remove-item-btn{min-height:auto!important;min-width:auto!important;padding:.35rem .7rem!important;font-size:.8rem!important}
/* ========== BOUTON D'APPEL MOBILE ========== */

/* Masquer le bouton par défaut */
.mobile-call-btn {
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    border-radius: 25px;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 102;
    border: 2px solid #ffffff;
    gap: 0.4rem;
    height: 40px;
}

.mobile-call-btn svg {
    color: #ffffff;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
    width: 18px;
    height: 18px;
}

/* Effet au survol */
.mobile-call-btn:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.5);
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
}

/* Effet au clic */
.mobile-call-btn:active {
    transform: scale(0.95);
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.4);
}

/* Afficher uniquement sur mobile (max-width: 768px) */
@media (max-width: 768px) {
    /* Positionner le bouton entre le menu hamburger et le panier */
    .nav-content {
        position: relative;
    }
    
    .mobile-call-btn {
        display: none; /* Caché par défaut */
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        opacity: 0;
        pointer-events: none;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    /* Afficher le bouton quand le menu est ouvert */
    body.menu-open .mobile-call-btn {
        display: flex !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        animation: slideInScale 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
}

@keyframes slideInScale {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.5);
    }
    60% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.05);
    }
    100% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

/* Masquer complètement sur desktop */
@media (min-width: 769px) {
    .mobile-call-btn {
        display: none !important;
    }
}