/* Bildzoom: ein Bild in einem Link mit class="bildzoom" oeffnet sich gross.
   Gleiches data-gruppe an mehreren Links = blaetterbar. Akzent je Seite ueber --bz-akzent. */
a.bildzoom{display:block;position:relative;cursor:zoom-in;border-radius:12px;}
a.bildzoom:focus-visible{outline:2px solid var(--bz-akzent,#e8ecf2);outline-offset:4px;}
a.bildzoom::after{content:"";position:absolute;right:10px;bottom:10px;width:34px;height:34px;
  border-radius:999px;background:rgba(10,12,16,.72) no-repeat center/18px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21M10.5 7.5v6M7.5 10.5h6'/%3E%3C/svg%3E");
  opacity:.8;transition:opacity .15s ease;pointer-events:none;}
a.bildzoom:hover::after,a.bildzoom:focus-visible::after{opacity:1;}

.bz-overlay{position:fixed;inset:0;z-index:10000;background:rgba(8,10,14,.94);
  display:flex;align-items:center;justify-content:center;padding:60px 72px 36px;
  opacity:0;transition:opacity .18s ease;}
.bz-overlay[hidden]{display:none;}
.bz-overlay.offen{opacity:1;}
.bz-figur{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;
  max-width:100%;max-height:100%;}
.bz-bild{display:block;width:auto;height:auto;max-width:calc(100vw - 160px);
  max-height:calc(100vh - 160px);max-height:calc(100dvh - 160px);
  border-radius:10px;box-shadow:0 30px 90px rgba(0,0,0,.6);opacity:0;transition:opacity .2s ease;}
.bz-bild.geladen{opacity:1;}
.bz-text{color:#d7dce5;font-family:inherit;font-size:14px;line-height:1.55;text-align:center;
  max-width:70ch;margin:0;}
.bz-text[hidden]{display:none;}
.bz-zaehler{position:absolute;top:22px;left:24px;color:#98a2b3;font-family:inherit;font-size:13px;
  font-variant-numeric:tabular-nums;}
.bz-knopf{position:absolute;border:0;background:rgba(255,255,255,.09);color:#fff;width:46px;height:46px;
  border-radius:999px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;}
.bz-knopf svg{width:22px;height:22px;}
.bz-knopf:hover{background:rgba(255,255,255,.18);}
.bz-knopf:focus-visible{outline:2px solid var(--bz-akzent,#e8ecf2);outline-offset:2px;}
.bz-knopf[hidden]{display:none;}
.bz-zu{top:12px;right:14px;}
.bz-zurueck{left:14px;top:50%;transform:translateY(-50%);}
.bz-vor{right:14px;top:50%;transform:translateY(-50%);}

@media (max-width:640px){
  .bz-overlay{padding:60px 12px 84px;}
  .bz-bild{max-width:calc(100vw - 24px);max-height:calc(100vh - 200px);max-height:calc(100dvh - 200px);}
  .bz-zurueck,.bz-vor{top:auto;bottom:18px;transform:none;}
  .bz-zurueck{left:calc(50% - 58px);}
  .bz-vor{right:calc(50% - 58px);}
}
@media (prefers-reduced-motion:reduce){
  .bz-overlay,.bz-bild,a.bildzoom::after{transition:none;}
}
