.cyber{
    padding: 3px 15px;
    font-size: 16px;
    background: linear-gradient(45deg, transparent 5%,#BE1DF1 5%, #4251F6); /* altere a cor aqui */
    border: 0;
    color: #fff;
    cursor: pointer;
}

.cyber .elementor-button::after{
    --slice-0: inset(50% 50% 50% 50%);
    --slice-1: inset(80% -6px 0 0);
    --slice-2: inset(50% -6px 30% 0);
    --slice-3: inset(10% -6px 85% 0);
    --slice-4: inset(40% -6px 43% 0);
    --slice-5: inset(80% -6px 5% 0);
    content: "BOTÃO CYBER"; /* altere o texto aqui */
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, transparent 5%,#BE1DF1 5%, #4251F6); /* altere a cor aqui */
    clip-path: var(--slice-0)
}

.cyber .elementor-button:hover::after{
    animation: 1s glitch;
    animation-timing-function: steps(2,end);
}

@keyframes glitch{
    0%{
        clip-path: var(--slice-1);
        transform: translate(-20px,-10px)
    }

    10%{
        clip-path: var(--slice-3);
        transform: translate(10px,10px)
    }

    20%{
        clip-path: var(--slice-1);
        transform: translate(-10px,10px)
    }

    30%{
        clip-path: var(--slice-3);
        transform: translate(0,5px)
    }

    40%{
        clip-path: var(--slice-2);
        transform: translate(-5px,0)
    }

    50%{
        clip-path: var(--slice-3);
        transform: translate(5px,0)
    }

    60%{
        clip-path: var(--slice-4);
        transform: translate(5px,10px)
    }

    70%{
        clip-path: var(--slice-2);
        transform: translate(-10px,10px)
    }

    80%{
        clip-path: var(--slice-5);
        transform: translate(20px,-10px)
    }

    90%{
        clip-path: var(--slice-1);
        transform: translate(-10px,0)
    }

    100%{
        clip-path: var(--slice-1);
        transform: translate(0)
    }
}