.button-list a {
    &.dark {
        --background: #2F3545;
        --shadow: 0 2px 8px -1px #{rgba(#151924, .32)};
        --shadow-hover: 0 4px 20px -2px #{rgba(#151924, .5)};
    }
    &.white {
        --background: #fff;
        --text: #275efe;
        --shadow: 0 2px 8px -1px #{rgba(#121621, .04)};
        --shadow-hover: 0 4px 20px -2px #{rgba(#121621, .12)};
    }
    &.fast {
        --duration: .32s;
    }
}

.button-list a {
    --background:#03EDAE;
    --text:#fff;
    --font-size: 15px;
    --duration: .44s;
    --move-hover: -4px;
    --shadow: 0 2px 8px -1px #{rgba(#275efe, .32)};
    --shadow-hover: 0 4px 20px -2px #{rgba(#275efe, .5)};
    --font-shadow: var(--font-size);
    padding: 18px 30px;
    line-height: var(--font-size);
    border-radius: 24px;
    display:inline-block;
    outline: none;
    appearance: none;
    border: none;
    text-decoration: none;
    font-size: var(--font-size);
    letter-spacing: .5px;
    background: var(--background);
    color: var(--text);
    box-shadow: var(--shadow);
    transform: translateY(var(--y)) translateZ(0);
    transition: transform var(--duration) ease, box-shadow var(--duration) ease;
    div {
        display: flex;
		justify-content:center;
        overflow: hidden;
        text-shadow: 0 var(--font-shadow) 0 var(--text);
        span {
            display: block;
            backface-visibility: hidden;
            font-style: normal;
            transition: transform var(--duration) ease;
            transform: translateY(var(--m)) translateZ(0);
            $i: 1;
            @while $i < 12 {
                &:nth-child(#{$i}) {
                    transition-delay: $i / 20 + s;
                }
                $i: $i + 1;
            }
        }
    }
    &:hover {
        --y: var(--move-hover);
        --shadow: var(--shadow-hover);
        span {
            --m: calc(var(--font-size) * -1);
        }
    }
    &.reverse {
        --font-shadow: calc(var(--font-size) * -1);
        &:hover {
            span {
                --m: calc(var(--font-size));
            }
        }
    }
}