/**
 * Legendas do mergulho do hero (as camadas da cena 3D, em linguagem simples) e o trecho do progresso do mergulho
 * (`--hero-p`, de 0 a 1) em que cada uma fica em cena. O Hero as escreve com `--from` e `--to` em cada item, e o CSS
 * (globals.css, `.hero-captions li`) as liga e desliga por esses dois valores: uma rampa de 1/14 de progresso para
 * entrar a partir de `from` e para sair até `to`.
 *
 * Os trechos seguem os estados da peça (`stateAt` em lib/blocos.ts: troca para a tela entre 0,16 e 0,30, para as
 * integrações entre 0,44 e 0,56 e para os dados entre 0,70 e 0,82, parada entre uma troca e outra): cada legenda entra
 * durante a troca para o seu estado (a da tela logo no começo dela, com o texto do hero saindo) e sai no meio da troca
 * seguinte. Assim o intervalo sem texto entre uma e outra é
 * de poucos pixels de rolagem, e a última passa de 1 para ficar em cena até Projetos subir e cobri-la.
 */
export const HERO_CAPTIONS = [
  {
    title: "A tela",
    text: "O que sua equipe e seus clientes usam no dia a dia.",
    from: 0.18,
    to: 0.49,
  },
  {
    title: "As integrações",
    text: "Os programas que você já usa conversando entre si, sem retrabalho.",
    from: 0.51,
    to: 0.75,
  },
  {
    title: "Os dados",
    text: "Suas informações guardadas, organizadas e seguras.",
    from: 0.79,
    to: 1.07,
  },
] as const;