.ba-nav-arrow {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 500;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(92, 10, 10, 0.30);
  border: 1px solid rgba(201, 168, 75, 0.25);
  color: #C9A84B;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s cubic-bezier(.2,.5,.4,.9);
  backdrop-filter: blur(6px);
  padding: 0;
  font-size: 0;
  appearance: none;
  -webkit-appearance: none;
}
.ba-nav-arrow:hover {
  background: rgba(92, 10, 10, 0.75);
  border-color: rgba(201, 168, 75, 0.7);
  transform: translateY(-50%) scale(1.1);
}
.ba-nav-arrow:active {
  transform: translateY(-50%) scale(0.95);
}
.ba-nav-arrow svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}
.ba-nav-prev { left: 1.5rem; }
.ba-nav-next { right: 1.75rem; }
.ba-nav-arrow.hidden { display: none; }

@media (max-width: 768px) {
  .ba-nav-arrow { width: 36px; height: 36px; }
  .ba-nav-arrow svg { width: 18px; height: 18px; }
  .ba-nav-next { right: 1.5rem; }
}

article.ba-slide-out {
  transition: transform 0.32s cubic-bezier(.16,.84,.44,1), opacity 0.28s ease-out !important;
}
article.ba-slide-out.left { transform: translateX(-100px); opacity: 0; }
article.ba-slide-out.right { transform: translateX(100px); opacity: 0; }