/* ===== RESET ===== */
html, body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: #fff;
  color: #000;
  line-height: 25px;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.idioma{
  background: #000!important;
  text-align: right;
  color: #fff;
  padding: 2px;
  font-size: 0.8em;
}

.listado_idiomas{
  font-size: 0;
}

.listado_idiomas li{
  font-size: 14px;
  display: inline-block;
  margin-right: 10px;
  vertical-align: top;
}

.listado_idiomas li a{
  color: #d2d2d2;
  transition: 0.4s;
}

.listado_idiomas li a:hover{
  color: #fff;
}

.listado_imgs{
  font-size: 0;
}

.listado_imgs li{
  font-size: 14px;
  display: inline-block;
  width: 18%;
  padding: 1%;

}

.listado_imgs li img{
  width: 100%;
  vertical-align: top;
}

.tarjetas{
  width: 318px;
  height: auto;
}

.tarjetas img{
  width: 100%;
  vertical-align: top;
}

.tarjetas_bis{
  width: 523px;
  height: auto;
}

.tarjetas_bis img{
  width: 100%;
  vertical-align: top;
}

/** LISTADO COOKIES **/
.listado_cookies{
  font-size: 0;
}

.listado_cookies li{
  font-size: 14px;
  display: inline-block;
  width: 23%;
  padding: 1%;
  vertical-align: top;
}



/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background: #000;
    color: #fff;
    cursor: pointer;
    padding: 0;
    width: auto;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    font-size: 1.5em;
    font-weight: normal;
    position: relative;
    bottom: 78px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  background-color: #000;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding:0;
  background: #ffae02;
  text-align: center;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  line-height: 35px!important;
  font-size: 14px!important;


}

.panel a{
  color: #000;
}



.campo_inputs {
    width: 96%;
    padding: 2%;
    border: 1px solid rgba(204, 204, 204, 0.5);
    background: 0;
    font-size: 1em;
    color: #999;
    margin-bottom: 1%;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-family: Arial, sans-serif;
}

.campo_textareas {
    width: 96%;
    padding: 2%;
    border: 1px solid rgba(204, 204, 204, 0.5);
    background: 0;
    font-size: 1em;
    color: #999;
    height: 195px;
    border-radius: 5px;
    font-family: Arial, sans-serif;
}

.enviar {
    border: 0 solid #f30024;
    background: #ffae02;
    color: #000;
    cursor: pointer;
    font-weight: bold;
    padding: 2%;
    text-transform: uppercase;
    font-size: .8em;
    margin-top: 1%;
    float: right;
    border-radius: 5px;
    transition: all .3s ease;
    font-family: Arial, sans-serif;
}

.enviar:hover {
    background: #000;
    color: #ffae02;
}

.corner{
  border-radius: 5px;
}

.cont_izq{
  float: left;
  width: 60%;
  /* background: #f5f5f5; */
}

.cont_der{
  float: right;
  width: 38%;
  /*background: #f5f5f5;*/
  text-align: center;
  line-height: 32px;
}

.link_gris_bis{
  color: #666;
  transition: all .3s ease;
}

.link_gris_bis:hover{
  color: #000;
}

.btn_2025{
  color: #000;
  font-weight: bold;
}

.mapa-full-width {
    /* Ocupa el 100% del ancho del viewport (la pantalla) */
    width: 100vw; 
    
    /* Centra el elemento y usa márgenes negativos para "sacarlo" */
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw; 
    margin-right: -50vw; 
    
    /* Esconde cualquier desplazamiento horizontal que pudiera causar */
    overflow-x: hidden; 
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.2);
}

.mapa-full-width iframe {
    /* Asegura que el iframe siempre ocupe el 100% del contenedor */
    width: 100%;
    /* Puedes ajustar esta altura si 450px es demasiado o muy poco */
    height: 450px; 
    /* Elimina el borde de Google Maps si lo deseas (aunque ya está en style="border:0;") */
    border: none;
    display: block; /* Ayuda a eliminar cualquier espacio extra debajo del iframe */
}



.space_2025{
  height: 30px;
}

.centro{
  text-align: center!important;
}

.dos_botones{
  position: relative;
  right: 0;
  float: right;
}


.menu_superior{
  background-color: #ffae02;
  color: #000;
  padding: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
  position: relative;
  z-index: 999;
}

.menu_superior_in{
  width: 1400px;
  margin: 0 auto;
}

