/* ─── Holzapfel – PDF-Flipbook ─── */

.hz-flipbook { padding: 80px 0; }

/* Standalone-Seite: Abstand zur fixierten Nav berücksichtigen */
.hz-flipbook-page { padding-top: calc(var(--nav-h) + 60px); min-height: 100vh; }

.fb-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  margin-top: 40px;
}

.fb-book {
  position: relative;
  width: 100%;
  max-width: 1000px;
  min-height: 460px;
  margin: 0 auto;
  background: var(--off);
  border: 1.5px solid var(--border);
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 14px 40px rgba(27, 54, 100, .06);
  transition: box-shadow var(--t);
  overflow: hidden;
}

.fb-book.is-ready { padding: 0; background: transparent; border: none; box-shadow: none; }
.fb-book.is-ready:hover { box-shadow: 0 20px 60px rgba(27, 54, 100, .12); }

/* Cover + Rückseite: Buch-Hover-Shadow deaktivieren – sonst glüht der Schatten
   über die Gesamtbreite (2 Seiten) und es wirkt wieder wie zwei Seiten */
.fb-book.is-first-page,
.fb-book.is-last-page,
.fb-book.is-first-page:hover,
.fb-book.is-last-page:hover { box-shadow: none !important; }

/* StPageFlip injiziert eigene Struktur – Schatten + Rundungen an die Seiten vererben */
.fb-book .stf__parent { border-radius: 8px; overflow: visible; }
.fb-book .stf__wrapper { border-radius: 8px; }
.fb-book .stf__block { transition: transform .6s cubic-bezier(.4, 0, .2, 1); }
.fb-book.is-first-page .stf__block { transform: translateX(-25%); }
.fb-book.is-last-page  .stf__block { transform: translateX( 25%); }

/* Cover + Rückseite: Spine-/Inner-Shadow entfernen – sonst wirkt es wie zwei Seiten */
.fb-book.is-first-page .stf__innerShadow,
.fb-book.is-last-page  .stf__innerShadow,
.fb-book.is-first-page .stf__hardInnerShadow,
.fb-book.is-last-page  .stf__hardInnerShadow,
.fb-book.is-first-page .stf__outerShadow,
.fb-book.is-last-page  .stf__outerShadow { opacity: 0 !important; }
.fb-book .page {
  background: #fff;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(27, 54, 100, .08);
}
.fb-book .page canvas,
.fb-book .page img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Loader / Progress */
.fb-loader {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  color: var(--body);
  font-size: .92rem;
  background: var(--off);
  border-radius: 12px;
  z-index: 2;
}
.fb-book.is-ready .fb-loader { display: none; }
.fb-spinner {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 3px solid rgba(29, 111, 164, .18);
  border-top-color: var(--blue);
  animation: fb-spin .9s linear infinite;
}
.fb-loader-prog { font-weight: 700; color: var(--blue); }

@keyframes fb-spin { to { transform: rotate(360deg); } }

/* Fehler-State */
.fb-book.has-error .fb-loader { background: #fff; color: #b42318; }
.fb-book.has-error .fb-spinner { display: none; }

/* Controls */
.fb-controls {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--off);
  border: 1.5px solid var(--border);
  border-radius: 50px;
  padding: 6px;
}

