/****************** Index *********************/

/* Video principal */

.hero {
    position: relative;
    height: 100vh; /* Asegura que el video ocupe toda la pantalla */
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    overflow: hidden;
    padding: 0; /* Sin padding */
    margin: 0; /* Sin márgenes */
}

.hero video {
    position: absolute;
    top: 45%;
    left: 50%;
    width: 100%;
    height: auto; /* Mantener relación de aspecto */
    transform: translate(-50%, -50%);
    object-fit: cover; /* Ajuste para llenar el contenedor */
    z-index: -1; /* Video detrás del contenido */
}

.hero-content {
    z-index: 1;
    text-align: center;
}

/* Pantallas grandes */

@media (min-width: 1280px) {
    .hero {
        height: 550px;
    }
    
}

/* Tablets y pantallas medianas */


/* Media queries para tablets */
@media (max-width: 1024px) {
    .hero {
        height: 600px;
    }

    .hero video {
        top: 0; /* Pegamos el video a la parte superior */
        left: 0;
        transform: none; /* Quitamos el translate en resoluciones pequeñas */
    }
}

/* Media queries para móviles */
@media (max-width: 768px) {
    .hero {
        height: 400px;
    }

    .hero video {
        top: 0; /* Pegamos el video a la parte superior */
        left: 0;
        width: 100%;
        height: auto;
        object-fit: cover; /* Aseguramos que el video cubra el área visible */
        transform: none; /* Sin transformación en móviles */
    }
}

/********************** Sección 2 **************************/

/* Imagen de mujer agarrando el teléfono */
.services {
    background-image: url('../images/home/mujer_celular.png');
    background-size: cover;
    background-position: center center;
    height: 900px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 0;
    margin: 0;
    margin-top: 50px;
}

/* Botones naranja  */

/* Contenedor de los botones: alineación vertical */
.botones {
    position: absolute;
    top: 60%;  /* Mantiene los botones más abajo */
    right: 10%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
    transform: translateY(-50%);
    display: flex;
    flex-direction: column; /* Apilados uno sobre el otro */
    gap: 15px; /* Separación entre los botones */
    width: 35%;
    /* height: 10%; */
}


/* Estilo del botón naranja */
.btn-naranja {
    background-color: #ff7f00 !important;
    color: white !important;
    padding: 25px 100px; /*Padding para hacer los botones más grandes */
    font-weight: bold;
    font-size: 25px; /* Tamaño de la fuente */
    border-radius: 30px;
    text-transform: uppercase;
    border: none;
    transition: background-color 0.3s ease, transform 0.2s ease;
    cursor: pointer;

}

/* Hover del botón */
.btn-naranja:hover {
    background-color: #e66a00 !important;
    transform: scale(1.05); /* Ligero agrandamiento al pasar el mouse */
}

/* Características de los servicios (Botones azules) */

/* Sección de características */
.caracteristicas {
    text-align: center;
    margin-top: 50px;
}

.titulo-caracteristicas {
    font-size: 28px;
    color: #333;
    margin-bottom: 30px;
}

.iconos-caracteristicas {
    display: flex;
    justify-content: center;
    gap: 50px; /* Aumenta el espacio entre los iconos */
    flex-wrap: wrap; /* Permite que los iconos se ajusten en pantallas más pequeñas */
}

.caracteristica-item {
    text-align: center;
    font-size: 20px; /* Aumenta el tamaño del texto */
    color: #1a2dab;
}

.caracteristica-item img {
    width: 180px; /* Aumenta el tamaño de los iconos */
    height: auto;
    margin-bottom: 15px;
}

.caracteristica-item p {
    margin-top: 15px;
    font-weight: bold;
    font-size: 20px; /* Aumenta el tamaño del texto */
}


/*********** Responsives ************/

/* Ajustar el ancho en resuluciones muy grandes */

@media (min-width: 1600px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 1050px; 
        margin-top: 50px; 
    }

    .wgh-slider{
        margin-top: 300px;
    }   

    
    }

/* Estilos para pantallas grandes (mayores a 1920px) */
@media screen and (min-width: 1300px) {
    body {
        max-width: 1920px; /* Ancho máximo de 1920px */
        margin: 0 auto; /* Centrar el contenido */
    }
}


