/* Homepage review selection. The shared reviews carousel is used on other pages. */
.client-reviews {
  --reviews-blue: #1a6eff;
  --reviews-ink: #1e2736;
  --reviews-muted: #646d83;
  max-width: 1220px;
  margin-inline: auto;
  padding-block: 3rem 10rem;
  scroll-margin-top: 110px;
  color: var(--reviews-ink);
  font-family: var(--font-family-main);
  font-size: 1.6rem;
  line-height: 1.5;
}

/* The site reset applies a type size and color to every nested element. */
.client-reviews *,
.client-reviews *::before,
.client-reviews *::after { font-size: inherit; color: inherit; }
.client-reviews a:focus-visible { outline: 3px solid var(--reviews-blue); outline-offset: 5px; }
.client-reviews__heading { display: flex; justify-content: space-between; align-items: center; gap: 3rem; margin-bottom: 3.4rem; }
.client-reviews__heading > div:first-child { min-width: 0; }
.client-reviews__eyebrow { margin-bottom: 1.4rem; color: var(--reviews-blue); font-size: 1.2rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; }
.client-reviews__title { font-size: 4.4rem; line-height: 1.18; font-weight: 600; letter-spacing: -.035em; text-wrap: balance; }
.client-reviews__title span { color: var(--reviews-blue); }
.client-reviews__intro { margin-top: 1.5rem; color: var(--reviews-muted); font-size: 1.6rem; line-height: 1.6; }
.client-reviews__rating { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: .7rem; }
.client-reviews__rating > span { color: var(--reviews-muted); font-size: 1.2rem; }
.client-reviews__rating iframe { display: block; width: 150px; height: 50px; border: 0; }

.client-reviews__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 2rem; }
.client-reviews__aside { display: grid; gap: 2rem; min-width: 0; }
.client-review { display: flex; flex-direction: column; min-width: 0; padding: 2.8rem; border: 1px solid #d7deef; border-radius: 2rem; background: #fff; }
.client-review__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.client-review__topic { align-self: flex-start; padding: .7rem 1rem; border-radius: .6rem; color: #396ab9; background: #f0f5fe; font-size: 1.2rem; font-weight: 600; line-height: 1.35; }
.client-review__quote-mark { height: 3.4rem; color: #afcaff; font-family: Georgia, serif; font-size: 8rem; line-height: .9; }
.client-review__quote { margin: 1.8rem 0 2.2rem; font-size: 1.7rem; line-height: 1.65; text-align: left; white-space: pre-line; overflow-wrap: break-word; font-weight: 500}
.client-review__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.2rem 1.8rem; margin-top: auto; }
.client-review__author { display: flex; align-items: center; gap: 1.2rem; min-width: 0; }
.client-review__author img { display: block; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.client-review__author h3 { font-size: 1.5rem; font-weight: 600; line-height: 1.4; }
.client-review__author time { display: block; margin-top: .4rem; color: var(--reviews-muted); font-size: 1.2rem; line-height: 1.4; font-variant-numeric: lining-nums; }
.client-review__original { display: inline-flex; align-items: center; gap: .7rem; min-height: 44px; color: var(--reviews-blue); font-size: 1.2rem; font-weight: 600; line-height: 1.5; }
.client-review__original > span:last-child { font-family: "Segoe UI", sans-serif; font-size: 1.8rem; }
.client-review__original:hover { text-decoration: underline; text-underline-offset: .3rem; }

.client-review--featured { padding: 3.4rem; border-color: var(--reviews-blue); background: var(--reviews-blue); color: #fff; }
.client-review--featured .client-review__topic { color: #fff; background: rgb(255 255 255 / 14%); }
.client-review--featured .client-review__quote-mark { color: #9fc3ff; }
.client-review--featured .client-review__quote { margin-top: 2.6rem; font-size: 1.8rem; line-height: 1.7; }
.client-review--featured .client-review__footer { padding-top: 2rem; }
.client-review--featured .client-review__author img { width: 52px; height: 52px; border: 2px solid rgb(255 255 255 / 45%); }
.client-review--featured .client-review__author h3 { font-size: 1.6rem; }
.client-review--featured .client-review__author time { color: #e2edff; }
.client-review--featured .client-review__original { color: #fff; }
.client-review--featured a:focus-visible { outline-color: #fff; }

.client-reviews__more { display: flex; align-items: center; justify-content: space-between; gap: 2rem 3.2rem; margin-top: 2.4rem; padding: 2.6rem 3rem; border: 1px solid #dce7ff; border-radius: 2rem; background: #f1f6ff; }
.client-reviews__more > div { min-width: 0; max-width: 68rem; }
.client-reviews__more h3 { font-size: 2.1rem; font-weight: 600; line-height: 1.35; }
.client-reviews__more p { margin-top: .8rem; color: #536179; font-size: 1.5rem; line-height: 1.6; }
.client-reviews__cta { display: inline-flex; flex-shrink: 0; justify-content: center; align-items: center; gap: 1.6rem; min-height: 54px; max-width: 100%; padding: 1.5rem 2.4rem; border: 1px solid var(--reviews-blue); border-radius: 1.2rem; color: #fff; background: var(--reviews-blue); font-size: 1.6rem; font-weight: 600; line-height: 1.5; text-align: center; }
.client-reviews__cta svg { flex: 0 0 auto; width: 2.2rem; height: 2.2rem; }
.client-reviews__cta:hover { color: #fff; background: #0050d9; border-color: #0050d9; }

@media (max-width: 1023px) {
  .client-reviews { padding-block: 2rem 8rem; }
  .client-reviews__title { font-size: 3.8rem; }
  .client-reviews__grid { grid-template-columns: minmax(0, 1fr); }
  .client-reviews__aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .client-review { padding: 2.6rem; }
  .client-review--featured { padding: 3rem; }
  .client-review__footer { align-items: flex-start; }
  .client-review__original { font-size: 1.3rem; }
  .client-reviews__more { flex-wrap: wrap; }
}

@media (max-width: 640px) {
  .client-reviews { padding-block: 1.6rem 6rem; scroll-margin-top: 90px; }
  .client-reviews__heading { flex-direction: column; align-items: flex-start; gap: 2rem; margin-bottom: 2.4rem; }
  .client-reviews__title { font-size: 3.4rem; }
  .client-reviews__intro { font-size: 1.5rem; }
  .client-reviews__rating { align-items: flex-start; }
  .client-reviews__grid, .client-reviews__aside { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
  .client-review, .client-review--featured { padding: 2.2rem; border-radius: 1.6rem; }
  .client-review__topic { font-size: 1.1rem; }
  .client-review__quote { font-size: 1.6rem; }
  .client-review--featured .client-review__quote { margin-top: 2.4rem; font-size: 1.6rem; }
  .client-review__footer { flex-direction: column; gap: .8rem; }
  .client-review--featured .client-review__footer { padding-top: .6rem; }
  .client-reviews__more { flex-direction: column; align-items: stretch; padding: 2.2rem; border-radius: 1.6rem; }
  .client-reviews__more h3 { font-size: 2rem; }
  .client-reviews__cta { width: 100%; padding-inline: 1.6rem; }
}
