.menu-hover {
  position: relative;
  display: inline-block;
  color: #2f2f2f;
  transition: color 0.25s ease;
}

.menu-hover::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 100%;
  height: 2px;
  background: #d84f74;
  border-radius: 999px;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  opacity: 0;
  transition:
    transform 0.28s ease,
    opacity 0.28s ease;
}

.menu-hover:hover {
  color: #d84f74;
}

.menu-hover:hover::after {
  transform: translateX(-50%) scaleX(1);
  opacity: 1;
}
</style>