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

@@ -1,11 +1,11 @@
 import { render } from "@testing-library/react";
 import type { ComponentProps } from "react";
-import { clientCases } from "@/lib/site-content";
+import { clientCasesForListing as clientCases } from "@/lib/site-content";
 import CasesPage from "./page";
 
 /**
- * Carregamento da lista de cases: o primeiro pôster do mosaico do topo (a maior imagem acima da dobra) carrega na hora
- * e com prioridade alta, as capas dos cartões são preguiçosas, e os links não pré-carregam as páginas dos cases sozinhos.
+ * Carregamento da lista de cases: sem mosaico no topo, a capa do primeiro cartão (a maior imagem acima da dobra) carrega
+ * na hora e com prioridade alta, as outras capas são preguiçosas, e os links não pré-carregam as páginas dos cases sozinhos.
  */
 
 type LinkProps = ComponentProps<typeof import("next/link").default>;
@@ -40,26 +40,20 @@ function coverImages(container: HTMLElement) {
 }
 
 describe("CasesPage: carregamento das capas", () => {
-  it("loads the first mosaic poster at once with high priority, and every other image lazily", () => {
+  it("loads the first card cover at once with high priority, and every other image lazily", () => {
     const { container } = render(<CasesPage />);
 
-    const mosaic = Array.from(
-      container.querySelectorAll<HTMLImageElement>("section [aria-hidden] img"),
+    // sem mosaico: nenhuma imagem decorativa (alt vazio) no topo da página
+    const decorative = Array.from(
+      container.querySelectorAll<HTMLImageElement>("img"),
     ).filter((image) => image.getAttribute("alt") === "");
-    const [main, ...side] = mosaic;
-    expect(main).toHaveAttribute("loading", "eager");
-    expect(main).toHaveAttribute("fetchpriority", "high");
-    // a largura real do pôster, e não 100vw (que baixava 750 px para 330 px)
-    expect(main.getAttribute("sizes")).toMatch(/calc\(100vw - 40px\)$/);
-    expect(side.length).toBeGreaterThan(0);
-    for (const image of side) {
-      expect(image).toHaveAttribute("loading", "lazy");
-      expect(image).not.toHaveAttribute("fetchpriority");
-    }
+    expect(decorative).toHaveLength(0);
 
-    const covers = coverImages(container);
-    expect(covers.length).toBeGreaterThan(0);
-    for (const image of covers) {
+    const [first, ...others] = coverImages(container);
+    expect(first).toHaveAttribute("loading", "eager");
+    expect(first).toHaveAttribute("fetchpriority", "high");
+    expect(others.length).toBeGreaterThan(0);
+    for (const image of others) {
       expect(image).toHaveAttribute("loading", "lazy");
       expect(image).not.toHaveAttribute("fetchpriority");
     }