.fb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
  border: 1.5px solid var(--border);
  color: var(--navy);
  cursor: pointer;
  transition: all var(--t);
  padding: 0;
}
.fb-btn i { font-size: 1.25rem; line-height: 1; }
.fb-btn:hover:not(:disabled) { background: var(--blue); color: #fff; border-color: var(--blue); }
.fb-btn:disabled { opacity: .4; cursor: not-allowed; }

.fb-pagenum {
  min-width: 70px;
  text-align: center;
  font-size: .88rem;
  font-weight: 700;
  color: var(--navy);
  padding: 0 8px;
  font-variant-numeric: tabular-nums;
}

/* Download-Pill */
.fb-dl {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .82rem;
  font-weight: 700;
  color: var(--blue);
  background: rgba(29, 111, 164, .08);
  border: 1.5px solid rgba(29, 111, 164, .18);
  border-radius: 50px;
  padding: 9px 16px;
  text-decoration: none;
  transition: all var(--t);
}
.fb-dl:hover { background: var(--blue); color: #fff; border-color: var(--blue); }
.fb-dl i { font-size: 1rem; }

/* Fullscreen */
.hz-flipbook:fullscreen,
.hz-flipbook:-webkit-full-screen {
  background: var(--navy-dk);
  padding: 40px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hz-flipbook:fullscreen .wrap { max-width: 100%; padding: 0; }
.hz-flipbook:fullscreen .sh,
.hz-flipbook:fullscreen .sh-sub { display: none; }
.hz-flipbook:fullscreen .fb-book { max-width: min(1400px, 95vw); }
.hz-flipbook:fullscreen .fb-book .page { box-shadow: 0 10px 40px rgba(0, 0, 0, .4); }
.hz-flipbook:fullscreen .fb-controls { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); }
.hz-flipbook:fullscreen .fb-pagenum { color: #fff; }
.hz-flipbook:fullscreen .fb-btn { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); color: #fff; }
.hz-flipbook:fullscreen .fb-btn:hover:not(:disabled) { background: var(--blue-lt); border-color: var(--blue-lt); color: var(--navy-dk); }
.hz-flipbook:fullscreen .fb-dl { display: none; }

/* ═══════════════════════════════════════
   STANDALONE-SEITE: DUNKLES (NAVY) THEME
   Nav-Logo wird via theme_mod-Filter gegen das weiße Footer-Logo ersetzt.
   ═══════════════════════════════════════ */
body.hz-flipbook-body { background: var(--navy-dk); }
.hz-flipbook-page { background: var(--navy-dk); color: #fff; }

/* Section-Header auf dunklem Grund */
.hz-flipbook-page .sh h1,
.hz-flipbook-page .sh h2 { color: #fff; }
.hz-flipbook-page .sh-sub { color: rgba(255, 255, 255, .78); }
.hz-flipbook-page .ey {
  color: var(--blue-lt);
  background: rgba(123, 189, 212, .1);
  border-color: rgba(123, 189, 212, .25);
}
.hz-flipbook-page .acc { color: var(--blue-lt); }

/* Buch-Wrapper: auf dunklem BG keine eigene weiße Karte */
.hz-flipbook-page .fb-book { background: transparent; border: none; box-shadow: none; }
.hz-flipbook-page .fb-book.is-ready:hover { box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.hz-flipbook-page .fb-book.is-first-page:hover,
.hz-flipbook-page .fb-book.is-last-page:hover { box-shadow: none !important; }

/* Loader auf dunklem BG */
.hz-flipbook-page .fb-loader {
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .85);
}
.hz-flipbook-page .fb-loader-prog { color: #fff; }
.hz-flipbook-page .fb-spinner { border-color: rgba(255, 255, 255, .2); border-top-color: #fff; }

/* Controls + Download auf dunklem BG */
.hz-flipbook-page .fb-controls {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .15);
}
.hz-flipbook-page .fb-btn {
  background: rgba(255, 255, 255, .1);
  border-color: rgba(255, 255, 255, .15);
  color: #fff;
}
.hz-flipbook-page .fb-btn:hover:not(:disabled) {
  background: var(--blue-lt);
  border-color: var(--blue-lt);
  color: var(--navy-dk);
}
.hz-flipbook-page .fb-pagenum { color: #fff; }
.hz-flipbook-page .fb-dl {
  background: rgba(255, 255, 255, .1);
  color: #fff;
  border-color: rgba(255, 255, 255, .2);
}
.hz-flipbook-page .fb-dl:hover { background: #fff; color: var(--navy-dk); border-color: #fff; }

/* NAV-OVERRIDES für die Flipbook-Seite: Hintergrund transparent, Text + Button weiß */
.hz-flipbook-body .site-nav,
.hz-flipbook-body .site-nav.up {
  background: transparent !important;
  backdrop-filter: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.hz-flipbook-body .nl a { color: rgba(255, 255, 255, .8); }
.hz-flipbook-body .nl a:hover,
.hz-flipbook-body .nl .current a { color: #fff; }
.hz-flipbook-body .nl a::after { background: var(--blue-lt); }
.hz-flipbook-body .nav-btn {
  background: #fff;
  color: var(--navy-dk);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}
.hz-flipbook-body .nav-btn:hover {
  background: rgba(255, 255, 255, .92);
  color: var(--navy-dk);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
}
/* Hamburger im Glass-Look – Default-Background ist weiß, das würde auf dunklem Nav-Hintergrund verschwinden.
   `!important` analog zu den anderen site-nav-Overrides oben, damit der globale Default sicher überschrieben wird. */
.hz-flipbook-body .menu-toggle {
  background: rgba(255, 255, 255, .1) !important;
  border-color: rgba(255, 255, 255, .25) !important;
  box-shadow: none !important;
}
.hz-flipbook-body .menu-toggle:hover {
  background: rgba(255, 255, 255, .2) !important;
  border-color: rgba(255, 255, 255, .4) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .2) !important;
}
.hz-flipbook-body .menu-toggle .hamburger-line { background: #fff !important; }
/* Sprachumschalter auf dunklem Grund */
.hz-flipbook-body .lsw {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .15);
}
.hz-flipbook-body .lsw a { color: rgba(255, 255, 255, .75); }
.hz-flipbook-body .lsw a.on { background: #fff; color: var(--navy-dk); }

/* Responsive */
@media (max-width: 900px) {
  .hz-flipbook { padding: 60px 0; }
  .hz-flipbook-page { padding-top: calc(var(--nav-h) + 40px); }
  .fb-book { min-height: 380px; padding: 16px; }
  .fb-stage { gap: 22px; margin-top: 28px; }
}

@media (max-width: 480px) {
  .hz-flipbook { padding: 48px 0; }
  .hz-flipbook-page { padding-top: calc(var(--nav-h-scrolled, 68px) + 24px); }
  .fb-book { min-height: 320px; padding: 10px; border-radius: 10px; }
  .fb-btn { width: 40px; height: 40px; }
  .fb-pagenum { min-width: 60px; font-size: .82rem; }
  .fb-dl { font-size: .78rem; padding: 8px 14px; }
  .fb-stage { margin-top: 20px; }
}

/* Reduced motion: StPageFlip animations runter */
@media (prefers-reduced-motion: reduce) {
  .fb-spinner { animation: none; border-top-color: rgba(29, 111, 164, .18); }
  .fb-book .stf__parent * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .fb-book .stf__block { transition-duration: .01ms !important; }
}
