/* Testimonials: native media controls, readable results at every viewport. */
.voices { padding-block: clamp(56px,7vw,104px); background: var(--color-lavender); color: var(--color-ink); }
.voices .voices-heading { max-width: 900px; margin-bottom: 36px; }
.voices .voices-heading h2 { font-family: var(--font-display); font-size: clamp(28px,3.4vw,48px); line-height: 1.2; letter-spacing: -.04em; margin: 16px 0 20px; }
.voices .voices-heading p { font-size: 18px; line-height: 1.6; }
.voices .voice-track { display:flex; gap:14px; position:relative; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:none; padding:8px 2px 14px; align-items:stretch; }
.voices .voice-track::-webkit-scrollbar { display:none; width:0; height:0; }
.voices .voice-track > article { min-height:460px; border:1px solid var(--color-line-soft); scroll-snap-align:start; flex-shrink:0; border-radius:var(--radius-card); background:var(--color-paper-raised); overflow:hidden; }
.voices .voice-film { display:grid; grid-template-columns:250px minmax(0,300px); width:550px; }
.voices .voice-film-media { background:var(--color-ink); display:flex; min-width:0; }
.voices video { display:block; width:100%; height:100%; min-height:460px; object-fit:contain; }
.voices .voice-film-copy { display:flex; flex-direction:column; gap:22px; padding:26px 24px; min-width:0; }
.voices .voice-film-tag { font-size:14px; line-height:1.5; font-weight:700; }
.voices blockquote { font-family:var(--font-body); font-size:18px; line-height:1.55; font-weight:500; margin:0; }
.voices .voice { width:300px; padding:26px; display:flex; flex-direction:column; gap:24px; }
.voices .quote-mark { font-family:Georgia,serif; font-size:56px; line-height:.8; }
.voices .voice-metric { display:grid; gap:6px; padding-top:20px; border-top:1px solid var(--color-line); }
.voices .voice-metric strong { font-family:var(--font-display); font-size:36px; line-height:1.2; }
.voices .voice-metric span { font-size:16px; line-height:1.5; }
.voices .voice-metric .voice-metric-label { font-size:14px; }
.voices .person { display:flex; align-items:center; gap:12px; margin-top:auto; }
.voices .avatar { display:grid; place-items:center; width:46px; height:46px; flex:0 0 46px; border-radius:50%; overflow:hidden; background:var(--color-lavender); font-size:16px; }
.voices .avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.voices .person strong,.voices .person span:not(.avatar) { display:block; font-size:14px; line-height:1.5; }
.voices .person strong { font-size:16px; }
.voices .voice-controls { display:flex; gap:10px; align-items:center; margin-top:12px; }
.voices .voice-arrow { display:grid; place-items:center; transition:background-color 160ms ease-out,transform 160ms ease-out; width:48px; height:48px; border:1px solid var(--color-ink); border-radius:50%; background:var(--color-paper-raised); color:var(--color-ink); font-size:24px; cursor:pointer; }
@media(hover:hover) { .voices .voice-arrow:hover { background:var(--color-mint); } }
.voices .voice-arrow:active { transform:scale(.94); }
.voices .voice-arrow:disabled { opacity:.35; cursor:default; }
.voices .voice-count { font-size:14px; margin-left:10px; color:var(--color-muted); font-variant-numeric:tabular-nums; }
.voices :focus-visible { outline:3px solid var(--color-ink); outline-offset:3px; }
@media(max-width:700px) {
 .voices .voice-track { gap:16px; }
 .voices .voice-film,.voices .voice { width:calc(100% - 24px); }
 .voices .voice-film { grid-template-columns:1fr; }
 .voices video { height:340px; min-height:0; }
 .voices .voice-film-copy,.voices .voice { padding:24px; }
 .voices blockquote { font-size:18px; }
}

@media(prefers-reduced-motion:reduce) { .voices .voice-arrow { transition:none; } .voices .voice-arrow:active { transform:none; } }