.yard-swiper {

   .swiper-button-prev,
   .swiper-button-next {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 3;
      width: clamp(2.1rem, 5vw, 3rem);
      height: clamp(2.1rem, 5vw, 3rem);
      border-radius: .4rem;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--brass);
      background: var(--brass);
      color: white;
      opacity: .85;
      transition: opacity .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease;

      &::after {
         font-size: var(--wp--preset--font-size--base);
      }

      &:hover {
         border-color: var(--brass-2);
         opacity: 1;
      }

   }
}