/* CONTROLE DE IMAGENS DESKTOP/MOBILE - ULTRA CORRIGIDO */
.desktop-img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
}

.mobile-img {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
    left: -9999px !important;
    z-index: -1 !important;
}

/* MOBILE: Mostra imagem mobile, esconde desktop COMPLETAMENTE */
@media only screen and (max-width: 767px) {
    .desktop-img {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -9999px !important;
        z-index: -1 !important;
        width: 0 !important;
        height: 0 !important;
    }
    
    .mobile-img {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        left: auto !important;
        z-index: 1 !important;
        width: 100% !important;
        height: auto !important;
    }
}

/* Garante que apenas uma imagem seja visível por vez */
.responsive-image-container {
    position: relative;
    overflow: hidden;
}

.responsive-image-container img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Força o comportamento correto */
.responsive-image-container .desktop-img,
.responsive-image-container .mobile-img {
    transition: none !important;
}