.afgh-basic-output {
  width: 100%;
  min-width: 0;
  overflow: visible;
}

.afgh-basic-output,
.afgh-basic-output * {
  box-sizing: border-box;
}

.afgh-basic-collection,
.afgh-basic-grid {
  width: 100%;
  min-width: 0;
}

.afgh-collections-stack > .afgh-basic-collection + .afgh-basic-collection {
  margin-top: var(--afgh-collection-gap, 24px);
}

.afgh-basic-collection-title {
  margin: 0 0 .75rem;
}

.afgh-basic-collection-description {
  margin: 0 0 1rem;
}

.afgh-basic-item {
  width: 100%;
  min-width: 0;
  margin: 0;
  vertical-align: top;
}

/* Klassisches Masonry und Bilderwand werden erst nach einer erfolgreichen
 * Messung absolut positioniert. Ohne JavaScript bleibt eine sichere lineare
 * Ausgabe erhalten. */
.afgh-basic-grid.is-afgh-positioned {
  position: relative;
}

.afgh-basic-grid.is-afgh-positioned > .afgh-basic-item {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  transform-origin: 0 0;
}

.afgh-basic-grid:not(.is-afgh-positioned):not(.afgh-layout-grid) > .afgh-basic-item + .afgh-basic-item {
  margin-top: var(--afgh-gap-y, 0px);
}

/* Gleichmäßiges Raster. Die aktuelle Spaltenzahl wird anhand der tatsächlichen
 * Modulbreite gesetzt, nicht anhand der gesamten Browserbreite. */
.afgh-basic-grid.afgh-layout-grid {
  display: grid;
  grid-template-columns: repeat(var(--afgh-current-columns, 1), minmax(0, 1fr));
  column-gap: var(--afgh-gap-x, 0px);
  row-gap: var(--afgh-gap-y, 0px);
  align-items: start;
}

.afgh-basic-link {
  display: block;
  overflow: visible;
  border-radius: var(--afgh-image-radius, 4px);
  background: transparent;
  text-decoration: none;
}

.afgh-basic-image-shell {
  display: block;
  width: 100%;
  overflow: hidden;
  border-radius: var(--afgh-image-radius, 4px);
  background: rgba(127, 127, 127, .08);
}

.afgh-basic-image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  transition: transform .2s ease;
}

/* Im Justified-Modus setzt die Layoutsteuerung die Bildhöhe zeilenweise. */
.afgh-layout-justified.is-afgh-positioned .afgh-basic-image-shell {
  height: var(--afgh-row-image-height, auto);
}

