/* ===== Polaroid-Fotoband unter den Grafikbuttons (live seit 28.09.2026) ===== */
.pb{position:relative;z-index:1;background:var(--fw-espresso,#211914);padding:0 0 46px;overflow:hidden;
  /* Kartenbreite = tatsächlich dargestellte Breite der Grafikbuttons (per Skript gemessen); Rahmen und Abstände proportional */
  --pb-w:155px;--pb-gap:0px;--pb-ueber:calc(var(--pb-w) * -.10);--pb-pad:calc(var(--pb-w) * .041);--pb-unten:calc(var(--pb-w) * .148)}
.pb-fenster{overflow:hidden;width:100%;padding:8px 0 14px}
.pb-band{display:flex;align-items:center;gap:var(--pb-gap);margin:0;padding:0 0 0 calc(var(--pb-w) * .126);list-style:none;width:max-content;will-change:transform;
  transform:translate3d(0,0,0)}
.pb-band.laeuft{animation:pbLauf var(--pb-dauer,120s) linear infinite}
.pb.pausiert .pb-band{animation-play-state:paused}
@keyframes pbLauf{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(var(--pb-strecke,0px) * -1),0,0)}}
.pb-karte{box-sizing:border-box;flex:0 0 var(--pb-w);width:var(--pb-w);margin:0;background:#F4EEE3;padding:var(--pb-pad) var(--pb-pad) var(--pb-unten);
  border-radius:3px;box-shadow:0 7px 16px rgba(0,0,0,.45),0 2px 4px rgba(0,0,0,.35);transform:rotate(var(--r,0deg))}
.pb-karte img{display:block;width:100%;height:auto;background:#d9cfc0}
/* Polaroids leicht übereinander (ca. 10 % der Kartenbreite) */
.pb-karte+.pb-karte{margin-left:var(--pb-ueber)}
/* Pause-/Start-Taste: dezent, beschriftet */
.pb-taste{position:absolute;right:max(12px,var(--pad,1rem));bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:.45em;
  font:600 .8125rem/1 var(--fw-f-text,'Inter',system-ui,sans-serif);letter-spacing:.02em;color:#F4EEE3;background:rgba(33,25,20,.82);
  border:1px solid rgba(244,238,227,.45);border-radius:999px;padding:.5em .95em;min-height:36px;cursor:pointer}
.pb-taste:hover,.pb-taste:focus-visible{border-color:#C9A25A;color:#fff}
.pb-taste:focus-visible{outline:2px solid #C9A25A;outline-offset:2px}
.pb-taste svg{width:12px;height:12px;fill:currentColor}
/* Bewegung reduzieren: keine Automatik, manuell scrollbare Reihe */
@media (prefers-reduced-motion:reduce){
  .pb-taste{display:none}
  .pb-band,.pb-band.laeuft{animation:none;transform:none}
  .pb-fenster{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#C9A25A transparent}
  .pb-fenster:focus-visible{outline:2px solid #C9A25A;outline-offset:-2px}
  .pb-karte{scroll-snap-align:center}
  .pb-band{padding-right:calc(var(--pb-w) * .126)}
}