/*
 * Avaliações do Google (acompanha /assets/js/avaliacoes.js).
 * Cores ajustáveis no :root da página:
 *   --av-fundo, --av-borda, --av-texto, --av-suave, --av-estrela, --av-destaque, --av-raio
 */
.av {
  --_fundo: var(--av-fundo, rgba(255, 255, 255, 0.04));
  --_borda: var(--av-borda, rgba(255, 255, 255, 0.12));
  --_texto: var(--av-texto, inherit);
  --_suave: var(--av-suave, rgba(127, 127, 127, 0.95));
  --_estrela: var(--av-estrela, #FBBC04);
  --_destaque: var(--av-destaque, currentColor);
  --_raio: var(--av-raio, 14px);
  color: var(--_texto);
}

.av__link { color: var(--_destaque); font-weight: 600; }

.av__resumo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 24px; }
.av__media { font-size: 2.5rem; line-height: 1; font-variant-numeric: tabular-nums; }
.av__total { color: var(--_suave); font-size: 0.9375rem; }

.av__estrelas { display: inline-flex; gap: 2px; font-size: 1.125rem; line-height: 1; }
.av__estrela { color: var(--_borda); }
.av__estrela--cheia { color: var(--_estrela); }

.av__lista {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.av__item {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px;
  border: 1px solid var(--_borda);
  border-radius: var(--_raio);
  background: var(--_fundo);
}
.av__autor { display: flex; align-items: center; gap: 12px; }
.av__foto { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; }
.av__foto--inicial { display: grid; place-items: center; background: var(--_borda); font-weight: 700; }
.av__quem { display: flex; flex-direction: column; min-width: 0; }
.av__nome { color: inherit; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.av__quando { color: var(--_suave); font-size: 0.8125rem; }
.av__texto {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.av__pe { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: auto; font-size: 0.8125rem; }
.av__traduzida { color: var(--_suave); }
.av__ler { color: var(--_destaque); font-weight: 600; }

.av__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.av__botao {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid var(--_borda);
  border-radius: 999px;
  color: inherit;
  font-weight: 600;
  text-decoration: none;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1), background-color 200ms ease;
}
.av__botao:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) {
  .av__botao:hover { background: var(--_fundo); }
  .av__nome:hover { text-decoration: underline; }
}
.av__aviso { margin: 16px 0 0; color: var(--_suave); font-size: 0.75rem; }

/* Entrada dos cartões quando as avaliações chegam (só com movimento liberado). */
@media (prefers-reduced-motion: no-preference) {
  .av--pronta .av__item {
    animation: av-entra 600ms cubic-bezier(0.23, 1, 0.32, 1) both;
    animation-delay: calc(var(--i, 0) * 60ms);
  }
}
@keyframes av-entra { from { opacity: 0; transform: translateY(16px); } }

/* Celular: cartões lado a lado com rolagem horizontal e encaixe. */
@media (max-width: 640px) {
  .av__lista {
    display: flex;
    gap: 12px;
    margin: 0 -20px;
    padding: 0 20px 4px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 20px;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }
  .av__lista::-webkit-scrollbar { display: none; }
  .av__item { flex: 0 0 85%; scroll-snap-align: start; }
}