/* web/themes/techprosolutions/css/components/svc-social.css */
/**
 * Testimonials scroll-snap carousel + pre-footer CTA banner.
 */

/* ---- Testimonials ---- */
.svc-quotes__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(18rem, 24rem);
  gap: var(--et-space-6);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  padding-block: var(--et-space-2) var(--et-space-6);
  scrollbar-width: thin;
}
.svc-quote {
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--et-radius-lg);
  padding: var(--et-space-8);
  box-shadow: 0 4px 16px rgba(10, 10, 10, 0.06);
  margin: 0;
}
.svc-theme--navy .svc-quote { background: rgba(255, 255, 255, 0.06); }

.svc-quote__stars {
  display: flex;
  gap: var(--et-space-1);
  margin: 0 0 var(--et-space-4);
}
.svc-quote__star { width: 1.25rem; height: 1.25rem; color: var(--et-green); }
.svc-quote__star.is-empty { color: rgba(69, 70, 79, 0.2); }

.svc-quote__body {
  flex: 1;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0 0 var(--et-space-6);
}
.svc-quote__body p { margin: 0; }

.svc-quote__who {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--et-space-3);
  align-items: center;
}
.svc-quote__photo {
  grid-row: span 2;
  width: var(--et-space-12);
  height: var(--et-space-12);
  border-radius: var(--et-radius-pill);
  object-fit: cover;
}
.svc-quote__name { font-weight: 700; color: var(--et-ink); }
.svc-theme--navy .svc-quote__name { color: #fff; }
.svc-quote__city { font-size: 0.875rem; }

/* ---- Pre-footer CTA banner ---- */
.svc-cta__grid {
  display: grid;
  gap: var(--et-space-12);
  align-items: center;
}
@media (min-width: 62rem) {
  .svc-cta__grid--form { grid-template-columns: 7fr 5fr; }
  
  .svc-cta__grid:not(.svc-cta__grid--form) .svc-cta__copy {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .svc-cta__grid:not(.svc-cta__grid--form) .svc-cta__copy .svc-head {
    margin-bottom: 0;
  }
  .svc-cta__grid:not(.svc-cta__grid--form) .svc-cta__btn {
    margin-top: 0;
    margin-left: var(--et-space-8);
    flex-shrink: 0;
  }
}
.svc-cta .svc-head { margin-bottom: var(--et-space-6); }
.svc-cta .svc-lead { margin-bottom: 0; }
.svc-cta__btn { margin-top: var(--et-space-2); }
