/* DESARROLLADO POR HTTPS://NICODURSO.COM*/
/* DESARROLLADO POR HTTPS://NICODURSO.COM*/
/* DESARROLLADO POR HTTPS://NICODURSO.COM*/
/* DESARROLLADO POR HTTPS://NICODURSO.COM*/
/* DESARROLLADO POR HTTPS://NICODURSO.COM*/

body, h1, p, ul, li, button {
  margin: 0;
  padding: 0;
  font-family: 'Montserrat', sans-serif;
}

body {
  background-color: #ffffff;
  
}

.logo {
  max-width: 240px;
  max-height: 100px;
  width: auto;
  height: auto; 
  object-fit: contain;
}

.links {
  list-style-type: none;
  display: flex;
  align-items: center;
  text-decoration: none;
  color: white;
  
}

.logo-be {
scale: 1.2;
margin-top: 2px;
}

.lang-options {
  cursor: pointer;
  font-weight: bold;
  color: blue;
  text-decoration: underline;
}


.header {
  background-color: #4c3770;
  color: #fff;
  padding: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: solid 4px transparent;
  flex-wrap: wrap;
  position: fixed; /* Fija el header en la parte superior */
  z-index: 999;
  width: 100%;
}

.navbar {
  flex-grow: 1;
}

.nav-links svg,
.mobile-nav-links svg {
  width: 24px;
  height: 24px;
  fill: #ffffff;
  transition: fill 0.3s;
  margin: -4px;
  transition: 0.2s;
  cursor: pointer;

}


.nav-links svg:hover,
.mobile-nav-links svg:hover {
  transform: scale(1.2);
  color: #d6cece; /* Color del texto en hover */

}

/* Navbar para pantallas grandes */
@media (min-width: 1200px )  {
  .nav-links {
    display: flex;
    list-style-type: none;
    justify-content: flex-end; /* Alinea los enlaces a la derecha */
    flex-grow: 1; /* Permite que el contenedor crezca y ocupe el espacio disponible */
    margin: 0; /* Elimina el margen predeterminado */
    padding: 0; /* Elimina el padding predeterminado */
    
  }
  
  .nav-redes {
    display: flex;
    list-style-type: none;
    margin-left: 100px;
    margin-right: 40px;
  }

  .nav-links li {
    margin-right: 20px;
  }

  .nav-links a {
    text-decoration: none;
    color: #fff;
    font-size: 1em;
    margin-left: 10px;
    transition: transform 0.2s; /* Cambiado para incluir la transformación */

  }


  .nav-links a:hover {
    transform: scale(1.07); /* Escala en hover */
  }

  .mobile-nav-toggle {
    display: none;
  }

  .mobile-nav-links {
    display: none;
  }
}



.banner-container {
  position: relative;
  width: 100%;
  height: 120vh; /* Altura inicial para escritorio */
  overflow: hidden;
}

video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Asegura que el video cubra el contenedor */
  z-index: -1;
}

/* Ajustes para móviles */
@media (max-width: 1200px) {
  .banner-container {
    height: 90vh; /* Ajusta la altura para móviles si es necesario */
  }
}


/* Media query para dispositivos móviles */
@media (max-width: 768px) {
  .banner {
    height: auto; /* Ajusta la altura automáticamente */
    padding: 20px 0; /* Reduce el padding */
    font-size: 18px; /* Reduce el tamaño de la fuente */
  }
    /* Estilo del título */
    .text-container h1 {
      font-size:2.2rem;
      margin: 0;
      line-height: 1;
      text-transform: uppercase;
  }
  /* Estilo del párrafo */
  .text-container p {
    font-size: 0.8rem;
    margin-top: 10px;
}
}

#banner-text {
  animation: typeText 2s infinite alternate;
  margin-top: 100px;

}

@keyframes typeText {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-100%);
  }
}

/* Estilos para la última palabra */
#changing-word {
  color: #ffffff;
  font-size: 1em;
  font-family: 'Montserrat', Helvetica, sans-serif;
}

#titulosseccionestodas{
  font-size: 20px;
  margin-bottom: 4px;
} 





.section-2 {
  width: 100%;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff; /* Color de fondo opcional */
  box-sizing: border-box;
}

.section-2-text {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(1rem, 2.5vw, 2.2rem); /* Ajusta el tamaño del texto */
  text-align: center; /* Centrado del texto */
  color: #4c3770;
  line-height: 1.5; /* Espaciado entre líneas */
  white-space: normal; /* Permite saltos automáticos */
  margin: 0 auto;
  max-width: 90%; /* Asegura que el texto no se extienda demasiado */
}


