/* BTN STYLE */
.wp-block-button{
    & a {
        font-size: var(--wp--preset--font-size--l-text);
    }
    &.is-style-violet{
        & a{
            display: flex;
            position: relative;
            background: linear-gradient(-90deg, #5A48CE 0%, #5941bd33 100%);
            color: var(--wp--preset--color--white);
            overflow: hidden;
        }
        & a::before{
            content: "";
            display: flex;
            width: 0%;
            height: 100%;
            background: linear-gradient(-90deg, #5A48CE 0%, #5941bd33 100%);
            position: absolute;
            left: 0;
            top: 0;
            z-index: -1;
            opacity: 1;
            transition: all 0.6s ease-in-out;
        }
        & a:hover::before{
            width: 100%;
            opacity: 0;
        }
    }
    &.is-style-arrow{
        display: flex;
        width: fit-content;
        position: relative;
        & a{
            display: flex;
            position: relative;
            background: transparent;
            color: var(--wp--preset--color--white);
            overflow: hidden;
            padding: calc(0.667em + 2px) 3rem calc(0.667em + 2px) 5rem;

        }
    }
    &.is-style-arrow::before{
        display: flex;
        content: "";
        height: 3rem;
        width: 3rem;
        border-radius: 30px;
        border: 1px solid var(--wp--preset--color--white);
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        transition: all 0.6s ease-in-out;
    }
    &.is-style-arrow::after{
        display: flex;
        content: "";
        height: 18px;
        width: 18px;
        position: absolute;
        left: 1.5rem;
        top: 50%;
        transform: translate(-50%, -50%);
        transition: all 0.6s ease-in-out;
        background: url(../svg/btn-arrow-1.svg);
    }
    &.is-style-arrow:hover::before{
        width: 100%;
    }
    &.is-style-arrow:hover::after{
        left: 2.5rem;
        background: url(../svg/btn-arrow-1.svg);
    }
}
.is-style-transparent{
    margin-top: 2rem;
    padding: 1rem;
    border-radius: 40px;
    border: 2px solid rgba(81, 55, 212, 0.70);
    overflow: hidden;
    position: relative;
    background: transparent;
    backdrop-filter: blur(10px);
}
.is-style-transparent::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(81, 55, 212, 0) 0%, rgba(81, 55, 212, 0.7) 100%);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.6s ease;
}
.is-style-transparent:hover::before{
    transform: scaleX(1);
}
.is-style-transparent a{
    font-size: 16px;
    font-weight: 400;
    color: var(--wp--preset--color--blanc);
    position: relative;
    z-index: 1;
    background-color: transparent;
    border-width: 0;
    padding: 0.5rem;
}