/* ===========================
   SECCIÓN NOSOTROS
=========================== */


.seccion-nosotros {

    background-color:#d1d5db;

    padding:50px 20px;

    display:flex;

    flex-direction:column;

    align-items:center;

}



/* TITULO */

.titulo-nosotros {

    color:#000;

    font-size:3rem;

    margin-bottom:40px;

    font-weight:800;

    text-align:center;

}



/* CONTENEDOR TARJETAS */

.contenedor-tarjetas {

    display:flex;

    justify-content:center;

    align-items:stretch;

    gap:50px;

    flex-wrap:wrap;

    width:90%;

    margin:auto;

}



/* TARJETAS */

.tarjeta {

    background:white;

    padding:30px;

    border-radius:15px;

    box-shadow:0 10px 20px rgba(0,0,0,.2);

    width:350px;

    max-width:100%;

    text-align:center;

    transition:.3s ease;

}



.tarjeta:hover {

    transform:translateY(-10px);

}



/* TITULOS */

.tarjeta h2 {

    color:#000;

    margin-bottom:20px;

    font-weight:900;

}



/* TEXTO */

.tarjeta p {

    color:#000;

    font-weight:600;

    text-align:justify;

    line-height:1.6;

    word-break:break-word;

}



/* LISTAS */

.tarjeta ul {

    color:#000;

    font-weight:700;

    text-align:left;

    padding-left:20px;

}



.tarjeta ul li {

    margin-bottom:10px;

    font-size:1.05rem;

    border-bottom:2px solid #d1d5db;

    padding-bottom:5px;

}



/* ===========================
   ESTRUCTURA FOOTER
=========================== */


html,
body {

    min-height:100%;

    margin:0;

}



main {

    flex:1;

}



footer {

    margin-top:auto;

}



/* ===========================
   RESPONSIVE CELULAR
=========================== */


@media(max-width:768px){


    .seccion-nosotros{

        padding:35px 15px;

    }



    .titulo-nosotros{

        font-size:2rem;

        margin-bottom:25px;

    }



    .contenedor-tarjetas{

        width:100%;

        gap:25px;

    }



    .tarjeta{

        width:100%;

        max-width:400px;

        padding:20px;

    }



    .tarjeta:hover{

        transform:none;

    }



    .tarjeta h2{

        font-size:1.5rem;

    }



    .tarjeta p{

        font-size:14px;

    }



    .tarjeta ul li{

        font-size:14px;

    }


}