/* Media query para pantallas de 768px o menos */
@media (max-width: 768px) {
  .section-2 {
    height: auto; /* Ajusta la altura automáticamente en pantallas pequeñas */
    padding: 60px; /* Agrega padding para mejorar la legibilidad */
  }

  .section-2-text {
    font-size: 1.5em; /* Reduce el tamaño de la fuente en dispositivos móviles */
    line-height: 1.1; /* Ajusta el espaciado entre líneas */
  }

}



.section-3 {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  overflow: hidden;
  box-sizing: border-box;
  max-height: 800px;
}

.image-container {
  position: relative;
  width: 100%;
}

.responsive-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.overlay-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fd7e9f;
  font-size: clamp(2em, 6vw, 6em); /* Tamaño del texto adaptable */
  text-align: center;
  padding: 10px 20px;
  font-family: 'Barricada-pro';
}


/* Media query para pantallas de 768px o menos */
@media (max-width: 768px) {
  .section-2 {
    height: auto; /* Ajusta la altura automáticamente en pantallas pequeñas */
    padding: 60px; /* Agrega padding para mejorar la legibilidad */
  }

  .section-2-text {
    font-size: 1.5em; /* Reduce el tamaño de la fuente en dispositivos móviles */
    line-height: 1; /* Ajusta el espaciado entre líneas */
  }

}

/* Media query para pantallas de 768px o menos */
@media (max-width: 500px) {
  .section-2 {
    height: auto; /* Ajusta la altura automáticamente en pantallas pequeñas */
    padding: 20px; /* Agrega padding para mejorar la legibilidad */
    margin: 0 auto;
  }

  .section-2-text {
    font-size: 1em; /* Reduce el tamaño de la fuente en dispositivos móviles */
    line-height: 1.1; /* Ajusta el espaciado entre líneas */
  }

  

}
















/* Estilos de la sección 3 */
.seccion-4 {
  padding: 4rem;
  background-color: #ffffff;
  font-family: 'Montserrat', sans-serif;

}
.barricada-pro{
font-family: 'barricada-pro',serif;
font-weight: 400;
font-style: normal;
}

.seccion-4-header {
  text-align: center;
  margin-bottom: 2rem;
}

.seccion-4-header h1 {
  font-size: 3.7rem;
  font-weight: bold;
  color: #4e2a84; /* Color morado */
  margin-bottom: 4rem;
  font-family: 'Barricada-pro',serif;
}

.intro-text {
  display: flex;
  justify-content: center;
  text-align:start; /* Alinea todos los items al inicio */
  gap: 1rem;
  flex-wrap: wrap;
  margin: 2rem;
  
}

.intro-item {
  display: flex;
  text-align: start;
  color: #613e94; /* Color morado */
  font-size: 1.4rem;
  max-width: 300px;
}

.arrow {
  font-size: 4rem;
  color: #4e2a84; /* Color morado */
  padding: 10px;
  margin: 2PX;
}

.seccion-4-services {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem 1rem;
  align-items: start; /* Alinea todos los items al inicio */
}

.service-item {
  padding-top: 2rem;
  position: relative;
  max-width: 300px; /* Limitar ancho de cada item */
  margin: 0 auto; /* Centrar cada tarjeta */
}

.service-item h2 {
  font-size: 1.5rem;
  color: #f57c7c; /* Color rojo */
  margin-bottom: 0.5rem;
  display: flex;
  text-align: start;
  flex-direction: column;
  border-top: 2px solid #f57c7c; /* Línea superior en rojo */
  padding-top: 1rem;
  position: relative;
  margin-bottom: 2.5rem;
  height: 80px;
}

.service-number {
  font-size: 1.4rem;
  color: #f57c7c;
  position: absolute;
  top: -3rem;
  left: 0;
  font-weight: bold;
}

.service-item p {
  font-size: 1.4rem;
  color: #333;
  text-align: start;
}



/* sección 5*/
/* sección 5 */
.section-SLIDER {
  display: flex;
  justify-content: center;
  align-items: center;
}

.objetivo-sectionSLIDER {
  text-align: center;
  max-width: 1200px;
  width: 100%;
  padding: 2rem;
  font-family: 'Montserrat', sans-serif;
}

