@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


/*-------------Barra-de-control-de-variables-----------------------*/

:root{
    --opacidad-pg-ico: 0.6;

    --tipografia-principal: "Inter", sans-serif;

    --titulos: 3.2vw;
    --titulos-grosro-texto: 800;

    --parrafos: 1vw;

    /*Estilos-de-texto-principal*/
    --color-principal: #003feb;
    --color-principal-variable1: #000000;
    --color-principal-variable2: #0023be;
    --color-principal-variable3: #0084ff;
    --color-principal-variable4: #0084ff;
    --color-principal-variable5: #00509b;

    /*Estilos-de-texto-secundario*/
    --color-secundario: #ffffff;
    --color-secundario-variable1: #070707;
    --color-secundario-variable2: #dadada;
    --color-secundario-variable3: #181818;
    --color-secundario-variable4: #d4d4d4;
    --color-secundario-variable5: #f0f0f0;
    --color-secundario-variable6: #ffffff;

    --fondo-portada-pagina: linear-gradient(rgb(0, 0, 0), rgb(0, 0, 0)), url(/Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo-especial-3.jpg);
    
    --fondo-pagina: linear-gradient(rgba(12, 12, 12, 0.932),rgba(8, 8, 8, 0.856)), url(Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo.jpg);

    --fondo-secciones-especiales: linear-gradient(rgba(0, 0, 0, 0.747), rgba(0, 0, 0, 0.774)), url(/Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo-especial-3.jpg);
}


/*Estilos-basicos*/
body{
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0;
    padding: 0;
    font-family: var(--tipografia-principal);
    background: var(--color-secundario-variable1);
}

/*Estilos-Barra-de-scroll*/
::-webkit-scrollbar { 
    width: 3px; 
    height: 100%; 
    transition: 0.3s;
  }
  
  ::-webkit-scrollbar-track { 
    background: var(--color-secundario-variable3); 
  }
  
  ::-webkit-scrollbar-thumb { 
       border-radius: 20px;
        background: var(--color-secundario-variable4);
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background: var(--color-secundario);
  }

/*--------------Barra-Navegación--------------*/
.B-Navegacion{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    top: 0;
    width: 100%;
    backdrop-filter: blur(10px); /* Aplica el desenfoque al fondo detrás de la barra */
    -webkit-backdrop-filter: blur(10px); /* Para compatibilidad con algunos navegadores */
    position: fixed;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.425); /* Fondo ligeramente transparente para ver el efecto*/
}

.B-Navegacion a{
    text-decoration: none;
    color: var(--color-secundario);
}

.B-Navegacion svg{
    width: 0.6rem;
    min-width: 0.8vw;
    max-width: 0.6rem;
    fill: var(--color-secundario);
}

.logo{
    display: flex;
    align-items: center;
    margin: 0px 0px 0px 0px;
    padding: 0px 0vw 0px 2vw;
}

.logo h3{
    font-weight: 800;
    font-size: 0.8vw;
    margin: 0px 0px 0px 0px;
    padding: 0px 0vw 0px 1vw;
}

.logo svg{
    width: 0.8rem;
    min-width: 1vw;
    max-width: 0.8rem;
}

.login {
    border: none;
    align-items: center;
    display: flex;
    cursor: pointer;
    padding: 1.6vh 2vw 1.6vh 2vw;
    border-bottom-left-radius: 5vw;
    transition: background-color 0.3s ease; /* Transición de color suave */
    color: var(--color-secundario);
    background-color: var(--color-principal); /* Color del botón */
}

.login h3{
    font-size: 1vw;
    padding: 0vh 0vw 0vh 0vw;
    margin: 0vh 1vw 0vh 0vw;
    color: var(--color-secundario);
}

.login img{
    width: 1rem;
    min-width: 1vw;
    max-width: 1rem;
    border-radius: 10vw;
    margin: 0vh 0vw 0vh 0vw;
    background-color: var(--color-secundario-variable5); /* Color del botón */
}

.login:hover {
    background-color: var(--color-principal-variable2); /* Color al pasar el cursor por encima */
}

/*------------Barra-Navegación-iconos-----------*/
.cont-Barra-N{
    display: flex;
    justify-content: space-between;
    gap: 2vw;
    z-index: 1000;
    margin: 0vh 0vw 0vh 0vw ;
}

.cont-Barra-N div{
    display: flex;
    align-items: center;
    padding: 0px 0px 0px 0vw;
}

.cont-Barra-N div:hover{
    transition: 0.3s;
    opacity: 60%;
}

.cont-Barra-N div h3{
    font-size: 1vw;
    padding: 0px 0px 0px 0.5vw;
}

.Pg-ico-1 svg, .Pg-ico-2 svg, .Pg-ico-3 svg, .Pg-ico-4 svg{
    fill: var(--color-secundario);
}

.Pg-ico-1 h3, .Pg-ico-2 h3, .Pg-ico-3 h3, .Pg-ico-4 h3{
    color: var(--color-secundario);
}

.Pg-ico-1, .Pg-ico-2, .Pg-ico-3, .Pg-ico-4{
    opacity: var(--opacidad-pg-ico);
}

/*------------------Sección-Portada-----------------------*/
.Sec-Portada{
    background-repeat: no-repeat;
    background-size: cover;
    background-image: var(--fondo-portada-pagina);
    position: relative; /* Clave para el posicionamiento del video */
    overflow: hidden; /* Opcional, para que el video no se salga */
}

.video-fondo-elemento {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Overlay semitransparente opcional para mejorar la legibilidad */
.contenedor-con-video::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    z-index: 0;
}


.caja-fondo-texto{
    position: relative; /* Asegura que el contenido quede encima del video */
    z-index: 1; /* Opcional, si hay otros elementos */
    background-color: rgba(0, 0, 0, 0.63);
}


.Sec-Portada a{
    text-decoration: none;
}

.cont-Portada-elementos{
    width: 100%;
    height: 91vh;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 0px 0px 0px;
    padding: 0vh 0vw 0vh 0vw;
}

.Portada-elementos{
    text-align: center;
    justify-content: center;
    margin: 3.5rem 0vw 0px 0vw ;
}

.Portada-elementos span{
    font-size: 1.3vw;
    font-style: italic;
    font-weight: var(--titulos-grosro-texto);
    margin: 0px 0px 0px 0px ;
    color: var(--color-secundario);
}

.Portada-elementos h2{
    font-size: 5.3vw;
    letter-spacing: 1px;
    line-height: 0.9;
    font-weight: var(--titulos-grosro-texto);
    margin: 1.5rem 0vw 0px 0px;
    color: var(--color-secundario);
}

.Portada-elementos strong{
    font-size: 5vw;
    font-style: italic;
    font-weight: var(--titulos-grosro-texto);
    margin: 0rem 0vw 0rem 0vw ;
    color: var(--color-principal);
}

.Portada-elementos p{
    font-size: var(--parrafos);
    margin: 1.5rem 30vw 1.8rem 30vw ;
    color: var(--color-secundario-variable2);
}

.Metrica-logro{
    gap: 2vw;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: 0rem 0vw 2.5rem 0px ;
}

