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

@@ -49,7 +49,7 @@ class FakeObserver {
 const hero = () => document.getElementById("hero-contact-cta") as Element;
 const contact = () => document.getElementById("contact") as Element;
 const floatingLink = () =>
-  screen.queryByRole("link", { name: "Conversar no WhatsApp" });
+  screen.queryByRole("link", { name: "Chamar no WhatsApp" });
 
 beforeEach(() => {
   resetNavigation();
@@ -221,7 +221,7 @@ describe("FloatingWhatsApp: conteúdo e cliques", () => {
 });
 
 describe("FloatingWhatsApp com a barra de cookies aberta", () => {
-  it("path: the bar publishes its height while open and removes it once a choice is made", async () => {
+  it("path: the bar marks <html> while open, which hides the button by CSS, and drops the mark once a choice is made", async () => {
     const user = userEvent.setup();
     localStorage.clear();
     Object.defineProperty(HTMLElement.prototype, "offsetHeight", {
@@ -237,12 +237,16 @@ describe("FloatingWhatsApp com a barra de cookies aberta", () => {
       );
       const refuse = await screen.findByRole("button", { name: "Recusar" });
 
-      // o botão flutuante usa a variável publicada pela barra para subir
+      // a barra publica a altura (o menu do celular a usa) e marca o <html>; o botão flutuante some por CSS com a marca
       expect(
         document.documentElement.style.getPropertyValue("--cookie-bar-height"),
       ).toBe("72px");
-      expect(floatingLink()?.parentElement?.className).toContain(
-        "var(--cookie-bar-height,0px)",
+      expect(document.documentElement).toHaveAttribute(
+        "data-cookie-bar",
+        "open",
+      );
+      expect(floatingLink()?.parentElement).toHaveClass(
+        "[[data-cookie-bar=open]_&]:hidden",
       );
 
       await user.click(refuse);
@@ -250,6 +254,7 @@ describe("FloatingWhatsApp com a barra de cookies aberta", () => {
       expect(
         document.documentElement.style.getPropertyValue("--cookie-bar-height"),
       ).toBe("");
+      expect(document.documentElement).not.toHaveAttribute("data-cookie-bar");
       expect(floatingLink()).toBeInTheDocument();
     } finally {
       Reflect.deleteProperty(HTMLElement.prototype, "offsetHeight");