/* ===================================================================
   Feature Card Grid
   Card styles come from ../_shared/feature-card.css (meta.json
   css_assets). This file only defines the grid the cards subgrid into.
   =================================================================== */

.pp-feature-card-grid {
  display: grid;

  /* Cards are at least 280px wide and flow onto as many per row as fit.
     min() keeps a single card from overflowing a narrower container. */
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));

  /* One track per card row. The pattern repeats for every wrapped row of
     cards, so icons, titles, descriptions and links line up across the
     whole grid. The 1fr track lets the description absorb slack. */
  grid-auto-rows: auto auto 1fr auto;

  /* Separates cards horizontally and vertically. Gaps *inside* a card
     come from the card's own row-gap, which overrides this one across
     the region it spans. */
  gap: var(--pp-grid-gap, 24px);

  /* Padding is not set here: the spacing field writes it inline. */
}

/* Without subgrid each card is a self-contained grid, so the parent
   needs one row track per card rather than four. */
@supports not (grid-template-rows: subgrid) {
  .pp-feature-card-grid {
    grid-auto-rows: auto;
  }
}