/* FAQ page — Google reviews grid (the button accordion lives in components.css).
   Reviews are UNBOXED quote entries on the cream ground, separated by hairlines,
   each with a square green avatar tile, stars, and the Google mark. The sole raw
   hex on the page is the inline Google-logo <symbol> in the markup (brand mark). */

/* Overall summary — unboxed row, hairline below */
.reviews-summary {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: var(--space-3) var(--space-5);
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--hairline);
  margin-bottom: var(--space-8);
}
.reviews-summary__rating { display: flex; align-items: center; gap: var(--space-3); }
.reviews-summary .btn--ghost { color: var(--green); }
.reviews-summary .btn--ghost:hover { color: var(--accent-dark); }

/* Quote grid */
.rev-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: var(--space-6); align-items: stretch; }
/* Review chunk (rule 8): --panel on the cream ground */
.rev-card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5) var(--space-6); background-color: var(--panel); border: var(--panel-frame); }
.rev-card__head { display: flex; align-items: center; gap: var(--space-3); }
.rev-card__avatar {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 2.75rem; height: 2.75rem;
  background-color: var(--green); color: var(--paper);
  font-weight: var(--fw-extrabold); font-size: var(--text-lg);
  border-radius: 0;                       /* square tile — circles stay sun-only */
}
.rev-card__meta { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.rev-card__name { font-weight: var(--fw-extrabold); color: var(--ink); }
.rev-card__stars { color: var(--accent); letter-spacing: 0.1em; font-size: var(--text-sm); }
.rev-card__text { color: var(--ink); line-height: var(--leading-relaxed); font-size: var(--text-sm); }
.rev-card__expand {
  align-self: flex-start; display: inline-flex; align-items: center; min-height: 2.75rem;
  background: none; border: none; padding: 0; font: inherit; font-weight: var(--fw-bold);
  color: var(--green); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; cursor: pointer;
}
.rev-card__expand:hover { color: var(--accent-dark); }
.rev-card__expand { display: none; }
html.js .rev-card--expandable .rev-card__expand { display: inline-flex; }
html.js .rev-card--expandable .rev-card__text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
html.js .rev-card--expandable[data-expanded] .rev-card__text { display: block; overflow: visible; }

/* Google logo mark (shared <symbol>) */
.g-logo { display: block; flex-shrink: 0; }
.rev-card .g-logo { margin-left: auto; }
.g-logo--lg { flex-shrink: 0; }