/*********************************************
 * Home Banner
**********************************************/
/* dots */
.vii-home-banner .flickity-page-dots {
    position:absolute; top:50%; left:var(--vii-spacing-gap-container);
    transform:translateY(-50%); width:67px;
    display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
}
.vii-home-banner .flickity-page-dots .dot {
    background:none; border-radius:0; display:flex; align-items:center;
    margin:0; width:100%; height:22px;
    transition:all .4s ease;
}
.vii-home-banner .flickity-page-dots .dot:before {
    content:""; width:12px; height:2px;
    background:#fff; display:block;
    transition:all .4s ease;
}
body .vii-home-banner .flickity-page-dots .dot:where(.is-selected, :hover) {background:none;}
.vii-home-banner .flickity-page-dots .dot:hover:before {width:20px;}
.vii-home-banner .flickity-page-dots .dot.is-selected:before {width:100%;}
@media only screen and (max-width:768px) {
    /* dots */
    .vii-home-banner .flickity-page-dots {
        top:74vw; right:unset;
        left:50%; bottom:auto; transform:translateX(-50%);
        min-height:32px; flex-direction:row; gap:5px;
        width:auto;
    }
    .vii-home-banner .flickity-page-dots .dot {width:15px;}
    .vii-home-banner .flickity-page-dots .dot.is-selected {width:30px;}
    .vii-home-banner .flickity-page-dots .dot:before {width:100%;}
}

/*********************************************
 * Home Banner > Slide
**********************************************/
/* image */
/*.vii-home-banner__slide-media.-image {transition:transform 10s ease;}*/
/*.vii-home-banner__slide:not(.is-selected) .vii-home-banner__slide-media.-image {transform:scale(1.1);}*/


/*********************************************
 * Home Banner Responsive
**********************************************/
@media only screen and (max-width:768px) {
    /* dots */
    .vii-home-banner .flickity-page-dots {
        top:unset; right:unset;
        left:50%; bottom:30px; transform:translateX(-50%);
        flex-direction:row;
    }

    /* content */
    .vii-home-banner__slide-content br {/* display:none; */}
}

/*********************************************
 * Home Banner Animation: sticky and scale up on scroll
**********************************************/
.vii-home-banner {
    position:relative; top:0;
    --scroll-progress:0.2;
    --scale:clamp(1, calc((var(--scroll-progress) * 0.1) + 1), 1.1);
}
.site-content { background:var(--vii-color-bg);}
.vii-home-banner__slide-media.-image img {object-position:center calc(50% + var(--scroll-progress) * 50%)}

@media only screen and (min-width:769px) {
    /*.vii-home-banner__slide-media.-image img {transition:transform 3s ease, opacity .8s ease;}*/
    /*.vii-home-banner__slide:not(.is-selected) .vii-home-banner__slide-media.-image img {transform:scale(1.1);}*/
    /*body:not(.page-loaded) .vii-home-banner__slide-media.-image img {opacity:0;}*/
}