/* quote-band — contained customer quotes
 *
 * NOT FROM THE HANDOFF. Deliberately reuses testimonial-pair's card language
 * — teal ground, --step-quote display type, --radius-core, the same layered
 * shadow — so a quote reads the same wherever it appears. What differs is the
 * container: no photographic background, no fixed two-up, and it sits inside
 * --container-max rather than running full-bleed.
 */

.qband__head { margin-bottom: var(--space-md); }

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

.qband__card {
  height: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  /* Quote at the top, attribution pinned to the foot, so a short quote and a
   * long one still line their attributions up across the row. */
  justify-content: space-between;
  gap: var(--space-sm);
  padding: clamp(1.5rem, 1rem + 1.667vw, 2.5rem);
  background: var(--color-accent);
  color: var(--color-text-inv);
  border-radius: var(--radius-core);
  box-shadow: var(--shadow-md), var(--shadow-inner);
}

.qband__quote {
  margin: 0;
  font-family: var(--font-display);
  /* Rob 2026-08-22: --step--1. Testimonials run long, and at --step-1 the
   * cards stretched to the tallest quote and left the short ones mostly
   * empty. */
  font-size: var(--step--1);
  line-height: var(--leading-snug);
}
.qband__quote > * + * { margin-top: var(--space-2xs); }

.qband__attr {
  font-size: var(--step--1);
  font-weight: var(--fw-bold);
  /* Not pure white — the attribution should sit under the quote, not compete
   * with it. */
  color: rgb(255 255 255 / 0.82);
}

@media (max-width: 992px) {
  .qband__list--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .qband__list--2,
  .qband__list--3 { grid-template-columns: 1fr; }
}


/* -- testimonial-pair, same treatment -----------------------------------
 * Rob 2026-08-22: the Home pair reads at --step-quote (18->24px), which the
 * handoff measured the card around — and which makes the card taller than it
 * needs to be now the quotes are real. Brought level with the other two quote
 * blocks so all three match.
 *
 * Overridden here rather than in sections/testimonial-pair.css so that file
 * stays byte-identical to the handoff. THIS IS A DEPARTURE FROM THE APPROVED
 * MOCKUP and is recorded in BUILD-NOTES.md.
 */
.tpair__quote { font-size: var(--step--1); }
.tpair__attr  { font-size: var(--step--1); }