.button-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    width: min(100%, 30rem);
    gap: 1rem;
}

.button-group .button {
    width: 100%;
    min-width: 0;
}

@media (max-width: 40rem) {
    .button-group {
        width: 100%;
        gap: 0.75rem;
    }

    .button-group .button {
        min-height: 3rem;
        padding-inline: 0.625rem;

        font-size: clamp(0.6875rem, 2.8vw, 0.8125rem);
        white-space: normal;
    }
}