@layer components {
  .link {
    display: block;
    text-decoration: underline;
    transition-property:
      color, background-color, border-color, text-decoration-color, fill,
      stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;

    &:hover {
      transform: translateY(calc(var(--length-0_5) * -1));
    }
    &:active {
      transform: scale(0.95);
    }
  }
}