/*Desactivador*/
.desactivar {
  pointer-events: none;
  opacity: 0;
  cursor: not-allowed;
}

/*Area Barra de header*/
nav {
  /*Layout*/
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  z-index: 1;
  background-color: white;
  position: fixed !important;
  top: 0;
}

div.row.header {
  /*Layout*/
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: -1vw;
  margin-bottom: -1.5vw;
}

div.header.logo {
  /*Layout*/
  display: flex;
  align-items: center;
  justify-content: center;
}

img.header {
  /*Layout*/
  width: 15vw;
}

div.header.opciones {
  /*Layout*/
  display: flex;
  flex-direction: row;
  border-radius: 2.15vw;
  justify-content: space-evenly;
  align-self: center;
  /*Styles*/
  background: #fff;
}

a.header.link {
  /*Layout*/
  text-decoration: none;
  text-align: center;
  margin: 1vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  font-family: Poppins;
  font-size: 1.3vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

a.header.link:hover{
color: #fff;
background: var(--Brand-Secondary-CTA, #4d45d6) ;
padding: 0.5vw;
border-radius: 50%;
transition: background 0.3s linear;
}

div.header.button {
  /*Layout*/
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding-left: 3.5vw;
}

button.header {
  /*Layout*/
  width: fit-content;
  padding: 1.2vw 1.25vw 1.2vw 1.25vw;
  border-color: transparent;
  border-radius: 6.5vw;
  text-align: center;
  /*Styles*/
  background: var(--Brand-Primary, #8ce0d5);
  color: var(--Brand-Secondary-CTA, #4d45d6);
  transition: background 0.3s linear;
  /*Typography*/
  /* Web/H3 */
  font-family: Poppins;
  font-size: 1vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

button.header:hover {
  background:var(--Brand-Secondary-CTA, #4d45d6);
  color: var(--Brand-Primary, #8ce0d5);
}

/*Area Hero1*/
section.hero {
  /*Layout*/
  display: flex;
  align-items: center;
  padding-bottom: 5vw;
  /*Styles*/
  background-image: url(../public/hero.png); /* Agregué ../ */
  background-size: cover;
  background-repeat: no-repeat;
}

div.col-6.hero {
  /*Layout*/
  display: flex;
  flex-direction: column;
  padding-top: 10vw;
  padding-left: 5vw;
  margin-bottom: 10vw;
}

h1.hero {
  /*Layout*/
  width: fit-content;
  margin: 0vw -50vw 1vw 0vw;
  padding: 0vw 1vw 0vw 1vw;
  border-radius: 1.5vw;
  /*Styles*/
  background: var(
    --Fade-Ligth,
    linear-gradient(270deg, #84dbe1 -21.87%, #02aab6 100%)
  );
  color: #fff;
  /*Typography*/
  font-family: Poppins;
  font-size: 3.0vw;
  font-style: normal;
  font-weight: 500;
  line-height: 159.4%; /* 76.161px */
}

/*Area banner*/
section.banner {
  /*Layout*/
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  /*Styles*/
  background-color: #4D45D6;
  background-image: url(../public/img_banner.png);
  background-size: contain;
  background-repeat: no-repeat;
  margin-bottom: -2vw;
}

h1.banner {
  /*Layout*/
  width: 100vw;
  padding-top: 5vw;
  /*Styles*/
  color: var(--Brand-Primary, #8ce0d5);
  /*Typography*/
  /* Web/H1 */
  font-family: Poppins;
  font-size: 3.3vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

p.banner {
  /*layout*/
  width: 85vw;
  text-align: center;
  padding-bottom: 5vw;
  /*Styles*/
  color: #fff;
  /*Typography*/
  font-family: Roboto Flex;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: 128.889%;
}

/*Area Hero2*/
section.hero2 {
  /*Styles*/
  background: var(--Brand-Complement, #fff2f1);
}

div.hero2.contenido {
  /*Layout*/
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 2.5vw;
}

div.hero2.texto {
  /*Layout*/
  margin-left: 10vw;
  margin-right: 3vw;
}

h1.hero2 {
  /*Layout*/
  padding-bottom: 2vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H1 */
  font-family: Poppins;
  font-size: 5vw;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
}

h2.hero2 {
  /*Layout*/
  padding-bottom: 2vw;
  /*Styles*/
  color: var(--Brand-Secondary-CTA, #4d45d6);
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.56vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

li.hero2 {
  /*Layout*/
  padding-right: 8vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  font-family: Poppins;
  font-size: 1.7vw;
  font-style: normal;
  font-weight: 500;
  line-height: 160.59%; /* 160.59% */
}

button.hero2 {
  /*Layout*/
  display: flex;
  border-color: transparent;
  border-radius: 3.26vw;
  margin-left: 33.3%;
  margin-top: 10%;
  padding: 1.4vw 2.85vw 1.4vw 2.85vw;
  align-items: center;
  text-align: center;
  /*Styles*/
  background: var(--Brand-Primary2, #02aab6);
  color: #fff;
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.16vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

div.hero2.imagenes {
  /*Layout*/
  padding-top: 2vw;
  padding-bottom: 10vw;
  padding-right: 5vw;
}

img.hero2 {
  /*Layout*/
  width: 30vw;
  border-radius: 2.15vw;
  margin: 1vw;
}

/*Area Feature*/

section.features {
  /*Layout*/
  display: flex;
}

div.row.features {
  /*Layout*/
  flex-direction: row;
  justify-content: space-between;
  text-align: center;
}

div.col-3.features {
  /*Layout*/
  width: 25vw;
  padding: 4vw 3vw 4vw 3vw;
}

img.features {
  /*Layout*/
  width: 22vw;
  height: 23.5vw;
}

h2.features {
  /*Layout*/
  text-align: center;
  /*Styles*/
  color: var(--Brand-Secondary-CTA, #4d45d6);
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.16vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

p.features {
  /*Layout*/
  text-align: center;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/p */
  font-family: Poppins;
  font-size: 1.3vw;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 150% */
}

/*Area servicios*/

select.servicios {
  /*Layout*/
  display: flex;
}

h1.servicios {
  /*Layout*/
  padding-top: 5vw;
  padding-bottom: 10vw;
  text-align: center;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H1 */
  font-family: Poppins;
  font-size: 5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

img.servicios {
  /*Layout*/
  width: 42vw;
  height: 28vw;
  margin-bottom: 9vw;
  border-radius: 2.15vw;
}

div.col-5.servicios {
  /*layout*/
  display: flex;
  flex-direction: column;
  align-items: start;
  margin-left: 5vw;
}

h2.servicios {
  /*Layout*/
  padding-top: 3vw;
  padding-bottom: 1vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

p.servicios {
  /*Layout*/
  padding-bottom: 2vw;
  /*Stles*/
  color: #000;
  /*Typography*/
  /* Web/p */
  font-family: Poppins;
  font-size: 1.28vw;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 150% */
}

button.servicios {
  /*Layout*/
  border-radius: 6.485vw;
  text-align: center;
  border-color: transparent;
  padding: 1.2vw 1.7vw 1.2vw 1.7vw;
  /*Styles*/
  background: var(--Brand-Secondary-CTA, #4d45d6);
  color: #fff;
  transition: background 0.1s linear;
  /*Typography*/
  /* Web/H3 */
  font-family: Poppins;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

button.servicios:hover{
  background: var(--Brand-Primary, #8ce0d5);
  color: #fff;
}

/*Area de contador*/
h1.contador {
  /*Layout*/
  padding-top: 5vw;
  padding-bottom: 6vw;
  text-align: center;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H1 */
  font-family: Poppins;
  font-size: 3.9vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

div.row.contador {
  /*Layout*/
  border-radius: 4.28vw;
  text-align: center;
  justify-content: center;
  padding: 4vw;
  margin: 0 8vw 0 8vw;
  /*Styles*/
  background: linear-gradient(180deg, #c5ebe4 -21.85%, #52c1ad 47.75%);
}

p.contador.numeros.anios {
  /*layout*/
  /*Styles*/
  color: #fff;
  /*Typography*/
  font-family: Inter;
  font-size: 5.3vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.contador.numeros.anios::after {
  /*Layout*/
  /*Styles*/
  color: #fff;
  /*Typography*/
  content: "años";
  font-family: Inter;
  font-size: 2.67vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.contador.texto {
  /*Styles*/
  color: #072594;
  /*Typography*/
  font-family: Roboto;
  font-size: 2.15vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.contador.numeros.horas {
  /*Styles*/
  color: #fff;
  /*Typography*/
  font-family: Inter;
  font-size: 5.3vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.contador.numeros.horas::after {
  /*Styles*/
  color: #fff;
  /*Typography*/
  content: "hrs";
  font-family: Inter;
  font-size: 2.67vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.contador.numeros {
  /*Styles*/
  color: #fff;
  /*Typography*/
  font-family: Inter;
  font-size: 5.3vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/*Area Testimonio*/

div.testimonio.titulo {
  /*Layout*/
  display: flex;
  justify-content: center;
}

h2.testimonio {
  /*Layout*/
  padding-top: 10vw;
  margin-left: 5vw;
  margin-right: 5vw;
  text-align: center;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

h2.testimonio::after {
  /*Styles*/
  color: var(--Brand-Secondary-CTA, #4d45d6);
  /*Typography*/
  content: "confianza, aprendizaje y seguridad.";
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

div.testimonio.contenido {
  /*Layout*/
  width: 60vw;
  display: flex;
  flex-direction: column;
  padding: 4vw;
  border-radius: 4.28vw;
  margin: 4vw 10vw 8vw 20vw;
  /*Styles*/
  border: 3px solid #fff;
  box-shadow: 0px 0.52vw 1.17vw 0.39vw rgba(0, 0, 0, 0.25);
}

p.testimonio.nombre {
  /*Styles*/
  color: var(--Brand-Secondary-CTA, #4d45d6);
  /*Typography*/
  font-family: Poppins;
  font-size: 1.7vw;
  font-style: normal;
  font-weight: 800;
  line-height: 138.889%;
}

p.testimonio.texto {
  /*Styles*/
  color: #000;
  /*Typography*/
  font-family: Poppins;
  font-size: 1.5vw;
  font-style: normal;
  font-weight: 400;
  line-height: 3.15vw;
}

/*Area de Expansion*/

section.expansion {
  /*Layout*/
  display: flex;
  /*Styles*/
  background: var(--Brand-Complement2, #e9e3e1);
  background-image: url(../public/img_section_app.png);
  background-size: cover;
  padding-top: 4vw;
  padding-bottom: 2vw;
}

h1.expansion {
  /*Layout*/
  width: fit-content;
  padding: 0 1vw 0 1vw;
  margin-top: 1vw;
  border-radius: 2.983vw;
  /*Styles*/
  background: var(
    --Fade-Ligth,
    linear-gradient(270deg, #84dbe1 -21.87%, #4D45D6 100%)
  );
  color: #fff;
  /*Typography*/
  font-family: Poppins;
  font-size: 2.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: 159.4%;
}

div.col-6.derecho{
  padding-left: 8vw;
}

p.expansion.superior {
  /*Layout*/
  padding: 2vw 4vw 1vw 0;
  /*Styles*/
  color: #000;
  /*Typography*/
  font-family: Poppins;
  font-size: 2.0vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

p.expansion.inferior {
  /*Layout*/
  padding-right: 14vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  font-family: Poppins;
  font-size: 1.2vw;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 150% */
}

div.expansion.button {
  /*layout*/
  display: flex;
  justify-content: center;
  text-align: center;
}

button.expansion {
  /*Layout*/
  padding: 1.2vw 1.7vw 1.2vw 1.7vw;
  margin: 3vw 15vw 7vw 0;
  border-radius: 6.485vw;
  text-align: center;
  border-color: transparent;
  /*Styles*/
  background: var(--Brand-Secondary-CTA, #4D45D6);
  color: #fff;
  transition: background 0.1s linear;
  /*Typography*/
  /* Web/H2 */
  font-family: Poppins;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

button.expansion:hover{
  background: var(--Brand-Primary, #8ce0d5);
}

/*Area de Colaboradores*/
div.colaboradores {
  /*Layout*/
  display: flex;
  justify-content: center;
  border-radius: 160.5vw;
}

h1.colaboradores {
  /*Layout*/
  text-align: center;
  padding-top: 6vw;
  /*Styles*/
  color: #000;
  /*Typography*/
  /* Web/H1 */
  font-family: Poppins;
  font-size: 3vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

img.colaboradores {
  /*layout*/
  width: 98.99vw;
}

/*Area de Footer*/
footer.footer {
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #4d45d6 35.44%, #2d278c 100%);
}

div.footer.central {
  display: flex;
  flex-direction: row;
  gap: 20vw;
  padding: 10vw 7.5vw 5vw 7.5vw;
}

div.footer.izquierdo {
  display: flex;
  flex-direction: column;
  width: 40vw;
}

h3.footer::before {
  content: "¡Hola!";
  color: #fff;

  /* Web/H3 */
  font-family: Poppins;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

h3.footer {
  color: #fff;

  /* Web/H3 */
  font-family: Poppins;
  font-size: 1.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  padding-bottom: 3vw;
}

img.footer.izquierdo {
  width: 25vw;
}

div.footer.derecho {
  display: flex;
  flex-direction: column;
  width: 40vw;
}

span.footer.superior {
  display: flex;
  flex-direction: column;
  align-content: space-evenly;
  padding-bottom: 4vw;
}

a.footer.superior {
  padding-bottom: 1vw;
  text-decoration: none;
  color: #fff;

  /* Web/H3 */
  font-family: Poppins;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  transition: width 0.1s linear;
}

a.footer.superior:hover{
  color: var(--Brand-Primary, #8ce0d5);
  font-size: 2.2vw;
}

span.footer.inferior {
  display: flex;
  flex-direction: column;
}

span.footer.inferior.redes {
  display: flex;
  flex-direction: row;
  align-self: flex-start;
}

h2.footer {
  color: #fff;
  text-align: start;

  /* Web/H2 */
  font-family: Poppins;
  font-size: 2vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

img.footer.inferior {
  width: 5vw;
  margin-right: 1vw;
  transition: width 0.1s linear;
}

img.footer.inferior:hover{
  margin-bottom: 4vw;
  width: 6vw;
}

div.footer.small {
  display: flex;
  flex-direction: column;
  align-self: center;
  padding-bottom: 5vw;
}

small.footer {
  color: #fff;

  /* Web/small */
  font-family: Poppins;
  font-size: 1.5vw;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

/*Zona responsive*/
/*Media query Max-width: 600px*/
@media only screen and (max-width: 600px) {
/*Area Barra de header*/
img.header {
  width: 18vw;
}

a.header.link {
  font-size: 2vw;
  font-weight: 500;
}

button.header {
  margin-bottom: 2vw;
  font-size: 1.5vw;
  font-weight: 600;
}

/*Area Hero1*/
section.hero {
  padding-bottom: 0vw;
}

h1.hero {
  margin: 0vw -50vw 1.5vw 0vw;
  font-size: 4.3vw;
  font-weight: 600;
}

/*Area banner*/
h1.banner {
  font-weight: 600;
}

p.banner {
  font-size: 2.3vw;
  font-weight: 600;
}

/*Area Hero2*/

h1.hero2 {
  /*Layout*/
  padding-top: 5vw;
  padding-bottom: 2vw;
  font-weight: 600
}

h2.hero2 {
  font-weight: 600;
}

li.hero2 {
  margin-left: -1vw;
  font-size: 1.8vw;
  font-weight: 600;
}

/*Area Feature*/

section.features {
  margin: 1vw;
}

h2.features {
  font-weight: 600;
}

p.features {
  font-weight: 600;
}

/*Area servicios*/

h1.servicios {
  padding-top: 2vw;
  padding-bottom: 3vw;
  font-weight: 600;
}

h2.servicios {
  padding-top: 2vw;
  font-weight: 600;
}

p.servicios {
  padding-bottom: 0vw;
  font-weight: 600;
  font-size: 1.5vw;
}

button.servicios {
  font-weight: 600;
}


/*Area de contador*/

h1.contador {
  font-size: 4.1vw;
  font-weight: 600;
}

p.contador.numeros.anios {
  font-weight: 500;
}

p.contador.numeros.anios::after {
  font-weight: 500;
}

p.contador.texto {
  font-weight: 500;
}

p.contador.numeros.horas {
  font-weight: 500;
}

p.contador.numeros.horas::after {
  font-weight: 500;
}

p.contador.numeros {
  font-weight: 500;
}

/*Area Testimonio*/

h2.testimonio {
  font-weight: 600;
}

h2.testimonio::after {
  font-weight: 600;
}

p.testimonio.nombre {
  font-size: 1.9vw;
  font-weight: 900;
}

p.testimonio.texto {
  font-size: 1.7vw;
  font-weight: 500;
}

/*Area de Expansion*/

h1.expansion {
  font-weight: 600;
}

div.col-6.derecho{
  padding-left: 13.5vw;
}

p.expansion.superior {
  font-weight: 500;
}

p.expansion.inferior {
  font-weight: 600;
}

button.expansion {
  font-weight: 600;
}

/*Area de Colaboradores*/

h1.colaboradores {
  font-size: 3.5vw;
  font-weight: 600;
}


/*Area de Footer*/
h3.footer::before {
  font-size: 2.2vw;
  font-weight: 600;
}

h3.footer {
  font-size: 1.7vw;
  font-weight: 600;
}

a.footer.superior {
  font-size: 2vw;
  font-weight: 600; 
}

h2.footer {
  font-weight: 600; 
}

img.footer.inferior {
  width: 6vw; 
}

small.footer {
  font-weight: 600;
}
}
