.zs-banner{width:100%;min-width:0}.zs-banner[hidden],.zs-banner [hidden],[data-banner-fallback][hidden]{display:none!important}
.zs-banner-stage{width:100%;box-sizing:border-box;position:relative;aspect-ratio:var(--banner-ratio,3/1);overflow:hidden;border-radius:var(--radius,12px);background:var(--surface,#eee)}
.zs-banner-image{display:block;width:100%;height:100%;object-fit:cover}
.zs-banner-nav{position:absolute;bottom:12px;left:12px;right:12px;display:flex;align-items:center;justify-content:center;gap:8px}
.zs-banner-nav button,.zs-banner-nav span{background:#fff;color:#222;border:1px solid #bbb;border-radius:5px;padding:5px 10px}
.zs-banner-manage{padding:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px dashed var(--line,#888);border-radius:6px}
.zs-banner-manage label{display:flex;gap:8px;align-items:center}.zs-banner-manage small,.zs-banner-manage [data-status]{flex-basis:100%}
.zs-banner-manage input{max-width:100%}.zs-banner-manage button{cursor:pointer}
.zs-banner-link{position:absolute;inset:0;z-index:1}.zs-banner-link:focus-visible{outline:3px solid #fff;outline-offset:-5px}
.zs-banner-caption{position:relative;box-sizing:border-box;width:100%;margin-bottom:54px;padding:clamp(12px,3vw,36px);color:#fff;pointer-events:none;z-index:2}
.zs-banner-caption h2{color:inherit;margin:0 0 8px;font-size:clamp(18px,3vw,36px);line-height:1.2;overflow-wrap:anywhere}.zs-banner-caption p{margin:0 0 12px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.4;font-size:clamp(13px,1.5vw,18px)}
.zs-banner-caption .zs-banner-button{display:inline-block;padding:8px 16px;border-radius:6px;background:var(--brand,#087f68);color:var(--brand-ink,#fff);text-decoration:none;font-weight:700;pointer-events:auto;overflow-wrap:anywhere}
.zs-banner-nav{z-index:3}.zs-banner-stage:has(.zs-banner-caption:not([hidden])){min-height:220px}
.zs-banner-editor{flex-basis:100%;display:grid;gap:10px;padding-top:10px}.zs-banner-editor label{display:grid;gap:4px;min-width:0}.zs-banner-editor input,.zs-banner-editor textarea{box-sizing:border-box;width:100%;font:inherit;color:var(--ink,var(--text,#222));background:var(--surface,#fff);border:1px solid var(--line,#aaa);border-radius:5px;padding:8px}.zs-banner-editor textarea{resize:vertical}.zs-banner-manage button:disabled{cursor:default;opacity:.6}

.zs-banner-stage{display:flex;align-items:center}.zs-banner-image{position:absolute;inset:0}
.zs-banner-stage:has(.zs-banner-caption:not([hidden]))::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.05));z-index:1;pointer-events:none}

/* ---- ovládací prvky: šipky uprostřed po stranách, malá ikona pozastavení vpravo dole, počítadlo vlevo dole ---- */
.zs-banner-nav{inset:0;bottom:0;left:0;right:0;display:block;pointer-events:none;z-index:3}
.zs-banner-nav button,.zs-banner-nav span{pointer-events:auto;font:inherit}
.zs-banner-nav [data-prev],.zs-banner-nav [data-next]{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.88);color:#111;font-size:0;line-height:0;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.28);transition:background .15s,transform .15s,opacity .15s}
.zs-banner-nav [data-prev]{left:12px}.zs-banner-nav [data-next]{right:12px}
.zs-banner-nav [data-prev]::before,.zs-banner-nav [data-next]::before{content:"";position:absolute;left:50%;top:50%;width:11px;height:11px;border:solid currentColor;border-width:0 0 3px 3px;border-radius:1px}
.zs-banner-nav [data-prev]::before{transform:translate(-30%,-50%) rotate(45deg)}.zs-banner-nav [data-next]::before{transform:translate(-70%,-50%) rotate(-135deg)}
.zs-banner-nav [data-prev]:hover,.zs-banner-nav [data-next]:hover{background:#fff;transform:translateY(-50%) scale(1.06)}
.zs-banner-nav [data-pause]{position:absolute;right:12px;bottom:12px;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:0;line-height:0;cursor:pointer;backdrop-filter:blur(2px)}
.zs-banner-nav [data-pause]::before,.zs-banner-nav [data-pause]::after{content:"";position:absolute;top:50%;width:3px;height:12px;background:currentColor;transform:translateY(-50%);border-radius:1px}
.zs-banner-nav [data-pause]::before{left:10px}.zs-banner-nav [data-pause]::after{right:10px}
.zs-banner-nav [data-pause][data-state=paused]::after{display:none}
.zs-banner-nav [data-pause][data-state=paused]::before{left:11px;width:0;height:0;background:none;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent currentColor;border-radius:0}
.zs-banner-nav [data-pause]:hover{background:rgba(0,0,0,.8)}
.zs-banner-nav [data-count]{position:absolute;left:12px;bottom:12px;padding:3px 9px;border:0;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;line-height:18px}
.zs-banner-nav button:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px rgba(0,0,0,.6)}
@media(max-width:600px){.zs-banner-nav [data-prev],.zs-banner-nav [data-next]{width:36px;height:36px}.zs-banner-nav [data-prev]{left:6px}.zs-banner-nav [data-next]{right:6px}}

/* ---- typ PEEK (#BANNER_TYP=PEEK): aktivní banner uprostřed, sousední vykreslené po stranách ---- */
.zs-banner-peek .zs-banner-stage{aspect-ratio:auto;overflow:hidden;border-radius:0;background:none;display:block;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.zs-banner-peek .zs-banner-stage:active{cursor:grabbing}
.zs-banner-peek .zs-banner-image,.zs-banner-peek .zs-banner-link,.zs-banner-peek .zs-banner-caption:not(.is-below){display:none!important}
.zs-banner-peek .zs-banner-stage::before{display:none!important}
.zs-peek-track{display:flex;gap:var(--zs-peek-gap,14px);will-change:transform;transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.zs-peek-slide{position:relative;flex:0 0 var(--zs-peek-w,76%);aspect-ratio:var(--banner-ratio,3/1);display:block;overflow:hidden;border-radius:var(--radius,4px);background:var(--surface,#eee);opacity:.5;transition:opacity .35s;text-decoration:none;color:#fff}
.zs-peek-slide.is-active{opacity:1}
.zs-peek-slide img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.zs-peek-slide:focus-visible{outline:3px solid #111;outline-offset:-3px}
.zs-peek-caption{position:absolute;left:0;right:0;bottom:0;padding:clamp(10px,2.5vw,28px);background:linear-gradient(0deg,rgba(0,0,0,.65),rgba(0,0,0,0));display:flex;flex-direction:column;gap:4px}
.zs-peek-caption strong{font-size:clamp(16px,2.4vw,30px);line-height:1.2}
.zs-banner-peek .zs-banner-nav [data-prev]{left:max(10px,calc((100% - var(--zs-peek-w,76%)) / 4 - 22px))}
.zs-banner-peek .zs-banner-nav [data-next]{right:max(10px,calc((100% - var(--zs-peek-w,76%)) / 4 - 22px))}
.zs-banner-peek .zs-banner-nav [data-pause]{right:calc((100% - var(--zs-peek-w,76%)) / 2 + 12px)}
.zs-banner-peek .zs-banner-nav [data-count]{display:none}
@media(max-width:600px){.zs-banner-peek .zs-banner-nav [data-prev],.zs-banner-peek .zs-banner-nav [data-next]{display:none}}
@media(prefers-reduced-motion:reduce){.zs-peek-track,.zs-peek-slide,.zs-banner-nav button{transition:none}}

/* ---- text banneru ---- */
/* OVERLAY (STANDARD): text přes obrázek na ztmaveném podkladu, nejvýš 2 + 3 řádky, čitelný stín */
.zs-banner-caption:not(.is-below){max-width:min(720px,86%);text-shadow:0 1px 3px rgba(0,0,0,.55)}
.zs-banner-caption:not(.is-below) h2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zs-banner-caption:not(.is-below) p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.zs-banner-caption:not(.is-below) .zs-banner-button{color:var(--brand-ink,#fff);text-shadow:none;box-shadow:0 2px 8px rgba(0,0,0,.3)}
/* BELOW: text pod obrázkem (PEEK ve výchozím stavu), zarovnaný s levou hranou aktivního snímku */
.zs-banner-caption.is-below{position:static;display:block;box-sizing:border-box;width:100%;margin:12px 0 0;padding:0 clamp(4px,1vw,12px);color:var(--ink,#222);pointer-events:auto;z-index:auto}
.zs-banner-peek .zs-banner-caption.is-below{width:var(--zs-peek-w,76%);margin:14px auto 0;padding:0}
.zs-banner-caption.is-below h2{margin:0 0 6px;font-size:clamp(18px,2.2vw,28px);line-height:1.2;color:inherit}
.zs-banner-caption.is-below p{margin:0 0 12px;max-width:70ch;font-size:clamp(14px,1.3vw,16px);line-height:1.5;color:var(--muted,var(--ink,#444));white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.zs-banner-caption.is-below .zs-banner-button{padding:10px 20px;border-radius:var(--radius,8px);background:var(--brand,#087f68);color:var(--brand-ink,#fff);box-shadow:none;text-shadow:none}
@media(max-width:600px){.zs-banner-peek .zs-banner-caption.is-below{width:calc(100% - 24px);margin:12px auto 0}}
