/* 09 · EQUIPE · prefixo .eqp
   Quatro cofundadores em cartões (retrato, cargo, nome, descrição completa, logos) e o advisor numa faixa menor.
   Enquadramento: cada .eqp-retrato traz --s (escala), --x e --y (deslocamento) para os olhos e as
   cabeças ficarem alinhados. As fotos têm 320 px: o retrato fica em 128 px (96 no celular, 72 no advisor)
   para continuar nítido em tela de densidade 2. Só aumentar com arquivos maiores.
   Movimento (só sob html.mov): cortina de 15° em sequência (preto primeiro, a foto logo atrás),
   foto com paralaxe dentro da máscara, e o retrato "vivo" (ponteiro ou .eqp-viva no toque):
   aproxima, acompanha o cursor, um fio laranja de 15° cruza a foto e a frase sobe. */
.eqp{--eqp-e:cubic-bezier(.16,1,.3,1)}
.eqp .secao-cab{margin-bottom:clamp(32px,4vw,56px)}

.eqp .secao-cab .t-lead{margin-top:var(--e-4)}

/* cofundadores: uma coluna no celular, duas no tablet, quatro no desktop */
.eqp-lista{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--e-12) var(--calha)}
.eqp-pessoa{min-width:0}
.eqp-lista .eqp-pessoa{display:flex;flex-direction:column}
.eqp-retrato{position:relative;width:100%;max-width:128px;aspect-ratio:1;overflow:hidden;border-radius:var(--r-moldura);background:var(--texto)}
.eqp-foto{width:100%;height:100%}
.eqp-foto img{width:100%;height:100%;object-fit:cover;transform:translate(var(--x,0),var(--y,0)) scale(var(--s,1))}
.eqp-txt{display:flex;flex-direction:column;flex:1}
.eqp-cargo{margin-top:var(--e-6);transition:color 300ms var(--curva-entrada)}
.eqp-nome{margin-top:var(--e-2)}
.eqp-linha{margin-top:var(--e-3);font-size:1rem;line-height:1.5;color:var(--texto-2);text-wrap:pretty}
/* logos: uma cor só (filtro), todas na mesma altura, presas ao pé do cartão */
.eqp-logos{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-3) var(--e-6);margin-top:auto;padding-top:var(--e-6)}
.eqp-logos li{display:flex;align-items:center;height:28px}
.eqp-logo{--h:22px;display:block;height:var(--h);width:calc(var(--h)*var(--r,4));object-fit:contain;filter:brightness(0);opacity:.7}
.eqp-lista .eqp-logos{border-top:1px solid var(--linha);margin-top:auto}
.eqp-lista .eqp-linha{margin-bottom:var(--e-6)}

/* advisor: secundário. Faixa baixa, retrato pequeno, texto menor */
.eqp-apoio{margin-top:clamp(40px,5vw,72px);padding-top:var(--e-6);border-top:1px solid var(--linha)}
.eqp-adv{display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--e-4) var(--e-6);align-items:center}
.eqp-adv .eqp-txt{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--e-1)}
.eqp-adv .eqp-cargo,.eqp-adv .eqp-nome,.eqp-adv .eqp-linha{margin-top:0}
.eqp-adv .eqp-nome{font-size:1.125rem;letter-spacing:-.02em}
.eqp-adv .eqp-linha{font-size:var(--t-pequeno);line-height:1.45}
.eqp-adv .eqp-logos{margin-top:var(--e-2);padding-top:0}


