/* ===========================
   SERVICIOS
=========================== */


/* SECCIÓN PRINCIPAL */

.seccion-servicios {

    background-color:#d1d5db;

    padding:50px 20px;

    min-height:80vh;

    display:flex;

    flex-direction:column;

    align-items:center;

}



/* TITULO */

.titulo-servicios {

    color:#0f172a;

    font-size:3rem;

    margin-bottom:40px;

    font-weight:800;

    text-align:center;

}



/* CONTENEDOR TARJETAS */

.contenedor-tarjetas {

    display:flex;

    justify-content:center;

    align-items:stretch;

    flex-wrap:wrap;

    gap:50px;

    width:90%;

    max-width:1200px;

    margin:auto;

}



/* TARJETAS */

.tarjeta-servicio {

    background:white;

    padding:20px;

    border-radius:15px;

    box-shadow:0 10px 15px rgba(0,0,0,.1);

    width:250px;

    text-align:center;

    transition:.3s ease;

}



.tarjeta-servicio:hover {

    transform:translateY(-10px);

}



/* IMÁGENES */

.tarjeta-servicio img {

    width:100%;

    height:150px;

    object-fit:contain;

    margin-bottom:15px;

}



/* TITULO TARJETA */

.tarjeta-servicio h3 {

    font-size:1.1rem;

    color:#0f172a;

    font-weight:800;

}



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


html,
body {

    min-height:100%;

    margin:0;

}



main{

    flex:1;

}



footer{

    margin-top:auto;

}



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


@media(max-width:768px){


    .seccion-servicios{

        padding:35px 15px;

    }



    .titulo-servicios{

        font-size:2rem;

        margin-bottom:25px;

    }



    .contenedor-tarjetas{

        width:100%;

        gap:25px;

    }



    .tarjeta-servicio{

        width:100%;

        max-width:300px;

        padding:20px;

    }



    .tarjeta-servicio:hover{

        transform:none;

    }



    .tarjeta-servicio img{

        height:130px;

    }



    .tarjeta-servicio h3{

        font-size:1rem;

    }

}