feat(site): blocos 3D da marca, novas ofertas e hero mais abrangente

Hero e movimento
- cena 3D em tempo real com os blocos da marca (kit feito no Blender, 3d/blocos.py):
  marca, tela, integrações e dados; segue a rolagem, tem vida em repouso, reage ao
  cursor e, parada no topo, passa sozinha pelos estados com legenda
- três níveis de aparelho (full, lite, static); sem WebGL fica o pôster
- título novo: "Sites e sistemas sob medida para o jeito que a sua empresa trabalha."
- faixa de clientes com o ramo, linha do primeiro passo, hero alinhado às seções
- rótulos digitados, entrada dos blocos, cortina de blocos entre páginas e capa
  compartilhada entre a lista de cases e o case

Ofertas
- atendimento no WhatsApp com IA e nota fiscal para a reforma tributária
  (páginas de serviço, cartões da home, formulário e aviso com data de validade)
- página /ia atualizada, com fontes
- peças 3D em loop nos cartões e topos de página (3d/pecas.py)

Design
- hover por papel (bloco nos botões, barra nos links), rótulos sem caixa alta
- um destino por rótulo: "Falar sobre meu projeto" leva ao formulário,
  "Chamar no WhatsApp" abre o WhatsApp
- logo montado em blocos, 404 redesenhado, grades sem célula vazia
- ícones do PWA e manifesto novos

Specs em specs/, contexto de design em DESIGN.md e PRODUCT.md.

specs/2026-11-10-hero-abrangente.md

