/* Google reviews section (from candg-reviews.html), in the site theme. Scoped with "gr-". */
.gr { background: #fff; padding: clamp(48px, 7vw, 80px) 0; font-family: var(--cg-font); color: var(--cg-ink); scroll-margin-top: 90px; }
.gr .cg-wrap { padding-top: 0; padding-bottom: 0; }
.gr-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: 36px; flex-wrap: wrap; }
.gr-count { margin: 0; padding: 8px 16px; border: 1px solid var(--cg-line); border-radius: 999px; background: var(--cg-paper); font-size: 15px; color: var(--cg-muted); }
.gr-feature { display: grid; grid-template-columns: auto 1fr; gap: 40px; margin: 0 0 24px; padding: 48px; position: relative; overflow: hidden; background: var(--cg-dark); color: #fff; border-radius: var(--cg-radius); }
.gr-side { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; min-width: 170px; }
.gr-qmark { display: block; margin-bottom: 18px; color: var(--cg-red); }
.gr-feature blockquote { max-width: 70ch; margin: 0; padding: 0; border: 0; font-size: 18px; line-height: 1.7; color: #e9e9e9; font-style: normal; position: relative; z-index: 1; }
.gr-feature .gr-avatar { width: 72px; height: 72px; font-size: 26px; }
.gr-feature .gr-who small { color: #bdbdbd; }
.gr-feature .gr-who cite { font-size: 18px; }
.gr-feature .gr-more { display: none; color: #fff; border-color: rgba(255, 255, 255, .4); margin-top: 14px; }
.gr-stars { display: inline-flex; gap: 2px; color: var(--cg-red); }
.gr-avatar { position: relative; flex: none; display: grid; place-items: center; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; background: var(--cg-red); color: #fff; font-weight: 700; }
.gr-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gr-who cite { display: block; font-style: normal; font-weight: 700; font-size: 15px; line-height: 1.3; }
.gr-who small { color: var(--cg-muted); font-size: 13px; }
.gr-grid { columns: 3; column-gap: 20px; }
.gr-card { display: flex; flex-direction: column; gap: 16px; margin: 0 0 20px; padding: 26px; break-inside: avoid; background: #fff; border: 1px solid var(--cg-line); border-radius: var(--cg-radius); transition: border-color .2s, box-shadow .2s; }
.gr-card:hover { border-color: #cfc9c4; box-shadow: 0 12px 28px rgba(0, 0, 0, .06); }
.gr-card[hidden] { display: none; }
.gr-top { display: flex; justify-content: space-between; align-items: center; }
.gr-g { width: 20px; height: 20px; }
.gr-card blockquote { margin: 0; padding: 0; border: 0; font-size: 16px; line-height: 1.65; color: #2c2c2c; font-style: normal; }
.gr-card.is-clamped blockquote { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.gr-more { align-self: flex-start; margin-top: -6px; padding: 0; border: 0; border-bottom: 2px solid rgba(193, 39, 45, .25); background: none; font: inherit; font-size: 14px; font-weight: 700; color: var(--cg-red); cursor: pointer; }
.gr-more:hover { border-color: var(--cg-red); }
.gr-card figcaption { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--cg-paper); }
.gr-all { margin-top: 20px; text-align: center; }
.gr blockquote::before, .gr blockquote::after { content: none !important; display: none !important; }
.gr .cg-btn.cg-btn--line { color: var(--cg-ink) !important; border-color: var(--cg-ink); }
.gr .cg-btn.cg-btn--line:hover { background: var(--cg-ink); color: #fff !important; }
@media (max-width: 1000px) { .gr-grid { columns: 2; } .gr-feature { grid-template-columns: 1fr; padding: 32px; gap: 24px; } .gr-side { flex-direction: row; align-items: center; flex-wrap: wrap; } }
@media (max-width: 640px) {
  .gr-grid { columns: 1; } .gr-card { padding: 22px; } .gr-feature { padding: 26px; } .gr-feature blockquote { font-size: 16px; }
  .gr-feature.is-clamped blockquote { display: -webkit-box; -webkit-line-clamp: 9; -webkit-box-orient: vertical; overflow: hidden; }
  .gr-feature.is-clamped .gr-more { display: inline-block; }
}
@media (min-width: 1200px) { .gr .cg-wrap { max-width: none; margin: 0; padding-left: var(--cg-pad, 50px); padding-right: var(--cg-pad, 50px); } }