/* Tablets */
@media (max-width: 1024px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 600px; 
        background-size: cover; /* Asegura que la imagen no se corte en tablets */
        background-position: center top; /* Mantiene la imagen alineada hacia arriba */
        background-repeat: no-repeat;
        align-items: flex-start; /* Alinea el contenido hacia la parte superior */
        margin-top: 10px; 
    }

    /* Contenedor botón naranja */
    .botones {
        margin-top: 80px;
        width: 35%;
    
    }
    /* Estilo del botón naranja */
   .btn-naranja {
    
    font-size: 25px; /* Tamaño de la fuente */
    width: 400px;
    
    }
    
}

@media (max-width: 912px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 600px; 
        background-size: cover; 
        background-position: center top; 
        background-repeat: no-repeat;
        align-items: flex-start; 
        margin-top: -50px; 
    }
    /* Contenedor botón naranja */
    .botones {
    
        top: 55%;  /* Mantiene los botones más abajo */
        right: 10%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
        gap: 10px; /* Separación entre los botones */
        width: 35%;
            
        }
        /* Estilo del botón naranja */
       .btn-naranja {
        
        padding: 30px 15px; /*Padding para hacer los botones más grandes */
        font-size: 20px; /* Tamaño de la fuente */
        width: 300px;
        
        }
    
}

/* Móviles */


@media (max-width: 844px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 400px;
        background-size: cover; /* Contiene toda la imagen sin cortes */
        background-position: center top; /* Ajusta la posición de la imagen */
        background-repeat: no-repeat;
        align-items: flex-start;
        margin-top: -100px; 
    }

    /* Contenedor botón naranja */
    .botones {
    
        top: 55%;  /* Mantiene los botones más abajo */
        right: 12%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
        gap: 10px; /* Separación entre los botones */
        width: 35%;
            
        }
        /* Estilo del botón naranja */
       .btn-naranja {
        
        padding: 20px 15px; /*Padding para hacer los botones más grandes */
        font-size: 20px; /* Tamaño de la fuente */
        width: 300px;
        
        }
    
}


@media (max-width: 768px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 400px;
        background-size: cover; 
        background-position: center top; /* Ajusta la posición de la imagen */
        background-repeat: no-repeat;
        align-items: flex-start;
        margin-top: 30px; 
    }

     /* Contenedor botón naranja */
     .botones {
    
        top: 55%;  /* Mantiene los botones más abajo */
        right: 14%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
        gap: 10px; /* Separación entre los botones */
        width: 35%;
            
        }
        /* Estilo del botón naranja */
       .btn-naranja {
        
        padding: 20px 15px; /*Padding para hacer los botones más grandes */
        font-size: 20px; /* Tamaño de la fuente */
        width: 300px;
        
        }
    
}

@media (max-width: 540px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 400px;
        background-size: contain; 
        background-position: center top;
        background-repeat: no-repeat;
        align-items: flex-start;
        margin-top: -80px; 
    }

    /* Contenedor botón naranja */
    .botones {
    
        top: 35%;  /* Mantiene los botones más abajo */
        right: 10%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
        gap: 5px; /* Separación entre los botones */
        width: 35%;
            
        }
        /* Estilo del botón naranja */
       .btn-naranja {
        
        padding: 15px 15px; /*Padding para hacer los botones más grandes */
        font-size: 12px; /* Tamaño de la fuente */
        width: 180px;
        
        }
    
}

@media (max-width: 430px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 400px;
        background-size: contain; 
        background-position: center top;
        background-repeat: no-repeat;
        align-items: flex-start;
        margin-top: -140px; 
    }

    /* Contenedor botón naranja */
    .botones {
    
        top: 25%;  /* Mantiene los botones más abajo */
        right: 10%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
        gap: 5px; /* Separación entre los botones */
        width: 35%;
            
        }
        /* Estilo del botón naranja */
       .btn-naranja {
        
        padding: 10px 15px; /*Padding para hacer los botones más grandes */
        font-size: 12px; /* Tamaño de la fuente */
        width: 150px;
        
        }

        /* Iconos azules */

    .caracteristicas {
        text-align: center;
        margin-top: -130px;
    }
    .titulo-caracteristicas {
        font-size: 20px;
    }
    .iconos-caracteristicas {
        flex-direction: column; /* Los íconos se apilan verticalmente en móviles */
    }
    .caracteristica-item img {
        width: 40%;
    }
    .caracteristica-item {
        flex: 1 1 100%; /* Ocupan el 100% del ancho disponible en móviles */
    }
    
}


