* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    max-width: 100%;
    /*outline: 1px solid red;*/
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-variation-settings:"wdth" 100;
  
  }

  /* Configuracion de Menu ----------------------------------------------------------------------------------------------------------------*/
.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 16px 32px;
}


.header__logo{
  max-width: 140px;
  height: auto;
}
  
.header__navbar{
  display: none;
}


.header__burger{
  background: none;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
}

.header__burger span{
  width: 25px;
  height: 3px;
  background: white;
  display: block;
}


  /* Configurcion de Video -------------------------------------------------------------------------------------------------------------------*/
  
  .main__contenedor-video {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 83vh; 
    overflow: hidden;
  }

  .main__contenedor-video::after{
    content: "";
    position: absolute;
    width: 100%;
    inset: 0;
    background: #2f6891;
    opacity: 0.5;
    z-index: 0;
    
  }
  
  .main__video {
   
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover; /* NO se deforma */
    display: block;
  }
  
  /* Contenido encima del video ---------------------------------------------------------------------------------------------------*/
  
  .main__contenedor-texto,
  .servicio__contenedor-texto{
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: white;
    text-align: center;
    z-index: 1;
    
  }

  .main__subtitulo {
    margin-bottom: 30px;
    font-weight: 300;
    
  }

  .main__titulo{
    margin: 0;
    font-family: "Bebas Neue", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 60px;
    line-height: 1;
  }

  /* Configuracion de cuadro de conteo ----------------------------------------------------------------------------------------------------*/

  .main__contenedor-conteo {
    background: linear-gradient(145deg, #ffffff, #f0f0f0);
    max-width: 1600px;
    width: 95%;
    margin: -30px auto 0;
    padding: 20px;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    text-align: center;

    box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.493),
    0 4px 6px rgba(0, 0, 0, 0.253);

  transform: translateY(0);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.main__contenedor-conteo:hover {
  transform: translateY(-8px);
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.822),
    0 8px 12px rgba(0, 0, 0, 0.1);
}
  
  
  .main__conteo {
    font-family: "Bebas Neue", sans-serif;
    color: #2f6891;
    font-size: 4.5rem;
    font-weight: 300;
    line-height: 1.2;
    margin: 8px 0;
  }
  
  .main__conteo-titulo {
    font-family: "Bebas Neue", sans-serif;
    color: rgb(133, 133, 133);
    font-size: 1.3rem;
    font-weight: 10;
    letter-spacing: 1px;
    opacity: 0.85;
  }

  
  /* seccion descripcion --------------------------------------------------------------------------------------------------------------------*/

  .descripcion{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .descripcion__contenedor-imagen{
    margin-left: 5%;
  }

  .descripcion__titulo,
  .servicio__titulo{
    font-style: normal;
    font-weight: 700;
    font-size: 2.1rem;
    color: rgb(39, 39, 39);
    text-align: center;
    margin: 40px 10px;
  }

  
  .descripcion__titulo::after,
  .equipos__titulo::after,
  .innovamos__titulo::after,
  .clientes__titulo::after{
    content: "";
    display: block;
    width: 60px;          /* largo de la línea */
    height: 2px;          /* grosor */
    background: #0771b9;  /* color */
    margin: 30px auto 0;  /* centrada */
    border-radius: 2px;
  
  }

  .descripcion__texto{
    margin: 0 10px;
    text-align: center;
    font-size: 16px;
    line-height: 1.5;
  }

  .descripcion__imagen,
  .innovamos__imagen{
    width: 90%;
    margin: 20px 10px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.747);
  }

  /* Configuracion de equipos ------------------------------------------------------------------------------------------------------------*/

  .equipos__titulo,
  .innovamos__titulo,
  .clientes__titulo{
    font-family: "Bebas Neue", sans-serif;
    font-size: 3rem;
    color: rgb(39, 39, 39);
    text-align: center;
    margin: 40px 10px;
    font-weight: 400;

  }

  .equipos__subtitulo{
    font-family: "Bebas Neue", sans-serif;
    font-size: 2.5rem;
    font-weight: 300;
  }

  .equipos__descripcion{
    line-height: 1.5;
  }
  

  .equipos__contenedor-izquierdo,
  .equipos__contenedor-derecho,
  .servicios{
    position: relative;
    width: 100%;
    
  }

  .equipos__contenedor-izquierdo img,
  .equipos__contenedor-derecho img,
  .servicios img{
    width: 100%;
    display: block;
  }

  .equipos__contenedor-izquierdo::after,
  .equipos__contenedor-derecho::after,
  .servicios::after{
    content: "";
    position: absolute;
    width: 100%;
    inset: 0;
    background: #222020;
    opacity: 0.3;
    z-index: 0;
    
  }
  .equipos__contenedor-derecho::after{
    background: #2f6891;
    opacity: 0.4;
  }

  .equipos__sobre-imagen{
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    text-align: center;
    z-index: 1;
  }

  .equipos__boton,
  .innovamos__boton,
  .servicio__boton,
  .Informacion__boton,
  .suscripcion__boton {
    margin-top: 5%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    border-radius: 999px; /* pill */
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
  
    border: none;
    background: #0771b9;
    color: #ffffff;
  
    transition: 
      background 0.3s ease,
      transform 0.2s ease,
      box-shadow 0.2s ease;
  }

  .equipos__boton:hover,
  .innovamos__boton:hover,
  .Informacion__boton:hover {
    background: #055a93;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
  }
  
  .equipos__boton:active
  .innovamos__boton:active,
  .Informacion__boton {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  }
  
  

  /* Configuracion Innovamos */

  .innovamos__contenedor-texto,
  .servicio__contenedor-texto{
    display: flex;
    flex-direction: column;
    align-items: center; 
    margin: -40px 5% 40px;
    
  }
  .innovamos__contenedor-imagen{
    margin-left: 5%;
    margin-bottom: 1%;
  }

  .servicios__imagen::after{
    background: #000000;
    opacity: 0.8;
  }

