
  /* Swiper Buttons Hover */
  .swiper-button {
    --ease: cubic-bezier(0.21, 1, 0.34, 1);
    --color-ease: cubic-bezier(0.215, 0.61, 0.355, 1);
    --speed: 0.45s;
    --speed-fast: 0.3s;
    --speed-faster: 0.15s;
  }
  
  @media (hover: hover) and (pointer: fine) {
    .swiper-button::before {
      content: '';
      display: block;
      position: absolute;
      background-color: var(--_button---swiper--background-hover);
      inset: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      clip-path: inset(100% 0.75rem 0 0.75rem round 0.25rem 0.25rem 0 0);
      transition: clip-path var(--speed) var(--ease);
    }

    .swiper-button:hover::before,
    .swiper-button:focus-visible::before {
      clip-path: inset(0 0 0 0 round 0.25rem);
    }

    .swiper-button .swiper-button_arrow-1 {
      color: var(--_button---swiper--text-hover);
      transform: translateY(2.5em);
      transition:
        transform var(--speed) var(--ease);
    }

    .swiper-button:hover .swiper-button_arrow-1,
    .swiper-button:focus-visible .swiper-button_arrow-1 {
      transform: translateY(0);
    }

    .swiper-button .swiper-button_arrow-2 {
      color: var(--_button---swiper--text);
      transform: translateY(0em);
      transition:
        transform var(--speed) var(--ease);
    }

    .swiper-button:hover .swiper-button_arrow-2,
    .swiper-button:focus-visible .swiper-button_arrow-2 {
      transform: translateY(-2.5em);
    }
  }
