@import '../css/resources/variables.css';
@import '../css/resources/style_reset.css';
@import '../css/resources/components.css';

/* --------------
Helpers
-------------- */
div img {
    width: 100%;
}
/* -------------- */

/* --------------
Urbain Section
-------------- */
.urbain__logo {
    width: 30%;
    min-width: 300px;
    margin: 0 auto;
    margin-top: 100px;
}

.urbain__logo a {
    display: inline-block;
    width: 100%;
    height: 100%;
}

.equipo__description {
    margin-top: 100px;
    margin-bottom: 100px;
}
/* -------------- */

/* -------------------
Topaz / Paga Section
------------------- */
.logos__container {
    display: grid;
    place-items: center;
    gap: 50px;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
}

.logos__container img {
    width: 60%;
    min-width: 300px;
}
/* -------------- */

/* -------------------
Gehl Section
------------------- */
.gehl__logo {
    width: 20%;
    min-width: 150px;
    margin: 0 auto;
}
/* -------------- */

/* -------------------
Media Queries
------------------- */
@media screen and (max-width: 600px) {
    /* --------------
    Urbain Section
    -------------- */
    .equipo-section {
        --section-lg-padding: 80px;
    }

    .urbain__logo {
        min-width: 230px;
    }
    /* -------------- */

    /* -------------------
    Topaz / Paga Section
    ------------------- */
    .logos__container {
        gap: 40px;
    }

    .logos__container img {
        min-width: 230px;
    }
    /* -------------- */
}
/* -------------- */