/* Configuracion Servicios */
.servicio__titulo{
  color: white;
}

.servicios__imagen{
  height: 30rem;
  width: 100%;
  display: block;
}
.servicios::after{
  background: #2f6891;
  opacity: 0.7;
}

/* Cofiguracion de Clientes */
.clientes{
  margin-bottom: 15%;
}
.clientes__carrusel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  position: relative;
  width: 80%;
  margin: auto;
}

.clientes__viewport {
  overflow: hidden;
  width: 70%;
}

.clientes__track {
  display: flex;
  gap: 60px;
  transition: transform 0.4s ease;
  align-items: center;
}

.clientes__track img {
  height: 60px;
  object-fit: contain;
  transition: transform 0.3s;
}

.clientes__track img:hover {
  transform: scale(1.1);
}

/* FLECHAS */
.clientes__flecha {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  background: transparent;
  border-style: solid;
  cursor: pointer;
  z-index: 5;
  opacity: 0.6;
  transition: opacity 0.3s, transform 0.2s;
}


/* FLECHA IZQUIERDA ◀ */
.clientes__flecha--prev {
  left: -30px;
  border-width: 14px 18px 14px 0;
  border-color: transparent #091d3e transparent transparent;
}

/* FLECHA DERECHA ▶ */
.clientes__flecha--next {
  right: -30px;
  border-width: 14px 0 14px 18px;
  border-color: transparent transparent transparent #091d3e;
}


/*Configuracion de Informacion */

.Informacion,
.suscripcion {
  max-width: 100%;
  padding: 60px 40px;
  background: #091d3e;
  color: white;
  text-align: center;
  

  /* efecto 3D / elevación */
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
}

.Informacion__titulo,
.suscripcion__titulo{
  font-family: "Bebas Neue", sans-serif;
  font-weight: 300;
  font-size: 2rem;
}

/*configuracion de Subscripcion*/
.suscripcion{
  background: #0771b9;
  gap: 5%;
  
}
.suscripcion__boton{
  background: #222020;
}

.suscripcion__campo {
  margin: 12px auto;
  padding: 10px 14px;
  font-size: 0.95rem;
}

