/* REDUZIR TAMANHO DE IMAGENS - ADICIONAR AO estilos-azuis.css */

/* ============ REDUZIR IMAGENS GRANDES ============ */

/* Logo na navbar */
.navbar-brand img {
    max-height: 50px !important;
    width: auto !important;
    object-fit: contain !important;
}

/* Imagens no footer */
footer img {
    max-height: 60px !important;
    width: auto !important;
    object-fit: contain !important;
}

/* Logo/Imagem grande no meio da página */
.hero-section img,
.hero-image {
    max-width: 400px !important;
    max-height: 300px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Imagens em containers grandes */
.container img[style*="width"],
.container img[style*="100%"] {
    max-width: 400px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Para imagens que estão em divs */
.image-container img,
.logo-container img,
.brand-logo img {
    max-width: 300px !important;
    max-height: 250px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Imagens em seções específicas */
section img {
    max-width: 100% !important;
    height: auto !important;
}

/* Para imagens muito grandes (mais que 200px) */
img[width]:not([width="100"]):not([width="200"]):not([width="150"]) {
    max-width: 400px !important;
    height: auto !important;
}

/* Reduzir imagens inline grandes */
img.large,
img.big,
img.full-width {
    max-width: 500px !important;
    max-height: 400px !important;
    width: auto !important;
    height: auto !important;
}

/* ============ RESPONSIVIDADE ============ */

@media (max-width: 1200px) {
    .hero-section img,
    .hero-image {
        max-width: 300px !important;
        max-height: 250px !important;
    }

    .image-container img,
    .logo-container img {
        max-width: 250px !important;
        max-height: 200px !important;
    }
}

@media (max-width: 768px) {
    .hero-section img,
    .hero-image {
        max-width: 250px !important;
        max-height: 200px !important;
    }

    .image-container img,
    .logo-container img {
        max-width: 200px !important;
        max-height: 150px !important;
    }

    footer img {
        max-height: 40px !important;
    }

    .navbar-brand img {
        max-height: 40px !important;
    }
}

@media (max-width: 576px) {
    .hero-section img,
    .hero-image {
        max-width: 200px !important;
        max-height: 150px !important;
    }

    .image-container img,
    .logo-container img {
        max-width: 150px !important;
        max-height: 120px !important;
    }

    footer img {
        max-height: 30px !important;
    }

    .navbar-brand img {
        max-height: 30px !important;
    }
}