.pxl-border-header:not(.pxl-nav-menu) {
    border-radius: 8px;

    &::before {
        position: absolute;
        content: '';
        width: 100%;
        height: calc(100% + 2px);
        border-radius: inherit;
        @include background-gradient-rotate(180deg, #e7e0ef, #a89dad);
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        mask-composite: exclude;
        padding: 3px;
        -webkit-mask:
            linear-gradient(#fff 0 0) content-box,
            linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        opacity: 0.94;
    }

    >div {
        &::before {
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            border-radius: inherit;
            @include background-gradient-rotate(90deg, rgba(206, 170, 240, 1) 0%, rgba(237, 237, 237, 0.999) 100%);
            opacity: 0.302;
        }

        &::after {
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            border-radius: inherit;
            box-shadow: inset 0 0 27px rgba(255, 255, 255, 1);
        }
    }
}

.pxl-counter- {
    @media (max-width: 580px) {
        .elementor-column {
            width: 100% !important;

            &:nth-child(1) {
                width: 50% !important;
                margin-bottom: 15px;
            }

            &:nth-child(2) {
                width: 50% !important;
                margin-bottom: 15px;
            }
        }
    }

    @media (max-width: 480px) {
        .elementor-column {
            width: 100% !important;

            &:nth-child(1) {
                width: 100% !important;
                margin-bottom: 15px;
            }

            &:nth-child(2) {
                width: 100% !important;
                margin-bottom: 15px;
            }
        }
    }

    @media (max-width: 360px) {
        .elementor-column {
            &:nth-child(1) {
                width: 100% !important;
            }

            &:nth-child(2) {
                width: 100% !important;
            }
        }

    }
}

.pxl-img-team-details {
    position: relative;
    z-index: 1;

    &::before {
        content: '';
        position: absolute;
        height: 82.8%;
        width: 100%;
        bottom: 0;
        left: 0;
        border-radius: 8px;
        background: radial-gradient(circle,
                #651288 0%,
                #4b1068 40%,
                #311248 70%,
                #1a1331 100%);
        z-index: -1;
        transition: background-size 0.6s ease, background-position 0.6s ease;
        background-size: 100% 100%;
        background-position: center;
    }
}

.pxl-img-max-width {
    width: 100%;
    height: 100%;

    * {
        height: 100%;
    }

    img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.pxl-box-career-page {
    position: absolute;
    z-index: 1;
    right: 15px;
    bottom: 15px;
    display: inline-flex;
    max-width: 496px !important;

    @media #{$max-sm} {
        position: unset;
    }
}

.pxl-counter-service {
    position: absolute !important;
    left: 90px !important;
    top: -758px;

    @media #{$max-md2} {
        position: relative !important;
        top: 0;
        left: 0 !important;
    }
}

.pxl-carousel-about-us {
    margin-top: -21px;
    margin-left: -46.7%;
    transform: rotate(-15.5deg);

    @media (max-width: 880px) {
        margin-top: 0;
        margin-left: 0;
        transform: rotate(0deg);
    }
}

.pxl-footer-opacity {
    &::before {
        position: absolute;
        content: '';
        width: 92.71%;
        height: 100%;
        background-color: #{'rgba(var(--secondary-color-rgb),0.251)'};
        bottom: 73px;
        left: 50%;
        border-radius: 0px 0px 60px 60px;
        z-index: -1;
        transform: translateY(-100px) translateX(-50%);
        animation: slideDown 0.5s forwards;
    }

    &::after {
        position: absolute;
        content: '';
        width: 83.99%;
        height: 100%;
        background-color: #{'rgba(var(--secondary-color-rgb),0.251)'};
        bottom: 51px;
        left: 50%;
        border-radius: 0px 0px 60px 60px;
        z-index: -1;
        transform: translateY(-100px) translateX(-50%);
        animation: slideDown 0.7s forwards;
    }

}

.pxl-text-blur {
    mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 10%, #000 40%, #000 50%, rgba(0, 0, 0, 0) 90%);
}

.pxl-blur-img-marquee {
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, #000 20%, #000 60%, rgba(0, 0, 0, 0) 90%);
}

.pxl-mix-blend-mode {
    mix-blend-mode: luminosity;
}

.pxl-flex-center {
    display: flex;
    justify-content: center;
}

.pxl-border-header-1-dark {
    filter: drop-shadow(0px 3px 10.5px rgba(132, 82, 182, 0.2));
    background-image: linear-gradient(92deg, rgba(148, 89, 205, 0.5019607843137254) 0%, rgba(138, 105, 169, 0.10196078431372547) 100%, rgba(138, 105, 169, 0.10196078431372547) 100%);
    border: 3px solid #362942;
    border-radius: 10px;
}

.pxl-max-width .elementor-widget {
    @media #{$max-sm} {
        max-width: 100% !important;
    }
}

.pxl-column-footer {
    @media (max-width:480px) {
        .elementor-column {
            width: 100% !important;
        }
    }

}

.pxl-column-footer1 {
    @media (max-width: 650px) {
        .elementor-column {
            width: 100% !important;
        }
    }

}

.pxl-logo-home-3-stk {
    position: relative !important;

    >div {
        &::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            border-radius: inherit;
            background: transparent;
            mask-composite: exclude;
            padding: 1px 1px 1px 0;
            -webkit-mask:
                linear-gradient(#fff 0 0) content-box,
                linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
        }
    }
}

.pxl-logo-home-3 {
    position: relative !important;

    >div {
        &::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            border-radius: inherit;
            @include background-gradient-button(90deg, $primary_color, #FF31AB, #FF6F05);
            mask-composite: exclude;
            padding: 1px 1px 1px 0;
            -webkit-mask:
                linear-gradient(#fff 0 0) content-box,
                linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
        }
    }
}

.pxl-menu-home3 {

    >div {
        position: relative !important;

        &::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            border-radius: inherit;
            @include background-gradient-button(90deg, $primary_color 0%, #FF31AB 2%, #FF6F05 100%);
            mask-composite: exclude;
            padding: 0 0 0 4px;
            -webkit-mask:
                linear-gradient(#fff 0 0) content-box,
                linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
        }
    }
}

.pxl-right-menu-home3 {
    position: relative !important;

    >div {
        &::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            border-radius: inherit;
            background: $primary_color;
            mask-composite: exclude;
            padding: 0 0 0 4px;
            -webkit-mask:
                linear-gradient(#fff 0 0) content-box,
                linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
        }
    }
}

.pxl-header-home3 {
    .pxl-menu-home3 {
        transform: translateX(35px);
    }

    @media (max-width: 1800px) {
        .pxl-left-menu-home3 {
            width: 55% !important;
        }
    }

    @media (max-width: 1730px) {
        .pxl-menu-home3 {
            width: 60% !important;
        }

        .pxl-right-menu-home3 {
            width: 40% !important;
        }

        .pxl-icon-text2.style-3 {
            .pxl-item--meta {
                display: none;
            }
        }

        .pxl-icon-text-home3 {
            >div {
                margin-right: 35px !important;
            }
        }
    }

    @media (max-width: 1600px) {
        .pxl-menu-home3 {
            width: 55% !important;
        }

        .pxl-right-menu-home3 {
            width: 45% !important;
        }

        .pxl-icon-text-home3 {
            >div {
                margin: 0 !important;
            }
        }

        .pxl-menu-home3 {
            >div {
                margin: 0px 0px 0px 200px !important;
            }

            li.menu-item {
                margin: 0px 0px 0px 35px !important;
            }
        }
    }

    @media (max-width: 1400px) {
        .pxl-menu-home3 {
            width: 62% !important;
        }

        .pxl-right-menu-home3 {
            width: 38% !important;
        }

        .pxl-icon-text-home3 {
            >div {
                margin: 0 !important;
            }
        }

        .pxl-menu-home3 {
            >div {
                margin: 0px 0px 0px 115px !important;
            }

            li.menu-item {
                margin: 0px 0px 0px 30px !important;
            }
        }
    }
}

.pxl-section-left {
    >div {
        margin-right: -15px !important;
    }
}

.pxl-border-animation {
    clip-path: inset(0 0 100% 0);
}

.pxl-border-gradien {
    position: relative;

    &::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        border-radius: inherit;
        @include background-gradient-button(0deg, var(--primary-color) 0%, var(--fourth-color) 49%, var(--third-color) 100%);
        mask-composite: exclude;
        padding: 0 0 0 1px;
        -webkit-mask:
            linear-gradient(#fff 0 0) content-box,
            linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
    }
}

/*slider*/
.pxl-heading--text-slider {
    padding: 64px !important;

    @media #{$max-md} {
        padding: 15px !important;
    }

    &::before {
        position: absolute;
        content: '';
        width: 864.31px;
        height: 668.849px;
        background-image: url(../img/group-box-text-slide.webp);
        bottom: 0;
        right: 0;
        background-repeat: no-repeat;
    }
}

///
/// 
.pxl-ss-slider {
    @media #{$max-sm} {
        .uranus {
            opacity: 0 !important;
            transition: all .3s;
        }

        &:hover {
            .uranus {
                opacity: 1 !important;
            }

        }
    }

    .uranus {
        width: 51px;
        height: 216px;

        &::before {
            position: relative;
            z-index: 2;
        }

        &.sr7-rightarrow {
            &::after {
                content: '';
                mask-image: url(../img/union-slide.png);
                mask-repeat: no-repeat;
                mask-size: cover;
                background-color: #FE7524;
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
            }
        }

        &.sr7-leftarrow {
            &::after {
                content: '';
                mask-image: url(../img/union-slide.png);
                mask-repeat: no-repeat;
                mask-size: cover;
                background-color: #FE7524;
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                transform: rotate(180deg);
            }
        }
    }
}

//
.pxl-before-header-h4 {
    position: relative !important;

    >div {
        &::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            inset: 0;
            clip-path: polygon(2.29% 0, 100% 0, 100% 62.5%, 97.71% 100%, 0 100%, 0 37.5%);
            background: #fff;
            z-index: -1;
        }
    }

    &::before {
        width: 69.6%;
        height: 100px;
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        border-radius: 1000px;
        background: linear-gradient(90deg, var(--primary-color) 0%, var(--fourth-color) 48.53%, var(--third-color) 100%), #FFF;
        z-index: -2;
    }
}

