feat: write the liflow case study with real architecture details (v0.7.5)

- add an optional caseStudy field to the Project type (context, objectives,
  role, solution, architecture, technical choices, difficulties, security,
  learnings — reuses the existing problem/result fields rather than
  duplicating them) and populate it for liflow, taking /projects/liflow
  from 3 generic sections to 11
- source the architecture section from the actual liflow repo (readme/
  project docs, not the internal security audit) rather than the
  portfolio's own possibly-stale copy — confirms the multi-tenant/
  per-organization model, and resolves a real discrepancy between the
  may-2026 blog post ("no stripe for now") and package.json (stripe is a
  dependency): stripe is wired in but not publicly enabled yet
- render the extended 11-section flow only when caseStudy is present,
  keep the existing light 3-section fallback for infralens and the client
  site until their own case studies land
- close out phase 5 of the portfolio redesign roadmap

Author: Randy-R-code

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [0.7.5] — 2026-08-08
+
+### Contenu
+
+- **Étude de cas Liflow** (`src/lib/projects.ts`, `app/projects/[slug]/page.tsx`) — `/projects/liflow` passe de 3 sections génériques (Problème/Solution/Résultat) à 11 (contexte, problème, objectifs, rôle, solution, architecture, choix techniques, difficultés, sécurité et confidentialité, résultat, enseignements), via un nouveau champ optionnel `caseStudy` sur `Project`. Sourcé sur l'article de blog à jour (mai 2026, post-refonte) et sur le dépôt Liflow réel en local pour confirmer l'architecture — multi-tenant par organisation, Better Auth, Prisma/PostgreSQL, stockage S3 présigné, Mux, Inngest, Stripe présent dans le code mais non activé publiquement. Les projets sans `caseStudy` (InfraLens, site client) gardent l'affichage léger existant.
+
 ## [0.7.4] — 2026-08-08
 
 ### Contenu

app/projects/[slug]/page.tsx

@@ -74,11 +74,32 @@ export default async function ProjectPage({ params }: Props) {
 
         {/* Contenu */}
         <div className="flex flex-col gap-6">
-          {[
-            { label: "Problème", text: project.problem },
-            { label: "Solution", text: project.solution },
-            { label: "Résultat", text: project.result },
-          ].map(({ label, text }) => (
+          {(project.caseStudy
+            ? [
+                { label: "Contexte", text: project.caseStudy.context },
+                { label: "Problème", text: project.problem },
+                { label: "Objectifs", text: project.caseStudy.objectives },
+                { label: "Rôle", text: project.caseStudy.role },
+                { label: "Solution", text: project.caseStudy.solution },
+                { label: "Architecture", text: project.caseStudy.architecture },
+                {
+                  label: "Choix techniques",
+                  text: project.caseStudy.technicalChoices,
+                },
+                { label: "Difficultés", text: project.caseStudy.difficulties },
+                {
+                  label: "Sécurité et confidentialité",
+                  text: project.caseStudy.security,
+                },
+                { label: "Résultat", text: project.result },
+                { label: "Enseignements", text: project.caseStudy.learnings },
+              ]
+            : [
+                { label: "Problème", text: project.problem },
+                { label: "Solution", text: project.solution },
+                { label: "Résultat", text: project.result },
+              ]
+          ).map(({ label, text }) => (
             <section
               key={label}
               className="rounded-xl border p-6"