feat(home): ofertas que vendem o título, WhatsApp no hero e menu do celular acessível

Três ofertas (site que traz pedidos pelo WhatsApp, sistema para tirar a operação da planilha, revisão de sistema existente) com miniatura e formulário com o tipo escolhido; botão principal do hero abre o WhatsApp; moldura da SEV no hero do celular; menu fecha ao navegar, Esc, foco preso incluindo a barra de cookies e espaço para ela; CinematicHome como componente de servidor com ilha cliente; /ia com H1 de oferta e cartão do que você recebe; botão flutuante em aside com transform; AVIF antes de WebP; copy sem repetir contato direto.

app/components/FloatingWhatsApp.test.tsx

@@ -119,6 +119,31 @@ it("lifts itself by the height of the open cookie bar", () => {
   );
 });
 
+it("lifts with a transform, not by animating `bottom`, so the layout does not shift", () => {
+  render(<Page />);
+  setVisibility(false, false);
+
+  const className = floatingLink()?.parentElement?.className ?? "";
+  expect(className).toContain("-translate-y-[var(--cookie-bar-height,0px)]");
+  expect(className).toContain("transition-transform");
+  expect(className).toContain("motion-reduce:transition-none");
+  // o `bottom` fica fixo (margem e área segura) e a barra de cookies não entra nele
+  expect(className).not.toContain("transition-[bottom]");
+  expect(className).toContain(
+    "bottom-[calc(var(--sp-4)+env(safe-area-inset-bottom))]",
+  );
+});
+
+it("sits in a named complementary region (the 'region' landmark rule), which only exists while the shortcut shows", () => {
+  render(<Page />);
+  expect(screen.queryByRole("complementary")).toBeNull();
+
+  setVisibility(false, false);
+  const region = screen.getByRole("complementary", { name: "Contato rápido" });
+  expect(region.tagName).toBe("ASIDE");
+  expect(region).toContainElement(floatingLink());
+});
+
 it("reports the click as a floating WhatsApp handoff", () => {
   render(<Page />);
   setVisibility(false, false);