.afgh-layout-justified.is-afgh-positioned .afgh-basic-image {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

/* Festes Rasterverhältnis. Bei "Original" bleibt die natürliche Bildhöhe. */
.afgh-layout-grid.afgh-grid-fixed .afgh-basic-image-shell {
  aspect-ratio: var(--afgh-grid-ratio, 1 / 1);
}

.afgh-layout-grid.afgh-grid-fixed .afgh-basic-image {
  width: 100%;
  height: 100%;
  object-fit: var(--afgh-grid-fit, cover);
  object-position: var(--afgh-grid-position, center center);
}

.afgh-layout-grid.afgh-grid-original .afgh-basic-image {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.afgh-basic-link:hover .afgh-basic-image,
.afgh-basic-link:focus-visible .afgh-basic-image {
  transform: scale(1.025);
}

.afgh-basic-link:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}

.afgh-basic-link:focus:not(:focus-visible) {
  outline: none;
}

.afgh-attachment-badge {
  position: absolute;
  z-index: 4;
  right: .45rem;
  bottom: .45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.85rem;
  max-width: calc(100% - .9rem);
  padding: .2rem .55rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: var(--afgh-attachment-badge-background, #111827);
  color: var(--afgh-attachment-badge-color, #ffffff);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .28);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  pointer-events: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: opacity .22s ease, visibility .22s ease;
}

/* Sobald das Overlay sichtbar ist, liegt auch die Anlagenmarke vollständig darunter. */
.afgh-basic-link.has-overlay-always .afgh-attachment-badge,
.afgh-basic-link.has-overlay-hover:hover .afgh-attachment-badge,
.afgh-basic-link.has-overlay-hover:focus-visible .afgh-attachment-badge,
.afgh-basic-link.has-overlay-hover:focus-within .afgh-attachment-badge {
  opacity: 0;
  visibility: hidden;
}

.afgh-basic-caption {
  display: grid;
  gap: .2rem;
  padding-top: .5rem;
}

.afgh-basic-title {
  font-weight: 600;
}

.afgh-basic-meta {
  font-size: .875em;
  opacity: .75;
}

.afgh-lg-attachments ul {
  display: grid;
  gap: .3rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.afgh-lg-attachments a {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.afgh-attachment-type {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 2.7em;
  padding: .08rem .3rem;
  border-radius: .25rem;
  background: #4b5563;
  color: #fff;
  font-size: .72em;
  font-weight: 800;
  line-height: 1.4;
}

.afgh-lg-attachments {
  max-width: 980px;
  margin: .65rem auto 0;
  text-align: left;
}

.afgh-lg-attachments small {
  display: block;
  margin: .15rem 0 .35rem 3.2em;
  opacity: .78;
}

@media (prefers-reduced-motion: reduce) {
  .afgh-basic-image {
    transition: none;
  }
}

/*
 * AF Grafik Hub 1.0.51 – originale LightGallery/JLLightGallery-Ausgabe.
 * Die Bibliotheks-CSS liegt separat in lightgallery.min.css. Hier folgen nur
 * Joomla-/Gantry-Anpassungen und lokale Steuerelemente ohne Icon-Schriftdatei.
 */
.lg-backdrop {
  z-index: 2147483000 !important;
}

.lg-outer {
  z-index: 2147483001 !important;
}

.lg-outer,
.lg-backdrop {
  direction: ltr;
}

.lg-icon,
.lg-actions .lg-next,
.lg-actions .lg-prev {
  font-family: Arial, Helvetica, sans-serif !important;
  font-style: normal;
  font-weight: 700;
  text-transform: none;
}

.lg-actions .lg-next:before {
  content: "›" !important;
  font-size: 42px;
  line-height: .55;
}

.lg-actions .lg-prev:after {
  content: "‹" !important;
  font-size: 42px;
  line-height: .55;
}

.lg-toolbar .lg-close:after {
  content: "×" !important;
  font-size: 34px;
  line-height: .75;
}

#lg-zoom-in,
#lg-zoom-out {
  position: relative;
}

#lg-zoom-in:before,
#lg-zoom-out:before {
  content: "" !important;
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background-color: currentColor;
  background-image: none;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 25px 25px;
  mask-size: 25px 25px;
}

#lg-zoom-in:before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='m14.5 14.5 5 5M7 10h6M10 7v6'/%3E%3C/g%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='m14.5 14.5 5 5M7 10h6M10 7v6'/%3E%3C/g%3E%3C/svg%3E");
}

#lg-zoom-out:before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='m14.5 14.5 5 5M7 10h6'/%3E%3C/g%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='m14.5 14.5 5 5M7 10h6'/%3E%3C/g%3E%3C/svg%3E");
}

#lg-zoom-in:after,
#lg-zoom-out:after {
  content: none !important;
}

#lg-actual-size:after {
  content: "1:1" !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.03em;
}

.lg-fullscreen:after {
  content: "⛶" !important;
  font-size: 25px;
}

.lg-fullscreen-on .lg-fullscreen:after {
  content: "⊡" !important;
  font-size: 25px;
}

.lg-rotate-left:after {
  content: "↶" !important;
  font-size: 25px;
}

.lg-rotate-right:after {
  content: "↷" !important;
  font-size: 25px;
}

.lg-flip-ver:after {
  content: "↕" !important;
  font-size: 24px;
}

.lg-flip-hor:after {
  content: "↔" !important;
  font-size: 24px;
}

.lg-outer .lg-toogle-thumb:after {
  content: "▦" !important;
  font-size: 22px;
}

.lg-toolbar .lg-download {
  display: none !important;
}

.lg-toolbar .lg-icon,
.lg-actions .lg-next,
.lg-actions .lg-prev,
.lg-outer .lg-toogle-thumb {
  color: rgba(255, 255, 255, .82);
}

