@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

body{
   zoom: 67%;  /*Zoom no estándar, solo para navegadores compatibles */
  /* transform: scale(0.9); /* Escala para todos los navegadores */
  /* transition: transform 0.4s ease; Transición suave */
}

a{
  text-decoration: none;
  color: #000;
}

.carousel-item img {
  width: 100%;
  height: 100vh; /* ocupa todo el alto de la pantalla */
  object-fit: cover; /* rellena sin deformar, recorta lo que sobra */
}


@keyframes parpadeo {
    0% {
       color: #000;
       
    }
    50% {
       color: #721c24 /* A la mitad, se vuelve invisible */
    }
    100% {
       color: red; /* Al final, vuelve a ser visible */
    }
}

.texto-parpadeante {
    /* Opcional: Estilo básico para resaltar más */
    color: red;
    font-weight: bold;
    animation-name: parpadeo; /* Nombre de la animación */
    animation-duration: 1.5s; /* Duración de un ciclo completo (1 segundo) */
    animation-iteration-count: infinite; /* Hace que se repita indefinidamente */
    animation-timing-function: step-start; /* Opcional: Hace que el cambio sea instantáneo (encendido/apagado) */
}

.caja-alerta {
    padding: 10px;
    font-family: sans-serif;
    font-weight: bold;
    display: inline-block; /* Para que el borde se ajuste al texto */
    margin-bottom: 10px;
    
    /* Configuración del borde base */
    border: 3px solid red; 
    
    /* Aquí aplicamos la animación definida arriba */
    /* Nombre | Duración | Tipo de repetición */
    animation: parpadeo-borde 1s infinite;
  }

  /* 1. Definimos la animación */
  @keyframes parpadeo-borde {
    0% {
      border-color:#ff0000;
    }
    50% {
      border-color: transparent; /* Se vuelve invisible a la mitad */
    }
    100% {
      border-color:#ff0000;
    }
  }

/* DESKTOP PAGE */
@media (min-width: 992px) {      
      .barraNavegacion {
        height: 126px;
      }
         .imagenBannerDesk {
        display: block;
      }
      
      .imagenBannerMobile {
        display:none;
      }
    
  }
  /* MOBILE PAGE */
@media (max-width: 992px) {      
      .imagenBanner {
        height: 126px;
      }
      .imagenBannerDesk {
        display: none;
      }
      
      .imagenBannerMobile {
        display:block;
      }
    
  }
/* ALL PAGE */
  .altoFooter{
        height:max-content ;
      
      }
    

.float-wa{
  position:fixed;
  width:60px;
  height:60px;
  bottom:40px;
  right:40px;
  background-color:#25d366;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  font-size:30px;
  z-index:100;
}


/* HOME */

.textoMenu{
    font-family: Montserrat;
    font-weight: 700;
    font-size: 25px;
    line-height: 30.48px;
    letter-spacing: 0%;
}

#empresa:hover{
  text-decoration: underline;
}

#productos:hover{
  text-decoration: underline;
}

#clientes:hover{
  text-decoration: underline;
}

#contacto:hover{
  text-decoration: underline;
}

#noticias:hover{
  text-decoration: underline;
}


#grad1 {
    height: 37px;
    background-color:#FF0000; /* For browsers that do not support gradients */
    background-image: linear-gradient(to right,#FF0000,#FCB900);
  }

  .textInfoHome{
    font-family: Montserrat;
    font-weight: 500;
    font-size: 25px;
    line-height: 46.32px;
    letter-spacing: 0%;

  }

  .textInfoHome50{
    font-family: Montserrat;
    font-weight: 800;
    font-size: 25px;
    line-height: 46.32px;
    letter-spacing: 0%;
  }

  .textInfoHomeDetalle{
    font-family: Montserrat;
    font-weight: 400;
    font-size: 25px;
    line-height: 30.48px;
    letter-spacing: 0%;
    text-align: center;

  }

  .textInfoHomeDetalleBold{
    font-family: Montserrat;
    font-weight: 700;
    font-size: 25px;
    line-height: 30.48px;
    letter-spacing: 0%;
    text-align: center;

  }

  /* BANNER */

