.hamburguer{
    display: none;
  }
@media (max-width:780px ){
    /* *{
        border: 1px red solid;
    } */
    .Nav-f{
        width: 100%;
        display: flex;
        background-color: aliceblue;
        padding: 1% 0;
    }

    .hamburguer {
        display: block;
        cursor: pointer;
        position: absolute;
        top: 2.2%;
        right: 5%;
    }
    .hamburguer .line{        
        width: 30px;
        height: 3px;
        margin: 6px 0;
        background: var(--primary-color);
    }

    .Nav-btns-cont{
        position: absolute;
        display: block;
        max-height: 0px;        
        top: 66.66px;
        left: 0 ;
        right: 0;
        width: 100%;
        background-color: var(--primary-color);
        transition: 0.5s;
        overflow: hidden;
    }

    .Nav-btns-cont.active{        
        max-height: 600px;
        height: auto;
    }

    .idioms{
        display: flex;
    }

    .Nav-btns{
        display: block;
        width: max-content;
        margin: 20px auto 0 auto;
    }
    
    .nav-top{
        display: none;
    }
}

@media (max-width: 1250px) {
    :root {
        --fs-base: clamp(1rem, 0.22vi + 0.95rem, 1rem);
        --fs-md: clamp(1.2rem, 0.31vi + 1.34rem, 1.4rem);
        --fs-lg: clamp(1.8rem, 0.44vi + 1.9rem, 2rem);
        --fs-xl: clamp(2.43rem, 0.62vi + 2.69rem, 2.8rem);        
    }

    
    .slider-cont{
        padding: 2% 0 6% 0 ;
    }

    /* .Banner-1{
        transform: translate(0 , 0);
    } */

    .Nav-f{
        width: 100%;
    }
    
  }
@media (max-width: 1000px) {
    .sct{
        
        padding-bottom: 5%;
    }

    .sct-2{
        gap: 5%;
    }
      
    .footer-gr{
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min(100%,400px),1fr));
    gap: 0 5% ;
    }

    .foot-logo{
        width: 50%;
    }
    
}
@media (max-width:780px ) {
    :root {
        --fs-base: clamp(1rem, 0.22vi + 0.95rem, 1.2rem);
        --fs-md: clamp(1.2rem, 0.31vi + 1.34rem, 1.5rem);
        --fs-lg: clamp(1.8rem, 0.44vi + 1.9rem, 2rem);
        --fs-xl: clamp(2rem, 0.62vi + 2.69rem, 2.3rem);
       
    }

    .Services-cont{
        display: flex;
        flex-wrap: wrap;
    }
    .Sect-cont{
        width: 80%;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 5% 0;
    }
    .pict-cont{
        position: absolute;
        width: 120%;
        /* opacity: .3; */
    } 

    .pict-cont .image{
        aspect-ratio: 1/1;
        opacity: .3;
    }

    /* Lo comentado es para que la imagen quede arriba. y lo de arriba es para que la imagen quede oculta detras de el texto */

    /* .Sect-cont{
        flex-wrap: wrap;
        width: 80%;
    }

    .pict-cont {
        width: 100% !important;      
    } */
    
    /* .pict-cont .image{
        aspect-ratio: 1/1;        
    } */
    
    .whyus{
        padding-bottom: 2%;  
    }

    .slider-cont{
        padding: 2% 0 10% 0 ;
    }

    .solo{
        flex-direction: column;
    }
  }
@media (max-width:600px){
    .Banner-1{
        min-height: 90vh;
    }
    .Banner-son p, .Banner-son h1{
        width: 90%;
    }
    .Services-cont{
        display: flex;
        flex-wrap: wrap;
    }
  }