.action-card {
    border: solid 1px $pale-cyan;
    border-radius: .5rem;
    padding: 1.5rem;
    text-align: center;
    display: flex;
    text-align: center;
    justify-content: space-between;
    flex-direction: column;
    gap: 8px;

    &:hover {
        border-color: $primary;
        cursor: pointer;
    }

    &-image {
        padding: .625rem;

        svg {
            fill: $primary;
        }
    }

    &-info {
        // padding: .625rem;
        font-size: .85rem;
        font-weight: 400;
        line-height: 1.25rem;
        color: $grey-graphite;
        min-height: 60px;
    }

    &-link {
        display: flex;
        justify-content: end;

        button {
            display: inline-flex;
            align-items: center;
            padding: 0;
            margin: 0;
            gap: 8px;
            
            &:hover {
                color: $cyan;

                svg[class*=icon-] {
                    fill: $cyan;
                }
            }
        }
    }
}