/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px){

    
    /********************** Slider ****************/

    .info-btn{
        top: 60%;
        padding: 1.3rem 1.1rem !important;
    }

    .slider-controls {
        padding: 1rem 1.3rem 1rem 1.3rem;
        gap: .9rem;
        border-radius: 1.5rem;
        opacity: .85;
    }

    .dot {
        width: 1.7rem;
        height: 1.7rem;
    }

    /********************** Nosotros ****************/

    .engi_img_content img{
        width: 24rem;
    }

    .us_text_cfg {
        max-width: 520px;
    }

     /********************* Servicios ***************/

    .section-content {
        width: 90%;
    }

    /********************* Proyectos ***************/
    
    

}

@media (min-width: 800px) {

    /********************* Slider ***************/

    .slide{
        max-height: 520px;
    }
}


/* Grande: Laptops y dispositivos grandes */
@media (min-width: 960px) {

    .whatsapp-float_mob {
        display: none !important;
    }


    .headermenu{display: none;}
    .header_sections{display: none;}

    .header_desk{
        background-color: #fff;
        position: fixed;
        width: 100%;
        height:auto;
        z-index: 5;
    }

    .header_desk_contact{
        display:block;
        width: 100%;
        height: 4.6rem;
        background-color: var(--gris);
        color: var(--blanco);
        /* border: 1px solid red; */
    }

   .header_desk_contact .fila{
        margin: 0 auto !important;
        width: 95% !important;
        max-width: 1366px;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .header__socials{
        /* border: 1px solid pink; */
        display: flex;
        /* justify-content: end; */
        align-items: center;
        flex-direction: row;
        gap: .7rem;
    }

    .header__socials .v-icon{
        color: var(--blanco) !important;
        transition: color 0.6s ease;
    }

    .header__socials .v-icon:hover{
        color: var(--rojo) !important;
    }

    .header__call{
        /* border: 1px solid pink; */
        width: 100%;
        display: flex;
        align-items: end;
        justify-content: end;
    }

    .header__cot{
        /* border: solid 1px yellow; */
        width: 21rem;
        height: 2rem;
        border-radius: .8rem;
        background-color: #fff;
        color: black;
        display: flex;
        justify-content: center;
    }

    .header__cot p {margin-top: 0.3rem;}

    .header__cot a{
        position: absolute;
        margin-left: 19rem;
        top: 0.5rem;
        background-color: #25d366;
        border-radius: 50%;
    }

    .header__cot .v-icon{
        color: var(--blanco) !important;
    }

    /********************************************* Menu de logo y secciones *********************************************/

    .header_desk_sections{
        display: flex;
        margin: 0 auto;
        width: 90%;
        padding: 0rem 0rem;
        /* height: 6rem !important; */
        background-color: var(--blanco);
        /* border: 1px solid pink; */
        max-width: 1080px !important;
        z-index: 101 !important;
    }

    .header_desk_sections_sec{
        /* background-color: green; */
        align-content: end;
        height: 5.3rem;
    }

    .header_desk_sections_sec ul {
        display: flex;
        gap: 2rem;
        text-transform: uppercase;
    }

    .header_desk_sections a{
        color: black !important;
        transition: color 0.4s ease;
    }

    .header_desk_sections a:hover{
        color: red !important;
    }

 /* Solo aplica active cuando es exacto */
.header_desk_sections_sec a.active {
  color: #ff0000 !important;
}
.header_desk_sections_sec a.router-link-exact-active {
  font-weight: bold;
  position: relative;
}

* Suaviza el cambio de active state */
.header_desk_sections_sec a.active {
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Efecto "momentum" en el scroll */
body {
  overscroll-behavior-y: contain;
}



    /********************************************* Slider *********************************************/
    .slider-container{
        /* border: 1px solid red; */
        margin-top:13rem;
    }

    .slide{
        /* border: solid 1px red; */
        margin-top: 0rem;
        max-width: 1200px;
        max-height: 650px !important;
    }

    .info-btn{
        top: 65%;
        padding: 1.4rem 1rem !important;
        font-size: 1.1rem !important;
    }



/********************************************* Nosotros *********************************************/
    .us_content{
        flex-direction: row;
        /* border: solid 1px greenyellow; */
        /* height: 80vh; */
        align-items: end;
        height: 43rem !important;
    }

    
    .engi_img_content{
        /* border: solid 1px greenyellow; */
        padding-left: 0rem;
        width: 40%;
    }

    .engi_img_content img{
        width: 30rem !important;
        margin-left: 0rem;
        height: fit-content !important;
    }

    .us_text {
        /* border: solid 1px greenyellow; */
        width: 60%;
        flex-direction: column;
        gap: 1.2rem;
    }

    .us_item {
        display: flex;
        flex-direction: row;
        gap: .8rem;
        margin:1.2rem 0rem;
    }

    .us_text_cfg {
        margin-bottom: 0;
        text-align: center;
        padding: 0rem 0.5rem 0.1rem 0.5rem;
        /* max-width: 410px !important; */
        height: 8.3rem;
    }

    .us_circle {
        align-self: center !important;
    }

    .us_circle img {
        width: 6.3rem;
    }

    .us_item:nth-child(1) .us_circle {
        display: block;
        align-self: flex-start;
    }

    .us_item:first-child .us_circle,
    .us_item:last-child .us_circle {
        margin-left: 4rem;
    }
    

  /********************************************* Servicios ******************************************/

    .sticky-container {
        position: relative;
        background-image: url('../img/servicios/fondo.png') !important;
        background-size: 100% 100%;
        overflow-y: auto;
        height: 120vh;
        background-size: cover;
    }


    .sticky-section {
        min-width: 960 !important;
        max-width: 1240px !important;
        padding: 3rem 0rem;
    }

    .section-content{
    position: sticky !important;
    width: 75% !important;
    height: 12.5rem !important;
    background: linear-gradient(220deg, rgb(221, 27, 27) 0%, rgba(46, 26, 26, 0.322) 75%);
    border-radius: 3.5em !important;
    backdrop-filter: blur(.1rem) !important;
    border-left: .1px solid #ffffff81 ;
    border-bottom: .1px solid #ffffff5d;
    border-top: .1px solid #ffffff5d;
    opacity: 1 !important;

    }

    .section-content h2{font-size: 2.2rem;margin-bottom: 1rem;}

    .section-content p{font-size: 1.1rem;}

    .imper, .pintu, .recu, .constr, .mante{
        display: flex;
        flex-direction: row-reverse;
        align-items: start;
        gap: 0rem;
        height: 17rem;
        margin-bottom: 2rem !important;
    }

    .pintu, .constr{flex-direction: row !important;}

    .img-content{height: fit-content !important;}

    .img-content img{width: 18rem;}

    /********************************************* Elegirnos *********************************************/
    
    #elegirnos {
        
        .card {   
          max-width: 390px;
          height: 160px;
        }
    }

    /********************************************* Proyectos *********************************************/

   

  /********************************************* Footer *********************************************/
  #footer {
    .footer_container{

      flex-direction: row;
      justify-content: space-between;
      align-items: center;

      .logos_container{
        flex: 0 0 auto;
      }
      
      .logo_footer {
        flex: 1;
        text-align: center;
        margin: 0 auto;
        max-width: 35%; 
      }

    }    
  }

  /********************************************* Contacto *********************************************/
  #contacto {

    padding: 0rem !important;
    
    .contacto_container {
      flex-direction: row;
      justify-content: center;
      align-items: center;
      gap: 1rem;
      

      .cta_container {
        width: 45%;
        display: flex;
        gap: 3rem;
        justify-content: start !important;
      }
      .form_container{
        width: 45%;
      }
    }
  }

}

@media (min-width: 1080px) {

    .engi_img_content img{
        width: 35rem !important; 
    }

    .us_item {
        margin:2rem 0rem;
    }
     
}

@media (min-width: 1280px) {
    .us_content{
        height: 43rem !important;
    }
    
    .engi_img_content img{
        width: 37rem !important; 
    }

    .us_circle img {
        width: 6.8rem;
    }

    .us_text_cfg {
        /* margin-bottom: 0;
        text-align: center; */
        padding: 1.1rem 0.5rem 1rem 0.5rem !important;
        max-width: 500px !important;
        height: 8.5rem;
    }


    .us_item {
        gap: 2.5rem !important;
        margin:1.7rem 0rem;
    }

    .us_item:first-child .us_circle,
    .us_item:last-child .us_circle {
        margin-left: 6rem !important;
    }
}


/* Large devices (1366px and up) */
@media (min-width: 1366px) {
     
}