/* The OneTwenty case study: the rules the shared case-study*.css does not cover. Scoped under .cs-ot (data 'class'). */
.cs-ot .tw3-client img.tw7-logo.ot-logo { width: 150px; }
.cs-ot .tw7-person b { display: block; }
@media (min-width: 1280px) { .cs-ot .cs-browser--fill img.ot-hero-shot { object-fit: contain; object-position: center; background: #F1F7E2; } }
@media (max-width: 639px) { .cs-ot .ot-chip-phone { display: none; } }
@media (max-width: 639px) { .cs-ot [aria-labelledby="cs-impact"] dl > div:last-child { grid-column: 1 / -1; } }

/* "How a survey turns into a donation": six steps, the invitation (outside the plugin) dashed */
.cs-ot .cs-chain__step.ot-ext { background: transparent; border-style: dashed; }

/* Provis's published numbers */

/* the survey screens: three across, caption above; a 2 + 1 grid on phones */
.cs-ot .ot-dashline { max-width: 48rem; }
.cs-ot .ot-strip { display: grid; grid-template-columns: 1fr; gap: 20px; align-items: start; margin: 24px 0 0; padding: 0; list-style: none; }
.cs-ot .ot-strip figure { margin: 0; display: flex; flex-direction: column; }
.cs-ot .ot-strip img { display: block; width: 100%; height: auto; border-radius: 16px; border: 1px solid rgba(0, 0, 0, .08); box-shadow: 0 20px 40px -30px rgba(0, 0, 0, .45); }
.cs-ot .ot-strip figcaption { order: -1; margin: 0 0 10px; font-size: 15px; font-weight: 600; line-height: 1.4; color: #111; }
@media (min-width: 640px) {
  .cs-ot .ot-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 32px; }
}
@media (min-width: 1024px) { .cs-ot .ot-strip { gap: 24px; max-width: 60rem; margin-left: auto; margin-right: auto; } }