:root {
  --swiper-fluid-w: 50%;
  --swiper-projects-item-w: 80%;
}

.row .swiper-wrapper {
  padding-left: 0;
  padding-right: 0;
}

.swiper-button-prev.small,
.swiper-button-next.small {
  --swiper-navigation-size: 28px;
}

.swiper-projects {
  cursor: grab;
}
.swiper-projects ul {
  gap: unset;
}
.swiper-projects .swiper-slide {
  width: var(--swiper-fluid-w);
  height: 100%;
  position: relative;
}

.has-swiper-projects {
  position: relative;
}
.has-swiper-projects .swiper-projects {
  --swiper-fluid-w: var(--swiper-projects-item-w);
  overflow-y: auto;
}
.has-swiper-projects .swiper-button-prev,
.has-swiper-projects .swiper-button-next {
  --swiper-navigation-color: var(--color-cta);
  top: 10rem;
}
.has-swiper-projects .swiper-button-prev:hover,
.has-swiper-projects .swiper-button-next:hover {
  --swiper-navigation-color: var(--color-primary);
}
.has-swiper-projects .swiper-button-prev {
  left: calc(25% - 3vw);
}
.has-swiper-projects .swiper-button-next {
  right: -3vw;
}
@media (min-width: 768px) {
  .has-swiper-projects {
    --swiper-navigation-sides-offset: unset;
    overflow-y: clip;
  }
  .has-swiper-projects .swiper-button-prev,
  .has-swiper-projects .swiper-button-next {
    top: 8rem;
  }
}
