/* The existing cutout showcase, with native scroll-controlled motion. */
#favoriten.pb-scroll-enabled{overflow:clip;overflow-anchor:none}
#favoriten.pb-scroll-pinned>.container{position:sticky;top:var(--pb-sticky-top,108px)}
.pb-scroll-enabled .bowlshow{--bs-h:clamp(190px,31svh,350px)}
.pb-motion-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  object-position:center bottom;pointer-events:none;opacity:0;transition:opacity .16s linear;
  filter:drop-shadow(0 18px 20px rgba(47,70,29,.18))}
.pb-scroll .bs-bowl>img{transition:opacity .16s linear}
.bs-bowl[data-pb-frame-ready]>.pb-motion-canvas{opacity:1}
.bs-bowl[data-pb-frame-ready]>img{opacity:0}
.pb-scroll-hint{display:none;text-align:center;color:var(--muted);font-size:.72rem;letter-spacing:.06em;margin:10px 0 0}
.pb-scroll .pb-scroll-hint{display:block}
.pb-scroll .bc-label,.pb-scroll .bc-line,.pb-scroll .bc-dot{
  --reveal:clamp(0,calc((var(--pb-callouts,0) - var(--pb-order,0)*.12)/.28),1);
  animation:none!important}
.pb-scroll .bc-line{stroke-dashoffset:calc(var(--len)*(1 - var(--reveal)));opacity:var(--reveal)}
.pb-scroll .bc-dot{opacity:var(--reveal);transform:scale(var(--reveal))}
.pb-scroll .bc-dot::after{animation:none!important}
.pb-scroll .bc-label{opacity:var(--reveal);transform:translateY(calc((1 - var(--reveal))*8px)) scale(calc(.9 + var(--reveal)*.1))}
@media(max-width:760px){
  .pb-scroll-enabled .bowlshow{--bs-h:clamp(190px,30svh,270px)}
  .pb-scroll-enabled .section-head{margin-bottom:20px}
  .pb-scroll-enabled .bs-panel{margin-top:14px}
  .pb-motion-canvas{filter:drop-shadow(0 14px 16px rgba(47,70,29,.20))}
}
@media(prefers-reduced-motion:reduce){
  #favoriten.pb-scroll-enabled{height:auto!important}
  #favoriten.pb-scroll-pinned>.container{position:relative;top:auto}
  .pb-motion-canvas,.pb-scroll-hint{display:none!important}
  .bs-bowl[data-pb-frame-ready]>img{opacity:1}
}

/* Keep the complete showcase readable while it follows the five scroll chapters. */
@media(min-width:761px) and (max-height:950px){
  .pb-scroll-enabled .bowlshow{--bs-h:clamp(170px,26svh,240px)}
  .pb-scroll-enabled .section-head{margin-bottom:20px}
  .pb-scroll-enabled .bs-controls{margin-top:18px}
  .pb-scroll-enabled .bs-panel{margin-top:14px}
  .pb-scroll-enabled .bs-info h3{font-size:1.9rem;margin:6px 0 8px}
  .pb-scroll-enabled .bs-desc{font-size:.94rem;line-height:1.5}
  .pb-scroll-enabled .bs-foot{margin-top:12px;gap:12px}
}
@media(max-width:760px){
  .pb-scroll-enabled .section-head{gap:8px;margin-bottom:12px}
  .pb-scroll-enabled .head-links{gap:8px;flex-wrap:nowrap}
  .pb-scroll-enabled .head-links .section-link{font-size:12px;gap:5px;padding:0;min-height:44px;white-space:nowrap}
  .pb-scroll-enabled .bowlshow{--bs-h:clamp(180px,26svh,230px)}
  .pb-scroll-enabled .bs-controls{margin-top:12px}
  .pb-scroll-enabled .pb-scroll-hint{margin-top:4px;font-size:.65rem;letter-spacing:.025em}
  .pb-scroll-enabled .bs-panel{margin-top:10px}
  .pb-scroll-enabled .bs-desc{font-size:14.5px;line-height:1.5}
  .pb-scroll-enabled .bs-foot{margin-top:8px;gap:8px}
}
@media(max-width:359px){
  .pb-scroll-enabled .head-links{flex-wrap:wrap;gap:0 8px}
}

/* Keep the controls reachable if browser chrome or a smaller window exposes
   less height. Only the sticky inset adapts; chapter/document geometry stays. */
@media (max-width:760px), (pointer:coarse){
  @supports (height:100dvh){
    #favoriten.pb-scroll-pinned>.container{
      top:min(var(--pb-sticky-top,88px),calc(100dvh - var(--pb-content-height,0px) - 12px));
    }
  }
}