.tresPuntosBanner{
/* Group 94 */
background: #000;
border-radius: 50%;
width: 25.92px;
height: 25.92px;
}  


.tresPuntosBanneNoSeleccionado{
  
  margin-top: 3px;
  background: #000;
  border-radius: 50%;
  width: 18.94px;
  height: 18.94px;
  }  



/* PRODUCTOS */

.imagenProductos{
  width: 90%;

}


.bannerProductos{
  background-color: #FE1E1E;
  width: 90%;
  color:#FFFFFF;
  height: 42px;
  padding: 6px;
}



.bannerProductosNoSeleccionado{
  background-color: #D9D9D9;
  width: 90%;
  color:#6C6A6A;
  height: 42px;
  padding: 6px;
}

.tituloBannerProductos{
  font-family: Montserrat;
  font-weight: 700;
  font-size: 25px;
  line-height: 30.48px;
  letter-spacing: 0%;
  text-align: center;
  margin-top: 5px;

}





/* Aire Comprimido */

.tituloAireComprimido{
font-family: 'Montserrat';
font-style: normal;
font-weight: 600;
font-size: 35px;
line-height: 43px;
text-align: center;

color: #6C6A6A;
}


.textoInfoAireComprimido{

font-family: 'Montserrat';
font-style: normal;
font-weight: 500;
font-size: 27px;
line-height: 35px;
/* or 130% */
text-align: center;

color: #6C6A6A;
}


.rectanguloAireComprimido{
  background-color: #D9D9D9;
  width: 567px;
  height: 37px;
}

.fondoCuadradoAireComprimido{
  background-color: #F3F0F0;
  /* height: 407px; */
}

.infoLineaDirectaAireComprimido{
  /* Línea Directa Servicios y Repuestos: (0341) 437 3714 */
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
font-size: 25px;
line-height: 35px;
/* or 140% */
text-align: center;

color: #000000;

}


.lineaDivisionAireComprimido{
  width: 532.67px;
  height: 1px;
  background-color: #FE1E1E;
}

.rectanguloAireComprimidoRojo{  
  background-color: #FE1E1E;
  width: 50%;
  /* height: 54px; */
}

.textoRectanguloRojo{
  /* Urgencias Técnicas:   (0341) 156-59 72 40    (0341) 156-59 72 34   */
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
font-size: 25px;
line-height: 35px;
/* identical to box height, or 140% */
text-align: center;

color: #FFFFFF;


}
/* Autoelevadores */

.textoAutoelevadores{
font-family: 'Montserrat';
font-style: normal;
font-weight: 500;
font-size: 27px;
line-height: 35px;
text-align: center;

color: #6C6A6A;


}

.contactoAutolevadores{
  /* CONTACTOS */
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
font-size: 15px;
line-height: 35px;
/* identical to box height, or 233% */
text-align: center;

color: #000000;
}

.rectanguloAutoelevadores{
  /* Rectangle 26 */
width: 567px;
height: 37px;


background: #D9D9D9;

}

.rectanguloAutoelevadoresRojo{  
 width: 50%;
  /* height: 54px; */
background: #FE1E1E;

}

.fondoCuadradoAutoelevadores{
  /* Rectangle 28 */
height: 317px;
background: #F3F0F0;
}


.textoRectanguloRojoAutoelevadores{

font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
font-size: 20px;
line-height: 25px;
/* or 125% */
text-align: center;

color: #FFFFFF;


}



  /* Footer */

  .seccionShowRoom{
    font-family: Montserrat;
    font-weight: 700;
    font-size: 22px;
    line-height: 34.13px;
    letter-spacing: 0%;
    color: #6C6A6A;
  }

  .seccionFooter{
    font-family: Montserrat;
    font-weight: 600;
    font-size: 18px;
    line-height: 36.57px;
    letter-spacing: 0%;
    color: #6C6A6A; 
  }


   .iframe-container {
        position: relative;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%; /* For a 16:9 aspect ratio (9/16 = 0.5625) */
        overflow: hidden;
    }

    .iframe-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/* FORMULARIO DE CONTACTO */

