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/servicos/_components/ServiceOfferCards.paths.test.tsx

@@ -113,4 +113,35 @@ describe("ServiceOfferCards", () => {
     for (const { proof } of serviceOffers)
       for (const id of proof.caseIds) expect(known.has(id)).toBe(true);
   });
+
+  it.each([
+    // cinco ofertas (as de hoje): 3 + 2, os dois da última linha dividem a linha
+    [5, ["2", "2", "2", "3", "3"]],
+    // quatro: 3 + 1, o que sobra ocupa a linha inteira
+    [4, ["2", "2", "2", "6"]],
+    // três: uma linha cheia
+    [3, ["2", "2", "2"]],
+  ])(
+    "path: %i offers -> no empty cell on the last row of the 6-column grid",
+    (count, spans) => {
+      const ids: ServiceOffer["id"][] = [
+        "site",
+        "sistema",
+        "whatsapp",
+        "revisao",
+        "fiscal",
+      ];
+      const offers = ids
+        .slice(0, count)
+        .map((id): ServiceOffer => ({ ...offer({}), id }));
+      const { container } = render(<ServiceOfferCards offers={offers} />);
+
+      expect(container.firstElementChild).toHaveClass("lg:grid-cols-6");
+      expect(
+        Array.from(container.querySelectorAll("article")).map(
+          (card) => card.className.match(/lg:col-span-(\d)/)?.[1],
+        ),
+      ).toEqual(spans);
+    },
+  );
 });