/* ============================================================
   REVERT — Reviews wall (infinite marquee of client reviews)
   ============================================================ */
.reviews-wall {
  background: #eef4fb;
  padding: 72px 20px 90px;
  overflow: hidden;
}

.rw-head { text-align: left; max-width: 1240px; margin: 0 auto 34px; padding: 0; }
.rw-head h2 {
  font-family: "Zimula", "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 500;
  font-size: clamp(1.9rem, 4vw, 2.9rem);
  line-height: 1.08;
  letter-spacing: -1.2px;
  color: var(--ink);
  margin: 0 0 12px;
}
.rw-head p { font-size: 15px; color: var(--muted); margin: 0; }

/* ---------- stage: holds the pinned card + the scrolling rail ---------- */
.rw-stage {
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
}

/* ---------- the marquee rail (clipped to the stage, fades on the right) ---------- */
.rw-marquee {
  position: relative;
  overflow: hidden;
  /* start the rail just behind the yellow card's right edge, so review cards
     appear/vanish exactly at that edge instead of peeking behind it */
  margin-left: 324px;
  padding: 30px 0;
  -webkit-mask-image: linear-gradient(90deg, #000 86%, transparent);
  mask-image: linear-gradient(90deg, #000 86%, transparent);
}
.rw-track { display: flex; width: max-content; will-change: transform; }
.rw-group { display: flex; gap: 24px; padding: 0 12px; }

/* ---------- one review card (taller, portrait) ---------- */
.rw-card {
  flex: none;
  width: 330px;
  height: 340px;
  background: #fff;
  border-radius: 24px;
  padding: 30px 28px 26px;
  box-shadow: 0 22px 54px -26px rgba(20, 40, 70, .24), 0 0 0 1px rgba(16, 24, 40, .04);
  display: flex;
  flex-direction: column;
}

/* the yellow rating card stays put; the marquee scrolls behind it */
.rw-pinned {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  margin: 0;
}
.rw-quote {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 54px;
  line-height: 0;
  height: 26px;
  color: #FBBC04;
  font-weight: 700;
}
.rw-text {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 14px 0 22px;
  flex: 1;
}
.rw-person { display: flex; align-items: center; gap: 12px; }
.rw-ava { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; flex: none; }
.rw-who { display: flex; flex-direction: column; line-height: 1.25; }
.rw-who b { font-size: 14px; font-weight: 700; color: var(--ink); }
.rw-who span { font-size: 12.5px; color: var(--muted); }
.rw-who .rw-ministars { color: #FBBC04; font-size: 13px; letter-spacing: 1.5px; line-height: 1; margin-top: 3px; }
.rw-g-badge { width: 20px; height: 20px; margin-left: auto; flex: none; }

/* ---------- the yellow rating highlight card ---------- */
.rw-card--rating {
  background-image: linear-gradient(198deg, #ffff7a, #fefe46 45%, #e6e62a);
  color: var(--yellow-ink);
  justify-content: space-between;
  box-shadow: 0 22px 50px -20px rgba(214, 214, 40, .55), 0 0 0 1px rgba(16, 24, 40, .05);
}
.rw-rating-top { display: flex; align-items: center; justify-content: flex-start; gap: 14px; }
.rw-google { height: 30px; width: auto; display: block; }
.rw-stars { display: inline-flex; gap: 3px; }
.rw-stars svg { width: 19px; height: 19px; fill: #FBBC04; }
.rw-stars--dark svg { width: 28px; height: 28px; fill: #141414; }
.rw-rating-num {
  font-family: "Zimula", "Plus Jakarta Sans", system-ui, sans-serif;
  font-weight: 500;
  font-size: 2.7rem;
  letter-spacing: -1px;
  margin: 14px 0 0;
  display: flex;
  align-items: baseline;
  gap: 9px;
}
.rw-rating-num span { font-size: 1rem; font-weight: 700; }
.rw-rating-foot { display: flex; align-items: center; gap: 13px; }
.rw-ava-stack { display: flex; flex: none; }
.rw-ava-stack img {
  width: 38px; height: 38px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fdfd6a;
  margin-left: -11px;
}
.rw-ava-stack img:first-child { margin-left: 0; }
.rw-rating-meta { display: flex; flex-direction: column; line-height: 1.15; }
.rw-rating-meta b { font-size: 18px; font-weight: 800; }
.rw-rating-meta span { font-size: 12px; font-weight: 600; opacity: .78; }

/* ---------- responsive: yellow card becomes a full-width header, marquee below ---------- */
@media (max-width: 820px) {
  .reviews-wall { padding: 54px 16px 68px; }
  .rw-head { margin-bottom: 22px; }
  .rw-card { width: 285px; height: 320px; padding: 26px 22px 22px; }
  .rw-pinned {
    position: static;
    width: auto;
    height: auto;
    transform: none;
    justify-content: flex-start;
    gap: 22px;
    margin: 0 0 22px;
  }
  .rw-marquee { margin-left: 0; }
  .rw-rating-num { font-size: 2.3rem; }
}