/* ================================
   Hover Effect Variable Engine
   (LIMITED / SAFE VERSION)
   ================================ */

/* --------------------------------
   공통 엔진 (duration 제한)
-------------------------------- */
[class^="hvr-"],
[class*=" hvr-"] {
  transition-property:
    transform,
    box-shadow,
    opacity,
    filter,
    border-color;

  /* duration: 0 ~ 3000ms */
  transition-duration: clamp(
    0ms,
    var(--hover-duration, 300ms),
    3000ms
  );

  transition-timing-function: ease;
}

/* ================================
   Translate (distance 제한)
================================ */

/* Float */
.hvr-float:hover {
  transform: translateY(
    calc(clamp(0px, var(--hover-distance, 8px), 50px) * -1)
  );
}

/* Sink */
.hvr-sink:hover {
  transform: translateY(
    clamp(0px, var(--hover-distance, 8px), 50px)
  );
}

/* Bob (무한) */
.hvr-bob:hover {
  animation: hvr-bob 1.5s infinite ease-in-out;
}
@keyframes hvr-bob {
  0%,100% { transform: translateY(0); }
  50% {
    transform: translateY(
      calc(clamp(0px, var(--hover-distance, 8px), 50px) * -1)
    );
  }
}

/* Bounce (1회) */
.hvr-bounce:hover {
  animation: hvr-bounce 0.8s ease-out;
}
@keyframes hvr-bounce {
  0%   { transform: translateY(0); }
  30%  {
    transform: translateY(
      calc(clamp(0px, var(--hover-distance, 8px), 50px) * -1)
    );
  }
  50%  { transform: translateY(0); }
  70%  {
    transform: translateY(
      calc(clamp(0px, var(--hover-distance, 4px), 25px) * -1)
    );
  }
  100% { transform: translateY(0); }
}

/* ================================
   Wobble (고정 범위)
================================ */

.hvr-wobble-vertical:hover {
  animation: hvr-wobble-vertical 0.8s ease-in-out;
}
@keyframes hvr-wobble-vertical {
  25% { transform: translateY(-6px); }
  50% { transform: translateY(4px); }
  75% { transform: translateY(-2px); }
}

.hvr-wobble-top:hover {
  animation: hvr-wobble-top 0.6s ease-in-out;
}
@keyframes hvr-wobble-top {
  50% { transform: translateY(-8px); }
}

.hvr-wobble-bottom:hover {
  animation: hvr-wobble-bottom 0.6s ease-in-out;
}
@keyframes hvr-wobble-bottom {
  50% { transform: translateY(8px); }
}

.hvr-wobble-top-right:hover {
  animation: hvr-wobble-top-right 0.6s ease-in-out;
}
@keyframes hvr-wobble-top-right {
  50% { transform: translate(6px, -6px); }
}

.hvr-wobble-bottom-right:hover {
  animation: hvr-wobble-bottom-right 0.6s ease-in-out;
}
@keyframes hvr-wobble-bottom-right {
  50% { transform: translate(6px, 6px); }
}

.hvr-wobble-skew:hover {
  animation: hvr-wobble-skew 0.6s ease-in-out;
}
@keyframes hvr-wobble-skew {
  25% { transform: skewX(-6deg); }
  50% { transform: skewX(4deg); }
  75% { transform: skewX(-2deg); }
}

/* ================================
   Scale (제한)
================================ */

.hvr-grow:hover {
  transform: scale(
    clamp(1, var(--hover-scale, 1.05), 1.5)
  );
}

.hvr-shrink:hover {
  transform: scale(
    clamp(0.5, var(--hover-scale-down, 0.95), 1)
  );
}

/* ================================
   Rotate (제한)
================================ */

.hvr-rotate:hover {
  transform: rotate(
    clamp(-45deg, var(--hover-rotate, 5deg), 45deg)
  );
}

.hvr-rotate-left:hover {
  transform: rotate(
    calc(clamp(0deg, var(--hover-rotate, 5deg), 45deg) * -1)
  );
}

.hvr-rotate-right:hover {
  transform: rotate(
    clamp(0deg, var(--hover-rotate, 5deg), 45deg)
  );
}

/* ================================
   Skew (제한)
================================ */

.hvr-skew:hover {
  transform: skew(
    clamp(-20deg, var(--hover-skew-x, 6deg), 20deg),
    clamp(-20deg, var(--hover-skew-y, 0deg), 20deg)
  );
}

