.embla {
  --icon-embla-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38' height='32' viewBox='0 0 38 32' fill='none'%3E%3Cpath d='M36.4522 16.5463L22.5432 30.4554C22.3982 30.6004 22.2015 30.6819 21.9964 30.6819C21.7914 30.6819 21.5947 30.6004 21.4497 30.4554C21.3047 30.3104 21.2233 30.1138 21.2233 29.9087C21.2233 29.7037 21.3047 29.507 21.4497 29.362L34.0394 16.7724L1.90554 16.7724C1.7006 16.7724 1.50405 16.6909 1.35914 16.546C1.21422 16.4011 1.13281 16.2046 1.13281 15.9996C1.13281 15.7947 1.21422 15.5981 1.35914 15.4532C1.50405 15.3083 1.7006 15.2269 1.90554 15.2269L34.0394 15.2269L21.4497 2.63724C21.3047 2.49225 21.2233 2.29559 21.2233 2.09054C21.2233 1.88549 21.3047 1.68883 21.4497 1.54384C21.5947 1.39884 21.7914 1.31738 21.9964 1.31738C22.2015 1.31738 22.3982 1.39884 22.5432 1.54383L36.4522 15.4529C36.5241 15.5247 36.5811 15.6099 36.62 15.7037C36.6589 15.7975 36.6789 15.8981 36.6789 15.9996C36.6789 16.1012 36.6589 16.2017 36.62 16.2955C36.5811 16.3893 36.5241 16.4746 36.4522 16.5463Z' fill='%232E338B' /%3E%3C/svg%3E");
  --arrow-width: clamp(24px, 5cqw, 38px);
  --arrow-position: calc((clamp(24px, 5cqw, 38px) + var(--arrow-width)) * -1);
}
.embla__viewport {
  overflow: hidden;
}
.embla__container {
  backface-visibility: hidden;
  display: flex;
  touch-action: pan-y;
}
.embla__dots {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5em;
  margin-top: 2em;
}
.embla__dot {
  font-size: var(--font-size-16);
  width: 1em;
  height: 1em;
  cursor: pointer;
  transition: var(--transition);
  border-radius: var(--border-radius);
  border: none;
  background-color: var(--color-brown-light-logo);
}
.embla__dot--selected {
  background-color: var(--color-primary);
}
.embla__dot:hover:not(.embla__dot--selected) {
  background-color: var(--color-brown-dark-logo);
  opacity: 1;
}
.embla__arrow {
  width: var(--arrow-width);
  aspect-ratio: 13/11;
  background: none;
  cursor: pointer;
  border: none;
  border-radius: 10em;
  transition: var(--transition);
  background-color: transparent;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}
.embla__arrow--prev {
  left: var(--arrow-position);
}
.embla__arrow--next {
  right: var(--arrow-position);
}
.embla__arrow::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  mask: var(--icon-embla-arrow-right) center/contain no-repeat;
  background-color: var(--color-primary);
  transition: var(--transition);
}
.embla__arrow:hover:not(:disabled) {
  --embla-arrows-background-color: var(--embla-arrows-background-color-hover);
  opacity: 1;
}
.embla__arrow:hover:not(:disabled)::after {
  background-color: var(--color-secondary);
}
.embla__arrow:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}
.embla__arrow--prev::after {
  transform: rotate(180deg) scaleY(-1);
}
@media screen and (max-width: 768px) {
  .embla__dots {
    margin-top: 2em;
    margin-left: calc(var(--padding-on-side) * 3);
    margin-right: calc(var(--padding-on-side) * 3);
  }
  .embla__arrow {
    margin-top: -0.1em;
  }
}