.lg-toolbar .lg-icon:hover,
.lg-toolbar .lg-icon:focus,
.lg-actions .lg-next:hover,
.lg-actions .lg-next:focus,
.lg-actions .lg-prev:hover,
.lg-actions .lg-prev:focus,
.lg-outer .lg-toogle-thumb:hover,
.lg-outer .lg-toogle-thumb:focus {
  color: #fff;
}

.lg-toolbar .lg-icon:focus-visible,
.lg-actions .lg-next:focus-visible,
.lg-actions .lg-prev:focus-visible,
.lg-outer .lg-toogle-thumb:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -4px;
}

.lg-sub-html {
  max-height: 34vh;
  overflow: auto;
  padding-inline: clamp(18px, 5vw, 72px);
}

.lg-sub-html h4 {
  margin: 0;
  color: inherit;
}

.lg-sub-html .afgh-lg-meta,
.lg-sub-html .afgh-lg-description {
  max-width: 980px;
  margin-inline: auto;
}

.lg-sub-html .afgh-lg-meta {
  opacity: .78;
}

.lg-sub-html .afgh-lg-description {
  white-space: pre-line;
}

.lg-outer.lg-has-thumb .lg-item {
  padding-bottom: 120px;
}

@media (max-width: 700px) {
  .lg-actions .lg-next {
    right: 4px;
  }

  .lg-actions .lg-prev {
    left: 4px;
  }

  .lg-sub-html {
    padding-inline: 16px;
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lg-outer *,
  .lg-backdrop {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}

/* AF Grafik Hub 1.0.51 – Sammlungsanker, Overlay und zusammengeführte Ausgabe. */
.afgh-basic-collection,
.afgh-merged-intro,
.afgh-merged-anchor,
.afgh-basic-item {
  scroll-margin-top: 6rem;
}

.afgh-basic-link {
  position: relative;
  isolation: isolate;
}

.afgh-basic-overlay {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: block;
  padding: 0;
  overflow: hidden;
  border-radius: var(--afgh-overlay-radius, 4px);
  background: var(--afgh-overlay-background, rgba(0, 0, 0, .72));
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}

.afgh-basic-overlay.is-hover {
  opacity: 0;
  transform: translateY(8px);
}

.afgh-basic-link:hover .afgh-basic-overlay.is-hover,
.afgh-basic-link:focus-visible .afgh-basic-overlay.is-hover,
.afgh-basic-link:focus-within .afgh-basic-overlay.is-hover {
  opacity: 1;
  transform: translateY(0);
}

.afgh-basic-overlay.is-always {
  opacity: 1;
  transform: none;
}


.afgh-merged-intros {
  display: grid;
  gap: 1rem;
  margin-bottom: 1rem;
}

.afgh-merged-anchor {
  display: block;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  pointer-events: none;
}

/* Defensive fallback: a genuinely empty intro never reserves layout space. */
.afgh-merged-intro:empty,
.afgh-merged-intros:empty {
  display: none;
  margin: 0;
  padding: 0;
}

.afgh-lg-collection {
  margin: 0 auto .35rem;
  max-width: 980px;
  font-size: .78em;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .76;
}


@media (prefers-reduced-motion: reduce) {
  .afgh-basic-overlay {
    transition: none;
  }
}

/* Getrennte Sammlungen können weiterhin als eigenständige, raumfüllende
 * Blöcke angeordnet werden. Die innere Galerie behält ihren gewählten Modus. */
.afgh-collections-flow {
  width: 100%;
  column-width: max(260px, min(100%, 420px));
  column-gap: var(--afgh-collection-gap, 24px);
}

.afgh-collections-flow > .afgh-basic-collection {
  display: inline-block;
  width: 100%;
  min-width: 0;
  margin: 0 0 var(--afgh-collection-gap, 24px);
  break-inside: avoid;
  page-break-inside: avoid;
  vertical-align: top;
}

.afgh-collections-flow > .afgh-basic-collection + .afgh-basic-collection {
  margin-top: 0;
}

.afgh-collections-flow > .afgh-basic-collection:last-child {
  margin-bottom: 0;
}