.objetivo-sectionSLIDER h2 {
  color: #ff6b6b;
  font-size: 1.6rem;
  margin-bottom: 20px;
}

.objetivo-sectionSLIDER h2 span {
  font-size: 1.6rem;
  color: #ff6b6b;
  font-weight: normal;
}

.image-slider {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.image-containerSLIDER {
  display: flex;
  gap: 20px; /* Aumenta el espacio entre las imágenes */
  transition: transform 0.3s ease;
  justify-content: space-between;
  flex-wrap: wrap;
  background-color: transparent;
}

.image-boxSLIDER {
  width: calc(33.333% - 20px); /* Ajuste para que las imágenes tengan más espacio */
  height: 250px; /* Aumenta la altura de las imágenes para que se luzcan más */
  background-color: transparent;
  border-radius: 10px;
  overflow: hidden; /* Para mantener las imágenes dentro de los bordes */
  display: flex;
  justify-content: center;
  align-items: center;
}

.image-boxSLIDER img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Hace que las imágenes se ajusten al contenedor sin deformarse */
  border-radius: 10px; /* Aplica el borde redondeado directamente a las imágenes */
}







/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */

.section-5 {
  display: flex;
  justify-content: center; /* Centra el contenido horizontalmente */
  align-items: center; /* Centra el contenido verticalmente */
  background-color: #ffffff; /* Color de fondo */
}

.section5-image {
  max-width: 100%; /* No exceder el ancho del contenedor */
  overflow: hidden; /* Esconde cualquier parte de la imagen que exceda el contenedor */
  max-height: 60%;
  margin-bottom: -200px;
}

.responsive-image {
  width: 100%; /* La imagen ocupa el 100% del contenedor */
  display: block; /* Elimina el espacio debajo de la imagen */
}

/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */
/* sección 5 */







/* sección 6 */
/* sección 6 */
/* sección 6 */
/* sección 6 */
/* sección 6 */
.section6-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.objetivo-section6 {
  text-align: center;
  max-width: 1000px;
  width: 100%;
  padding: 2rem;
  padding-top: 6rem;
  font-family: 'Montserrat', sans-serif;
}

.objetivo-section6 h2 {
  color: #ff6b6b;
  font-size: 1.6rem;
  margin-bottom: 60px;
}

.image-slider6 {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.image-container6 {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: start;
}

.image-box6 {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  width: 23%; /* Se ajusta a 4 columnas */
  height: 100px;
  transition: transform 0.3s ease;
}

.image-box6:hover {
  transform: scale(1.05);
}

.image-box6 img {
  max-width: 80%;
  max-height: 80%;
  border-radius: 8px;
  transition: transform 0.3s ease, filter 0.3s ease;
  filter: grayscale(140%); /* Blanco y negro */
}

.image-box6:hover img {
  filter: grayscale(2%); /* Color al hacer hover */
}

.responsive-image {
  display: block;
  width: 100%;
  height: auto;
}



@media (max-width: 768px) {
  .image-slider6 {
    position: relative;
    overflow: hidden;
    width: 100%;
  }


  .image-container6 {
    display: flex;
    flex-wrap: nowrap;
    gap: 15px;
    transition: transform 0.5s ease-in-out;
    scroll-behavior: smooth;
    animation: autoSlide 20s ease-in-out infinite alternate; /* Movimiento bidireccional */
  }

  .image-box6 {
    min-width: 80%;
    margin-right: 0px;
  }

  /* Indicadores */
  .slider-indicators {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
  }

  .indicator {
    width: 8px;
    height: 8px;
    background-color: #ff6b6b;
    border-radius: 50%;
    opacity: 0.5;
    transition: opacity 0.3s ease;
  }

  .indicator.active {
    opacity: 1;
  }
}

/* Estilos para pantallas medianas */
@media (min-width: 769px) and (max-width: 1024px) {
  .image-box6 {
    width: 45%; /* Dos columnas en pantallas medianas */
  }

  .section5-image {
    max-width: 100%; /* No exceder el ancho del contenedor */
    overflow: hidden; /* Esconde cualquier parte de la imagen que exceda el contenedor */
    max-height: 40%;
    margin-bottom: -60px;
  }
  
}


/* Animación para mostrar todas las imágenes */
@keyframes autoSlide {
  0% { transform: translateX(0); }
  100% { transform: translateX(-1250%); } /* Ajustar según el número total de imágenes */
}


@media (max-width: 450px) {
  .image-box6 {
    min-width: 80%;
    margin-right: -40px;
    width: auto;
  }

  .image-container6 {
    display: flex;
    flex-wrap: nowrap;
    gap: 15px;
    transition: transform 0.5s ease-in-out;
    scroll-behavior: smooth;
    animation: autoSlide 15s ease-in-out infinite alternate; /* Movimiento bidireccional */
  }

  /* Animación para mostrar todas las imágenes */
@keyframes autoSlide {
  0% { transform: translateX(0); }
  100% { transform: translateX(-1050%); } /* Ajustar según el número total de imágenes */
}
}


/* sección 6 */
/* sección 6 */
/* sección 6 */
/* sección 6 */
/* sección 6 */

@media (max-width: 768px) {
  .image-containerSLIDER {
    flex-wrap: nowrap;
    gap: 2px; /* Espacio entre imágenes en móvil */
    transition: transform 0.5s ease;
  }

  .image-boxSLIDER {
    min-width: 100%; /* Aumenta el tamaño de la imagen en mobile */
    margin-right: 10px;
    scroll-snap-align: center;
    border-radius: 10px;
  }

  .image-slider {
    display: flex;
    align-items: center;
    position: relative;
  }

  .slider-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    border: none;
    padding: 4px;
    cursor: pointer;
    z-index: 10;
    font-size: 1.2rem;
    color: #ffffff;
    -webkit-appearance: none;
    appearance: none;        
}

  .slider-button.left {
    left: 4px;
  }

  .slider-button.right {
    right: 4px;
  }

  .objetivo-sectionSLIDER h2 {
    font-size: 0.9rem;
    margin-bottom: 15px;
  }
  
  .objetivo-sectionSLIDER h2 span {
    font-size: 0.9rem;
  }

  .objetivo-section6 h2 {
    font-size: 1rem;
    margin-bottom: 80px;
  }
}