.menu{
  float: right;
  position: relative;
  top: 6px;
  font-size: 14px;
}

.menu li{
  display: inline-block;
  margin-right: 20px;
}
.menu li:last-child{
  margin-right: 0;
}
.menu li a{
  color: #000;
  transition: all 0.5s ease-in-out;
}
.menu li a:hover{
  color: #fff;
}

.logo{
width: 150px;
height: auto;
float: left;
}

.logo img{
  width: 100%;
  height: auto;
  vertical-align: top;
}





/** TEXTO **/

.titulo_h1{
  font-size: 1.8em;
  color: #496597;
}

.centrado{
  text-align: center;
  margin-bottom: 60px;
}

.not_izq_2025{
  float: left;
  width: 58%;
  text-align: left;
}

.not_der_2025{
  float: right;
  width: 40%;
}

.texto_ancho_2025{
  text-align: left;
}

.envuelve_ante{
  width: 1200px;
  margin: 0 auto;
}


.not_der_2025 picture {
    display: block;
}

.not_der_2025 img {
    width: 100%;
    vertical-align: top;
    opacity: 0;
    border-radius: 5px;
    transform: scale(0.95);
    transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}

.not_der_2025 img.visible {
    opacity: 1;
    transform: scale(1);
}

/** **/

.not_izq_2025_bis{
  float: left;
  width: 40%;
}

.not_der_2025_bis picture {
    display: block;
}

.not_izq_2025_bis img{
  width: 100%;
  vertical-align: top;
  opacity: 0;
  border-radius: 5px;
  transform: scale(0.95);
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}

.not_izq_2025_bis img.visible {
    opacity: 1;
    transform: scale(1);
}

.not_der_2025_bis{
  float: right;
  width: 58%;
}




@media (max-width: 768px) {

.not_izq_2025{
  float: left;
  text-align: center;
  width: 96%;
  padding: 2%;
}

.not_der_2025{
  float: left;
  width: 96%;
  padding: 2%;
  text-align: center;
}

.not_der_2025 img{
  width: 100%;
  vertical-align: top;
}

.texto_ancho_2025{
  text-align: center;
  width: 96%;
  padding: 2%;
  
}

.not_izq_2025_bis{
  float: left;
  width: 96%;
  padding: 2%;
  text-align: center;
}

.not_izq_2025_bis img{
  width: 100%;
  vertical-align: top;
}

.not_der_2025_bis{
  float: left;
  width: 100%;
  text-align: center;
}



  .envuelve_ante {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  
  .not_izq_2025_bis {
    float: none;
    width: 96%;
    padding: 2%;
    order: 2;
  }
  
  .not_der_2025_bis {
    float: none;
    width: 96%;
    order: 1;
  }

  


}

/*IMG HEADER*/

.img_header {
  width: 100%;
  position: relative; 
  overflow: hidden; 
  z-index: 0;
  
  height: auto; 
  
  display: flex;
  justify-content: center; /* Centra horizontalmente el contenido */
  align-items: center; /* Centra verticalmente el contenido */

}


.imagen-fondo {
  width: 100%;
  height: 100%;
  display: block;

  /* 3. Aseguramos que la imagen llene el contenedor dinámico */
  object-fit: fill; 
  
  /* Nota: object-fit: contain también funcionaría, pero fill asegura que ocupe todo */
  /* Aunque, al tener aspect-ratio en el padre, object-fit: contain es técnicamente suficiente. */
  object-position: center; 
}

.sombra_inf{
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
}


.titulo-centrado {
  /* CRUCIAL para que flote sobre la imagen */
  position: absolute; 
  z-index: 1;
  line-height: 40px;

  /* Opcional: Estilizado del título */
  color: white; 
  text-align: center;
  font-size: 1.8em; /* Ajusta al tamaño deseado */
  text-shadow: 
    2px  2px  3px  rgba(0, 0, 0, 0.7), /* Una sombra más pronunciada */
    -1px -1px 2px  rgba(0, 0, 0, 0.5); /* Y una sombra sutil en la dirección opuesta para un "pop" */
}

.titulo-centrado-dos {
    /* 1. CENTRADO PERFECTO y POSICIONAMIENTO ABSOLUTO */
    position: absolute;
    z-index: 1;
    top: 50%;          /* Empieza en el 50% del contenedor padre */
    left: 50%;         /* Empieza en el 50% del contenedor padre */
    transform: translate(-50%, -50%); /* Retrocede el 50% de su propio ancho/alto */

    /* 2. CONTROL DEL SALTO DE LÍNEA Y RESPONSIVIDAD (CLAVE) */
    max-width: 90%;    /* Limita el ancho del <h1> al 90% de la pantalla */
    width: 850px;      /* Establece un ancho máximo en pantallas grandes (opcional) */

    /* 3. ESTILOS DE TEXTO */
    text-align: center; /* Centra el texto DENTRO del bloque <h1> */
    color: white;
    line-height: 1.2;  /* Mejor que 40px fijos */
    font-size: 1.8em;
    text-shadow: 
    2px  2px  3px  rgba(0, 0, 0, 0.7), /* Una sombra más pronunciada */
    -1px -1px 2px  rgba(0, 0, 0, 0.5); /* Y una sombra sutil en la dirección opuesta para un "pop" */
}

@media (max-width: 600px) {
    .titulo-centrado {
        /*
          max-width ya está en 90%, pero puedes ajustar
          el tamaño de la fuente para que quepan más palabras por línea.
        */
        font-size: 1.4em;
    }

    .titulo-centrado-dos {
        /*
          max-width ya está en 90%, pero puedes ajustar
          el tamaño de la fuente para que quepan más palabras por línea.
        */
        font-size: 1.4em;
    }
}

.centra

.bot_centrado{
  text-align: center;
}

.bot_centrado a{
  color: #fff;
  font-weight: bold;
  font-size: 1.4em;
  background: #f7aa01;
  transition: all 0.3s ease;
  padding: 1%;
  border-radius: 5px;
}

.bot_centrado a:hover{
  background: #ccc;
  color: #000;
}



/** DOS IMGs**/

.box {
  width: 100%;
  height: auto;
  border: 0px solid transparent;
  display: flex;
  flex-wrap: wrap;


}

.box-child {
  width: 50%;
  box-sizing: border-box;

  box-shadow: 0 0 15px rgba(0, 0, 0, 0.8); 
  
  /* Asegura que el elemento sombreado esté encima de sus vecinos */
  position: relative;
  z-index: 1;
}

.box-child.img {
  background-color: transparent;
  overflow: hidden;
  position: relative;
  height: 390px;
}

.box-child.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;

}

