/* testimonials_grid block. Grid of testimonial cards, each a full-card link.
   No literal colour, every value a token. Fixes: the card link re-introduced the
   default underline (only .tg-card was reset), and the CSS styled .tg-card-body
   while the markup emits .tg-card-content, so the content area was unstyled. */

.tg-grid { display: grid; gap: var(--gap-grid); }
/* The field offers 2, 3 and 4 per row; only 3 was mapped, so 2 and 4 fell back
   to the base .tg-grid, which sets no columns, and rendered single-column. */
.tg-grid-2 { grid-template-columns: repeat(2, 1fr); }
.tg-grid-3 { grid-template-columns: repeat(3, 1fr); }
.tg-grid-4 { grid-template-columns: repeat(4, 1fr); }

.tg-card { display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--line); border-left: var(--card-edge) solid var(--accent); border-radius: var(--radius-sm); overflow: hidden; }
.tg-card-link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }

.tg-card-image-wrapper { aspect-ratio: 4 / 3; overflow: hidden; }
.tg-card-image { width: 100%; height: 100%; object-fit: cover; display: block; }
.tg-card-placeholder { display: flex; aspect-ratio: 4 / 3; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 800; font-size: 2rem; color: var(--white); }
.tg-card-placeholder-name { opacity: .9; }

.tg-card-content { padding: 1.3rem 1.4rem; display: flex; flex-direction: column; gap: .4rem; flex: 1 1 auto; }
.tg-card-name { font-family: var(--font-display); font-weight: 800; font-size: 1.25rem; color: var(--text-heading); }
.tg-card-course { font-size: var(--fs-min); color: var(--muted); }
.tg-card-quote { font-family: var(--font-display); font-weight: 400; font-style: italic; font-size: 1.3125rem; line-height: 1.4; color: var(--text-heading); }
.tg-card-button { margin-top: auto; padding-top: .8rem; font-size: var(--fs-min); font-weight: 700; color: var(--link); }
.tg-card-link:hover .tg-card-button { text-decoration: underline; }

@media (max-width: 64em) { .tg-grid-3, .tg-grid-4 { grid-template-columns: 1fr; } }
@media (max-width: 40em) { .tg-grid-2 { grid-template-columns: 1fr; } }