@media (max-width: 375px) {
    /* Imagen de mujer agarrando el teléfono */
    .services {
        height: 400px;
        background-size: contain; /* Contiene toda la imagen sin cortes */
        background-position: center top; /* Ajusta la posición de la imagen */
        background-repeat: no-repeat;
        align-items: flex-start;
        margin-top: -170px; 
    }

    /* Contenedor botón naranja */
    .botones {
    
    top: 20%;  /* Mantiene los botones más abajo */
    right: 14%; /* Mueve los botones más hacia la izquierda, ajusta este valor según lo necesites */
    gap: 5px; /* Separación entre los botones */
    width: 35%;
        
    }
    /* Estilo del botón naranja */
   .btn-naranja {
    
    padding: 10px 15px; /*Padding para hacer los botones más grandes */
    font-size: 12px; /* Tamaño de la fuente */
    width: 150px;
    
    }

    /* Iconos azules */

    .caracteristicas {
        text-align: center;
        margin-top: -130px;
    }
    .titulo-caracteristicas {
        font-size: 20px;
    }
    .iconos-caracteristicas {
        flex-direction: column; /* Los íconos se apilan verticalmente en móviles */
    }
    .caracteristica-item img {
        width: 40%;
    }
    .caracteristica-item {
        flex: 1 1 100%; /* Ocupan el 100% del ancho disponible en móviles */
    }
    
}


/***** Zonas de cobertura *********/

