/* Real reviews, set apart from our own words. Existing harbour-teal palette. */
#reviews { scroll-margin-top: 90px; }
.reviews-card { border-top: 3px solid var(--accent-ink); border-bottom: 1px solid var(--border); padding: 24px 0; min-width: 0; }
.reviews-top, .reviews-person, .reviews-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.reviews-top { justify-content: space-between; margin-bottom: 22px; }
.reviews-logo { height: 18px; width: auto; margin: 10px 10px 5px; }
.reviews-summary { font-size: 15px; color: var(--text-muted); }
.reviews-text { font-size: clamp(19px, 2vw, 23px); line-height: 1.65; margin: 18px 0; overflow-wrap: anywhere; white-space: pre-line; max-height: 15em; overflow-y: auto; padding-right: 8px; }
.reviews-person { min-width: 0; }
.reviews-person > div { min-width: 0; }
.reviews-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.reviews-person a { font-weight: 650; overflow-wrap: anywhere; }
.reviews-date, .reviews-note { color: var(--text-muted); font-size: 14px; }
.reviews-date { margin: 0; }
.reviews-stars { color: var(--accent-ink); letter-spacing: 2px; margin: 0 0 8px; }
.reviews-controls { margin-top: 22px; }
.reviews-controls button { background: var(--surface-1); border: 1px solid var(--border-strong); border-radius: 4px; color: var(--text); min-height: 44px; min-width: 44px; padding: 6px 12px; cursor: pointer; font: inherit; font-size: 15px; }
.reviews-controls button:hover { background: var(--surface-2); }
.reviews-controls button:focus-visible, .reviews-text:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 3px; }
.reviews-position { margin-left: auto; font-size: 14px; font-variant-numeric: tabular-nums; }
.reviews-note { margin-top: 16px; margin-bottom: 0; line-height: 1.6; }
.reviews-link { display: inline-block; margin-top: 18px; }
.reviews-card [hidden] { display: none; }
.reviews-card .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 480px) { .reviews-text { font-size: 19px; } .reviews-controls { gap: 8px; } }