.hvr-skew-forward:hover {
  transform: skew(
    clamp(-20deg, calc(var(--hover-skew-x, 6deg) * -1), 20deg),
    clamp(-20deg, var(--hover-skew-y, 0deg), 20deg)
  );
}

.hvr-skew-backward:hover {
  transform: skew(
    clamp(-20deg, var(--hover-skew-x, 6deg), 20deg),
    clamp(-20deg, var(--hover-skew-y, 0deg), 20deg)
  );
}

/* ================================
   Buzz
================================ */

.hvr-buzz:hover {
  animation: hvr-buzz 0.15s linear infinite;
}
@keyframes hvr-buzz {
  50% { transform: translateX(3px) rotate(1deg); }
}

.hvr-buzz-out:hover {
  animation: hvr-buzz-out 0.75s linear;
}
@keyframes hvr-buzz-out {
  10% { transform: translateX(3px) rotate(1deg); }
  20% { transform: translateX(-3px) rotate(-1deg); }
  100% { transform: none; }
}

/* ================================
   Shadow / Glow (제한)
================================ */

.hvr-shadow:hover {
  box-shadow:
    0 10px 25px
    var(--hover-shadow-color, rgba(0,0,0,0.25));
}

.hvr-glow:hover {
  box-shadow:
    0 0 18px
    var(--hover-shadow-color, rgba(0,0,0,0.35));
}

.hvr-float-shadow:hover {
  transform: translateY(
    calc(clamp(0px, var(--hover-distance, 8px), 50px) * -1)
  );
  box-shadow:
    0 10px 20px
    var(--hover-shadow-color, rgba(0,0,0,0.25));
}

.hvr-box-shadow-outset:hover {
  box-shadow:
    0 10px 25px
    var(--hover-shadow-color, rgba(0,0,0,0.25));
}

.hvr-box-shadow-inset:hover {
  box-shadow:
    inset 0 0 15px
    var(--hover-shadow-color, rgba(0,0,0,0.35));
}

/* ================================
   Border / Outline (두께 제한)
================================ */

.hvr-border-pop:hover {
  box-shadow: inset 0 0 0
    clamp(0px, var(--hover-border-width, 1px), 10px)
    var(--hover-border-color, #333);
}

.hvr-outline-outset:hover {
  outline:
    clamp(0px, var(--hover-border-width, 1px), 10px)
    solid
    var(--hover-border-color, #333);
  outline-offset: 4px;
}

.hvr-outline-in:hover {
  outline-color: var(--hover-border-color, currentColor);
  outline-offset: 0;
}
.hvr-outline-in:before {
  content: '';
  position: absolute;
  inset: 0;
  border-style: solid;
  border-width:
    clamp(0px, var(--hover-border-width, 4px), 10px);
  border-color: var(--hover-border-color, #e1e1e1);
}

/* ================================
   Underline / Overline
================================ */

.hvr-underline-center,
.hvr-overline-center {
  position: relative;
}

.hvr-underline-center::after,
.hvr-overline-center::after {
  content:'';
  position:absolute;
  left:50%;
  width:0;
  height: clamp(1px, var(--hover-border-width, 2px), 6px);
  background: var(--hover-border-color, currentColor);
  transition: width var(--hover-duration, 300ms) ease;
  transform: translateX(-50%);
}

.hvr-underline-center::after { bottom:0; }
.hvr-overline-center::after { top:0; }

.hvr-underline-center:hover::after,
.hvr-overline-center:hover::after {
  width:100%;
}

/* ================================
   Ripple Out
================================ */

.hvr-ripple-out {
  position: relative;
}
.hvr-ripple-out::before {
  content: '';
  position: absolute;
  inset: 0;
  border-style: solid;
  border-width:
    clamp(1px, var(--hover-border-width, 6px), 12px);
  border-color: var(--hover-border-color, #e1e1e1);
}
.hvr-ripple-out:hover::after {
  animation: hvr-ripple-out 0.6s ease-out;
}
@keyframes hvr-ripple-out {
  0% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.2); }
}

/* ================================
   모바일 hover 차단
================================ */
@media (hover: none) {
  [class^="hvr-"],
  [class*=" hvr-"] {
    transform: none !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    animation: none !important;
  }
}
