/*
 * avis-page.css : page « Avis » (maquette 16) : entête avec panneau « Avis Google », filtres, grille de cartes, « Donner votre avis », « D'où viennent ces avis »,
 * livre d'or, bilan offert. Chargée sur cette page seulement, après entete-page.css et avis-google.css (panneau et carte d'avis).
 * Mobile d'abord (390 px), puis paliers à 640, 960, 1100 et 1280 px.
 */

/* ---------- Entête : texte à gauche, panneau « Avis Google » à droite (à partir de 960 px) ---------- */
.avis-entete .surtitre{letter-spacing:.22em}
.avis-entete .entete-formulaire__contenu{padding-block:16px 26px}
.avis-entete__grille{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:10px}
.avis-entete__grille .entete-formulaire__tete{margin-top:0}
.avis-entete .avis-panneau{margin-inline:0}
@media (min-width:640px){
	.avis-entete .avis-panneau{max-width:520px}
}
@media (min-width:960px){
	.avis-entete .entete-formulaire__contenu{padding-block:24px 52px}
	.avis-entete__grille{grid-template-columns:minmax(0,1fr) 320px;gap:64px;align-items:center;margin-top:30px}
	.avis-entete--sans-panneau .avis-entete__grille{grid-template-columns:minmax(0,1fr)}
	.avis-entete .entete-formulaire__texte{max-width:600px;margin-top:18px;font-size:18px}
	.avis-entete .avis-panneau{max-width:none}
}
@media (min-width:1280px){
	.avis-entete .surtitre{letter-spacing:.26em}
}

/* ---------- Filtres : une ligne de puces par filtre ---------- */
.avis-filtres{padding-block:18px;background:var(--blanc)}
.avis-filtres__corps{display:flex;flex-direction:column;gap:12px;max-width:var(--largeur);margin-inline:auto}
.avis-filtres__ligne{display:flex;flex-direction:column;gap:12px}
.avis-filtres__ligne+.avis-filtres__ligne{padding-top:4px}
.avis-filtres__nom{margin:0;padding-inline:var(--marge);font-size:12px;line-height:18px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--encre-douce)}
.avis-filtres__choix{display:flex;gap:8px;margin:0;padding:0 var(--marge);overflow-x:auto;list-style:none;scrollbar-width:none}
.avis-filtres__choix::-webkit-scrollbar{display:none}
.avis-filtres__choix li{flex:none}
.avis-filtre{box-sizing:border-box;display:flex;align-items:center;height:44px;padding:0 18px;border:1.5px solid var(--filet-fleche);border-radius:22px;background:var(--blanc);font-size:14px;font-weight:500;line-height:normal;color:var(--encre);cursor:pointer}
.avis-filtre:hover{border-color:var(--vert);background:var(--vert-clair);color:var(--encre)}
.avis-filtre[aria-current="true"],.avis-filtre[aria-current="true"]:hover{border-color:var(--vert);background:var(--vert);font-weight:600;color:var(--blanc)}
@media (min-width:640px){
	.avis-filtres{padding-block:26px}
	.avis-filtres__corps{gap:14px;padding-inline:var(--marge)}
	.avis-filtres__ligne{flex-direction:row;align-items:flex-start;gap:16px}
	.avis-filtres__ligne+.avis-filtres__ligne{padding-top:0}
	.avis-filtres__nom{flex:none;width:70px;padding:13px 0 0}
	.avis-filtres__choix{flex-wrap:wrap;gap:10px;padding:0;overflow:visible}
}