/* Responsivo */
@media (max-width: 992px) {
  .seccion-4-services {
      grid-template-columns: repeat(2, 1fr);
  }
}




/* Responsivo */
@media (max-width: 1000px) {
  .seccion-4-header h1 {
      font-size: 1.8rem;
  }
  .intro-text {
    flex-direction: column;
    align-items: center;
}
.intro-item {
    max-width: 100%;
    justify-content: center;
}
  .seccion-4 .service-item h2 {
      font-size: 1rem;
  }
  .seccion-4 .service-item p {
      font-size: 0.8rem;
  }
  .seccion-4-services {
    grid-template-columns: 1fr;
}
.service-item h2 {
    font-size: 1rem;
    margin-bottom: 20px;
    height: auto;
}
.service-item p {
    font-size: 0.8rem;
}

.arrow {
  font-size: 2rem;
  color: #4e2a84; /* Color morado */
  padding: 0px;
  margin: 0.5PX;
}

.intro-text {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1rem;
  
}

.intro-item {
  display: flex;
  text-align: center;
  color: #613e94; /* Color morado */
  font-size: 1.2rem;
  max-width: 300px;
}
  
}
html, body {
  overflow-x: hidden;
  scroll-behavior: smooth;

}



/* Ajustes específicos entre 1000px y 1340px */
@media (min-width: 1238px) and (max-width: 1370px) {
  .seccion-4 {
    padding: 2rem; /* Reduce padding para pantallas medianas */
  }

  .seccion-4-header h1 {
    font-size: 3.2rem; /* Reduce tamaño del título */
  }

  .arrow {
    font-size: 2.2rem; /* Ajusta tamaño del ícono */
  }

  .section6-wrapper{
  padding: 0px;
  }

  .containerFORM{
  margin-top: 400px;
  }
}


/* Ajustes específicos entre 1000px y 1340px */
@media (min-width: 1140px) and (max-width: 1271px) {

  .arrow {
    font-size: 1rem;
    color: #4e2a84; /* Color morado */
    padding: 0px;
    margin: 0.5PX;
    display: block;
  }
  
  .seccion-4-header h1 {
    font-size: 2.8rem;
    font-weight: bold;
    color: #4e2a84; /* Color morado */
    margin-bottom: 4rem;
  }

  
  .intro-text {
    display: flex;
    justify-content: center;
    gap: 0.8rem;
    flex-wrap: wrap;
    margin: 1rem;
    
  }
  
  .intro-item {
    display: flex;
    text-align: start;
    color: #613e94; /* Color morado */
    font-size: 1.2rem;
    max-width: 280px;
  }

  .objetivo-section6 {
    text-align: center;
    width: 100%;
    padding: 6rem;
    font-family: 'Montserrat', sans-serif;
  }
}




