/****************************
 * Image Grid
****************************/
.twc-image-grid {--ig-padding:32px;}
.twc-image-grid__inner {margin:calc(-1 * var(--ig-padding));}
.twc-image-grid__item {padding:var(--ig-padding); width:33.33%;}
.twc-image-grid:not(.pattern-1) .twc-image-grid__item-image img {transition:var(--twc-transition);}

/* fancybox */
.twc-image-grid__item a {display:block; overflow:hidden;}
.twc-image-grid__item a:before {background:#000; transition:var(--twc-transition); opacity:0; z-index:1; pointer-events:none;}
.twc-image-grid__item a:hover:before {opacity:.6;}
.twc-image-grid__item a:hover img {transform:scale(1.05);}

/* image size */
@media only screen and (min-width:541px) {
    .twc-image-grid__item.half {width:50%;}
}
.twc-image-grid__item.full {width:100%;}


/* image ratio */
.twc-image-grid__item.half .twc-image-grid__item-image {aspect-ratio:562/365;}
.twc-image-grid__item.third .twc-image-grid__item-image {aspect-ratio:354/260;}

/* custom for pattern 1 */
.twc-image-grid.pattern-1 {overflow:hidden;}
.twc-image-grid.pattern-1 .twc-image-grid__item-image {height:clamp(275px, 33.75vw, 486px);}

/* custom for pattern 6 */
.vc_row:first-child .has-red-square {margin-top:calc(-1 * var(--twc-spacing-75));}
.has-red-square {
    --ig-width-shape:69px;
    padding-top:var(--ig-width-shape); position:relative;
}
.has-red-square:before {
    content:""; display:block;
    width:var(--ig-width-shape); height:var(--ig-width-shape); background:var(--twc-color-primary);
    position:absolute; top:0; left:100%;
}

/* Title */
.twc-image-grid__item-image-alt {
    font-size:var(--twc-size-20); font-weight:500;
    width:100%; padding:0 20px;
    transform:translate(-50%, -50%) scale(.5); opacity:0;
    transition:var(--twc-transition);
}
.twc-image-grid__item-inner:hover .twc-image-grid__item-image-alt {transform:translate(-50%, -50%) scale(1); opacity:1;}


/****************************
 * Image Grid Responsive
****************************/
@media only screen and (max-width:1439px) {
    .has-red-square {--ig-width-shape:var(--twc-gap-container);}
    .vc_row:first-child .has-red-square {--twc-spacing-75:var(--twc-spacing-40);}
}

@media only screen and (max-width:1180px) {
    .twc-image-grid {--ig-padding:calc(var(--twc-gap-container) / 2);}

    /* custom for pattern 6 */
    .has-red-square {--ig-width-shape:60px;}
    .has-red-square:before {
        left:auto; right:calc(-1 * var(--twc-gap-container));
    }

}
@media only screen and (max-width:920px) {
    .twc-image-grid__item {width:50%;}
}
@media only screen and (max-width:540px) {
    .twc-image-grid__item {width:100%;}

    /* custom for pattern 6 */
    .has-red-square {--ig-width-shape:40px;}
}