@@ -0,0 +1,58 @@
+# Hero mais abrangente
+**Autor:** Evandro · **Data:** 2026-11-10 · **Porte:** médio · **Status:** concluída
+
+## 1. Objetivo
+O título do hero fala de dois casos (pedido pelo WhatsApp e planilha). Quem não tem esses dois problemas entende que o trabalho se resume a isso. O hero passa a dizer o trabalho inteiro, e a peça de blocos passa a mostrar a amplitude sem depender da rolagem.
+
+## 2. Escopo
+Dentro: texto do hero, faixa de clientes, linha do primeiro passo, alinhamento e tamanho da peça, duração da entrada, ciclo da peça em repouso com legenda.
+Fora: seções abaixo do hero, cartões de oferta (continuam específicos), o número "5 anos de experiência" (segue vindo do resumo do portfólio), região no rótulo.
+
+## 3. Critérios de aceite
+- CA1 (texto): o h1 é "Sites e sistemas sob medida para o jeito que a sua empresa trabalha.", com "sob medida" em lima; o apoio é "Do site institucional ao sistema que a sua equipe usa todo dia. Você fala com quem desenvolve."; nenhum outro lugar do site repete o título antigo → `grep` e `pnpm test`.
+- CA2 (primeiro passo): abaixo dos botões há a linha "Começa com uma conversa para entender o seu caso. A proposta vem por escrito."; o hero continua cabendo no palco fixo em 1440×900, 1280×720, 1024×768, 390×844 e 360×640 → inspeção.
+- CA3 (clientes): em tela de 640 px ou mais, cada cliente mostra o ramo abaixo do nome; os nomes continuam levando ao case → `pnpm test -- ClientStrip`.
+- CA4 (composição): de 1024 px em diante o texto do hero começa na mesma coluna do conteúdo das outras seções; a peça fica 20% maior e mais perto do texto, sem cobri-lo → medida de `getBoundingClientRect` em 1440 e 1280.
+- CA5 (entrada): texto, botões e faixa assentam em até 1,8 s → medida do fim da última animação do hero.
+- CA6 (peça em repouso): no nível `full`, parada no topo, a peça passa sozinha por marca, tela, integrações e dados; qualquer rolagem devolve o comando à rolagem; abaixo da peça uma legenda digitada diz o que ela está montando; com movimento reduzido ou sem WebGL não há ciclo nem legenda → `pnpm test -- BlocosScene lib/blocos` e inspeção com GPU.
+- CA7: Biome, typecheck, `pnpm test`, build e e2e verdes.
+
+## 4. Contexto verificado
+- Título e destaque: `app/components/Hero.tsx:41-52` (`ACCENT`, `TITLE`); apoio em `Hero.tsx:111-114`.
+- Faixa de clientes: `app/components/ClientStrip.tsx` (nomes com link para `/cases/<id>`, anos na mesma linha); lista em `app/page.tsx` (`clientNames`).
+- Hero em `max-w-[max(1400px,var(--shell))]` com `lg:px-sp-12` (`Hero.tsx:86`): em 1440 px o texto começa em x=68; as seções usam `.ds-section-shell` (`globals.css:257`), que começa em x=100.
+- Peça: `.hero-piece` (`globals.css:796-815`), `width: min(46%, 680px)` de 1024 px em diante; a cena segue essa caixa (`HeroField.tsx`).
+- Entrada: `.hero-word` 1,1 s com atraso de 0,12 s + 45 ms por palavra; `.hero-in` 1 s com `--d` de até 0,75 s (`globals.css:873-914`). O júri mediu 2,6 s até assentar.
+- Estados da peça por rolagem: `stateAt` em `lib/blocos.ts`; no nível `lite` a troca já é automática (`BlocosScene.tsx:369-373`).
+- Ramos: SEV Moda Íntima é "loja virtual" e Lavação 047 é "lavação automotiva" (`public/portfolio-data.json`); a AS Serviços "reúne engenharia física e software" (`lib/site-content.ts:954`); Julia Beauty é "estúdio de extensão de cílios" (`portfolio-data.json`).
+- Legendas do mergulho já existentes: `app/components/hero-captions.ts` ("A tela", "As integrações", "Os dados").
+
+## 5. Desenho
+- Ramos, em um só lugar (ao lado de `clientNames`): sev-modaintima "loja virtual"; lavacao-047 "lavação automotiva"; sc-plus "aquicultura"; as-servicos "engenharia e software"; julia-beauty "estúdio de cílios".
+- Faixa de clientes de 640 px em diante: cada cliente é um par empilhado, nome (15 px, link) sobre ramo (13 px, apagado). Abaixo disso, só os nomes, como hoje.
+- Legenda da peça: marca sem legenda; tela "Sites e sistemas"; integrações "Integrações"; dados "Painéis e dados". Quadrado lima antes do texto, como no rótulo do hero; decorativa (`aria-hidden`).
+- Ciclo em repouso (`full`): começa 3 s depois da entrada, com a página no topo; cada estado fica uns 3 s; a troca usa a transição que já existe; a rolagem assume na hora e o ciclo só volta depois de 3 s parado no topo.
+
+## 6. Restrições, riscos, suposições
+- Só `transform`, `opacity`, `clip-path`; sem biblioteca nova; o título continua sendo o LCP.
+- Risco: a linha nova e o ramo aumentam a altura do hero; o título novo é mais curto, mas o palco fixo do celular é apertado. Se não couber em 360×640, a linha do primeiro passo fica só de 640 px em diante.
+- Suposição: os ramos acima; o usuário viu a lista e mandou seguir, com a AS Serviços corrigida pelo texto do próprio site.
+
+## 7. Microtasks
+### T1 — texto, faixa, primeiro passo, alinhamento e entrada
+- Serve: CA1 a CA5 · Arquivos: `Hero.tsx`, `ClientStrip.tsx`, `app/page.tsx`, parte do hero em `globals.css`, testes e e2e que citam o título
+- [x] feito
+### T2 — ciclo em repouso e legenda da peça
+- Serve: CA6 · Arquivos: `BlocosScene.tsx`, `HeroField.tsx`, `lib/blocos.ts`, testes
+- [x] feito
+### CP1
+- Verificar: CA7 e inspeção com GPU em 1440×900 e 390×844.
+
+## 8. Registro
+2026-11-10 — T1 entregue: título, apoio, linha do primeiro passo, faixa com ramo (`CLIENT_SECTORS` em `lib/proof.ts`), hero na coluna das seções (x=100 em 1440, 64 em 1280, 61 em 1024), peça em `min(55.2cqw, 816px)`, entrada assentando em 1,37 s no computador e 1,5 s no celular; título em 3 linhas no computador e 4 no celular. Abaixo de 1024 px o alinhamento não muda.
+2026-11-10 — desvio: as descrições do `layout.tsx`, do `manifest.ts` e da imagem de compartilhamento repetiam o posicionamento antigo e foram trocadas pelo novo. O teste `home-positioning.test.ts` proibia "sob medida" (posicionamento de antes do WhatsApp e da planilha); passou a exigir o título novo, porque a escolha do usuário foi a opção com "sob medida".
+2026-11-10 — T2 entregue: `cicloAt`, `seguir`, `caixaDosEstados` e `legendaDe` em `lib/blocos.ts`; ciclo de 3 s por estado no `full`, parado no topo; legenda digitada só de 1024 px em diante (em 390 e 360 px encostava no título). No ciclo, tela, integrações e dados ocupam 78% da caixa da peça, porque na caixa inteira encostavam no título. Tempo de quadro medido com GPU: média de 0,17 ms. Pendência anotada: em tela de computador com menos de 700 px de altura não há mergulho e o ciclo roda com a página rolada enquanto o hero está à vista.
+2026-11-10 — ajustes depois da revisão visual: "sob medida" não quebra mais entre as duas palavras; para o título seguir em 3 linhas no computador, o tamanho passou a acompanhar a largura da coluna (54 px em 1440, 39 px em 1024). Em 1440 os dois botões e o link do WhatsApp ficam na mesma linha, a 33 px da peça; em 1280 o link continua na linha de baixo, porque ficaria a 3 px do desenho.
+2026-11-10 — a legenda entrava no começo da troca, por cima dos blocos da marca; agora só entra com a peça assentada e sai quando a troca seguinte começa. Medido com GPU em 1440×900 e 1280×720: nenhum pixel da cena atrás da legenda nos três estados.
+2026-11-10 — LCP depois da mudança, no build de produção: o h1, em 228 ms no computador com GPU e 88 ms em 390 px sem limite de rede; CLS 0.
+2026-11-10 — CP1: Biome e typecheck sem erro, 154 suítes e 1681 testes, build sem erro, e2e 60 de 60 sobre `pnpm start -p 3001` (servidor encerrado depois). Não houve novo júri nem teste em celular real.