/* ═══════════════════════════════════════════════════════════════════════════
   13 — CE QUE DISENT LES REVENDEURS

   Bande ivoire. Trois cartes lin, citation en Fraunces, signature calée en
   bas. Trois colonnes au bureau, deux dès 601 px, une seule en dessous.

   Aucun contour : le client a montré précisément ces cartes, cernées d'un
   filet sur une teinte relevée, comme ce qu'il ne veut pas. `.fmt-card` les
   détache de la bande par la seule teinte du contenant (lin sur ivoire).

   `.fmt-section`, `.fmt-card` et `.fmt-head__main` viennent de style.css.
   ═══════════════════════════════════════════════════════════════════════════ */

.fmt-avis > *,
.fmt-avis .wp-block-group > * {
	margin-block: 0;
}

/* Titre de section du kit : 48 px au bureau, sans descendre sous 30 px. */
.fmt-avis .fmt-avis__titre {
	font-size: var(--wp--preset--font-size--display-m);
	line-height: var(--lh-section);
	letter-spacing: var(--track-section);
}

/* ─── Grille ─────────────────────────────────────────────────────────────── */

.fmt-avis .fmt-avis__grille {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-16);
	margin-block-start: var(--space-32);
}

@media (min-width: 601px) {
	.fmt-avis .fmt-avis__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 900px) {
	.fmt-avis .fmt-avis__grille {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--space-24);
		margin-block-start: var(--space-48);
	}
}

/* ─── Une carte ──────────────────────────────────────────────────────────── */

/* `.fmt-card` pose la teinte lin et le rayon de 4 px. Le bloc citation de
   WordPress pose ses propres marges et son retrait : ici la carte porte tout,
   il n'en reste rien. La carte n'est pas un lien : aucun survol. */
.fmt-avis .fmt-avis__carte {
	display: flex;
	flex-direction: column;
	gap: var(--space-24);
	margin: 0;
	padding: clamp(var(--space-24), 3vw, var(--space-32));
}

.fmt-avis .fmt-avis__carte > * {
	margin-block: 0;
}

/* Fraunces pour la prise de parole : 20 px au téléphone, jusqu'à 24 px au
   bureau — assez grand pour être une voix, assez sobre pour trois colonnes. */
.fmt-avis .fmt-avis__citation {
	font-family: var(--font-display);
	font-variation-settings: var(--fraunces-axes);
	font-size: clamp(var(--wp--preset--font-size--h-4), 1.8vw, 1.5rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1.35;
	letter-spacing: var(--track-subsection);
	color: var(--text-heading);
	text-wrap: pretty;
}

/* ─── La signature ───────────────────────────────────────────────────────── */

/* `margin-block-start: auto` colle la signature au bas de la carte : les trois
   citations n'ont pas la même longueur, les trois signatures s'alignent. */
.fmt-avis .fmt-avis__carte cite {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
	margin-block-start: auto;
	font-style: normal;
}

.fmt-avis .fmt-avis__nom {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: var(--lh-ui);
	color: var(--text-body);
}

/* Texte discret sur lin : 4,81:1, au-dessus du seuil de 4,5:1. */
.fmt-avis .fmt-avis__qualite {
	font-size: var(--wp--preset--font-size--caption);
	line-height: var(--lh-caption);
	color: var(--text-muted);
}