/* reviews.css — "Reviews on Google" (homepage and team/franchesca-ortega), filled by reviews.js from /api/reviews.
   Light colours only, like the rest of the site (no dark theme); the section keeps its own background so a forced dark scheme can't
   wash it out. No author photos: initials only. */
.gr-sec { background: #F7F3E5; color: #16312B; color-scheme: light; border-top: 1px solid rgba(4,68,57,.10); }
.gr-sec .gr-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.2rem 2rem; flex-wrap: wrap; }
.gr-body:empty { display: none; }
.gr-body { margin-top: clamp(1.6rem, 3vw, 2.4rem); }

/* summary: rating, stars, count — only numbers Google sent */
.gr-sum { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem .9rem; margin-bottom: 1.4rem; }
.gr-score { font-family: 'Instrument Serif', Georgia, serif; font-size: 2.6rem; line-height: 1; color: #044439; }
.gr-count { font-size: .95rem; color: #4F625A; }

.gr-stars { position: relative; display: inline-block; font-size: 1.15rem; line-height: 1; letter-spacing: .08em; color: #D9CFBC; white-space: nowrap; }
.gr-stars > i { position: absolute; inset: 0 auto 0 0; overflow: hidden; color: #C98A04; font-style: normal; white-space: nowrap; }
.gr-stars.gr-sm { font-size: .95rem; }

/* cards */
.gr-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: 1rem; align-items: start; }
.gr-card { background: #fff; border: 1px solid #E4DCC9; border-radius: 18px; padding: 1.25rem 1.3rem 1.3rem; display: flex; flex-direction: column; gap: .7rem; min-width: 0; }
.gr-who { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.gr-ini { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: #59133A; color: #F7F3E5; font: 600 .9rem 'Plus Jakarta Sans', Arial, sans-serif; letter-spacing: .02em; }
.gr-who > div { min-width: 0; display: flex; flex-direction: column; }
.gr-author { font-weight: 600; font-size: .98rem; color: #044439; text-decoration: none; overflow-wrap: anywhere; }
a.gr-author:hover { text-decoration: underline; }
.gr-when { font-size: .82rem; color: #5E6F68; }
.gr-text { margin: 0; font-size: .95rem; line-height: 1.6; color: #1F3A33; overflow-wrap: anywhere; white-space: pre-line; }
.gr-more { align-self: flex-start; margin-top: auto; font-size: .86rem; font-weight: 600; color: #59133A; text-decoration: none; min-height: 32px; display: inline-flex; align-items: center; }
.gr-more:hover { text-decoration: underline; }

/* how the reviews are chosen + Google Maps attribution (Google Maps Platform policies: plain text "Google Maps", not translated) */
.gr-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1.2rem; margin-top: 1rem; }
.gr-note { margin: 0; font-size: .8rem; color: #5E6F68; }
.gr-attr { margin: 0; font: 400 13px Roboto, 'Plus Jakarta Sans', Arial, sans-serif; letter-spacing: normal; color: #5E5E5E; white-space: nowrap; }

/* the two buttons (always there; the only thing shown until Google is connected) */
.gr-cta { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem 1.2rem; margin-top: clamp(1.4rem, 3vw, 2rem); }
.gr-ask { margin: 0; font-size: .98rem; color: #4F625A; flex: 1 1 16rem; }
.gr-btns { display: flex; flex-wrap: wrap; gap: .75rem; }
.gr-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; height: 50px; padding: 0 1.5rem; border-radius: 9999px;
  font: 600 .88rem 'Plus Jakarta Sans', Arial, sans-serif; text-decoration: none; border: 1px solid transparent; transition: background .2s, border-color .2s, color .2s; }
.gr-btn-main { background: #044439; color: #F7F3E5; }
.gr-btn-main:hover { background: #59133A; }
.gr-btn-alt { background: transparent; color: #044439; border-color: rgba(4,68,57,.35); }
.gr-btn-alt:hover { border-color: #044439; background: rgba(4,68,57,.04); }
.gr-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.gr-sec :focus-visible { outline: 2px solid #59133A; outline-offset: 3px; border-radius: 6px; }

/* team page: the page's own section spacing */
.gr-team { padding: 7rem 8vw; border-bottom: 1px solid #E4DCC9; }
.gr-team .section-title { margin-bottom: 1.2rem; }
.gr-team .divider { margin-bottom: 0; }

@media (max-width: 759.98px) {
  /* phones: the cards scroll sideways inside the section (never the page) */
  .gr-list { display: flex; align-items: flex-start; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 5vw; gap: .8rem;
    margin: 0 -5vw; padding: 0 5vw .6rem; scrollbar-width: thin; }
  .gr-team .gr-list { margin: 0 -8vw; padding: 0 8vw .6rem; scroll-padding-inline: 8vw; }
  .gr-card { flex: 0 0 84%; scroll-snap-align: start; }
  .gr-btns, .gr-btn { width: 100%; }
  .gr-team { padding: 4.5rem 8vw; }
}
@media print { .gr-sec { display: none; } }
