/* Avis Google des pages services (rempli par assets/js/avis.js) */

:root {
  --etoile: #c99a3a;
  --etoile-vide: #e8dcc2;
}

[data-avis][hidden] {
  display: none;
}

/* Cinq étoiles, dorées à hauteur de la note (--note entre 0 et 5) */
.etoiles {
  display: inline-block;
  font-size: 1.45rem;
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.etoiles::before {
  content: "★★★★★";
  background: linear-gradient(90deg, var(--etoile) calc(var(--note, 5) / 5 * 100%), var(--etoile-vide) 0);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Sous les boutons du haut de page */
.avis-badge {
  margin: 1.25rem 0 0;
}

.avis-badge a {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.7rem;
  color: var(--brun-fonce);
  font-size: 1.05rem;
  text-decoration: none;
}

.avis-badge a:hover span:last-child,
.avis-badge a:focus-visible span:last-child {
  text-decoration: underline;
}

@media (max-width: 55.99rem) {
  .avis-badge {
    text-align: center;
  }

  .avis-badge a {
    justify-content: center;
  }
}

/* Section « Les avis Google » */
.bande-creme {
  background: var(--creme);
}

.avis-resume {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 1rem;
  margin: 1.25rem 0 0;
  color: var(--brun-fonce);
}

.avis-resume .etoiles {
  font-size: 1.9rem;
}

.avis-resume-texte {
  font-size: 1.1rem;
}

.avis-resume a {
  color: var(--or-brun);
}

.avis-carte {
  background: var(--blanc);
}

.avis-carte .etoiles {
  margin-bottom: 1rem;
  font-size: 1.25rem;
}

.avis-carte blockquote {
  font-size: 1.2rem;
}

.avis-carte blockquote p + p {
  margin-top: 0.75rem;
}

.avis-carte figcaption a {
  color: inherit;
}

.avis-mention {
  max-width: 48rem;
  margin: 2rem auto 0;
  color: var(--brun);
  font-size: 0.8rem;
  line-height: 1.6;
  text-align: center;
}

.avis-mention a {
  color: var(--or-brun);
}
