/* ───────────────────────────────────────────────────────────────────────────
   LA PAGE COACHS, SOUS LES PORTRAITS — motifs coachs-avis et
   reformer-decouvrir (12 octobre 2026).

   Les avis par coach prennent la carte « passe-partout » de l'accueil
   (accueil-avis.css), sur le même blanc chaud, mais en grille et en texte
   entier : deux ou trois avis n'ont pas besoin de carrousel. Au-dessus de
   chacun, « Avec » et le prénom de la coach, en capitales espacées.

   « À découvrir aussi » garde ses cartes (pratique-sections.css) ; il ne
   lui manque ici que la taille de sa flèche, posée par pratique-hero.css
   sur les pages Reformer et Mat.
   ─────────────────────────────────────────────────────────────────────────── */
.ca { --acc-blanc: #FCFAF7; --acc-encre: var(--wp--preset--color--encre); padding: clamp(3.5rem, 8vw, 5.5rem) max(1.25rem, 4.2vw); background: var(--acc-blanc); color: var(--acc-encre); text-align: center; }
.ca *, .ca *::before, .ca *::after { box-sizing: border-box; }
.ca__titre { max-width: 22ch; margin: 0 auto; font-family: var(--font-display); font-size: clamp(1.75rem, 6.4vw, 2.5rem); line-height: 1.1; text-wrap: balance; color: var(--vin-700); }
.ca__liste { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; gap: 1.25rem; max-width: 1140px; margin: 2.25rem auto 0; padding: 0; list-style: none; }
.ca__liste > li { display: flex; flex: 0 1 360px; }   /* chaque carte à la hauteur de son avis : étirées, la plus courte gardait un grand vide */
.ca__carte { width: 100%; min-height: 0; padding: 2.75rem 2.25rem 2.25rem; text-align: left; }
.ca__carte .acc-avis__texte p { display: block; -webkit-line-clamp: none; line-clamp: none; overflow: visible; }   /* le texte entier : ici, l'avis EST le contenu */
.ca__coach { margin: 0 0 1rem; font: 600 0.75rem/1.3 var(--font-body), sans-serif; letter-spacing: 0.22em; text-transform: uppercase; color: var(--vin-700); }
@media (max-width: 639px) {
  .ca__carte { padding: 2.25rem 1.75rem 1.875rem; }
}

.rd .ph-fleche { flex: none; width: 1.125rem; height: 1.125rem; transition: transform var(--dur-base) var(--ease-out-expo); }
@media (prefers-reduced-motion: reduce) { .rd .ph-fleche { transition: none; } }