@charset "UTF-8";

nav{
    font-family: "Lexend Deca", serif;
    font-optical-sizing: auto;
    font-weight: 300;
  font-style: normal;
}

main{
    font-family: "Lexend Deca", serif;
    font-optical-sizing: auto;
    font-weight: 300;
  font-style: normal;
}

body {
    padding-top: 75px; /* Ajusta según la altura del navbar */
}
a{
    text-decoration: none;
    color: whitesmoke;
}
h2{
    color: #3441C0;
    font-weight: 700;
}
/* Diseño de botones*/
.btn-custom {
    background-color: #3441C0;
    color: whitesmoke;
    border: none;
}
  
.btn-custom:hover {
    background-color: #232E90; /* Cambia el color al pasar el mouse */
    color: #ffffff; /* Ajusta el color del texto si es necesario */
}

/* Estilos para sección Inicio*/

.contenedorInicio{
    width: 95%;
    
    min-height: 100vh;
    background-image:url('./medios/frSolutions_inicio.png');
    background-size: cover; /* Ajusta el tamaño para cubrir todo el contenedor */
    background-position: center; /* Centra la imagen */
    background-repeat: no-repeat; /* Evita que la imagen se repita */
    border-radius: 20px;
    padding: 5rem;
    color: whitesmoke;
    text-shadow: 1px 2px 5px rgba(0,0,0,0.44);
    
    flex-wrap: wrap;
    
}

.contenedorInicio .subtitulo{
    font-size: 2rem;
    font-weight: 400;
    margin-bottom: 1rem;
    
}

h1{
    font-weight: 700;
    font-size: 3.5rem;
    margin-bottom: 0.8rem;
    text-shadow: 1px 2px 5px rgba(0,0,0,0.44);
}

/* Estilos para sección especialidad */
.contenedorEspecialidad{
    width: 90%;
    min-height: auto;
    padding: 2rem;
    text-align: center;
    background-color: #f9f9f9;
    margin-top: 1rem; /* Agrega separación entre secciones */
    
}

.contenedorEspecialidad h2 {
    font-size: 2rem;
    margin-bottom: 1rem;
}

.contenedorEspecialidad p {
    font-size: 1rem;
    margin-bottom: 2rem;
}

/* Ajustes para las tarjetas en Especialidad */
.card {
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    height: 100%;
}

.card h5 {
    font-size: 1.2rem;
    font-weight: 600;
}

.card-body img{
    width: 20%;
    margin: 1rem;
}

/* Diseño para sección nosotros */
.contenedorNosotros{
    width:95%;
    min-height: 100vh;
    background-color: #3441C0;
    color: whitesmoke;
    border-radius: 20px;
    padding: 8rem;
    
    
}

h3{
    color: whitesmoke;
    margin-bottom: 1.8rem;
    font-weight: 600;
    font-size: 2.8rem;
}

/* Diseño sección nuestros servicios */
.contenedorServicios{
    width: 90%;
    min-height: auto;
    padding: 1rem;
    text-align: center;
    margin-top: 1rem; /* Agrega separación entre secciones */
    
}

.contenedorServicios img{
 width: 85%;
}

.contenedorServicios .card{
    border: none;
    box-shadow: none;
}

.textoCard {
    font-size: 0.8rem;
}

/* Diseño sección nuestro software */

.contenedorSoftware{
    width:95%;
    min-height: 100vh;
    background-color: #3441C0;
    color: whitesmoke;
    border-radius: 20px;
    padding: 8rem;
    
}

.contenedorSoftware img{
    width: 95%;
}

.contenedorSoftware h3{
    text-align: center;
    margin-bottom: 4rem;
}

/* Diseño sección contactanos */
.tarjetaColor{
    background-color: #3441C0;
    color: whitesmoke;
    border: none;
    height: 100%;
    
}

.tarjetaColor .btn{
    color: whitesmoke;
    background-color: #3441C0;
    border-color: whitesmoke;
}

.tarjetaColor .btn:hover{
    background-color: whitesmoke ;
    color: #3441C0;
}

/* Diseño sección paquetes */
.contendorPaquetes{
    text-align: center;
}

.contenedorPaquetes .btn{
    color: whitesmoke;
    background-color: #3441C0;
    
}

.contenedorPaquetes .btn:hover{
    color: whitesmoke;
    background-color: #232E90;
    
}

.contenedorPaquetes h4{
    color: #3441C0;
    font-size: 4rem;
}

.contenedorPaquetes h2{
    margin-bottom: 2rem;
    
}

/* Estilos para footer */
footer{
    background-color: #3441C0;
    color: whitesmoke;
    padding: 2rem;
    
}

footer img{
    width: 2rem;
    margin: 0.5rem;
}





/* Media queries para pantallas pequeñas */
@media (max-width: 768px) {
    .contenedorInicio {
        flex-direction: column; /* Acomoda los elementos verticalmente */
        text-align: center;
        padding: 7rem 2rem;
    }

    .contenedorEspecialidad {
        padding: 2rem 1rem;
    }

    .contenedorEspecialidad h2 {
        font-size: 1.8rem;
    }

    .contenedorEspecialidad p {
        font-size: 0.9rem;
    }

    h1{
        font-size: 2.2rem; 
        
    }

    .contenedorNosotros{
        flex-direction: column; /* Acomoda los elementos verticalmente */
        text-align: center;
        padding: 5rem 1.5rem;
    }

    .nosotros p{
        font-size: 0.9rem;
    }

    h3{
        font-size: 2.2rem;
    }

    .contenedorSoftware{
        flex-direction: column; /* Acomoda los elementos verticalmente */
        text-align: center;
        padding: 5rem 1.5rem;
    }

    .contenedorSoftware p{
        font-size: 0.8rem;
    }

    .contenedorPaquetes h4{
        
        font-size: 2.8rem;
    }

    

    
}