/* Configuracion del Footer*/
.footer{
  align-items: left;
}
.footer__izquierda,
.footer__central,
.footer__derecha{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:center ;
  text-align: center;
  margin: 10%;
  color: #363636;
}
.footer__logo{
  margin: 2%;
  margin-bottom: 10%;
  width: 80%;
}
.footer__titulo{
  font-family: "Bebas Neue", sans-serif;
  font-size: 2.5rem;
  font-weight: 300;
  margin-bottom: 5%;
  
}
.footer__listado{
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer__item{
  text-decoration: none;
  color: inherit;
  line-height: 1.5;
  font-size: 0.9rem;
  
}

.footer__texto{
  color: #7c7b7b;
}

.footer__mail{
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.4;
  margin-top: 3%;
  text-decoration: none;
  color: #0771b9;
  font-weight: 600;
}

.footer__mail svg {
  display: block;
}

.firma {
  width: 100%;
  border-top: 1px solid rgba(255,255,255,0.2);
  margin-top: 40px;
  padding: 15px 20px;
  text-align: center;
  background: #363636;
}

.firma__texto {
  margin: 0;
  font-size: 0.85rem;
  color: #ccc;
  line-height: 1.4;
}

.firma__link {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}

.firma__link:hover {
  text-decoration: underline;
}




 
/*---------------------------------------------------------------------------------------------------------*/
@media (max-width: 480px) {
  .btn {
    width: 100%;
    padding: 14px;
  }
}



/*---------------------------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------*/
 @media (min-width: 768px){

  /* Configuracion de Menu */

  .header{
    padding: 3% 5%;
    
    
  }
  
  .header__burger{
    display: none;
  }
 

  .header__navbar{
    display: flex;
    align-items: center;
    gap: 0.7rem;
  }

  .header__nav-link{
    color: white;
    text-decoration: none;
    font-weight: bold;
    white-space: nowrap;
    
  }

  /*Configuracion Linea------------------------------------------------------------------------------------------------------------------------*/

  
  

  /* Configuracion texto del video ------------------------------------------------------------------------------------------------------------*/

  .main__contenedor-video {
    height: 70vh;
  }
  .main__contenedor-texto{
    align-items: flex-start;
    align-self:auto;
    text-align:left;
    margin-left: 5%;

  }

  .main__titulo{
    font-size: clamp(3rem, 4vw, 8rem);
    font-weight: 400;
    max-width: 600px;
    line-height: 1.2;
  }

  /* Configuracion Conteo */
  .main__contenedor-conteo,
  .equipos__contenedor,
  .innovamos,
  .footer,
  .suscripcion{
    display: flex;
    flex-direction: row;
    justify-content: center;
    
 }
 

 .main__conteo{
  font-size: 3.5rem;
 }

 /* Configuracion seccion descripcion---------------------------------------------------------------------------------------------------------- */

 .descripcion__titulo,
 .descripcion__texto,
 .equipos__titulo,
 .innovamos__titulo,
 .servicio__titulo,
 .clientes__titulo{
   text-align:left;
 }

 .descripcion__titulo::after,
  .servicio__titulo::after,
  .equipos__titulo::after,
  .innovamos__titulo::after{
    margin: 30px 0px;
  }

.descripcion{
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-left: 5%;

}
.descripcion__contenedor-imagen{
  margin: 0;
  padding: 0;
  margin-top: 5%;
  margin-right: 0%;
  width: 300%;
  height: auto;
  align-self:auto;
  
}

.descripcion__imagen{
  margin:2%;
  padding:0;
  width: 95%;
}
/* Configuracion de Equipos------------------------------------------------------------------------------------------------------------------- */

.equipos__subtitulo{
  margin-top: auto;
}
.equipos__imagen{
  width: 100%;
  display: block;
  height: 120%;
  
}

.equipos__contenedor-izquierdo,
  .equipos__contenedor-derecho{
    width: 100%;
    align-items: flex-start;
    
    
  }

  .equipos__contenedor-izquierdo::after,
  .equipos__contenedor-derecho::after{
    height: 120%;
  }

  .equipos__sobre-imagen{
    margin: 15% 20%;
    align-items: center;
    inline-size: none;
    align-self: flex-start;
    gap: 5%;
  }
    

/* Configuracion Innovamos--------------------------------------------------------------------------------------------------------------------*/

.innovamos{
  margin: 0;
  margin-top: 2%;
  padding: 0;
}

.innovamos__contenedor-imagen{
  width: 300%;
  max-width: 400px;
  margin-top: 7%;
  margin-left: 0;
  margin-right: 5%;
}

.innovamos__contenedor-texto{
    align-items: flex-start;
    align-self: center;
    text-align:left;
    margin: auto;  
  }

  .innovamos__texto{
    margin-top: -8%;
    margin-right: 7%;
    line-height: 1.5;
  }

  

/* Configuracion Servicios------------------------------------------------------------------------------------------------------------------- */

.servicios__imagen{
  height: 20rem;
 
}
.servicio__boton{
  align-items:baseline;
  
}

.servicio__contenedor-texto{
  align-items:self-start; 
  margin: 0px 35% 3% 5%;
  padding: 0;
  text-align: left;
  
}


/*Configuracion Clientes */
.clientes{
  text-align: center;
}
.clientes__titulo{
  text-align: center;
}
.clientes__texto{
  margin-bottom: 5%;
}

/*Configuracion Subscripcion */

.suscripcion{
  max-height: -200%;
  padding: 2%;
}
.suscripcion__titulo,
.Informacion__titulo{
  font-size: 2.5rem;
  text-align: left;
  margin: 0;
  padding: 0;
}
.Informacion__titulo{
  text-align: center;
}


.suscripcion__titulo{
  margin-top: 0%;
}

.suscripcion__campo{
  max-height: 50px;
  margin-top: 2%;
}

.suscripcion__boton{
  margin-top: 2%;
  max-height: 50px;
}

/*Configuracion Footer */

.footer{
  padding: 20px;
  gap:20px;
  align-items: flex-start;
  
 }

 
 .footer__izquierda,
.footer__central,
.footer__derecha{
  display: grid;
  flex: 1 1 0;
  min-width: 0;
  padding: 0;
  margin: 20px 20px;
  
  text-align:left;
}

.footer__titulo{
  text-align: left;
  
}



}

/*------------------------------------------------------------------------------------------------------------*/
 @media (min-width:1024px){

  /* Configuracion Video */

  .main__contenedor-video {
    height: 70vh;
  }

  /*Configuracion de Conteo */

  .main__conteo {
    line-height: 1.4;
  }

  .main__conteo-item{
    margin-left: 3%;
  }

  .main__contenedor-conteo {
    max-width: 1200px;
    width: 80%;
    margin: -30px auto 0;
    padding: 20px;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}

  /* Configuracion Descripcion */
  .descripcion__contenedor-imagen{
    width: 190%;
    
  }
  
  .descripcion{
    margin-left: 0;
  }

  /* Configuracion Equipos*/

  .equipos__sobre-imagen{
    margin-top: 15%;
  }
  .equipos__contenedor-izquierdo,
  .equipos__contenedor-derecho{
    height: 20rem;
  }
  /* Confguracion Informacion */
  .Informacion{
    margin-top: -5%;
  }

   /* Confguracion Servicios */
   
  .servicios__imagen{
    height: 27rem;
    display: block;
  }

  .servicio__contenedor-texto{
    align-items:self-start; 
    margin: 0px 40% 0 5%;
    padding: 0;
    text-align: left;
    
  }
  /*Configuracion de Suscripcion*/
  
  .suscripcion__titulo{
    margin: 0;
    padding: 0;
    align-self: center;
  }

  /* Configuracion de Footer */

  .footer{
    margin-top: 3%;
  }

  .footer__logo{
    max-width: 200px;
    margin-left: 15%;
  }

 }

/*---------------------------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------------------------*/
@media (min-width:1440px){

  /* Menu ----------------------------------------------------------------------*/

.header__logo{
  max-width: 180px;
  
}

.header__nav-link{
  font-size: 1.2rem;
  margin-left: 1.5%;
}
  
/*Contador*/

.main__titulo{
  font-size: 4rem;
  max-width: 50%;
}

.main__subtitulo{
  font-size: 1.3rem;
}

.main__conteo{
  font-size: 4.2rem;
  margin: 0;
  padding: 0;
  
}
.main__conteo-titulo{
  font-size: 1.6rem;
  letter-spacing: 0.3px;
}

.main__conteo-item{
  gap: 1px;
}

.main__contenedor-conteo{
  
  padding: 25px;
  padding-right: 60px;
}

/*-----------------tamaños de letras-----------------------*/

.descripcion__titulo,
.servicio__titulo{
  font-size: 2.5rem;
}

.descripcion__texto,
.equipos__descripcion,
.innovamos__texto,
.servicio__texto,
.clientes__texto{
  font-size: 1.3rem;
}

.equipos__titulo,
.innovamos__titulo,
.clientes__titulo{
  font-size: 3.6rem;
}

.equipos__subtitulo{
  font-size: 3rem;
  margin-bottom: 3%;
}


/* Descripcion */

.descripcion,
.innovamos{
  margin: 0 5%;
}



.descripcion__imagen{
  width: 90%;
  margin:0 5%;
  margin-right: 0;
  padding: 0;
  
}

/*Equipos*/

.equipos__titulo{
  margin-left: 5%;
}


.equipos__imagen{
  height: 130%;
}

.equipos__contenedor-izquierdo::after,
.equipos__contenedor-derecho::after{
  height: 130%;
}

/*Innovamos*/

.innovamos{
  margin-top: 3%;
}

.innovamos__contenedor-imagen{
  width: 160%;
  max-width: 1000px;
  
}



.innovamos__titulo{
  margin-top: 7%;
}

.innovamos__texto{
  margin-top: -2%;
}

/*Footer*/

.footer__texto{
  width: 70%;
  margin-left: 10%;
}

.footer__mail{
  margin-left: 10%;
  margin-top: 3%;
}

.footer__item{
  line-height: 1.8;
}

.footer__izquierda,
.footer__central,
.footer__derecha{
  margin: 20px 0;
}

}