/* Testimonials */

.testimonials {
  overflow: hidden;
}

.testimonials > div {
  display: grid;
  gap: var(--gap-block);
  grid-template-columns: 1fr;
}

@media (min-width: 45rem) {
  /* Flex statt Grid: letzte Reihe zentriert (Cap), volle Reihen füllen. */
  .testimonials > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .testimonials > div > blockquote {
    flex: 1 1 18rem;
    max-width: var(--section-card-max);
  }
}

.testimonials blockquote {
  padding: var(--padding-card);
  background: var(--color-bg);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  transition: transform var(--transition), box-shadow var(--transition);
}

.testimonials blockquote:hover {
  transform: translateY(-0.125rem);
  box-shadow: var(--shadow-lg);
}

.testimonials blockquote p {
  font-style: italic;
  color: var(--color-text);
  margin-block-end: var(--gap-inline);
}

/* Typografische Anführungszeichen umschließen den Quote-Text — „ vorne, " hinten.
   Unicode U+201E (low double quote, deutsch unten) und U+201C (left double quote, oben). */
.testimonials blockquote p::before { content: '\201E'; }
.testimonials blockquote p::after  { content: '\201C'; }

.testimonials cite {
  font-style: normal;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-text-muted);
  align-self: flex-end;
  text-align: right;
}