/* Ajustes específicos entre 1000px y 1340px */
@media (min-width: 1000px) and (max-width: 1140px) {

  .arrow {
    font-size: 1rem;
    color: #4e2a84; /* Color morado */
    padding: 0px;
    margin: 0.5PX;
    display: none;
  }
  
  .seccion-4-header h1 {
    font-size: 2.4rem;
    font-weight: bold;
    color: #4e2a84; /* Color morado */
    margin-bottom: 4rem;
  }

  
  .intro-text {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 1rem;
    
  }
  
  .intro-item {
    display: flex;
    text-align: start;
    color: #613e94; /* Color morado */
    font-size: 1.2rem;
    max-width: 260px;
  }
  .objetivo-section6 {
    text-align: center;
    width: 100%;
    padding: 8rem;
    font-family: 'Montserrat', sans-serif;
  }
}

/* Estilos responsivos para móviles */
@media (max-width: 1200px) {
  .nav-links {
    display: none;
  }

  .logomobile {
    max-width: 240px; /* Limita el ancho máximo del logo */
    max-height: 100px; /* Limita la altura máxima del logo */
    width: auto; /* Ajusta el ancho según su proporción */
    height: auto; /* Ajusta la altura según su proporción */
    object-fit: contain; /* Asegura que la imagen mantenga sus proporciones */
    margin-bottom: 20px;
    margin: 0 auto;
  }

  .header{
    padding: 10px 20px;
  }
  .mobile-nav {
    background-color: #4c3770;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    transform: translateY(-100%);
    transition: transform 0.5s ease-in;
    z-index: 1;
    overflow: hidden;
  }

  .mobile-nav.active {
    transform: translateY(0);
  }
  

  .mobile-nav-toggle {
    display: block;
    position: absolute;
    top: 30%;
    right: 15%;
    z-index: 2;
    background: none;
    border: none;
    font-size: 24px;
    color: #fff;
    cursor: pointer;
  }

  .mobile-nav-links {
    list-style-type: none;
    padding: 20px;
    margin: 0;
    text-align: center;
    margin-top: 200px;
  }

  .mobile-nav-links li {
    margin: 20px 0;
  }

  .mobile-nav-links a {
    text-decoration: none;
    color: #f2e9e9;
    font-size: 1.5em;
    display: block;
    padding: 10px;
    transition: color 0.3s;
    transition: 0.2s;
  }

  .mobile-nav-links a:hover {
    transform: scale(1.07);
  }

  .nav-redesmobile {
    display: inline;
    list-style-type: none;
    padding: 0; /* Elimina el padding predeterminado */
    margin: 0; /* Elimina el margen predeterminado */
  }
  
  .nav-redesmobile svg {
    width: 24px;
    height: 24px;
    transition: 0.2s;
}


  .nav-redesmobile li {
    display: inline-flex; /* Cambia a flex para una mejor alineación vertical */
    align-items: center;
    justify-content: center;
    margin-right: 6px; /* Espacio entre los íconos */
}

  
  .nav-redesmobile li:last-child {
    margin-right: 0; /* Elimina el margen del último elemento */
  }
  
  .containerFORM{
  margin-top: 40px;
  }
  
}







/* Estilos para el botón de modo oscuro */
.dark-mode-toggle {
  display: flex;
  align-items: center;
  margin-right: 20px;
}

.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 20px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
}

/* Estilos CSS para centrar el CV */
.cv-container {
  display: flex;
  justify-content: center; /* Centrar horizontalmente */
  align-items: center; /* Centrar verticalmente */
  min-height: 100vh; /* Al menos el alto de la ventana */
}


/* Estilos CSS para centrar el CV en pantallas grandes */
.cv-container {
  display: flex;
  justify-content: center; /* Centrar horizontalmente */
  align-items: center; /* Centrar verticalmente */
  min-height: 100vh; /* Al menos el alto de la ventana */

}

.botondescarga {
  background-color: #007bff; /* Color de fondo del botón */
  color: #fff; /* Color del texto del botón */
  padding: 10px 20px; /* Espaciado interno del botón */
  border: none; /* Sin borde */
  border-radius: 5px; /* Borde redondeado */
  text-decoration: none; /* Elimina la subraya del enlace */
  font-size: 16px; /* Tamaño del texto */
  cursor: pointer; /* Cambia el cursor al pasar sobre el botón */
}


