/* Customer words from the verified Google profile, pinned like notes on the shop's paper.
   The rating stamp borrows the hero frame's perforated edge; the notes reuse the postcard tape. */
.reviews-section { --reviews-edge: max(var(--gutter), calc((100% - 1250px) / 2)); position: relative; padding-block: 80px 70px; background: #fff; overflow: hidden; }
.reviews-heading { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 30px 60px; }
.reviews-intro h2 { font-size: clamp(38px, 4vw, 54px); line-height: 1.08; letter-spacing: -.025em; }
.reviews-intro p { max-width: 44ch; margin-top: 16px; color: var(--muted); font-size: 16px; line-height: 1.7; }

.reviews-summary { position: relative; display: flex; align-items: center; gap: 4px; padding-right: 10px; }
.reviews-score { position: relative; display: block; isolation: isolate; filter: drop-shadow(0 2px 3px #78665b14) drop-shadow(0 8px 14px #78665b14); transition: transform .25s ease; }
.reviews-score:hover { transform: translateY(-3px) rotate(-1deg); }
.score-paper { position: absolute; inset: 9px -9px -7px 9px; z-index: -1; background: var(--aqua); transform: rotate(5deg); }
.score-stamp { display: grid; justify-items: center; gap: 7px; min-width: 176px; padding: 24px 30px 21px; background: #fffefa; transform: rotate(-2.5deg); mask: linear-gradient(#000 0 0) center/calc(100% - 15px) calc(100% - 15px) no-repeat, radial-gradient(circle, #000 66%, transparent 71%) 0 0/15px 15px round; }
.score-value { font: 500 62px/.9 var(--display); letter-spacing: -.03em; color: #4c4945; }
.score-count { font-size: 12px; line-height: 1.4; color: var(--muted); letter-spacing: .02em; }
.reviews-thanks { position: absolute; right: -6px; bottom: -40px; font: 27px/1 var(--script); color: #ac7c7f; white-space: nowrap; transform: rotate(-6deg); pointer-events: none; }

.review-stars { display: block; flex-shrink: 0; overflow: visible; }
.review-stars path { fill: #eadfd3; }
.review-stars path.filled { fill: #d9a65b; }

/* The row bleeds to the window edge; the first note lines up with the page content. */
.reviews-track { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(272px, 28vw, 352px); gap: 28px; list-style: none; margin: 34px 0 0; padding: 40px var(--reviews-edge) 34px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--reviews-edge); scroll-behavior: smooth; scrollbar-width: none; }
.reviews-track::-webkit-scrollbar { display: none; }
.reviews-track:focus-visible { outline: 2px solid #4d8278; outline-offset: -4px; }
.review-note { --tilt: -1.2deg; --tape: #cbe8e4b8; position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 34px 28px 22px; scroll-snap-align: start; background: #fdefec; color: var(--ink); box-shadow: 0 1px 2px #6550390f, 0 14px 26px -16px #65503947; transform: rotate(var(--tilt)); transition: transform .3s ease, box-shadow .3s ease; }
.review-note:nth-child(3n+2) { --tilt: .9deg; --tape: #f4cbc7c4; background: #eaf5f2; }
.review-note:nth-child(3n) { --tilt: -.4deg; --tape: #f4cbc7b0; background: #fbf6f0; }
.review-note:nth-child(4n) { --tilt: 1.4deg; }
.review-note:hover { transform: rotate(0deg) translateY(-5px); box-shadow: 0 1px 2px #6550390f, 0 20px 30px -16px #6550394d; }
.review-note::before { content: ''; position: absolute; top: -13px; left: 50%; width: 86px; height: 27px; background: repeating-linear-gradient(90deg, var(--tape) 0 9px, #ffffff8c 9px 18px); transform: translateX(-50%) rotate(-5deg); opacity: .92; }
.review-note:nth-child(even)::before { transform: translateX(-50%) rotate(4deg); left: 44%; }
.review-note::after { content: '“'; position: absolute; top: 12px; right: 22px; font: 500 88px/1 var(--display); color: #e2aaa4; opacity: .5; pointer-events: none; }
.review-note blockquote { flex: 1; margin: 0; }
.review-note blockquote p { position: relative; font: 500 20px/1.42 var(--display); color: #4c4945; overflow-wrap: anywhere; }
.review-author { display: flex; align-items: center; gap: 12px; padding-top: 15px; border-top: 1px dashed #cdbfb4; }
.review-initial { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; background: #ffffffb3; box-shadow: inset 0 0 0 1px #e5d6cb; font: 600 19px/1 var(--display); color: #8f6f6c; }
.review-meta { display: grid; line-height: 1.35; min-width: 0; }
.review-author strong { font-weight: 600; font-size: 14px; color: var(--deep); overflow-wrap: anywhere; }
.review-source { font-size: 12px; color: var(--muted); }

.reviews-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; }
.reviews-source { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 20px; }
.reviews-note { font-size: 13px; color: var(--muted); }
.reviews-note:empty { display: none; }
.reviews-controls { display: flex; gap: 10px; }
.reviews-arrow { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #c8dbd5; border-radius: 50%; background: #fffdfa; color: var(--deep); font-size: 19px; transition: background .18s, transform .18s, opacity .18s; }
.reviews-arrow:hover:not(:disabled) { background: #eef7f4; transform: translateY(-2px); }
.reviews-arrow:disabled { opacity: .35; }

@media (max-width: 850px) {
  .reviews-section { padding-block: 64px 58px; }
  .reviews-heading { gap: 26px 36px; }
  .score-stamp { min-width: 150px; padding: 20px 24px 18px; }
  .score-value { font-size: 52px; }
  .reviews-thanks { font-size: 24px; bottom: -34px; }
  .reviews-track { grid-auto-columns: clamp(262px, 42vw, 330px); gap: 22px; }
}
@media (max-width: 600px) {
  .reviews-section { padding-block: 46px 44px; }
  .reviews-heading { grid-template-columns: minmax(0,1fr); gap: 26px; }
  .reviews-intro h2 { font-size: 38px; }
  .reviews-intro p { font-size: 15px; margin-top: 12px; }
  .score-stamp { min-width: 0; grid-template-columns: auto auto; column-gap: 14px; row-gap: 4px; align-items: center; padding: 16px 22px 15px; transform: rotate(-1.5deg); }
  .score-value { grid-row: span 2; font-size: 48px; }
  .score-stamp .review-stars { align-self: end; }
  .score-count { align-self: start; }
  .reviews-summary { justify-self: start; padding: 0 0 34px 4px; }
  .score-count { max-width: 8.5em; }
  .reviews-thanks { right: -18px; bottom: 0; font-size: 23px; }
  .reviews-track { grid-auto-columns: min(84%, 330px); gap: 16px; margin-top: 18px; padding-block: 34px 28px; }
  .review-note { padding: 30px 22px 20px; }
  .review-note::after { right: 16px; font-size: 78px; }
  .review-note blockquote p { font-size: 19px; }
  .reviews-footer { align-items: flex-start; }
  .reviews-arrow { width: 44px; height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .reviews-track { scroll-behavior: auto; }
  .review-note, .reviews-score, .reviews-arrow { transition: none; }
  .review-note:hover { transform: rotate(var(--tilt)); }
  .reviews-score:hover, .reviews-arrow:hover:not(:disabled) { transform: none; }
}
@media (forced-colors: active) {
  .review-note { border: 1px solid CanvasText; }
  .review-note::before, .review-note::after, .score-paper { display: none; }
  .score-stamp { mask: none; border: 1px solid CanvasText; }
  .review-stars path.filled { fill: CanvasText; }
}
