/* css/style.css */
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Montserrat', sans-serif;
}
.cont-header1{
    display: flex;
    gap: 3em;
}
.cont-header1 > div{
    flex: 1;
}
.firstcol{}
    .firstcol h1{
    margin-bottom: 30px;
}
.secondcol{
    text-align: right;
}
.contImaAux{
    margin-top: 40px;
}
    .contImaAux img{
    width: 100%;
    max-width: 300px;
}
strong{
    font-weight:bolder;
}
.firstcol p{
    font-size: 1.2em;
}
.titleA{
    background-color: #242a55;
}
.conttitleA{
    color: var(--white);
    font-size: 2em;
    max-width: 1200px;
    margin: auto;
    padding: 15px 20px;
}
.col3Serv{
    background: rgb(38,75,146);
    background: linear-gradient(50deg, rgba(38,75,146,1) 30%, rgba(15,33,79,1) 100%);
    padding: 30px;
}
.cont3colServ{
    display: flex;
    /* max-width: 980px; */
    margin: auto;
}
.cont3colServ > div{
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1em;
}
.cont3colServ > div img{
    width: 100px;
    height: auto;
}
.cont3colServ > div p{
    font-weight: bold;
    color: var(--white);
}
.thefooter{
    background-color: #252a55;
    color: var(--white);
    padding: 20px;
    text-align: center;
}
    .thefooter p{}

@media (max-width: 800px){
.cont-header1{
    display: flex;
    flex-direction: column;
    align-items: center;
    }    
}
@media (max-width: 440px){
.cont3colServ{
    display: flex;
    flex-direction: column;
}
}




.background-section {
    width: 100%;
    min-height: 100vh; /* Cada sección   ocupa al menos toda la altura de la ventana */
    display: flex;
    align-items: center; /* Centra el contenido verticalmente */
    justify-content: center; /* Centra el contenido horizontalmente */
    color: white;
    background-size: cover; /* La imagen de fondo cubre toda la sección manteniendo su proporción */
    background-position: center;
    background-repeat: no-repeat;
    padding: 20px; /* Añade un poco de espacio horizontal */
    box-sizing: border-box; /* Incluye el padding en el tamaño total */
}

.background-section2 {
    width: 100%;
    /*min-height: 100vh;  Cada sección ocupa al menos toda la altura de la ventana */
    height: 450px;
    display: flex;
    justify-content: center; /* Centra el contenido horizontalmente */
    color: white;
    background-size: cover; /* La imagen de fondo cubre toda la sección manteniendo su proporción */
    background-position: center;
    background-repeat: no-repeat;
    /*padding: px; /* Añade un poco de espacio horizontal */
    box-sizing: border-box; /* Incluye el padding en el tamaño total */
}

.first {
    background-image: url('../images/mainpage/fontp1.jpg'); /* Cambia esta ruta por la ruta de tu primera imagen */
}

.second {
    background-image: url('../images/mainpage/section2.png'); /* Cambia esta ruta por la ruta de tu segunda imagen */
}

.third {
    background-image: url('../images/mainpage/section3.png'); /* Cambia esta ruta por la ruta de tu segunda imagen */
}

.montserrat-light {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 25px;
    line-height: 1.5; /* Ajusta el interlineado */
    width: 80%;
    margin-left: 4rem;
}

.justfytext {
    text-align: justify;
}

.container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    max-width: 1200px; /* Ancho máximo del contenedor */
    margin: 0 auto; /* Centra el contenedor horizontalmente */
    height: 100%; /* El contenedor ocupa toda la altura de la sección */
}

.row {
    /*display: flex;*/
    flex-wrap: wrap;
    width: 100%;
}

.col {
    flex: 1;
    padding: 20px; /* Añade un poco de relleno alrededor del contenido */
    box-sizing: border-box; /* Incluye el padding en el ancho total */
    overflow: hidden; /* Oculta cualquier desbordamiento del contenido */
}

.t1hts {
    margin-bottom: 30px; /* Espacio debajo del título */
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 37px;
    margin-top: 10%;
    margin-left: 4rem;
}

.t2syc {
    align-self: flex-end;
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 20px;
    margin-bottom: 1rem;
}

.h1section2{
    text-align: left;
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 40px;
    margin-bottom: 6rem; /* Espacio debajo del título */
    /*margin-top: 1.5rem;*/
}

.button-container {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Alinear los botones a la derecha */
    gap: 10px; /* Espacio entre los botones */
    margin-top: 10px; /* Ajustar el margen superior si es necesario */
    width: 100%;
}

.icon-button {
    display: flex;
    align-items: center;
    justify-content: left; /* Centra el contenido dentro del botón */
    padding: 10px 5px; /* Padding ajustado */
    font-family: 'Montserrat', sans-serif;
    font-weight: 900; /* Peso 300 corresponde a Montserrat Light */
    font-size: 70px; /* Tamaño de fuente ajustado */
    border: transparent; /* Bordes del botón */
    border-radius: 5px;
    background-color: transparent; /* Fondo transparente */
    color: white; /* Color del texto */
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    width: 100%; /* Asegura que los botones tengan el mismo ancho */
    max-width: 250px; /* Ancho máximo para limitar el tamaño */
    height: 50px;   
    text-align: left; /* Alinea el texto al centro dentro del botón */
    text-decoration: none; /* Sin subrayado */
    position: relative; /* Necesario para el efecto de subrayado */
    overflow: hidden; /* Necesario para el efecto de subrayado */
    transition: color 0.3s ease; /* Transición suave para el color del texto */
}

.icon-button::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    bottom: 0;
    left: 0;
    background-color: blueviolet;
    transform: scaleX(0);
    transform-origin: bottom right;
    transition: transform 0.3s ease;
}

.icon-button:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.icon-button:hover {
    color: blueviolet; /* Cambio de color del texto al pasar el cursor */
}

.button-icon {
    margin-right: 10px; /* Espacio entre el icono y el texto */
    width: 100px; /* Tamaño del icono ajustado */
    height: auto; /* Altura automática para mantener la proporción */
}

.smaller-button {
    font-size: 30px; /* Tamaño de fuente más pequeño */
    padding: 8px 16px; /* Padding más pequeño */
}



.icons_service{
    width: 110px; /* Tamaño del icono */
    height: 110px;
    align-items: end;
}

.montserrat-light2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 35px;
    line-height: 1.4; /* Ajusta el interlineado */
}

.footer_main{
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 35px;
    color: white;
    text-align: right;
    background-color: #232A55;
}