.box-child.text {
background-color: #dedede;
  padding: 20px;
  box-sizing: border-box;
  min-height: 390px;
  color: #000;

  display: flex; 
  justify-content: center; 
  align-items: center; 
  flex-direction: column; 
  text-align: center;


}

.tam{
  font-size: 1.4em;
}



.img-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  z-index: 10;
  width: 90%;
}


/** TRES IMGS **/

/* Contenedor principal para 3 columnas */
/* Contenedor principal para 3 columnas */
.box_3 {
  width: 100%;
  height: auto;
  display: flex; /* Habilita el modo Flexbox */
  flex-wrap: wrap; 
}

/* Estilo para cada columna dentro de .box_3 */
.box_3 .box-child {
  width: 33.333%; 
  box-sizing: border-box; 
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.8); 
  
  /* Asegura que el elemento sombreado esté encima de sus vecinos */
  position: relative;
  z-index: 1;


}

/* Estilo de imagen (Mantiene la altura fija y cobertura) */
.box_3 .box-child.img {
  overflow: hidden;
  position: relative; /* ¡CRUCIAL! Es el marco para el posicionamiento absoluto */
  height: 390px;
  
  /* Se eliminan los estilos de Flexbox (display: flex, flex-direction: column) 
     porque la frase ya no es parte del flujo normal, sino que va ABSOLUTA */
}

/* ------------------------------------------- */
/* ESTILOS DE LA FRASE CENTRADA SOBRE LA IMAGEN */
/* ------------------------------------------- */
.box_3 .box-caption {
  /* Posicionamiento y Centrado */
  position: absolute; 
  top: 50%; /* Mueve el inicio de la frase al 50% del alto */
  left: 50%; /* Mueve el inicio de la frase al 50% del ancho */
  transform: translate(-50%, -50%); /* Centra la frase con respecto a sí misma */
  
  /* Estilo visual */
  color: #fff; /* Blanco o el color que contraste */
  font-size: 1.5em; 
  font-weight: bold;
  text-align: center;
  z-index: 10;
  
  /* Mejorar legibilidad sobre la imagen */
  width: 90%; 
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
  
  /* Asegura que el párrafo no tenga márgenes que interfieran */
  margin: 0; 
  padding: 0;
}

