/* REV1: reviews rail, quote cards, rating line */
.review-card { margin: 0; padding: .75rem 1rem; border: 1px solid rgba(128,128,128,.3); border-radius: .5rem; background: var(--bs-body-bg, transparent); }
.review-card blockquote { margin: 0; }
.review-card .gq-stars { color: #B8860B; letter-spacing: .1em; }
.reviews-rail-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.reviews-rail-row:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.reviews-rail-row:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 767.98px) {
  /* position: relative = the scroller is the containing block of the absolutely positioned .visually-hidden spans inside the cards;
     without it they escape the clipping and stretch the whole page sideways (scrollWidth 729 at 390 px) */
  .reviews-rail-row { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: .75rem; padding-bottom: .5rem; }
  .reviews-rail-row > .review-card { flex: 0 0 85%; scroll-snap-align: start; }
}
/* REV2: long reviews cut with "more"; checkbox toggle, no script. The tail is only display:none, so the full text is in the HTML. */
.review-card { display: flex; flex-direction: column; }
.review-card figcaption { margin-top: auto; }
.review-excerpt .review-tail, .review-more-off { display: none; }
.review-more-toggle:checked ~ .review-excerpt .review-tail { display: inline; }
.review-more-toggle:checked ~ .review-excerpt .review-ellipsis, .review-more-toggle:checked ~ .review-more-label .review-more-on { display: none; }
.review-more-toggle:checked ~ .review-more-label .review-more-off { display: inline; }
.review-more-label { display: inline-block; align-self: flex-start; cursor: pointer; color: var(--bs-link-color, #0d6efd); text-decoration: underline; }
.review-more-toggle:focus-visible ~ .review-more-label { outline: 2px solid currentColor; outline-offset: 2px; }
.reviews-rail-row { align-items: start; }
