/* =====================================================
   Hover Effects – Modernized Version (2025)
   Based on Hover.css by Ian Lunn
   Cleaned, optimized, and updated for modern browsers
   ===================================================== */

/* ========== Underline From Center ========== */
.hvr-underline-from-center {
  display: inline-block;
  position: relative;
  overflow: hidden;
  vertical-align: middle;
  transition: color 0.3s ease;
}

.hvr-underline-from-center::before {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: 0;
  height: 3px;
  background: #2098d1;
  transition: left 0.3s ease, right 0.3s ease;
}

.hvr-underline-from-center:hover::before,
.hvr-underline-from-center:focus::before {
  left: 0;
  right: 0;
}

/* Optional: Farbänderung beim Hover */
.hvr-underline-from-center:hover {
  color: #2098d1;
}

/* ========== Shutter Out Horizontal ========== */
.hvr-shutter-out-horizontal {
  display: inline-block;
  position: relative;
  background: #e1e1e1;
  color: #000;
  overflow: hidden;
  transition: color 0.3s ease;
  z-index: 0;
}

.hvr-shutter-out-horizontal::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #2098d1;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.3s ease-out;
  z-index: -1;
}

.hvr-shutter-out-horizontal:hover,
.hvr-shutter-out-horizontal:focus {
  color: #fff;
}

.hvr-shutter-out-horizontal:hover::before,
.hvr-shutter-out-horizontal:focus::before {
  transform: scaleX(1);
}