.cobertura{

    background-image: url('../images/home/cobertura.fw.png'); /* Reemplazar con la imagen del diseño */
    background-size: cover;
    background-position: center;
    height: 900px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    }
    
    .coverages-section {
        background-color: #f7f7f7;
        padding: 2rem 0;
        margin-top: 50px;
        z-index: 2;
    }
    
    .cober_titulo{
        text-align: center;
        font-size: 52px;
        color: #1a2dab;
        margin-top: -55%;
        font-weight: 500;
    }

    .wgh-slider{
        margin-top: 250px;
    }   
    
    /****** Responsives **********/

    @media (min-width:1600px){
        .wgh-slider{
            margin-top: 350px;
        }   
    }

    @media (min-width:1920px){
        .wgh-slider{
            margin-top: 450px;
        }   
    }

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

    /* fondo */

    .coverages-section{
        background-color: #ffffff;
        margin-top: -5px;
              
     }

     .cobertura {
        
         /* height: 500px; */
         background-size: cover; 
         background-position: center top;
         background-repeat: no-repeat;
         width: 100% !important;
     }

     /* Título */
     .cober_titulo {
         font-size: 45px; /* Aún más pequeño en pantallas móviles */
         margin-top: -780px;
         z-index: 10;
     }

    
     .wgh-slider__viewport {
         width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
     }

     .wgh-slider-item-figure__image {
         width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
     }

     .wgh-slider{
        margin-top: 500px;
    }   
    
     /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */


   }

   @media (max-width: 912px) {

    .cober_titulo {
         font-size: 45px; /* Aún más pequeño en pantallas móviles */
         margin-top: -780px;
         z-index: 10;
     }

     .wgh-slider__viewport {
        width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
    }

    .wgh-slider-item-figure__image {
        width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
    }

    .wgh-slider-item-figure__caption {
        font-size: 5px !important; /* Reduce el tamaño de la fuente en las captions del carrusel */
        margin-top: -40px;
    }
    /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */

   }

    @media (max-width: 853px) {

                
        /* Título */
         .cober_titulo {
            font-size: 45px; /* Aún más pequeño en pantallas móviles */
            margin-top: -760px !important;
            z-index: 10;
        }

        
    }

    @media (max-width: 844px) {

         /* fondo */

         .coverages-section{
            background-color: #ffffff;
            margin-top: -5px;
            
         }
 
         .cobertura {
             height: 400px;
             background-size: contain;
             background-position: center top;
             background-repeat: no-repeat;
         }
 
         /* Título */
         .cober_titulo {
             font-size: 25px; /* Aún más pequeño en pantallas móviles */
             margin-top: -360px;
             z-index: 10;
         }
 
        
         .wgh-slider__viewport {
             width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
         }
 
         .wgh-slider-item-figure__image {
             width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
         }
 
         .wgh-slider-item-figure__caption {
             font-size: 16px; /* Reduce el tamaño de la fuente en las captions del carrusel */
             margin-top: -60px;
         }
         /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */


    }

    @media (max-width: 820px) {

       /* Título */
       .cober_titulo {
        font-size: 30px; /* Aún más pequeño en pantallas móviles */
        margin-top: -820px;
        z-index: 10;
    }

   
    .wgh-slider__viewport {
        width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
        margin-top: 5px;
    }

    .wgh-slider-item-figure__image {
        width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
    }

    .wgh-slider-item-figure__caption {
        font-size: 30px; /* Reduce el tamaño de la fuente en las captions del carrusel */
        margin-top: -40px;
    }

    .wgh-slider{
       margin-top: 610px;
   }   


   }
    
    @media (max-width: 768px) {

        /* fondo */

        .coverages-section{
            background-color: #ffffff;
            margin-top: -5px;
           
            
         }
 
         .cobertura {
            
             height: 400px;
             background-size: cover;
             background-position: center top;
             background-repeat: no-repeat;
             width: 100% !important;
         }
 
         /* Título */
         .cober_titulo {
             font-size: 30px; /* Aún más pequeño en pantallas móviles */
             /* margin-top: -320px !important; */
             z-index: 10;
         }
 
        
         .wgh-slider__viewport {
             width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
             margin-top: -160px;
         }
 
         .wgh-slider-item-figure__image {
             width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
         }
 
         .wgh-slider-item-figure__caption {
             font-size: 30px; /* Reduce el tamaño de la fuente en las captions del carrusel */
             margin-top: -40px;
         }

         .wgh-slider{
            margin-top: 610px;
        }  
         /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */

    }
    
    @media (max-width: 540px) {

        /* fondo */

        .coverages-section{
            background-color: #ffffff;
            margin-top: -5px;
                      
         }
 
         .cobertura {
            
             height: 400px;
             background-size: cover;
             background-position: center top;
             background-repeat: no-repeat;
             width: 100% !important;
         }
 
         /* Título */
         .cober_titulo {
             font-size: 30px; 
             margin-top: 0px;
             z-index: 10;
         }
 
        
         .wgh-slider__viewport {
             width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
             margin-top: -0px;
         }

 
         .wgh-slider-item-figure__image {
             width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
         }
 
         .wgh-slider-item-figure__caption {
             font-size: 40px; /* Reduce el tamaño de la fuente en las captions del carrusel */
             margin-top: -70px;
         }

         .wgh-slider{
            margin-top: 600px;
        }   
         /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */

    }

    @media (max-width: 430px) {

        /* fondo */

        .coverages-section{
            background-color: #ffffff;
            margin-top: -5px;
            
         }
 
         .cobertura {
             height: 400px;
             background-size: contain;
             background-position: center top;
             background-repeat: no-repeat;
         }
 
         /* Título */
         .cober_titulo {
             font-size: 25px; /* Aún más pequeño en pantallas móviles */
             margin-top: -360px; 
             z-index: 10;
         }
 
        
         .wgh-slider__viewport {
             width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
             margin-top: 0px;

         }
 
         .wgh-slider-item-figure__image {
             width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
         }
 
         .wgh-slider-item-figure__caption {
             font-size: 16px; /* Reduce el tamaño de la fuente en las captions del carrusel */
             margin-top: -60px;
         }

         .wgh-slider{
            margin-top: 590px;
        }  

         /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */

    }

    @media (max-width: 414px){
        .wgh-slider{
            margin-top: 575px;
        } 
        
        .wgh-slider__viewport {
            width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
             margin-top: 0px; 
        }
    }

    @media (max-width: 390px) {
        /* Título */
        .cober_titulo {

            margin-top: -340px !important;
            z-index: 10;
        }

        .wgh-slider{
            margin-top: 150px;
        }  
    }
    
    @media (max-width: 375px) {
        /* fondo */

        .coverages-section{
           background-color: #ffffff;
           margin-top: -5px;
           
        }

        .cobertura {
            height: 400px;
            background-size: contain;
            background-position: center top;
            background-repeat: no-repeat;
        }

        /* Título */
        .cober_titulo {
            font-size: 25px; /* Aún más pequeño en pantallas móviles */
            /* margin-top: -330px; */
            z-index: 10;
        }

       
        .wgh-slider__viewport {
            width: 100%; /* Asegura que el carrusel ocupe todo el ancho en móviles */
            margin-top: 20px;
        }

        .wgh-slider-item-figure__image {
            width: 100%; /* Ajusta el tamaño de las imágenes en el carrusel */
        }

        .wgh-slider-item-figure__caption {
            font-size: 16px; /* Reduce el tamaño de la fuente en las captions del carrusel */
            margin-top: -60px;
        }

        .wgh-slider{
            margin-top: 150px;
        }  
        /* Los demás resposives estan en el archivo style del carrusel 3D en la línea 98 */
    
    }   

    