/* Estilos CSS para pantallas más pequeñas (responsive) */
@media screen and (max-width: 1200px) {

  .logo {
    max-width: 180px; /* Limita el ancho máximo del logo */
    max-height: 100px; /* Limita la altura máxima del logo */
    width: auto; /* Ajusta el ancho según su proporción */
    height: auto; /* Ajusta la altura según su proporción */
    object-fit: contain; /* Asegura que la imagen mantenga sus proporciones */
    padding: 4px;
    margin-top: 4px;
    top: 1%;
  }
  
  }

  
/* Estilos CSS para pantallas más pequeñas (responsive) */
@media screen and (max-width: 768px) {
  
.logo {
  max-width: 110px; /* Limita el ancho máximo del logo */
  max-height: 100px; /* Limita la altura máxima del logo */
  width: auto; /* Ajusta el ancho según su proporción */
  height: auto; /* Ajusta la altura según su proporción */
  object-fit: contain; /* Asegura que la imagen mantenga sus proporciones */
  padding: 4px;
  margin-top: 15px;
}
#banner {
  background-color: #ffffff;  
  color: #fff;
  text-align: center;
  width: 100%;
  font-size: 24px; /* Tamaño de fuente más grande */
  font-family: 'Montserrat';
  position: relative;
  overflow: hidden;

}

.logo-be {
margin-top: 40px;
}

.section-5 {
  display: flex;
  justify-content: center; /* Centra el contenido horizontalmente */
  align-items: center; /* Centra el contenido verticalmente */
  padding: 10px; /* Espaciado interno */
  background-color: #ffffff; /* Color de fondo */
  margin-top: -150px;
  margin-bottom: -150px;
}

.section-SLIDER{
  margin-top: -150px;
  min-height: 100vh;
}
}




@media screen and (max-width: 600px) {
  
  
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -150px;
    margin-bottom: -120px;
  }
  
  .section-SLIDER{
    margin-top: -150px;
  
  }

  .section-3 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    overflow: hidden;
    box-sizing: border-box;
    max-height: 1000px;
  }


  .overlay-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fd7e9f;
    font-size: clamp(1.2em, 6vw, 6em); /* Tamaño del texto adaptable */
    text-align: center;
    padding: 10px 20px;
    font-family: 'Barricada-pro';
  }


  .mobile-nav-links {
    margin-top: 140px;
  }

  }
  



  

@media screen and (max-width: 380px) {
  
  
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -150px;
    margin-bottom: 20px;
  }

  }
  























/* FOOTER */
.containerFORM {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 0.5rem;
  margin-top: -300px;
}

.form-section {
  text-align: center;
  width: 100%;
  max-width: 800px;
  padding: 1rem; /* Agregada para mayor separación en móvil */
}

.form-section h1 {
  font-size: 3rem; /* Reducido para dispositivos móviles */
  font-weight: normal;
  font-family: 'Barricada-pro';
  color: #4d3475;
  margin-bottom: 4rem; /* Reducido para dispositivos móviles */
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1rem; /* Reducido para dispositivos móviles */
}

.form-group {
  display: flex;
  flex-direction: row; /* Mantener en fila para pantallas más grandes */
  justify-content: space-between;
  gap: 1rem;
}

.form-field {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.form-field label {
  font-size: 0.9rem;
  color: #4d3475;
  margin-bottom: 0.3rem;
  text-align: start;
}

.contact-form .form-field .mensaje {
  margin-bottom: 4px;
}

.form-field input,
.contact-form textarea {
  width: 100%;
  padding: 0.5rem 0;
  border: none;
  border-bottom: 2px solid #ddd;
  font-size: 1rem;
  color: #333;
}

.textarea-container {
  position: relative;
  display: flex;
  margin-top: 20px;
}

.contact-form textarea {
  width: 100%;
  padding-right: 4rem; /* Espacio para que el texto no quede bajo el botón */
  height: 100px;
  resize: none;
  border: 1px solid #ddd;
  padding: 0.5rem;
}

button {
  background-color: white;
  border: none;
  color: #4d3475;
  border: solid 1px #ddd;
  width: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

#buttonsend {
  background-color: white;
  border: solid 1px #ddd;
  color: #4d3475;
  padding: 0.4rem 1rem; /* Más uniforme entre altura y ancho */
  cursor: pointer;
  border-radius: 5px;
  font-size: 1rem; /* Tamaño del texto ajustado */
  display: inline-block; /* Asegura que no ocupe todo el ancho */
  margin: 1rem auto 0; /* Centra el botón */
  transition: all 0.3s ease; /* Animación suave al interactuar */
  width: auto;
}

#buttonsend:hover {
  background-color: #4d3475;
  color: white;
  border-color: #4d3475;
}

