/* ReviewsGrid — narrow-slot behavior.

   The component is dropped into three very different accessory slots: full-accessory
   (~1280px), half-accessory (~580px) and side-accessory (SubpageContentV2's `.fifth`
   column, ~270px). The header row and the pager/CTA row now carry `f_wrp`, so both
   break to a new line on their own the moment they stop fitting — no breakpoint
   needed for the overflow itself.

   What wrap alone cannot express is the ALIGNMENT once the pager row has broken:
   `f_sb` leaves a single item per line parked at flex-start, so the pager and the
   button end up stacked but visually unrelated. Below the single-item point the row
   becomes the centered column the shared narrow-scroller treatment uses at every width — the
   site's established narrow-scroller treatment.

   The root is its own `container-type: inline-size` (grid.css also grants this via
   `:has( > .grd )`; it is restated here so the query survives a markup refactor), so
   the switch tracks the COMPONENT's width, not the viewport — the same card adapts
   in all three slots and inside the 1280px flex-at collapse. */

.rvw-grd {
	container-type: inline-size;
	container-name: rvw-grd;
}

/* ~30rem sits between the side-accessory (~270px) and half-accessory (~580px) slots. */
@container rvw-grd (width < 30rem) {

	.rvw-grd .rvw-tls {
		flex-direction: column;
		align-items: center;
	}

}

/* A single-token author name ("Bartholomew") had nothing to shrink against in the
   47px-avatar + copy footer once the card column got this tight. */
.rvw-grd .rvw-crd .dtl {
	min-width: 0;
	overflow-wrap: anywhere;
}