/* Zapfhexe Stempel */
  .zh-logo { --boost: 2.5;} /* Desktop-Zoom */

  @media (max-width: 1000px) {
      .zh-logo {
          --boost: 3.4;   /* Mobile-Zoom */
      }
  }



/* ============================================
   BILDREIHE – verteilt die Items
   ============================================ */
.bildreihe {
  display: flex;
  gap: 10px;              /* 👉 Abstand zwischen den Flyern */
  width: 100%;
  margin-bottom: 12px;    /* 👉 Abstand zur nächsten Sektion */
}

/* ============================================
   ITEM – enger Container um jedes Bild
   ============================================ */
.reihe-item {
  flex: 1;                 /* 👉 verteilt die Breite gleichmäßig */
  display: flex;           /* zentriert das Bild im Slot */
  justify-content: center;
  align-items: center;
  overflow: visible;       /* 👉 wichtig: Hover darf überstehen */
  position: relative;
}

/* ============================================
   BILD – volle Ratio, keine weißen Ränder
   ============================================ */
.reihe-item img {
  height: 191px;           /* 👉 Thumbnail-Höhe (Haupt-Stellschraube) */
  width: auto;             /* volle Ratio */
  border-radius: 4px;      /* 👉 Eckenradius */
  transition: transform 0.25s ease,
              box-shadow 0.25s ease; /* 👉 weicher Hover */
  display: block;
}

/* ============================================
   HOVER – Bild zoomt, Schatten direkt am Bild
   ============================================ */
.reihe-item img:hover {
  transform: scale(2.0);   /* 👉 Zoom-Faktor (hier drehen!) */
  z-index: 5;              /* über Nachbarbildern */
  box-shadow: 0 0 18px 8px rgba(255, 255, 255, 0.8);
                           /* 👉 Schattenfarbe/-stärke */
}






/* ============================================
   MOBILE – größere Höhe
   ============================================ */
@media (max-width:1000px){
  .reihe-item img {
    height: 275px;         /* 👉 mobile Thumbnail-Höhe */
  }
}