/* Shared storefront and manager preview styles. Real image corners stay visible. */
.sbb-carousel{width:100%;max-width:1080px;margin:40px auto;color:#eefaff;direction:rtl}
.sbb-stage,.sbb-preview{position:relative;aspect-ratio:3/2;overflow:hidden;border-radius:22px;background:#071923;isolation:isolate}
.sbb-slide{position:absolute;inset:0;display:block;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .45s ease;z-index:0;text-decoration:none;color:inherit}
.sbb-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:1}
.sbb-slide>img,.sbb-preview>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.sbb-slide:focus-visible{outline:3px solid #00eab1;outline-offset:-4px}
.sbb-caption{position:absolute;left:0;right:0;bottom:0;padding:clamp(10px,3vw,30px);background:linear-gradient(transparent,rgba(0,0,0,.8));pointer-events:none}
.sbb-caption h2{margin:0;color:white;font-size:clamp(16px,3vw,30px);line-height:1.4}
.sbb-caption p{margin:5px 0 0;color:white;font-size:clamp(12px,2vw,18px)}
.sbb-cta{position:absolute;display:inline-flex;align-items:center;justify-content:center;max-width:75%;padding:clamp(7px,1.3vw,14px) clamp(12px,2vw,24px);border-radius:999px;background:var(--cta-bg,#00b9db);color:var(--cta-fg,#fff);box-shadow:var(--cta-shadow,none);font:inherit;font-size:clamp(12px,1.7vw,18px);font-weight:700;line-height:1.6;overflow-wrap:anywhere;pointer-events:none;z-index:3}
.sbb-cta-top-right{top:5%;right:5%}.sbb-cta-top-left{top:5%;left:5%}
.sbb-cta-bottom-right{bottom:5%;right:5%}.sbb-cta-bottom-left{bottom:5%;left:5%}
.sbb-cta-center{top:50%;left:50%;transform:translate(-50%,-50%)}
.sbb-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0}
.sbb-controls[hidden]{display:none}
.sbb-neighbor{display:flex;align-items:center;gap:8px;padding:5px;border:1px solid #264654;border-radius:12px;background:#0b2430;color:#d8f5ff;font:inherit;cursor:pointer}
.sbb-neighbor>img{width:90px;height:60px;object-fit:contain;background:#06141c;border-radius:8px}
.sbb-neighbor>span{padding:0 5px;font-size:12px}
.sbb-pagination{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;min-width:0}
.sbb-dots{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;max-width:360px;gap:2px}
.sbb-dots button{display:grid;place-items:center;width:26px;height:30px;padding:0;background:transparent;border:0;cursor:pointer}
.sbb-dots button::before{content:'';width:8px;height:8px;border-radius:50%;background:#506b78}
.sbb-dots button[aria-current=true]::before{width:16px;border-radius:8px;background:#00e8b5}
.sbb-counter{font-size:12px;color:#b7cfda;white-space:nowrap}
.sbb-pause{border:1px solid #264654;border-radius:9px;background:#0b2430;color:#d8f5ff;padding:6px 10px;font:inherit;font-size:12px;cursor:pointer}
.sbb-controls button:focus-visible{outline:2px solid #00e8b5;outline-offset:3px}
@media(max-width:600px){.sbb-carousel{margin:24px auto}.sbb-stage{border-radius:16px}.sbb-neighbor{gap:2px}.sbb-neighbor>img{width:54px;height:36px}.sbb-neighbor>span{font-size:11px;padding:0 3px}.sbb-controls{gap:6px}.sbb-dots{max-width:130px}.sbb-pagination{gap:4px}.sbb-pause{padding:4px 6px}.sbb-counter{font-size:11px}}
@media(prefers-reduced-motion:reduce){.sbb-slide{transition:none}}

.sbb-cta[hidden],.sbb-preview>img[hidden],.bm-preview>img[hidden]{display:none}

/* Glass buttons retain the selected CTA tint and remain legible over photos. */
.sbb-cta{border:1px solid var(--cta-border,#a6efff70);background:linear-gradient(145deg,#ffffff28,#ffffff05 48%,#00152122),var(--cta-glass,#00b9db65);backdrop-filter:blur(12px) saturate(145%);-webkit-backdrop-filter:blur(12px) saturate(145%);text-shadow:0 1px 3px #00121eaa;box-shadow:var(--cta-shadow,0 5px 18px #003d5570)}
.sbb-neighbor,.sbb-pause{border:1px solid #b4edff45;background:linear-gradient(145deg,#ffffff20,#ffffff06),#0e35465c;backdrop-filter:blur(10px) saturate(135%);-webkit-backdrop-filter:blur(10px) saturate(135%);box-shadow:inset 0 1px 0 #ffffff25,0 5px 16px #00131d35;transition:background .2s,border-color .2s}
.sbb-neighbor:hover,.sbb-pause:hover{background:linear-gradient(145deg,#ffffff2b,#ffffff0a),#0e56666a;border-color:#72ebd880}
/* Caption occupies exactly the bottom 15%, independent of copy length or CTA. */
.sbb-caption{position:absolute;left:0;right:0;bottom:0;top:auto;height:15%;max-height:15%;min-height:0;box-sizing:border-box;padding:var(--sbb-strip-pad,2px) max(10px,var(--sbb-cta-space-right,0px)) var(--sbb-strip-pad,2px) max(10px,var(--sbb-cta-space-left,0px));overflow:hidden;isolation:isolate;pointer-events:none;background:linear-gradient(0deg,#011b2c9c,#013d4542 65%,transparent);border-top:1px solid #7adbcf12;opacity:1;animation:none}
.sbb-caption[hidden],.sbb-caption-title[hidden],.sbb-caption-desc[hidden]{display:none!important}
.sbb-caption-water{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;opacity:.85}
.sbb-caption-water svg{position:absolute;left:0;bottom:-4%;width:200%;height:115%;overflow:hidden;transform-box:border-box}
.sbb-wave-blue{fill:#003b656e}.sbb-wave-green{fill:#00ad7952}.sbb-wave-light{fill:#127d982b}
.sbb-caption-copy{position:relative;z-index:1;width:100%;height:100%;min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:var(--sbb-strip-gap,1px);padding:0;text-align:right;direction:rtl;text-shadow:0 2px 8px #001017bf}
.sbb-caption-title{margin:0!important;padding:0;color:#fff!important;font-size:var(--sbb-title-size,clamp(9px,2vw,28px))!important;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0;opacity:1}
.sbb-caption-desc{margin:0;padding:0;font-size:var(--sbb-desc-size,clamp(8px,1.3vw,18px));line-height:1.2;color:#edffff;min-width:0;flex-shrink:0;opacity:1}
.sbb-caption-desc-viewport{width:100%;overflow:hidden;white-space:nowrap}
.sbb-caption-desc-text{display:inline-block;vertical-align:top;max-width:none;white-space:nowrap}
.sbb-carousel.is-enhanced .sbb-slide:not(.is-caption-ready) .sbb-caption{visibility:hidden;opacity:1}
.sbb-slide.is-caption-ready .sbb-caption{visibility:visible}
/* Entrance never starts invisible, even while hover/focus has paused ongoing motion. */
.sbb-slide.is-active.is-caption-ready .sbb-caption-title,.bm-preview.is-caption-live .sbb-caption-title{animation:sbb-copy-in .3s ease-out both}
.sbb-slide.is-active.is-caption-ready .sbb-caption-desc,.bm-preview.is-caption-live .sbb-caption-desc{animation:sbb-copy-in .3s ease-out both}
.sbb-slide.is-active.is-caption-ready .sbb-wave,.bm-preview.is-caption-live .sbb-wave{animation:sbb-water-wave 8s linear 0s infinite;transform-origin:0 50%}
.sbb-slide.is-active.is-caption-ready .sbb-wave-green,.bm-preview.is-caption-live .sbb-wave-green{animation-duration:11s;animation-delay:-2s;animation-direction:normal}
.sbb-slide.is-active.is-caption-ready .sbb-wave-light,.bm-preview.is-caption-live .sbb-wave-light{animation-duration:6s;animation-delay:-4s}
.sbb-slide.is-active.is-caption-ready .has-overflow .sbb-caption-desc-text,.bm-preview.is-caption-live .has-overflow .sbb-caption-desc-text{animation:sbb-caption-scroll var(--sbb-scroll-duration,8s) linear 0s infinite alternate}
.sbb-motion-paused .sbb-wave{animation-play-state:paused!important}
.sbb-text-paused .sbb-caption-desc-text,.sbb-text-paused .sbb-caption-title-text{animation-play-state:paused!important}
@keyframes sbb-copy-in{from{opacity:1;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes sbb-water-wave{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes sbb-caption-scroll{from{transform:translateX(0)}to{transform:translateX(var(--sbb-scroll-distance,0px))}}
.bm-card .sbb-caption-desc-text{max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media(prefers-reduced-motion:reduce){
 .sbb-caption-title,.sbb-caption-desc,.sbb-caption-desc-text,.sbb-wave{animation:none!important;transform:none!important}
 .sbb-caption-desc-text{max-width:100%;overflow:hidden;text-overflow:ellipsis}
}
#bmPreview:not(.is-caption-live) .sbb-caption{visibility:hidden;opacity:1}
#bmPreview.is-caption-live .sbb-caption{visibility:visible}

.sbb-caption-title-text{display:inline-block;vertical-align:top;white-space:nowrap;max-width:none}
.sbb-slide.is-active.is-caption-ready .has-title-overflow .sbb-caption-title-text,.bm-preview.is-caption-live .has-title-overflow .sbb-caption-title-text{animation:sbb-caption-scroll var(--sbb-scroll-duration,8s) linear 0s infinite alternate}
.bm-card .sbb-caption-title-text{max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media(prefers-reduced-motion:reduce){.sbb-caption-title-text{animation:none!important;transform:none!important;max-width:100%;overflow:hidden;text-overflow:ellipsis}}
.sbb-caption.has-overflow .sbb-caption-desc-text,.sbb-caption.has-title-overflow .sbb-caption-title-text{animation-delay:0s!important}
.sbb-caption.has-title-overflow .sbb-caption-title{text-overflow:clip}

/* Player effects are chosen by the administrator; captions keep their own motion. */
.sbb-carousel[data-animation=none] .sbb-slide{transition:none}
.sbb-carousel[data-animation=slide] .sbb-slide.is-active{animation:sbb-enter-slide .45s ease-out both}
.sbb-carousel[data-animation=zoom] .sbb-slide.is-active{animation:sbb-enter-zoom .45s ease-out both}
@keyframes sbb-enter-slide{from{transform:translateX(6%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes sbb-enter-zoom{from{transform:scale(1.06);opacity:0}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.sbb-carousel .sbb-slide{transition:none!important;animation:none!important}}