/* Estilo de la etiqueta de la imagen */
.box_3 .box-child.img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Estilo de texto (para la columna que no es imagen) */
.box_3 .box-child.text {
  background-color: #dedede;
  padding: 20px;
  min-height: 390px;
  color: #000;

  display: flex; 
  justify-content: center; 
  align-items: center; 
  flex-direction: column; 
  text-align: center;
}



/* Form Home */

.form_home {
    font-family: sans-serif;
    /* background: #9bd09e; */
    padding: 1%;
    color: #496597;
    line-height: 30px;
    /* box-shadow: inset 0 4px 6px rgba(0, 0, 0, 0.3); */
    width: 1200px;
    margin: 0 auto;
    margin-top: 80px;
}

.form_home_envuelve {
    width: 1200px;
    margin: 0 auto;
}

.form_home_izq {
    float: left;
    width: 40%;
    text-align: left;
}

.form_home_tit {
    font-size: 1.8em;
    font-weight: bold;
}

.form_home_der {
    float: right;
    width: 58%;
}

.dos_campos {
    font-size: 0;
    margin-top: 12px;
}

.dos_campos li {
    font-size: 14px;
    width: 33.33%;
    display: inline-block;
    vertical-align: top;
}

.aceptando {
    color: #496597;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-size: 0.9em !important;
    position: relative;
    bottom: 1px;
    font-family: sans-serif;
}

.input_home_bis {
    padding: 4%;
    width: 90.5%;
    border: 0px solid #496597;
    font-family: sans-serif;
    border: 1px solid #496597;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */
}

.enviar_bis {
    border: 1px solid #496597;
    padding: 4%;
    background: #496597;
    font-weight: bold;
    font-family: sans-serif;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
    color: #fff;
}


/** **/

.pie{
  background: #000;
  padding: 2%;
  color: #999;
  font-size: 0.9em;

  box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.8);
  position: relative;
  z-index: 10;

}


.listado_pie {
  display: flex;
  gap: 10px;
  width: 1000px;
  margin: 0 auto;
  /*background: violet;*/
}

.listado_pie li {
  flex-grow: 1;
  box-sizing: border-box;
  color: #999;
  font-size: 13px;
  text-align: left;
   padding: 10px;   /* espacio interno */
  vertical-align: top;
}

.uno  { flex-basis: 23%;
        text-align: center!important;
      }
.dos  { flex-basis: 23%;}

.tres { flex-basis: 48%; }

.contacto_uno{
  width: 48%;
  padding: 1%;
  float: left;
}




.pie a{
  color: #999;
  transition: all ease 0.5s;
}

.pie a:hover{
  color: #fff;
}





 

.img_pie{
  width: 160px;
  height: auto;
  border-radius: 5px;
}

.red_pie{
  font-size: 32px!important;
}

.red_pie a{
  color: #ffae02!important;
  transition: all 0.3s ease;
}

.red_pie a:hover{
  color: #fff!important;
}

.tit_color_pie{
  color: #fff;
}

.circles{
  color: #ffae02;
}



/** BOTON EFECTO **/

.efx_space{
  margin: 0;
}

.efx {
    z-index: 1;
    position: relative;
    top: 10px;
    font-weight: 600;
    font-size: 18px;
    height: 30px;
    padding: 10px;
    width: 70px!important;
    color: #fff!important;
    line-height: 1;
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
    text-align: center;
    background-color: #004070;
    position: relative;
    overflow: hidden;
}

