/*********************************************
 * Metrics Slider
**********************************************/
.vii-metrics-slider {
    --item-w:clamp(350px, 37.85vw, 545px);
    --item-lr-padding:24px;
    --item-offset-left:0px;
    --item-offset-right:0px;
    /* fix cls */
    min-height:calc(var(--item-w) * (357 / 545));
}

/* vii-metrics-slider__image */
.vii-metrics-slider__image_inner {aspect-ratio:545/357;}
.vii-metrics-slider__image {
    width:calc(var(--item-w) + var(--item-lr-padding) + var(--item-offset-left) + var(--item-offset-right));
    padding-left:calc(var(--item-offset-left) + (var(--item-lr-padding) / 2));
    padding-right:calc(var(--item-offset-right) + (var(--item-lr-padding) / 2));
}
.vii-metrics-slider__image:first-child {
    --item-offset-left:calc(var(--vii-gap-side) - (var(--item-lr-padding) / 2));
}
.vii-metrics-slider__image:last-child:not(:first-child) {
    --item-offset-right:calc(var(--vii-gap-side) - (var(--item-lr-padding) / 2));
}


/*********************************************
 * Responsive Metrics Slider
**********************************************/
@media only screen and (max-width:1024px) {
    .vii-metrics-slider {--item-lr-padding:var(--vii-gap-container);}
}
@media only screen and (max-width:480px) {
    .vii-metrics-slider {--item-w:84vw;}
}