.menu-link-text {
  position: relative;
  display: inherit;
}

/* Second underline effect with rounded edges */
.menu-link-text::after {
  content: '';
  position: absolute;
  bottom: -6px;
  width: 0%;
  right: 0;
  height: 2px;
  transition: all 0.3s ease-in-out;
  background-color: var(--ocean);
  border-radius: 999px; /* Fully rounds the edges */
}

.menu-link-text.w--current::after {
  left: 0;
  width: 100%;
}

/* Trigger underline animation when hovering over nav-point-wrapper */
.nav-point-wrapper:hover .menu-link-text::after {
  left: 0;
  width: 100%;
}