/* Thumbnail-led client stories, in the site's black, white and red identity. */
#testimonials{background:var(--bg);color:var(--fg);padding:48px var(--pad) 80px;scroll-margin-top:80px}
.testimonial-gallery{max-width:1200px;margin-inline:auto}
.testimonial-selector{display:flex;align-items:flex-end;gap:clamp(14px,2.2vw,30px);height:320px;overflow-x:auto;overflow-y:hidden;padding:0 4px 12px;scrollbar-width:none}
.testimonial-selector::-webkit-scrollbar{display:none}
.testimonial-thumb{position:relative;display:block;flex:0 0 clamp(78px,10vw,132px);width:clamp(78px,10vw,132px);height:42%;padding:0;background:#252525;text-align:left;transition:height .3s cubic-bezier(.16,1,.3,1),flex-basis .3s cubic-bezier(.16,1,.3,1);cursor:pointer}
.testimonial-thumb img{width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:grayscale(1);pointer-events:none}
.testimonial-thumb.is-selected{height:100%;flex-basis:240px;width:240px;margin-right:28px;border-bottom:4px solid var(--red);background:#191919}
.testimonial-thumb.is-selected img{height:100%}
.testimonial-video-template{position:absolute;inset:0;display:block;background:#191919;color:#fff;overflow:hidden}
.testimonial-template-still{position:absolute;inset:0;display:block;overflow:hidden;background:#191919}
.testimonial-template-still img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.testimonial-thumb .testimonial-video-template--mohab img{height:128%;object-position:center top}
.testimonial-marker{position:absolute;left:calc(100% + 12px);top:0;writing-mode:vertical-rl;font:600 16px/1 var(--sans);color:var(--fg)}
.testimonial-thumb-play{position:absolute;left:50%;top:50%;display:grid;place-items:center;transform:translate(-50%,-50%);width:40px;height:40px;background:#d50000;color:#fff;border-radius:50%}
.testimonial-thumb-play svg{margin-left:3px;width:16px;height:16px}
.testimonial-thumb.is-selected .testimonial-thumb-play{width:44px;height:44px}
.testimonial-thumb.is-selected .testimonial-thumb-play svg{width:18px;height:18px}
.testimonial-thumb:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.testimonial-selected{margin-top:28px;max-width:880px}
.testimonial-selected h3{margin:0;font:600 clamp(20px,2vw,28px)/1.2 var(--sans);text-transform:uppercase;letter-spacing:-.02em}
.testimonial-role{margin:6px 0 0;font:400 clamp(16px,1.6vw,21px)/1.4 var(--sans);color:var(--mute)}
.testimonial-summary{margin:20px 0 0;max-width:36ch;font:500 clamp(24px,2.8vw,38px)/1.35 var(--sans);letter-spacing:-.025em;text-wrap:pretty}
.testimonial-watch{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:24px;font:500 14px/1.3 var(--sans);text-decoration:underline;text-underline-offset:5px}
.testimonial-watch svg{color:var(--red)}
.testimonial-watch:focus-visible{outline:2px solid var(--red);outline-offset:4px}
@media(hover:hover) and (pointer:fine){.testimonial-thumb:hover img{filter:grayscale(0)}.testimonial-watch:hover{color:var(--red)}}
@media(max-width:600px){
 .testimonial-selector{height:248px;gap:12px;margin-right:calc(-1 * var(--pad));padding-right:var(--pad)}
 .testimonial-thumb{flex-basis:15vw;width:15vw;height:40%}
 .testimonial-thumb.is-selected{flex-basis:34vw;width:34vw;margin-right:22px}
 .testimonial-marker{left:calc(100% + 10px);font-size:14px}
 .testimonial-selected{margin-top:28px}
 .testimonial-summary{margin-top:18px;font-size:25px}
}
.testimonial-fallback{display:grid;gap:40px}.testimonial-fallback article{max-width:760px}.testimonial-fallback img{width:140px;height:190px;object-fit:cover;filter:grayscale(1);margin-bottom:20px}.testimonial-fallback h3{font-size:22px}.testimonial-fallback p{margin-top:12px;line-height:1.5}
.testimonial-dialog{padding:0;border:1px solid #ffffff30;border-radius:12px;background:#151515;color:white;width:min(800px,calc(100vw - 32px));max-height:calc(100svh - 32px);overflow:auto;font-family:var(--sans)}
.testimonial-dialog::backdrop{background:#000d}
.testimonial-dialog-content{padding:20px}
.testimonial-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.testimonial-dialog-header h2{font-size:18px;font-weight:500}
.testimonial-dialog-header button{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:50%;background:#ffffff16}
.testimonial-dialog video{width:100%;max-height:70svh;background:black;object-fit:contain}
.testimonial-dialog-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:16px}
.testimonial-dialog a{display:inline-block;font-size:13px}
.testimonial-youtube{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.testimonial-youtube iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media(prefers-reduced-motion:reduce){.testimonial-thumb{transition:none}}