.pxl-ss-ttm-h4 {
    clip-path: polygon(15% 0, 100% 0, 100% 50%, 100% 100%, 0 100%, 0 17%);

    @media (max-width:880px) {
        clip-path: none;
    }
}

//////pxl-svg-h2
.pxl-svg-h2 {
    @media #{$max-xl} {
        right: -365px !important;
    }

    @media #{$max-lg3} {
        right: -425px !important;
    }
}

///
sr7-content {
    border-radius: 0 0 40px 40px !important;
    overflow: hidden;
}

.bg-light {
    position: relative;

    &::before {
        position: absolute;
        content: '';
        width: calc(100% + 30px);
        height: calc(40% + 30px);
        background: #fff;
        bottom: -30px;
        left: -30px;
        border-radius: 16px 0px 0px 16px;
        z-index: -1;

        @media #{$max-lg3} {
            height: calc(15% + 30px);
        }

        @media #{$max-sm} {
            display: none;
        }
    }
}

.bg-dark {
    position: relative;

    &::before {
        position: absolute;
        content: '';
        width: calc(100% + 30px);
        height: calc(40% + 30px);
        background: $heading_color;
        bottom: -30px;
        left: -30px;
        border-radius: 16px 0px 0px 16px;
        z-index: -1;

        @media #{$max-lg3} {
            height: calc(15% + 30px);
        }

        @media #{$max-sm} {
            display: none;
        }
    }
}