/* ---------- Grille d'avis : trois colonnes (une sur mobile), cartes de 300 px de haut ---------- */
.avis-liste{padding-block:24px 32px}
.avis-grille{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start;margin:0;padding:0;list-style:none}
.avis-grille__item{min-width:0}
.avis-grille .avis-carte{width:auto;height:300px}
.avis-grille .avis-carte--ouverte{height:auto;min-height:300px}
.avis-carte__etoiles--page{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.avis-soin{padding:3px 10px;border-radius:999px;background:var(--soin-teinte);font-size:12px;line-height:18px;font-weight:500;color:var(--soin-texte)}
.avis-grille .avis-carte__pied{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}
.avis-grille .avis-carte__pied .avis-carte__suite{align-self:auto;margin-top:0}
.avis-grille .avis-carte--ouverte .avis-carte__pied{margin-top:12px}
.avis-carte__google{position:relative;margin-left:auto;font-size:13px;line-height:20px;color:var(--encre-douce);text-decoration:underline;text-underline-offset:4px}
.avis-carte__google::after{content:"";position:absolute;inset:-12px -4px}
.avis-carte__google:hover{color:var(--encre)}
.avis-liste .avis-google__plus{margin:22px 0 0}
.avis-liste .avis-bouton{display:flex;justify-content:center;width:100%;height:52px;padding:0 28px;border-radius:12px;font-size:16px}
.avis-liste .avis-bouton[hidden]{display:none}
.avis-vide{margin:0;font-size:16px;line-height:26px;text-align:center;color:var(--texte-courant)}
.avis-vide a{text-decoration:underline;text-underline-offset:4px}
@media (min-width:640px){
	.avis-grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
	.avis-liste .avis-google__plus{text-align:center}
	.avis-liste .avis-bouton{display:inline-flex;width:auto}
}
@media (min-width:960px){
	.avis-liste{padding-block:44px 56px}
	.avis-grille{grid-template-columns:repeat(3,minmax(0,1fr))}
	.avis-liste .avis-google__plus{margin-top:30px}
}

/* ---------- Donner votre avis ---------- */
.avis-appel{padding-block:28px;background:var(--vert-clair)}
.avis-appel__contenu{display:flex;flex-direction:column;gap:10px}
.avis-appel__corps{display:flex;flex-direction:column;gap:10px}
.avis-appel__titre{font-family:var(--police-titre);font-weight:600;font-size:24px;line-height:30px;color:var(--vert-titre)}
.avis-appel__texte{margin:0 0 6px;font-size:15px;line-height:24px;color:var(--texte-courant)}
.avis-appel__boutons{display:flex;flex-direction:column;gap:10px}
.avis-appel__bouton{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 22px;border:1px solid var(--filet);border-radius:12px;background:var(--blanc);font-size:15px;font-weight:600;line-height:normal;color:var(--encre)}
.avis-appel__bouton:hover{border-color:var(--vert-filet);color:var(--encre)}
.avis-appel__bouton .avis-logo{flex:none}
@media (min-width:640px){
	.avis-appel{padding-block:44px}
	.avis-appel__corps{gap:6px}
	.avis-appel__titre{font-size:30px;line-height:38px}
	.avis-appel__texte{margin:0;font-size:16px;line-height:26px}
	.avis-appel__boutons{flex-direction:row;flex-wrap:wrap;gap:12px}
}
@media (min-width:1100px){
	.avis-appel__contenu{flex-direction:row;align-items:center;justify-content:space-between;gap:32px}
	.avis-appel__titre{white-space:nowrap}
	.avis-appel__boutons{flex:none;flex-wrap:nowrap}
}

/* ---------- D'où viennent ces avis, livre d'or ---------- */
.avis-section{padding-block:30px 26px}
.avis-section .titre-section__trait,.avis-section .titre-section__filet{display:none}
.avis-section .titre-section__titre{font-size:24px;line-height:30px}
.avis-origine{background:var(--blanc)}
.avis-origine__liste{display:flex;flex-direction:column;gap:16px;margin:16px 0 0}
.avis-origine__point{display:flex;flex-direction:column;gap:2px}
.avis-origine__point dt{font-weight:600;font-size:15px;line-height:22px;color:var(--encre)}
.avis-origine__point dd{margin:0;font-size:14px;line-height:22px;color:var(--encre-douce)}
.avis-livre{background:var(--creme)}
.avis-livre__texte{margin:12px 0 0;font-size:15px;line-height:24px;color:var(--texte-courant)}
.avis-livre .avis-grille{margin-top:20px}
@media (min-width:640px){
	.avis-section{padding-block:60px}
	.avis-section .titre-section__trait{display:block;width:44px}
	.avis-section .titre-section__filet{display:block}
	.avis-section .titre-section__titre{font-size:30px;line-height:38px}
	.avis-origine__liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 40px;margin-top:26px}
	.avis-origine__point{gap:4px}
	.avis-livre__texte{max-width:640px;font-size:16px;line-height:26px}
}
@media (min-width:960px){
	.avis-origine__liste{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* ---------- Bilan offert : fond crème, comme sous les blocs de la maquette ---------- */
.avis-bilan{padding-block:32px;background:var(--creme)}
@media (min-width:960px){
	.avis-bilan{padding-block:64px 72px}
}