/**atributos globales**/

:root{
    --fuenteHeading: 'PT Sans', sans-serif;
    --fuenteParrafos: 'Open Sans', sans-serif;
    --primario: #784D3c;
    --gris: #e1e1e1;
    --blanco: #ffffff;
    --negro: #131313;
    --hueso:#e1e1e1;
    --turquesa:#2693CB;
    --turquesa2:#2694cb9f
}
@font-face {
    font-family: 'Avenir'; /* Nombre que le darás a la fuente */
    src: url('/Avenir\ Next.ttc') format('ttc'),
         url('/Avenir\ Next.ttc') format('ttc'); /* Puedes incluir formatos alternativos */
}
p, h1, h2, h3{
    margin: 0;
    padding: 0;
}
h2{
    font-size: 3.5rem!important;
}
.subtitulo{
    font-size: 2rem!important;
}
.titulo{
    font-size: 3.5rem!important;
}
@media (max-width: 768px){
    .subtitulo{
        font-size: 1.8rem!important;
    }
    .titulo{
        font-size: 2rem!important;
    }
}

.bolitaTurquesa {
    background: rgb(38,147,203);
    background: -moz-radial-gradient(circle at top left, rgba(38,147,203,1) 0%, rgba(38,147,203,0) 48%);
    background: -webkit-radial-gradient(circle at top left, rgba(38,147,203,1) 0%, rgba(38,147,203,0) 48%);
    background: radial-gradient(circle at top left, rgba(38,147,203,1) 0%, rgba(38,147,203,0) 48%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2693cb",endColorstr="#2693cb",GradientType=1);
}
.fondoAzul1{
    background-color: rgba(35,32,85,1);
  }
.fondoHueso{
    background-color: #F2F6EE;
    color: var(--negro);
  }
.fondoAzul2{
    background-color: #232055;
}
html{
    box-sizing: border-box; 
    font-size: 62.5%;/* 1 rem = 10 px*/ 
    scroll-behavior: smooth;
}

*, *:before, *:after{
    box-sizing: inherit;
}
body{
    font-family:'Avenir', sans-serif;
    margin: 0;
    font-size: 1.5rem;
    
}
/**globales*/
.contenedor{
    width: 100%;
    margin: 0 auto;
    height: 100vh;
}
a{
    text-decoration: none;
}
/*img{max-width: 100%;}*/
.no-margin{margin: 0;}
.no-padding{padding: 0;}
.centrar-texto{text-align: center;}

/*menu*/

.menu__enlace{
    display: block;
    text-align: center;
    font-size: 1.8rem;
    color: var(--negro);    
}
.logo{
    max-width: 200px;
}
.barra{
    display: flex;
    flex-direction: column;
    justify-content: center;
  
}
@media (min-width: 768px){
    .menu{
        display: flex;
        gap: 2rem;  
    }
    .barra{
        flex-direction: row;  
        justify-content: space-between;
    align-items: center;
    margin: 2rem 0 0 0;
    }
}
.componente{
        width: 100%;
        margin: 0 auto;
        padding: 2rem 5vh 2rem 5vh;
        color: var(--hueso);

    }
@media (min-width: 700px){
        .componente{
            padding: 2rem 10rem 5rem 10rem;
        }
        
}

.componente h2{
        font-size: 3rem;
        }
@media (max-width: 700px){
            .componente h2{
                font-size: 4rem;
                max-width: 100%;
            }
}
@media (max-width: 500px){
.componente h2{
    font-size: 2rem;
    max-width: 100%;
}
}
.slogan{
    font-weight: 400;
    color:var(--hueso);
    padding: 0;
    margin: 0;
    font-size: 1.5rem;
    width: 70%;
}
.slogan strong{
    color:var(--turquesa);
    /*text-shadow: 4px 4px;
  text-shadow: 4px 1px 1px;
  text-shadow: 4px 1px 2px var(--negro);*/
}

.imgPpal{
    display: flex;
    flex-direction: column;
    position:static;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 0;

}
.imgPpal img{
    max-width: 80%;
}
.imgPpal h1{
    margin: 0;
    padding: 0;
    color: var(--hueso);
    font-size: 1.5rem;
}
@media (max-width: 700px){
    .slogan{
        font-weight: 2rem;
    }
    .imgPpal h1{
        font-size: 1rem;
    }
    .imgPpal img{
        max-width: 80%;
    }
    .slogan strong{
        color:var(--turquesa);
        text-shadow: none
    }
}
.cierreSlogan{
    display: flex;
   flex-direction: row;
   justify-content: space-around;
}
.mensajeCierreSlogan{
    font-size: 2rem;
    margin: 10px;
    width: 25%;
}
@media (max-width: 700px) {
    .cierreSlogan {
        padding-top: 10%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .mensajeCierreSlogan {
        margin: 10px;
        width: 100%;
    }
}
.slide2{
    display: grid; 
    /*grid-template-columns: repeat(3, 1fr);*/
    height: 100vh;
    justify-content: center;
    column-width: auto;
}   
.logo__nosotros{
    grid-column: 2/3;
    align-self: center;
}
.logo__nosotrosMob{
    display: none;
}
.logo__nosotrosDesk{
    display: block;
}
.slogan2{
    color: var(--negro);
    /**z-index: 10;**/
}
.slide2__txt--1{
    grid-row: 1/1;
    grid-column: 2/2;
    align-self:end;
    
}
.slide2__txt--2{
    grid-row: 2/3;
    grid-column: 1/2;
    align-self: center;
    
}
.slide2__txt--3{
    grid-row: 2/3;
    grid-column: 3/3;
    align-self: center;
    
}
.slide2__txt--4{
    grid-row: 3/3;
    grid-column: 2/3;
    text-align: start;
    align-self: center;
}


.logo__nosotros{
    grid-row: 1/4;
    grid-column: 2;
    align-self: self-start;
    /*transform: rotate(90deg);*/
}
.logo__nosotrosMob{
    display: none;
}
.logo__nosotrosDesk{
    display: block;
}
.logo__nosotros img{
    width: 100%;
    height: 100vh;
}
.slogan2{
    color: var(--negro);
    font-size: 2rem;
    z-index: 10;
}
    


@media (max-width: 700px) {
    .slide2{
        display: grid; 
        grid-template-columns: 100%;
        grid-template-rows: repeat(3,1fr);
        row-gap: 5%;
        align-items: center;
        grid-auto-rows:max-content;
    }
    .slide2__txt--1{
        grid-column: 1;
        grid-row: 1;
        align-self:center;

    }
    .slide2__txt--2{
        grid-column: 1;
        grid-row: 2;
        align-self: center;
    }
    .slide2__txt--3{
        grid-column: 1;
        grid-row: 3;
        align-self: self-start;
    }
    .slide2__txt--4{
        grid-column: 1;
        grid-row: 4;
        align-self: center;
    }
    .logo__nosotrosMob{
        display: block;
    }
    }
.cierre__Home__proceso{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    flex-direction: row;
    row-gap: 15%;
    justify-content: space-around;
    color: var(--hueso);
    margin-bottom: 5%;
}
@media (max-width: 700px) {
    .cierre__Home__proceso{
       
    }
}

.cierreProcesos1{
    grid-column: 1;
    grid-row: 1/3;
    align-self: center;
    font-size: 3.5rem;
    text-align: center;
}
.cierreProcesos2{
    grid-column: 2;
    grid-row: 1;
}
.cierreProcesos3{
    grid-column: 2;
    grid-row: 2;
}
.cierreHome__servicios{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    column-gap: 5%;
    justify-content: space-around;
}
.cuadroAzul{
    color: var(--hueso);
    background-color: var(--turquesa);
    width: 100%;
    min-height: 40%;
    padding: 2%;
    margin-top: 5%;
    border-radius: 15px;
    padding-bottom: 5%;
}
@media (max-width: 700px) {
.cuadroAzul{min-height: 200px;}
}
.barritaAzul{
    width: 60%;
    height: 10px;
    border-radius: 3px;
    background: rgb(38,147,203);
background: -moz-linear-gradient(90deg, rgba(38,147,203,1) 0%, rgba(48,223,193,1) 98%);
background: -webkit-linear-gradient(90deg, rgba(38,147,203,1) 0%, rgba(48,223,193,1) 98%);
background: linear-gradient(90deg, rgba(38,147,203,1) 0%, rgba(48,223,193,1) 98%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2693cb",endColorstr="#30dfc1",GradientType=1);
}
@media (max-width: 700px) {
    .cierreHome__servicios{
        display: grid;
        grid-template-columns: 100%;
    }
    .cierre__Home__proceso{
        flex-direction: column;
        gap: 5%;
        align-items: center;
        grid-template-columns: 20% 60%;
        row-gap: 15%;
    }
    .cuadroAzul{
        width: 100%;
    }
    .cierre__Home__proceso p{
        width: 100%;
        padding: 2% 0 0 0;
    }
}


/**section**/
.section{
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content:center ;
    align-items: center;
}   

@media (max-width: 700px) {
    .section{
        height: 100%;
    }
}

.menu{
    position: fixed;
}
.subsubtitulo p{
    font-size: 1.6rem!important;
}
.marginBtm5{
    margin-bottom: 5%;
}