.projektgalerie {
  max-width: 850px;
  margin-block: 1.5rem 2rem;
}

.projektgalerie [hidden] {
  display: none !important;
}

.projektgalerie-slide {
  margin: 0 0 1.5rem;
  touch-action: pan-y pinch-zoom;
}

.projektgalerie-bildlink {
  display: block;
}

.projektgalerie-bildlink:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

.projektgalerie-slide img {
  display: block;
  width: 100%;
  height: auto;
}

.magazin .projektgalerie-slide figcaption {
  padding-block-start: .75rem;
}

.magazin .projektgalerie-slide figcaption,
.magazin .projektgalerie-slide figcaption p {
  font: normal 16px/1.5 "Open Sans Thin", sans-serif;
}

.magazin .projektgalerie-slide figcaption strong {
  font-family: "Open Sans Regular", sans-serif;
}

.magazin .projektgalerie-slide figcaption p {
  margin: .25rem 0 !important;
}

.projektgalerie[data-gallery-initialized] {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.projektgalerie[data-gallery-initialized] [data-gallery-slides],
.projektgalerie[data-gallery-initialized] .projektgalerie-slide {
  display: contents;
}

.projektgalerie[data-gallery-initialized] .projektgalerie-bildlink,
.projektgalerie-navigation {
  grid-area: 1 / 1;
  touch-action: pan-y pinch-zoom;
}

.projektgalerie[data-gallery-initialized] figcaption {
  grid-area: 2 / 1;
}

.projektgalerie-navigation {
  position: relative;
  pointer-events: none;
}

.projektgalerie-navigation button {
  pointer-events: auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.projektgalerie-navigation button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -3px;
  box-shadow: inset 0 0 0 4px rgb(0 0 0 / 55%);
}

.projektgalerie-pfeil {
  position: absolute;
  top: 50%;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  transform: translateY(-50%);
  border-radius: 50%;
  font-size: 0;
}

.projektgalerie-pfeil::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 11px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  filter: drop-shadow(0 1px 2px rgb(0 0 0 / 85%));
}

.projektgalerie-zurueck { left: 8px; }
.projektgalerie-weiter { right: 8px; }
.projektgalerie-zurueck::before { transform: translate(calc(-50% + 3px), -50%) rotate(135deg); }
.projektgalerie-weiter::before { transform: translate(calc(-50% - 3px), -50%) rotate(-45deg); }

.projektgalerie-navigation .projektgalerie-pfeil:hover {
  background: rgb(0 0 0 / 20%);
}

.projektgalerie-punkte {
  position: absolute;
  bottom: 4px;
  left: 50%;
  display: flex;
  max-width: calc(100% - 24px);
  overflow-x: auto;
  transform: translateX(-50%);
}

.projektgalerie-punkte button {
  flex: 0 0 24px;
  display: grid;
  place-items: center;
  height: 28px;
  border-radius: 50%;
}

.projektgalerie-punkte button::before {
  content: "";
  width: 7px;
  height: 7px;
  box-sizing: border-box;
  border: 1px solid #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgb(0 0 0 / 80%);
}

.projektgalerie-punkte button[aria-current="true"]::before {
  background: #fff;
}

.projektgalerie[data-gallery-pharmacy] .projektgalerie-bildlink {
  position: relative;
}

.projektgalerie[data-gallery-pharmacy] .projektgalerie-bildlink img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.projektgalerie[data-gallery-pharmacy][data-gallery-initialized] .projektgalerie-slide[hidden] {
  display: contents !important;
}

.projektgalerie[data-gallery-pharmacy] .projektgalerie-slide[hidden] .projektgalerie-bildlink {
  display: none;
}

/* Inactive captions still size the common grid row. */
.projektgalerie[data-gallery-pharmacy] .projektgalerie-slide[hidden] figcaption {
  visibility: hidden;
}

.projektgalerie[data-gallery-pharmacy] .projektgalerie-bildlink .projektgalerie-ueberblendung {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  animation: apothekengalerie-ueberblenden 450ms ease-in-out both;
}

@keyframes apothekengalerie-ueberblenden {
  from { opacity: 1; }
  to { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .projektgalerie[data-gallery-pharmacy] .projektgalerie-ueberblendung {
    display: none;
  }
}