.cont-metrica-ico-text{
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.Metrica-logro h4{
    font-size: 1.2vw;
    margin: 0px 0vw 0px 0vw ;
    color: var(--color-secundario);
}

.Metrica-logro img{
    width: 2vw;
    margin: 0px 0.1vw 0px 0px;
}

.Metrica-logro svg{
    width: 2vw;
    margin: 0px 0.1vw 0px 0px;
    fill: var(--color-secundario);
}

.Portada-elementos a{
    font-weight: var(--titulos-grosro-texto);
    border-radius: 6vw;
    text-decoration: none;
    font-size: 1.2vw;
    margin: 0px 0px 0rem 0px ;
    padding: 2vh 4vw 2vh 4vw;
    transition: 0.3s;
    color: var(--color-secundario);
    background: var(--color-principal)
}

.Portada-elementos a:hover{
    color: var(--color-secundario);
    background: var(--color-principal-variable2)
}

.Portada-elementos a:focus{
    color: var(--color-secundario);
    background: var(--color-principal-variable2)
}

.barra-contacto{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 1.5vw 2vh 2vw;
}

.barra-contacto h4{
    font-size: 1.1vw;
}

.barra-contacto svg{
    width: 1.8vw;
    margin: 0px 1vw 0px 0px;
    fill: var(--color-secundario);
}

.barra-contacto svg:hover{
    opacity: 70%;
}

.b-cnt-correo a{
    text-decoration: none;
    display: flex;
    align-items: center;
    color: var(--color-secundario);
}

.b-cnt-correo a:hover{
    opacity: 80%;
}



/*------------------Contenido-Principal-------------------*/

.Sec-Contenido-Principal{
    text-align: center;
    margin: 10vh 8vw -2vh 8vw;
    z-index: 0;
}

.Sec-Contenido-Principal h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-Principal p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.texto-centro-margen{
    margin: 0vh 15vw 0vh 15vw;
}

.texto-lateral1-margen{
    margin: 0vh 30vw 0vh 0vw;
}

.cont-Contenido{
    display: flex;
    justify-content: center;
    gap: 2vw;
}

.contenedor-Contenido { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    transition: 0.3s;
}

.contenedor-Contenido:hover{ 
    filter: brightness(130%);
}

.contenedor-Contenido img {
    width: 100%;
    height: 20rem;
    object-fit: cover;
}

.contenedor-Contenido video{
    width: 100%;
    height: 20rem;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.contenedor-Contenido:hover video { 
    transform: scale(1.1); 
}

.texto-1 { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 25px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.096), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.texto-1 h4{
    font-size: 1.4vw;
    margin: 1.5rem 3vw 0.4rem 0vw;
    color: var(--color-secundario-variable5);
}

.texto-1 p{
    font-size: var(--parrafos);
    margin: 0vh 2vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.texto-1 small{
    font-size: 1.1vw;
    font-weight: 700;
    border-radius: 6vw;
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable5);
    background: var(--color-principal);
}




/*------------------areas-interes-------------------*/

.Sec-Contenido-bloques-tip1{
    text-align: start;
    margin: 7rem 8vw -8vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip1 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip1 p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip1{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .cont-elementos-Bloque-tip1{
    display: flex;
    justify-content: center;
    gap: 2vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .elementos-tip1{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip1, .bloque2-tip1, .bloque3-tip1, .bloque4-tip1 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque1-tip1{ 
  margin: 0vh 0vw 0vh 0vw;
}

.bloque4-tip1{ 
  margin: 0vh 0vw 1.5vh 0vw;
}

.bloque1-tip1:hover, .bloque2-tip1:hover, .bloque3-tip1:hover, .bloque4-tip1:hover{ 
    filter: brightness(130%);
}

.bloque1-tip1 img{
    width: 80vw;
    height: 26rem;
    object-fit: cover;
}

.bloque1-tip1 video {
    width: 80vw;
    height: 26rem;
    object-fit: cover;
}

.bloque2-tip1 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.bloque3-tip1 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.bloque4-tip1 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.Sec-Contenido-bloques-tip1 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 25px 1.5vw ;
    color: var(--color-secundario-variable5);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
}

.Sec-Contenido-bloques-tip1 .texto h4{
    font-size: 1.6vw;
    margin: 1.5rem 3vw 0.4rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip1 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 3vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip1 .texto small{
    font-size: 1.1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}

#textbloque1-primario p{
    margin: 0vh 5vw 0vh 0vw;
}



/*------------------Sec-Servicios-Planes-----------------------*/
.Servicios-Planes{
    margin: 18vh 0vw -3vh 0vw;
    padding: 10vh 8vw 10vh 8vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: var(--fondo-secciones-especiales);
}

.Servicios-Planes h2{
    text-align: center;
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: -1vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Servicios-Planes p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.Servicios-Planes a{
    text-decoration: none;
}

.servicio{
    width: 27vw;
    overflow: hidden;
    height: 100%;
    border-radius: 0.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 15px 0vw;
    transition: 0.3s;
    background: var(--color-principal-variable1);
}

.serv2{
    background: var(--color-principal);
}

.serv2:hover{
    filter: brightness(110%);
}

.serv1:hover, .serv3:hover{
    background: var(--color-secundario-variable1);
}

.servicio img{
    width: 100%;
    height:25vh;
    object-fit: cover;
    margin: 0vh 0vw 0vh 0vw;
}

.servicio h3{
    text-align: start;
    color: var(--color-secundario);
    font-size: 1.7vw;
    margin: 20px 2vw 0vh 2vw;
}

.servicio strong{
    text-align: start;
    font-size: 1.7vw;
    margin: 0px 0vw 0vh 0.3vw;
    color: var(--color-principal-variable4);
}

.servicio p{
    text-align: start;
    font-size: var(--parrafos);
    color: var(--color-secundario-variable2);
    margin: 0.7rem 2vw 0vh 2vw;
}

.serv2 h3{
    text-align: start;
    font-size: 1.7vw;
    margin: 20px 2vw 0vh 2vw;
    color: var(--color-secundario);
}

.serv2 strong{
    text-align: start;
    font-size: 1.7vw;
    margin: 0px 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.serv2 p{
    text-align: start;
    font-size: var(--parrafos);
    margin: 0.7rem 2vw 0vh 2vw;
    color: var(--color-secundario-variable2);
}

.servicio a{
    color: var(--color-secundario);
    text-decoration: none;
}

.servicio a:hover{
    color: var(--color-secundario-variable5);
    text-decoration: none;
}


.Plan{
    width: 27vw;
    height: 100%;
    background: var(--color-principal-variable1);
    border-radius: 0.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 0vh 0vw;
    transition: 0.3s;
}

.Plan2{
    background: var(--color-principal);
}

.Plan2:hover{
    filter: brightness(110%);
}

.Plan1:hover, .Plan3:hover{
    background: var(--color-secundario-variable1);
}

.Plan img{
    width: 2rem;
    min-width: 2.5vw;
    max-width: 2rem;
    object-fit: cover;
    margin: 3vh 0vw 0vh 0vw;
}

.Plan svg{
    fill: var(--color-secundario);
    width: 2rem;
    min-width: 2.5vw;
    max-width: 2rem;
    object-fit: cover;
    margin: 3vh 0vw 0vh 0vw;
}

.Plan h3{
    text-align: center;
    font-size: 1.7vw;
    margin: 10px 4vw 0vh 4vw;
    color: var(--color-secundario);
}

.Plan samp{
    font-size: 2vw;
    margin: 0vh 0vw 0vh 0.3vw;
    color: var(--color-principal-variable4);
}

.Plan p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 15px 4vw 20px 4vw;
}

.Plan small{
    font-weight: 700;
    text-align: start;
    font-size: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-principal-variable4);
}

.Plan ul{
    height: 12rem;
    overflow: scroll;
    text-align: start;
    font-size: var(--parrafos);
    margin: 15px 4vw 20px 4vw;
    padding: 0vh 4vw 20px 2vw;
    color: var(--color-secundario-variable2);
}

.Plan ul::-webkit-scrollbar-track { 
    border-radius: 25px;
}

.Plan ul::-webkit-scrollbar { 
    width: 3px; 
}

.Plan li{
    margin: 15px 0vw 0vh 0vw;
}

.Plan2 h3{
    text-align: center;
    font-size: 1.7vw;
    margin: 10px 4vw 0vh 4vw;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario);
}

.Plan2 small{
    font-size: 1.5vw;
    margin: 2vh 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.Plan2 samp{
    font-size: 2vw;
    margin: 0vh 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.Plan2 p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 15px 4vw 20px 4vw;
    color: var(--color-secundario-variable2);
}

.Plan2 ul{
    text-align: start;
    font-size: var(--parrafos);
    margin: 12px 4vw 12px 4vw;
    color: var(--color-secundario-variable2);
}

.Plan a{
    text-decoration: none;
    color: var(--color-secundario);
}

.Plan a:hover{
    text-decoration: none;
    color: var(--color-secundario-variable5);
}




/*------------------Contenido-blog-------------------*/

.Sec-Contenido-bloques-tip2{
    text-align: start;
    margin: 12vh 8vw -7vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip2 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip2 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip2{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.cont-elementos-tip2{
    display: block;
    justify-content: center;
    gap: 0vw;
    width: 100%;
    height: 100%;
}

.elementos-tip2{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip2, .bloque2-tip2, .bloque3-tip2, .bloque4-tip2 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque2-tip2{ 
  margin: 1.5vh 0vw 0vh 0vw;
}

.bloque1-tip2:hover, .bloque2-tip2:hover, .bloque3-tip2:hover, .bloque4-tip2:hover{ 
    filter: brightness(130%);
}

.bloque1-tip2 img{
    width: 80vw;
    height: 26rem;
    object-fit: cover;
}

.bloque1-tip2 video {
    width: 80vw;
    height: 26rem;
    object-fit: cover;
}

.bloque2-tip2 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.bloque3-tip2 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.bloque4-tip2 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.Sec-Contenido-bloques-tip2 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 25px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip2 .texto h4{
    font-size: 1.6vw;
    margin: 1.5rem 3vw 0.4rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip2 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip2 .texto small{
    font-size: 1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}




/*------------------Contenido-Enfoques-------------------*/

.Sec-Contenido-bloques-tip3{
    text-align: start;
    margin: 5rem 8vw 0vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip3 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip3 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip3{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.cont-elementos-tip3{
    display: block;
    justify-content: center;
    gap: 0vw;
    width: 100%;
    height: 100%;
}

.elementos-tip3{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloques1-tip3, .bloques2-tip3, .bloques3-tip3, .bloques4-tip3 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloques1-tip3{ 
    width: 70vw;
    height: 100%;
    margin: 0vh 0vw 0vh 0vw;
}

.bloques4-tip3{ 
    margin: 2vh 0vw 0vh 0vw;
}

.caja-especial{ 
    width: 100%;
    height: 20rem;
    margin: 0vh 0vw 0vh 0vw;
}

.caja-especial p{ 
    width: 57%;
    margin: 0vh 0vw 0vh 0vw;
}

.bloques1-tip3:hover, .bloques2-tip3:hover, .bloques3-tip3:hover, .bloques4-tip3:hover{ 
    filter: brightness(130%);
}

.bloques1-tip3 img, .bloques2-tip3 img, .bloques3-tip3 img, .bloques4-tip3 img{
    width: 100%;
    height: 12.5rem;
    object-fit: cover;
}

.caja-especial img{ 
    width: 100%;
    height: 20rem;
    object-fit: cover;
}

.caja-especial video{ 
    width: 100%;
    height: 20rem;
    object-fit: cover;
}


.Sec-Contenido-bloques-tip3 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 25px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip3 .texto h4{
    font-size: 1.6vw;
    margin: 1.5rem 3vw 0.4rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip3 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 2vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip3 .texto small{
    font-size: 1.1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}


/*--------------------------------------------------------------------------*/

.cont-Pbl-tp-3{
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 1vw;
    margin: 1.5rem 0vw 0vh 0vw;
    padding: 2rem 2vw 2rem 2vw;
    border-radius: 0.5vw;
    background: var(--color-principal-variable2);
  }
  
  .Descrp-Pbl-tp-3{
  width: 45vw;
  margin: 0vh 0vw 0vh 0vw;
  padding: 0vh 0vw 0vh 0vw;
  }
  
  .Descrp-Pbl-tp-3 h3{
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.7rem 0vw;
    font-size: 2.3vw;
    color: var(--color-secundario);
  }
  
  .Descrp-Pbl-tp-3 p{
  margin: 0vh 0vw 0vh 0vw;
  font-size: var(--parrafos);
  color: var(--color-secundario-variable2);
  }
  
  .cont-img-Pbl-tp-3{
    display: flex;
    text-align: center;
    gap: 5vw;
}

.img-Pbl-tp-3{
    text-align: center;
    width: 100%;
}

.img-Pbl-tp-3 h5{
    margin: 5px 0vw 0vh 0vw;
    font-size: 1.2vw;
    font-weight: 800;
    color: var(--color-secundario);
}

.img-Pbl-tp-3 img{
    height: 3vw;
    width: 3vw;
    object-fit: cover;
}

.img-Pbl-tp-3 svg{
    fill: var(--color-secundario);
    height: 3vw;
    width: 3vw;
    object-fit: cover;
}





/*------------------Area-Contacto-------------------------*/

.Sec-contacto{
    text-align: center;
    margin: 7rem 8vw 0vh 8vw;
}

.Sec-contacto h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-contacto p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont{
    display: flex;
    gap: 2vw;
    width: 100%;
    margin: 0rem 0vw 0vh 0vw;
}

.cont a{
    font-size: 1.2vw;
    text-decoration: none;
    color: var(--color-principal-variable3);
}

.cont a:hover{
    text-decoration:underline;
}

.inf{
    width: 100%;
    margin: 1.2rem 0vw 0vh 0vw;
}

.ico{
    gap: 1vw;
    display: flex;
    align-items: center;
    opacity: 80%;
    margin: 0vh 0vw 0vh 0vw;
}

.ico h3{
    font-size: 1.5vw;
    color: var(--color-secundario);
    margin: 0vh 0vw 0vh 0vw;
}

.ico svg{
    width: 1.5rem;
    min-width: 1.5vw;
    max-width: 1.5rem;
    fill: var(--color-secundario);
}

.inf hr{
    opacity: 30%;
    margin: 1rem 0vw 1rem 0vw;
}

.ico-inf{
    gap: 1vw;
    display: flex;
    align-items: center;
    margin: 1.5rem 0vw 0vh 0vw;
    opacity: 80%;
}

.ico-inf h4{
    font-size: 1.2vw;
    margin: 0vh 0vw 0vh 0vw;
}

.inf h4{
    color: var(--color-secundario);
}

.ico-inf svg{
    width: 1.1rem;
    min-width: 1.3vw;
    max-width: 1.1rem;
    fill: var(--color-secundario);
}

.redes{
    text-align: start;
    margin: 2.5rem 0vw 1rem 0vw;
}

.cont-redes{
    gap: 1.3vw;
    display: flex;
    margin: 1rem 0vw 1rem 0vw;
    text-align: start;
}

.ico-redes{
    gap: 0.5vw;
    display: flex;
    align-items: center;
    opacity: 80%;
}

.cont-redes a{
    color: var(--color-secundario);
    font-size: var(--parrafos);
    text-decoration: none;
}

.ico-redes svg{
    width: 1rem;
    min-width: 1vw;
    max-width: 1rem;
    padding: 1.5vh 1vw 1.5vh 1vw;
    border-radius: 50%;
    fill: var(--color-secundario-variable6);
    background: var(--color-secundario-variable3);
    transition: 0.3s;
    font-size: var(--parrafos);
}

.ico-redes svg:hover{
    opacity: 80%;
}

.cont-redes h5{
    font-size: 1vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario);
}

.ubicacion{
    margin: 0vh 0vw 0vh 0vw;
}

.ubicacion iframe{
    height: 20rem;
    min-width: 45vw;
    max-width: 30vw;
    border-radius: 0.5vw;
    background: var(--color-secundario-variable4);
}



/*-----------------------------Horario-Atención-----------------------------*/
.Sec-Horario-Atencion{
    margin: 4rem 8vw 0vh 8vw;
}

.Sec-Horario-Atencion h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Horario-Atencion p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.Horario-Atencion{
    display: flex;
    gap: 2vw;
    margin: 0vh 0vw 0vh 0vw;
}


.ico-horario-aten-espacial{
    display: flex;
    gap: 2vw;
    align-items: center;
    min-width: 20vw;
    padding: 2rem 2vw 2rem 2vw;
    border-radius: 0.5vw;
    background: var(--color-principal-variable2);
}

.ico-horario-aten-espacial img{
    width: 4rem;
    min-width: 4.5vw;
    max-width: 4rem;
    margin: 0vh 0vw 0vh 0vw;
}

.ico-horario-aten-espacial svg{
    fill:var(--color-secundario);
    width: 4rem;
    min-width: 4.5vw;
    max-width: 4rem;
    margin: 0vh 0vw 0vh 0vw;
}

.text-descrip2 h4{
    color: var(--color-secundario-variable5);
    font-weight: var(--titulos-grosro-texto);
    font-size: 1.7vw;
    margin: 0vh 0vw 0.5rem 0vw;
}

.text-descrip2 p{
    color: var(--color-secundario-variable4);
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
}


.Ten2{
    background: var(--color-secundario-variable3);
}




.scroll-wrapper {
    position: relative;
    margin-bottom: 0px; /* Espacio entre las secciones */
    margin: 0vh 0vw -2vh 0vw;
}

    .scroll-container {
        gap: 1.5vw;
        display: flex;
        overflow-x: auto;
        scroll-behavior: smooth;
        padding: 10px;
        border-radius: 1vw;
        margin: -1.5vh -1vw -2vh -1vw;
    }
    
    .scroll-container::-webkit-scrollbar {
        display: none; /* Ocultar scrollbar por defecto */
    }

    .scroll-item {
        flex: 0 0 auto; /* Evita que los elementos se redimensionen */
        text-align: center;
    }

    .scroll-button {
        position: absolute;
        cursor: pointer;
        border: none;
        font-size: 2.5vw;
        border-radius: 50%;
        width: 2rem;
        min-width: 3.5vw;
        max-width: 2rem;
        height: 2rem;
        min-height: 3.5vw;
        max-height: 2rem;
        margin: 0vh -2vw 0vh -2vw;
        top: 50%;
        z-index: 1;
        color: var(--color-secundario-variable5);
        background-color: var(--color-principal);
        transform: translateY(-50%);
    }

    .scroll-button.left {
        left: 0;
    }

    .scroll-button.right {
        right: 0;
    }



/*-------------------------Carrucel-img------------------------*/

.carousel {
    position: relative;
    height: 18rem;
    overflow: hidden;
    margin: 4rem 3rem 0vh 3rem;
    border-radius: 0.5vw;
    transition: 0.3s;
}

.carousel:hover{
    filter: brightness(130%);
}

.carousel a{
    text-decoration: none;
}

.carousel img{
    width: 100%;
    height: 18rem;
    object-fit: cover;
}

.cont-text-img{
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 0vw 1.5rem 2vw;
    background: linear-gradient(to bottom, #00000000, #000000);
}

.cont-text-img h4{
    font-size: 2.5vw;
    margin: 0px 0px 0.3rem 0px;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario-variable5);
}

.cont-text-img p{
    font-size: var(--parrafos);
    margin: 0vh 50vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.slide {
    display: none;
}

.slide.visible {
    display: block;
}

.controls {
    text-align: center;
    margin: 0.5rem 0vw 0vh 0vw;
}

.control {
    cursor: pointer;
    width: 2rem;
    height: 0.2rem;
    border: none;
    margin: 0 2px;
    background-color: var(--color-secundario-variable3);
}

.control:hover{
    filter: brightness(150%);
}

.control.active {
    background-color: var(--color-principal);
}


/*---------------------Cont-Blog---------------------------*/
.cont-Sec-blog{
    margin: -1vh 8vw 1vh 8vw;
}

.cont-Sec-blog h1{
    font-size: var(--titulos);
    margin: 1vh 0vw 0rem 0vw;
    color: var(--color-secundario);
}

.cont-Sec-blog p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Sec-blog hr{
    opacity: 15%;
    margin: 0vh 0vw 1.8rem 0vw;
}



/*---------------Cont-Blog-Controles-Mando-----------------*/
.cont-indice{
    display: flex;
    gap: 1.5vw;
    margin: 0vh 0vw 2rem 0vw;
}

.cont-indice a{
    text-decoration: none;
}

.boton {
    border: none;
    border-radius: 2vw;
    font-size: 1vw;
    cursor: pointer;
    margin: 0vh 0vw 0vh 0vw;
    padding: 1.5vh 1.8vw 1.5vh 1.8vw;
    transition: 0.3s;
    color: var(--color-secundario);
    background-color: var(--color-secundario-variable3); /* Color original */
}

.boton:hover{
    transition: 0.3s;
    color: var(--color-secundario-variable5);
    background:  var(--color-principal); /* Color original */
}

.clicked {
    color: var(--color-secundario-variable5);
    background:  var(--color-principal-variable2); /* Nuevo color al hacer clic */
}

.indice-categorias{
    border-radius: 3vw;
    margin: 0rem 0vw 1rem 0vw;
    padding: 1.8vh 2vw 1.8vh 2vw;
    background: var(--color-secundario);
}

.indice-categorias h4{
    font-size: 1vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable5);
}



/*-----------------Sec4-Contenido-Blog-------------------*/

.Cont-Sec{
    font-size: 1.8vw;
    margin: 0vh 8vw 2.5rem 8vw;
}

.Estructura-Seccion{
    display: flex;
    gap: 0.8vw;
    align-items: center;
    margin: 0vh 0vw 1.5rem 0vw;
}

.Estructura-Seccion img{
    height: 1.1rem;
    min-height: 1.5vw;
    max-height: 1.1rem;
background: none;
}

.Estructura-Seccion svg{
    height: 2vw;
    fill: var(--color-secundario);
}

.Estructura-Seccion h3{
    font-size: 1.3vw;
    font-weight: 800;
    color: var(--color-secundario);
    margin: 0vh 0vw 0px 0px;
}

.Articulos, .Documentaciones{
    display: flex;
    flex-wrap: wrap;
    gap: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
}


    .Estructura-Articulo-Documentacion{
        flex: 1 1 25vw;
        max-width: 30vw;
        position: relative;
        width: 100%;
        background: var(--color-secundario-variable3);
        overflow: hidden;
        border-radius: 0.5vw;
        margin: 0vh 0vw 0vh 0vw;
        padding: 0px 0px 0vh 0px;
        transition: 0.3s;
    }

    .Estructura-Articulo-Documentacion:hover{
        filter: brightness(120%);
    }

    
    .Estructura-Articulo-Documentacion a{
        color: var(--color-secundario);
        text-decoration: none;
    }
    
    .cont-sec-estructura{
        display: block;
    }

    .cont-sec-estructura img{ 
    width: 100%;
    height: 5rem;
    object-fit: cover;
    background: var(--color-secundario-variable3);
    }
    
    .cont-descrip-articulo-documentacion{
        display: block;
        margin: 0vh 1vw 0vh 1vw;
    }
    
    .cont-inf{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 1vh 0vw 0.5rem 0vw;
    }
    
    .inf-articulo-documentacion{
        display: flex;
        align-items: center;
    }
    
    .inf-articulo-documentacion img{
        width: 1.5rem;
        min-width: 1.5vw;
        max-width: 1.5rem;
        height: 1.5rem;
        min-height: 1.5vw;
        max-height: 1.5rem;
        margin: 0px 0.8vw 0px 0px;
        border-radius: 50%;
        object-fit: cover;
        background: var(--color-secundario-variable3);
    }
    
    .cont-inf-autor-arti h6{
        font-size: 1.1vw;
        margin: 1vh 0vw -0.6rem 0vw;
        color: var(--color-secundario);
    }
    
    .cont-inf-autor-arti small{
        font-size: 0.8vw;
        margin: 0px 0vw 0px 0vw;
        color: var(--color-secundario-variable2);
    }
    
    .ico-tipo-informacion{
        display: flex;
        gap: 0.8vw;
        align-items: center;
    }

    .ico-tipo-informacion img{
    height: 1.1rem;
    min-height: 1.5vw;
    max-height: 1.1rem;
    background: none;
    }

    .ico-tipo-informacion svg{
        height: 1.7vw;
        fill: var(--color-secundario);
    }
    
    .cont-resumen-articulo{
        height: 100%;
        margin: 1rem 1vw 1.5rem 1vw;
        padding: 0vh 0vw 0vh 0vw;
    }
    
    .cont-resumen-articulo h3{
        font-size: 1.3vw;
        line-height: 1.1;
        font-weight: var(--titulos-grosro-texto);
        text-align: start;
        margin: 0vh 0vw 0.5rem 0vw;
        color: var(--color-secundario);
    }
    
    .cont-resumen-articulo p{
        font-size: var(--parrafos);
        margin: 0vh 0vw 0vh 0vw;
        color: var(--color-secundario-variable2);
    }




/*------------------Noticias--------------------*/

.contenedor-noticia{ 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 27vw;
    height: 13.5rem;
    transition: 0.3s;
}

.contenedor-noticia{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-noticia a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-noticia:hover{ 
    filter: brightness(120%);
}

.contenedor-noticia img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-noticia video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 35vh 0vw 1.5rem 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.texto h4{
    font-size: 1.3vw;
    margin: -0.5rem 5vw 0.5rem 0vw;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario-variable5);
}

.texto p{
    font-size: var(--parrafos);
    color: var(--color-secundario-variable4);
    margin: 0vh 5vw 0vh 0vw;
}

.cont-inf-autor-arti h6{
    font-size: 1.1vw;
    margin: 1vh 0vw -0.6rem 0vw;
    color: var(--color-secundario);
}

.cont-inf-autor-arti small{
    font-size: 0.8vw;
    margin: 0px 0vw 0px 0vw;
    color: var(--color-secundario-variable2);
}

.texto .ico-tipo-informacion{
    margin: 0vw 0vw 0rem 8rem;
}

.cont-img-noticia{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1rem 0vw;
}

.cont-img-noticia img{
    width: 1.5rem;
    min-width: 1.5vw;
    max-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5vw;
    max-height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}

/*------------------Contenido--------------------*/

.contenedor-video{ 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 27vw;
    height: 13.5rem;
    transition: 0.3s;
}

.contenedor-video{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-video a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-video:hover{ 
    filter: brightness(120%);
}

.contenedor-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cont-img-video{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1rem 0vw;
}

.cont-img-video img{
    width: 1.5rem;
    min-width: 1.5vw;
    max-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5vw;
    max-height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}



/*--------------------------------------------------------------------------*/

.texto-lateral1-margen{
    text-align: start;
    margin: 0vh 30vw 0vh 0vw;
}

.texto-lateral1-margen-Tt-Pricpl{
    text-align: start;
    margin: 3rem 30vw 0vh 0vw;
}

.texto-lateral2-margen{
    text-align: start;
    margin: 0vh 30vw 0vh 0vw;
}

.texto-lateral1-margen h1{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    font-size: 3.5vw;
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.texto-lateral1-margen-Tt-Pricpl h1{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.texto-lateral1-margen p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.texto-centro-margen{
    text-align: center;
}



  footer {
    color: var(--color-secundario);
  text-align: center;
  margin: 10vh 0vw 5vh 0vw;
  opacity: 50%;
  }
  
  footer h6{ 
  margin: 0vh 0vw 0vh 0vw;
  }

  .enlaces-princiáles{
    display: flex;
    justify-content: center;
    gap: 3vw;
    margin: 3vh 0vw 5vh 0vw;
  }
  
  .enlaces-princiáles a{
    font-size: 1.1vw;
    font-weight: 600;
    text-decoration: none;
    color: var(--color-secundario);
  }
  
  .enlaces-princiáles a:hover{
    text-decoration: underline;
  }



    /*------------------Cont-Complementos------------------*/
.cont-complementos{
    margin: 5rem 8vw 5rem 8vw;
  }


  /*--------------------------------------------------------*/

        /* Estilos generales y variables para un look minimalista y moderno */
        :root {
          --carousel-speed: 30s; /* Velocidad de la animación */
          --card-width: 340px; /* Ancho ligeramente mayor */
          --gap-spacing: 32px; /* Espacio entre tarjetas aumentado */
          --total-cards: 5; /* Este valor es sobreescrito por JS */
      }

      .carousel-container h5 {
        font-size: 2vw; /* Título más grande y enfocado */
        color: var(--color-secundario);
        margin: 0rem 0vw 0.5rem 0vw;
        text-align: start;
        font-weight: 800;
      }

      .carousel-container p {
        font-size: var(--parrafos);
        color: var(--color-secundario-variable2);
        margin: 0vh 0vw 1.5rem 0vw;
      }


/* Contenedor principal que oculta el overflow */
.carousel-container {
  width: 100%;
  max-width: 1200px;
  overflow: hidden;
  margin: 0vh 0vw 3rem 0vw;
}

/* Pista que contiene todas las tarjetas */
.carousel-track {
  display: flex;
  gap: 1.5vw;
  /* Animación de movimiento infinito */
  animation: scroll 150s linear infinite;
}


/* Definición de la animación de scroll */
@keyframes scroll {
  0% { transform: translateX(0); }
  100% { 
      /* Fórmula para el desplazamiento infinito */
      transform: translateX(calc(-1 * (340px + 32px) * 5)); 
  }
}

/* Clase para pausar la animación */
.carousel-track.paused {
  animation-play-state: paused;
}

/* Diseño de cada tarjeta de testimonio - Minimalista */
.testimonial-card {
  flex-shrink: 0;
  width: var(--card-width);
  background: var(--color-secundario-variable3);
  padding: 2.5vh 2.5vw 2.5vh 2.5vw;; /* Aumento de padding interno */
  border-radius: 1vw;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border: none; /* Eliminamos el borde duro */
  cursor: pointer;
}

.testimonial-card:hover {
  transform: translateY(-8px); /* Elevación más notable */
  box-shadow: 0 4px 12px rgba(255, 255, 255, 0.137); /* Sombra inicial muy sutil */
}

/* Contenido del testimonio */
.testimonial-text {
  font-size: var(--parrafos); /* Fuente más grande para el texto */
  color: var(--color-secundario-variable2);
  line-height: 1.7;
  font-style: normal;
  position: relative;
  padding-top: 20px; /* Espacio para la comilla */
  margin: 0vh 0vw 0rem 0vw;
}

.testimonial-card p{
  font-size: var(--parrafos);
  color: var(--color-secundario-variable2);
  margin: 0vh 0vw 1rem 0vw;
}


/* Estilo para la comilla de apertura (detalle moderno) */
.testimonial-text::before {
  content: '“';
  font-size: 2rem;
  color: var(--color-secundario);
  position: absolute;
  top: 0px;
  left: -10px;
  opacity: 0.8;
  line-height: 1;
  font-weight: 700;
}

/* Info del cliente */
.client-info {
  display: flex;
  align-items: center;
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid #5a5a5a; /* Separador sutil */
}

.client-photo {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 15px;
  border: 3px solid var(--color-principal); /* Borde con color de acento */
}

.client-name {
  font-weight: 700;
  color: var(--color-secundario);
  font-size: 1.0rem;
}

/*--------------------------------------------------------*/


  
    /*------------------Contenido-Preguntas-Frecuentes------------------*/
  .faq-container {
    width: 100%;
    border-radius: 8px;
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
    }
    
    .faq-container  h5 {
    font-size: 2vw;
    color: var(--color-secundario);
    margin: 0vh 0vw 0.5rem 0vw;
    }
    
    .faq-container  p {
      font-size: var(--parrafos);
      color: var(--color-secundario-variable2);
    margin: 0vh 0vw 2rem 0vw;
    }
    
    .faq-container  button {
      font-weight: 600;
      font-size: var(--parrafos);
      color: var(--color-secundario-variable5);
    }
    
    .faq-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.123);
    margin-bottom: 15px;
    }
    
    .faq-question {
    width: 100%;
    text-align: left;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    padding: 1vw;
    font-size: 18px;
    cursor: pointer;
    transition: background-color 0.3s;
    }
    
    .faq-question .arrow {
    float: right;
    transition: transform 0.3s;
    transform: rotate(270deg);
    font-weight: 600;
    color: var(--color-secundario-variable4);
    }
    
    .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.0s ease-out, padding 0.1s ease-out;
    }
    
    .faq-item.open .faq-answer {
    max-height: 500px; /* Ajustar según el contenido */
    padding: 1vw;
    }
    
    .faq-item.open .faq-question .arrow {
    transform: rotate(90deg);
    }




    /* ======================================================= */
    /* 2. CORE: Estilos de la Animación Scroll Reveal */
    /* ======================================================= */

    /* 2.1. Estado Inicial: Oculto y Ligeramente Desplazado */
    .scroll-animate {
        opacity: 0;
        transform: translateY(10px); 
        /* Configura aquí la duración y suavidad de la animación */
        transition: opacity 1.0s ease-out, transform 1.0s ease-out; 
        /* Para que la animación comience más tarde */
        transition-delay: 0.1s; 
        will-change: opacity, transform;
    }

    /* 2.2. Estado Final: Visible y en su Posición Original */
    .scroll-animate.show {
        opacity: 1;
        transform: translateY(0);
    }

    .movil{
        display: none;
    }

    .monitor{
        display:block;
    }



/*------------------Resolucion-en-Ordenadores-Pequeños--------------------*/
@media(width <= 1024px){

.cont-Portada-elementos{
    width: 100%;
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0px 0px 0rem 0px;
    padding: 0vh 0vw 0rem 0vw;
}

.Portada-elementos{
    text-align: center;
    justify-content: center;
    margin: 3rem 0vw 0px 0vw ;
}

.Portada-elementos span{
    font-size: 1.2vw;
    font-weight: var(--titulos-grosro-texto);
    margin: 0px 0px 0px 0px ;
    color: var(--color-secundario);
}

.Portada-elementos h2{
    font-size: 5vw;
    line-height: 0.9;
    font-weight: var(--titulos-grosro-texto);
    margin: 1rem 0vw 0px 0px;
    color: var(--color-secundario);
}

.Portada-elementos strong{
    font-size: 4.5vw;
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0vh 0vw ;
    color: var(--color-principal);
}

.Portada-elementos p{
    font-size: var(--parrafos);
    margin: 1rem 30vw 1.3rem 30vw ;
    color: var(--color-secundario-variable2);
}

.Metrica-logro{
    gap: 1vw;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: 0rem 0vw 2rem 0px ;
}

.cont-metrica-ico-text{
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.Metrica-logro h4{
    font-size: 1.2vw;
    margin: 0px 1.5vw 0px 0px ;
    color: var(--color-secundario);
}

.Metrica-logro img{
    width: 2vw;
    margin: 0px 0.8vw 0px 0px;
}

.Metrica-logro svg{
    width: 2vw;
    margin: 0px 0.8vw 0px 0px;
    fill: var(--color-secundario);
}

.Portada-elementos a{
    text-decoration: none;
    font-weight: var(--titulos-grosro-texto);
    font-size: 1.2vw;
    margin: 0px 0px 0px 0px ;
    padding: 2.3vh 4vw 2.3vh 4vw;
    transition: 0.3s;
    color: var(--color-secundario);
    border-radius: 4vw;
    background: var(--color-principal);
}

.Portada-elementos a:hover{
    color: var(--color-secundario);
    background: var(--color-principal-variable2);
}

.Portada-elementos a:focus{
    color: var(--color-secundario);
    background: var(--color-principal-variable2);
}

.barra-contacto{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 1.5vw 2vh 2vw;
}

.barra-contacto h4{
    font-size: 1.1vw;
}

.barra-contacto svg{
    width: 1.8vw;
    margin: 0px 1vw 0px 0px;
    fill: var(--color-secundario);
}

.barra-contacto svg:hover{
    opacity: 70%;
}

.b-cnt-correo a{
    text-decoration: none;
    display: flex;
    align-items: center;
    color: var(--color-secundario);
}

.b-cnt-correo a:hover{
    opacity: 80%;
}

/*------------------Contenido-Principal-------------------*/

.Sec-Contenido-Principal{
    text-align: center;
    margin: 12vh 8vw -2vh 8vw;
    z-index: 0;
}

.Sec-Contenido-Principal h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-Principal p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.texto-centro-margen{
    margin: 0vh 15vw 0vh 15vw;
}

.texto-lateral1-margen{
    margin: 0vh 30vw 0vh 0vw;
}

.cont-Contenido{
    display: flex;
    justify-content: center;
    gap: 2vw;
}

.contenedor-Contenido { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    transition: 0.3s;
}

.contenedor-Contenido:hover{ 
    filter: brightness(130%);
}

.contenedor-Contenido img {
    width: 100%;
    height: 45vh;
    object-fit: cover;
}

.contenedor-Contenido video{
    width: 100%;
    height: 45vh;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.contenedor-Contenido:hover video { 
    transform: scale(1.1); 
}

.texto-1 { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 20px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.texto-1 h4{
    font-size: 1.4vw;
    margin: 0.8rem 3vw 0.4rem 0vw;
    color: var(--color-secundario-variable5);
}

.texto-1 p{
    font-size: var(--parrafos);
    margin: 0vh 2vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.texto-1 small{
    font-size: 1.1vw;
    font-weight: 700;
    border-radius: 6vw;
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable5);
    background: var(--color-principal);
}




/*------------------areas-interes-------------------*/

.Sec-Contenido-bloques-tip1{
    text-align: start;
    margin: 12vh 8vw -5vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip1 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip1 p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip1{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .cont-elementos-Bloque-tip1{
    display: flex;
    justify-content: center;
    gap: 2vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .elementos-tip1{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip1, .bloque2-tip1, .bloque3-tip1, .bloque4-tip1 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque1-tip1{ 
  margin: 0vh 0vw 0vh 0vw;
}

.bloque4-tip1{ 
  margin: 0vh 0vw 2.3vh 0vw;
}

.bloque1-tip1:hover, .bloque2-tip1:hover, .bloque3-tip1:hover, .bloque4-tip1:hover{ 
    filter: brightness(130%);
}

.bloque1-tip1 img{
    width: 80vw;
    height: 60vh;
    object-fit: cover;
}

.bloque1-tip1 video {
    width: 100%;
    height: 60vh;
    object-fit: cover;
}

.bloque2-tip1 img{
    width: 100%;
    height: 27.5vh;
    object-fit: cover;
}

.bloque3-tip1 img{
    width: 100%;
    height: 27.5vh;
    object-fit: cover;
}

.bloque4-tip1 img{
    width: 100%;
    height: 29.5vh;
    object-fit: cover;
}

.Sec-Contenido-bloques-tip1 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 20px 1.5vw ;
    color: var(--color-secundario-variable5);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
}

.Sec-Contenido-bloques-tip1 .texto h4{
    font-size: 1.6vw;
    margin: 0.8rem 3vw 0.3rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip1 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 3vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip1 .texto small{
    font-size: 1.1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}

#textbloque1-primario p{
    margin: 0vh 5vw 0vh 0vw;
}



/*------------------Sec-Servicios-Planes-----------------------*/

.Servicios-Planes{
    margin: 18vh 0vw 0vh 0vw;
    padding: 10vh 8vw 10vh 8vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: var(--fondo-secciones-especiales);
}

.Servicios-Planes h2{
    text-align: center;
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Servicios-Planes p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 0vh 0vw 2rem 0vw;
    color: var(--color-secundario-variable2);
}

.Servicios-Planes a{
    text-decoration: none;
}

.servicio{
    width: 27vw;
    overflow: hidden;
    height: 100%;
    border-radius: 0.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 2vh 0vw;
    transition: 0.3s;
    background: var(--color-principal-variable1);
}

.serv2{
    background: var(--color-principal);
}

.serv2:hover{
    filter: brightness(110%);
}

.serv1:hover, .serv3:hover{
    background: var(--color-secundario-variable1);
}

.servicio img{
    width: 100%;
    height: 28vh;
    object-fit: cover;
    margin: 0vh 0vw 0vh 0vw;
}

.servicio h3{
    text-align: start;
    color: var(--color-secundario);
    font-size: 1.7vw;
    margin: 3vh 2vw 0vh 2vw;
}

.servicio strong{
    text-align: start;
    font-size: 1.7vw;
    margin: 2vh 0vw 0vh 0.3vw;
    color: var(--color-principal-variable4);
}

.servicio p{
    text-align: start;
    font-size: var(--parrafos);
    color: var(--color-secundario-variable2);
    margin: 1.8vh 2vw 0vh 2vw;
}

.serv2 h3{
    text-align: start;
    font-size: 1.7vw;
    margin: 3vh 2vw 0vh 2vw;
    color: var(--color-secundario);
}

.serv2 strong{
    text-align: start;
    font-size: 1.7vw;
    margin: 2vh 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.serv2 p{
    text-align: start;
    font-size: var(--parrafos);
    margin: 1.8vh 2vw 0vh 2vw;
    color: var(--color-secundario-variable2);
}

.servicio a{
    color: var(--color-secundario);
    text-decoration: none;
}

.servicio a:hover{
    color: var(--color-secundario-variable5);
    text-decoration: none;
}


.Plan{
    width: 27vw;
    height: 100%;
    background: var(--color-principal-variable1);
    border-radius: 0.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 1.3vh 0vw;
    transition: 0.3s;
}

.Plan2{
    background: var(--color-principal);
}

.Plan2:hover{
    filter: brightness(110%);
}

.Plan1:hover, .Plan3:hover{
    background: var(--color-secundario-variable1);
}

.Plan img{
    width: 2rem;
    min-width: 2.5vw;
    max-width: 2rem;
    object-fit: cover;
    margin: 3vh 0vw 0vh 0vw;
}

.Plan svg{
    fill: var(--color-secundario);
    width: 2rem;
    min-width: 2.5vw;
    max-width: 2rem;
    object-fit: cover;
    margin: 3vh 0vw 0vh 0vw;
}

.Plan h3{
    text-align: center;
    font-size: 1.7vw;
    margin: 2vh 4vw 0vh 4vw;
    color: var(--color-secundario);
}

.Plan samp{
    font-size: 2vw;
    margin: 0vh 0vw 0vh 0.3vw;
    color: var(--color-principal-variable4);
}

.Plan p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 1.8vh 4vw 0vh 4vw;
}

.Plan small{
    font-weight: 700;
    text-align: start;
    font-size: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-principal-variable4);
}

.Plan ul{
    height: 23vh;
    overflow: scroll;
    text-align: start;
    font-size: var(--parrafos);
    margin: 3vh 4vw 3vh 4vw;
    padding: 0vh 4vw 3vh 2vw;
    color: var(--color-secundario-variable2);
}

.Plan ul::-webkit-scrollbar-track { 
    border-radius: 25px;
}

.Plan ul::-webkit-scrollbar { 
    width: 3px; 
}

.Plan li{
    margin: 2vh 0vw 0vh 0vw;
}

.Plan2 h3{
    text-align: center;
    font-size: 1.7vw;
    margin: 2vh 2vw 0vh 2vw;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario);
}

.Plan2 small{
    font-size: 1.5vw;
    margin: 2vh 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.Plan2 samp{
    font-size: 2vw;
    margin: 2vh 0vw 0vh 0.3vw;
    color: var(--color-secundario);
}

.Plan2 p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 1.8vh 2vw 0vh 2vw;
    color: var(--color-secundario-variable2);
}

.Plan2 ul{
    text-align: start;
    font-size: var(--parrafos);
    margin: 3vh 4vw 0vh 4vw;
    color: var(--color-secundario-variable2);
}

.Plan a{
    text-decoration: none;
    color: var(--color-secundario);
}

.Plan a:hover{
    text-decoration: none;
    color: var(--color-secundario-variable5);
}



/*------------------Contenido-blog-------------------*/
.Sec-Contenido-bloques-tip2{
    text-align: start;
    margin: 12vh 8vw -5vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip2 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip2 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip2{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.cont-elementos-tip2{
    display: block;
    justify-content: center;
    gap: 0vw;
    width: 100%;
    height: 100%;
}

.elementos-tip2{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip2, .bloque2-tip2, .bloque3-tip2, .bloque4-tip2 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque2-tip2{ 
  margin: 1.5vh 0vw 0vh 0vw;
}

.bloque1-tip2:hover, .bloque2-tip2:hover, .bloque3-tip2:hover, .bloque4-tip2:hover{ 
    filter: brightness(130%);
}

.bloque1-tip2 img{
    width: 50vw;
    height: 60vh;
    object-fit: cover;
}

.bloque1-tip2 video {
    width: 50vw;
    height: 60vh;
    object-fit: cover;
}

.bloque2-tip2 img{
    width: 100%;
    height: 30.3vh;
    object-fit: cover;
}

.bloque3-tip2 img{
    width: 100%;
    height: 27.5vh;
    object-fit: cover;
}

.bloque4-tip2 img{
    width: 100%;
    height: 27.5vh;
    object-fit: cover;
}

.Sec-Contenido-bloques-tip2 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 4vw 20px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip2 .texto h4{
    font-size: 1.6vw;
    margin: 0.8rem 3vw 0.3rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip2 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip2 .texto small{
    font-size: 1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}




/*------------------Contenido-Enfoques-------------------*/
.Sec-Contenido-bloques-tip3{
    text-align: start;
    margin: 12vh 8vw 0vh 8vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip3 h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Contenido-bloques-tip3 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Contenido-bloques-tip3{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.cont-elementos-tip3{
    display: block;
    justify-content: center;
    gap: 0vw;
    width: 100%;
    height: 100%;
}

.elementos-tip3{
    display: flex;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.bloques1-tip3, .bloques2-tip3, .bloques3-tip3, .bloques4-tip3 { 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloques1-tip3{ 
    width: 70vw;
    height: 100%;
    margin: 0vh 0vw 0vh 0vw;
}

.bloques4-tip3{ 
    margin: 2vh 0vw 0vh 0vw;
}

.caja-especial{ 
    width: 100%;
    height: 45vh;
    margin: 0vh 0vw 0vh 0vw;
}

.caja-especial p{ 
    width: 57%;
    margin: 0vh 0vw 0vh 0vw;
}

.bloques1-tip3:hover, .bloques2-tip3:hover, .bloques3-tip3:hover, .bloques4-tip3:hover{ 
    filter: brightness(130%);
}

.bloques1-tip3 img, .bloques2-tip3 img, .bloques3-tip3 img, .bloques4-tip3 img{
    width: 100%;
    height: 27.5vh;
    object-fit: cover;
}

.caja-especial img{ 
    width: 100%;
    height: 45vh;
    object-fit: cover;
}

.bloques1-tip3 video {
    width: 100%;
    height: 50vh;
    object-fit: cover;
}

.bloques4-tip3 video {
    width: 100%;
    height: 50vh;
    object-fit: cover;
}

.caja-especial video{ 
    width: 100%;
    height: 45vh;
    object-fit: cover;
}


.Sec-Contenido-bloques-tip3 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 30vh 4vw 20px 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip3 .texto h4{
    font-size: 1.6vw;
    margin: 0.8rem 3vw 0.3rem 0vw;
    color: var(--color-secundario-variable5);
}

.Sec-Contenido-bloques-tip3 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 2vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.Sec-Contenido-bloques-tip3 .texto small{
    font-size: 1.1vw;
    font-weight: 700;
    color: var(--color-secundario-variable5);
    border-radius: 6vw;
    background: var(--color-principal);
    padding: 1vh 2vw 1vh 2vw;
    margin: 0vh 0vw 0vh 0vw;
}


/*--------------------------------------------------------------------------*/

.cont-Pbl-tp-3{
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 2vw;
    margin: 2.5vh 0vw 0vh 0vw;
    padding: 4vh 2vw 4vh 2vw;
    border-radius: 0.5vw;
    background: var(--color-principal-variable2);
  }
  
  .Descrp-Pbl-tp-3{
  width: 45vw;
  margin: 0vh 0vw 0vh 0vw;
  padding: 0vh 0vw 0vh 0vw;
  }
  
  .Descrp-Pbl-tp-3 h3{
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 1.5vh 0vw;
    font-size: 2.3vw;
    color: var(--color-secundario);
  }
  
  .Descrp-Pbl-tp-3 p{
  margin: 0vh 0vw 0vh 0vw;
  font-size: var(--parrafos);
  color: var(--color-secundario-variable2);
  }
  
  .cont-img-Pbl-tp-3{
    display: flex;
    text-align: center;
    gap: 7vw;
}

.img-Pbl-tp-3{
    text-align: center;
    width: 100%;
}

.img-Pbl-tp-3 h5{
    margin: 1.5vh 0vw 1vh 0vw;
    font-size: 1.2vw;
    font-weight: 800;
    color: var(--color-secundario);
}

.img-Pbl-tp-3 img{
    height: 3vw;
    width: 3vw;
    object-fit: cover;
}

.img-Pbl-tp-3 svg{
    fill: var(--color-secundario);
    height: 3.5vw;
    width: 3.5vw;
    object-fit: cover;
}





/*------------------Area-Contacto-------------------------*/

.Sec-contacto{
    text-align: center;
    margin: 15vh 8vw 0vh 8vw;
}

.Sec-contacto h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0rem 0vw;
    color: var(--color-secundario);
}

.Sec-contacto p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.cont{
    display: flex;
    gap: 2vw;
    width: 100%;
    margin: 5vh 0vw 0vh 0vw;
}

.cont a{
    font-size: 1.2vw;
    text-decoration: none;
    color: var(--color-principal-variable3);
}

.cont a:hover{
    text-decoration:underline;
}

.inf{
    width: 100%;
    margin: 0.5rem 0vw 0vh 0vw;
}

.ico{
    gap: 1vw;
    display: flex;
    align-items: center;
    opacity: 80%;
    margin: 0vh 0vw 0vh 0vw;
}

.ico h3{
    font-size: 1.5vw;
    color: var(--color-secundario);
    margin: 0vh 0vw 0vh 0vw;
}

.ico svg{
    width: 1.3rem;
    min-width: 1.3vw;
    max-width: 1.3rem;
    fill: var(--color-secundario);
}

.inf hr{
    opacity: 30%;
    margin: 2vh 0vw 1rem 0vw;
}

.ico-inf{
    gap: 1vw;
    display: flex;
    align-items: center;
    margin: 1.3rem 0vw 0vh 0vw;
    opacity: 80%;
}

.ico-inf h4{
    font-size: 1.2vw;
    margin: 0vh 0vw 0vh 0vw;
}

.inf h4{
    color: var(--color-secundario);
}

.ico-inf svg{
    width: 1.1rem;
    min-width: 1.3vw;
    max-width: 1.1rem;
    fill: var(--color-secundario);
}

.redes{
    text-align: start;
    margin: 1.5rem 0vw 1rem 0vw;
}

.cont-redes{
    gap: 1.3vw;
    display: flex;
    margin: 2vh 0vw 1.5vh 0vw;
    text-align: start;
}

.ico-redes{
    gap: 0.5vw;
    display: flex;
    align-items: center;
    opacity: 80%;
}

.cont-redes a{
    color: var(--color-secundario);
    font-size: var(--parrafos);
    text-decoration: none;
}

.ico-redes svg{
    width: 1rem;
    min-width: 1.3vw;
    max-width: 1rem;
    padding: 2vh 1vw 2vh 1vw;
    border-radius: 50%;
    fill: var(--color-secundario-variable6);
    background: var(--color-secundario-variable3);
    transition: 0.3s;
    font-size: var(--parrafos);
}

.ico-redes svg:hover{
    opacity: 80%;
}

.cont-redes h5{
    font-size: 1vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario);
}

.ubicacion{
    margin: 0vh 0vw 0vh 0vw;
}

.ubicacion iframe{
    height: 16rem;
    min-width: 45vw;
    max-width: 30vw;
    border-radius: 0.5vw;
    background: var(--color-secundario-variable4);
}



/*-----------------------------Horario-Atención-----------------------------*/
.Sec-Horario-Atencion{
    margin: 12vh 8vw 0vh 8vw;
}

.Sec-Horario-Atencion h2{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.Sec-Horario-Atencion p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5rem 0vw;
    color: var(--color-secundario-variable2);
}

.Horario-Atencion{
    display: flex;
    gap: 2vw;
    margin: 0vh 0vw 0vh 0vw;
}


.ico-horario-aten-espacial{
    display: flex;
    gap: 2vw;
    align-items: center;
    min-width: 20vw;
    padding: 4vh 2vw 4vh 2vw;
    border-radius: 0.5vw;
    background: var(--color-principal-variable2);
}

.ico-horario-aten-espacial img{
    width: 4rem;
    min-width: 4.5vw;
    max-width: 4rem;
    margin: 0vh 0vw 0vh 0vw;
}

.ico-horario-aten-espacial svg{
    fill:var(--color-secundario);
    width: 4rem;
    min-width: 4.5vw;
    max-width: 4rem;
    margin: 0vh 0vw 0vh 0vw;
}

.text-descrip2 h4{
    color: var(--color-secundario-variable5);
    font-weight: var(--titulos-grosro-texto);
    font-size: 1.7vw;
    margin: 0vh 0vw 1vh 0vw;
}

.text-descrip2 p{
    color: var(--color-secundario-variable4);
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
}


.Ten2{
    background: var(--color-secundario-variable3);
}




.scroll-wrapper {
    position: relative;
    margin-bottom: 0px; /* Espacio entre las secciones */
    margin: 0vh 0vw -2vh 0vw;
}

    .scroll-container {
        gap: 1.5vw;
        display: flex;
        overflow-x: auto;
        scroll-behavior: smooth;
        padding: 10px;
        border-radius: 1vw;
        margin: -1.5vh -1vw -2vh -1vw;
    }
    
    .scroll-container::-webkit-scrollbar {
        display: none; /* Ocultar scrollbar por defecto */
    }

    .scroll-item {
        flex: 0 0 auto; /* Evita que los elementos se redimensionen */
        text-align: center;
    }

    .scroll-button {
        position: absolute;
        cursor: pointer;
        border: none;
        font-size: 2.5vw;
        border-radius: 50%;
        width: 2rem;
        min-width: 3.5vw;
        max-width: 2rem;
        height: 2rem;
        min-height: 3.5vw;
        max-height: 2rem;
        margin: 0vh -2vw 0vh -2vw;
        top: 50%;
        z-index: 1;
        color: var(--color-secundario-variable5);
        background-color: var(--color-principal);
        transform: translateY(-50%);
    }

    .scroll-button.left {
        left: 0;
    }

    .scroll-button.right {
        right: 0;
    }



/*-------------------------Carrucel-img------------------------*/

.carousel {
    position: relative;
    height: 12rem;
    overflow: hidden;
    margin: 3rem 3vw 0vh 3vw;
    border-radius: 0.5vw;
    transition: 0.3s;
}

.carousel:hover{
    filter: brightness(130%);
}

.carousel a{
    text-decoration: none;
}

.carousel img{
    width: 100%;
    height: 12rem;
    object-fit: cover;
}

.cont-text-img{
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 50vh 0vw 1.2rem 2vw;
    background: linear-gradient(to bottom, #00000000, #000000);
}

.cont-text-img h4{
    font-size: 2vw;
    width: 40%;
    margin: 0px 0px 0.3rem 0px;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario-variable5);
}

.cont-text-img p{
    font-size: var(--parrafos);
    margin: 0vh 50vw 0vh 0vw;
    color: var(--color-secundario-variable4);
}

.slide {
    display: none;
}

.slide.visible {
    display: block;
}

.controls {
    text-align: center;
    margin: 1vh 0vw 0vh 0vw;
}

.control {
    cursor: pointer;
    width: 2rem;
    height: 0.2rem;
    border: none;
    margin: 0 2px;
    background-color: var(--color-secundario-variable3);
}

.control:hover{
    filter: brightness(150%);
}

.control.active {
    background-color: var(--color-principal);
}


/*---------------------Cont-Blog---------------------------*/
.cont-Sec-blog{
    margin: -1vh 8vw 1vh 8vw;
}

.cont-Sec-blog h1{
    font-size: var(--titulos);
    margin: 1vh 0vw 2.5vh 0vw;
    color: var(--color-secundario);
}

.cont-Sec-blog p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable2);
}

.cont-Sec-blog hr{
    opacity: 15%;
    margin: 0vh 0vw 5vh 0vw;
}



/*---------------Cont-Blog-Controles-Mando-----------------*/

.cont-indice{
    display: flex;
    gap: 1vw;
    margin: 0vh 0vw 4vh 0vw;
}

.cont-indice a{
    text-decoration: none;
}

.boton {
    border: none;
    border-radius: 2vw;
    font-size: 1.1vw;
    cursor: pointer;
    margin: 0vh 0vw 0vh 0vw;
    padding: 1.5vh 1.8vw 1.5vh 1.8vw;
    transition: 0.3s;
    color: var(--color-secundario);
    background-color: var(--color-secundario-variable3); /* Color original */
}

.boton:hover{
    transition: 0.3s;
    color: var(--color-secundario-variable5);
    background:  var(--color-principal); /* Color original */
}

.clicked {
    color: var(--color-secundario-variable5);
    background:  var(--color-principal-variable2); /* Nuevo color al hacer clic */
}

.indice-categorias{
    border-radius: 3vw;
    margin: 4vh 0vw 1.5vh 0vw;
    padding: 1.8vh 2vw 1.8vh 2vw;
    background: var(--color-secundario);
}

.indice-categorias h4{
    font-size: 1.1vw;
    margin: 0vh 0vw 0vh 0vw;
    color: var(--color-secundario-variable5);
}



/*-----------------Sec4-Contenido-Blog-------------------*/

.Cont-Sec{
    font-size: 1.8vw;
    margin: 0vh 8vw 5vh 8vw;
}

.Estructura-Seccion{
    display: flex;
    gap: 0.8vw;
    align-items: center;
    margin: 0vh 0vw 3vh 0vw;
}

.Estructura-Seccion img{
    height: 1.1rem;
    min-height: 1.5vw;
    max-height: 1.1rem;
background: none;
}

.Estructura-Seccion svg{
    height: 2vw;
    fill: var(--color-secundario);
}

.Estructura-Seccion h3{
    font-size: 1.3vw;
    font-weight: 800;
    color: var(--color-secundario);
    margin: 0vh 0vw 0px 0px;
}

.Articulos, .Documentaciones{
    display: flex;
    flex-wrap: wrap;
    gap: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
}


    .Estructura-Articulo-Documentacion{
        flex: 1 1 25vw;
        max-width: 30vw;
        position: relative;
        width: 100%;
        background: var(--color-secundario-variable3);
        overflow: hidden;
        border-radius: 0.5vw;
        margin: 0vh 0vw 0vh 0vw;
        padding: 0px 0px 0vh 0px;
        transition: 0.3s;
    }

    .Estructura-Articulo-Documentacion:hover{
        filter: brightness(120%);
    }

    
    .Estructura-Articulo-Documentacion a{
        color: var(--color-secundario);
        text-decoration: none;
    }
    
    .cont-sec-estructura{
        display: block;
    }

    .cont-sec-estructura img{ 
    width: 100%;
    height: 12vh;
    object-fit: cover;
    background: var(--color-secundario-variable3);
    }
    
    .cont-descrip-articulo-documentacion{
        display: block;
        margin: 0vh 1vw 0vh 1vw;
    }
    
    .cont-inf{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 1vh 0vw 1.5vh 0vw;
    }
    
    .inf-articulo-documentacion{
        display: flex;
        align-items: center;
    }
    
    .inf-articulo-documentacion img{
        width: 1.5rem;
        min-width: 1.5vw;
        max-width: 1.5rem;
        height: 1.5rem;
        min-height: 1.5vw;
        max-height: 1.5rem;
        margin: 0px 0.8vw 0px 0px;
        border-radius: 50%;
        object-fit: cover;
        background: var(--color-secundario-variable3);
    }
    
    .cont-inf-autor-arti h6{
        font-size: 1.1vw;
        margin: 1vh 0vw -0.6rem 0vw;
        color: var(--color-secundario);
    }
    
    .cont-inf-autor-arti small{
        font-size: 0.8vw;
        margin: 0px 0vw 0px 0vw;
        color: var(--color-secundario-variable2);
    }
    
    .ico-tipo-informacion{
        display: flex;
        gap: 0.8vw;
        align-items: center;
    }

    .ico-tipo-informacion img{
    height: 1.1rem;
    min-height: 1.5vw;
    max-height: 1.1rem;
    background: none;
    }

    .ico-tipo-informacion svg{
        height: 1.7vw;
        fill: var(--color-secundario);
    }
    
    .cont-resumen-articulo{
        height: 100%;
        margin: 2vh 1vw 3vh 1vw;
        padding: 0vh 0vw 0vh 0vw;
    }
    
    .cont-resumen-articulo h3{
        font-size: 1.3vw;
        line-height: 1.1;
        font-weight: var(--titulos-grosro-texto);
        text-align: start;
        margin: 0vh 0vw 1.5vh 0vw;
        color: var(--color-secundario);
    }
    
    .cont-resumen-articulo p{
        font-size: var(--parrafos);
        margin: 0vh 0vw 0vh 0vw;
        color: var(--color-secundario-variable2);
    }




/*------------------Noticias--------------------*/

.contenedor-noticia{ 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 27vw;
    height: 33vh;
    transition: 0.3s;
}

.contenedor-noticia{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-noticia a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-noticia:hover{ 
    filter: brightness(120%);
}

.contenedor-noticia img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-noticia video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.texto { 
    justify-content: space-between;
    align-items: center;
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 35vh 0vw 3vh 1.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
    color: var(--color-secundario-variable5);
}

.texto h4{
    font-size: 1.3vw;
    margin: 0.5rem 5vw 1vh 0vw;
    font-weight: var(--titulos-grosro-texto);
    color: var(--color-secundario-variable5);
}

.cont-inf-autor-arti h6{
    font-size: 1.1vw;
    margin: 1vh 0vw -0.6rem 0vw;
    color: var(--color-secundario);
}

.cont-inf-autor-arti small{
    font-size: 0.8vw;
    margin: 0px 0vw 0px 0vw;
    color: var(--color-secundario-variable2);
}

.texto .ico-tipo-informacion{
    margin: 0vw 0vw 0rem 6rem;
}

.texto p{
    font-size: var(--parrafos);
    color: var(--color-secundario-variable4);
    margin: 0vh 5vw 0vh 0vw;
}

.cont-img-noticia{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1.5vh 0vw;
}

.cont-img-noticia img{
    width: 1.5rem;
    min-width: 1.5vw;
    max-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5vw;
    max-height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}

/*------------------Contenido--------------------*/
.contenedor-video{ 
    border-radius: 0.5vw;
    position: relative;
    overflow: hidden;
    width: 27vw;
    height: 33vh;
    transition: 0.3s;
}

.contenedor-video{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-video a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-video:hover{ 
    filter: brightness(120%);
}

.contenedor-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cont-img-video{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1.5vh 0vw;
}

.cont-img-video img{
    width: 1.5rem;
    min-width: 1.5vw;
    max-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5vw;
    max-height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}



  /*------------------Cont-Complementos------------------*/
  .cont-complementos{
    margin: 4.8rem 8vw 5rem 8vw;
  }
  
  /*------------------Contenido-Preguntas-Frecuentes------------------*/
  .faq-container {
    width: 100%;
    border-radius: 8px;
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
    }
    
    .faq-container  h5 {
    font-size: 2vw;
    color: var(--color-secundario);
    margin: 0vh 0vw 0.8rem 0vw;
    }
    
    .faq-container  p {
      font-size: var(--parrafos);
      color: var(--color-secundario-variable2);
    margin: 0vh 0vw 1.5rem 0vw;
    }
    
    .faq-container  button {
      font-weight: 600;
      font-size: var(--parrafos);
      color: var(--color-secundario-variable5);
    }
    
    .faq-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.123);
    margin-bottom: 15px;
    }
    
    .faq-question {
    width: 100%;
    text-align: left;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    outline: none;
    padding: 1.3vw;
    font-size: 18px;
    cursor: pointer;
    transition: background-color 0.3s;
    }
    
    .faq-question .arrow {
    float: right;
    transition: transform 0.3s;
    transform: rotate(270deg);
    font-weight: 600;
    color: var(--color-secundario-variable4);
    }
    
    .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.0s ease-out, padding 0.1s ease-out;
    }
    
    .faq-item.open .faq-answer {
    max-height: 500px; /* Ajustar según el contenido */
    padding: 1vw;
    }
    
    .faq-item.open .faq-question .arrow {
    transform: rotate(90deg);
    }



/*--------------------------------------------------------------------------*/

.texto-lateral1-margen{
    text-align: start;
    margin: 0vh 30vw 0vh 0vw;
}

.texto-lateral1-margen-Tt-Pricpl{
    text-align: start;
    margin: 4.5rem 35vw 0vh 0vw;
}

.texto-lateral2-margen{
    text-align: start;
    margin: 0vh 30vw 0vh 0vw;
}

.texto-lateral1-margen h1{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    font-size: 3.5vw;
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.texto-lateral1-margen-Tt-Pricpl h1{
    font-size: var(--titulos);
    font-weight: var(--titulos-grosro-texto);
    margin: 0vh 0vw 0.5rem 0vw;
    color: var(--color-secundario);
}

.texto-lateral1-margen p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 3vh 0vw;
    color: var(--color-secundario-variable2);
}

.texto-centro-margen{
    text-align: center;
}



  footer {
    color: var(--color-secundario);
  text-align: center;
  margin: 10vh 0vw 5vh 0vw;
  opacity: 50%;
  }
  
  footer h6{ 
  margin: 0vh 0vw 0vh 0vw;
  }

  .enlaces-princiáles{
    display: flex;
    justify-content: center;
    gap: 3vw;
    margin: 0.5rem 0vw 5vh 0vw;
  }
  
  .enlaces-princiáles a{
    font-size: 1vw;
    font-weight: 600;
    text-decoration: none;
    color: var(--color-secundario);
  }
  
  .enlaces-princiáles a:hover{
    text-decoration: underline;
  }
}

/*------------------Resolucion-en-Moviles---------------------*/
@media (width <= 912px){

:root{
    --titulos: 7vw;
    --parrafos: 3vw; 
    --parrafos-especiales: 2.7;

    --altura-marcos: 9rem;

    --fondo-portada-pagina: linear-gradient(rgb(0, 0, 0), rgb(0, 0, 0)), url(Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo-especial-3.jpg);
    
    --fondo-pagina: linear-gradient(rgba(12, 12, 12, 0.863),rgba(8, 8, 8, 0.774)), url(Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo-especial-3.jpg);

    --fondo-secciones-especiales: linear-gradient(rgba(0, 0, 0, 0.678), rgba(0, 0, 0, 0.767)), url(/Aspectos-Visuales-Entorno-Digital/Aspectos-Visuales-PG/fondo-especial-3.jpg);
}

/*--------------Barra-Navegación--------------*/
.B-Navegacion{
    display: flex;
    justify-content: space-between;
    border-top: none;

    background-color: rgba(0, 0, 0, 0.918); /* Fondo ligeramente transparente para ver el efecto */
    backdrop-filter: none; /* Aplica el desenfoque al fondo detrás de la barra */
    -webkit-backdrop-filter: none; /* Para compatibilidad con algunos navegadores */
    position: none;
}

.B-Navegacion svg{
    width: 1.3rem;
    min-width: 1.3vw;
    max-width: 1.3rem;
    fill: var(--color-secundario);
}

.logo{
    display: flex;
    align-items: center;
    padding: 1.1vh 0vw 1.1vh 3.5vw;
}

.logo svg{
    width: 1.3rem;
    min-width: 1.3vw;
    max-width: 1.3rem;
}

.logo h3{
    font-size: 2.5vw;
    padding: 0px 0vw 0px 2vw;
}

.login {
    border: none;
    align-items: center;
    display: flex;
    cursor: pointer;
    border-bottom-left-radius: 10vw;
    padding: 1.1vh 2vw 1.1vh 5vw;
    transition: background-color 0.3s ease; /* Transición de color suave */
}

.login h3{
    font-size: 3vw;
    padding: 0vh 0vw 0vh 0vw;
    margin: 0vh 2.5vw 0vh 0vw;
}

.login img{
    width: 1.2rem;
    min-width: 1.2vw;
    max-width: 1.2rem;
    border-radius: 50%;
    margin: 0vh 0vw 0vh 0vw;
}

/*------------Barra-Navegación-iconos-----------*/
.cont-Barra-N{
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 2vw;
    position: fixed;
    width: 100%;
    bottom: 0;
    border: none;
    background: rgb(0, 0, 0);
    z-index: 1000;
}

.cont-Barra-N div{
    display: block;
    text-align: center;
    margin: 0vh 0px 0vh 0px;
    padding: 1.3vh 0px 1.3vh 0vw;
}

.cont-Barra-N svg{
    width: 1rem;
    min-width: 1vw;
    max-width: 1rem;
}

.cont-Barra-N div h3{
    font-size: 2.3vw;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0vw;
}

.Pg-ico-1 svg, .Pg-ico-2 svg, .Pg-ico-3 svg, .Pg-ico-4 svg{
    fill: var(--color-secundario);
    opacity: var(--opacidad-pg-ico);
}

.Pg-ico-1 h3, .Pg-ico-2 h3, .Pg-ico-3 h3, .Pg-ico-4 h3{
    color: var(--color-secundario);
    opacity: var(--opacidad-pg-ico);
}

.Pg-ico-1, .Pg-ico-2, .Pg-ico-3, .Pg-ico-4{
    opacity: var(--opacidad-pg-ico);
}

/*------------------Sección-Portada-----------------------*/

.caja-fondo-texto{
    background-color: rgba(0, 0, 0, 0.589)
}

.cont-Portada-elementos{
    display: flex;
    height: 80vh;
    flex-wrap: wrap-reverse;
    align-items: center;
    justify-content: center;
    margin: 0px 0px 0px 0px;
    padding: 0vh 0vw 0vh 0vw;
}

.Portada-elementos{
    text-align: center;
    justify-content: center;
}

.Portada-elementos span{
    font-size: 3.5vw;
    font-weight: var(--titulos-grosro-texto);
    margin: 0px 0px 0px 0px ;
    color: var(--color-secundario);
}

.Portada-elementos h2{
    font-size: 10.5vw;
    line-height: 0.9;
    margin: 1rem 7vw 0vh 7vw ;
}

.Portada-elementos strong{
    font-size: 10vw;
    margin: 0vh 0vw 0vh 0vw ;
}

.Portada-elementos p{
    font-size: var(--parrafos);
    margin: 0.8rem 8vw 1rem 8vw;
}

.Portada-elementos{
    margin: 0px 0px 0vh 0vw ;
}

.Metrica-logro{
    gap: 1vw;
    display: flex;
    justify-content: center;
    margin: 0px 0px 2.5rem 0px ;
}

.cont-metrica-ico-text{
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.Metrica-logro h4{
    font-size: 3vw;
    margin: 0px 4.5vw 0px 1vw ;
}

.Metrica-logro svg{
    width: 4vw;
}

.Portada-elementos a{
    border-radius: 8vw;
    text-decoration: none;
    font-size: 3.5vw;
    margin: 0px 0px 0px 0px ;
    padding: 2vh 12vw 2vh 12vw;
    transition: 0.3s;
}

.barra-contacto{
    display: flex;
    justify-content: center;
    gap: 2vw;
    align-items: center;
    margin: 0;
    padding: 0.5vh 1.5vw 12vh 2vw;
}

.barra-contacto h4{
    display: none;
}

.barra-contacto svg{
    width: 6vw;
    margin: 0px 0vw 0px 0px;
}

.barra-contacto svg:hover{
    opacity: 70%;
}

.b-cnt-correo a{
    text-decoration: none;
    display: flex;
    align-items: center;
}

.b-cnt-correo a:hover{
    opacity: 80%;
}



/*----------------Seccio-Contenido-Principal------------*/

.Sec-Contenido-Principal{
    text-align: start;
    margin: 6vh 5vw 0vh 5vw;
}

.Sec-Contenido-Principal h2{
    font-size: var(--titulos);
    margin: 0vh 0vw 1vh 0vw;
}

.Sec-Contenido-Principal p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 3vh 0vw;
}

.texto-centro-margen{
    margin: 0vh 0vw 0vh 0vw;
}

.texto-lateral1-margen{
    margin: 0vh 0vw 0vh 0vw;
}

.cont-caja{
    overflow: scroll;
}

.cont-caja::-webkit-scrollbar{
    display: none;
}

.cont-Contenido{
    display: flex;
    gap: 3vw;
    width: 240vw;
    padding: 0px 0vw 0px 0px;
}

.contenedor-Contenido { 
    border-radius: 3vw;
    position: relative;
    width: 90vw;
    overflow: hidden;
}

.contenedor-Contenido video{
    width: 100%;
    height: 40vh;
    object-fit: cover;
    transition: 0.5s ease;
}
.contenedor-Contenido:hover video { 
    transform: scale(1.1); 
}

.contenedor-Contenido img {
    width: 100%;
    height: 40vh;
    object-fit: cover;
}

.Sec-Contenido-Principal .texto-1 { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 100% 4vw 2.5vh 3.5vw ;
}

.Sec-Contenido-Principal .texto-1 h4{
    width: 45vw;
    font-size: 4.5vw;
    margin: 2vh 3vw 0.8vh 0vw;
}

.Sec-Contenido-Principal .texto-1 p{
    font-size: var(--parrafos);
    margin: 0vh 5.5vw 0vh 0vw;
}

.texto-1 small{
    font-size: 2.5vw;
    font-weight: 700;
    border-radius: 6vw;
    padding: 1vh 4vw 1vh 4vw;
    margin: 0vh 0vw 0vh 0vw;
}




/*------------------areas-interes-------------------*/
.Sec-Contenido-bloques-tip1{
    text-align: start;
    margin: 0vh 5vw -3.5vh 5vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip1 h2{
    font-size: var(--titulos);
    margin: 5vh 0vw 1vh 0vw;
}

.Sec-Contenido-bloques-tip1 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 3.5vh 0vw;
}

.cont-Contenido-bloques-tip1{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .cont-elementos-Bloque-tip1{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.Sec-Contenido-bloques-tip1 .elementos-tip1{
    display: flex;
    justify-content: center;
    gap: 2vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip1, .bloque2-tip1, .bloque3-tip1, .bloque4-tip1 { 
    border-radius: 2vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque1-tip1{ 
  margin: 0vh 0vw 1vh 0vw;
}

.bloque2-tip1{ 
  margin: 1vh 0vw 0vh 0vw;
}

.bloque1-tip1:hover, .bloque2-tip1:hover, .bloque3-tip1:hover, .bloque4-tip1:hover{ 
    opacity: 90%;
}

.bloque1-tip1 img{
    width: 100%;
    height: 42vh;
    object-fit: cover;
}

.bloque1-tip1 video {
    width: 100%;
    height: 40vh;
    object-fit: cover;
}

.bloque2-tip1 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque3-tip1 img{
    width: 60vw;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque4-tip1 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.Sec-Contenido-bloques-tip1 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 100% 5vw 2vh 3.5vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0.753));
}

.Sec-Contenido-bloques-tip1 .texto h4{
    font-size: 4vw;
    margin: 2vh 3.5vw 0.8vh 0vw;
}

.Sec-Contenido-bloques-tip1 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 5.5vw 0vh 0vw;
}

.Sec-Contenido-bloques-tip1 .texto small{
    font-size: 3.1vw;
    font-weight: 700;
    border-radius: 6vw;
    padding: 1vh 4vw 1vh 4vw;
    margin: 0vh 0vw 0vh 0vw;
}

#textbloque1-primario p{
    margin: 0vh 8vw 0vh 0vw;
}


/*------------------Sec-Servicios-Planes-----------------------*/

.Servicios-Planes{
    margin: 6vh 0vw 0vh 0vw;
    padding: 5vh 5vw 6vh 5vw;
}

.principal{
    margin: 8vh 4vw 0vh 4vw;
}

.Servicios-Planes h2,h1{
    text-align: start;
    font-size: var(--titulos);
    margin: 0vh 0vw 1vh 0vw;
}

.Servicios-Planes p{
    text-align: start;
    font-size: var(--parrafos);
    margin: 0vh 0vw 1.5vh 0vw;
}

.servicio{
    width: 70vw;
    overflow: hidden;
    border-radius: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 0rem 0vw;
}

.servicio img{
    width: 100%;
    height: 20vh;
    margin: 0vh 0vw 2vh 0vw;
}

.servicio h3{
    font-size: 5vw;
    margin: 0vh 4vw 0.5vh 4vw;
}

.servicio strong{
    font-size: 4.8vw;
    margin: 0vh 0vw 0vh 0.5vw;
}

.servicio p{
    text-align: start;
    font-size: var(--parrafos);
    margin: 1vh 4vw 2.5vh 4vw;
}

.servicio a{
    text-decoration: none;
}

.servicio a:hover{
    text-decoration: none;
}


.Plan{
    width: 70vw;
    border-radius: 1.5vw;
    margin: 0vh 0vw 0vh 0vw;
    padding: 0vh 0vw 0vh 0vw;
}

.Plan img{
    width: 1.7rem;
    height: 1.7rem;
    object-fit: cover;
    margin: 2vh 0vw 0vh 0vw;
}

.Plan h3{
    text-align: center;
    font-size: 5vw;
    margin: 2vh 4vw 0vh 4vw;
}

.Plan samp{
    font-size: 4.8vw;
    margin: 0vh 0vw 0vh 0.3vw;
}

.Plan p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 1vh 4vw 0vh 4vw;
}

.Plan small{
    font-weight: 700;
    text-align: start;
    font-size: 4.8vw;
    margin: 0vh 0vw 0vh 0vw;
}

.Plan ul{
    height: 30vh;
    overflow: scroll;
    text-align: start;
    font-size: 3.2vw;
    margin: 3vh 4vw 3vh 0vw;
    padding: 0vh 4vw 2vh 10vw;
}

.Plan ul::-webkit-scrollbar-track { 
    border-radius: 25px;
}

.Plan ul::-webkit-scrollbar { 
    width: 1.5px; 
}

.Plan li{
    margin: 1.5vh 0vw 0vh 0vw;
}

.Plan2 h3{
    text-align: center;
    font-size: 5vw;
    margin: 2vh 4vw 0vh 4vw;
}

.Plan2 p{
    text-align: center;
    font-size: var(--parrafos);
    margin: 1.8vh 4vw 0vh 4vw;
}

.Plan2 ul{
    text-align: start;
    font-size: var(--parrafos);
    margin: 3vh 4vw 0vh 4vw;
}

.Plan a{
    text-decoration: none;
}

.Plan a:hover{
    text-decoration: none;
}




/*------------------Contenido-blog-------------------*/

.Sec-Contenido-bloques-tip2{
    text-align: start;
    margin: 5vh 5vw -2vh 5vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip2 h2{
    font-size: var(--titulos);
    margin: 0vh 0vw 1vh 0vw;
}

.Sec-Contenido-bloques-tip2 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 3vh 0vw;
}

.cont-Contenido-bloques-tip2{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.cont-elementos-tip2{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}

.elementos-tip2{
    display: flex;
    justify-content: center;
    gap: 2vw;
    width: 100%;
    height: 100%;
}

.bloque1-tip2, .bloque2-tip2, .bloque3-tip2, .bloque4-tip2 { 
    border-radius: 2vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloque1-tip2{ 
  margin: 0vh 0vw 1vh 0vw;
}

.bloque2-tip2{ 
  margin: 1vh 0vw 1vh 0vw;
}

.bloque1-tip2:hover, .bloque2-tip2:hover, .bloque3-tip2:hover, .bloque4-tip2:hover{ 
    opacity: 90%;
}

.bloque1-tip2 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque1-tip2 video {
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque2-tip2 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque3-tip2 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloque4-tip2 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.Sec-Contenido-bloques-tip2 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 100% 4vw 2vh 3vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.753));
}

.Sec-Contenido-bloques-tip2 .texto h4{
    font-size: 4vw;
    margin: 2vh 3vw 0.8vh 0vw;
}

.Sec-Contenido-bloques-tip2 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 5.5vw 0vh 0vw;
}

.Sec-Contenido-bloques-tip2 .texto small{
    font-size: 2.3vw;
    border-radius: 6vw;
    padding: 1vh 4vw 1vh 4vw;
    margin: 0vh 0vw 0vh 0vw;
}





/*------------------Contenido-Enfoque-----------------*/
.Sec-Contenido-bloques-tip3{
    text-align: start;
    margin: 5vh 5vw 0vh 5vw;
    z-index: 0;
}

.Sec-Contenido-bloques-tip3 h2{
    font-size: var(--titulos);
    margin: 0vh 0vw 1vh 0vw;
}

.Sec-Contenido-bloques-tip3 p{
    font-size: var(--parrafos);
    margin: 0vh 4vw 3vh 0vw;
}

.cont-Contenido-bloques-tip3{
    display: block;
    justify-content: center;
    gap: 1vw;
    width: 100%;
    height: 100%;
}


.caja-especial p{
    width: 94%;
    margin: 0vh 0vw 0vh 0vw;
}



.cont-elementos-tip3{
    display: block;
    justify-content: center;
    gap: 0vw;
    width: 100%;
    height: 100%;
}

.elementos-tip3{
    display: flex;
    justify-content: center;
    gap: 2vw;
    width: 100%;
    height: 100%;
}

.bloques1-tip3, .bloques2-tip3, .bloques3-tip3 { 
    border-radius: 2vw;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: 0.3s;
}

.bloques1-tip3{ 
    width: 100%;
    height: 100%;
    margin: 0vh 0vw 1vh 0vw;
}

.bloques1-tip3:hover, .bloques2-tip3:hover, .bloques3-tip3:hover{ 
    opacity: 90%;
}

.bloques1-tip3 img, .bloques2-tip3 img, .bloques3-tip3 img{
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.bloques1-tip3 video {
    width: 100%;
    height: var(--altura-marcos);
    object-fit: cover;
}

.Sec-Contenido-bloques-tip3 .texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 100% 4vw 2.5vh 3vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0.753));
}

.Sec-Contenido-bloques-tip3 .texto h4{
    font-size: 4vw;
    margin: 2vh 4vw 0.8vh 0vw;
}

.Sec-Contenido-bloques-tip3 .texto p{
    font-size: var(--parrafos);
    margin: 0vh 5.5vw 0vh 0vw;
}

.Sec-Contenido-bloques-tip3 .texto small{
    font-size: 3.1vw;
    font-weight: 700;
    border-radius: 6vw;
    padding: 1vh 4vw 1vh 4vw;
    margin: 0vh 0vw 0vh 0vw;
}


/*--------------------------------------------------------------------------*/
.cont-Pbl-tp-3{
    display: block;
    align-items: none;
    justify-content: space-around;
    text-align: start;
    gap: 2vw;
    margin: 1.5vh 0vw 0vh 0vw;
    padding: 1vh 4vw 1vh 4vw;
    border-radius: 2vw;
  }
  
  .Descrp-Pbl-tp-3{
  width: 100%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.137);
  margin: 0vh 0vw 0.5rem 0vw;
  padding: 0.5rem 0vw 0.5rem 0vw;
  }
  
  .Descrp-Pbl-tp-3 h3{
  margin: 0vh 0vw 0.5rem 0vw;
  font-size: 5.8vw;
  }
  
  .Descrp-Pbl-tp-3 p{
  margin: 0vh 0vw 0vh 0vw;
  font-size: var(--parrafos);
  }
  
  .cont-img-Pbl-tp-3{
    display: flex;
    text-align: center;
    gap: 4vw;
  }
  
  .img-Pbl-tp-3{
    text-align: center;
    width: 100%;
  }
  
  .img-Pbl-tp-3 h5{
    margin: 0.3vh 0vw 0.5vh 0vw;
    font-size: 3.5vw;
    font-weight: 800;
  }

  .img-Pbl-tp-3 svg{
    height: 5.5vw;
    width: 5.5vw;
    object-fit: cover;
  }




/*------------------Area-Contacto-------------------------*/
.Sec-contacto{
    text-align: start;
    margin: 0vh 5vw 0vh 5vw;
}

.Sec-contacto p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 3vh 0vw;
}

.cont{
    display: block;
    gap: 2vw;
    width: 100%;
    margin: 3vh 0vw 0vh 0vw;
}

.cont a{
    font-size: 3vw;
    text-decoration: none;
}

.cont a:hover{
    text-decoration:underline;
}

.ico{
    gap: 1vw;
    display: flex;
    align-items: center;
    opacity: 80%;
}

.ico h3{
    font-size: 5vw;
    margin: 0vh 0vw 0vh 2vw;
}

.ico svg{
    width: 1.3rem;
    min-width: 1.3vw;
    max-width: 1.3rem;
}

.inf hr{
    opacity: 30%;
    margin: 2vh 0vw 2.5vh 0vw;
}

.ico-inf{
    gap: 1vw;
    display: flex;
    align-items: center;
    margin: 2vh 0vw 0vh 0vw;
    opacity: 80%;
}

.ico-inf h4{
    font-size: 3vw;
    margin: 0vh 0vw 0vh 2vw;
}

.ico-inf svg{
    width: 1.1rem;
    min-width: 1.2vw;
    max-width: 1.1rem;
}

.redes{
    font-size: 5vw;
    margin: 3vh 0vw 2.5vh 0vw;
}

.cont-redes{
    gap: 2vw;
    display: flex;
    margin: 1.5vh 0vw 2vh 0vw;
}

.ico-redes{
    gap: 1.5vw;
    display: flex;
    align-items: center;
    opacity: 80%;
}

.cont-redes a{
    font-size: 3vw;
    text-decoration: none;
}

.ico-redes svg{
    width: 1.1rem;
    min-width: 1.2vw;
    max-width: 1.1rem;
    padding: 1vh 2vw 1vh 2vw;
    border-radius: 50%;
}

.cont-redes h5{
    font-size: 2.3vw;
    margin: 0vh 0vw 0vh 0vw;
}

.ubicacion{
    margin: 3.5vh 0vw 0vh 0vw;
}

.ubicacion iframe{
    height: 30vh;
    min-width: 100%;
    max-width: 100%;
    border-radius: 3vw;
}



/*-----------------------------Horario-Atención-----------------------------*/
.Sec-Horario-Atencion{
    margin: 4vh 5vw 0vh 5vw;
}

.Sec-Horario-Atencion h2{
    font-size: var(--titulos);
    margin: 0vh 0vw 1vh 0vw;
}

.Sec-Horario-Atencion p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 3vh 0vw;
}

.Horario-Atencion{
    display: block;
    margin: 0vh 0vw 0vh 0vw;
}


.ico-horario-aten-espacial{
    display: flex;
    align-items: center;
    padding: 3vh 4vw 3vh 4vw;
    margin: 0vh 0vw 1.5vh 0vw;
    border-radius: 2vw;
}

.ico-horario-aten-espacial img{
    width: 20vw;
    margin: 0vh 3vw 0vh 0vw;
}

.text-descrip2{
    margin: 0vh 0vw 0vh 0vw;
}

.text-descrip2 h4{
    font-size: 4vw;
    margin: 0vh 0vw 0.5vh 0vw;
}

.text-descrip2 p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
}

.Ten2{
    background: var(--color-secundario-variable3);
}






/*-------------------------Carrucel-img------------------------*/

.carousel {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: 0vw;
    margin: 0rem 0vw 0vh 0vw;
    transition: 0.3s;
}

.carousel:hover{
    opacity: 80%;
}

.carousel a{
    text-decoration: none;
}

.carousel img{
    width: 100%;
    height: 15rem;
    object-fit: cover;
}

.cont-text-img{
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 6vh 4vw 1.2rem 4vw;
    background: linear-gradient(to bottom, #00000000, #000000);
}

.cont-text-img h4{
    width: 80vw;
    font-size: 5vw;
    margin: 0vh 0vw 0.3rem 0vw;
}

.cont-text-img p{
    font-size: var(--parrafos);
    margin: 0vh 8vw 0vh 0vw;
}

.slide {
    display: none;
}

.slide.visible {
    display: block;
}

.controls {
    text-align: center;
    margin: 1vh 0vw 0vh 0vw;
}

.control {
    cursor: pointer;
    width: 1.5rem;
    height: 0.2rem;
    border: none;
    margin: 0 3px;
}

.control:hover{
    opacity: 80%;
}


/*---------------------------cont-Sec-blog-----------------------------*/
.cont-Sec-blog{
    margin: 0vh 5vw 0vh 5vw;
}

.cont-Sec-blog h1{
    font-size: 8.5vw;
    margin: 0vh 0vw 2.5vh 0vw;
}

.cont-Sec-blog p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 0vh 0vw;
}

.cont-Sec-blog hr{
    opacity: 20%;
    margin: 3vh 0vw 3vh 0vw;
}


.cont-indice{
    margin: 0vh 0vw 0vh 0vw;
}

.texto-lateral1-margen{
    margin: 1vh 0vw 0vh 0vw;
}

/*---------------------------------------------------------------------*/

.cont{
    overflow: hidden;
}

.cont-botones-mando{
    overflow: scroll;
    display: flex;
    gap: 2vw;
}

.cont-botones-mando::-webkit-scrollbar{
    display: none;
}

.boton {
    border: none;
    border-radius: 5vw;
    font-size: 3vw;
    cursor: pointer;
    margin: 0vh 0vw 0vh 0vw;
    padding: 1vh 6vw 1vh 6vw;
    transition: 0.3s;
}

.indice-categorias h4{
    font-size: 3.8vw;
    margin: 0vh 0vw 0vh 0vw;
}

/*-----------------Sec4-Contenido-Blog-------------------*/

.Cont-Sec{
    font-size: 1.8vw;
    margin: 0vh 5vw 4vh 5vw;
}

.Estructura-Seccion{
    display: flex;
    gap: 0vw;
    align-items: center;
    margin: 0vh 0vw 2vh 0vw;
}

.Estructura-Seccion img{
width: 1rem;
height: 1rem;
background: none;
}

.Estructura-Seccion svg{
width: 1rem;
height: 1rem;
background: none;
}

.Estructura-Seccion h3{
    font-size: 4vw;
    font-weight: 800;
    margin: 0vh 0vw 0px 2vw;
}

.Articulos, .Documentaciones{
    display: block;
    flex-wrap: wrap;
    gap: 1vw;
    margin: 0vh 0vw 0vh 0vw;
}


    .Estructura-Articulo-Documentacion{
        flex: 1 1 25vw;
        max-width: 100%;
        position: relative;
        width: 100%;
        border-radius: 3vw;
        margin: 0vh 0vw 2vh 0vw;
        padding: 0px 0px 0vh 0px;
    }
    
    .cont-sec-estructura{
        display: block;
    }

    .cont-sec-estructura img{ 
    width: 100%;
    height: 5rem;
    object-fit: cover;
    }
    
    .cont-descrip-articulo-documentacion{
        display: block;
        margin: 1vh 2.5vw 2vh 2.5vw;
    }
    
    .cont-inf{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 0vh 1vw 0vh 1vw;
    }
    
    .inf-articulo-documentacion{
        display: flex;
        align-items: center;
    }
    
    .inf-articulo-documentacion img{
        width: 1.5rem;
        height: 1.5rem;
        margin: 0px 2vw 0px 0px;
        border-radius: 50%;
        object-fit: cover;
    }
    
    .cont-inf-autor-arti h6{
        font-size: 4vw;
        margin: 0.1vh 0vw 0rem 0vw;
        text-decoration: none;
    }
    
    .cont-inf-autor-arti small{
        font-size: 2vw;
        margin: 0px 0vw 0px 0vw;
        text-decoration: none;
    }
    
    .ico-tipo-informacion{
        display: flex;
        align-items: center;
    }

    .ico-tipo-informacion img{
    width: 1rem;
    height: 1rem;
    background: none;
    margin: 0vh 0vw 0px 0px;
    }
    .ico-tipo-informacion svg{
    width: 1rem;
    height: 1rem;
    background: none;
    margin: 0vh 0vw 0px 0px;
    }
    
    .cont-resumen-articulo{
        height: 100%;
        text-align: justify;
        margin: 1.5vh 2vw 0vh 2vw;
        padding: 0vh 0vw 0vh 0vw;
    }
    
    .cont-resumen-articulo h3{
        font-size: 5vw;
        text-align: start;
        margin: 0vh 0vw 0.3rem 0vw;
    }
    
    .cont-resumen-articulo p{
        font-size: var(--parrafos);
        text-align: start;
        margin: 0vh 0vw 0vh 0vw;
    }


/*------------------Noticias--------------------*/

.contenedor-noticia{ 
    border-radius: 3vw;
    position: relative;
    overflow: hidden;
    width: 60vw;
    height: 17rem;
    transition: 0.3s;
}

.contenedor-noticia{ 
    margin: -1.5vh 0vw 0vh 0vw;
}

.contenedor-noticia a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-noticia:hover{ 
    opacity: 90%;
}

.contenedor-noticia img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.texto { 
    text-align: start;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 25vh 4vw 2.5vh 3vw ;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0));
}

.texto h4{
    font-size: 3.5vw;
    margin: 0vh 8vw 0.3rem 0vw;
}

.texto p{
    font-size: var(--parrafos);
    margin: 0vh 8vw 0vh 0vw;
}

.texto .ico-tipo-informacion{
    margin: 0vw 0vw 0rem 2rem;
}

.cont-img-noticia{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1vh 0vw;
}

.cont-img-noticia img{
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}

/*------------------Contenido--------------------*/

.contenedor-video{ 
    border-radius: 3vw;
    position: relative;
    overflow: hidden;
    width: 60vw;
    height: 17rem;
    transition: 0.3s;
}

.contenedor-video{ 
    margin: -1.5vh 0vw 0vh 0vw;
}

.contenedor-video a{ 
    margin: 0vh 0vw 0vh 0vw;
}

.contenedor-video:hover{ 
    opacity: 90%;
}

.contenedor-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cont-img-video{
    display: flex;
    align-items: center;
    margin: 0vh 0vw 1vh 0vw;
}

.cont-img-video img{
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    margin: 0vh 1vw 0vh 0vw;
}





   /*------------------Cont-Complementos------------------*/
   .cont-complementos{
    margin: 3rem 5vw 0vh 5vw;
  }
    
    /*------------------Contenido-Preguntas-Frecuentes------------------*/
    .faq-container {
    width: 100%;
    border-radius: 8px;
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
    }
    
    .faq-container  h5 {
    font-size: 7vw;
    margin: 0vh 0vw 0.5rem 0vw;
    }
    
    .faq-container  p {
      font-size: var(--parrafos);
    margin: 0vh 0vw 1rem 0vw;
    }
    
    .faq-container  button {
      font-size: var(--parrafos);
    }
    
    .faq-item {
    border-bottom: 1px solid rgba(230, 230, 230, 0.171);
    margin-bottom: 15px;
    }
    
    .faq-question {
    width: 100%;
    text-align: left;
    background-color: rgba(255, 255, 255, 0);
    border: none;
    outline: none;
    padding: 12px;
    font-size: 25px;
    cursor: pointer;
    transition: background-color 0.3s;
    }
    
    .faq-question .arrow {
    float: right;
    transition: transform 0.3s;
    transform: rotate(270deg);
    font-weight: 600;
    }
    
    .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.0s ease-out, padding 0.1s ease-out;
    }
    
    .faq-item.open .faq-answer {
    max-height: 500px; /* Ajustar según el contenido */
    padding: 10px;
    }
    
    .faq-item.open .faq-question .arrow {
    transform: rotate(90deg);
    }




/*--------------------------------------------------------------------------*/

.scroll-wrapper {
    position: relative;
    margin-bottom: 0px; /* Espacio entre las secciones */
    margin: 0vh 0vw -2vh -1vw;
  }
  
  .scroll-container {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    border-radius: 3vw;
    margin: 0vh 0vw 0vh 0vw;
  }
  
  .scroll-container::-webkit-scrollbar {
    display: none; /* Ocultar scrollbar por defecto */
  }
  
  .scroll-item {
    flex: 0 0 auto; /* Evita que los elementos se redimensionen */
    margin-right: 3vw; /* Espacio entre elementos */
    text-align: center;
  }
  
  .scroll-button {
    position: absolute;
    cursor: pointer;
    border: none;
    font-size: 4vw;
    border-radius: 50%;
    width: 0rem;
    height: 0rem;
    margin: 0vh -2.8vw 0vh -2.8vw;
    bottom: 0%;
    z-index: 1;
    background: #0084ff00;
    color: #0084ff00;
    transform: translateY(-50%);
  }
  
  .scroll-button.left {
    left: 0;
  }
  
  .scroll-button.right {
    right: 0;
  }


/*--------------------------------------------------------------------------*/

.texto-lateral1-margen{
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
}

.texto-lateral1-margen-Tt-Pricpl{
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
}

.texto-lateral2-margen{
    text-align: start;
    margin: 0vh 0vw 0vh 0vw;
}

.texto-centro-margen{
        text-align: start;
}

.texto-lateral1-margen h1{
    font-size: 7vw;
    margin: 0vh 0vw 1vh 0vw;
}

.texto-lateral1-margen p{
    font-size: var(--parrafos);
    margin: 0vh 0vw 2vh 0vw;
}

.texto-lateral1-margen-Tt-Pricpl h1{
    font-size: 7vw;
    margin: 8vh 0vw 1vh 0vw;
}


footer { 
    text-align: center;
    margin: 3.5vh 0vw 10vh 0vw;
}

footer h6{
    font-size: 2.5vw; 
    margin: 0vh 0vw 0vh 0vw;
}

.enlaces-princiáles{
    display: flex;
    justify-content: center;
    gap: 2vw;
    margin: 1.5vh 2vw 3vh 2vw;
}

.enlaces-princiáles a{
    font-size: 2.3vw;
    font-weight: 600;
    text-decoration: none;
}

.enlaces-princiáles a:hover{
    text-decoration: underline;
}

.movil{
    display: block;
}

.monitor{
    display: none;
}

}