.btn1 {
    position: relative;
    padding: 10px 20px;
    border-radius: 7px;
    border: 1px solid rgb(46, 125, 50); /* green border */
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 2px;
    background: transparent;
    color: #2b3b2b; /* darker green text */
    overflow: hidden;
    box-shadow: 0 0 0 0 transparent;
    transition: background-color 180ms ease-in, box-shadow 220ms ease-in, color 180ms ease-in;
}
.btn1 span {
    position: relative;
    z-index: 1;
    color: inherit;
}
.btn1:hover {
    background: rgb(46, 125, 50); /* green background on hover */
    color: #fff;
    box-shadow: 0 0 30px 6px rgba(46, 125, 50, 0.28); /* subtle green glow */
    transition: background-color 160ms ease-out, box-shadow 220ms ease-out, color 160ms ease-out;
}

.btn1:hover::before {
    animation: sh02 0.5s 0s linear;
}

.btn1::before {
    content: '';
    display: block;
    width: 0px;
    height: 86%;
    position: absolute;
    top: 7%;
    left: 0%;
    opacity: 0;
    background: rgba(255,255,255,0.6);
    box-shadow: 0 0 50px 30px rgba(255,255,255,0.6);
    transform: skewX(-20deg);
}

@keyframes sh02 {
    from { opacity: 0; left: 0%; }
    50% { opacity: 1; }
    to { opacity: 0; left: 100%; }
}

.btn1:active {
    box-shadow: 0 0 0 0 transparent;
    transition: box-shadow 0.12s ease-in;
}