@media screen and (min-width: 1156px) {
  body #main-nav {
    --ia-nav-underline: var(--ia-action);
  }

  body #main-nav > li > a,
  body #main-nav > li.current-menu-item > a,
  body #main-nav > li.current-menu-ancestor > a,
  body #main-nav > li.current-menu-parent > a,
  body #main-nav > li.current_page_item > a,
  body #main-nav > li.current_page_ancestor > a {
    position: relative;
    border-bottom-color: transparent !important;
    transition: color var(--ia-motion-fast) var(--ia-ease);
  }

  body #main-nav > li > a[href]:hover,
  body #main-nav > li > a[href]:focus-visible,
  body #main-nav > li:hover > a,
  body #main-nav > li:focus-within > a {
    background-color: transparent !important;
    border-bottom-color: transparent !important;
  }

  body #main-nav > li > a::before {
    content: "";
    position: absolute;
    left: var(--ia-space-sm);
    right: var(--ia-space-sm);
    bottom: 6px;
    height: 2px;
    border-radius: 2px;
    background-color: var(--ia-nav-underline);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform var(--ia-motion-fast) var(--ia-ease);
  }

  body #main-nav > li:hover > a::before,
  body #main-nav > li:focus-within > a::before,
  body #main-nav > li.current-menu-item > a::before,
  body #main-nav > li.current-menu-ancestor > a::before,
  body #main-nav > li.current-menu-parent > a::before,
  body #main-nav > li.current_page_item > a::before,
  body #main-nav > li.current_page_ancestor > a::before {
    transform: scaleX(1);
  }

  body #main-nav > li.current-menu-item > a::before,
  body #main-nav > li.current-menu-ancestor > a::before,
  body #main-nav > li.current-menu-parent > a::before,
  body #main-nav > li.current_page_item > a::before,
  body #main-nav > li.current_page_ancestor > a::before {
    transition: none;
  }
}

@media screen and (min-width: 1156px) and (prefers-reduced-motion: reduce) {
  body #main-nav > li > a::before {
    transition: none;
  }
}
