/* Estilos base (Mobile First) */
.empresas-associadas {
    text-align: center;
    padding: 30px 0;
}

.empresas-associadas h2 {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 30px;
    color: #003366;
    width: 100%; /* Garante que o título ocupa a largura total */
    display: block; /* Garante que não fica inline */
    text-align: center;
}

.empresas-associadas .container {
    display: flex;
    flex-direction: column; /* Mantém os elementos empilhados */
    align-items: center;
}

.empresas-associadas .logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    width: 100%; /* Garante que a div de logos ocupa toda a largura */
    padding: 0 20px;
}

.empresas-associadas .logos a {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 1 1 calc(33.33% - 20px);

    text-decoration: none;
}

.empresas-associadas .logos img {
    max-width: 180px;
    max-height: 120px;
    height: auto;
    width: 100%;

    object-fit: contain;
    transition: transform 0.3s ease-in-out;
}

.empresas-associadas .logos img:hover {
    transform: scale(1.1);
}

/* Responsividade */

/* Tablets pequenos e médios */
@media (min-width: 600px) {
    .empresas-associadas .logos a {
        flex: 1 1 calc(25% - 20px);
    }

    .empresas-associadas .logos img {
        max-width: 200px;
    }
}

/* Laptops pequenos e médios */
@media (min-width: 1025px) {
    .empresas-associadas .logos {
        gap: 25px;
    }

    .empresas-associadas .logos a {
        flex: 1 1 calc(20% - 20px);
    }

    .empresas-associadas .logos img {
        max-width: 220px;
    }
}

/* Laptops grandes e Desktops Full HD */
@media (min-width: 1441px) {
    .empresas-associadas .logos a {
        flex: 1 1 calc(20% - 20px);
    }

    .empresas-associadas .logos img {
        max-width: 250px;
    }
}