.pxl-bgr-h2 {
    position: relative;
    z-index: 1;

    &:before {
        z-index: 4;
        flex-shrink: 0;
        border-radius: 100%;
        opacity: 0.4;
        mix-blend-mode: luminosity;
        border: 1px solid #fff;
        rotate: 180deg;
        background: radial-gradient(60.42% 60.42% at 50.02% 60.42%, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.00) 69.42%, rgba(255, 255, 255, 0.08) 75.33%, rgba(255, 255, 255, 0.13) 80.42%, rgba(255, 255, 255, 0.31) 86.39%, rgba(255, 255, 255, 0.57) 92.19%, #FFF 100%);
        box-shadow: 0px -20px 40px 0px rgba(#fff, 0.6);
        width: 160%;
        height: 160%;
        position: absolute;
        content: '';
        bottom: 446px;
        right: 50%;
        z-index: -1;
        transform: translateX(-50%);

        @media #{$max-xl} {
            width: 200%;
            height: 200%;
        }

        @media #{$max-md2} {
            width: 298%;
            height: 298%;
            bottom: 306px;
        }

        @media (max-width: 880px) {
            display: none;
        }
    }
}

.pxl-heading-liner {
    .pxl-item--title {
        opacity: 0.36;
        background: linear-gradient(180deg, #F8B6BC 0%, #771A99 46.5%, #BD6FFD 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
}

.pxl-cricle-col {
    position: relative;

    &::before {
        content: '';
        position: absolute;
        inset: 0 0 -27px 0;
        -webkit-mask-image: url(../img/ellipse-1661.webp);
        -webkit-mask-size: contain;
        -webkit-mask-position: center center;
        -webkit-mask-repeat: no-repeat;
        background-color: #f1e2ff;
    }

    >div {
        -webkit-mask-image: url(../img/ellipse-1661.webp);
        -webkit-mask-size: contain;
        -webkit-mask-position: center center;
        -webkit-mask-repeat: no-repeat;

        @media #{$max-xxl} {
            width: 1850px;
            position: relative;
            left: 50%;
            transform: translateX(-50%);
            z-index: 5;
        }

        @media #{$max-lg} {
            width: 1650px;
        }

        @media #{$max-md2} {
            -webkit-mask-image: unset;
            width: 100%;
        }
    }
}

