/* 2 x 2 video testimonial grid (#108): two cards per row, 4:5 video on top, Before/During/After below, equal heights per row; one column under 640px. Used by testimonials.html and mentorship.html */
html body .v3 #stories .vids,html body .v3 #videos .vids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;max-width:760px;margin-left:auto;margin-right:auto;align-items:stretch}
html body .v3 #videos .vids{margin-top:2rem}
html body .v3 #stories .vid,html body .v3 #videos .vid{flex:none;width:auto;max-width:none;display:flex;flex-direction:column;height:100%}
html body .v3 #stories .vid mux-player,html body .v3 #videos .vid mux-player{aspect-ratio:4/5;width:100%;height:auto;min-height:0;overflow:hidden;flex:none;--media-object-fit:cover}
html body .v3 #stories .vid .name,html body .v3 #videos .vid .name{padding:.85rem 1.25rem;font-size:1rem}
html body .v3 #stories .vid .bda,html body .v3 #videos .vid .bda{padding:.2rem 1.25rem 1.25rem;flex:1}
html body .v3 #stories .vid .bda dt,html body .v3 #videos .vid .bda dt{font-size:.68rem}
html body .v3 #stories .vid .bda dd,html body .v3 #videos .vid .bda dd{font-size:.9rem}
html body .v3 #stories .vid .bda>div,html body .v3 #videos .vid .bda>div{padding-left:1.1rem}
@media (max-width:640px){
 html body .v3 #stories .vids,html body .v3 #videos .vids{grid-template-columns:1fr;max-width:340px;gap:1.25rem}
}