/****************************
 * Icon Description
****************************/
.vii-icon-description {--icon-size:70px;}

/* grid layout */
/* default 4 items */
.vii-icon-desc-grid {--icon-size:80px;}
.vii-icon-desc-grid .vii-icon-description__inner {
    --grid-col:2;
    --grid-gap-x:0px;
    --grid-gap-y:0px;

    max-width:1064px;
}
.vii-icon-desc-grid .vii-icon-description__item {
    margin-bottom:24px;padding-bottom:24px;
    border-bottom:1px solid var(--vii-color-light-gold);
}
.vii-icon-desc-grid .vii-icon-description__item-inner {
    margin-left:auto;margin-right:auto;
    max-width:468px;
    padding:32px 24px 56px;
}
.vii-icon-desc-grid .vii-icon-description__item::after {
    content:"";
    position:absolute;
    width:1px; height:calc(100% - 24px);
    top:0;right:0;
    background-color:var(--vii-color-light-gold);
}
.vii-icon-description .vii-icon-description__image {margin-bottom:24px;}


/* more than 4 items */
.vii-icon-desc-grid.more-4-items .vii-icon-description__inner {
    --grid-col:3;
    --grid-gap-x:0px;--grid-gap-y:0px;

    max-width:unset;margin-left:auto;margin-right:auto;
}
.vii-icon-desc-grid.more-4-items .vii-icon-description__item-inner {
    max-width:93.89%;
    margin:auto;
    padding:0 20px;
}

/* List layout */
.vii-icon-desc-list {--icon-size:64px;}
.vii-icon-desc-list .vii-icon-description__inner {
    --grid-col:1;
    --grid-gap-x:0px;
    --grid-gap-y:0px;
}
.vii-icon-desc-list .vii-icon-description__item-inner {
    max-width:520px;margin-left:auto;margin-right:auto;
}
.vii-icon-desc-list .vii-icon-description__item:not(:last-child) .vii-icon-description__item-inner {
    margin-bottom:30px;padding-bottom:30px;
}
.vii-icon-desc-list .vii-icon-description__item:not(:last-child) .vii-icon-description__item-inner::after {
    content:"";
    position:absolute;
    width:100%; max-width:320px;height:2px;
    bottom:0; left:50%;
    transform:translateX(-50%);
    background:var(--vii-color-linear-gold);
}
.vii-icon-desc-list .vii-icon-description__item-content {
    max-width:380px;
}

/* image */
.vii-icon-description__image {
    width:var(--icon-size);height:var(--icon-size);
    font-size:var(--icon-size);
}


/****************************
 * Icon Description Responsive
****************************/
@media only screen and (min-width:769px) {
    /* 4 items last item and number of items is even then item before last item. */
    .vii-icon-desc-grid:not(.more-4-items) .vii-icon-description__inner:has(>:nth-child(even)) .vii-icon-description__item:nth-last-child(2),
    .vii-icon-desc-grid:not(.more-4-items) .vii-icon-description__item:last-child {
        border-bottom:none; margin-bottom:0;
    }
    .vii-icon-desc-grid:not(.more-4-items) .vii-icon-description__item:is(:nth-child(2n), :last-child)::after {
        content:unset;
    }
    /* more than 4 items */
    /* case last row has 3 items, or 2 items or 1 item */
    .vii-icon-desc-grid.more-4-items .vii-icon-description__inner:has(>:last-child:nth-child(3n + 3)) .vii-icon-description__item:nth-last-child(-n + 3),
    .vii-icon-desc-grid.more-4-items .vii-icon-description__inner:has(>:last-child:nth-child(3n + 2)) .vii-icon-description__item:nth-last-child(-n + 2),
    .vii-icon-desc-grid.more-4-items .vii-icon-description__inner:has(>:last-child:nth-child(3n + 1)) .vii-icon-description__item:last-child {
        border-bottom:none; margin-bottom:0;
    }
    .vii-icon-desc-grid.more-4-items .vii-icon-description__item:is(:nth-child(3n), :last-child)::after {
        content:unset;
    }
}
@media only screen and (min-width:481px) and (max-width:768px) {
    .vii-icon-desc-grid .vii-icon-description__inner,
    .vii-icon-desc-grid.more-4-items .vii-icon-description__inner {
        --grid-col:2;
    }
    .vii-icon-desc-grid .vii-icon-description__item-inner {padding-bottom:32px;}

    .vii-icon-desc-grid .vii-icon-description__item:last-child,
    .vii-icon-desc-grid .vii-icon-description__inner:has(>:last-child:nth-child(even)) .vii-icon-description__item:nth-last-child(2) {
        border:none;
    }
    .vii-icon-desc-grid .vii-icon-description__item:last-child::after,
    .vii-icon-desc-grid .vii-icon-description__item:nth-child(even)::after {
        content:unset;
    }
}
@media only screen and (max-width:480px) {
    .vii-icon-description {--icon-size:60px;}
    .vii-icon-description__inner {--grid-gap-x:16px;--grid-gap-y:48px;}
    .vii-icon-description__item {gap:20px;}

    .vii-icon-desc-grid .vii-icon-description__inner,
    .vii-icon-desc-grid.more-4-items .vii-icon-description__inner {
        --grid-col:1;
    }
    .vii-icon-desc-grid .vii-icon-description__item:last-child {border:none;}
    .vii-icon-desc-grid .vii-icon-description__item::after {content:unset;}
}
@media only screen and (min-width:1700px) {
    .vii-icon-description {--icon-size:4vw;}
    .vii-icon-description__inner {
        --grid-gap-x:calc(var(--vii-100vw) * 0.016);
        --grid-gap-y:calc(var(--vii-100vw) * 0.016);
    }
}