/* Find the Right Support — "founder experiences" block: 3 video testimonials.
   Loaded only on the diagnostic page, after main.css. Everything is scoped to .sp-results--proof. */

.sp-results--proof .sp-proof__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sp-results--proof .sp-proof__head .badge-text { margin: 0; }

.sp-results--proof .sp-proof__title {
  max-width: 900px;
  margin: 20px 0 0;
}

.sp-results--proof .sp-proof__lead {
  max-width: 640px;
  margin: 24px 0 0;
  font-size: var(--fs-main);
  line-height: 1.5;
}

.sp-results--proof .sp-proof__track {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-top: 64px;
}

.sp-results--proof .sp-proof__track .testimonial {
  width: 312px;
  flex: 0 0 312px;
}

.sp-results--proof .sp-proof__track .testimonial__media {
  height: 555px;
  margin-bottom: 24px;
}

.sp-results--proof .sp-proof__cta {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}

.sp-results--proof .sp-proof__cta .btn {
  width: auto;
  align-self: center;
}

/* Tablets: three cards no longer fit side by side, so the row scrolls like on Home */
@media (max-width: 1100px) {
  .sp-results--proof .sp-proof__track {
    justify-content: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding: 0 var(--site-margin);
    scrollbar-width: none;
    margin-left: calc(-1 * var(--site-margin));
    margin-right: calc(-1 * var(--site-margin));
    padding: 0 var(--site-margin) 8px;
  }

  .sp-results--proof .sp-proof__track::-webkit-scrollbar { display: none; }
}

/* Phones: prototype mobile frame */
@media (max-width: 767px) {
  .sp-results--proof .sp-proof__title { margin-top: 16px; letter-spacing: -0.8px; }
  .sp-results--proof .sp-proof__lead { margin-top: 20px; }
  .sp-results--proof .sp-proof__track { margin-top: 40px; }

  .sp-results--proof .sp-proof__track .testimonial {
    width: min(280px, 80vw);
    flex: 0 0 min(280px, 80vw);
  }

  .sp-results--proof .sp-proof__track .testimonial__media { height: 420px; }
  .sp-results--proof .sp-proof__cta { margin-top: 32px; }
  .sp-results--proof .sp-proof__cta .btn { width: 100%; }
}