#promosi .promo-current-grid{display:block}
#promosi .promo-main-title{text-align:center;color:#102f54;font-size:clamp(28px,3.2vw,44px);font-weight:700;line-height:1.15;margin:0 0 28px}
#promosi .promo-carousel{--visible:3;--gap:22px;min-width:0}
#promosi .promo-viewport{overflow:hidden;padding:12px 0 22px;touch-action:pan-y}
#promosi .promo-gallery{display:flex;gap:var(--gap);transition:transform .55s cubic-bezier(.22,.61,.36,1);will-change:transform}
#promosi .promo-gallery-card{flex:0 0 calc((100% - (var(--visible) - 1)*var(--gap))/var(--visible));min-width:0;aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;padding:8px;border:1px solid #e1e7ef;border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 7px 18px #102f5412;cursor:zoom-in}
#promosi .promo-gallery-card img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;border-radius:10px}
#promosi button:focus-visible{outline:3px solid #167a9a;outline-offset:3px}
#promosi .promo-controls{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:4px}
#promosi .promo-prev,#promosi .promo-next{width:42px;height:42px;border:1px solid #dce4ee;border-radius:50%;background:#fff;color:#102f57;font-size:28px;cursor:pointer}
#promosi .promo-dots{display:flex;gap:5px;align-items:center}
#promosi .promo-dot{width:24px;height:32px;padding:0;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}
#promosi .promo-dot:after{content:"";width:7px;height:7px;border-radius:50%;background:#cbd5e1;transition:background .2s}
#promosi .promo-dot[aria-current="true"]:after{background:#102f57;width:9px;height:9px}
#promosi .promo-pause{border:0;background:transparent;color:#102f57;font:inherit;font-size:13px;cursor:pointer;padding:10px}
@media(max-width:1000px){#promosi .promo-carousel{--visible:2;--gap:18px}}
@media(max-width:600px){#promosi .promo-carousel{--visible:1;--gap:16px}#promosi .promo-controls{gap:10px}}
@media(prefers-reduced-motion:reduce){#promosi .promo-gallery{transition:none}}
#promosi .promo-lightbox{padding:0;border:0;border-radius:12px;background:transparent;max-width:96vw;max-height:94dvh;overflow:visible}
#promosi .promo-lightbox::backdrop{background:rgba(3,12,25,.86)}
#promosi .promo-lightbox img{display:block;max-width:94vw;max-height:90dvh;width:auto;height:auto;object-fit:contain;border-radius:10px}
#promosi .promo-lightbox-close{position:absolute;right:8px;top:8px;width:44px;height:44px;border:1px solid #d8e2ec;border-radius:50%;background:#fff;color:#102f54;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 3px 12px #0003}
