/* Silver Home Banner Carousel v3 */
.shbc-wrap,.shbc-wrap *{box-sizing:border-box}
.shbc-wrap{
    --shbc-max-width:1320px;
    --shbc-height:360px;
    --shbc-center-width:86%;
    --shbc-radius:18px;
    --shbc-blue:#3294ff;
    --shbc-blue2:#1e7ef0;
    width:min(100%,var(--shbc-max-width));
    max-width:var(--shbc-max-width);
    margin:0 auto 22px;
    padding:12px 0 0;
    overflow:hidden;
    font-family:inherit;
}

.shbc-viewport{
    position:relative;
    width:100%;
    height:calc(var(--shbc-height) + 22px);
    overflow:hidden;
}

.shbc-track{
    position:relative;
    width:100%;
    height:var(--shbc-height);
    overflow:visible;
}

.shbc-slide{
    position:absolute;
    top:0;
    left:50%;
    display:block;
    width:var(--shbc-center-width);
    height:var(--shbc-height);
    border-radius:var(--shbc-radius);
    overflow:hidden;
    background:#f3f5fa;
    box-shadow:0 9px 18px rgba(23,33,52,.08);
    transform:translate3d(-50%,0,0) scale(.84);
    opacity:0;
    pointer-events:none;
    text-decoration:none;
    transition:transform .46s ease,opacity .36s ease,filter .36s ease,box-shadow .36s ease;
    will-change:transform,opacity;
}

.shbc-img{
    display:block;
    width:100%;
    height:100%;
    border-radius:inherit;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    overflow:hidden;
}

.shbc-slide:after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:linear-gradient(180deg,rgba(20,28,45,.02),rgba(20,28,45,.08));
    pointer-events:none;
}

.shbc-slide.is-active{
    z-index:4;
    opacity:1;
    transform:translate3d(-50%,0,0) scale(1);
    pointer-events:auto;
    filter:none;
    box-shadow:0 10px 22px rgba(23,33,52,.09);
}

.shbc-slide.is-prev{
    z-index:2;
    opacity:.33;
    transform:translate3d(calc(-50% - 42%),0,0) scale(.82);
    pointer-events:auto;
    filter:saturate(.75);
}

.shbc-slide.is-next{
    z-index:2;
    opacity:.33;
    transform:translate3d(calc(-50% + 42%),0,0) scale(.82);
    pointer-events:auto;
    filter:saturate(.75);
}

.shbc-slide.is-far-left{
    z-index:1;
    opacity:0;
    transform:translate3d(calc(-50% - 78%),0,0) scale(.76);
}

.shbc-slide.is-far-right{
    z-index:1;
    opacity:0;
    transform:translate3d(calc(-50% + 78%),0,0) scale(.76);
}

.shbc-arrow{
    position:absolute;
    z-index:8;
    top:calc(var(--shbc-height) / 2);
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    padding:0;
    border:0;
    border-radius:50%;
    background:linear-gradient(135deg,var(--shbc-blue),var(--shbc-blue2));
    color:#fff;
    font-size:32px;
    line-height:1;
    font-weight:500;
    cursor:pointer;
    transform:translateY(-50%);
    box-shadow:0 8px 16px rgba(50,148,255,.18);
    transition:filter .16s ease, transform .16s ease;
}

.shbc-arrow:hover{
    filter:brightness(1.04);
    transform:translateY(calc(-50% - 1px));
}

.shbc-prev{
    left:calc((100% - var(--shbc-center-width)) / 2 + 14px);
}

.shbc-next{
    right:calc((100% - var(--shbc-center-width)) / 2 + 14px);
}

.shbc-dots{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-top:-8px;
}

.shbc-dot{
    position:relative;
    width:40px;
    height:6px;
    padding:0;
    border:0;
    border-radius:999px;
    overflow:hidden;
    background:#e4e8f1;
    cursor:pointer;
}

.shbc-dot span{
    position:absolute;
    inset:0 auto 0 0;
    width:0;
    border-radius:inherit;
    background:linear-gradient(135deg,var(--shbc-blue),var(--shbc-blue2));
}

.shbc-dot.is-active span{
    width:100%;
    transition:width linear;
}

.shbc-empty{
    width:min(100%,1320px);
    margin:0 auto;
    padding:12px 14px;
    border:1px solid #e8d8e4;
    border-radius:8px;
    background:#fff7fb;
    color:#6b4b60;
    font-weight:700;
}

@media(max-width:1024px){
    .shbc-wrap{
        --shbc-height:300px;
        --shbc-center-width:88%;
        --shbc-radius:16px;
    }

    .shbc-slide.is-prev{
        transform:translate3d(calc(-50% - 44%),0,0) scale(.82);
    }

    .shbc-slide.is-next{
        transform:translate3d(calc(-50% + 44%),0,0) scale(.82);
    }
}

@media(max-width:767px){
    .shbc-wrap{
        --shbc-height:210px;
        --shbc-center-width:calc(100% - 24px);
        --shbc-radius:14px;
        padding-top:8px;
    }

    .shbc-viewport{
        height:calc(var(--shbc-height) + 18px);
    }

    .shbc-slide.is-prev{
        opacity:.16;
        transform:translate3d(calc(-50% - 92%),0,0) scale(.86);
    }

    .shbc-slide.is-next{
        opacity:.16;
        transform:translate3d(calc(-50% + 92%),0,0) scale(.86);
    }

    .shbc-arrow{
        width:38px;
        height:38px;
        font-size:28px;
    }

    .shbc-prev{
        left:12px;
    }

    .shbc-next{
        right:12px;
    }

    .shbc-dots{
        margin-top:-6px;
        gap:6px;
    }

    .shbc-dot{
        width:30px;
    }
}

@media(prefers-reduced-motion:reduce){
    .shbc-slide,.shbc-arrow,.shbc-dot span{transition:none!important}
}



/* v3.0.1 - force faded side preview banners to keep rounded corners */
.shbc-slide,
.shbc-slide.is-prev,
.shbc-slide.is-next,
.shbc-slide.is-far-left,
.shbc-slide.is-far-right{
    border-radius:var(--shbc-radius)!important;
    overflow:hidden!important;
    clip-path:inset(0 round var(--shbc-radius))!important;
    -webkit-mask-image:-webkit-radial-gradient(white, black)!important;
}

.shbc-slide .shbc-img,
.shbc-slide.is-prev .shbc-img,
.shbc-slide.is-next .shbc-img,
.shbc-slide.is-far-left .shbc-img,
.shbc-slide.is-far-right .shbc-img{
    border-radius:inherit!important;
    overflow:hidden!important;
}

.shbc-slide::after,
.shbc-slide.is-prev::after,
.shbc-slide.is-next::after{
    border-radius:inherit!important;
}
