@keyframes pa-gallery-scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
@keyframes pa-gallery-scroll-right {
  from {
    transform: translateX(-50%);
  }
  to {
    transform: translateX(0);
  }
}
.gallery {
  --gallery-row-h: 260px;
  --gallery-duration: 60s;
  --gallery-space-top: var(--pa-space-3xl);
  --gallery-space-bottom: var(--pa-space-3xl);
  padding-top: var(--gallery-space-top);
  padding-bottom: var(--gallery-space-bottom);
  background: var(--pa-color-light-bg);
  width: 100vw;
  margin-inline: calc(50% - 50vw);
}
@media (min-width: 1024px) {
  .gallery {
    --gallery-row-h: 376px;
  }
}
.gallery__header {
  max-width: var(--pa-container-max);
  margin-inline: auto;
  margin-bottom: var(--pa-space-2xl);
  padding-inline: var(--pa-gutter);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--pa-space-sm);
  text-align: center;
}
.gallery__eyebrow {
  font-family: "Work Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.125rem;
  letter-spacing: 1.5px;
  margin: 0;
  color: var(--pa-color-blue);
  text-transform: uppercase;
}
.gallery__heading {
  font-family: "Ancizar Serif", Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: 2.625rem;
  line-height: 1.1;
  letter-spacing: 0;
}
@media (min-width: 768px) {
  .gallery__heading {
    font-weight: 500;
    font-size: 3rem;
    letter-spacing: 0.853px;
  }
}
.gallery__heading {
  margin: 0;
  color: var(--pa-color-navy);
}
.gallery__marquee {
  display: flex;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--pa-gutter), #000 calc(100% - var(--pa-gutter)), transparent);
  mask-image: linear-gradient(to right, transparent, #000 var(--pa-gutter), #000 calc(100% - var(--pa-gutter)), transparent);
}
.gallery__track {
  display: flex;
  flex: 0 0 auto;
  gap: var(--pa-space-lg);
  padding-inline-end: var(--pa-space-lg);
  animation: pa-gallery-scroll-left var(--gallery-duration) linear infinite;
}
.gallery--right .gallery__track {
  animation-name: pa-gallery-scroll-right;
}
.gallery__slide {
  flex: 0 0 auto;
  height: var(--gallery-row-h);
  aspect-ratio: 3/2;
  border-radius: 10px;
  overflow: hidden;
  background: var(--pa-color-dark-bg);
}
.gallery__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (prefers-reduced-motion: reduce) {
  .gallery__track {
    animation-play-state: paused;
  }
}