/* celular: retrato pequeno ao lado do cargo e do nome; descrição e logos na largura toda */
@media (max-width:559px){
  .eqp-lista{gap:var(--e-8)}
  .eqp-lista .eqp-pessoa{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:var(--e-4);padding-bottom:var(--e-8);border-bottom:1px solid var(--linha)}
  .eqp-lista .eqp-pessoa:last-child{padding-bottom:0;border-bottom:0}
  .eqp-lista .eqp-txt{display:contents}
  .eqp-lista .eqp-retrato{grid-row:1/3;align-self:center}
  .eqp-lista .eqp-cargo{grid-column:2;margin-top:0;align-self:end}
  .eqp-lista .eqp-nome{grid-column:2;align-self:start}
  .eqp-lista .eqp-linha{grid-column:1/-1;margin-top:var(--e-4);margin-bottom:0}
  .eqp-lista .eqp-logos{grid-column:1/-1;border-top:0;padding-top:var(--e-4)}
}
@media (min-width:560px){
  .eqp-lista{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:900px){
  /* advisor numa linha só: retrato, cargo e nome, frase, logo */
  .eqp-adv{grid-template-columns:72px minmax(0,1fr)}
  .eqp-adv .eqp-txt{grid-template-columns:minmax(0,15rem) minmax(0,1fr) auto;column-gap:var(--e-8);align-items:center}
  .eqp-adv .eqp-cargo{grid-column:1;grid-row:1}
  .eqp-adv .eqp-nome{grid-column:1;grid-row:2}
  .eqp-adv .eqp-linha{grid-column:2;grid-row:1/3}
  .eqp-adv .eqp-logos{grid-column:3;grid-row:1/3;margin-top:0}
}
@media (min-width:1100px){
  .eqp-lista{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ---------- entrada: cortina de 15° em sequência ---------- */
.mov .eqp-retrato.cortina[data-vista]{transition-delay:calc(var(--i,0)*110ms)}
/* a foto vem 160 ms atrás do preto e assenta de 1,3 para 1 (propriedade scale, independente do transform) */
.mov .eqp-foto{clip-path:polygon(0 0,127% 0,100% 100%,0 100%);
  transform:translate3d(calc(var(--mx,0)*-2.4%),calc((var(--p,.5) - .5)*-6% + var(--my,0)*-2.4%),0) scale(var(--z,1.04));
  transition:transform 900ms var(--eqp-e),clip-path 1100ms cubic-bezier(.65,0,.35,1) calc(var(--i,0)*110ms + 160ms),scale 1700ms var(--eqp-e) calc(var(--i,0)*110ms + 160ms)}
.mov .eqp-retrato:not(.na-vista) .eqp-foto{clip-path:polygon(0 0,0 0,-27% 100%,0 100%);scale:1.12}
/* o polígono fechado da cortina ainda deixa um fio de 1 px: some até a entrada */
.mov .eqp-retrato:not(.na-vista){opacity:0}
/* nome, cargo e frase sobem depois da cortina */
.mov .eqp-retrato:not(.na-vista)+.eqp-txt>*{opacity:0}
.mov .eqp-retrato.na-vista+.eqp-txt>*{animation:eqp-sobe 900ms var(--eqp-e) backwards;animation-delay:calc(var(--i,0)*110ms + 420ms)}
.mov .eqp-retrato.na-vista+.eqp-txt>:nth-child(2){animation-delay:calc(var(--i,0)*110ms + 490ms)}
.mov .eqp-retrato.na-vista+.eqp-txt>:nth-child(3){animation-delay:calc(var(--i,0)*110ms + 560ms)}
.mov .eqp-retrato.na-vista+.eqp-txt>:nth-child(4){animation-delay:calc(var(--i,0)*110ms + 630ms)}
@keyframes eqp-sobe{from{opacity:0;transform:translate3d(-4px,16px,0)}}

/* ---------- retrato vivo ---------- */
/* fio laranja de 15° que cruza a foto uma vez, na chegada do ponteiro (na saída volta sem transição) */
.mov .eqp-retrato::after{content:"";position:absolute;inset:0;pointer-events:none;transform:translate3d(-80%,0,0);
  background:linear-gradient(105deg,transparent calc(50% - 1.5px),var(--marca) calc(50% - 1.5px) calc(50% + 1.5px),transparent calc(50% + 1.5px))}
.mov-ponteiro .eqp-pessoa:hover .eqp-retrato::after,.mov .eqp-viva .eqp-retrato::after{transform:translate3d(80%,0,0);transition:transform 900ms cubic-bezier(.65,0,.35,1)}
.mov-ponteiro .eqp-pessoa:hover .eqp-foto,.mov .eqp-viva .eqp-foto{--z:1.08}
.mov-ponteiro .eqp-pessoa:hover .eqp-cargo,.mov .eqp-viva .eqp-cargo{color:var(--acento)}

.mov-ponteiro .eqp-pessoa{transition:opacity 400ms var(--curva-entrada)}
.mov-ponteiro .eqp-lista:has(.eqp-pessoa:hover) .eqp-pessoa:not(:hover){opacity:.5}
.mov-ponteiro .eqp-linha{transform:translate3d(0,6px,0);opacity:.8;transition:transform 600ms var(--eqp-e),opacity 400ms var(--curva-entrada)}
.mov-ponteiro .eqp-pessoa:hover .eqp-linha{transform:none;opacity:1}