* {
    box-sizing: border-box;
    overflow-x: none;
}

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
  --verde: #005357;
  --verde-oscuro: rgb(0 62 65);
  --naranja: #E84621;
  --naranja-oscuro: rgb(174 53 25);
  --gris: #D4D8DA;
  --gris-claro: #eeeeee;
  --blanco: #FBFBFB;
  --negro: #2E2D2C;
  --rounded: 0.5rem;
}

.banner-certificaciones {
    max-width: 100%;
    height: 25rem;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    background-image: url('../img/banner3.webp');
    background-size: cover;
    background-position: center center;
}

.main-header-c {
    max-width: 44rem;
    text-align: center;
    color: var(--blanco);
}

.certificaciones {
    margin: 4rem auto;
    max-width: 56rem;
    display: grid;
    grid-template-columns: repeat(2,50%);
    gap: 2rem;
}

.certificado {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.icon-certificado {
    min-width: 5rem;
    min-height: 5rem;
}

.logo-cer1 {
    background-image: url('../img/iso45001.webp');
    background-size:contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.logo-cer2 {
    background-image: url('../img/iso12922.webp');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.logo-cer3 {
    background-image: url('../img/iso9001.webp');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.logo-cer4 {
    background-image: url('../img/ntc-250.webp');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.industrias-section {
    margin:6rem auto;
    max-width: 56rem;
    text-align: center;
}

.grid-industrias-c {
    overflow-x: hidden;
}

.card-industria {
    max-width: 18rem;
    padding: 5rem 0rem 0rem;
    border-radius: var(--rounded);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.card-industria>a>button {
    margin-top: 0.75rem;
    height: 3rem;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-color: rgba(0, 62, 65, 0.65);


}


.ci-contenido>h4, .ci-contenido>p {
    width: 85%;
    margin: 0.8rem auto; 
    color: var(--blanco); 
    text-align: left; 
    opacity: 1;
    transition: opacity 400ms ease;
    /* text-shadow: 0px 0px 15px 2px var(--negro); */
}

/* .card-industria:hover>h4, .card-industria:hover>p {
    opacity: 0;
}
 */
.card-industria>h4 {font-size: 1.5rem; font-weight: 600;}



.ci1, .ci2, .ci3, .ci4, .ci5, .ci6, .ci7, .ci8, .ci9{
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.ci1::before, .ci2::before, .ci3::before, .ci4::before, .ci5::before, .ci6::before, .ci7::before, .ci8::before, .ci9::before{
    content: '';

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    background-image:linear-gradient(rgba(0, 0, 0, 0.0) 00%, rgba(0, 0, 0, 0.7) 50%);
    transition: opacity 400ms ease;

    z-index: -1;
    opacity: 1;
}

/* .ci1:hover::before, .ci2:hover::before, .ci3:hover::before, .ci4:hover::before, .ci5:hover::before, .ci6:hover::before, .ci7:hover::before, .ci8:hover::before, .ci9:hover::before {
    opacity: 0;
} */


.ci1 {
    background-image: url('../img/i-quimico.webp');
    background-size: cover;
    background-position: left center;

}

.ci2 {
    background-image: url('../img/i-construccion.jpg');
    background-size: cover;
    background-position: left center;
}

.ci3 {
    background-image: url('../img/i-alimentos.webp');
    background-size: cover;
    background-position: left center;
}

.ci4 {
    background-image: url('../img/i-farmaceutica.jpg');
    background-size: cover;
    background-position: left center;
}

.ci5 {
    background-image: url('../img/i-medicina.webp');
    background-size: cover;
    background-position: left center;
}

.ci6 {
    background-image: url('../img/i-automotriz.webp');
    background-size: cover;
    background-position: left center;
}

.ci7 {
    background-image: url('../img/i-transporte.webp');
    background-size: cover;
    background-position: left center;
}

.ci8 {
    background-image: url('../img/i-madera.webp');
    background-size: cover;
    background-position: left center;
}

.ci9 {
    background-image: url('../img/i-agricola.webp');
    background-size: cover;
    background-position: left center;
}


@media (max-width: 992px) {

    .banner-certificaciones {
    max-width: 100%;
    height: 30rem;
    padding: 2rem 0rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    background-size: cover;
    background-position: center center;
}

.certificaciones {
    width: 90%;
}

    .main-header {
    max-width: 90%;
    text-align: center;
    color: var(--blanco);
}

    .certificaciones {
    margin: 2rem auto;
    max-width: 56rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

    .certificado {
    display: flex;
    flex-direction: column;
    gap: 0rem;
    align-items: center;
    text-align: center;
}

    .industrias-section {
    margin:6rem auto;
    max-width: 95%;
    text-align: center;
}

    .grid-industrias-c {
        display: flex;
        overflow-x: scroll;
}

    .card-industria {
        min-width: 14rem;
        max-width: 14rem;
        padding: 6rem 0rem 0rem;
        min-height: 13rem;
        border-radius: var(--rounded);
        display: flex;
        flex-direction: column;
        justify-content: space-between;
}

    .ci-contenido>h4 {
        width: 80%;
        font-size: 1.25rem;
        margin: 0px auto;
    }

    .ci-contenido>p {
        display: none;
    }



}