feat(stack): grille complète (71 technos) en masonry centré + peaufinage UI

Stack & icônes
- grille unique enrichie (+24 technos) : React, TypeORM, Apache, Gitea,
  GitLab, GitHub Actions, Vite, pnpm, Socket.io, Chart.js, Discord.js,
  Prisma, Sequelize, IntelliJ IDEA, VS Code, Windows, HubSpot, HTML5/CSS3…
- nouvelles catégories « Bases de données & ORM » et « Tests & Qualité »
- 21 icônes simple-icons + tracés monochromes custom VS Code, Windows,
  Playwright ; support du fill-rule dans TechIcon
- mise en page masonry (CSS columns) + titres et puces centrés

Contenu & UI
- Hero : retrait du badge « ouvert aux opportunités »
- About / Contact : reformulation orientée projets
- ProjectCard : statut « en développement »
- typographie : tirets cadratins → virgules (titres, OG, aria-labels)
- ajout du visuel public/images/logo/couverture.png

src/components/ProjectCard.astro

@@ -4,6 +4,7 @@ import type { Project } from "../data/content";
 
 const STATUS: Record<Project["status"], { label: string; color: string }> = {
   live: { label: "en ligne", color: "var(--accent)" },
+  dev: { label: "en développement", color: "var(--warn)" },
   archived: { label: "archivé", color: "var(--text-dim)" },
   oss: { label: "open-source", color: "var(--info)" },
 };
@@ -16,7 +17,7 @@ const mono = p.title.replace(/[^A-Za-z0-9]/g, "").slice(0, 2);
 // Toute la carte devient cliquable (nouvel onglet) dès qu'un lien est défini.
 const Tag = p.link ? "a" : "article";
 const linkAttrs = p.link
-  ? { href: p.link, target: "_blank", rel: "noopener", "aria-label": `${p.title} — voir le projet (nouvel onglet)` }
+  ? { href: p.link, target: "_blank", rel: "noopener", "aria-label": `${p.title}, voir le projet (nouvel onglet)` }
   : {};
 ---
 <Tag class:list={["card", p.link && "card--link"]} {...linkAttrs}>