/* ======================== Group Css Start =============================== */
.group {
    &:hover {
        .group-hover-text {
            &-white {
                color: hsl(var(--white)) !important;
            }
            &-main-600 {
                color: var(--main-600) !important;
            }
            &-main-two-600 {
                color: var(--main-two-600) !important;
            }
            &-yellow {
                color: hsl(var(--yellow)) !important;
            }
            &-heading {
                color: var(--heading-color) !important;
            }
        }
        .group-hover-bg {
            &-white {
                background-color: hsl(var(--white)) !important;
                background: hsl(var(--white)) !important;
            }
            &-main-600 {
                background-color: var(--main-600) !important;
            }
            &-main-two-600 {
                background-color: var(--main-two-600) !important;
            }
        }
    }
    &-hover-text-transition {
        transition: inherit;
    }
}



.tw-invisible {
    visibility: hidden;
}
.group-item  {
    &:hover {
        .group-hover-item-visible {
            visibility: visible;
        }
        .group-hover-item-opacity-1 {
            opacity: 1 !important;
        }
        .group-hover-item-mt-0 {
            margin-top: 0;
        }
        .group-hover-item-scale-12 {
            transform: scale(1.2);
        }
        .group-hover-item-scale-1 {
            transform: scale(1);
        }
        .group-hover-item-translate-x-0 {
            transform: translateX(0);
        }
        .group-hover-item-d-block {
            display: block !important;
        }
        .group-hover-item-d-none {
            display: none !important;
        }
        .group-hover-item-text-invert {
            filter: brightness(0) invert(1);
        }
    }
}
/* ======================== Group Css End =============================== */