.button {
    display: inline-block;
    padding: var(--button-padding);

    text-decoration: none;
    color: var(--primary-dark);
    font-weight: bold;
    border: 2px solid var(--primary-dark);
    border-radius: var(--radius);

    background: linear-gradient(
        to right, 
        var(--primary-dark) 0%, 
        var(--primary-dark) 100%
        ) no-repeat;
    background-size: 0% 100%;
    background-position: left bottom;

    transition: background-size 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.button:hover {
    background-size: 100% 100%;
    color: white;
}

.button-wrapper {
    display: flex;
    justify-content: flex-end;
}