feat: freelance page, a story on the homepage, and design fixes

The homepage was too long and read as a list of sections. The technical
ones (project fit, tools, how a change is secured) move to a page of their
own, /freelance and /en/freelance, linked from the header, the footer and a
pointer on the homepage. The rest is reordered into one story (who, what you
need, examples, how working together goes, results, questions, contact) and
each section opens with a sentence that leads over from the one before.

routes.ts: a page may now have the same name in both languages. Before,
/en/<german name> was always moved to the English name, which for such a
page would have redirected the address onto itself.

Design: list titles such as "Passt gut" are real headings instead of small
grey labels. The automation examples, their description and the run are one
box, so it is clear they belong together. Digits on light backgrounds are
the blue of the panels instead of black. The square corner marks on the
rounded service cards are gone. The years in the career line are readable.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/content/de.ts

@@ -26,6 +26,7 @@ export const de: Content = {
   },
   nav: {
     contact: "Kontakt",
+    freelance: "Freelance",
     contactLong: GET_IN_TOUCH,
     logoLabel: "Marc Mintel, nach oben",
     imprint: "Impressum",
@@ -497,6 +498,32 @@ export const de: Content = {
     },
     cta: "Nach einer Präsentation fragen",
   },
+  story: {
+    services: "So viel zu mir. Jetzt zu Ihnen.",
+    automation: "Einen dieser Fälle zeige ich genauer.",
+    presentations: "Und manchmal ist das Richtige gar keine App.",
+    working: "Egal, was Sie brauchen: So läuft die Zusammenarbeit.",
+    work: "Und so sieht das Ergebnis aus.",
+    faq: "Bleiben die Fragen, die fast immer kommen.",
+  },
+  freelance: {
+    metaTitle: "Freelance-Webentwickler für Ihr Team | Marc Mintel",
+    metaDescription:
+      "Für welche Projekte ich passe, womit ich arbeite (React, Next.js, TypeScript) und wie ich Änderungen absichere, bevor sie live gehen.",
+    label: "Freelance",
+    title: {
+      lead: "Ein Entwickler für Ihr Team.",
+      rest: "Die technischen Details.",
+    },
+    intro:
+      "Diese Seite ist für alle, die selbst entwickeln oder ein Team leiten: für welche Projekte ich passe, womit ich arbeite und wie ich Änderungen absichere, bevor sie live gehen.",
+    pipelineLabel: "Absicherung",
+    teaser: {
+      title: "Sie entwickeln selbst oder leiten ein Team?",
+      text: "Für welche Projekte ich passe, womit ich arbeite und wie ich Änderungen absichere, steht auf einer eigenen Seite.",
+      cta: "Zu den technischen Details",
+    },
+  },
   technology: {
     label: "Technik",
     title: { lead: "Für welche Projekte", rest: "ich der Richtige bin." },

apps/web/src/content/en.ts

@@ -25,6 +25,7 @@ export const en: Content = {
   },
   nav: {
     contact: GET_IN_TOUCH,
+    freelance: "Freelance",
     contactLong: GET_IN_TOUCH,
     logoLabel: "Marc Mintel, back to top",
     imprint: "Imprint",
@@ -477,6 +478,32 @@ export const en: Content = {
     },
     cta: "Ask about a presentation",
   },
+  story: {
+    services: "That is me. Now to you.",
+    automation: "One of these cases, shown in more detail.",
+    presentations: "And sometimes the right thing is not an app at all.",
+    working: "Whatever you need: this is how working together goes.",
+    work: "And this is what the result looks like.",
+    faq: "That leaves the questions that almost always come up.",
+  },
+  freelance: {
+    metaTitle: "Freelance web developer for your team | Marc Mintel",
+    metaDescription:
+      "Which projects I am right for, what I work with (React, Next.js, TypeScript) and how I secure changes before they go live.",
+    label: "Freelance",
+    title: {
+      lead: "A developer for your team.",
+      rest: "The technical details.",
+    },
+    intro:
+      "This page is for people who develop themselves or lead a team: which projects I am right for, what I work with, and how I secure changes before they go live.",
+    pipelineLabel: "Safeguards",
+    teaser: {
+      title: "You develop yourself or lead a team?",
+      text: "Which projects I am right for, what I work with and how I secure changes is on a page of its own.",
+      cta: "To the technical details",
+    },
+  },
   technology: {
     label: "Technology",
     title: { lead: "Which projects", rest: "I am right for." },

apps/web/src/content/types.ts

@@ -146,6 +146,7 @@ export type Content = {
   };
   readonly nav: {
     readonly contact: string;
+    readonly freelance: string;
     readonly contactLong: string;
     readonly logoLabel: string;
     readonly imprint: string;
@@ -220,6 +221,29 @@ export type Content = {
     readonly honest: TitledText;
     readonly cta: string;
   };
+  /**
+   * The thread through the homepage: one sentence at the top of each section
+   * that leads over from the one before, so the page reads as one story.
+   */
+  readonly story: {
+    readonly services: string;
+    readonly automation: string;
+    readonly presentations: string;
+    readonly working: string;
+    readonly work: string;
+    readonly faq: string;
+  };
+  /** The page for people who develop themselves or lead a team. */
+  readonly freelance: {
+    readonly metaTitle: string;
+    readonly metaDescription: string;
+    readonly label: string;
+    readonly title: SplitTitle;
+    readonly intro: string;
+    readonly pipelineLabel: string;
+    /** The pointer to this page on the homepage. */
+    readonly teaser: TitledText & { readonly cta: string };
+  };
   readonly technology: {
     readonly label: string;
     readonly title: SplitTitle;