feat(servicos): topo, entregáveis e cases por serviço, assunto próprio no WhatsApp e títulos curtos

app/servicos/_components/ServiceDeliverables.tsx

@@ -0,0 +1,37 @@
+import type { ServiceOffer } from "@/lib/site-content";
+
+/**
+ * "O que você recebe" e "Primeiro passo" da oferta. A lista é a mesma do cartão da home (`serviceOffers` em
+ * lib/site-content.ts): a página repete o que o cartão prometeu. O primeiro passo é o da oferta, que termina como a frase
+ * geral da home (`generalFirstStep`): uma conversa e, depois dela, escopo e proposta por escrito. Só as páginas que
+ * explicam uma oferta mostram este bloco.
+ */
+export function ServiceDeliverables({
+  offer,
+}: {
+  offer: Pick<ServiceOffer, "deliverables" | "firstStep">;
+}) {
+  return (
+    <section className="ds-section" aria-labelledby="o-que-voce-recebe">
+      <div className="ds-section-shell">
+        <div className="ds-grid-2">
+          <article className="ds-card">
+            <h2 id="o-que-voce-recebe" className="ds-card-title !mt-0">
+              O que você recebe
+            </h2>
+            <ul className="ds-list space-y-sp-2">
+              {offer.deliverables.map((item) => (
+                <li key={item}>{item}</li>
+              ))}
+            </ul>
+          </article>
+
+          <article className="ds-card">
+            <h2 className="ds-card-title !mt-0">Primeiro passo</h2>
+            <p className="ds-copy">{offer.firstStep}</p>
+          </article>
+        </div>
+      </div>
+    </section>
+  );
+}