.baner-anh-component{max-width:980px;margin:18px auto;padding:8px}.baner-title{font-weight:700;margin-bottom:8px;font-size:18px;color:#222}.baner-viewport{position:relative;overflow:hidden;border-radius:16px;border:1px solid #e0e0e0;background:#fbfcfd;padding:12px}.baner-stack{position:relative;height:360px;min-height:180px}.baner-stack .stack-item{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;visibility:hidden;pointer-events:none;border-radius:12px;overflow:hidden;transform-origin:center center;transition:transform 700ms cubic-bezier(.2,.9,.2,1),opacity 700ms cubic-bezier(.2,.9,.2,1),filter 700ms cubic-bezier(.2,.9,.2,1);box-shadow:0 6px 22px rgb(10 10 10 / .04)}.baner-stack .stack-item img{width:100%;height:100%;object-fit:cover;display:block}.baner-stack .stack-item.visible{opacity:1;visibility:visible;pointer-events:auto;z-index:5}.stack-item.effect1{transform:scale(1.06);filter:brightness(.98)}.stack-item.effect1.visible{transform:scale(1);filter:none}.stack-item.effect2{transform:translateX(12%)}.stack-item.effect2.visible{transform:translateX(0)}.stack-item.effect3{transform:scale(1.18)}.stack-item.effect3.visible{transform:scale(1)}.stack-item.effect4{transform:rotateY(40deg) scale(.98);backface-visibility:hidden}.stack-item.effect4.visible{transform:rotateY(0deg) scale(1)}.stack-item.effect5{filter:blur(8px) saturate(.9) contrast(.98) scale(1.04)}.stack-item.effect5.visible{filter:none;transform:scale(1)}.stack-item.effect6{transform:rotate(6deg) scale(.98) translateY(4%)}.stack-item.effect6.visible{transform:rotate(0deg) scale(1) translateY(0)}.stack-item.effect7{transform:skewX(8deg) scale(1.02)}.stack-item.effect7.visible{transform:skewX(0deg) scale(1)}.baner-controls{position:absolute;right:18px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:6}.baner-controls .num{width:44px;height:44px;border-radius:50%;background:linear-gradient(180deg,#00aaff,#0077aa);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;cursor:pointer;box-shadow:0 6px 18px rgb(0 0 0 / .12);transition:transform 450ms cubic-bezier(.2,.9,.2,1)}.baner-controls .num.active{transform:rotateY(180deg);box-shadow:0 8px 24px rgb(0 0 0 / .18)}.baner-prev,.baner-next{position:absolute;top:50%;transform:translateY(-50%);background:#fff0;border:0;font-size:36px;line-height:1;cursor:pointer;z-index:7;opacity:.9;padding:6px;border-radius:8px}.baner-prev{left:12px}.baner-next{right:84px}@media (max-width:768px){.baner-stack{height:220px}.baner-controls{right:8px}.baner-next{right:56px}}