feat(servicos): ofertas no topo de /servicos, capa por assunto e diagramas

/servicos abre com as 3 ofertas e depois outros serviços; H1 de criação de sites e de engenharia com o nome da oferta; capa de cada serviço pelo assunto (SEV fora do próprio case cai de ~11 para 2 imagens); diagrama de fluxo em SVG nos serviços sem case; cases com o que o cliente passou a poder fazer e contato logo depois de Como ficou; FAQ num componente só; lastmod por rota; ProfessionalService com areaServed.

app/cases/_components/CaseCapabilitiesSection.paths.test.tsx

@@ -0,0 +1,138 @@
+import { render, screen } from "@testing-library/react";
+import { getShowcaseAssets } from "@/lib/project-showcase";
+import { buttonLabels } from "@/lib/site-content";
+import { similarProjectSubject } from "@/lib/whatsapp";
+import { CaseCapabilitiesSection } from "./CaseCapabilitiesSection";
+import { getCaseMedia } from "./case-media";
+
+/**
+ * Testes de caminhos-base de CaseCapabilitiesSection: com itens e "Como ficou" (lista e botão), só com "Como ficou"
+ * (só o botão), só com itens (só a lista, sem repetir o botão que o fecho da página já traz) e sem nada (não aparece).
+ * A existência das capturas em disco é simulada em getCaseMedia.
+ */
+
+jest.mock("next/navigation", () => ({ usePathname: () => "/cases" }));
+jest.mock("./case-media", () => ({ getCaseMedia: jest.fn() }));
+
+const mockedGetCaseMedia = jest.mocked(getCaseMedia);
+
+const capabilities = [
+  "O dono muda os preços sem pedir a ninguém.",
+  "O cliente pede pelo WhatsApp com a mensagem pronta.",
+];
+const withSite = {
+  id: "projeto-teste",
+  title: "Projeto Teste",
+  demoUrl: "https://exemplo.com.br",
+};
+
+function messageOf(link: HTMLElement) {
+  return new URL(link.getAttribute("href") ?? "").searchParams.get("text");
+}
+
+beforeEach(() => {
+  mockedGetCaseMedia.mockReturnValue(undefined);
+});
+
+describe("CaseCapabilitiesSection", () => {
+  it("path: items and a site on the air -> the list under the client title, then the contact button", () => {
+    render(
+      <CaseCapabilitiesSection
+        caseStudy={{ ...withSite, capabilities }}
+        isClient
+      />,
+    );
+
+    expect(
+      screen.getByRole("heading", {
+        level: 2,
+        name: "O que o cliente passou a poder fazer",
+      }),
+    ).toBeVisible();
+    for (const item of capabilities) {
+      expect(screen.getByText(item)).toBeVisible();
+    }
+    const button = screen.getByRole("link", { name: buttonLabels.contact });
+    expect(button).toHaveAttribute("target", "_blank");
+    expect(button.className).toContain("bg-[var(--slash)]");
+    expect(messageOf(button)).toContain(
+      `Quero conversar sobre ${similarProjectSubject(withSite.title)}.`,
+    );
+    // o botão vem depois da lista
+    expect(
+      screen.getByText(capabilities[1]).compareDocumentPosition(button) &
+        Node.DOCUMENT_POSITION_FOLLOWING,
+    ).toBeTruthy();
+  });
+
+  it("path: a laboratory case with items -> the title does not talk about a client", () => {
+    render(
+      <CaseCapabilitiesSection
+        caseStudy={{ ...withSite, capabilities }}
+        isClient={false}
+      />,
+    );
+
+    expect(
+      screen.getByRole("heading", {
+        level: 2,
+        name: "O que dá para fazer com ele",
+      }),
+    ).toBeVisible();
+    expect(screen.queryByText(/o cliente passou a poder fazer/i)).toBeNull();
+  });
+
+  it("path: no items but a capture on disk (no site) -> only the contact button, under a heading that only screen readers get", () => {
+    mockedGetCaseMedia.mockImplementation((id, device) =>
+      id === "projeto-teste" ? getShowcaseAssets(id, device) : undefined,
+    );
+    const { container } = render(
+      <CaseCapabilitiesSection
+        caseStudy={{
+          id: "projeto-teste",
+          title: "Projeto Teste",
+          demoUrl: null,
+        }}
+        isClient
+      />,
+    );
+
+    expect(container.querySelector("ul")).toBeNull();
+    expect(
+      screen.getByRole("link", { name: buttonLabels.contact }),
+    ).toBeVisible();
+    expect(screen.getByRole("heading", { level: 2 })).toHaveClass("sr-only");
+  });
+
+  it("path: items but no 'Como ficou' -> the list stays and the button is not repeated", () => {
+    render(
+      <CaseCapabilitiesSection
+        caseStudy={{
+          id: "projeto-teste",
+          title: "Projeto Teste",
+          demoUrl: null,
+          capabilities,
+        }}
+        isClient
+      />,
+    );
+
+    expect(screen.getByText(capabilities[0])).toBeVisible();
+    expect(screen.queryByRole("link")).toBeNull();
+  });
+
+  it("path: no items and no 'Como ficou' -> renders nothing", () => {
+    const { container } = render(
+      <CaseCapabilitiesSection
+        caseStudy={{
+          id: "projeto-teste",
+          title: "Projeto Teste",
+          demoUrl: null,
+        }}
+        isClient
+      />,
+    );
+
+    expect(container).toBeEmptyDOMElement();
+  });
+});