/* Heft-Vorschau */
#modalGallery.bk-host{display:block!important;grid-template-columns:none!important;overflow:visible!important;padding:16px 0 8px!important;margin:0!important;height:auto!important;max-height:none!important;min-height:0!important;flex:0 0 auto!important;background:radial-gradient(ellipse at 50% 40%,#f8fafc,#e2e8f0)!important}
.modal-content .modal-details{min-width:260px;flex:1 1 300px}
.bk-wrap{display:flex;flex-direction:column;align-items:center;gap:14px;user-select:none;-webkit-user-select:none}
.bk-stage{position:relative;perspective:2200px;margin:0 auto}
.bk-stage.single{overflow:hidden;border-radius:4px}
.bk-book{position:absolute;top:0;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.7,.3,1)}
.bk-leaf{position:absolute;top:0;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.45,.05,.25,1);cursor:pointer}
.bk-leaf.flipped{transform:rotateY(-180deg)}
.bk-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff;overflow:hidden}
.bk-face img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.bk-front{border-radius:0 4px 4px 0;box-shadow:inset 18px 0 22px -16px rgba(0,0,0,.35),0 10px 30px rgba(0,0,0,.25)}
.bk-back{transform:rotateY(180deg);border-radius:4px 0 0 4px;box-shadow:inset -18px 0 22px -16px rgba(0,0,0,.35),0 10px 30px rgba(0,0,0,.25)}
.bk-back.blank{background:linear-gradient(90deg,#f3f1ea,#fbfaf6)}
.bk-leaf:first-child .bk-front{border-radius:3px 6px 6px 3px}
.bk-shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.12),rgba(255,255,255,0) 12%,rgba(255,255,255,0) 88%,rgba(0,0,0,.05))}
.bk-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:16px;background:rgba(255,255,255,.35);color:#1e293b;font-weight:700;font-size:clamp(12px,1.6vw,15px);line-height:1.35}
.bk-lock svg{width:38px;height:38px;padding:9px;border-radius:50%;background:#1e293b;color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.bk-nav{display:flex;align-items:center;gap:14px;font:600 14px/1 system-ui,-apple-system,sans-serif;color:#475569}
.bk-btn{width:42px;height:42px;border-radius:50%;border:0;background:#1e293b;color:#fff;font-size:20px;line-height:42px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.2);transition:transform .15s,opacity .2s}
.bk-btn:hover{transform:scale(1.08)}
.bk-btn:disabled{opacity:.3;cursor:default;transform:none}
.bk-hint{font:500 12px/1.4 system-ui,-apple-system,sans-serif;color:#64748b;text-align:center}
.bk-badge{position:absolute;left:10px;bottom:10px;background:rgba(15,23,42,.78);color:#fff;font:600 11px/1 system-ui,sans-serif;padding:6px 9px;border-radius:999px;backdrop-filter:blur(4px)}
@media (prefers-reduced-motion:reduce){.bk-leaf,.bk-book{transition:none}}
/* Heft mittig + Beschreibung mit Absaetzen */
#modalGallery.bk-host{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;align-self:stretch!important}
@media (min-width:769px){
.modal-content:has(#modalGallery.bk-host){overflow:hidden!important;max-height:92vh!important;align-items:stretch}
.modal-content:has(#modalGallery.bk-host) .modal-details{overflow-y:auto;max-height:92vh}
}
#modalDesc{white-space:normal!important;font-size:.95rem}
#modalDesc p{margin:0 0 .8em}
#modalDesc ul,#modalDesc ol{margin:0 0 .8em;padding-left:1.3em}
#modalDesc ul.dl{list-style:none;padding-left:.2em}
#modalDesc li{margin:.25em 0}
#modalDesc strong{color:var(--primary,#0f172a)}
.bundle-box{background:#f1f5f9;border-radius:12px;padding:.8rem 1rem;margin:0 0 1rem;color:#0f172a}
.bundle-box ul{margin:.4rem 0 0!important}
.dl-note{margin:0;font-size:.8rem;color:#64748b;text-align:center}
.preview-container{position:relative}
.bundle-tag{position:absolute;top:10px;left:10px;z-index:2;background:#1e293b;color:#fff;font:700 11px/1 system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;padding:6px 10px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.free-tag{background:#16a34a}
@media (min-width:900px){.modal-content:has(#modalGallery.bk-host){max-width:min(1180px,96vw)!important;width:min(1180px,96vw)!important}}
/* Titelbilder fuellen die Karte */
.preview-container img{transform:scale(var(--z,1));transform-origin:var(--o,50% 50%)}
.card:hover .preview-container img{transform:scale(calc(var(--z,1) * 1.06))}
/* Beschreibung schwarz */
#modalDesc,#modalDesc p,#modalDesc li{color:#000!important}
.card-description{color:#1a1a1a!important}
/* Zoom im Heft */
.bk-view{position:relative}
.bk-view.zoomed{overflow:hidden;cursor:grab;border-radius:10px}
.bk-view.dragging{cursor:grabbing}
/* Saubere Seiten: runde Ecken, kein grauer Rand, realistischer Schatten */
.bk-face{background:#fff}
.bk-front,.bk-leaf:first-child .bk-front{border-radius:3px 12px 12px 3px!important;box-shadow:0 1px 1px rgba(15,23,42,.06),0 2px 4px rgba(15,23,42,.07),0 6px 12px rgba(15,23,42,.08),0 14px 28px rgba(15,23,42,.10),0 28px 56px rgba(15,23,42,.10)!important}
.bk-back{border-radius:12px 3px 3px 12px!important;box-shadow:0 1px 1px rgba(15,23,42,.06),0 2px 4px rgba(15,23,42,.07),0 6px 12px rgba(15,23,42,.08),0 14px 28px rgba(15,23,42,.10),0 28px 56px rgba(15,23,42,.10)!important}
.bk-stage.single .bk-front{border-radius:12px!important}
.bk-shine{display:none!important}
.bk-face img{backface-visibility:hidden;-webkit-backface-visibility:hidden}
/* v3: alle Ecken rund, ein einziger sauberer Schatten */
.bk-front,.bk-back,.bk-leaf:first-child .bk-front,.bk-stage.single .bk-front{border-radius:12px!important;box-shadow:none!important}
.bk-face img{border-radius:12px}
.bk-stage.single{border-radius:12px}
.bk-view{position:relative}
.bk-stage{position:relative;z-index:1}
.bk-shadow{position:absolute;top:0;bottom:0;left:0;border-radius:12px;pointer-events:none;z-index:0;transition:left .7s cubic-bezier(.3,.7,.3,1),width .7s cubic-bezier(.3,.7,.3,1),opacity .3s;box-shadow:0 1px 2px rgba(15,23,42,.10),0 3px 6px rgba(15,23,42,.08),0 10px 20px rgba(15,23,42,.10),0 24px 48px rgba(15,23,42,.12)}
.bk-view.zoomed .bk-shadow{opacity:0}
/* v4: Lupe + gefuehrter Zoom (Handy: kein Mitzoomen der ganzen Seite) */
#imageModal{touch-action:pan-x pan-y}
.bk-view{touch-action:pan-y}
.bk-view.zoomed{touch-action:none;box-shadow:0 0 0 2px rgba(37,99,235,.35)}
.bk-btn.bk-zoom{margin-left:6px;display:flex;align-items:center;justify-content:center;background:#fff;color:#1e293b;border:1px solid #cbd5e1;box-shadow:0 2px 8px rgba(15,23,42,.10)}
.bk-btn.bk-zoom svg{width:20px;height:20px}
.bk-btn.bk-zoom.on{background:#2563eb;border-color:#2563eb;color:#fff}
.bk-hint{min-height:1.4em;padding:0 12px}
/* Touch-Geraete: kein haengender Hover-Zoom auf den Kacheln (sonst wird der Bildrand abgeschnitten) */
@media (hover:none){.card:hover{transform:none;box-shadow:var(--shadow-soft);border-color:rgba(226,232,240,.8)}.card:hover .preview-container img{transform:scale(var(--z,1))}}