.tituloContacto {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 35px;
    line-height: 43px;
    text-align: center;
    color: #6C6A6A;
}

.textoContacto {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #6C6A6A;
}

.formularioContacto {
    background-color: #F3F0F0;
    padding: 40px;
    border-radius: 8px;
    margin-top: 30px;
}

.labelFormulario {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #6C6A6A;
    margin-bottom: 8px;
    display: block;
}

.inputFormulario {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
    border: 2px solid #D9D9D9;
    border-radius: 4px;
    padding: 12px 15px;
    transition: border-color 0.3s ease;
}

.inputFormulario:focus {
    border-color: #FE1E1E;
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(254, 30, 30, 0.25);
}

.inputFormulario::placeholder {
    color: #D9D9D9;
}

.error-message {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    margin-top: 5px;
    min-height: 20px;
}

.btnEnviarFormulario {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    background-color: #FE1E1E;
    color: #FFFFFF;
    border: none;
    border-radius: 4px;
    padding: 15px 50px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btnEnviarFormulario:hover {
    background-color: #FF0000;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(254, 30, 30, 0.3);
}

.btnEnviarFormulario:disabled {
    background-color: #D9D9D9;
    color: #6C6A6A;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.textoEnvioMail {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
}

.textoEnvioMail .alert {
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 0;
}

.textoEnvioMail .alert-success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.textoEnvioMail .alert-danger {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

/* Ajustes para reCAPTCHA */
.g-recaptcha {
    margin: 15px 0;
    display: flex;
    justify-content: center;
}

/* Responsive */
@media (max-width: 768px) {
    .formularioContacto {
        padding: 25px 20px;
    }
    
    .tituloContacto {
        font-size: 28px;
        line-height: 34px;
    }
    
    .textoContacto {
        font-size: 18px;
        line-height: 26px;
    }
    
    .labelFormulario {
        font-size: 16px;
    }
    
    .btnEnviarFormulario {
        font-size: 18px;
        padding: 12px 40px;
        width: 100%;
    }
}

/* PROMOCIONES */

.tituloPromociones {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 35px;
    line-height: 43px;
    color: #6C6A6A;
}

.textoPromociones {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 30px;
    color: #6C6A6A;
}

.card-promocion {
    background-color: #FFFFFF;
    border: 2px solid #D9D9D9;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.card-promocion:hover {
    border-color: #FE1E1E;
    box-shadow: 0 4px 12px rgba(254, 30, 30, 0.2);
    transform: translateY(-5px);
}

.imagen-promocion {
    width: 100%;
    height: 250px;
    overflow: hidden;
    background-color: #F3F0F0;
}

.imagen-promocion img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.card-promocion:hover .imagen-promocion img {
    transform: scale(1.05);
}

.contenido-promocion {
    padding: 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.titulo-promocion {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 22px;
    line-height: 28px;
    color: #FE1E1E;
    margin-bottom: 12px;
}

.descripcion-promocion {
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #6C6A6A;
    margin-bottom: 15px;
    flex-grow: 1;
}

.fecha-promocion {
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    font-size: 14px;
    color: #6C6A6A;
    padding-top: 15px;
    border-top: 1px solid #D9D9D9;
    margin-top: auto;
}

/* Responsive para promociones */
@media (max-width: 768px) {
    .tituloPromociones {
        font-size: 28px;
        line-height: 34px;
    }
    
    .textoPromociones {
        font-size: 18px;
        line-height: 26px;
    }
    
    .imagen-promocion {
        height: 200px;
    }
    
    .titulo-promocion {
        font-size: 20px;
        line-height: 26px;
    }
    
    .descripcion-promocion {
        font-size: 15px;
        line-height: 22px;
    }
}