/* child-pages — reuses card-grid wholesale.
 *
 * The block carries BOTH .cgrid and .cpages so every card-grid rule applies
 * unchanged and this file only has to say what differs: the card grid is
 * built for exactly three posts, while a parent page can have four or five
 * children.
 */

.cpages__list {
  /* auto-fit rather than a fixed 3, because a parent can have anywhere from
   * one child to five.
   *
   * The min is 13.5rem for an arithmetic reason, not a visual one. Content is
   * 1280 at a 1440 viewport and the gap is --space-sm (~24px), so the widest
   * min that still fits FIVE across is (1280 - 4*24) / 5 = 236px. At the 17rem
   * (272px) it started with, auto-fit could only fit four and the fifth child
   * of What Sets Us Apart was orphaned on its own row. 13.5rem = 216px leaves
   * headroom and still caps at five, since six would need 1416. */
  gap: var(--space-sm);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.5rem), 1fr));
}

/* A sub-page title is a navigation label, not a headline — it should not
 * out-shout the h2 above it. */
.cpages .cgrid__title { font-size: var(--step-0); font-weight: var(--fw-bold); }

/* A parent with ONE child would otherwise get a single card stretched across
 * the full 1640. Cap it; browsers without :has() simply keep the old
 * behaviour, which is ugly rather than broken. */
.cpages__list:has(> :only-child) {
  grid-template-columns: minmax(0, 24rem);
}

/* -- partner-roll, grid layout ------------------------------------------
 * NOT FROM THE HANDOFF. The mockup only has the carousel, which is right for
 * Home and About where the logos are supporting evidence. On the Client List
 * page the logos ARE the content, so they all show at once.
 *
 * Overrides the carousel's flex track without touching partner-roll.css, which
 * stays byte-identical to the handoff.
 */
/* The carousel lays .proll__inner out as two columns — heading left, track
 * right (measured 379px + 837px). In grid mode the logos want the full width
 * beneath the heading, so the inner collapses to one column. */
.proll--grid .proll__inner {
  grid-template-columns: 1fr;
  gap: var(--space-md);
}
.proll--grid .proll__head { grid-column: 1 / -1; }

.proll--grid .proll__viewport { display: block; }
.proll--grid .proll__track {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 9.5rem), 1fr));
  gap: var(--space-md);
  transform: none;
  overflow: visible;
}
.proll--grid .proll__item {
  flex: none;
  width: auto;
  display: grid;
  place-items: center;
}
.proll--grid .proll__item img {
  width: 100%;
  height: auto;
  max-height: 5rem;
  object-fit: contain;
}

/* -- Card body spacing, Explore section only ----------------------------
 * Rob 2026-08-22.
 *
 * Note on what actually changes: card-grid.css sets .cgrid__body twice — once
 * at line 52 (`padding: --space-md --space-sm; gap: --space-2xs`) and again in
 * its Enclosure block at line 117 (`padding: --space-md; gap: --space-sm`),
 * which wins. So the effective values were already `--space-md` all round with
 * a `--space-sm` gap; the only real change here is narrowing the horizontal
 * padding to `--space-xs`.
 *
 * Scoped to .cpages so the News/Events grid on Home and About keeps the
 * spacing the handoff measured its 466px card around.
 */
.cpages .cgrid__body {
  padding: var(--space-md) var(--space-xs);
  gap: var(--space-sm);
}
