arrow

MINOR: [Docs] Make cards on index page of docs responsive (#38693)


### Rationale for this change

The text inside the Specifications and Development cards in the docs get squished on mobile or small-viewport devices because their CSS grid definition isn't responsive. Example:

![arrow apache org_docs_(iPhone SE)](https://github.com/apache/arrow/assets/563/a38faf2a-fb8c-4390-a57c-9ee1d6c33a25)

### What changes are included in this PR?

This changes this specific use of the [`grid-item`](https://sphinx-design.readthedocs.io/en/latest/grids.html) directive to take advantage of the responsive variant,

> or four numbers for extra-small (<576px), small (768px), medium (992px) and large screens (>1200px),

For the extra-small variant, the grid dynamically switches to a single-column which prevents squishing of the text inside the card. Otherwise a two-column grid is used.

### Are these changes tested?

Yes, I built the docs in a local conda env and tested that the cards look right at all widths. At narrow widths, it looks like this:

![devd io_8000_(iPhone XR)](https://github.com/apache/arrow/assets/563/fe417e7f-92b2-42d9-ab74-d242c7c6acae)

### Are there any user-facing changes?

Just to docs, see above.

Authored-by: Bryce Mecum <petridish@gmail.com>
Signed-off-by: AlenkaF <frim.alenka@gmail.com>