.efx span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 32%;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(transparent));
  background: linear-gradient(top, #ffffff, transparent);
  -webkit-animation: top 1s linear infinite;
          animation: top 1s linear infinite;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.efx span::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 2px;
  height: 32%;
  background: -webkit-gradient(linear, left bottom, left top, from(#ffffff), to(transparent));
  background: linear-gradient(bottom, #ffffff, transparent);
  -webkit-animation: bottom 2s linear infinite;
          animation: bottom 2s linear infinite;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.efx::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 32%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(#ffffff), to(transparent));
  background: linear-gradient(right, #ffffff, transparent);
  -webkit-animation: right 2s linear infinite;
          animation: right 2s linear infinite;
}

.efx::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 32%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(#ffffff), to(transparent));
  background: linear-gradient(left, #ffffff, transparent);
  -webkit-animation: left 2s linear infinite;
          animation: left 2s linear infinite;
}

.efx:hover {
  background-color: #fff!important;
  color: #000!important;
}


/**/

@-webkit-keyframes left {
  0% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@keyframes left {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@-webkit-keyframes right {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@keyframes right {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@-webkit-keyframes top {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@keyframes top {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  100% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@-webkit-keyframes bottom {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@keyframes bottom {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

/**/




.efx_bis {
    z-index: 1;
    position: relative;
    top: 10px;
    font-weight: 600;
    font-size: 18px;
    height: 30px;
    padding: 10px;
    width: 70px!important;
    color: #fff!important;
    line-height: 1;
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
    text-align: center;
    background-color: #ffae02;
    position: relative;
    overflow: hidden;
}

.efx_bis span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 32%;
  background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(transparent));
  background: linear-gradient(top, #ffffff, transparent);
  -webkit-animation: top 2s linear infinite;
          animation: top 2s linear infinite;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.efx_bis span::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 2px;
  height: 32%;
  background: -webkit-gradient(linear, left bottom, left top, from(#ffffff), to(transparent));
  background: linear-gradient(bottom, #ffffff, transparent);
  -webkit-animation: bottom 2s linear infinite;
          animation: bottom 2s linear infinite;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}

.efx_bis::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 32%;
  height: 2px;
  background: -webkit-gradient(linear, right top, left top, from(#ffffff), to(transparent));
  background: linear-gradient(right, #ffffff, transparent);
  -webkit-animation: right 2s linear infinite;
          animation: right 2s linear infinite;
}

.efx_bis::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 32%;
  height: 2px;
  background: -webkit-gradient(linear, left top, right top, from(#ffffff), to(transparent));
  background: linear-gradient(left, #ffffff, transparent);
  -webkit-animation: left 2s linear infinite;
          animation: left 2s linear infinite;
}

.efx_bis:hover {
  background-color: #fff!important;
  color: #000!important;
}




/** BOX **/
@media (max-width: 768px) {
  .box-child {
    width: 100%;
  }
  
  .box-child.img {
    height: auto;
    min-height: 250px;
  }
}


/** CARROUSELL **/
.carousel-container {
    max-width: 800px;
    margin: auto;
    /* Crucial: Oculta las partes de las imágenes fuera del contenedor. */
    overflow: hidden; 
    position: relative;
    /* 🔥 Modificación Clave: Quitamos la altura fija (ej. 400px) 
       y usamos un padding-bottom basado en la proporción de las imágenes (ej. 50%)
       si las imágenes tienen una proporción fija, o permitimos que se ajuste.
       Si las imágenes son de ancho completo y la altura varía, es mejor dejarlo sin altura fija.
    */
    /* Si las imágenes son de la misma altura, se puede usar: */
    /* height: auto; */
    
    /* Para controlar el espacio extra, aseguramos que el flexbox no se desborde */
    line-height: 0; /* Ayuda a eliminar espacios generados por la línea de texto */

}

.carousel-slides {
    display: flex;
    transition: transform 0.5s ease-in-out; 
    /* 🔥 Modificación Clave: Asegura que el contenedor no genere espacio vacío debajo. */
    line-height: 0; 
}

.slide {
    min-width: 100%;
    flex-shrink: 0; 
    
    /* Para las etiquetas <img /> */
    object-fit: contain; 
    height: 100%; 
    width: 100%; 
    object-position: center; 
    
    /* 🔥 Modificación Clave: Para eliminar el espacio en blanco que a veces añaden las imágenes */
    display: block; 
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}

/* --- Dots Styling (Sin cambios) --- */
.carousel-dots {
    text-align: center;
    padding: 10px 0;
}

.dot {
    height: 10px;
    width: 10px;
    margin: 0 4px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.dot.active {
    background-color: #717171;
}

.menu_mov{
    display: none;
  }

@media only screen and (min-width: 0px) and (max-width: 1024px){


  .botones{
    display: none;
  }
  .menu_mov{
    display: block;
  }

  .menu_superior_in {
    width: 100%;
    margin: 0 auto;
}

 .logo {
        float: none;
        margin: 0 auto;
        display: block;
        position: relative;
        top: 21px;
    }

 .imagen-fondo {
    width: 100%;
    height: 200px;
    display: block;
    object-fit: fill;
    object-position: center;
}   

.envuelve_ante {
    width: 96%;
    padding: 2%;
    margin: 0 auto;
}

.cont_izq {
    float: left;
    width: 100%;
    /* background: #f5f5f5; */
    text-align: center;
}

.campo_inputs {
    width: 92%;
    padding: 4%;
    border: 1px solid rgba(204, 204, 204, 0.5);
    background: 0;
    font-size: 0.9em;
    color: #999;
    margin-bottom: 1%;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    font-family: Arial, sans-serif;
}

.campo_textareas {
    width: 92%;
    padding: 4%;
    border: 1px solid rgba(204, 204, 204, 0.5);
    background: 0;
    font-size: 0.9em;
    color: #999;
    height: 195px;
    border-radius: 5px;
    font-family: Arial, sans-serif;
}

.link_gris_bis {
    color: #666;
    transition: all .3s ease;
    font-size: 0.9em;
}

.adjuntar{
    font-size: 0.9em;
}

.cont_der {
    float: left;
    width: 100%;
    /* background: #f5f5f5; */
    text-align: center;
    line-height: 32px;
    margin-top: 30px;
}

.enviar {
    border: 0 solid #f30024;
    background: #ffae02;
    color: #000;
    cursor: pointer;
    font-weight: bold;
    padding: 5%;
    text-transform: uppercase;
    font-size: .8em;
    margin-top: 1%;
    float: left;
    border-radius: 5px;
    transition: all .3s ease;
    font-family: Arial, sans-serif;
    width: 100%;
}

    .pie {
        background: #000;
        padding: 0;
        color: #999;
        font-size: 0.9em;
        box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.8);
        position: relative;
        z-index: 10;
        width: 100%;
        box-sizing: border-box;
    }


.listado_pie {
        width: 100%;
        flex-direction: column;
        padding-top: 30px;
        text-align: center!important;
    }

    .uno, .dos, .tres {
        flex-basis: 100%;
        text-align: center!important;
    }

    .contacto_uno {
        width: 100%;
        float: none;
        text-align: center!important;
        margin-bottom: 30px;
    }

    .tam {
    font-size: 1.2em;
}

.centrado {
    text-align: center;
    margin-bottom: 34px;
}

.titulo_h1 {
    font-size: 1.4em;
    color: #496597;
    margin-top: 34px;
}


.form_home {
    font-family: sans-serif;
    /* background: #9bd09e; */
    padding: 1%;
    color: #496597;
    line-height: 30px;
    /* box-shadow: inset 0 4px 6px rgba(0, 0, 0, 0.3); */
    width: 100%;
    margin: 0 auto;
    margin-top: 50px;
}

.form_home_envuelve {
    width: 96%;
    padding: 2%;
    margin: 0 auto;
}

.form_home_izq {
    float: left;
    width: 100%;
    text-align: center;
    line-height: 25px;
    margin-bottom: 30px;
}

.form_home_tit {
    font-size: 1.4em;
    font-weight: bold;
}

.form_home_der {
    float: left;
    width: 100%;
    line-height: 25px;
    text-align: center;
}

.dos_campos li {
    font-size: 14px;
    width: 100%;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 5px;
}

.enviar_bis {
    border: 1px solid #496597;
    padding: 4%;
    background: #496597;
    font-weight: bold;
    font-family: sans-serif;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
    color: #fff;
    width: 100%;
}

.contiene_aceptar{
  margin-bottom: 20px;
}

.box_3 {
        flex-direction: column;
    }

    .box_3 .box-child {
        width: 100%;
        height: 200px !important;
    }

    .box_3 .box-child.img {
        min-height: 0 !important;
    }

    .efx_bis{
    z-index: 1;
    position: relative;
    top: 10px;
    font-weight: 600;
    font-size: 13px;
    height: 30px;
    padding: 10px;
    width: 70px !important;
    color: #fff !important;
    line-height: 1;
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
    text-align: center;
    background-color: #ffae02;
    position: relative;
    overflow: hidden;
}

.listado_cookies li{
  font-size: 14px;
  display: inline-block;
  width: 98%;
  margin: 1%;
  vertical-align: top;
  background: #f5f5f5;
  text-align: center;
}

.tarjetas{
  width: 98%;
  padding: 1%;
  height: auto;
}
.tarjetas_bis{
  width: 98%;
  padding: 1%;
  height: auto;
}

.listado_imgs li {
    font-size: 14px;
    display: inline-block;
    width: 98%;
    padding: 1%;
}




}