.footer-right li {
  text-decoration: none;
  list-style: none;
}

.footer-right li a {
  text-decoration: none;
  color: white;
}


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


  .containerFORM {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 0.5rem;
    margin-top: 60px;
  }
}

/* Responsive */
@media (max-width: 776px) {
  .form-group {
    flex-direction: column; /* Cambiar a columna en móvil */
    gap: 0; /* Eliminar el espacio entre los campos */
  }

  .form-section h1 {
    font-size: 1.8rem; /* Ajustar el tamaño del encabezado */
  }

  .form-section {
    padding: 0.5rem; /* Ajustar el padding para móvil */
  }

  .contact-form {
    gap: 0.5rem; /* Espacio entre los campos en móvil */
  }

  button {
    font-size: 1.2rem; /* Ajustar el tamaño del botón */
  }

  .contact-form textarea {
    height: 80px; /* Ajustar la altura del textarea */
  }

  .containerFORM {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 0.5rem;
    margin-top: -250px;
  }
}








.footer {
  background-color: #4d3475;
  color: #ffffff;
  height: 300px; /* Ajuste de altura específico */
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  position: relative;

}

.footer-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  width: 100%;
  padding: 0 2rem;
}

.footer-left,
.footer-center,
.footer-right {
  display: flex;
  align-items: center;
}

.footer-left .logo {
  font-family: 'Barricada-pro', sans-serif;
  font-size: 1.8rem;
  font-weight: bold;
  margin-right: 1rem;
}

.lang-options {
  font-size: 0.9rem;
}

.lang-options {
  text-decoration: none;
  list-style: none;
  color: white;
}

.footer-center {
  gap: 1.5rem;
}


.logo-footer {
  scale: 1.1;
  margin-top: 6px;
  }

.footer-center ul {
  list-style-type: none; /* Elimina los puntos de la lista */
  padding: 0; /* Elimina el padding */
  margin: 0; /* Elimina el margin */
}

.footer-center li {
  display: inline-block; /* Asegura que los íconos se alineen en una fila */
  margin-left: 10px; /* Espaciado entre los íconos */
  vertical-align: middle; /* Asegura que los SVG se alineen verticalmente */
}

.footer-center svg {
  width: 24px; /* Ajusta el tamaño según sea necesario */
  height: 24px; /* Ajusta el tamaño según sea necesario */
  fill: #ffffff; /* Asegúrate de que los íconos sean visibles */
}

.footer-center li:hover {
  color: #d6cece; /* Color del texto en hover */
  transform: scale(1.07); /* Escala en hover */
}

.footer-right .contact-email {
  font-size: 0.9rem;
}

/* Barritas divisorias */
.divider {
  width: 1px; /* Ancho de la barra */
  height: 100px; /* Altura de la barra */
  background-color: #ffffff; /* Color de la barra */
  margin: 0 10px; /* Espaciado alrededor de la barra */
  display: inline-block; /* Mantiene la barra en línea */
}


/* Responsive Design */
@media (max-width: 600px) {
  .footer-container {
    flex-direction: column;
    text-align: center;
  }

  .footer-left,
  .footer-center,
  .footer-right {
    margin-bottom: 1rem;
  }
  /* Barritas divisorias */
.divider {
  display: none; /* Mantiene la barra en línea */
}

.lang-options {
  margin-top: 25px;
}

}

/* Responsive Design */
@media (max-width: 450px) {
.section6-wrapper{
  padding: 0px;
  }
}







/* Ajustes específicos entre 1000px y 1340px */
@media (min-width: 1038px) and (max-width: 1450px) {
  .seccion-4 {
    padding: 2rem; /* Reduce padding para pantallas medianas */
  }

  .seccion-4-header h1 {
    font-size: 3.2rem; /* Reduce tamaño del título */
  }


/* FOOTER */
.containerFORM {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 0.5rem;
  margin-top: 140px;
}

  .arrow {
    font-size: 2.5rem; /* Ajusta tamaño del ícono */
  }

  .section6-wrapper{
  padding: 0px;
  margin-top: 20px;
  }

  .containerFORM{
  margin-top: 0px;
  }

}












