/* -----------------------------------------
   EFECTO GLOW LÍQUIDO PREMIUM EN EL MENÚ
------------------------------------------ */

.nav a {
  position: relative;
  transition: color 0.3s ease;
}

.nav a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0px;
  height: 0px;
  background: radial-gradient(
    circle,
    rgba(212, 163, 115, 0.55) 0%,
    rgba(212, 163, 115, 0.25) 40%,
    transparent 70%
  );
  border-radius: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  pointer-events: none;
  transition:
    width 0.35s ease,
    height 0.35s ease,
    opacity 0.35s ease;
}

/* Hover: halo suave */
.nav a:hover::before {
  width: 140px;
  height: 140px;
  opacity: 1;
}

/* Click: pequeño flash */
.nav a:active {
  filter: brightness(1.3);
}
/* Glow dinámico */
.glow-effect {
  position: absolute;
  width: 0;
  height: 0;
  background: radial-gradient(
    circle,
    rgba(255, 220, 180, 0.7) 0%,
    rgba(212, 163, 115, 0.4) 40%,
    transparent 70%
  );
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  transition:
    width 0.25s ease,
    height 0.25s ease,
    opacity 0.25s ease;
  opacity: 0;
}

.nav a:hover .glow-effect {
  width: 120px;
  height: 120px;
  opacity: 1;
}