.card {
    background: linear-gradient(
        to bottom right, 
        var(--card-gradient-start), 
        var(--card-gradient-end)
    );
    border: 1px solid var(--card-border-color);
    box-shadow: 2px 2px 4px var(--card-shadow-color);
    border-radius: 8px;
    padding: 16px;
    cursor: pointer;
    transition: background 0.15s, border 0.15s;
}

.card:hover {
    background: linear-gradient(
        to bottom right, 
        var(--card-hover-background), 
        var(--card-gradient-end)
    );
}

.card a {
    grid-column: 1 / 2;
    color: var(--card-link-color);
    text-decoration: none;
    font-size: 1.25rem;
    font-weight: bold;
    align-self: center;
}

.card-link {
    display: block;
    text-decoration: none;
}

.card a:last-child {
    grid-column: 3 / 4;
    justify-self: end;
    align-self: center;
}
