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/OfferVideo.test.tsx

@@ -0,0 +1,70 @@
+import { act, render, waitFor } from "@testing-library/react";
+import { OfferVideo } from "./OfferVideo";
+
+/**
+ * O vídeo da peça 3D toca quando aparece (o IntersectionObserver do jest.setup avisa logo depois de observar) e fica
+ * parado no pôster com movimento reduzido ou "Economizar dados".
+ */
+
+const realMatchMedia = window.matchMedia;
+
+let play: jest.SpyInstance;
+let pause: jest.SpyInstance;
+
+beforeEach(() => {
+  play = jest
+    .spyOn(HTMLMediaElement.prototype, "play")
+    .mockResolvedValue(undefined);
+  pause = jest
+    .spyOn(HTMLMediaElement.prototype, "pause")
+    .mockImplementation(() => {});
+});
+
+afterEach(() => {
+  jest.useRealTimers();
+  jest.restoreAllMocks();
+  window.matchMedia = realMatchMedia;
+  Reflect.deleteProperty(navigator, "connection");
+});
+
+it("path: in view -> plays, muted and in a loop", async () => {
+  const { container } = render(<OfferVideo name="whatsapp" />);
+
+  await waitFor(() => expect(play).toHaveBeenCalled());
+  const video = container.querySelector("video") as HTMLVideoElement;
+  expect(video.muted).toBe(true);
+  expect(video.loop).toBe(true);
+});
+
+it("path: reduced motion -> never plays, stays on the poster", () => {
+  jest.useFakeTimers();
+  window.matchMedia = jest.fn().mockImplementation((query: string) => ({
+    matches: query === "(prefers-reduced-motion: reduce)",
+    media: query,
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+  }));
+  const { container } = render(<OfferVideo name="sistema" />);
+
+  // o aviso de "à vista" do IntersectionObserver chega num setTimeout
+  act(() => jest.runAllTimers());
+  expect(pause).toHaveBeenCalled();
+  expect(play).not.toHaveBeenCalled();
+  expect(container.querySelector("video")).toHaveAttribute(
+    "poster",
+    "/3d/peca-sistema.webp",
+  );
+});
+
+it("path: save data -> never plays", () => {
+  jest.useFakeTimers();
+  Object.defineProperty(navigator, "connection", {
+    configurable: true,
+    value: { saveData: true },
+  });
+  render(<OfferVideo name="sistema" />);
+
+  act(() => jest.runAllTimers());
+  expect(pause).toHaveBeenCalled();
+  expect(play).not.toHaveBeenCalled();
+});