/*
 * recettes.css : mise en page propre à la page des recettes (maquette 12) : liste des recettes, « Afficher plus de recettes », texte sous la liste,
 * bloc « Le plus lu ». Chargée sur cette page seulement. Le bandeau, les filtres, la carte de recette, le bloc de la lettre et le bilan offert
 * sont des composants communs (composants-magazine.css, suite.css). La couleur vient d'une classe « soin-… » posée sur la page (ocre pour les recettes).
 * Mobile d'abord (390 px), puis paliers à 640, 960 et 1280 px.
 */

.recettes .grand-titre em{color:var(--soin-texte)}

/* ---------- Liste : deux colonnes sur mobile et tablette, trois à partir de 960 px ---------- */
.recettes-liste{padding-bottom:22px;scroll-margin-top:16px}
.recettes-liste__grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.recettes-liste .carte-recette{scroll-margin-top:24px}
.recettes-liste__vide{font-size:17px;line-height:29px;color:var(--texte-courant)}
.recettes-liste__vide a{font-weight:600;text-decoration:underline;text-underline-offset:4px}
@media (min-width:640px){.recettes-liste__grille{gap:20px}}
@media (min-width:960px){
	.recettes-liste{padding-bottom:64px}
	.recettes-liste__grille{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- Afficher plus de recettes ---------- */
.recettes-plus{display:flex;justify-content:center;padding-bottom:28px}
.recettes-plus__bouton{--h:50px;--px:28px;width:100%;line-height:normal}
@media (min-width:640px){.recettes-plus__bouton{--h:52px;width:auto}}
@media (min-width:960px){.recettes-plus{padding-bottom:64px}}

/* ---------- Texte sous la liste : colonne de lecture centrée ---------- */
.recettes-bas{padding-bottom:28px}
.recettes-bas__texte{max-width:var(--colonne-lecture);margin-inline:auto;font-size:16px;line-height:27px;color:var(--texte-courant)}
.recettes-bas__texte a{font-weight:600;text-decoration:underline;text-underline-offset:4px}
@media (min-width:960px){.recettes-bas{padding-bottom:64px}}

/* ---------- Le plus lu ---------- */
.recettes-lu{background:var(--recettes-fond)}
.recettes-lu__contenu{display:flex;flex-direction:column;gap:10px;padding-block:28px}
.recettes-lu__texte{display:flex;flex-direction:column;gap:10px}
.recettes-lu__surtitre{font-size:12px;line-height:normal;color:var(--soin-texte)}
.recettes-lu__titre{font-family:var(--police-titre);font-weight:700;font-size:23px;line-height:30px;color:var(--soin-texte)}
.recettes-lu__description{font-size:15px;line-height:24px;color:var(--texte-courant)}
.recettes-lu__bouton{display:flex;align-items:center;justify-content:center;min-height:50px;margin-top:6px;padding:0 20px;border-radius:12px;background:var(--soin-texte);font-size:15px;font-weight:600;line-height:1.25;text-align:center;color:var(--blanc)}
.recettes-lu__bouton:hover{filter:brightness(.88);color:var(--blanc)}
@media (min-width:960px){
	.recettes-lu__contenu{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:48px;padding-block:56px}
	.recettes-lu__titre{font-size:32px;line-height:40px}
	.recettes-lu__description{max-width:620px;font-size:16px;line-height:26px}
	.recettes-lu__bouton{min-height:54px;margin-top:0;padding:0 28px;font-size:16px}
}
@media (min-width:1280px){.recettes-lu__surtitre{letter-spacing:.26em}}