/* ===== TESTIMONIALS — Google summary (static, right) + reviews slider (3-up, loop) ===== */
.tst { background: #f5f5f7; }
.tst__title { color: #000; }

/* RTL row: first child = right side. Summary card is static; slider takes the rest. */
.tst__row { display: flex; align-items: stretch; gap: 24px; }
.tst__row > .tsum { flex: 0 0 calc((100% - 72px) / 4); width: auto; }
.tst__row > .tst__splide { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; position: relative; }
/* The summary card occupies the space an outside arrow would use, so THIS slider keeps
   the arrows in an inset gutter (the other .lzk-splsec sliders put them in the page margin). */
.tst__row > .tst__splide { padding: 0 clamp(40px, 2.9vw, 54px); }
.tst__row > .tst__splide .splide__arrow { width: clamp(34px, 2.6vw, 50px); height: clamp(34px, 2.6vw, 50px); }
.tst__row > .tst__splide .splide__arrow--prev { right: 0; left: auto; }
.tst__row > .tst__splide .splide__arrow--next { left: 0; right: auto; }
/* slider fills the row height so the review cards line up with the summary card */
.tst__row > .tst__splide .splide__track { flex: 1 1 auto; }
.tst__row > .tst__splide .splide__list { height: 100%; }

.tst__splide .splide__slide { display: flex; height: auto; }
.rev, .tsum { width: 100%; background: #fff; border-radius: 8px; }

.rev { position: relative; padding: 24px; display: flex; flex-direction: column; text-align: right; min-height: 340px; }
.rev__quote { position: absolute; top: 20px; left: 24px; width: 23px; height: 23px; opacity: .5; }
.rev__g { position: absolute; top: 18px; right: 24px; width: 28px; height: 28px; }
.rev__stars { display: flex; gap: 3px; margin-top: 42px; }
.rev__stars img { width: 21px; height: 21px; }
.rev__text { margin-top: 18px; font-size: 20px; line-height: 28px; color: #161616; flex: 1 0 auto; }
.rev__name { margin-top: 16px; font-weight: 700; font-size: 20px; color: #161616; }

.tsum { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 26px 20px; }
.tsum__h { font-size: 30px; color: #071c37; }
.tsum__logo { width: 123px; height: auto; margin-top: 14px; }
.tsum__score { font-size: 50px; font-weight: 700; color: #00132c; line-height: 1; margin-top: 18px; }
.tsum__stars { display: flex; gap: 5px; margin-top: 16px; }
.tsum__stars img { width: 28px; height: 28px; }
.tsum__based { font-size: 17px; color: #071c37; margin-top: 14px; }
.tsum__btn {
  margin-top: 18px; width: 184px; height: 48px; display: flex; direction: ltr; align-items: center;
  border: 1px solid var(--green-900); border-radius: 900px; color: var(--green-900);
}
.tsum__btn .circ { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(13,44,33,.4); display: flex; align-items: center; justify-content: center; }
.tsum__btn .circ img { width: 24px; height: 24px; }
.tsum__btn .lbl { flex: 1; text-align: center; font-weight: 700; font-size: 20px; padding-left: 6px; }

@media (max-width: 1024px) {
    .tst {
        padding: 36px 0 55px;
    }
    .tst__row {
        flex-direction: column;
        gap: 30px;
        padding: 0 44px;
    }
    .tst__row > .tsum {
        flex: 0 0 auto;
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
        border-radius: 0;
        box-shadow: 0px 4px 30px 0px #071C371A;
    }
    .tsum__score {
        font-size: 40px;
    }
    .tsum__stars img {
        width: 26px;
        height: 26px;
    }
    .tsum__stars {
        gap: 14px;
    }
    .tst__row > .tst__splide {
        padding: 0;
    }
    .rev {
        border-radius: 0;
    }
    .tst__row > .tst__splide .splide__arrow--prev {
        right: -36px;
    }
    .tst__row > .tst__splide .splide__arrow--next {
        left: -36px;
    }
}