/*********************************************
 * Blog Slider
**********************************************/
/* slider items */
.vii-blog-slider__items {
    --item-offset-left-right:var(--vii-gap-side);
    --item-lr-padding:48px;
    --item-w:clamp(350px, 34.72vw, 500px);
}
.vii-blog-slider:not(.slider-loop) .vii-blog-slider__items {margin:0 calc(-1 * var(--item-lr-padding) / 2);}

/* vii-blog-item */
.vii-blog-item {
    width:calc(var(--item-w) + var(--item-lr-padding));
    padding:0 calc(var(--item-lr-padding) / 2);
}
.vii-blog-item:not(:last-child),
.vii-blog-slider.slider-loop .vii-blog-slider__items.is-draggable .vii-blog-item:last-child {
    border-right:1px solid rgba(0, 0, 0, .15);
}
.vii-blog-slider:not(.slider-loop) .vii-blog-item:first-child {
    width:calc(var(--item-w) + var(--item-offset-left-right) + var(--item-lr-padding));
    padding-left:calc(var(--item-lr-padding) / 2 + var(--item-offset-left-right));
}
.vii-blog-slider:not(.slider-loop) .vii-blog-item:last-child:not(:first-child) {
    width:calc(var(--item-w) + var(--item-offset-left-right) + var(--item-lr-padding));
    padding-right:calc(var(--item-lr-padding) / 2 + var(--item-offset-left-right));
}

/* follower style */
.vii-blog-slider__items:not(.is-draggable) + [data-mouse-follower].follower--active {opacity:0;visibility:hidden;z-index:-1;}


/* fix CLS */
.vii-blog-slider__items {
    min-height:calc(var(--item-w) * (313 / 500) + 24px/* mb of image */ + 105px /* content */);
}

/*********************************************
 * Blog Slider - Responsive
**********************************************/
@media only screen and (min-width:1700px) {
    .vii-blog-slider__items {
        --item-w:35vw;
    }
}
@media only screen and (max-width:1180px) {
    .vii-blog-slider__items {--item-lr-padding:calc(2 * var(--vii-gap-container));}
}
@media only screen and (max-width:1024px) {
    .vii-blog-slider__items {--item-lr-padding:var(--vii-gap-container);}
}
@media only screen and (max-width:480px) {
    .vii-blog-slider__items {
        --item-w:80%;
    }
}