.pxl-cricle-col2 {
    position: relative;

    &::before {
        content: '';
        position: absolute;
        inset: 0 0 -27px 0;
        -webkit-mask-image: url(../img/ellipse-1661.webp);
        -webkit-mask-size: contain;
        -webkit-mask-position: center center;
        -webkit-mask-repeat: no-repeat;
        background-color: #3b3740;
    }

    >div {
        -webkit-mask-image: url(../img/ellipse-1661.webp);
        -webkit-mask-size: contain;
        -webkit-mask-position: center center;
        -webkit-mask-repeat: no-repeat;

        @media #{$max-xxl} {
            width: 1850px;
            position: relative;
            left: 50%;
            transform: translateX(-50%);
            z-index: 5;
        }

        @media #{$max-lg} {
            width: 1650px;
        }

        @media #{$max-md2} {
            -webkit-mask-image: unset;
            width: 100%;
        }
    }
}


.pxl-ft-heading {
    .pxl-heading--text {
        white-space: nowrap;
    }
}


.pxl-icon-border {
    
    .btn{
        position: relative;
        &::before {
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            padding:
            3px;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            border-radius:
            35px;
            -webkit-mask:
            linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                mask-composite: add, add;
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            background:
            rgba(255, 255, 255, 0.5);
                background-image: none;
            background-image: none;
            z-index: 2;
        }
    }
    
}

.pxl-image-mask{
    .pxl-item--image{
        position: relative;
        display: inline-block;
        --border-size: 16px;
        z-index: 1;
        .pxl-mask-image {
            position: absolute;
            inset: calc(var(--border-size) * -1);
            background-color: inherit;
            -webkit-mask-size: cover;
            mask-size: cover;
            -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
            -webkit-mask-position: center;
            mask-position: center;
            z-index: -1;
            pointer-events: none;
            background-color: #fff;
        }
    }
}