/*********************************************
 * Link Grid
**********************************************/
.vii-link-grid {
    /* number of col and gap */
    --grid-col:1;--grid-gap-x:24px;--grid-gap-y:24px;
    --min-height-heading-block:calc((var(--vii-container) / 2 - 12px) * 680 / 660);
    --min-height-heading-block-inner:calc(var(--min-height-heading-block) * 506 / 680);

    /* variable for item left */
    --item-bg-inner:var(--vii-color-tertiary);
    --item-padding-inner:0px;
    --item-thumb-radius:0;
    --item-title-padding:16px 10px;
}
.vii-link-grid__items {--grid-gap-x:24px;--grid-gap-y:24px;}

/* layout grid and items no-heading */
.vii-link-grid.no-heading {
    --item-padding-inner:8px 8px 0px 8px;
    --item-thumb-radius:4px;
    --item-title-padding:30px 10px 22px;
}

/* heading block */
.vii-link-grid__heading-block {padding:var(--vii-gap-container);min-height:var(--min-height-heading-block);}
.vii-link-grid__heading-block-inner {
    max-width:455px;min-height:var(--min-height-heading-block-inner);padding:30px 50px 30px 30px;gap:32px;
}
/* items detail */
.vii-link-grid__item-inner {background-color:var(--item-bg-inner);padding:var(--item-padding-inner);}
.vii-link-grid__item-thumbnail {aspect-ratio:318/269;border-radius:var(--item-thumb-radius);}
.vii-link-grid__item-title {padding:var(--item-title-padding);transition:all .4s ease;}

/*hover, focus*/
.vii-link-grid__item-inner:focus-visible {border-radius:8px;}
.vii-link-grid__item-inner:focus .vii-link-grid__item-title,
.vii-link-grid__item-inner:hover .vii-link-grid__item-title {color:var(--vii-color-orange);}

/* Custom bg gray */
.vii-bg-light-gray .vii-link-grid,
.vii-bg-tertiary .vii-link-grid {--item-bg-inner:var(--vii-color-white);}


/*********************************************
 * Responsive Link Grid
**********************************************/
@media screen and (min-width:1025px) {
    .vii-link-grid,
    .vii-link-grid__items {--grid-col:2;}
    .no-heading .vii-link-grid__items {--grid-col:4;}
}

@media screen and (max-width:1180px) {
    .vii-link-grid,
    .vii-link-grid__items {
        --grid-gap-x:var(--vii-gap-container);
        --grid-gap-y:var(--vii-gap-container);
    }
}

@media screen and (max-width:1024px) {
    .vii-link-grid__items {width:100%;}

    /* heading block */
    .vii-link-grid__heading-block {min-height:clamp(420px, 50vw, 500px)}
    .vii-link-grid__heading-block-inner {
        padding:var(--vii-gap-container);max-width:390px;
        aspect-ratio:455 / 506;min-height:unset;
    }
}

@media screen and (max-width:768px) {
    /* Custom bg gray */
    .vii-bg-light-gray .vii-link-grid,
    .vii-bg-tertiary .vii-link-grid {
        --item-title-padding:var(--vii-gap-container) 10px var(--vii-gap-container);;
    }
}

@media screen and (max-width:480px) {
    .vii-link-grid__heading-block-inner {max-width:100%;}
}