/* Efectos hover — CSS3, aplicables a img o a un wrapper */
[class*="kipu-hover-"]{
  display:inline-block;
  max-width:100%;
  overflow:hidden;
  position:relative;
  vertical-align:middle;
  isolation:isolate;
}
[class*="kipu-hover-"] img,
img[class*="kipu-hover-"]{
  display:block;
  max-width:100%;
  height:auto;
  transition:transform .4s ease, filter .4s ease, box-shadow .4s ease, outline-color .3s ease;
}

.kipu-hover-shine::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);
  transform:translateX(-120%);
  transition:transform .7s ease;
  pointer-events:none;z-index:1;
}
.kipu-hover-shine:hover::after{transform:translateX(120%)}

.kipu-hover-zoom:hover,
.kipu-hover-zoom:hover img,
img.kipu-hover-zoom:hover{transform:scale(1.08)}

.kipu-hover-blur:hover,
.kipu-hover-blur:hover img,
img.kipu-hover-blur:hover{filter:blur(2.5px)}

.kipu-hover-sepia:hover,
.kipu-hover-sepia:hover img,
img.kipu-hover-sepia:hover{filter:sepia(1)}

.kipu-hover-gray:hover,
.kipu-hover-gray:hover img,
img.kipu-hover-gray:hover{filter:grayscale(1)}

.kipu-hover-saturate:hover,
.kipu-hover-saturate:hover img,
img.kipu-hover-saturate:hover{filter:saturate(1.7)}

.kipu-hover-bright:hover,
.kipu-hover-bright:hover img,
img.kipu-hover-bright:hover{filter:brightness(1.18)}

.kipu-hover-contrast:hover,
.kipu-hover-contrast:hover img,
img.kipu-hover-contrast:hover{filter:contrast(1.35)}

.kipu-hover-lift{
  transition:transform .35s ease, box-shadow .35s ease;
}
.kipu-hover-lift:hover{
  transform:translateY(-6px);
  box-shadow:0 12px 28px rgba(15,23,42,.22);
}

.kipu-hover-dim::before{
  content:"";
  position:absolute;inset:0;
  background:rgba(15,23,42,0);
  transition:background .35s ease;
  z-index:1;pointer-events:none;
}
.kipu-hover-dim:hover::before{background:rgba(15,23,42,.38)}

.kipu-hover-outline{outline:2px solid transparent;outline-offset:4px}
.kipu-hover-outline:hover{outline-color:#0ea5e9}

.kipu-hover-tilt:hover,
.kipu-hover-tilt:hover img,
img.kipu-hover-tilt:hover{transform:rotate(-2.2deg) scale(1.03)}