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.

app/components/ClientStrip.test.tsx

@@ -55,11 +55,11 @@ it("shows only the experience when there are no clients, and nothing without eit
   expect(none.container).toBeEmptyDOMElement();
 });
 
-it("gives every client link a touch target of at least 44 px (min-h-11)", () => {
+it("gives every client link 44 px of touch target on the phone (min-h-11) and 24 px from 640 px on, where the sector shares the item", () => {
   render(<ClientStrip clients={clients} />);
 
   for (const link of screen.getAllByRole("link")) {
-    expect(link).toHaveClass("min-h-11");
+    expect(link).toHaveClass("min-h-11", "sm:min-h-6");
   }
 });
 
@@ -107,3 +107,30 @@ it("keeps the years number in the display font (the mono font is not downloaded
 
   expect(screen.getByText("5").className).not.toContain("font-mono");
 });
+
+it("stacks the sector under each name from 640 px on, outside the link, and shows only the name for a client without one", () => {
+  render(
+    <ClientStrip
+      clients={[
+        {
+          id: "sev-modaintima",
+          name: "SEV Moda Íntima",
+          sector: "loja virtual",
+        },
+        { id: "lavacao-047", name: "Lavação 047" },
+      ]}
+    />,
+  );
+
+  const sector = screen.getByText("loja virtual");
+  // 13 px e apagado, e só de 640 px em diante (abaixo, só os nomes)
+  expect(sector).toHaveClass("text-[13px]", "max-sm:hidden");
+  const link = screen.getByRole("link", { name: "SEV Moda Íntima" });
+  expect(link).not.toContainElement(sector);
+  expect(link.parentElement).toContainElement(sector);
+  expect(link.parentElement).toHaveClass("flex-col");
+  // o nome continua levando ao case
+  expect(link).toHaveAttribute("href", "/cases/sev-modaintima");
+  const plain = screen.getByRole("link", { name: "Lavação 047" });
+  expect(plain.parentElement?.childElementCount).toBe(1);
+});