/*CSS EXCLUSIVO PARA COLOCAR ANIMACIONES Y GALERÍAS*/

 /*efectos galeria*/
 .img-border{
  border-radius: 40px;
}

.zoom-container {
  overflow: hidden;
  position: relative;
  border-radius: 40px;
}

.zoom-container img {
  width: 100%;
  height: 100%; 
  transition: transform 0.5s ease;
  object-fit: cover; /* Para que la imagen se ajuste sin distorsionarse */
  object-position: center; /* Asegura que el zoom se mantenga centrado */
}

.zoom-container:hover img {
  transform: scale(1.3); /* Ajusta el valor de scale para más o menos zoom */
}

/*cards por que*/
.box-tr {
  background: #ffffff;
  padding: 25px 15px;
  transition: all .3s ease;
  position: relative;
}

.box-tr::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 2px;
  background: #000;
  transition: all .3s ease;
  transform: translateX(-50%);
}

.box-tr:hover::after {
  width: 40%;
}

.box-tr:hover {
  background: #d0d0d0; 
}
 
/*iconos zoom*/
.zoom1 {
  transition: transform .35s ease;
}

.zoom1:hover {
  transform: scale(1.08);
}

/* Card hover */
.card-hover {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efecto hover */
.card-hover:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);
}

/*parallax*/
.parallax1 { 
  /* The image used */
  background: url(../img/parallax.webp) center center no-repeat;
  background-size: cover;

  /* Set a specific height */
  min-height: 200px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; 
}

/*flecha de botón*/
.moving-arrow {
  display: inline-block;
  animation: move-right 1.5s infinite linear;
}

@keyframes move-right {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(6px); /* Ajusta la distancia de movimiento */
  }
  100% {
    transform: translateX(0);
  }
}
/*moving arrow*/


/*icono ficha tecnica*/
.float-icon {
  display: inline-block;
  animation: floatUpDown 2s ease-in-out infinite;
}

@keyframes floatUpDown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(5px); /* distancia que se mueve hacia abajo */
  }
  100% {
    transform: translateY(0);
  }
}


@media (max-width: 425px){

}



@media (max-width: 768px){

 
}