/*--------------------------------------------------------------
# Service
--------------------------------------------------------------*/
.pxl-service-grid-layout1 {
    .pxl-item--inner {
        position: relative;
        display: -webkit-box;display: -ms-flexbox;display: flex;
        -webkit-box-align: center;-ms-flex-align: center;align-items: center;
        background-color: #F2F6FE;
        padding: 40px 50px 43px;
        gap: 10px 35px;
        overflow: hidden;
        @include border-radius(30px);
        @include transition(all 300ms ease-in-out);
        @media #{$max-xxl} {
            padding: 40px 37px 43px;
        }
        @media #{$max-xs} {
            -ms-flex-wrap: wrap;flex-wrap: wrap;
        }
        &:hover {
            .item--title {
                color: $secondary_color;
            }
            .item--icon {
                i {
                    color: $secondary_color;
                }
                .logo-01 {
                    opacity: 0;
                }
                .logo-02 {
                    opacity: 1;
                }
            }
        }
    }
    .item--icon {
        position: relative;
        -webkit-box-flex: 0;-ms-flex: none;flex: none;
        margin-bottom: 10px;
        z-index: 1;
        @media #{$max-xs} {
            width: 100%;
        }
        .item--overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: $secondary_color;
            pointer-events: none;
            mix-blend-mode: hue;
        }
        i {
            color: $primary_color;
            font-size: 70px;
            @include transition(all 300ms ease-in-out);
        }
        img {
            width: 70px;
            height: 70px;
            object-fit: cover;
            -webkit-filter: none !important;filter: none !important;
            @include transition(all 300ms ease-in-out);
        }
        .logo-02 {
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
        }
    }
    .item--title {
        position: relative;
        margin-bottom: 0;
        z-index: 1;
        @extend .pxl-h4-size;
        @media #{$max-xs} {
            width: 100%;
        }
        a {
            color: inherit;
        }
    }
    .direction-element {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0%;
        left: 0%;
        background-color: $primary_color;
        pointer-events: none;
        opacity: 0;
        @include border-radius(30px);
    }
}
.pxl-post-layout-service-2, .pxl-service-carousel1 {
    .pxl-item--inner {
        padding: 49px;
        border: 1px solid rgba(26, 26, 26, 0.10);
        @include border-radius(30px);
        @media #{$max-xs} {
            padding: 49px 29px;
        }
    }
    .item--icon {
        margin-bottom: 42px;
        @media #{$max-lg} {
            margin-bottom: 32px;
        }
        img {
            width: 70px;
            height: 70px;
        }
    }
    .item--featured {
        img {
            max-height: 151px;
            object-fit: cover;
        }
    }
    .item--title {
        @extend .pxl-h4-size;
        a {
            color: inherit;
            &:hover {
                color: $primary_color;
            }
        }
    }
    .item--excerpt {
        margin-bottom: 43px;
    }
    .item--button {
        padding: 7px 24px;
        min-width: 140px;
        margin-top: 50px;
    }
}

