.st-button {
    margin-top: 20px;
    text-decoration: none;

    padding: 20px;
    position: relative;
    overflow: hidden;
    border-color: #d8d8d8;
    border-width: 1px;
    border-style: none;
    border-radius: 40px;

    background-color: rgb(0, 0, 0);
    transition: background-color 0.2s;
}

.st-button > span {
    font-weight: bold;
    font-size: 18;
    color: #d8d8d8;
}

.st-button:hover {
    cursor: pointer;
}

.st-button:active {
    background-color: rgb(39, 39, 39);
}

.st-button::after {
    content: "";
    position: absolute;
    background: rgba(224, 224, 224, 0.2);
    top: -50px;
    height: 160px;
    left: -80%;
    transform: rotate(30deg);
    width: 100px;
    transition: left 0.2s ease-in;
}

.st-button:hover::after {
    left: 140%;
    transition: left 0.2s ease-in;
}

.st-button:focus-visible::after {
    left: 140%;
    transition: left 0.2s ease-in;
}