/* Nach den vorhandenen Stylesheets laden. */
main figure.image:not(.headerimage figure):not(.slick-slider figure) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(42, 53, 34, .09);
  transition: box-shadow .35s ease;
}

/* Innenliegender Rahmen: veraendert weder Bildgroesse noch Layout. */
main figure.image:not(.headerimage figure):not(.slick-slider figure)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  border: 1px solid rgba(160, 144, 116, .28);
  border-radius: inherit;
  pointer-events: none;
}

main figure.image:not(.headerimage figure):not(.slick-slider figure) picture {
  display: block;
  overflow: hidden;
  border-radius: inherit;
}

main figure.image:not(.headerimage figure):not(.slick-slider figure) img {
  display: block;
  width: 100%;
  transform-origin: center;
  transition: transform .7s cubic-bezier(.2, .65, .3, 1);
}

@media (hover: hover) and (pointer: fine) {
  main figure.image:not(.headerimage figure):not(.slick-slider figure):hover {
    box-shadow: 0 14px 32px rgba(42, 53, 34, .16);
  }

  main figure.image:not(.headerimage figure):not(.slick-slider figure):hover img {
    transform: scale(1.035);
  }
}

@media (prefers-reduced-motion: reduce) {
  main figure.image,
  main figure.image img {
    transition: none !important;
    transform: none !important;
  }
}