/* Ondas */

.ondas-img {
    width: 100%;
     height: auto;
     background-color: transparent; /* Transparente por si acaso */
     position: absolute; /* Para que se superponga al div anterior */
     /* top: 80%; */
     left: 0;
     z-index: 10; /* Asegura que la imagen esté sobre los otros elementos */
  }

  .content_ondas{

    margin-top: 650px;
  }

   @media (max-width: 1366px) {

    /* .ondas-img {
        
        top: 86%;
        
     } */

  }
  
  @media (max-width: 1280px) {

    .content_ondas{

        margin-top: 670px;
    }


  }
  
  @media (max-width: 1024px) {

    .content_ondas{

        margin-top: 720px;
    }

  }

  @media (max-width: 912px) {

    .content_ondas{

        margin-top: 695px;
    }

  }

  @media (max-width: 820px) {

    .content_ondas{

        margin-top: 260px;
    }

  } 

  @media (max-width: 768px) {

    .content_ondas{

        margin-top: 285px;
    }

  }


  @media (max-width: 540px) {

    .content_ondas{

        margin-top: 305px;
    }

  }
  
  @media (max-width: 430px) {

    .content_ondas{

        margin-top: 15px;
    }

  }

  @media (max-width: 412px) {

    .content_ondas{

        margin-top: -20px;
    }

  }

  @media (max-width: 390px) {

    .content_ondas{

        margin-top: -20px;
    }

  }
  
  @media (max-width: 375px) {

    .content_ondas{
 
        margin-top: -80px;
    }
    
  } 

  @media (max-width: 360px) {

    .content_ondas{
 
        margin-top: -50px;
    }
    
  } 

  @media (max-width: 344px) {

    /* .ondas-img {
        
         top: 1630px;
         
      } */

  } 

  

  /************* SECCIÓN TENEMOS ******************/

  /* Imagen tenemos para ti */

.fondo_tenemos{
    background-image: url('../images/home/tenemos.png'); 
    background-size: cover;
    background-position: center;
    height: 800px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    margin-top: 13%;
    }

    /* REsponsive fondo tenemos */

    @media (min-width: 1600px) {
        .fondo_tenemos{
            margin-top: 14.5%;
            height: 900px;
            }
        
    }

    @media (min-width: 1680px) {
        .fondo_tenemos{
            margin-top: 15%;
          
            }
        
    }

    @media (min-width: 1920px) {
        .fondo_tenemos{
            margin-top: 15.5%;
            height: 1050px;
            }
        
    }
    
    @media (max-width: 1024px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
            height: 550px; 
            background-size: cover; /* Asegura que la imagen no se corte en tablets */
            background-position: center top; 
            background-repeat: no-repeat;
            align-items: flex-start; /* Alinea el contenido hacia la parte superior */
            margin-top: 130px; 
            
        }
    }    

    @media (max-width: 912px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
            height: 515px; 
            background-size: contain; /* Asegura que la imagen no se corte en tablets */
            background-position: center top; 
            background-repeat: no-repeat;
            align-items: flex-start; /* Alinea el contenido hacia la parte superior */
            margin-top: 100px; 
            
        }
    }    

    @media (max-width: 853px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
            height: 475px; 
            background-size: contain; /* Asegura que la imagen no se corte en tablets */
            background-position: center top; 
            background-repeat: no-repeat;
            align-items: flex-start; /* Alinea el contenido hacia la parte superior */
            margin-top: 85px; 
            
        }
    }  
    
    @media (max-width: 820px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: 105px; 
            height: 458px; 
        }
    }  

    @media (max-width: 775px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: 115px; 
            height: 438px;
        }
    } 
    
    @media (max-width: 540px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: 72px;
            height: 300px; 
            
        }
    } 

    @media (max-width: 430px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -96px; 
            z-index: 9;
            height: 245px; 

        }
    } 

    @media (max-width: 415px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -122px; 
            z-index: 9;
            height: 230px; 
        }
    } 

    @media (max-width: 390px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -127px; 
            z-index: 9;
            height: 220px; 
            
        }
    } 
    
    
    @media (max-width: 375px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -160px; 
            z-index: 9;
            height: 210px;
        }
    } 


    @media (max-width: 360px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -147px; 
            z-index: 9;
            height: 200px;
        }
    } 

    @media (max-width: 344px) {
        /* Imagen de mujer sentada en puff */
        .fondo_tenemos{ 
           
            margin-top: -152px; 
            z-index: 9;
            height: 190px;
        }
    } 

    .cta-section {
        background-color: #f7f7f7;
        text-align: center;
        padding: 3rem 0;
    }
    
    .cta-section h2 {
        margin-bottom: 2rem;
    }
  
