@layer components {
  .c-component-link--gradient-navigation { position: relative; text-decoration: none; padding: .75rem 0; }
  .c-component-link--gradient-navigation:hover, .c-component-link--gradient-navigation[aria-current] { background: transparent; }
  .c-component-link--gradient-navigation::after { content: ''; position: absolute; inset-inline: 0; inset-block-end: .2rem; block-size: .14rem; background-image: linear-gradient(120deg,var(--wa-gradient-start),var(--wa-gradient-middle) 52%,var(--wa-gradient-end)); transform: scaleX(0); transform-origin: center; transition: transform .18s ease; }
  .c-component-link--gradient-navigation[aria-current], .c-composition-navigation__items .c-component-link--gradient-navigation[aria-current] { text-decoration: none; }
  .c-component-link--gradient-navigation[aria-current]::after, .c-component-link--gradient-navigation:hover::after, .c-component-link--gradient-navigation:focus-visible::after { transform: scaleX(1); }
  @media (prefers-reduced-motion: reduce) { .c-component-link--gradient-navigation::after { transition: none; } }
}
@layer components {
  .c-component-link--gradient-navigation { display: inline-flex; align-items: center; min-block-size: 2.8rem; padding: 0; }
  .c-component-link--gradient-navigation::after { inset-block-end: .35rem; block-size: .18rem; transform-origin: right; transition-duration: 160ms; }
  .c-component-link--gradient-navigation:hover::after, .c-component-link--gradient-navigation[aria-current]::after { transform-origin: left; }
  @media (prefers-reduced-motion: reduce) { .c-component-link--gradient-navigation::after { transition: none; } }
}