.desarrollador {
  position: absolute;
  bottom: 10px; /* Espacio desde el borde inferior */
  right: 10px; /* Espacio desde el borde derecho */
  list-style: none;
  margin: 0;
}

.desarrollador a {
  text-decoration: none;
  color: #ffffff;
  font-weight: bold;
  font-size: 0.5em;
  padding: 5px 10px;
  border-radius: 5px;
  transition: color 0.3s, background-color 0.3s;
  font-family: 'Montserrat', sans-serif;
}

.desarrollador a:hover {
  color: #78828b;
}

@media (max-width: 600px) {
  .desarrollador a {
    font-size: 0.4em;
  }

  .desarrollador {
    display: none;
  }
  
}





















@media (max-width: 450px) {

  .section-2-text {
    font-size: 0.9em; /* Reduce el tamaño de la fuente en dispositivos móviles */
    line-height: 1.2; /* Ajusta el espaciado entre líneas */
  }

  /* secc 4 */
  .objetivo-sectionSLIDER h2 {
    font-size: 0.9rem;
    margin-bottom: 15px;
  }
  
  .objetivo-sectionSLIDER h2 span {
    font-size: 0.9rem;
  }

/* secc 5 */
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -30vh;
    margin-bottom: 2px;
  }

  /* secc 6 */
  .objetivo-section6 h2 {
    color: #ff6b6b;
    font-size: 0.9rem;
    margin-bottom: 10px;
  }


  /* secc 6 */
  .section6-wrapper{
    margin-bottom: 4px;
    min-height: 50vh;
    padding-top: 10vh;
  }


  .containerFORM{
    margin-top: -20vh;
    }
}







@media (max-width: 370px) {

  .section-2-text {
    font-size: 0.7rem;
    line-height: 1.1; /* Ajusta el espaciado entre líneas */
  }

  /* secc 4 */
  .objetivo-sectionSLIDER h2 {
    font-size: 0.7rem;
    margin-bottom: 15px;
  }
  
  .objetivo-sectionSLIDER h2 span {
    font-size: 0.7rem;
  }

/* secc 5 */
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -30vh;
    margin-bottom: 2px;
  }

  /* secc 6 */
  .objetivo-section6 h2 {
    color: #ff6b6b;
    font-size: 0.7rem;
    margin-bottom: 10px;
  }


  /* secc 6 */
  .section6-wrapper{
    margin-bottom: 4px;
    min-height: 50vh;
    padding-top: 10vh;
  }


  .containerFORM{
    margin-top: -25vh;
    }
}




@media (max-width: 330px) {

  .section-2-text {
    font-size: 0.7rem;
    line-height: 1.1; /* Ajusta el espaciado entre líneas */
  }

  /* secc 4 */
  .objetivo-sectionSLIDER h2 {
    font-size: 0.7rem;
    margin-bottom: 15px;
  }
  
  .objetivo-sectionSLIDER h2 span {
    font-size: 0.7rem;
  }

/* secc 5 */
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -30vh;
    margin-bottom: 2px;
  }

  /* secc 6 */
  .objetivo-section6 h2 {
    color: #ff6b6b;
    font-size: 0.7rem;
    margin-bottom: 10px;
  }


  /* secc 6 */
  .section6-wrapper{
    margin-bottom: 4px;
    min-height: 50vh;
    padding-top: 10vh;
  }


  .containerFORM{
    margin-top: -25vh;
    }
}



@media (max-width: 270px) {

  .section-2-text {
    font-size: 0.6rem;
    line-height: 1.1; /* Ajusta el espaciado entre líneas */
  }

  /* secc 4 */
  .objetivo-sectionSLIDER h2 {
    font-size: 0.6rem;
    margin-bottom: 15px;
  }
  
  .objetivo-sectionSLIDER h2 span {
    font-size: 0.65rem;
  }

/* secc 5 */
  .section-5 {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    background-color: #ffffff;
    margin-top: -30vh;
    margin-bottom: 2px;
  }

  /* secc 6 */
  .objetivo-section6 h2 {
    color: #ff6b6b;
    font-size: 0.6rem;
    margin-bottom: 10px;
  }


  /* secc 6 */
  .section6-wrapper{
    margin-bottom: 4px;
    min-height: 50vh;
    padding-top: 10vh;
  }


  .containerFORM{
    margin-top: -28vh;
    }
}