/* Equal treatment for three professional recommendations. */
.recommendations-heading { margin-bottom: 36px; }
.recommendations-heading h2 { max-width: 780px; text-wrap: balance; }
.recommendations-heading > p { color: var(--muted); font-size: 16px; line-height: 1.5; margin-top: 16px; }
.recommendation-grid { display: grid; }
.recommendation-card { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 48px; align-items: start; margin: 0; padding: 32px 0; min-width: 0; text-align: left; background: transparent; border: 0; }
.recommendation-card:first-child { padding-top: 0; }
.recommendation-card:last-child { padding-bottom: 0; }
.recommendation-card + .recommendation-card { border-top: 1px solid var(--line); }
.recommendation-card blockquote { grid-column: 2; grid-row: 1; margin: 0; }
.recommendation-card blockquote p { font: 400 24px/1.45 var(--display); letter-spacing: -.025em; color: var(--ink); text-wrap: pretty; }
.recommendation-card figcaption { grid-column: 1; grid-row: 1; margin: 0; font-size: 15px; line-height: 1.5; }
.recommendation-card figcaption a { display: flex; width: fit-content; align-items: center; min-height: 44px; margin-block: -10px; font-size: 16px; font-weight: 500; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--line); }
.recommendation-card figcaption a:hover { text-decoration-color: var(--ink); }
.recommendation-role { display: block; color: var(--muted); }
.recommendation-card time { display: block; margin-top: 4px; color: var(--muted); font-size: 13px; }
@media (max-width: 800px) {
  .recommendations-heading { margin-bottom: 32px; }
  .recommendations-heading h2 { text-wrap: auto; }
  .recommendation-card { grid-template-columns: minmax(0,1fr); gap: 20px; padding-block: 28px; }
  .recommendation-card blockquote, .recommendation-card figcaption { grid-column: 1; grid-row: auto; }
  .recommendation-card blockquote p { font-size: 23px; }
}
@media print { .recommendation-card { break-inside: avoid; } }