/* Large editorial quotes, no boxes. */
.quotes { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 900px) { .quotes { grid-template-columns: repeat(3, 1fr); gap: var(--space-6); } }

.quote {
  position: relative; display: flex; flex-direction: column; gap: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line-strong);
}
.quote__mark { display: none; }

.quote__stars { display: inline-flex; gap: 3px; }
.quote__stars svg { width: 14px; height: 14px; fill: var(--gold); }
.quote__stars .is-off { fill: #2e2d2a; }

.quote__text {
  font-family: var(--serif); font-weight: 500; font-size: clamp(1.3rem, 1.9vw, 1.6rem); line-height: 1.22; letter-spacing: -0.015em;
  color: var(--text); text-wrap: pretty;
}

.quote__author { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.quote__avatar {
  display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--line-strong); color: var(--text-2); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em;
}
.quote__name { display: block; font-size: 0.92rem; font-weight: 600; }
.quote__role { display: block; color: var(--muted); font-size: 0.84rem; }

.quotes__note { margin-top: var(--space-7); text-align: center; color: var(--muted); font-size: 0.84rem; }