/****************************
 * Restaurant Item
****************************/
/* Item */
.vii-restaurant-item {
    --y-spacing:140px; --x-spacing:180px;
    --banner-width:79%;
}
.vii-restaurant-item:not(:last-child) {margin-bottom:var(--vii-spacing-100);}

/* Image */
.vii-restaurant-item__images {padding-bottom:var(--y-spacing);}
.vii-restaurant-item__thumbnail-bg {aspect-ratio:480/657;}

/* Banner Image */
.vii-restaurant-item__image-banner {width:var(--banner-width); left:calc(100% - var(--x-spacing));}
.vii-restaurant-item__image-banner-bg {aspect-ratio:381/263; border:10px solid #fff;}

/* Logo */
.vii-restaurant-item__logo-bg {width:41%; transform:translate(-50%, -50%);}
.vii-restaurant-item__logo-bg:before {border:2px solid #fff; border-radius:50%;}


/********************************
 * Restaurant Item - Position
*********************************/
@media only screen and (min-width:769px) {
    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__inner {flex-direction:row-reverse;}
    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__info-inner {margin-left:unset;}
    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__info {padding-right:var(--vii-gap-container); padding-left:0;}
    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__image-banner {right:calc(100% - var(--x-spacing)); left:unset;}

}
@media only screen and (max-width:768px) {
    .vii-restaurant-list .vii-restaurant-item__inner {gap:var(--vii-spacing-40);}
    .vii-restaurant-list .vii-restaurant-item__inner {flex-direction:column;}

    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__images {align-self:flex-end;}
    .vii-restaurant-list .vii-restaurant-item:nth-child(odd) .vii-restaurant-item__image-banner {right:calc(100% - var(--x-spacing)); left:unset;}
}

/********************************
 * Restaurant Item - Responsive
*********************************/
@media only screen and (max-width:1024px) {
    /* Image */
    .vii-restaurant-item {
        --y-spacing:115px; --x-spacing:140px;
        --banner-width:82%;
    }
    .vii-restaurant-item__image-banner-bg {border:8px solid #fff;}
}
@media only screen and (min-width:769px) {
    /* Layout */
    .vii-restaurant-item__info {width:51%; padding-left:var(--vii-gap-container);}
    .vii-restaurant-item__images {width:49%;}

    /* Info */
    .vii-restaurant-item__info {padding-bottom:30%;}
    .vii-restaurant-item__info-inner {max-width:403px; margin-left:auto;}

    /* Title */
    .vii-restaurant-item__title {max-width:320px;}
}
@media only screen and (max-width:768px) {
    /* Layout */
    .vii-restaurant-item__info {width:100%;}
    .vii-restaurant-item__images {width:70%;}

    /* Item */
    .vii-restaurant-item {
        --y-spacing:15%; --x-spacing:35%;
        --banner-width:80%;
    }

    /* bottom spacing */
    .vii-restaurant-item:not(:last-child) {margin-bottom:var(--vii-spacing-100);}
}