/* Estilo del botón naranja */
.btn-naranja-cta {
    
    background-color: #ff7f00 !important;
    color: white !important;
    padding: 20px 10px; /*Padding para hacer los botones más grandes */
    /* font-weight: bold; */
    font-size: 20px; /* Tamaño de la fuente */
    border-radius: 30px;
    text-transform: uppercase;
    border: none;
    transition: background-color 0.3s ease, transform 0.2s ease;
    cursor: pointer;
    margin-top: 490px;
    width: 30%;
    height: 10%;

}

/* Hover del botón */
.btn-naranja-cta:hover {
    background-color: #e66a00 !important;
    transform: scale(1.05); /* Ligero agrandamiento al pasar el mouse */
}

/******************Responsive Botón******************************/

@media (max-width: 1024px) {
    .btn-naranja-cta {
    
        padding: 15px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 400px;
        width: 30%;
        height: 14%;
    
    }
    
} 

@media (max-width: 912px) {
    .btn-naranja-cta {
    
        padding: 5px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 370px;
        width: 30%;
        height: 10%;
    
    }
}  

@media (max-width: 853px) {

    .btn-naranja-cta {
    
        padding: 8px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 300px;
        width: 35%;
        height: 13%;
    
    }


}

@media (max-width: 540px) {

    .btn-naranja-cta {
    
        padding: 5px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 180px;
        width: 35%;
        height: 16%;
        font-size: 14px;
    
    }

}

@media (max-width: 430px) {

    .btn-naranja-cta {
    
        padding: 7px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 130px;
        width: 35%;
        height: 20%;
        font-size: 10px;
    
    }

}

@media (max-width: 390px) {

    .btn-naranja-cta {
    
        padding: 5px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 120px;
        width: 35%;
        height: 20%;
        font-size: 10px;
    
    }

}

@media (max-width: 375px) {

    .btn-naranja-cta {
    
        padding: 5px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 110px;
        width: 35%;
        height: 20%;
        font-size: 8px;
    
    }
}

@media (max-width: 344px) {

    .btn-naranja-cta {
    
        padding: 5px 10px; /*Padding para hacer los botones más grandes */
        margin-top: 90px;
        width: 35%;
        height: 22%;
        font-size: 8px;
    
    }
}

/* Estilos para la sección sin  el carrusel */

.content_wgh{

    /* position: absolute; */
    margin-top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    width: 80%; /* Ajusta el ancho del carrusel */
    height: auto;
    font-size: 2rem;
}

.contenedor_zonas{

    width: 100%;
    margin-top: 5%;
   
}

.contenedor_im_zonas{

    position: relative;
   
}

.caption_zonas{
    
    position: relative;
    top: 80px; 
    left: 50%;
    transform: translateX(-50%);
    margin: 0; text-align: center;
    padding: 5px;
    z-index: 10;
}


@media (max-width: 1024px) {

    .content_wgh{
       
        margin-top: 1100px;
        font-size: 1rem;
     
    }

    .caption_zonas{
    
        top: 50px; 
        
    }

}

@media (max-width: 820px) {

    .content_wgh{
       
        margin-top: 1200px;
        font-size: 1rem;
     
    }

    .caption_zonas{
    
        top: 50px; 
        
    }

}


@media (max-width: 768px) {

    .content_wgh{
        margin-top: 1200px;
        font-size: 1rem;
    }

    .caption_zonas{
    
        top: 50px; 
        
    }

}

@media (max-width: 430px) {

   .caption_zonas{
    
        top: 35px; 
        
    }

}

@media (max-width: 390px) {

    .content_wgh{
        margin-top: 350px;
        font-size: 0.7rem;
    }

    .caption_zonas{
    
        top: 30px; 
        
    }

}

@media (max-width: 375px) {

    .content_wgh{
        margin-top: 300px;
        font-size: 0.7rem;
    }

    .caption_zonas{
    
        top: 30px; 
        
    }

}