/* ---------- MOSAICO DE DEPOIMENTOS (duas linhas, sentidos opostos, loop infinito) ---------- */
.depo-mosaico{
  margin-top:40px;display:flex;flex-direction:column;gap:8px;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
}
.depo-linha{
  overflow:hidden;scrollbar-width:none;-ms-overflow-style:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.depo-linha::-webkit-scrollbar{display:none;width:0;height:0}
.depo-trilha{
  display:flex;align-items:center;gap:10px;width:max-content;
  /* !important vence o `*{animation:none!important}` do reduced-motion global da página:
     aqui o movimento é o próprio conteúdo, e o hover pausa para quem precisar ler com calma */
  animation:depo-rolar 120s linear infinite!important;
}
.depo-trilha--reversa{animation-direction:reverse!important}
.depo-linha:hover .depo-trilha{animation-play-state:paused!important}
.depo-trilha img{
  /* prints de conversa (retrato): altura generosa, largura segue a proporção natural */
  height:560px;width:auto;flex:none;
  border-radius:14px;border:1px solid var(--linha);
  object-fit:cover;background:var(--creme-2);
}
.depo-trilha img.depo-larga{
  /* prints de comentário (paisagem): altura menor pra não dominar a fileira */
  height:210px;
}
@keyframes depo-rolar{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}
@media(max-width:900px){
  .depo-trilha{gap:6px;animation-duration:80s!important}
  .depo-trilha img{height:400px;border-radius:10px}
  .depo-trilha img.depo-larga{height:150px}
}