/* =============================================================================
   Page: /praxis/aerzteteam  (pages/praxis/aerzteteam.php)
   -----------------------------------------------------------------------------
   The nine portraits as a grid. The CARD is a module - modules/arzt.php and
   assets/css/modules/arzt.css - because the home page shows the same one in a
   dragged row; all this file does is lay the cards out.

   THE COLUMN COUNT IS BOUND BY A MINIMUM CARD WIDTH, not by what fits. The name
   and the role sit at 55 % of the card's height and the "mehr" button at its
   foot; under roughly 20rem the role wraps to three lines and runs into the
   button. So: one column up to 768px, two to 1024px, three above it - at every
   one of those steps a card is at least as wide as one in the row on the home
   page, which is where the caption was set.

   Three and no more, for a second reason: nine people are then three even rows,
   where a fourth column would leave a row of one.
   ============================================================================= */

.arzt-grid__head {
    margin-block-end: var(--space-2xl);
}

.arzt-grid {
    display: grid;
    gap: var(--space-md);
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
    .arzt-grid {
        gap: var(--space-lg);
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .arzt-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}