From 1e339b6512e23202f8ab63a1e18e21c3405553dc Mon Sep 17 00:00:00 2001
From: Jan Gregor Emge-Triebel <emge.triebel@lotum.de>
Date: Tue, 4 Aug 2026 14:47:13 +0200
Subject: [PATCH 1/4] Reformat nuxt-app with Prettier 3.9

Mechanical. `npm run prettier`, no hand edits.

Phase 2 took prettier 3.2.5 -> 3.9.6 and nobody ran --write afterwards, so
90 files drifted from the committed config over eight phases. Nothing in CI
checks formatting, which is why it went unnoticed; the next commit adds that
check.

Kept as its own commit so the gate and the editor docs stay reviewable.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JkKMceYAzAYLrSyC42FWTf
---
 nuxt-app/README.md                            |   4 +-
 nuxt-app/components/BackgroundSpotlights.vue  |  31 +-
 nuxt-app/components/ConferenceAgenda.vue      | 431 ++++++------
 nuxt-app/components/ConferenceCard.vue        |   4 +-
 nuxt-app/components/ConferenceCover.vue       |   4 +-
 nuxt-app/components/ConferenceGallery.vue     | 155 ++---
 nuxt-app/components/ConferenceSection.vue     |  70 +-
 nuxt-app/components/ConferenceSpeaker.vue     |  95 +--
 .../components/ConferenceSpeakersSlider.vue   |  10 +-
 nuxt-app/components/ConferenceTicketBlue.vue  | 159 +++--
 nuxt-app/components/ConferenceTicketLime.vue  | 166 +++--
 nuxt-app/components/ConferenceTicketRed.vue   | 147 +++--
 nuxt-app/components/ConferenceTickets.vue     |  45 +-
 nuxt-app/components/DirectusImage.vue         |   2 +-
 nuxt-app/components/EmbeddedVideoPlayer.vue   | 454 ++++++-------
 nuxt-app/components/FaqItem.vue               |  48 +-
 nuxt-app/components/FaqList.vue               |  24 +-
 nuxt-app/components/GenericLazyList.vue       |  14 +-
 nuxt-app/components/IndividualPlatforms.vue   | 281 ++++----
 nuxt-app/components/MeetupCalendarAndMaps.vue |  11 +-
 nuxt-app/components/MeetupSection.vue         |  72 ++-
 nuxt-app/components/MeetupStartAndEnd.vue     |   2 +-
 nuxt-app/components/MemberCard.vue            |  30 +-
 nuxt-app/components/MouseCursor.vue           |  11 +-
 nuxt-app/components/NewsTicker.vue            |  14 +-
 nuxt-app/components/PageCoverImage.vue        |  26 +-
 nuxt-app/components/Pagination.vue            |   7 +-
 nuxt-app/components/PodcastBanner.vue         |   2 +-
 nuxt-app/components/PodcastPlayer.vue         |  11 +-
 nuxt-app/components/PodcastRating.vue         | 276 ++++----
 nuxt-app/components/PodcastSlider.vue         |   4 +-
 nuxt-app/components/PodcastTranscript.vue     | 151 ++---
 nuxt-app/components/PrettyJSON.vue            |  55 +-
 nuxt-app/components/PrimaryPbButton.vue       |   2 +-
 nuxt-app/components/SearchResultCard.vue      | 195 +++---
 nuxt-app/components/SocialNetworks.vue        |  54 +-
 nuxt-app/components/SpeakerListItem.vue       |   9 +-
 nuxt-app/components/TalkItem.vue              |  83 +--
 nuxt-app/components/TestimonialSlider.vue     |  86 +--
 .../tickets/TicketPricingSummary.vue          |   8 +-
 .../components/tickets/TicketPurchaseFlow.vue |   6 +-
 .../tickets/TicketStepAttendees.vue           |  24 +-
 .../components/tickets/TicketStepBilling.vue  |  82 +--
 .../components/tickets/TicketStepQuantity.vue |  15 +-
 .../components/tickets/TicketStepReview.vue   |  56 +-
 nuxt-app/composables/useDirectus.ts           | 611 +++++++++---------
 nuxt-app/composables/useFlashMessage.ts       |  60 +-
 nuxt-app/composables/usePodcastPlayer.ts      |   6 +-
 .../composables/useTicketCheckoutStore.ts     |  32 +-
 nuxt-app/composables/useVideoConsent.ts       |  20 +-
 .../composables/useWeightedRandomSelection.ts |  88 +--
 nuxt-app/helpers/aiSpamFilter.ts              |  74 ++-
 nuxt-app/helpers/buildSpeakerNamesForTalk.ts  |  32 +-
 nuxt-app/helpers/detectOS.ts                  |  49 +-
 nuxt-app/helpers/getAssetUrl.ts               |  30 +-
 nuxt-app/helpers/getMetaInfo.ts               |  14 +-
 nuxt-app/helpers/ipProcessing.ts              |  87 +--
 nuxt-app/helpers/jsonLdGenerator.ts           |  37 +-
 nuxt-app/helpers/trackGoal.ts                 |   6 +-
 nuxt-app/pages/admin/checkin.vue              |  14 +-
 nuxt-app/pages/agb.vue                        |   4 +-
 nuxt-app/pages/api/cocktails.vue              |  10 +-
 nuxt-app/pages/aufnahmen.vue                  |   2 +-
 nuxt-app/pages/hall-of-fame/[slug].vue        |  27 +-
 nuxt-app/pages/kommt-bald.vue                 |  15 +-
 nuxt-app/pages/konferenz/[slug]/index.vue     | 603 +++++++++--------
 .../pages/konferenz/[slug]/tickets/index.vue  |   4 +-
 .../konferenz/[slug]/tickets/success.vue      |  79 ++-
 nuxt-app/pages/konferenz/index.vue            | 109 ++--
 nuxt-app/pages/meetup/[slug].vue              |  58 +-
 nuxt-app/pages/meetup/index.vue               |  32 +-
 nuxt-app/pages/profiles/[slug].vue            |  62 +-
 nuxt-app/pages/speaker-portal.vue             |  40 +-
 nuxt-app/pages/suche.vue                      | 109 ++--
 nuxt-app/pages/ticket-portal.vue              |  17 +-
 nuxt-app/plugins/vue-json-pretty.js           |   2 +-
 nuxt-app/server/api/checkin/scan.post.ts      |  10 +-
 nuxt-app/server/api/checkin/stats.get.ts      |   5 +-
 nuxt-app/server/api/email.post.ts             |  14 +-
 .../server/api/speaker-portal/validate.get.ts |   3 +-
 .../api/tickets/create-checkout.post.ts       |  25 +-
 nuxt-app/server/api/tickets/webhook.post.ts   |   2 +-
 nuxt-app/server/api/vote.post.ts              |   6 +-
 nuxt-app/server/middleware/cocktails.ts       |  32 +-
 nuxt-app/server/middleware/rating.ts          |  24 +-
 nuxt-app/server/utils/redirects.ts            |   4 +-
 nuxt-app/server/utils/schema.ts               |  10 +-
 nuxt-app/server/utils/stripe.ts               |   5 +-
 nuxt-app/types/items.ts                       | 113 ++--
 nuxt-app/types/search.ts                      |  46 +-
 90 files changed, 3146 insertions(+), 2922 deletions(-)

diff --git a/nuxt-app/README.md b/nuxt-app/README.md
index 02c138f1..a35e61c7 100644
--- a/nuxt-app/README.md
+++ b/nuxt-app/README.md
@@ -11,8 +11,8 @@ npm install
 
 Prepare your IDE as follows:
 
--   https://prettier.io/docs/en/webstorm
--   https://www.jetbrains.com/help/webstorm/eslint.html#ws_js_eslint_automatic_configuration
+- https://prettier.io/docs/en/webstorm
+- https://www.jetbrains.com/help/webstorm/eslint.html#ws_js_eslint_automatic_configuration
 
 ## Development Server
 
diff --git a/nuxt-app/components/BackgroundSpotlights.vue b/nuxt-app/components/BackgroundSpotlights.vue
index 3fb84548..d2b5a832 100644
--- a/nuxt-app/components/BackgroundSpotlights.vue
+++ b/nuxt-app/components/BackgroundSpotlights.vue
@@ -1,27 +1,24 @@
 <template>
-  <!--<BackgroundSpotlight class="absolute z-20 h-192 w-auto" :class="position"/>-->
-  <div
-class='h-192 w-160 bg-no-repeat bg-contain absolute'
-       :class="position"
-       :style="{
-         backgroundImage: `url(${backgroundSpotlightImage})`,
-         zIndex: index,
-       }"
-  ></div>
+    <!--<BackgroundSpotlight class="absolute z-20 h-192 w-auto" :class="position"/>-->
+    <div
+        class="absolute h-192 w-160 bg-contain bg-no-repeat"
+        :class="position"
+        :style="{
+            backgroundImage: `url(${backgroundSpotlightImage})`,
+            zIndex: index,
+        }"
+    ></div>
 </template>
 
 <script setup lang="ts">
+import backgroundSpotlightImage from '~/assets/images/spotlights.png'
 import BackgroundSpotlight from '~/assets/images/spotlights.svg'
-import backgroundSpotlightImage from '~/assets/images/spotlights.png';
-
 import { defineProps } from 'vue'
 
 const props = defineProps<{
-  position: string
-  index: string
-}>();
-
+    position: string
+    index: string
+}>()
 </script>
 
-<style scoped>
-</style>
+<style scoped></style>
diff --git a/nuxt-app/components/ConferenceAgenda.vue b/nuxt-app/components/ConferenceAgenda.vue
index 09e362c3..bf30d21c 100644
--- a/nuxt-app/components/ConferenceAgenda.vue
+++ b/nuxt-app/components/ConferenceAgenda.vue
@@ -1,279 +1,280 @@
 <template>
-  <div class="agenda-root grid gap-8">
-    <section v-for="day in days" :key="day.isoDay" class="day">
-      <h2 class="font-bold text-lg">{{ fmtDay(day.isoDay) }}</h2>
-
-      <div class="grid" :style="gridStyle(day)">
-        <!-- Corner -->
-        <div class="col-1 row-1"></div>
-
-        <!-- Track headers -->
-        <div
-          v-for="(t, i) in tracks"
-          :key="t"
-          class="sticky top-0 z-10 px-2 py-1 font-bold text-center border-b-1 border-b-white"
-          :style="{ gridColumn: String(i + 2), gridRow: '1' }"
-        >
-          {{ t }}
-        </div>
-
-        <!-- Time labels: only at session starts (rows == starts) -->
-        <div
-          v-for="t in day.startLines"
-          :key="t"
-          class="sticky left-0 -z--1 py-1 pr-2 self-start tabular-nums"
-          :style="{ gridColumn: '1', gridRow: String(2 + (day.indexMap.get(t) ?? 0)) }"
-        >
-          {{ fmtTime(t) }}
-        </div>
-
-        <!-- Sessions -->
-        <article
-          v-for="(a, idx) in day.items"
-          :key="idx"
-          class="talk flex flex-col gap-1 relative rounded-s py-2 px-3 md:pb-8 lg:pb-2"
-          :class="{ 'text-center items-center justify-center': isNoTrack(a) }"
-          :style="itemStyle(a, day)"
-          :title="`${fmtTime(a.start)}–${fmtTime(a.end)}`"
-          :data-cursor-hover="a._object ? true : null"
-          @click='handleTalkClick(a._object)'
-        >
-          <header class="font-bold text-sm md:text-lg">
-            {{ a._object?.title ?? a.title }}
-          </header>
-          <div class="text-sm">{{ buildSubtitle(a) }}</div>
-          <div class='hidden md:block text-sm text-right absolute px-2 pb-2 left-0 right-0 bottom-0 w-auto'>
-            {{ fmtTime(a.start) }}<span v-if='a.end'> – {{ fmtTime(a.end) }}</span></div>
-        </article>
-      </div>
-    </section>
-  </div>
+    <div class="agenda-root grid gap-8">
+        <section v-for="day in days" :key="day.isoDay" class="day">
+            <h2 class="text-lg font-bold">{{ fmtDay(day.isoDay) }}</h2>
+
+            <div class="grid" :style="gridStyle(day)">
+                <!-- Corner -->
+                <div class="col-1 row-1"></div>
+
+                <!-- Track headers -->
+                <div
+                    v-for="(t, i) in tracks"
+                    :key="t"
+                    class="sticky top-0 z-10 border-b-1 border-b-white px-2 py-1 text-center font-bold"
+                    :style="{ gridColumn: String(i + 2), gridRow: '1' }"
+                >
+                    {{ t }}
+                </div>
+
+                <!-- Time labels: only at session starts (rows == starts) -->
+                <div
+                    v-for="t in day.startLines"
+                    :key="t"
+                    class="sticky left-0 -z--1 self-start py-1 pr-2 tabular-nums"
+                    :style="{ gridColumn: '1', gridRow: String(2 + (day.indexMap.get(t) ?? 0)) }"
+                >
+                    {{ fmtTime(t) }}
+                </div>
+
+                <!-- Sessions -->
+                <article
+                    v-for="(a, idx) in day.items"
+                    :key="idx"
+                    class="talk relative flex flex-col gap-1 rounded-s px-3 py-2 md:pb-8 lg:pb-2"
+                    :class="{ 'items-center justify-center text-center': isNoTrack(a) }"
+                    :style="itemStyle(a, day)"
+                    :title="`${fmtTime(a.start)}–${fmtTime(a.end)}`"
+                    :data-cursor-hover="a._object ? true : null"
+                    @click="handleTalkClick(a._object)"
+                >
+                    <header class="text-sm font-bold md:text-lg">
+                        {{ a._object?.title ?? a.title }}
+                    </header>
+                    <div class="text-sm">{{ buildSubtitle(a) }}</div>
+                    <div class="absolute bottom-0 left-0 right-0 hidden w-auto px-2 pb-2 text-right text-sm md:block">
+                        {{ fmtTime(a.start) }}<span v-if="a.end"> – {{ fmtTime(a.end) }}</span>
+                    </div>
+                </article>
+            </div>
+        </section>
+    </div>
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import type { TalkItem } from '~/types';
-import { buildSpeakerNamesForTalk } from '~/helpers/buildSpeakerNamesForTalk';
-import { parseCmsDate } from '~/helpers';
+import { parseCmsDate } from '~/helpers'
+import { buildSpeakerNamesForTalk } from '~/helpers/buildSpeakerNamesForTalk'
+import type { TalkItem } from '~/types'
+import { computed } from 'vue'
 
 type Agenda = {
-  start: string;   // ISO string, e.g. "2025-10-29T09:15:00"
-  end: string;     // ISO string
-  title: string;
-  subtitle: string;
-  track: string;   // may be "" or whitespace for "no track"
-  _object: undefined | TalkItem
-};
-
-const props = defineProps<{ agenda: Agenda[] }>();
-
-const buildSubtitle = function(agenda: Agenda): string | undefined {
-  if (!agenda._object?.speakers.length) {
-    return agenda.subtitle;
-  }
-  return buildSpeakerNamesForTalk(agenda._object);
+    start: string // ISO string, e.g. "2025-10-29T09:15:00"
+    end: string // ISO string
+    title: string
+    subtitle: string
+    track: string // may be "" or whitespace for "no track"
+    _object: undefined | TalkItem
 }
 
-const handleTalkClick = function(talk: TalkItem | undefined | null) {
-  if (!talk) return;
-  const el = document.getElementById(`talk-${talk.id}`);
-  if (el) el.scrollIntoView({ behavior: 'smooth', block: 'center'});
+const props = defineProps<{ agenda: Agenda[] }>()
+
+const buildSubtitle = function (agenda: Agenda): string | undefined {
+    if (!agenda._object?.speakers.length) {
+        return agenda.subtitle
+    }
+    return buildSpeakerNamesForTalk(agenda._object)
+}
+
+const handleTalkClick = function (talk: TalkItem | undefined | null) {
+    if (!talk) return
+    const el = document.getElementById(`talk-${talk.id}`)
+    if (el) el.scrollIntoView({ behavior: 'smooth', block: 'center' })
 }
 
 /** ===== Config ===== */
 // You already set this to false. We keep it so you can flip later if you want durations.
-const USE_DURATION_HEIGHTS = false;  // equal-height rows
+const USE_DURATION_HEIGHTS = false // equal-height rows
 // New: when true, the grid compacts to one row per distinct start time (no gaps possible)
-const COMPACT_BY_STARTS = true;
-const TIME_COL_WIDTH = 'var(--time-col-width, 8rem)';
+const COMPACT_BY_STARTS = true
+const TIME_COL_WIDTH = 'var(--time-col-width, 8rem)'
 
 /** ===== Utils ===== */
-const toDate = (s: string) => parseCmsDate(s);
-const dayKey = (d: Date) => d.toISOString().slice(0, 10);
+const toDate = (s: string) => parseCmsDate(s)
+const dayKey = (d: Date) => d.toISOString().slice(0, 10)
 const fmtTime = (s: string) => {
-  const d = toDate(s);
+    const d = toDate(s)
 
-  if (isNaN(d.getTime())) {
-    return '';
-  }
+    if (isNaN(d.getTime())) {
+        return ''
+    }
 
-  return d.toLocaleTimeString('de-DE', { timeZone: 'Europe/Berlin', hour: '2-digit', minute: '2-digit' });
+    return d.toLocaleTimeString('de-DE', { timeZone: 'Europe/Berlin', hour: '2-digit', minute: '2-digit' })
 }
 
 const fmtDay = (isoDay: string) =>
-  parseCmsDate(isoDay).toLocaleDateString('de-DE', {
-    timeZone: 'Europe/Berlin',
-    weekday: 'long',
-    year: 'numeric',
-    month: 'short',
-    day: 'numeric'
-  });
+    parseCmsDate(isoDay).toLocaleDateString('de-DE', {
+        timeZone: 'Europe/Berlin',
+        weekday: 'long',
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+    })
 
 function uniqSorted<T>(arr: T[], key?: (x: T) => any): T[] {
-  const set = new Map<any, T>();
-  for (const x of arr) set.set(key ? key(x) : (x as any), x);
-  const out = [...set.values()];
-  out.sort((a, b) => {
-    const ka = key ? key(a) : (a as any);
-    const kb = key ? key(b) : (b as any);
-    return ka < kb ? -1 : ka > kb ? 1 : 0;
-  });
-  return out;
+    const set = new Map<any, T>()
+    for (const x of arr) set.set(key ? key(x) : (x as any), x)
+    const out = [...set.values()]
+    out.sort((a, b) => {
+        const ka = key ? key(a) : (a as any)
+        const kb = key ? key(b) : (b as any)
+        return ka < kb ? -1 : ka > kb ? 1 : 0
+    })
+    return out
 }
 
 /** ===== Columns (tracks) ===== */
-const tracks = computed(() =>
-  uniqSorted(
-    props.agenda
-      .map(a => (a.track ?? '').trim())
-      .filter(t => t.length > 0)
-  )
-);
+const tracks = computed(() => uniqSorted(props.agenda.map((a) => (a.track ?? '').trim()).filter((t) => t.length > 0)))
 
 function isNoTrack(a: Agenda) {
-  return !a.track || a.track.trim().length === 0;
+    return !a.track || a.track.trim().length === 0
 }
 function colForTrack(track: string) {
-  const idx = tracks.value.findIndex(t => t === track.trim());
-  return String(idx + 2); // +1 for the time-column, +1 because the grid is 1-based
+    const idx = tracks.value.findIndex((t) => t === track.trim())
+    return String(idx + 2) // +1 for the time-column, +1 because the grid is 1-based
 }
 
 /** ===== Day model ===== */
 type DayBlock = {
-  isoDay: string;
-  items: Agenda[];
+    isoDay: string
+    items: Agenda[]
 
-  // When COMPACT_BY_STARTS=true, these are the ONLY boundaries we use for rows.
-  startLines: string[];           // sorted unique session starts of the day
-  indexMap: Map<string, number>;  // start time -> row index (0-based within content)
+    // When COMPACT_BY_STARTS=true, these are the ONLY boundaries we use for rows.
+    startLines: string[] // sorted unique session starts of the day
+    indexMap: Map<string, number> // start time -> row index (0-based within content)
 
-  // Back-compat if you flip COMPACT_BY_STARTS off later:
-  lines: string[];                // full boundaries (starts + ends)
-  rowHeightsMin: number[];        // per-interval minutes (unused when equal-height)
-};
+    // Back-compat if you flip COMPACT_BY_STARTS off later:
+    lines: string[] // full boundaries (starts + ends)
+    rowHeightsMin: number[] // per-interval minutes (unused when equal-height)
+}
 
 const days = computed<DayBlock[]>(() => {
-  // Group items by day
-  const byDay = new Map<string, Agenda[]>();
-  for (const a of props.agenda) {
-    const k = dayKey(toDate(a.start));
-    if (!byDay.has(k)) byDay.set(k, []);
-    byDay.get(k)!.push(a);
-  }
-
-  const result: DayBlock[] = [];
-
-  for (const [isoDay, items] of [...byDay.entries()].sort()) {
-    if (!items.length) continue;
-
-    // === Compact rows: one row per distinct start time
-    const startLines = uniqSorted(items.map(i => i.start), t => t);
-    const indexMap = new Map<string, number>();
-    startLines.forEach((t, i) => indexMap.set(t, i));
-
-    // === Keep full boundaries in case you later use duration-based mode
-    const lines = uniqSorted(items.flatMap(i => [i.start, i.end]), t => t);
-    const rowHeightsMin: number[] = [];
-    for (let i = 0; i < lines.length - 1; i++) {
-      // minutes between boundaries (unused when equal-height)
-      rowHeightsMin.push(
-        Math.max(1, Math.round((toDate(lines[i+1]).getTime() - toDate(lines[i]).getTime()) / 60000))
-      );
+    // Group items by day
+    const byDay = new Map<string, Agenda[]>()
+    for (const a of props.agenda) {
+        const k = dayKey(toDate(a.start))
+        if (!byDay.has(k)) byDay.set(k, [])
+        byDay.get(k)!.push(a)
     }
 
-    result.push({ isoDay, items, startLines, indexMap, lines, rowHeightsMin });
-  }
+    const result: DayBlock[] = []
+
+    for (const [isoDay, items] of [...byDay.entries()].sort()) {
+        if (!items.length) continue
+
+        // === Compact rows: one row per distinct start time
+        const startLines = uniqSorted(
+            items.map((i) => i.start),
+            (t) => t
+        )
+        const indexMap = new Map<string, number>()
+        startLines.forEach((t, i) => indexMap.set(t, i))
+
+        // === Keep full boundaries in case you later use duration-based mode
+        const lines = uniqSorted(
+            items.flatMap((i) => [i.start, i.end]),
+            (t) => t
+        )
+        const rowHeightsMin: number[] = []
+        for (let i = 0; i < lines.length - 1; i++) {
+            // minutes between boundaries (unused when equal-height)
+            rowHeightsMin.push(
+                Math.max(1, Math.round((toDate(lines[i + 1]).getTime() - toDate(lines[i]).getTime()) / 60000))
+            )
+        }
+
+        result.push({ isoDay, items, startLines, indexMap, lines, rowHeightsMin })
+    }
 
-  return result;
-});
+    return result
+})
 
 /** ===== Grid helpers ===== */
 function gridStyle(day: DayBlock) {
-  const cols = [`${TIME_COL_WIDTH}`, ...tracks.value.map(() => '1fr')].join(' ');
-
-  if (COMPACT_BY_STARTS) {
-    // Rows: 1 header + one row per distinct start time
-    // We check for each start time if all items starting then have no _object
-    const rowSpecs = day.startLines.map(startTime => {
-      const itemsAtTime = day.items.filter(i => i.start === startTime);
-      const allEmpty = itemsAtTime.every(i => !i._object);
-      return allEmpty ? 'auto' : '1fr';
-    });
-
-    return {
-      display: 'grid',
-      gridTemplateColumns: cols,
-      gridTemplateRows: `auto ${rowSpecs.join(' ')}`,
-      gap: '6px'
-    } as const;
-  }
-
-  // Fallback: duration-based layout (kept for completeness)
-  if (USE_DURATION_HEIGHTS) {
-    // proportional heights
-    const MINUTES_PER_UNIT = 2;
-    const unit = `${MINUTES_PER_UNIT}px`;
-    const content = day.rowHeightsMin.map(min => `calc(${min} * ${unit})`).join(' ');
-    return {
-      display: 'grid',
-      gridTemplateColumns: cols,
-      gridTemplateRows: `auto ${content}`,
-      gap: '6px'
-    } as const;
-  } else {
-    // equal-height intervals across full boundaries
-    return {
-      display: 'grid',
-      gridTemplateColumns: cols,
-      gridTemplateRows: `auto repeat(${Math.max(0, day.lines.length - 1)}, 1fr)`,
-      gap: '6px'
-    } as const;
-  }
+    const cols = [`${TIME_COL_WIDTH}`, ...tracks.value.map(() => '1fr')].join(' ')
+
+    if (COMPACT_BY_STARTS) {
+        // Rows: 1 header + one row per distinct start time
+        // We check for each start time if all items starting then have no _object
+        const rowSpecs = day.startLines.map((startTime) => {
+            const itemsAtTime = day.items.filter((i) => i.start === startTime)
+            const allEmpty = itemsAtTime.every((i) => !i._object)
+            return allEmpty ? 'auto' : '1fr'
+        })
+
+        return {
+            display: 'grid',
+            gridTemplateColumns: cols,
+            gridTemplateRows: `auto ${rowSpecs.join(' ')}`,
+            gap: '6px',
+        } as const
+    }
+
+    // Fallback: duration-based layout (kept for completeness)
+    if (USE_DURATION_HEIGHTS) {
+        // proportional heights
+        const MINUTES_PER_UNIT = 2
+        const unit = `${MINUTES_PER_UNIT}px`
+        const content = day.rowHeightsMin.map((min) => `calc(${min} * ${unit})`).join(' ')
+        return {
+            display: 'grid',
+            gridTemplateColumns: cols,
+            gridTemplateRows: `auto ${content}`,
+            gap: '6px',
+        } as const
+    } else {
+        // equal-height intervals across full boundaries
+        return {
+            display: 'grid',
+            gridTemplateColumns: cols,
+            gridTemplateRows: `auto repeat(${Math.max(0, day.lines.length - 1)}, 1fr)`,
+            gap: '6px',
+        } as const
+    }
 }
 
 function itemStyle(a: Agenda, day: DayBlock) {
-  if (COMPACT_BY_STARTS) {
-    // Place the item in the row corresponding to its START time (one row high)
-    const rowIdx = day.indexMap.get(a.start) ?? 0;
-    const rs = 2 + rowIdx;       // +1 for header, +1 because 0-based index
-    const re = rs + 1;           // exactly one row tall
+    if (COMPACT_BY_STARTS) {
+        // Place the item in the row corresponding to its START time (one row high)
+        const rowIdx = day.indexMap.get(a.start) ?? 0
+        const rs = 2 + rowIdx // +1 for header, +1 because 0-based index
+        const re = rs + 1 // exactly one row tall
+        if (isNoTrack(a)) {
+            const endExclusive = tracks.value.length + 2
+            return { gridColumn: `2 / ${endExclusive}`, gridRow: `${rs} / ${re}` } as const
+        }
+        return { gridColumn: `${colForTrack(a.track!)}/span 1`, gridRow: `${rs} / ${re}` } as const
+    }
+
+    // Fallback (duration-based placement)
+    const startIdx = day.lines.indexOf(a.start)
+    const endIdx = day.lines.indexOf(a.end)
+    const rs = 2 + (startIdx >= 0 ? startIdx : 0)
+    const re = 2 + (endIdx >= 0 ? endIdx : rs)
     if (isNoTrack(a)) {
-      const endExclusive = tracks.value.length + 2;
-      return { gridColumn: `2 / ${endExclusive}`, gridRow: `${rs} / ${re}` } as const;
+        const endExclusive = tracks.value.length + 2
+        return { gridColumn: `2 / ${endExclusive}`, gridRow: `${rs} / ${re}` } as const
     }
-    return { gridColumn: `${colForTrack(a.track!)}/span 1`, gridRow: `${rs} / ${re}` } as const;
-  }
-
-  // Fallback (duration-based placement)
-  const startIdx = day.lines.indexOf(a.start);
-  const endIdx = day.lines.indexOf(a.end);
-  const rs = 2 + (startIdx >= 0 ? startIdx : 0);
-  const re = 2 + (endIdx   >= 0 ? endIdx   : rs);
-  if (isNoTrack(a)) {
-    const endExclusive = tracks.value.length + 2;
-    return { gridColumn: `2 / ${endExclusive}`, gridRow: `${rs} / ${re}` } as const;
-  }
-  return { gridColumn: `${colForTrack(a.track!)}/span 1`, gridRow: `${rs} / ${re}` } as const;
+    return { gridColumn: `${colForTrack(a.track!)}/span 1`, gridRow: `${rs} / ${re}` } as const
 }
 </script>
 
 <style scoped>
-:root, .agenda-root {
-  --time-col-width: 8rem;
+:root,
+.agenda-root {
+    --time-col-width: 8rem;
 }
 
 @media (max-width: 600px) {
-  .agenda-root {
-    --time-col-width: 3.5rem;
-  }
+    .agenda-root {
+        --time-col-width: 3.5rem;
+    }
 }
 
 .grid > * {
-  min-width: 0;
+    min-width: 0;
 }
 
 .talk {
-  background: var(--Grey, #131415);
+    background: var(--Grey, #131415);
 }
-
 </style>
diff --git a/nuxt-app/components/ConferenceCard.vue b/nuxt-app/components/ConferenceCard.vue
index 9986c4f6..b1e522aa 100644
--- a/nuxt-app/components/ConferenceCard.vue
+++ b/nuxt-app/components/ConferenceCard.vue
@@ -30,12 +30,12 @@
 </template>
 
 <script lang="ts">
+import { getPlainText } from '~/helpers/sanitize'
 import type { PropType } from 'vue'
 import { computed, defineComponent } from 'vue'
-import { getPlainText } from '~/helpers/sanitize'
 import type { ConferenceItem } from '../types'
-import LinkButton from './LinkButton.vue'
 import ConferenceCover from './ConferenceCover.vue'
+import LinkButton from './LinkButton.vue'
 import MeetupStartAndEnd from './MeetupStartAndEnd.vue'
 
 export default defineComponent({
diff --git a/nuxt-app/components/ConferenceCover.vue b/nuxt-app/components/ConferenceCover.vue
index 3f7a4870..63598b21 100644
--- a/nuxt-app/components/ConferenceCover.vue
+++ b/nuxt-app/components/ConferenceCover.vue
@@ -27,7 +27,7 @@
 <script lang="ts">
 import type { PropType } from 'vue'
 import { defineComponent, onMounted, reactive } from 'vue'
-import type { ConferenceItem } from '../types';
+import type { ConferenceItem } from '../types'
 import DirectusImage from './DirectusImage.vue'
 
 export default defineComponent({
@@ -35,7 +35,7 @@ export default defineComponent({
         DirectusImage,
     },
     props: {
-      conference: {
+        conference: {
             type: Object as PropType<Pick<ConferenceItem, 'start_on' | 'end_on' | 'title' | 'poster'>>,
             required: true,
         },
diff --git a/nuxt-app/components/ConferenceGallery.vue b/nuxt-app/components/ConferenceGallery.vue
index 5407ec42..79a80448 100644
--- a/nuxt-app/components/ConferenceGallery.vue
+++ b/nuxt-app/components/ConferenceGallery.vue
@@ -11,29 +11,28 @@
                 <template #default="{ item, index, viewportItems, addViewportItem }">
                     <GenericListItem
                         :key="item.id"
-
                         :item="item"
                         :viewport-items="viewportItems"
                         :add-viewport-item="addViewportItem"
                     >
                         <template #default="{ isNewToViewport }">
                             <FadeAnimation :fade-in="isNewToViewport ? 'from_bottom' : 'none'" :threshold="0">
-                              <div
-                                class='w-72 mr-3 cursor-zoom-in'
-                                role="button"
-                                tabindex="0"
-                                :aria-label="`Bild ${index + 1} von ${images.length}`"
-                                @click.stop="openLightbox(index)"
-                                @keydown.enter.prevent="openLightbox(index)"
-                                @keydown.space.prevent="openLightbox(index)"
-                              >
-                                <DirectusImage
-                                  class="object-cover aspect-square"
-                                  :image="item"
-                                  sizes="lg:300px"
-                                  loading="lazy"
-                                />
-                              </div>
+                                <div
+                                    class="mr-3 w-72 cursor-zoom-in"
+                                    role="button"
+                                    tabindex="0"
+                                    :aria-label="`Bild ${index + 1} von ${images.length}`"
+                                    @click.stop="openLightbox(index)"
+                                    @keydown.enter.prevent="openLightbox(index)"
+                                    @keydown.space.prevent="openLightbox(index)"
+                                >
+                                    <DirectusImage
+                                        class="aspect-square object-cover"
+                                        :image="item"
+                                        sizes="lg:300px"
+                                        loading="lazy"
+                                    />
+                                </div>
                             </FadeAnimation>
                         </template>
                     </GenericListItem>
@@ -57,63 +56,63 @@
             "
             type="button"
             :title="index === 1 ? 'Scroll left' : 'Scroll right'"
-            :data-cursor-arrow-left="(index === 1 && !scrollStartReached) ? true : null"
-            :data-cursor-arrow-right="(index === 2 && !scrollEndReached) ? true : null"
+            :data-cursor-arrow-left="index === 1 && !scrollStartReached ? true : null"
+            :data-cursor-arrow-right="index === 2 && !scrollEndReached ? true : null"
             @click="() => scrollTo(index === 1 ? 'left' : 'right')"
         />
 
         <transition name="fade">
-          <div
-            v-if="isLightboxOpen"
-            class="fixed inset-0 z-50 flex items-center justify-center bg-black/90 p-4"
-            @click="closeLightbox"
-          >
-            <button
-              type="button"
-              class="z-10 absolute left-0 top-0 h-full w-20 md:w-32 flex items-center justify-center text-white/80 hover:text-white focus:outline-none text-3xl"
-              :title="'Vorheriges Bild'"
-              :data-cursor-arrow-left="true"
-              @click.stop="prevImage"
+            <div
+                v-if="isLightboxOpen"
+                class="fixed inset-0 z-50 flex items-center justify-center bg-black/90 p-4"
+                @click="closeLightbox"
             >
-              ‹
-            </button>
+                <button
+                    type="button"
+                    class="absolute left-0 top-0 z-10 flex h-full w-20 items-center justify-center text-3xl text-white/80 hover:text-white focus:outline-none md:w-32"
+                    :title="'Vorheriges Bild'"
+                    :data-cursor-arrow-left="true"
+                    @click.stop="prevImage"
+                >
+                    ‹
+                </button>
 
-            <div class="relative max-h-[90vh] max-w-[95vw]" @click.stop>
-              <DirectusImage
-                class="max-h-[90vh] max-w-[95vw] w-auto h-auto object-contain"
-                :image="currentImage!"
-                sizes="lg:1000px"
-                loading="auto"
-                fit="contain"
-              />
-            </div>
+                <div class="relative max-h-[90vh] max-w-[95vw]" @click.stop>
+                    <DirectusImage
+                        class="h-auto max-h-[90vh] w-auto max-w-[95vw] object-contain"
+                        :image="currentImage!"
+                        sizes="lg:1000px"
+                        loading="auto"
+                        fit="contain"
+                    />
+                </div>
 
-            <button
-              type="button"
-              class="z-10 absolute right-0 top-0 h-full w-20 md:w-32 flex items-center justify-center text-white/80 hover:text-white focus:outline-none text-3xl"
-              :title="'Nächstes Bild'"
-              :data-cursor-arrow-right="true"
-              @click.stop="nextImage"
-            >
-              ›
-            </button>
-          </div>
+                <button
+                    type="button"
+                    class="absolute right-0 top-0 z-10 flex h-full w-20 items-center justify-center text-3xl text-white/80 hover:text-white focus:outline-none md:w-32"
+                    :title="'Nächstes Bild'"
+                    :data-cursor-arrow-right="true"
+                    @click.stop="nextImage"
+                >
+                    ›
+                </button>
+            </div>
         </transition>
     </div>
 </template>
 
 <script setup lang="ts">
+import type { DirectusFile } from '@directus/sdk'
 import { CLICK_SCROLL_LEFT_ARROW_EVENT_ID, CLICK_SCROLL_RIGHT_ARROW_EVENT_ID } from '~/config'
 import { trackGoal } from '~/helpers'
-import { onMounted, onBeforeUnmount, ref, computed } from 'vue'
+import type { DirectusFileItem } from '~/types'
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
 import FadeAnimation from './FadeAnimation.vue'
 import GenericLazyList from './GenericLazyList.vue'
 import GenericListItem from './GenericListItem.vue'
-import type { DirectusFile } from '@directus/sdk';
-import type { DirectusFileItem } from '~/types';
 
 const props = defineProps<{
-  images: DirectusFile[] | DirectusFileItem[]
+    images: DirectusFile[] | DirectusFileItem[]
 }>()
 
 // Create scroll box element reference
@@ -200,37 +199,37 @@ const currentIndex = ref<number>(0)
 const currentImage = computed(() => props.images[currentIndex.value])
 
 const openLightbox = (index: number) => {
-  currentIndex.value = index
-  isLightboxOpen.value = true
+    currentIndex.value = index
+    isLightboxOpen.value = true
 }
 
 const closeLightbox = () => {
-  isLightboxOpen.value = false
+    isLightboxOpen.value = false
 }
 
 const nextImage = () => {
-  if (!props.images.length) return
-  currentIndex.value = (currentIndex.value + 1) % props.images.length
+    if (!props.images.length) return
+    currentIndex.value = (currentIndex.value + 1) % props.images.length
 }
 
 const prevImage = () => {
-  if (!props.images.length) return
-  currentIndex.value = (currentIndex.value - 1 + props.images.length) % props.images.length
+    if (!props.images.length) return
+    currentIndex.value = (currentIndex.value - 1 + props.images.length) % props.images.length
 }
 
 // Keyboard navigation for lightbox
 const handleKeydown = (e: KeyboardEvent) => {
-  if (!isLightboxOpen.value) return
-  if (e.key === 'Escape') {
-    e.preventDefault()
-    closeLightbox()
-  } else if (e.key === 'ArrowRight') {
-    e.preventDefault()
-    nextImage()
-  } else if (e.key === 'ArrowLeft') {
-    e.preventDefault()
-    prevImage()
-  }
+    if (!isLightboxOpen.value) return
+    if (e.key === 'Escape') {
+        e.preventDefault()
+        closeLightbox()
+    } else if (e.key === 'ArrowRight') {
+        e.preventDefault()
+        nextImage()
+    } else if (e.key === 'ArrowLeft') {
+        e.preventDefault()
+        prevImage()
+    }
 }
 
 onMounted(() => window.addEventListener('keydown', handleKeydown))
@@ -273,8 +272,12 @@ onBeforeUnmount(() => window.removeEventListener('keydown', handleKeydown))
     }
 }
 
-.fade-enter-active, .fade-leave-active {
-  transition: opacity .2s ease;
+.fade-enter-active,
+.fade-leave-active {
+    transition: opacity 0.2s ease;
+}
+.fade-enter-from,
+.fade-leave-to {
+    opacity: 0;
 }
-.fade-enter-from, .fade-leave-to { opacity: 0; }
 </style>
diff --git a/nuxt-app/components/ConferenceSection.vue b/nuxt-app/components/ConferenceSection.vue
index c79b8c63..a0497ee7 100644
--- a/nuxt-app/components/ConferenceSection.vue
+++ b/nuxt-app/components/ConferenceSection.vue
@@ -1,50 +1,50 @@
 <template>
-  <section class="relative mb-14 mt-12 md:mb-32 md:mt-28 lg:mb-52 lg:mt-40">
-    <div class="container px-6 md:pl-48 lg:pr-8 3xl:px-8">
-      <SectionHeading element="h2">
-        {{ heading }}
-      </SectionHeading>
-      <LazyList class="mt-10" :items="conferences" direction="vertical">
-        <template #default="{ item, index, viewportItems, addViewportItem }">
-          <LazyListItem
-            :key="item.id"
-            :class="index > 0 && 'mt-14 md:mt-20 lg:mt-28'"
-            :item="item"
-            :viewport-items="viewportItems"
-            :add-viewport-item="addViewportItem"
-          >
-            <template #default="{ isNewToViewport }">
-              <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
-                <ConferenceCard :conference="item" />
-              </FadeAnimation>
-            </template>
-          </LazyListItem>
-        </template>
-      </LazyList>
-    </div>
-  </section>
+    <section class="relative mb-14 mt-12 md:mb-32 md:mt-28 lg:mb-52 lg:mt-40">
+        <div class="container px-6 md:pl-48 lg:pr-8 3xl:px-8">
+            <SectionHeading element="h2">
+                {{ heading }}
+            </SectionHeading>
+            <LazyList class="mt-10" :items="conferences" direction="vertical">
+                <template #default="{ item, index, viewportItems, addViewportItem }">
+                    <LazyListItem
+                        :key="item.id"
+                        :class="index > 0 && 'mt-14 md:mt-20 lg:mt-28'"
+                        :item="item"
+                        :viewport-items="viewportItems"
+                        :add-viewport-item="addViewportItem"
+                    >
+                        <template #default="{ isNewToViewport }">
+                            <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
+                                <ConferenceCard :conference="item" />
+                            </FadeAnimation>
+                        </template>
+                    </LazyListItem>
+                </template>
+            </LazyList>
+        </div>
+    </section>
 </template>
 
 <script lang="ts">
+import ConferenceCard from '~/components/ConferenceCard.vue'
+import GenericLazyList from '~/components/GenericLazyList.vue'
+import GenericListItem from '~/components/GenericListItem.vue'
+import type { ConferenceItem } from '~/types'
 import type { PropType } from 'vue'
 import { defineComponent } from 'vue'
-import GenericListItem from '~/components/GenericListItem.vue';
-import GenericLazyList from '~/components/GenericLazyList.vue';
-import ConferenceCard from '~/components/ConferenceCard.vue';
-import SectionHeading from './SectionHeading.vue';
-import type { ConferenceItem } from '~/types';
+import SectionHeading from './SectionHeading.vue'
 
 export default defineComponent({
     components: {
-      SectionHeading,
-      LazyList: GenericLazyList,
-      LazyListItem: GenericListItem,
-      ConferenceCard,
+        SectionHeading,
+        LazyList: GenericLazyList,
+        LazyListItem: GenericListItem,
+        ConferenceCard,
     },
     props: {
         conferences: {
-          type: Array as PropType<Pick<ConferenceItem, 'start_on' | 'end_on' | 'title' | 'cover_image' | 'text_1'>[]>,
-          required: true,
+            type: Array as PropType<Pick<ConferenceItem, 'start_on' | 'end_on' | 'title' | 'cover_image' | 'text_1'>[]>,
+            required: true,
         },
         heading: {
             type: String,
diff --git a/nuxt-app/components/ConferenceSpeaker.vue b/nuxt-app/components/ConferenceSpeaker.vue
index 80394860..de48c98a 100644
--- a/nuxt-app/components/ConferenceSpeaker.vue
+++ b/nuxt-app/components/ConferenceSpeaker.vue
@@ -1,67 +1,68 @@
 <template>
-  <div class='w-48 lg:w-96 speaker-box'>
-    <DirectusImage
-      v-if='speaker.profile_image'
-      class='w-full object-cover aspect-square'
-      :image='speaker.profile_image'
-      :alt='fullName'
-      sizes='sm:150px md:300px lg:400px'
-      loading='lazy'
-    />
-    <div class='mt-3 p-4 lg:mt-6 lg:p-9 flex flex-col min-h-60 max-h-60 lg:min-h-120 lg:max-h-120 flex-shrink-0' :class="[isExpanded ? '!max-h-full' : '']" @click='isExpanded = !isExpanded'>
-      <div>
-        <p class='font-black lg:text-3xl mb-2'>{{ fullName }}</p>
-        <p class='font-light lg:text-xl italic'>{{ speaker.occupation }}</p>
-      </div>
-      <div
-        class='relative'
-        :class="['transition-all duration-300', !isExpanded ? 'overflow-hidden' : '']"
-        :data-cursor-more="isExpanded ? null : true"
-        :data-cursor-hover="!isExpanded ? null : true"
-      >
-          <InnerHtml
-            class='mt-2 lg:mt-7 font-light text-sm lg:text-xl'
-            :html='speaker.description'
-          />
+    <div class="speaker-box w-48 lg:w-96">
+        <DirectusImage
+            v-if="speaker.profile_image"
+            class="aspect-square w-full object-cover"
+            :image="speaker.profile_image"
+            :alt="fullName"
+            sizes="sm:150px md:300px lg:400px"
+            loading="lazy"
+        />
         <div
-          v-if='!isExpanded'
-          class='absolute bottom-0 left-0 right-0 h-12 bg-gradient-to-t from-[#131415] to-transparent'
-        ></div>
-      </div>
-      <IndividualPlatforms :platforms='platforms' :sizes='"h-5 lg:h-7 mt-1 lg:mt-7"' :scope='"speaker"'/>
+            class="mt-3 flex max-h-60 min-h-60 flex-shrink-0 flex-col p-4 lg:mt-6 lg:max-h-120 lg:min-h-120 lg:p-9"
+            :class="[isExpanded ? '!max-h-full' : '']"
+            @click="isExpanded = !isExpanded"
+        >
+            <div>
+                <p class="mb-2 font-black lg:text-3xl">{{ fullName }}</p>
+                <p class="font-light italic lg:text-xl">{{ speaker.occupation }}</p>
+            </div>
+            <div
+                class="relative"
+                :class="['transition-all duration-300', !isExpanded ? 'overflow-hidden' : '']"
+                :data-cursor-more="isExpanded ? null : true"
+                :data-cursor-hover="!isExpanded ? null : true"
+            >
+                <InnerHtml class="mt-2 text-sm font-light lg:mt-7 lg:text-xl" :html="speaker.description" />
+                <div
+                    v-if="!isExpanded"
+                    class="absolute bottom-0 left-0 right-0 h-12 bg-gradient-to-t from-[#131415] to-transparent"
+                ></div>
+            </div>
+            <IndividualPlatforms :platforms="platforms" :sizes="'h-5 lg:h-7 mt-1 lg:mt-7'" :scope="'speaker'" />
+        </div>
     </div>
-  </div>
 </template>
 
-<script setup lang='ts'>
-import type { SpeakerPreviewItem } from '~/types';
-import { computed, ref } from 'vue';
-import { getFullSpeakerName } from 'shared-code';
+<script setup lang="ts">
+import type { SpeakerPreviewItem } from '~/types'
+import { getFullSpeakerName } from 'shared-code'
+import { computed, ref } from 'vue'
 
 const props = defineProps<{
-  speaker: SpeakerPreviewItem;
-}>();
+    speaker: SpeakerPreviewItem
+}>()
 
-const isExpanded = ref(false);
+const isExpanded = ref(false)
 
-const fullName = computed(() => getFullSpeakerName(props.speaker));
+const fullName = computed(() => getFullSpeakerName(props.speaker))
 
 // Create platform list
 const platforms = computed(() => {
     return {
-      github_url: props.speaker.github_url,
-      twitter_url: props.speaker.twitter_url,
-      bluesky_url: props.speaker.bluesky_url,
-      linkedin_url: props.speaker.linkedin_url,
-      instagram_url: props.speaker.instagram_url,
-      youtube_url: props.speaker.youtube_url,
-      website_url: props.speaker.website_url,
+        github_url: props.speaker.github_url,
+        twitter_url: props.speaker.twitter_url,
+        bluesky_url: props.speaker.bluesky_url,
+        linkedin_url: props.speaker.linkedin_url,
+        instagram_url: props.speaker.instagram_url,
+        youtube_url: props.speaker.youtube_url,
+        website_url: props.speaker.website_url,
     }
-  });
+})
 </script>
 
 <style scoped>
 .speaker-box {
-  background: var(--Grey, #131415);
+    background: var(--Grey, #131415);
 }
 </style>
diff --git a/nuxt-app/components/ConferenceSpeakersSlider.vue b/nuxt-app/components/ConferenceSpeakersSlider.vue
index 79f93184..bb629165 100644
--- a/nuxt-app/components/ConferenceSpeakersSlider.vue
+++ b/nuxt-app/components/ConferenceSpeakersSlider.vue
@@ -30,7 +30,7 @@
         <button
             v-for="index of 2"
             :key="index"
-            class="absolute top-0 block h-full w-5 md:w-40 from-black to-transparent transition-opacity duration-500 3xl:w-80"
+            class="absolute top-0 block h-full w-5 from-black to-transparent transition-opacity duration-500 md:w-40 3xl:w-80"
             :class="[
                 index === 1 ? 'left-0 bg-gradient-to-r' : 'right-0 bg-gradient-to-l',
                 ((index === 1 && scrollStartReached) || (index === 2 && scrollEndReached)) &&
@@ -42,8 +42,8 @@
             "
             type="button"
             :title="index === 1 ? 'Scroll left' : 'Scroll right'"
-            :data-cursor-arrow-left="(index === 1 && !scrollStartReached) ? true : null"
-            :data-cursor-arrow-right="(index === 2 && !scrollEndReached) ? true : null"
+            :data-cursor-arrow-left="index === 1 && !scrollStartReached ? true : null"
+            :data-cursor-arrow-right="index === 2 && !scrollEndReached ? true : null"
             @click="() => scrollTo(index === 1 ? 'left' : 'right')"
         />
     </div>
@@ -52,14 +52,14 @@
 <script setup lang="ts">
 import { CLICK_SCROLL_LEFT_ARROW_EVENT_ID, CLICK_SCROLL_RIGHT_ARROW_EVENT_ID } from '~/config'
 import { trackGoal } from '~/helpers'
-import type { SpeakerPreviewItem } from '~/types';
+import type { SpeakerPreviewItem } from '~/types'
 import { onMounted, ref } from 'vue'
 import FadeAnimation from './FadeAnimation.vue'
 import GenericLazyList from './GenericLazyList.vue'
 import GenericListItem from './GenericListItem.vue'
 
 defineProps<{
-  speakers: SpeakerPreviewItem[]
+    speakers: SpeakerPreviewItem[]
 }>()
 
 // Create scroll box element reference
diff --git a/nuxt-app/components/ConferenceTicketBlue.vue b/nuxt-app/components/ConferenceTicketBlue.vue
index 64a1d759..2d70b463 100644
--- a/nuxt-app/components/ConferenceTicketBlue.vue
+++ b/nuxt-app/components/ConferenceTicketBlue.vue
@@ -1,47 +1,130 @@
 <template>
-  <svg viewBox="0 0 465 319" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g filter="url(#filter0_ii_2727_4020)">
-      <path d="M406.444 27.6023C438.398 29.8519 462.476 57.5985 460.227 89.5518L457.844 123.388C427.949 121.283 402.008 143.812 399.903 173.708C397.815 203.37 419.977 229.139 449.524 231.595L450.223 231.649L448.15 261.097C445.9 293.05 418.172 317.141 386.219 314.891L58.1977 291.798C26.2443 289.549 2.16514 261.813 4.41471 229.859L6.48799 200.41C36.3833 202.514 62.3247 179.985 64.4295 150.09C66.5178 120.428 44.3557 94.6581 14.8089 92.2016L14.1097 92.1485L16.4925 58.3035C18.7422 26.3503 46.4699 2.25968 78.4232 4.50923L406.444 27.6023Z" fill="url(#prepended_paint0_linear_2727_4020)"/>
-    </g>
-    <text transform="translate(136.416 33.9502) rotate(4.02705)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="32" font-weight="bold" letter-spacing="0em"><tspan x="0.4375" y="31.312">{{ ticket.title }}</tspan></text>
-    <text transform="translate(72.4727 205.891) rotate(4.02705)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="24" font-weight="bold" letter-spacing="-0.3em"><tspan x="89.8578" y="56.484"> </tspan></text>
-    <text transform="translate(72.4727 205.891) rotate(4.02705)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="24" font-weight="bold" letter-spacing="0em"><tspan x="0.40625" y="24.484">{{ ticket.subtitle }}</tspan></text>
-    <text transform="translate(68.9492 93.3589) rotate(4.02705)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="0em"><tspan x="25.2426" y="86.08">{{ ticket.price }}</tspan></text>
-    <text transform="translate(68.9492 93.3589) rotate(4.02705)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="-0.1em"><tspan x="228.79" y="86.08"> </tspan></text>
-    <defs>
-      <filter id="filter0_ii_2727_4020" x="-1.73047" y="-3.63623" width="468.104" height="326.673" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-        <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-        <feOffset dx="-6" dy="-8"/>
-        <feGaussianBlur stdDeviation="5"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.473964 0 0 0 0 0.751188 0 0 0 0.7 0"/>
-        <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4020"/>
-        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-        <feOffset dx="6" dy="8"/>
-        <feGaussianBlur stdDeviation="5"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0"/>
-        <feBlend mode="normal" in2="effect1_innerShadow_2727_4020" result="effect2_innerShadow_2727_4020"/>
-      </filter>
-      <linearGradient id="prepended_paint0_linear_2727_4020" x1="185.98" y1="43.7093" x2="319.614" y2="318.964" gradientUnits="userSpaceOnUse">
-        <stop stop-color="#2CB1FF"/>
-        <stop offset="1" stop-color="#00A1FF"/>
-      </linearGradient>
-    </defs>
-  </svg>
+    <svg viewBox="0 0 465 319" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g filter="url(#filter0_ii_2727_4020)">
+            <path
+                d="M406.444 27.6023C438.398 29.8519 462.476 57.5985 460.227 89.5518L457.844 123.388C427.949 121.283 402.008 143.812 399.903 173.708C397.815 203.37 419.977 229.139 449.524 231.595L450.223 231.649L448.15 261.097C445.9 293.05 418.172 317.141 386.219 314.891L58.1977 291.798C26.2443 289.549 2.16514 261.813 4.41471 229.859L6.48799 200.41C36.3833 202.514 62.3247 179.985 64.4295 150.09C66.5178 120.428 44.3557 94.6581 14.8089 92.2016L14.1097 92.1485L16.4925 58.3035C18.7422 26.3503 46.4699 2.25968 78.4232 4.50923L406.444 27.6023Z"
+                fill="url(#prepended_paint0_linear_2727_4020)"
+            />
+        </g>
+        <text
+            transform="translate(136.416 33.9502) rotate(4.02705)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="32"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="0.4375" y="31.312">{{ ticket.title }}</tspan>
+        </text>
+        <text
+            transform="translate(72.4727 205.891) rotate(4.02705)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="24"
+            font-weight="bold"
+            letter-spacing="-0.3em"
+        >
+            <tspan x="89.8578" y="56.484"></tspan>
+        </text>
+        <text
+            transform="translate(72.4727 205.891) rotate(4.02705)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="24"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="0.40625" y="24.484">{{ ticket.subtitle }}</tspan>
+        </text>
+        <text
+            transform="translate(68.9492 93.3589) rotate(4.02705)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="25.2426" y="86.08">{{ ticket.price }}</tspan>
+        </text>
+        <text
+            transform="translate(68.9492 93.3589) rotate(4.02705)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="-0.1em"
+        >
+            <tspan x="228.79" y="86.08"></tspan>
+        </text>
+        <defs>
+            <filter
+                id="filter0_ii_2727_4020"
+                x="-1.73047"
+                y="-3.63623"
+                width="468.104"
+                height="326.673"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+            >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="-6" dy="-8" />
+                <feGaussianBlur stdDeviation="5" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.473964 0 0 0 0 0.751188 0 0 0 0.7 0" />
+                <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4020" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="6" dy="8" />
+                <feGaussianBlur stdDeviation="5" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0" />
+                <feBlend mode="normal" in2="effect1_innerShadow_2727_4020" result="effect2_innerShadow_2727_4020" />
+            </filter>
+            <linearGradient
+                id="prepended_paint0_linear_2727_4020"
+                x1="185.98"
+                y1="43.7093"
+                x2="319.614"
+                y2="318.964"
+                gradientUnits="userSpaceOnUse"
+            >
+                <stop stop-color="#2CB1FF" />
+                <stop offset="1" stop-color="#00A1FF" />
+            </linearGradient>
+        </defs>
+    </svg>
 </template>
 
 <script setup lang="ts">
 type Ticket = {
-  price: string,
-  title: string,
-  subtitle: string,
-  style: string,
+    price: string
+    title: string
+    subtitle: string
+    style: string
 }
 
 defineProps<{
-  ticket: Ticket,
-}>();
+    ticket: Ticket
+}>()
 </script>
diff --git a/nuxt-app/components/ConferenceTicketLime.vue b/nuxt-app/components/ConferenceTicketLime.vue
index 5764241b..f70f164e 100644
--- a/nuxt-app/components/ConferenceTicketLime.vue
+++ b/nuxt-app/components/ConferenceTicketLime.vue
@@ -1,64 +1,120 @@
 <template>
-  <svg viewBox="0 0 496 375" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g filter="url(#filter0_ii_2727_4012)">
-      <path
-        d="M378.47 12.6758C409.803 6.01906 440.604 26.0424 447.261 57.3755L454.31 90.5549C424.995 96.7829 406.279 125.597 412.507 154.912C418.686 183.998 447.1 202.649 476.177 196.856L476.864 196.715L482.999 225.591C489.655 256.924 469.653 287.731 438.32 294.388L116.666 362.724C85.3329 369.381 54.5341 349.368 47.8773 318.035L41.7422 289.157C71.0572 282.929 89.773 254.115 83.5452 224.8C77.3658 195.714 48.9521 177.062 19.875 182.855L19.1883 182.997L12.1375 149.809C5.48094 118.476 25.4828 87.6685 56.8158 81.0118L378.47 12.6758Z"
-        fill="#CFFF00"/>
-    </g>
-    <text
-transform="translate(110.898 103.382) rotate(-11.9943)" fill="black" xml:space="preserve"
-          style="white-space: pre" font-family="Museo Sans" font-size="32" font-weight="bold" letter-spacing="0em"><tspan x="0.03125" y="31.312">{{ ticket.title }}</tspan></text>
-    <text
-transform="translate(114 274.343) rotate(-11.9943)" fill="black" xml:space="preserve" style="white-space: pre"
-          font-family="Azeret Mono" font-size="24" font-weight="bold" letter-spacing="-0.3em"><tspan x="81.8578" y="56.484"> </tspan></text>
-    <text
-id="" transform="translate(114 274.343) rotate(-11.9943)" fill="black" xml:space="preserve"
-          style="white-space: pre" font-family="Museo Sans" font-size="24" font-weight="bold" letter-spacing="0em">
-    <tspan id="textPre" x="0.210938" y="24.484">{{ ticket.subtitle }}</tspan>
-  </text>
-    <text
-transform="translate(72.2324 177.025) rotate(-11.9943)" fill="black" xml:space="preserve"
-          style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="0em"><tspan id="textPrice" x="60.5707" y="86.08" >{{ ticket.price }}</tspan>
-    </text>
-    <text
-transform="translate(72.2324 177.025) rotate(-11.9943)" fill="black" xml:space="preserve"
-          style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="-0.1em"><tspan x="193.461" y="86.08"> </tspan></text>
-    <defs>
-      <filter
-id="filter0_ii_2727_4012" x="4.85938" y="3.39844" width="485.418" height="370.604"
-              filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-        <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-        <feColorMatrix
-in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                       result="hardAlpha"/>
-        <feOffset dx="-6" dy="-8"/>
-        <feGaussianBlur stdDeviation="5"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 0.314602 0 0 0 0 0.388265 0 0 0 0 0 0 0 0 0.7 0"/>
-        <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4012"/>
-        <feColorMatrix
-in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-                       result="hardAlpha"/>
-        <feOffset dx="6" dy="10"/>
-        <feGaussianBlur stdDeviation="5"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0"/>
-        <feBlend mode="normal" in2="effect1_innerShadow_2727_4012" result="effect2_innerShadow_2727_4012"/>
-      </filter>
-    </defs>
-  </svg>
+    <svg viewBox="0 0 496 375" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g filter="url(#filter0_ii_2727_4012)">
+            <path
+                d="M378.47 12.6758C409.803 6.01906 440.604 26.0424 447.261 57.3755L454.31 90.5549C424.995 96.7829 406.279 125.597 412.507 154.912C418.686 183.998 447.1 202.649 476.177 196.856L476.864 196.715L482.999 225.591C489.655 256.924 469.653 287.731 438.32 294.388L116.666 362.724C85.3329 369.381 54.5341 349.368 47.8773 318.035L41.7422 289.157C71.0572 282.929 89.773 254.115 83.5452 224.8C77.3658 195.714 48.9521 177.062 19.875 182.855L19.1883 182.997L12.1375 149.809C5.48094 118.476 25.4828 87.6685 56.8158 81.0118L378.47 12.6758Z"
+                fill="#CFFF00"
+            />
+        </g>
+        <text
+            transform="translate(110.898 103.382) rotate(-11.9943)"
+            fill="black"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="32"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="0.03125" y="31.312">{{ ticket.title }}</tspan>
+        </text>
+        <text
+            transform="translate(114 274.343) rotate(-11.9943)"
+            fill="black"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Azeret Mono"
+            font-size="24"
+            font-weight="bold"
+            letter-spacing="-0.3em"
+        >
+            <tspan x="81.8578" y="56.484"></tspan>
+        </text>
+        <text
+            id=""
+            transform="translate(114 274.343) rotate(-11.9943)"
+            fill="black"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="24"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan id="textPre" x="0.210938" y="24.484">{{ ticket.subtitle }}</tspan>
+        </text>
+        <text
+            transform="translate(72.2324 177.025) rotate(-11.9943)"
+            fill="black"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan id="textPrice" x="60.5707" y="86.08">{{ ticket.price }}</tspan>
+        </text>
+        <text
+            transform="translate(72.2324 177.025) rotate(-11.9943)"
+            fill="black"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="-0.1em"
+        >
+            <tspan x="193.461" y="86.08"></tspan>
+        </text>
+        <defs>
+            <filter
+                id="filter0_ii_2727_4012"
+                x="4.85938"
+                y="3.39844"
+                width="485.418"
+                height="370.604"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+            >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="-6" dy="-8" />
+                <feGaussianBlur stdDeviation="5" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 0.314602 0 0 0 0 0.388265 0 0 0 0 0 0 0 0 0.7 0" />
+                <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4012" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="6" dy="10" />
+                <feGaussianBlur stdDeviation="5" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0" />
+                <feBlend mode="normal" in2="effect1_innerShadow_2727_4012" result="effect2_innerShadow_2727_4012" />
+            </filter>
+        </defs>
+    </svg>
 </template>
 
 <script setup lang="ts">
 type Ticket = {
-  price: string,
-  title: string,
-  subtitle: string,
-  style: string,
+    price: string
+    title: string
+    subtitle: string
+    style: string
 }
 
 defineProps<{
-  ticket: Ticket,
-}>();
+    ticket: Ticket
+}>()
 </script>
diff --git a/nuxt-app/components/ConferenceTicketRed.vue b/nuxt-app/components/ConferenceTicketRed.vue
index 8b849422..8964d225 100644
--- a/nuxt-app/components/ConferenceTicketRed.vue
+++ b/nuxt-app/components/ConferenceTicketRed.vue
@@ -1,47 +1,118 @@
 <template>
-  <svg viewBox="0 0 473 333" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g filter="url(#filter0_ii_2727_4028)">
-      <path d="M384.918 6.62689C416.779 3.32251 445.289 26.4922 448.593 58.3536L452.093 92.0926C422.283 95.1842 400.624 121.856 403.715 151.666C406.783 181.242 433.064 202.795 462.59 200.11L463.288 200.043L466.334 229.406C469.638 261.267 446.489 289.786 414.627 293.09L87.5488 327.012C55.6872 330.317 27.1786 307.158 23.8741 275.296L20.8286 245.931C50.6381 242.84 72.2973 216.168 69.2059 186.358C66.1384 156.782 39.8575 135.228 10.3307 137.913L9.63283 137.981L6.13277 104.233C2.82859 72.372 25.9775 43.8534 57.839 40.549L384.918 6.62689Z" fill="url(#paint0_linear_2727_4028)"/>
-    </g>
-    <text transform="translate(151.83 65.4861) rotate(-5.92111)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="32" font-weight="bold" letter-spacing="0em"><tspan x="0.15625" y="31.312">{{ ticket.title }}</tspan></text>
-    <text transform="translate(88 252.291) rotate(-6.72777)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="24" font-weight="bold" letter-spacing="0em"><tspan x="0.40625" y="24.484">{{ ticket.subtitle }}</tspan></text>
-    <text transform="translate(64.8066 138.855) rotate(-5.92111)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="0em"><tspan x="26.6098" y="86.08">{{ ticket.price }}</tspan></text>
-    <text transform="translate(64.8066 138.855) rotate(-5.92111)" fill="white" xml:space="preserve" style="white-space: pre" font-family="Museo Sans" font-size="112" font-weight="bold" letter-spacing="-0.1em"><tspan x="227.422" y="86.08"> </tspan></text>
-    <defs>
-      <filter id="filter0_ii_2727_4028" x="-0.181641" y="-1.68701" width="472.83" height="337.013" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-        <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-        <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-        <feOffset dx="6" dy="8"/>
-        <feGaussianBlur stdDeviation="4"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0"/>
-        <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4028"/>
-        <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-        <feOffset dx="-6" dy="-8"/>
-        <feGaussianBlur stdDeviation="5"/>
-        <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
-        <feColorMatrix type="matrix" values="0 0 0 0 0.456104 0 0 0 0 0 0 0 0 0 0.20592 0 0 0 0.7 0"/>
-        <feBlend mode="normal" in2="effect1_innerShadow_2727_4028" result="effect2_innerShadow_2727_4028"/>
-      </filter>
-      <linearGradient id="paint0_linear_2727_4028" x1="129.564" y1="48.56" x2="412.563" y2="300.478" gradientUnits="userSpaceOnUse">
-        <stop stop-color="#FA338D"/>
-        <stop offset="1" stop-color="#FF0074"/>
-      </linearGradient>
-    </defs>
-  </svg>
-
+    <svg viewBox="0 0 473 333" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g filter="url(#filter0_ii_2727_4028)">
+            <path
+                d="M384.918 6.62689C416.779 3.32251 445.289 26.4922 448.593 58.3536L452.093 92.0926C422.283 95.1842 400.624 121.856 403.715 151.666C406.783 181.242 433.064 202.795 462.59 200.11L463.288 200.043L466.334 229.406C469.638 261.267 446.489 289.786 414.627 293.09L87.5488 327.012C55.6872 330.317 27.1786 307.158 23.8741 275.296L20.8286 245.931C50.6381 242.84 72.2973 216.168 69.2059 186.358C66.1384 156.782 39.8575 135.228 10.3307 137.913L9.63283 137.981L6.13277 104.233C2.82859 72.372 25.9775 43.8534 57.839 40.549L384.918 6.62689Z"
+                fill="url(#paint0_linear_2727_4028)"
+            />
+        </g>
+        <text
+            transform="translate(151.83 65.4861) rotate(-5.92111)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="32"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="0.15625" y="31.312">{{ ticket.title }}</tspan>
+        </text>
+        <text
+            transform="translate(88 252.291) rotate(-6.72777)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="24"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="0.40625" y="24.484">{{ ticket.subtitle }}</tspan>
+        </text>
+        <text
+            transform="translate(64.8066 138.855) rotate(-5.92111)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="0em"
+        >
+            <tspan x="26.6098" y="86.08">{{ ticket.price }}</tspan>
+        </text>
+        <text
+            transform="translate(64.8066 138.855) rotate(-5.92111)"
+            fill="white"
+            xml:space="preserve"
+            style="white-space: pre"
+            font-family="Museo Sans"
+            font-size="112"
+            font-weight="bold"
+            letter-spacing="-0.1em"
+        >
+            <tspan x="227.422" y="86.08"></tspan>
+        </text>
+        <defs>
+            <filter
+                id="filter0_ii_2727_4028"
+                x="-0.181641"
+                y="-1.68701"
+                width="472.83"
+                height="337.013"
+                filterUnits="userSpaceOnUse"
+                color-interpolation-filters="sRGB"
+            >
+                <feFlood flood-opacity="0" result="BackgroundImageFix" />
+                <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="6" dy="8" />
+                <feGaussianBlur stdDeviation="4" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.25 0" />
+                <feBlend mode="normal" in2="shape" result="effect1_innerShadow_2727_4028" />
+                <feColorMatrix
+                    in="SourceAlpha"
+                    type="matrix"
+                    values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+                    result="hardAlpha"
+                />
+                <feOffset dx="-6" dy="-8" />
+                <feGaussianBlur stdDeviation="5" />
+                <feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1" />
+                <feColorMatrix type="matrix" values="0 0 0 0 0.456104 0 0 0 0 0 0 0 0 0 0.20592 0 0 0 0.7 0" />
+                <feBlend mode="normal" in2="effect1_innerShadow_2727_4028" result="effect2_innerShadow_2727_4028" />
+            </filter>
+            <linearGradient
+                id="paint0_linear_2727_4028"
+                x1="129.564"
+                y1="48.56"
+                x2="412.563"
+                y2="300.478"
+                gradientUnits="userSpaceOnUse"
+            >
+                <stop stop-color="#FA338D" />
+                <stop offset="1" stop-color="#FF0074" />
+            </linearGradient>
+        </defs>
+    </svg>
 </template>
 
 <script setup lang="ts">
 type Ticket = {
-  price: string,
-  title: string,
-  subtitle: string,
-  style: string,
+    price: string
+    title: string
+    subtitle: string
+    style: string
 }
 
 defineProps<{
-  ticket: Ticket,
-}>();
+    ticket: Ticket
+}>()
 </script>
diff --git a/nuxt-app/components/ConferenceTickets.vue b/nuxt-app/components/ConferenceTickets.vue
index 70bd0a83..0cead530 100644
--- a/nuxt-app/components/ConferenceTickets.vue
+++ b/nuxt-app/components/ConferenceTickets.vue
@@ -1,35 +1,32 @@
 <template>
-  <client-only>
-    <template #default>
-    <div class='flex flex-row flex-wrap space justify-around mt-8'>
-      <div v-for="(ticket) in tickets" :key="ticket.price">
-        <ConferenceTicketLime v-if='ticket.style === "lime"' :ticket="ticket" class='h-64'/>
-        <ConferenceTicketBlue v-if='ticket.style === "blue"' :ticket="ticket" class='h-64'/>
-        <ConferenceTicketRed v-if='ticket.style === "red"' :ticket="ticket" class='h-64'/>
-      </div>
-    </div>
-    </template>
-  </client-only>
+    <client-only>
+        <template #default>
+            <div class="space mt-8 flex flex-row flex-wrap justify-around">
+                <div v-for="ticket in tickets" :key="ticket.price">
+                    <ConferenceTicketLime v-if="ticket.style === 'lime'" :ticket="ticket" class="h-64" />
+                    <ConferenceTicketBlue v-if="ticket.style === 'blue'" :ticket="ticket" class="h-64" />
+                    <ConferenceTicketRed v-if="ticket.style === 'red'" :ticket="ticket" class="h-64" />
+                </div>
+            </div>
+        </template>
+    </client-only>
 </template>
 
-
 <script setup lang="ts">
-import ConferenceTicketLime from '~/components/ConferenceTicketLime.vue';
+import ConferenceTicketLime from '~/components/ConferenceTicketLime.vue'
 
 type Ticket = {
-  price: string,
-  title: string,
-  subtitle: string,
-  style: string,
+    price: string
+    title: string
+    subtitle: string
+    style: string
 }
 
 const props = defineProps<{
-  tickets: Ticket[],
-  ticketsOnSale: boolean,
-  ticketsUrl: string | null
-}>();
-
+    tickets: Ticket[]
+    ticketsOnSale: boolean
+    ticketsUrl: string | null
+}>()
 </script>
 
-<style lang="postcss" scoped>
-</style>
+<style lang="postcss" scoped></style>
diff --git a/nuxt-app/components/DirectusImage.vue b/nuxt-app/components/DirectusImage.vue
index 967094dd..e381c9ff 100644
--- a/nuxt-app/components/DirectusImage.vue
+++ b/nuxt-app/components/DirectusImage.vue
@@ -13,10 +13,10 @@
 </template>
 
 <script lang="ts">
+import { getAssetUrl } from '~/helpers/getAssetUrl'
 import type { PropType } from 'vue'
 import { computed, defineComponent } from 'vue'
 import type { FileItem } from '../types'
-import { getAssetUrl } from '~/helpers/getAssetUrl';
 
 export default defineComponent({
     props: {
diff --git a/nuxt-app/components/EmbeddedVideoPlayer.vue b/nuxt-app/components/EmbeddedVideoPlayer.vue
index 7966afc4..181a4c3d 100644
--- a/nuxt-app/components/EmbeddedVideoPlayer.vue
+++ b/nuxt-app/components/EmbeddedVideoPlayer.vue
@@ -1,100 +1,102 @@
 <template>
-  <div class="relative">
-    <!-- Spotlight glow — the signature blurred blue/pink light behind the stage.
+    <div class="relative">
+        <!-- Spotlight glow — the signature blurred blue/pink light behind the stage.
          Each spotlight matches the Figma spec (671px circle, opacity .8,
          blur 150px). The soft blur halo provides the bleed past the frame; the
          circle boxes themselves are sized down on smaller screens so they never
          push the page wider than the viewport. -->
-    <div v-if="spotlights" class="pointer-events-none absolute inset-0 z-0" aria-hidden="true">
-      <div
-        class="absolute left-0 top-0 h-64 w-64 rounded-full bg-blue opacity-80 blur-[150px] md:h-96 md:w-96 lg:h-160 lg:w-160"
-      />
-      <div
-        class="absolute bottom-0 right-0 h-64 w-64 rounded-full bg-pink opacity-80 blur-[150px] md:h-96 md:w-96  lg:h-160 lg:w-160"
-      />
-    </div>
-
-    <!-- Stage — sharp frame with a fine lime hairline -->
-    <div class="relative z-10 aspect-video w-full overflow-hidden bg-gray-900 outline outline-1 -outline-offset-1 outline-lime/40">
-      <!-- Consent placeholder -->
-      <template v-if="!showVideo">
-        <img
-          v-if="thumbnailUrl"
-          :src="thumbnailUrl"
-          alt="Video-Vorschaubild"
-          class="absolute inset-0 h-full w-full object-cover"
-          @error="onThumbnailError"
-        />
-        <div class="absolute inset-0 bg-black/50" />
-
-        <!-- Brand overlay (episode + link to YouTube) -->
-        <div class="absolute inset-x-0 top-0 z-20 flex items-center justify-between gap-3 bg-gradient-to-b from-black/70 to-transparent px-4 py-4 md:px-5">
-          <a
-            :href="url"
-            target="_blank"
-            rel="noreferrer"
-            class="ml-auto inline-flex items-center gap-2 text-[11px] font-black uppercase tracking-widest text-white transition-colors hover:text-lime"
-            data-cursor-hover
-          >
-            <LeaveSiteIcon class="h-4 w-4" />
-            Auf YouTube ansehen
-          </a>
+        <div v-if="spotlights" class="pointer-events-none absolute inset-0 z-0" aria-hidden="true">
+            <div
+                class="absolute left-0 top-0 h-64 w-64 rounded-full bg-blue opacity-80 blur-[150px] md:h-96 md:w-96 lg:h-160 lg:w-160"
+            />
+            <div
+                class="absolute bottom-0 right-0 h-64 w-64 rounded-full bg-pink opacity-80 blur-[150px] md:h-96 md:w-96 lg:h-160 lg:w-160"
+            />
         </div>
 
-        <!-- Center play button with pulse glow -->
-        <div class="absolute inset-0 flex items-center justify-center">
-          <button
-            class="embedded-video-player__pulse relative rounded-full text-lime transition-transform hover:scale-105"
-            aria-label="Video laden"
-            data-cursor-hover
-            @click="handleLoadVideo"
-          >
-            <PlayCircleFilledIcon class="h-20 w-20 md:h-24 md:w-24" />
-          </button>
-        </div>
-
-        <!-- Consent bar -->
-        <div class="absolute inset-x-0 bottom-0 z-20 bg-gradient-to-t from-black/80 to-transparent px-4 py-5 md:px-6">
-          <div class="flex flex-wrap items-center justify-center gap-x-4 gap-y-3">
-            <button
-              class="inline-flex items-center gap-2 rounded-full border-3 border-lime px-6 py-2 text-sm font-black uppercase tracking-widest text-lime transition-colors hover:bg-lime hover:text-black"
-              data-cursor-hover
-              @click="handleLoadVideo"
-            >
-              <PlayIcon class="h-4 w-4" />
-              Video laden
-            </button>
-            <p class="text-xs font-light text-white/80">
-              Es werden Daten an YouTube übertragen.
-              <NuxtLink class="text-blue underline hover:text-white" to="/datenschutz" data-cursor-hover>
-                Datenschutz
-              </NuxtLink>
-            </p>
-            <label class="inline-flex cursor-pointer items-center gap-2 text-xs font-medium text-white/70">
-              <input
-                v-model="rememberChoice"
-                type="checkbox"
-                class="h-4 w-4 accent-lime"
-              />
-              Immer erlauben
-            </label>
-          </div>
-        </div>
-      </template>
-
-      <!-- Iframe (loaded after consent) — native YouTube controls -->
-      <template v-else>
-        <iframe
-          ref="iframeRef"
-          type="text/html"
-          :src="embedUrl"
-          class="absolute inset-0 h-full w-full"
-          frameborder="0"
-          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-          allowfullscreen
-        />
-        <!-- Persistent brand overlay above the native chrome -->
-        <!-- <div class="pointer-events-none absolute inset-x-0 top-0 z-20 flex items-center justify-between gap-3 bg-gradient-to-b from-black/70 to-transparent px-4 py-4 md:px-5">
+        <!-- Stage — sharp frame with a fine lime hairline -->
+        <div
+            class="relative z-10 aspect-video w-full overflow-hidden bg-gray-900 outline outline-1 -outline-offset-1 outline-lime/40"
+        >
+            <!-- Consent placeholder -->
+            <template v-if="!showVideo">
+                <img
+                    v-if="thumbnailUrl"
+                    :src="thumbnailUrl"
+                    alt="Video-Vorschaubild"
+                    class="absolute inset-0 h-full w-full object-cover"
+                    @error="onThumbnailError"
+                />
+                <div class="absolute inset-0 bg-black/50" />
+
+                <!-- Brand overlay (episode + link to YouTube) -->
+                <div
+                    class="absolute inset-x-0 top-0 z-20 flex items-center justify-between gap-3 bg-gradient-to-b from-black/70 to-transparent px-4 py-4 md:px-5"
+                >
+                    <a
+                        :href="url"
+                        target="_blank"
+                        rel="noreferrer"
+                        class="ml-auto inline-flex items-center gap-2 text-[11px] font-black uppercase tracking-widest text-white transition-colors hover:text-lime"
+                        data-cursor-hover
+                    >
+                        <LeaveSiteIcon class="h-4 w-4" />
+                        Auf YouTube ansehen
+                    </a>
+                </div>
+
+                <!-- Center play button with pulse glow -->
+                <div class="absolute inset-0 flex items-center justify-center">
+                    <button
+                        class="embedded-video-player__pulse relative rounded-full text-lime transition-transform hover:scale-105"
+                        aria-label="Video laden"
+                        data-cursor-hover
+                        @click="handleLoadVideo"
+                    >
+                        <PlayCircleFilledIcon class="h-20 w-20 md:h-24 md:w-24" />
+                    </button>
+                </div>
+
+                <!-- Consent bar -->
+                <div
+                    class="absolute inset-x-0 bottom-0 z-20 bg-gradient-to-t from-black/80 to-transparent px-4 py-5 md:px-6"
+                >
+                    <div class="flex flex-wrap items-center justify-center gap-x-4 gap-y-3">
+                        <button
+                            class="inline-flex items-center gap-2 rounded-full border-3 border-lime px-6 py-2 text-sm font-black uppercase tracking-widest text-lime transition-colors hover:bg-lime hover:text-black"
+                            data-cursor-hover
+                            @click="handleLoadVideo"
+                        >
+                            <PlayIcon class="h-4 w-4" />
+                            Video laden
+                        </button>
+                        <p class="text-xs font-light text-white/80">
+                            Es werden Daten an YouTube übertragen.
+                            <NuxtLink class="text-blue underline hover:text-white" to="/datenschutz" data-cursor-hover>
+                                Datenschutz
+                            </NuxtLink>
+                        </p>
+                        <label class="inline-flex cursor-pointer items-center gap-2 text-xs font-medium text-white/70">
+                            <input v-model="rememberChoice" type="checkbox" class="h-4 w-4 accent-lime" />
+                            Immer erlauben
+                        </label>
+                    </div>
+                </div>
+            </template>
+
+            <!-- Iframe (loaded after consent) — native YouTube controls -->
+            <template v-else>
+                <iframe
+                    ref="iframeRef"
+                    type="text/html"
+                    :src="embedUrl"
+                    class="absolute inset-0 h-full w-full"
+                    frameborder="0"
+                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                    allowfullscreen
+                />
+                <!-- Persistent brand overlay above the native chrome -->
+                <!-- <div class="pointer-events-none absolute inset-x-0 top-0 z-20 flex items-center justify-between gap-3 bg-gradient-to-b from-black/70 to-transparent px-4 py-4 md:px-5">
           <a
             :href="url"
             target="_blank"
@@ -106,33 +108,33 @@
             Auf YouTube ansehen
           </a>
         </div>-->
-      </template>
+            </template>
+        </div>
     </div>
-  </div>
 </template>
 
 <script setup lang="ts">
-import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
 import LeaveSiteIcon from '~/assets/icons/leave-site.svg'
-import PlayIcon from '~/assets/icons/play.svg'
 import PlayCircleFilledIcon from '~/assets/icons/play-circle-filled.svg'
+import PlayIcon from '~/assets/icons/play.svg'
 import { createYouTubePlayerSource } from '~/composables/useMediaSource'
 import { usePodcastPlayer } from '~/composables/usePodcastPlayer'
 import { useVideoConsent } from '~/composables/useVideoConsent'
 import { useYouTubeIframeApi } from '~/composables/useYouTubeIframeApi'
 import { getAssetUrl } from '~/helpers/getAssetUrl'
 import type { FileItem, PodcastItem } from '~/types'
+import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
 
 const props = withDefaults(
-  defineProps<{
-    url: string
-    thumbnail?: FileItem | null
-    syncWithPodcastPlayer?: PodcastItem | null
-    spotlights: boolean
-  }>(),
-  {
-    spotlights: false,
-  }
+    defineProps<{
+        url: string
+        thumbnail?: FileItem | null
+        syncWithPodcastPlayer?: PodcastItem | null
+        spotlights: boolean
+    }>(),
+    {
+        spotlights: false,
+    }
 )
 
 const { hasConsented, grantConsent } = useVideoConsent()
@@ -151,65 +153,65 @@ const iframeRef = ref<HTMLIFrameElement | null>(null)
 // user must explicitly click "Video laden" to take over (setting
 // `localConsent`).
 const hasConflictingPlayback = computed(() => {
-  if (!syncEnabled.value || !podcastPlayer || !props.syncWithPodcastPlayer) return false
-  const current = podcastPlayer.podcast
-  if (!current) return false
-  return current.id !== props.syncWithPodcastPlayer.id
+    if (!syncEnabled.value || !podcastPlayer || !props.syncWithPodcastPlayer) return false
+    const current = podcastPlayer.podcast
+    if (!current) return false
+    return current.id !== props.syncWithPodcastPlayer.id
 })
 
 const showVideo = computed(() => {
-  if (localConsent.value) return true
-  if (hasConflictingPlayback.value) return false
-  return hasConsented.value
+    if (localConsent.value) return true
+    if (hasConflictingPlayback.value) return false
+    return hasConsented.value
 })
 
 function getVideoId(urlString: string): string | null {
-  try {
-    const url = new URL(urlString)
-    if (url.hostname === 'youtube.com' || url.hostname === 'www.youtube.com') {
-      return url.searchParams.get('v')
-    }
-    if (url.hostname === 'youtu.be') {
-      return url.pathname.slice(1)
+    try {
+        const url = new URL(urlString)
+        if (url.hostname === 'youtube.com' || url.hostname === 'www.youtube.com') {
+            return url.searchParams.get('v')
+        }
+        if (url.hostname === 'youtu.be') {
+            return url.pathname.slice(1)
+        }
+        return null
+    } catch {
+        return null
     }
-    return null
-  } catch {
-    return null
-  }
 }
 
 const videoId = computed(() => getVideoId(props.url))
 
 const embedUrl = computed(() => {
-  if (!videoId.value) return ''
-  const base = `https://www.youtube-nocookie.com/embed/${videoId.value}`
-  if (!syncEnabled.value) return base
-  const origin = typeof window !== 'undefined' ? window.location.origin : ''
-  return `${base}?enablejsapi=1&origin=${encodeURIComponent(origin)}`
+    if (!videoId.value) return ''
+    const base = `https://www.youtube-nocookie.com/embed/${videoId.value}`
+    if (!syncEnabled.value) return base
+    const origin = typeof window !== 'undefined' ? window.location.origin : ''
+    return `${base}?enablejsapi=1&origin=${encodeURIComponent(origin)}`
 })
 
 const thumbnailUrl = computed(() => {
-  if (props.thumbnail) {
-    return getAssetUrl(props.thumbnail)
-  }
-  if (!videoId.value) return ''
-  if (useFallbackThumbnail.value) {
-    return `https://img.youtube.com/vi/${videoId.value}/hqdefault.jpg`
-  }
-  return `https://img.youtube.com/vi/${videoId.value}/maxresdefault.jpg`
+    if (props.thumbnail) {
+        return getAssetUrl(props.thumbnail)
+    }
+    if (!videoId.value) return ''
+    if (useFallbackThumbnail.value) {
+        return `https://img.youtube.com/vi/${videoId.value}/hqdefault.jpg`
+    }
+    return `https://img.youtube.com/vi/${videoId.value}/maxresdefault.jpg`
 })
 
 function onThumbnailError() {
-  if (!useFallbackThumbnail.value && !props.thumbnail) {
-    useFallbackThumbnail.value = true
-  }
+    if (!useFallbackThumbnail.value && !props.thumbnail) {
+        useFallbackThumbnail.value = true
+    }
 }
 
 function handleLoadVideo() {
-  if (rememberChoice.value) {
-    grantConsent(true)
-  }
-  localConsent.value = true
+    if (rememberChoice.value) {
+        grantConsent(true)
+    }
+    localConsent.value = true
 }
 
 // --- Sync with the global podcast player (opt-in) -------------------------
@@ -223,102 +225,102 @@ let player: YT.Player | null = null
 let ourSourceActive = false
 
 async function initYouTubePlayer() {
-  if (!syncEnabled.value || !podcastPlayer || !props.syncWithPodcastPlayer) return
-  if (player) return
-
-  try {
-    const YTApi = await useYouTubeIframeApi()
-    await nextTick()
-    if (!iframeRef.value) return
-
-    player = new YTApi.Player(iframeRef.value, {
-      events: {
-        onReady: () => {
-          if (!player || !props.syncWithPodcastPlayer || !podcastPlayer) return
-
-          // If the bar already has *this* episode loaded (e.g. user
-          // navigated away and is now returning), pick up its current
-          // position so the video doesn't restart from zero. Read the
-          // time before `setPodcast`, which resets `currentTime` to 0.
-          const currentBarPodcast = podcastPlayer.podcast
-          const sameEpisode = currentBarPodcast?.id === props.syncWithPodcastPlayer.id
-          const resumeAt = sameEpisode ? podcastPlayer.currentTime : 0
-
-          podcastPlayer.setPodcast(props.syncWithPodcastPlayer, {
-            sourceFactory: (cb) => {
-              const source = createYouTubePlayerSource(player!, cb)
-              ourSourceActive = true
-              const originalDestroy = source.destroy
-              source.destroy = () => {
-                ourSourceActive = false
-                originalDestroy()
-              }
-              return source
+    if (!syncEnabled.value || !podcastPlayer || !props.syncWithPodcastPlayer) return
+    if (player) return
+
+    try {
+        const YTApi = await useYouTubeIframeApi()
+        await nextTick()
+        if (!iframeRef.value) return
+
+        player = new YTApi.Player(iframeRef.value, {
+            events: {
+                onReady: () => {
+                    if (!player || !props.syncWithPodcastPlayer || !podcastPlayer) return
+
+                    // If the bar already has *this* episode loaded (e.g. user
+                    // navigated away and is now returning), pick up its current
+                    // position so the video doesn't restart from zero. Read the
+                    // time before `setPodcast`, which resets `currentTime` to 0.
+                    const currentBarPodcast = podcastPlayer.podcast
+                    const sameEpisode = currentBarPodcast?.id === props.syncWithPodcastPlayer.id
+                    const resumeAt = sameEpisode ? podcastPlayer.currentTime : 0
+
+                    podcastPlayer.setPodcast(props.syncWithPodcastPlayer, {
+                        sourceFactory: (cb) => {
+                            const source = createYouTubePlayerSource(player!, cb)
+                            ourSourceActive = true
+                            const originalDestroy = source.destroy
+                            source.destroy = () => {
+                                ourSourceActive = false
+                                originalDestroy()
+                            }
+                            return source
+                        },
+                    })
+                    try {
+                        if (resumeAt > 0) {
+                            player.seekTo(resumeAt, true)
+                        }
+                        // User already clicked "Video laden" (or returned to a page
+                        // they previously consented on) — start playback so the
+                        // single-click load+play feels natural.
+                        player.playVideo()
+                    } catch {
+                        /* autoplay may be blocked; ignore */
+                    }
+                },
             },
-          })
-          try {
-            if (resumeAt > 0) {
-              player.seekTo(resumeAt, true)
-            }
-            // User already clicked "Video laden" (or returned to a page
-            // they previously consented on) — start playback so the
-            // single-click load+play feels natural.
-            player.playVideo()
-          } catch {
-            /* autoplay may be blocked; ignore */
-          }
-        },
-      },
-    })
-  } catch (error) {
-    // API failed to load — keep the iframe as a plain embed, no bar sync.
-    console.warn('YouTube IFrame API failed to load', error)
-  }
+        })
+    } catch (error) {
+        // API failed to load — keep the iframe as a plain embed, no bar sync.
+        console.warn('YouTube IFrame API failed to load', error)
+    }
 }
 
 watch(
-  showVideo,
-  (visible) => {
-    if (visible && syncEnabled.value) {
-      void initYouTubePlayer()
-    }
-  },
-  { immediate: true }
+    showVideo,
+    (visible) => {
+        if (visible && syncEnabled.value) {
+            void initYouTubePlayer()
+        }
+    },
+    { immediate: true }
 )
 
 onBeforeUnmount(() => {
-  if (!syncEnabled.value || !podcastPlayer || !player) return
+    if (!syncEnabled.value || !podcastPlayer || !player) return
+
+    // Capture state before tearing the player down.
+    const shouldHandoff = ourSourceActive
+    let seekTime = 0
+    let wasPlaying = false
+    if (shouldHandoff) {
+        try {
+            seekTime = player.getCurrentTime() ?? 0
+        } catch {
+            /* player may be in an unusable state; fall back to 0 */
+        }
+        // Use the bar's own play state rather than player.getPlayerState() —
+        // by the time onBeforeUnmount runs, YT may have already flipped away
+        // from PLAYING.
+        wasPlaying = !podcastPlayer.paused
+    }
 
-  // Capture state before tearing the player down.
-  const shouldHandoff = ourSourceActive
-  let seekTime = 0
-  let wasPlaying = false
-  if (shouldHandoff) {
+    // Destroy the YouTube player FIRST. While the iframe is alive Chrome
+    // ties media-session state to it, and starting the audio element load
+    // before the iframe is gone can cause the audio fetch to fail with a
+    // MEDIA_ERR_SRC_NOT_SUPPORTED ("Format error").
     try {
-      seekTime = player.getCurrentTime() ?? 0
+        player.destroy()
     } catch {
-      /* player may be in an unusable state; fall back to 0 */
+        /* ignore — iframe may already be detached */
+    }
+    player = null
+
+    if (shouldHandoff) {
+        podcastPlayer.switchToAudioElement({ seekTime, autoplay: wasPlaying })
     }
-    // Use the bar's own play state rather than player.getPlayerState() —
-    // by the time onBeforeUnmount runs, YT may have already flipped away
-    // from PLAYING.
-    wasPlaying = !podcastPlayer.paused
-  }
-
-  // Destroy the YouTube player FIRST. While the iframe is alive Chrome
-  // ties media-session state to it, and starting the audio element load
-  // before the iframe is gone can cause the audio fetch to fail with a
-  // MEDIA_ERR_SRC_NOT_SUPPORTED ("Format error").
-  try {
-    player.destroy()
-  } catch {
-    /* ignore — iframe may already be detached */
-  }
-  player = null
-
-  if (shouldHandoff) {
-    podcastPlayer.switchToAudioElement({ seekTime, autoplay: wasPlaying })
-  }
 })
 </script>
 
diff --git a/nuxt-app/components/FaqItem.vue b/nuxt-app/components/FaqItem.vue
index 7ae3a18b..52a06e28 100644
--- a/nuxt-app/components/FaqItem.vue
+++ b/nuxt-app/components/FaqItem.vue
@@ -1,35 +1,35 @@
 <template>
-  <div class='flex justify-between py-3 text-2xl' data-cursor-hover @click='toggle'>
-    <p class='text-white font-bold'>
-      {{ faq.question }}
-    </p>
-    <div class='text-white max-w-6 min-w-6'>
-      <AngleDownIcon
-        class='stroke-white fill-white transition-all duration-500 max-w-full'
-        :class="{ 'rotate-180': isOpened }"
-      />
+    <div class="flex justify-between py-3 text-2xl" data-cursor-hover @click="toggle">
+        <p class="font-bold text-white">
+            {{ faq.question }}
+        </p>
+        <div class="min-w-6 max-w-6 text-white">
+            <AngleDownIcon
+                class="max-w-full fill-white stroke-white transition-all duration-500"
+                :class="{ 'rotate-180': isOpened }"
+            />
+        </div>
     </div>
-  </div>
-  <InnerHtml
-    class=' text-white text-xl font-light opacity-0 transition-all duration-500 ease-in-out h-0 overflow-hidden mb-3'
-    :class="{ 'opacity-100 h-auto': isOpened }"
-    :html='faq.answer'
-  />
+    <InnerHtml
+        class="mb-3 h-0 overflow-hidden text-xl font-light text-white opacity-0 transition-all duration-500 ease-in-out"
+        :class="{ 'h-auto opacity-100': isOpened }"
+        :html="faq.answer"
+    />
 </template>
 
-<script setup lang='ts'>
-import AngleDownIcon from 'assets/icons/angle-down.svg';
+<script setup lang="ts">
+import AngleDownIcon from 'assets/icons/angle-down.svg'
 
 defineProps<{
-  faq: {
-    question: string;
-    answer: string;
-  };
-}>();
+    faq: {
+        question: string
+        answer: string
+    }
+}>()
 
-const isOpened = ref( false);
+const isOpened = ref(false)
 
 function toggle() {
-  isOpened.value = !isOpened.value;
+    isOpened.value = !isOpened.value
 }
 </script>
diff --git a/nuxt-app/components/FaqList.vue b/nuxt-app/components/FaqList.vue
index ea610a27..34443f87 100644
--- a/nuxt-app/components/FaqList.vue
+++ b/nuxt-app/components/FaqList.vue
@@ -1,19 +1,19 @@
 <template>
-  <div class='mt-16 mb-16'>
-    <div v-for="faq of faqs" :key="faq.question">
-      <hr class='border-white' />
-      <FaqItem :faq='faq' />
+    <div class="mb-16 mt-16">
+        <div v-for="faq of faqs" :key="faq.question">
+            <hr class="border-white" />
+            <FaqItem :faq="faq" />
+        </div>
     </div>
-  </div>
 </template>
 
-<script setup lang='ts'>
-import FaqItem from '~/components/FaqItem.vue';
+<script setup lang="ts">
+import FaqItem from '~/components/FaqItem.vue'
 
 defineProps<{
-  faqs: {
-    question: string;
-    answer: string;
-  }[];
-}>();
+    faqs: {
+        question: string
+        answer: string
+    }[]
+}>()
 </script>
diff --git a/nuxt-app/components/GenericLazyList.vue b/nuxt-app/components/GenericLazyList.vue
index ac5c985f..0d590235 100644
--- a/nuxt-app/components/GenericLazyList.vue
+++ b/nuxt-app/components/GenericLazyList.vue
@@ -3,7 +3,7 @@
         <!-- Note that not all items used here might have an id (or even be objects), so we use the index as a fallback. -->
         <slot
             v-for="(renderItem, index) in renderItems"
-            :key="renderItem?.id ?? (index + firstIndex)"
+            :key="renderItem?.id ?? index + firstIndex"
             :item="renderItem"
             :index="index + firstIndex"
             :viewport-items="viewportItems"
@@ -57,11 +57,7 @@ watch(
     () => {
         const itemsLength = props.items?.length ?? 0
         firstIndex.value = Math.max(Math.min(itemsLength - 11, firstIndex.value), 0)
-        lastIndex.value = Math.max(
-            Math.min(itemsLength - 1, lastIndex.value),
-            Math.min(itemsLength - 1, 9),
-            0
-        )
+        lastIndex.value = Math.max(Math.min(itemsLength - 1, lastIndex.value), Math.min(itemsLength - 1, 9), 0)
         paddingStartList.value = paddingStartList.value.slice(0, firstIndex.value)
         paddingEndList.value = paddingEndList.value.slice(lastIndex.value + 1, itemsLength)
         viewportItems.value = new Set()
@@ -175,7 +171,11 @@ const handleScroll = () => {
 
         // Check position of last item element if user scrolls down, last
         // index is not reached and last item element exists
-    } else if (scrollDirection === 'down' && lastIndex.value < (props.items?.length ?? 0) - 1 && lastItemElement.value) {
+    } else if (
+        scrollDirection === 'down' &&
+        lastIndex.value < (props.items?.length ?? 0) - 1 &&
+        lastItemElement.value
+    ) {
         // Destructure client rect of last item element
         const { top, left } = lastItemElement.value.getBoundingClientRect()
 
diff --git a/nuxt-app/components/IndividualPlatforms.vue b/nuxt-app/components/IndividualPlatforms.vue
index c7f483d1..768f269d 100644
--- a/nuxt-app/components/IndividualPlatforms.vue
+++ b/nuxt-app/components/IndividualPlatforms.vue
@@ -1,167 +1,170 @@
 <template>
-  <ul v-if='platformList.length' class='mt-6 flex space-x-6 flex-shrink-0'>
-    <li v-for='platform of platformList' :key='platform.name'>
-      <a
-        class='block text-white'
-        :class='sizes'
-        :href='platform.url'
-        target='_blank'
-        rel='noreferrer'
-        data-cursor-hover
-        @click='() => {if (platform.eventId) trackGoal(platform.eventId)}'
-      >
-        <component :is='platform.icon' />
-      </a>
-    </li>
-  </ul>
+    <ul v-if="platformList.length" class="mt-6 flex flex-shrink-0 space-x-6">
+        <li v-for="platform of platformList" :key="platform.name">
+            <a
+                class="block text-white"
+                :class="sizes"
+                :href="platform.url"
+                target="_blank"
+                rel="noreferrer"
+                data-cursor-hover
+                @click="
+                    () => {
+                        if (platform.eventId) trackGoal(platform.eventId)
+                    }
+                "
+            >
+                <component :is="platform.icon" />
+            </a>
+        </li>
+    </ul>
 </template>
 
 <script setup lang="ts">
+import BlueskyIconColor from '~/assets/logos/bluesky-color.svg'
 import BlueskyIcon from '~/assets/logos/bluesky.svg'
 import GithubIcon from '~/assets/logos/github.svg'
+import InstagramIconColor from '~/assets/logos/instagram-color.svg'
 import InstagramIcon from '~/assets/logos/instagram.svg'
+import LinkedinIconColor from '~/assets/logos/linkedin-color.svg'
 import LinkedinIcon from '~/assets/logos/linkedin.svg'
 import MastodonIcon from '~/assets/logos/mastodon.svg'
+import TwitterIconColor from '~/assets/logos/twitter-color.svg'
 import TwitterIcon from '~/assets/logos/twitter.svg'
-import YoutubeIcon from '~/assets/logos/youtube.svg'
 import WebsiteIconColor from '~/assets/logos/website-color.svg'
-import BlueskyIconColor from '~/assets/logos/bluesky-color.svg'
-import InstagramIconColor from '~/assets/logos/instagram-color.svg'
-import LinkedinIconColor from '~/assets/logos/linkedin-color.svg'
-import TwitterIconColor from '~/assets/logos/twitter-color.svg'
 import YoutubeIconColor from '~/assets/logos/youtube-color.svg'
-
+import YoutubeIcon from '~/assets/logos/youtube.svg'
+import { computed } from 'vue'
 import {
-  OPEN_MEMBER_BLUESKY_EVENT_ID,
-  OPEN_MEMBER_GITHUB_EVENT_ID,
-  OPEN_MEMBER_INSTAGRAM_EVENT_ID,
-  OPEN_MEMBER_LINKEDIN_EVENT_ID,
-  OPEN_MEMBER_MASTODON_EVENT_ID,
-  OPEN_MEMBER_TWITTER_EVENT_ID,
-  OPEN_MEMBER_WEBSITE_EVENT_ID,
-  OPEN_MEMBER_YOUTUBE_EVENT_ID,
-  OPEN_SPEAKER_WEBSITE_EVENT_ID,
-  OPEN_SPEAKER_GITHUB_EVENT_ID,
-  OPEN_SPEAKER_YOUTUBE_EVENT_ID,
-  OPEN_SPEAKER_MASTODON_EVENT_ID,
-  OPEN_SPEAKER_INSTAGRAM_EVENT_ID,
-  OPEN_SPEAKER_TWITTER_EVENT_ID,
-  OPEN_SPEAKER_LINKEDIN_EVENT_ID,
-  OPEN_SPEAKER_BLUESKY_EVENT_ID,
-} from '../config';
+    OPEN_MEMBER_BLUESKY_EVENT_ID,
+    OPEN_MEMBER_GITHUB_EVENT_ID,
+    OPEN_MEMBER_INSTAGRAM_EVENT_ID,
+    OPEN_MEMBER_LINKEDIN_EVENT_ID,
+    OPEN_MEMBER_MASTODON_EVENT_ID,
+    OPEN_MEMBER_TWITTER_EVENT_ID,
+    OPEN_MEMBER_WEBSITE_EVENT_ID,
+    OPEN_MEMBER_YOUTUBE_EVENT_ID,
+    OPEN_SPEAKER_BLUESKY_EVENT_ID,
+    OPEN_SPEAKER_GITHUB_EVENT_ID,
+    OPEN_SPEAKER_INSTAGRAM_EVENT_ID,
+    OPEN_SPEAKER_LINKEDIN_EVENT_ID,
+    OPEN_SPEAKER_MASTODON_EVENT_ID,
+    OPEN_SPEAKER_TWITTER_EVENT_ID,
+    OPEN_SPEAKER_WEBSITE_EVENT_ID,
+    OPEN_SPEAKER_YOUTUBE_EVENT_ID,
+} from '../config'
 import { normalizeExternalUrl, trackGoal } from '../helpers'
-import { computed } from 'vue';
 
 type Scope = 'speaker' | 'member'
 type Style = 'mono' | 'color'
 
 interface Platforms {
-  twitter_url?: string
-  bluesky_url?: string
-  linkedin_url?: string
-  instagram_url?: string
-  github_url?: string
-  mastodon_url?: string
-  youtube_url?: string
-  website_url?: string
+    twitter_url?: string
+    bluesky_url?: string
+    linkedin_url?: string
+    instagram_url?: string
+    github_url?: string
+    mastodon_url?: string
+    youtube_url?: string
+    website_url?: string
 }
 
 const props = withDefaults(
-  defineProps<{
-    platforms?: Platforms,
-    scope: Scope,
-    style?: Style,
-    sizes?: string,
-  }>(),
-  {
-    platforms: () => ({
-      twitter_url: '',
-      bluesky_url: '',
-      linkedin_url: '',
-      instagram_url: '',
-      github_url: '',
-      mastodon_url: '',
-      youtube_url: '',
-      website_url: '',
-    }),
-    style: 'mono',
-    sizes: 'h-7',
-  }
+    defineProps<{
+        platforms?: Platforms
+        scope: Scope
+        style?: Style
+        sizes?: string
+    }>(),
+    {
+        platforms: () => ({
+            twitter_url: '',
+            bluesky_url: '',
+            linkedin_url: '',
+            instagram_url: '',
+            github_url: '',
+            mastodon_url: '',
+            youtube_url: '',
+            website_url: '',
+        }),
+        style: 'mono',
+        sizes: 'h-7',
+    }
 )
 
 const platformList = computed(() => {
+    const BLUESKY_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_BLUESKY_EVENT_ID : OPEN_MEMBER_BLUESKY_EVENT_ID
+    const MASTODON_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_MASTODON_EVENT_ID : OPEN_MEMBER_MASTODON_EVENT_ID
+    const LINKEDIN_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_LINKEDIN_EVENT_ID : OPEN_MEMBER_LINKEDIN_EVENT_ID
+    const INSTAGRAM_EVENT_ID =
+        props.scope === 'speaker' ? OPEN_SPEAKER_INSTAGRAM_EVENT_ID : OPEN_MEMBER_INSTAGRAM_EVENT_ID
+    const GITHUB_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_GITHUB_EVENT_ID : OPEN_MEMBER_GITHUB_EVENT_ID
+    const YOUTUBE_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_YOUTUBE_EVENT_ID : OPEN_MEMBER_YOUTUBE_EVENT_ID
+    const WEBSITE_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_WEBSITE_EVENT_ID : OPEN_MEMBER_WEBSITE_EVENT_ID
+    const TWITTER_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_TWITTER_EVENT_ID : OPEN_MEMBER_TWITTER_EVENT_ID
 
-  const BLUESKY_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_BLUESKY_EVENT_ID : OPEN_MEMBER_BLUESKY_EVENT_ID;
-  const MASTODON_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_MASTODON_EVENT_ID : OPEN_MEMBER_MASTODON_EVENT_ID;
-  const LINKEDIN_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_LINKEDIN_EVENT_ID : OPEN_MEMBER_LINKEDIN_EVENT_ID;
-  const INSTAGRAM_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_INSTAGRAM_EVENT_ID : OPEN_MEMBER_INSTAGRAM_EVENT_ID;
-  const GITHUB_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_GITHUB_EVENT_ID : OPEN_MEMBER_GITHUB_EVENT_ID;
-  const YOUTUBE_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_YOUTUBE_EVENT_ID : OPEN_MEMBER_YOUTUBE_EVENT_ID;
-  const WEBSITE_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_WEBSITE_EVENT_ID : OPEN_MEMBER_WEBSITE_EVENT_ID;
-  const TWITTER_EVENT_ID = props.scope === 'speaker' ? OPEN_SPEAKER_TWITTER_EVENT_ID : OPEN_MEMBER_TWITTER_EVENT_ID;
-
-  const BLUESKY_ICON = props.style === 'color' ? BlueskyIconColor : BlueskyIcon;
-  const INSTAGRAM_ICON = props.style === 'color' ? InstagramIconColor : InstagramIcon;
-  const LINKEDIN_ICON = props.style === 'color' ? LinkedinIconColor : LinkedinIcon;
-  const TWITTER_ICON = props.style === 'color' ? TwitterIconColor : TwitterIcon;
-  const YOUTUBE_ICON = props.style === 'color' ? YoutubeIconColor : YoutubeIcon;
-  const WEBSITE_ICON = props.style === 'color' ? WebsiteIconColor : WebsiteIconColor;
-  const GITHUB_ICON = props.style === 'color' ? GithubIcon : GithubIcon;
+    const BLUESKY_ICON = props.style === 'color' ? BlueskyIconColor : BlueskyIcon
+    const INSTAGRAM_ICON = props.style === 'color' ? InstagramIconColor : InstagramIcon
+    const LINKEDIN_ICON = props.style === 'color' ? LinkedinIconColor : LinkedinIcon
+    const TWITTER_ICON = props.style === 'color' ? TwitterIconColor : TwitterIcon
+    const YOUTUBE_ICON = props.style === 'color' ? YoutubeIconColor : YoutubeIcon
+    const WEBSITE_ICON = props.style === 'color' ? WebsiteIconColor : WebsiteIconColor
+    const GITHUB_ICON = props.style === 'color' ? GithubIcon : GithubIcon
 
-  return [
-    {
-      name: 'Bluesky',
-      icon: BLUESKY_ICON,
-      url: normalizeExternalUrl(props.platforms.bluesky_url, 'bluesky'),
-      eventId: BLUESKY_EVENT_ID,
-    },
-    {
-      name: 'Mastodon',
-      icon: MastodonIcon,
-      url: normalizeExternalUrl(props.platforms.mastodon_url, 'mastodon'),
-      eventId: MASTODON_EVENT_ID,
-    },
-    {
-      name: 'LinkedIn',
-      icon: LINKEDIN_ICON,
-      url: normalizeExternalUrl(props.platforms.linkedin_url, 'linkedin'),
-      eventId: LINKEDIN_EVENT_ID,
-    },
-    {
-      name: 'Instagram',
-      icon: INSTAGRAM_ICON,
-      url: normalizeExternalUrl(props.platforms.instagram_url, 'instagram'),
-      eventId: INSTAGRAM_EVENT_ID,
-    },
-    {
-      name: 'GitHub',
-      icon: GITHUB_ICON,
-      url: normalizeExternalUrl(props.platforms.github_url, 'github'),
-      eventId: GITHUB_EVENT_ID,
-    },
-    {
-      name: 'YouTube',
-      icon: YOUTUBE_ICON,
-      url: normalizeExternalUrl(props.platforms.youtube_url, 'youtube'),
-      eventId: YOUTUBE_EVENT_ID,
-    },
-    {
-      name: 'Website',
-      icon: WEBSITE_ICON,
-      url: normalizeExternalUrl(props.platforms.website_url, 'web'),
-      eventId: WEBSITE_EVENT_ID,
-    },
-    {
-      name: 'Twitter',
-      icon: TWITTER_ICON,
-      url: normalizeExternalUrl(props.platforms.twitter_url, 'twitter'),
-      eventId: TWITTER_EVENT_ID,
-    },
-  ].filter((platform) => platform.url) as {
-    name: string
-    icon: string
-    url: string
-    eventId: string
-  }[];
-});
+    return [
+        {
+            name: 'Bluesky',
+            icon: BLUESKY_ICON,
+            url: normalizeExternalUrl(props.platforms.bluesky_url, 'bluesky'),
+            eventId: BLUESKY_EVENT_ID,
+        },
+        {
+            name: 'Mastodon',
+            icon: MastodonIcon,
+            url: normalizeExternalUrl(props.platforms.mastodon_url, 'mastodon'),
+            eventId: MASTODON_EVENT_ID,
+        },
+        {
+            name: 'LinkedIn',
+            icon: LINKEDIN_ICON,
+            url: normalizeExternalUrl(props.platforms.linkedin_url, 'linkedin'),
+            eventId: LINKEDIN_EVENT_ID,
+        },
+        {
+            name: 'Instagram',
+            icon: INSTAGRAM_ICON,
+            url: normalizeExternalUrl(props.platforms.instagram_url, 'instagram'),
+            eventId: INSTAGRAM_EVENT_ID,
+        },
+        {
+            name: 'GitHub',
+            icon: GITHUB_ICON,
+            url: normalizeExternalUrl(props.platforms.github_url, 'github'),
+            eventId: GITHUB_EVENT_ID,
+        },
+        {
+            name: 'YouTube',
+            icon: YOUTUBE_ICON,
+            url: normalizeExternalUrl(props.platforms.youtube_url, 'youtube'),
+            eventId: YOUTUBE_EVENT_ID,
+        },
+        {
+            name: 'Website',
+            icon: WEBSITE_ICON,
+            url: normalizeExternalUrl(props.platforms.website_url, 'web'),
+            eventId: WEBSITE_EVENT_ID,
+        },
+        {
+            name: 'Twitter',
+            icon: TWITTER_ICON,
+            url: normalizeExternalUrl(props.platforms.twitter_url, 'twitter'),
+            eventId: TWITTER_EVENT_ID,
+        },
+    ].filter((platform) => platform.url) as {
+        name: string
+        icon: string
+        url: string
+        eventId: string
+    }[]
+})
 </script>
diff --git a/nuxt-app/components/MeetupCalendarAndMaps.vue b/nuxt-app/components/MeetupCalendarAndMaps.vue
index a422ddcf..5cb53a01 100644
--- a/nuxt-app/components/MeetupCalendarAndMaps.vue
+++ b/nuxt-app/components/MeetupCalendarAndMaps.vue
@@ -131,12 +131,11 @@ onMounted(() => {
 // Create Meetup URL
 const meetupUrl = computed(() => props.meetup.meetup_url || MEETUP_URL)
 const meetupDomain = computed(() => {
+    if (props.meetup.meetup_url) {
+        const url = new URL(props.meetup.meetup_url)
+        return url.host.replace('www.', '')
+    }
 
-  if (props.meetup.meetup_url) {
-    const url = new URL(props.meetup.meetup_url);
-    return url.host.replace('www.', '');
-  }
-
-  return MEETUP_URL;
+    return MEETUP_URL
 })
 </script>
diff --git a/nuxt-app/components/MeetupSection.vue b/nuxt-app/components/MeetupSection.vue
index f5ec9149..77a77b57 100644
--- a/nuxt-app/components/MeetupSection.vue
+++ b/nuxt-app/components/MeetupSection.vue
@@ -1,50 +1,52 @@
 <template>
-  <section class="relative mb-7 mt-12 md:mb-16 md:mt-28 lg:mb-24 lg:mt-40">
-    <div class="container px-6 md:pl-48 lg:pr-8 3xl:px-8">
-      <SectionHeading element="h2">
-        {{ heading }}
-      </SectionHeading>
-      <LazyList class="mt-10" :items="meetups" direction="vertical">
-        <template #default="{ item, index, viewportItems, addViewportItem }">
-          <LazyListItem
-            :key="item.id"
-            :class="index > 0 && 'mt-14 md:mt-20 lg:mt-28'"
-            :item="item"
-            :viewport-items="viewportItems"
-            :add-viewport-item="addViewportItem"
-          >
-            <template #default="{ isNewToViewport }">
-              <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
-                <MeetupCard :meetup="item" />
-              </FadeAnimation>
-            </template>
-          </LazyListItem>
-        </template>
-      </LazyList>
-    </div>
-  </section>
+    <section class="relative mb-7 mt-12 md:mb-16 md:mt-28 lg:mb-24 lg:mt-40">
+        <div class="container px-6 md:pl-48 lg:pr-8 3xl:px-8">
+            <SectionHeading element="h2">
+                {{ heading }}
+            </SectionHeading>
+            <LazyList class="mt-10" :items="meetups" direction="vertical">
+                <template #default="{ item, index, viewportItems, addViewportItem }">
+                    <LazyListItem
+                        :key="item.id"
+                        :class="index > 0 && 'mt-14 md:mt-20 lg:mt-28'"
+                        :item="item"
+                        :viewport-items="viewportItems"
+                        :add-viewport-item="addViewportItem"
+                    >
+                        <template #default="{ isNewToViewport }">
+                            <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
+                                <MeetupCard :meetup="item" />
+                            </FadeAnimation>
+                        </template>
+                    </LazyListItem>
+                </template>
+            </LazyList>
+        </div>
+    </section>
 </template>
 
 <script lang="ts">
+import GenericLazyList from '~/components/GenericLazyList.vue'
+import GenericListItem from '~/components/GenericListItem.vue'
+import MeetupCard from '~/components/MeetupCard.vue'
+import type { MeetupItem } from '~/types'
 import type { PropType } from 'vue'
 import { defineComponent } from 'vue'
-import GenericListItem from '~/components/GenericListItem.vue';
-import GenericLazyList from '~/components/GenericLazyList.vue';
-import MeetupCard from '~/components/MeetupCard.vue';
-import SectionHeading from './SectionHeading.vue';
-import type { MeetupItem } from '~/types';
+import SectionHeading from './SectionHeading.vue'
 
 export default defineComponent({
     components: {
-      SectionHeading,
-      LazyList: GenericLazyList,
-      LazyListItem: GenericListItem,
-      MeetupCard,
+        SectionHeading,
+        LazyList: GenericLazyList,
+        LazyListItem: GenericListItem,
+        MeetupCard,
     },
     props: {
         meetups: {
-          type: Array as PropType<Pick<MeetupItem, 'start_on' | 'end_on' | 'title' | 'cover_image' | 'description'>[]>,
-          required: true,
+            type: Array as PropType<
+                Pick<MeetupItem, 'start_on' | 'end_on' | 'title' | 'cover_image' | 'description'>[]
+            >,
+            required: true,
         },
         heading: {
             type: String,
diff --git a/nuxt-app/components/MeetupStartAndEnd.vue b/nuxt-app/components/MeetupStartAndEnd.vue
index 7baf5b06..44ae3c1d 100644
--- a/nuxt-app/components/MeetupStartAndEnd.vue
+++ b/nuxt-app/components/MeetupStartAndEnd.vue
@@ -5,10 +5,10 @@
 </template>
 
 <script lang="ts">
+import { parseCmsDate } from '~/helpers'
 import type { PropType } from 'vue'
 import { computed, defineComponent } from 'vue'
 import type { MeetupItem } from '../types'
-import { parseCmsDate } from '~/helpers'
 
 export default defineComponent({
     props: {
diff --git a/nuxt-app/components/MemberCard.vue b/nuxt-app/components/MemberCard.vue
index ac29f67a..5d1d1f2b 100644
--- a/nuxt-app/components/MemberCard.vue
+++ b/nuxt-app/components/MemberCard.vue
@@ -58,7 +58,7 @@
             {{ member.occupation }}
         </div>
 
-        <IndividualPlatforms :platforms='platforms' :scope='"member"'/>
+        <IndividualPlatforms :platforms="platforms" :scope="'member'" />
     </div>
 </template>
 
@@ -110,19 +110,19 @@ export default defineComponent({
         // Create full name
         const fullName = computed(() => `${props.member.first_name} ${props.member.last_name}`)
         const platforms = computed(() => {
-          if (!props.member) {
-            return {}
-          }
-
-          return {
-            github_url: props.member.github_url,
-            twitter_url: props.member.twitter_url,
-            bluesky_url: props.member.bluesky_url,
-            linkedin_url: props.member.linkedin_url,
-            instagram_url: props.member.instagram_url,
-            youtube_url: props.member.youtube_url,
-            website_url: props.member.website_url,
-          }
+            if (!props.member) {
+                return {}
+            }
+
+            return {
+                github_url: props.member.github_url,
+                twitter_url: props.member.twitter_url,
+                bluesky_url: props.member.bluesky_url,
+                linkedin_url: props.member.linkedin_url,
+                instagram_url: props.member.instagram_url,
+                youtube_url: props.member.youtube_url,
+                website_url: props.member.website_url,
+            }
         })
 
         // Create element references
@@ -229,6 +229,6 @@ export default defineComponent({
             handleDiscoverEffect,
         }
     },
-  methods: { trackGoal },
+    methods: { trackGoal },
 })
 </script>
diff --git a/nuxt-app/components/MouseCursor.vue b/nuxt-app/components/MouseCursor.vue
index 69cdb1fd..1aecf279 100644
--- a/nuxt-app/components/MouseCursor.vue
+++ b/nuxt-app/components/MouseCursor.vue
@@ -67,10 +67,13 @@ const handleMouseCursor = (event: MouseEvent) => {
         cursorMode.value =
             event
                 .composedPath()
-                .reduce<
-                    CursorMode | false | undefined
-                >((cursorMode, currentNode) => cursorMode || (currentNode instanceof HTMLElement && cursorModes.find((cursorMode) => currentNode.hasAttribute(`data-cursor-${cursorMode}`))), undefined) ||
-            'default'
+                .reduce<CursorMode | false | undefined>(
+                    (cursorMode, currentNode) =>
+                        cursorMode ||
+                        (currentNode instanceof HTMLElement &&
+                            cursorModes.find((cursorMode) => currentNode.hasAttribute(`data-cursor-${cursorMode}`))),
+                    undefined
+                ) || 'default'
     }
 }
 
diff --git a/nuxt-app/components/NewsTicker.vue b/nuxt-app/components/NewsTicker.vue
index d4325b65..feef8cee 100644
--- a/nuxt-app/components/NewsTicker.vue
+++ b/nuxt-app/components/NewsTicker.vue
@@ -5,7 +5,11 @@
             :style="style"
         >
             <span v-for="occurrence in 4" :key="occurrence">
-                <span v-for="(preparedNewsItem, index) in preparedNewsItems" :key="occurrence + preparedNewsItem + index" v-html="preparedNewsItem">
+                <span
+                    v-for="(preparedNewsItem, index) in preparedNewsItems"
+                    :key="occurrence + preparedNewsItem + index"
+                    v-html="preparedNewsItem"
+                >
                 </span>
             </span>
         </p>
@@ -13,9 +17,9 @@
 </template>
 
 <script lang="ts">
+import { sanitizeInlineHtml } from '~/helpers/sanitize'
 import type { PropType } from 'vue'
 import { computed, defineComponent } from 'vue'
-import { sanitizeInlineHtml } from '~/helpers/sanitize';
 
 export default defineComponent({
     props: {
@@ -28,12 +32,12 @@ export default defineComponent({
         // Create style with animation duration
         const style = computed(() => `animation-duration: ${props.news.join().length * 0.2}s`)
         const preparedNewsItems = computed(() => {
-          return props.news.map(news => `${sanitizeInlineHtml(news)} +++ `)
+            return props.news.map((news) => `${sanitizeInlineHtml(news)} +++ `)
         })
 
         return {
-          style,
-          preparedNewsItems
+            style,
+            preparedNewsItems,
         }
     },
 })
diff --git a/nuxt-app/components/PageCoverImage.vue b/nuxt-app/components/PageCoverImage.vue
index 88a476b7..655f2853 100644
--- a/nuxt-app/components/PageCoverImage.vue
+++ b/nuxt-app/components/PageCoverImage.vue
@@ -1,8 +1,8 @@
 <template>
     <div class="h-1/2-screen w-full lg:h-4/6-screen">
         <div class="relative h-full overflow-hidden">
-            <div v-if='shadow' class="absolute left-0 bottom-0 z-10 h-1/3 w-full shadow"/>
-            <div v-if='overlay' class="absolute left-0 top-0 z-10 h-full w-full bg-gray-900 bg-opacity-30" />
+            <div v-if="shadow" class="absolute bottom-0 left-0 z-10 h-1/3 w-full shadow" />
+            <div v-if="overlay" class="absolute left-0 top-0 z-10 h-full w-full bg-gray-900 bg-opacity-30" />
 
             <DirectusImage
                 ref="imageComponent"
@@ -33,16 +33,16 @@ export default defineComponent({
             type: Object as PropType<FileItem>,
             required: true,
         },
-      shadow: {
-        type: Boolean,
-        required: false,
-        default: true,
-      },
-      overlay: {
-        type: Boolean,
-        required: false,
-        default: true,
-      },
+        shadow: {
+            type: Boolean,
+            required: false,
+            default: true,
+        },
+        overlay: {
+            type: Boolean,
+            required: false,
+            default: true,
+        },
     },
     setup() {
         // Create image component reference
@@ -68,6 +68,6 @@ export default defineComponent({
 
 <style scoped>
 .shadow {
-  background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
+    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
 }
 </style>
diff --git a/nuxt-app/components/Pagination.vue b/nuxt-app/components/Pagination.vue
index d8c2276a..1b948d08 100644
--- a/nuxt-app/components/Pagination.vue
+++ b/nuxt-app/components/Pagination.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import AngleRightIcon from '~/assets/icons/angle-right.svg'
 import AngleLeftIcon from '~/assets/icons/angle-left.svg'
+import AngleRightIcon from '~/assets/icons/angle-right.svg'
 import { computed, ref } from 'vue'
 
 const props = defineProps<{
@@ -115,7 +115,10 @@ function handleKeydown(event: KeyboardEvent) {
                 </div>
                 <div
                     class="flex flex-row items-center justify-center"
-                    :class="{ 'opacity-30 cursor-not-allowed': isNextButtonDisabled, 'cursor-pointer': !isNextButtonDisabled }"
+                    :class="{
+                        'cursor-not-allowed opacity-30': isNextButtonDisabled,
+                        'cursor-pointer': !isNextButtonDisabled,
+                    }"
                     @click="nextPage"
                 >
                     <button class="font-bold uppercase tracking-widest text-white" :disabled="isNextButtonDisabled">
diff --git a/nuxt-app/components/PodcastBanner.vue b/nuxt-app/components/PodcastBanner.vue
index e5b6b649..42377fd8 100644
--- a/nuxt-app/components/PodcastBanner.vue
+++ b/nuxt-app/components/PodcastBanner.vue
@@ -112,7 +112,7 @@ const props = defineProps<{
 const podcastPlayer = usePodcastPlayer()
 
 if ((!podcastPlayer.podcast?.id || podcastPlayer.paused) && props.podcast) {
-  podcastPlayer.setPodcast(props.podcast)
+    podcastPlayer.setPodcast(props.podcast)
 }
 
 const playOrPauseIcon = computed(() => {
diff --git a/nuxt-app/components/PodcastPlayer.vue b/nuxt-app/components/PodcastPlayer.vue
index c6839d20..ec15b6f3 100644
--- a/nuxt-app/components/PodcastPlayer.vue
+++ b/nuxt-app/components/PodcastPlayer.vue
@@ -259,16 +259,7 @@ const collapsePlayer = () => {
 // `change` event that clears the scrubbing flag). Other keys — Tab, modifiers,
 // etc. — must NOT begin scrubbing, otherwise the flag would never be cleared
 // and time updates would stay suppressed indefinitely.
-const SEEK_KEYS = new Set([
-    'ArrowLeft',
-    'ArrowRight',
-    'ArrowUp',
-    'ArrowDown',
-    'PageUp',
-    'PageDown',
-    'Home',
-    'End',
-])
+const SEEK_KEYS = new Set(['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'PageUp', 'PageDown', 'Home', 'End'])
 
 /**
  * It begins scrubbing only when a real seek key is pressed, so that a matching
diff --git a/nuxt-app/components/PodcastRating.vue b/nuxt-app/components/PodcastRating.vue
index 61db60d2..360ce47b 100644
--- a/nuxt-app/components/PodcastRating.vue
+++ b/nuxt-app/components/PodcastRating.vue
@@ -1,171 +1,175 @@
 <template>
-  <div class='flex flex-col w-full items-end mt-8 space-y-8'>
-    <div v-if='!message' class='bg-gray-500 rounded-full w-fit box-border p-2'>
-      <button type='button' class='inline-block p-1 md:p-3 border-white border-r-1' data-cursor-hover
-              @click='rate("up")'>
-        <thumbs_up class='inline -mt-1 md:-mt-2 h-4 md:h-6 pr-1' />
-      </button>
-      <button type='button' class='inline-block p-1 md:p-3' data-cursor-hover @click='rate("down")'>
-        <thumbs_down class='inline h-4 md:h-6 pl-2' />
-      </button>
+    <div class="mt-8 flex w-full flex-col items-end space-y-8">
+        <div v-if="!message" class="box-border w-fit rounded-full bg-gray-500 p-2">
+            <button
+                type="button"
+                class="inline-block border-r-1 border-white p-1 md:p-3"
+                data-cursor-hover
+                @click="rate('up')"
+            >
+                <thumbs_up class="-mt-1 inline h-4 pr-1 md:-mt-2 md:h-6" />
+            </button>
+            <button type="button" class="inline-block p-1 md:p-3" data-cursor-hover @click="rate('down')">
+                <thumbs_down class="inline h-4 pl-2 md:h-6" />
+            </button>
+        </div>
+        <div v-if="message" class="p-4 text-base font-bold leading-normal text-lime md:text-xl lg:text-2xl">
+            <p>{{ message.text }}</p>
+        </div>
     </div>
-    <div v-if='message' class='text-base font-bold leading-normal text-lime md:text-xl lg:text-2xl p-4 '>
-      <p>{{ message.text }}</p>
-    </div>
-  </div>
 
     <Transition
-      enter-active-class='transition duration-500 ease-out'
-      enter-from-class='opacity-0 translate-y-8'
-      enter-to-class='opacity-100 translate-y-0'
-      leave-active-class='transition duration-300 ease-in'
-      leave-from-class='opacity-100 translate-y-0'
-      leave-to-class='opacity-0 translate-y-8'
-    >
-    <form
-      v-if='ratingId && formState !== "submitted"'
-      class='contact-form flex flex-col items-center space-y-10 lg:items-end'
-      :class='formState'
-      novalidate
-      @submit.prevent="submitForm"
+        enter-active-class="transition duration-500 ease-out"
+        enter-from-class="opacity-0 translate-y-8"
+        enter-to-class="opacity-100 translate-y-0"
+        leave-active-class="transition duration-300 ease-in"
+        leave-from-class="opacity-100 translate-y-0"
+        leave-to-class="opacity-0 translate-y-8"
     >
-      <div class='w-full bg-gray-900 px-6 py-6'>
-        <p class='text-white block md:text-xl lg:text-2xl mb-3'>Wenn du möchtest, kannst du zu deinem Feedback noch ein Kommentar hinterlassen:</p>
-        <textarea
-          v-model='comment'
-          class='text-input'
-          name='message'
-          placeholder='Feedback'
-          rows='3'
-          maxlength='1000'
-          required
-        />
-        <p v-if='formError' class='mt-6 text-base text-pink'>
-          {{ formError }}
-        </p>
-      </div>
-      <button
-        class='relative h-14 w-64 m-auto overflow-hidden rounded-full border-4 border-lime md:text-xl lg:text-2xl font-black uppercase tracking-widest transition-colors duration-500 after:absolute after:left-0 after:top-0 after:-z-1 after:h-full after:w-full after:origin-left after:rounded-full after:bg-lime after:transition-transform md:border-5 lg:border-6'
-        :class="[
-                formState === 'submitted' ? 'text-black' : 'text-lime',
-                formState === 'submitting'
-                    ? 'after:scale-x-75'
-                    : formState === 'submitted'
-                      ? 'after:scale-x-100'
-                      : 'after:scale-x-0',
-                formState === 'submitting' ? 'text-transparent after:duration-3000' : 'after:duration-1000',
-            ]"
-        style='will-change: transform'
-        type='submit'
-        :disabled="formState === 'submitting' || formState === 'submitted'"
-        :data-cursor-hover="formState !== 'submitting' && formState !== 'submitted'"
-      >
-        {{ formState === 'submitted' ? 'Gesendet' : 'Senden' }}
-      </button>
-    </form>
+        <form
+            v-if="ratingId && formState !== 'submitted'"
+            class="contact-form flex flex-col items-center space-y-10 lg:items-end"
+            :class="formState"
+            novalidate
+            @submit.prevent="submitForm"
+        >
+            <div class="w-full bg-gray-900 px-6 py-6">
+                <p class="mb-3 block text-white md:text-xl lg:text-2xl">
+                    Wenn du möchtest, kannst du zu deinem Feedback noch ein Kommentar hinterlassen:
+                </p>
+                <textarea
+                    v-model="comment"
+                    class="text-input"
+                    name="message"
+                    placeholder="Feedback"
+                    rows="3"
+                    maxlength="1000"
+                    required
+                />
+                <p v-if="formError" class="mt-6 text-base text-pink">
+                    {{ formError }}
+                </p>
+            </div>
+            <button
+                class="relative m-auto h-14 w-64 overflow-hidden rounded-full border-4 border-lime font-black uppercase tracking-widest transition-colors duration-500 after:absolute after:left-0 after:top-0 after:-z-1 after:h-full after:w-full after:origin-left after:rounded-full after:bg-lime after:transition-transform md:border-5 md:text-xl lg:border-6 lg:text-2xl"
+                :class="[
+                    formState === 'submitted' ? 'text-black' : 'text-lime',
+                    formState === 'submitting'
+                        ? 'after:scale-x-75'
+                        : formState === 'submitted'
+                          ? 'after:scale-x-100'
+                          : 'after:scale-x-0',
+                    formState === 'submitting' ? 'text-transparent after:duration-3000' : 'after:duration-1000',
+                ]"
+                style="will-change: transform"
+                type="submit"
+                :disabled="formState === 'submitting' || formState === 'submitted'"
+                :data-cursor-hover="formState !== 'submitting' && formState !== 'submitted'"
+            >
+                {{ formState === 'submitted' ? 'Gesendet' : 'Senden' }}
+            </button>
+        </form>
     </Transition>
-
 </template>
 
-<script setup lang='ts'>
-import thumbs_up from '~/assets/icons/thumb-up.svg';
-import thumbs_down from '~/assets/icons/thumb-down.svg';
-import type { DirectusPodcastItem } from '~/types';
-import { useWebHaptics } from 'web-haptics/vue';
-import { defaultPatterns } from 'web-haptics';
-import { ref } from 'vue';
-import { useDirectus } from '~/composables/useDirectus';
+<script setup lang="ts">
+import thumbs_down from '~/assets/icons/thumb-down.svg'
+import thumbs_up from '~/assets/icons/thumb-up.svg'
+import { useDirectus } from '~/composables/useDirectus'
+import type { DirectusPodcastItem } from '~/types'
+import { ref } from 'vue'
+import { defaultPatterns } from 'web-haptics'
+import { useWebHaptics } from 'web-haptics/vue'
 
-const { message, setMessage, clearMessage } = useFlashMessage();
-const props = defineProps<{ podcast: DirectusPodcastItem }>();
-const { trigger } = useWebHaptics();
-const istActive = ref(false);
+const { message, setMessage, clearMessage } = useFlashMessage()
+const props = defineProps<{ podcast: DirectusPodcastItem }>()
+const { trigger } = useWebHaptics()
+const istActive = ref(false)
 
-const directus = useDirectus();
+const directus = useDirectus()
 
 type FormState = 'pending' | 'submitting' | 'submitted' | 'error'
-const formState = ref<FormState>('pending');
-const formError = ref('');
-
-const comment = ref('');
-
-const ratingId = ref(message.value?.payload?.id || '');
-
-const rate = async function(upOrDown: 'up' | 'down') {
-  if (istActive.value) return;
-  istActive.value = true;
-  try {
-    trigger(defaultPatterns.buzz);
-    const result = await $fetch<{ id?: string }>('/api/vote', {
-      method: 'POST',
-      body: {
-        slug: props.podcast.slug,
-        direction: upOrDown,
-      },
-    });
-    setMessage('Vielen Dank für dein Feedback!', 'rating', {});
-    ratingId.value = result?.id ?? '';
-  } catch {
-    setMessage('Leider trat ein Fehler auf.', 'rating', {});
-  }
-  istActive.value = false;
-};
+const formState = ref<FormState>('pending')
+const formError = ref('')
+
+const comment = ref('')
+
+const ratingId = ref(message.value?.payload?.id || '')
+
+const rate = async function (upOrDown: 'up' | 'down') {
+    if (istActive.value) return
+    istActive.value = true
+    try {
+        trigger(defaultPatterns.buzz)
+        const result = await $fetch<{ id?: string }>('/api/vote', {
+            method: 'POST',
+            body: {
+                slug: props.podcast.slug,
+                direction: upOrDown,
+            },
+        })
+        setMessage('Vielen Dank für dein Feedback!', 'rating', {})
+        ratingId.value = result?.id ?? ''
+    } catch {
+        setMessage('Leider trat ein Fehler auf.', 'rating', {})
+    }
+    istActive.value = false
+}
 
 // Show-note links (/podcast/[slug]/[up|down]) redirect here with ?vote=…
 // instead of writing on GET. Cast the vote client-side so crawlers, which
 // don't run this, never register one.
-const route = useRoute();
-const router = useRouter();
+const route = useRoute()
+const router = useRouter()
 
 onMounted(() => {
-  const vote = route.query.vote;
-  if ((vote === 'up' || vote === 'down') && !message.value) {
-    rate(vote);
-    // Drop the query param so a refresh or back-navigation doesn't re-vote.
-    const query = { ...route.query };
-    delete query.vote;
-    router.replace({ query });
-  }
-});
+    const vote = route.query.vote
+    if ((vote === 'up' || vote === 'down') && !message.value) {
+        rate(vote)
+        // Drop the query param so a refresh or back-navigation doesn't re-vote.
+        const query = { ...route.query }
+        delete query.vote
+        router.replace({ query })
+    }
+})
 
 const submitForm = async (event: Event) => {
-  try {
-      const formElement = event.target as HTMLFormElement
-      if (formElement.reportValidity && !formElement.reportValidity()) {
-        throw new Error('Ein Pflichtfeld wurde nicht ausgefüllt oder eine deiner Angaben ist ungültig.')
-      }
-
-      formState.value = 'submitting';
-      await directus.addCommentToRating({id: ratingId.value}, comment.value);
-
-      comment.value = '';
-      formState.value = 'submitted'
-  } catch (error: any) {
-    formState.value = 'error'
-    if (error.message) {
-      formError.value = error.message
-    } else {
-      formError.value = 'Kommentar konnte nicht gespeichert werden.'
+    try {
+        const formElement = event.target as HTMLFormElement
+        if (formElement.reportValidity && !formElement.reportValidity()) {
+            throw new Error('Ein Pflichtfeld wurde nicht ausgefüllt oder eine deiner Angaben ist ungültig.')
+        }
+
+        formState.value = 'submitting'
+        await directus.addCommentToRating({ id: ratingId.value }, comment.value)
+
+        comment.value = ''
+        formState.value = 'submitted'
+    } catch (error: any) {
+        formState.value = 'error'
+        if (error.message) {
+            formError.value = error.message
+        } else {
+            formError.value = 'Kommentar konnte nicht gespeichert werden.'
+        }
     }
-  }
 }
 
 onUnmounted(() => {
-  clearMessage();
-});
-
+    clearMessage()
+})
 </script>
 
-<style scoped lang='postcss'>
+<style scoped lang="postcss">
 .text-input {
-  @apply w-full appearance-none rounded-none border-2 border-gray-600 bg-gray-600 p-4 text-base font-light text-white md:text-xl lg:text-2xl;
+    @apply w-full appearance-none rounded-none border-2 border-gray-600 bg-gray-600 p-4 text-base font-light text-white md:text-xl lg:text-2xl;
 }
 
 .contact-form.error .text-input:invalid {
-  @apply border-pink;
+    @apply border-pink;
 }
 
 input.text-input {
-  @apply h-12;
+    @apply h-12;
 }
 </style>
diff --git a/nuxt-app/components/PodcastSlider.vue b/nuxt-app/components/PodcastSlider.vue
index 9588710a..78132850 100644
--- a/nuxt-app/components/PodcastSlider.vue
+++ b/nuxt-app/components/PodcastSlider.vue
@@ -74,8 +74,8 @@
             "
             type="button"
             :title="index === 1 ? 'Scroll left' : 'Scroll right'"
-            :data-cursor-arrow-left="(index === 1 && !scrollStartReached) ? true : null"
-            :data-cursor-arrow-right="(index === 2 && !scrollEndReached) ? true : null"
+            :data-cursor-arrow-left="index === 1 && !scrollStartReached ? true : null"
+            :data-cursor-arrow-right="index === 2 && !scrollEndReached ? true : null"
             @click="() => scrollTo(index === 1 ? 'left' : 'right')"
         />
     </div>
diff --git a/nuxt-app/components/PodcastTranscript.vue b/nuxt-app/components/PodcastTranscript.vue
index 18c8c1ac..10401dd7 100644
--- a/nuxt-app/components/PodcastTranscript.vue
+++ b/nuxt-app/components/PodcastTranscript.vue
@@ -1,86 +1,87 @@
 <template>
-  <div class='relative flex max-h-96 md:max-h-160 w-full flex-col overflow-hidden rounded-xl'>
-    <div class='relative left-0 top-0 flex w-full items-center justify-center bg-gray-800 py-2'>
-      <div class='absolute left-3 flex flex-row gap-1.5'>
-        <div v-for='index in 3' :key='index' class='h-2.5 w-2.5 rounded-full bg-gray-600'></div>
-      </div>
-      <div
-        class='w-1/2 truncate text-ellipsis whitespace-nowrap text-center text-sm font-extralight text-white text-opacity-60 md:w-3/4 md:text-base'
-      >
-        {{ `/transkript/programmierbar/${name}`.trim() }}
-      </div>
+    <div class="relative flex max-h-96 w-full flex-col overflow-hidden rounded-xl md:max-h-160">
+        <div class="relative left-0 top-0 flex w-full items-center justify-center bg-gray-800 py-2">
+            <div class="absolute left-3 flex flex-row gap-1.5">
+                <div v-for="index in 3" :key="index" class="h-2.5 w-2.5 rounded-full bg-gray-600"></div>
+            </div>
+            <div
+                class="w-1/2 truncate text-ellipsis whitespace-nowrap text-center text-sm font-extralight text-white text-opacity-60 md:w-3/4 md:text-base"
+            >
+                {{ `/transkript/programmierbar/${name}`.trim() }}
+            </div>
+        </div>
+        <div class="scrollbar:!w-1.5 relative w-full overflow-auto bg-gray-900">
+            <div
+                class="whitespace-pre-line px-8 pb-32 pt-8 font-mono text-sm text-white md:px-16 md:text-base lg:text-lg"
+            >
+                <dl>
+                    <template v-for="(paragraph, paragraphIndex) in paragraphs" :key="paragraphIndex">
+                        <dt class="font-bold">{{ paragraph.speaker }}</dt>
+                        <dd class="mb-2.5">
+                            <span
+                                v-for="(wordListEntry, wordIndex) in paragraph.wordlist"
+                                :key="wordIndex"
+                                class="transition-colors"
+                                style="transition-duration: 350ms"
+                                :class="[wordListEntry.time < podcastPlayer.currentTime ? 'text-lime' : '']"
+                                @click="playPodcastAtTimestamp(wordListEntry.time)"
+                            >
+                                {{ wordListEntry.word + ' ' }}
+                            </span>
+                        </dd>
+                    </template>
+                </dl>
+            </div>
+        </div>
+        <div class="pointer-events-none absolute bottom-0 h-24 w-full bg-gradient-to-t from-black"></div>
     </div>
-    <div class='scrollbar:!w-1.5 relative w-full overflow-auto bg-gray-900'>
-      <div
-        class='whitespace-pre-line px-8 pb-32 pt-8 font-mono text-sm text-white md:px-16 md:text-base lg:text-lg'
-      >
-        <dl>
-          <template v-for='(paragraph, paragraphIndex) in paragraphs' :key='paragraphIndex'>
-            <dt class='font-bold'>{{ paragraph.speaker }}</dt>
-            <dd class='mb-2.5'>
-              <span
-                    v-for='(wordListEntry, wordIndex) in paragraph.wordlist'
-                    :key='wordIndex'
-                    class='transition-colors'
-                    style='transition-duration: 350ms;'
-                    :class="[(wordListEntry.time < podcastPlayer.currentTime) ? 'text-lime' : '']"
-                    @click='playPodcastAtTimestamp(wordListEntry.time)'>
-                {{ wordListEntry.word + ' ' }}
-              </span>
-            </dd>
-          </template>
-        </dl>
-      </div>
-    </div>
-    <div class='absolute bottom-0 h-24 w-full bg-gradient-to-t from-black pointer-events-none'></div>
-  </div>
 </template>
 
-<script lang='ts'>
-import { defineComponent, computed } from 'vue';
-import type { DirectusTranscriptItem, PodcastItem } from '~/types';
-import { usePodcastPlayer } from '~/composables';
-import { prepareTranscript } from '~/helpers/prepareTranscript';
+<script lang="ts">
+import { usePodcastPlayer } from '~/composables'
+import { prepareTranscript } from '~/helpers/prepareTranscript'
+import type { DirectusTranscriptItem, PodcastItem } from '~/types'
+import { computed, defineComponent } from 'vue'
 
 export default defineComponent({
-  props: {
-    name: {
-      type: String,
-      required: true,
-    },
-    podcast: {
-      type: Object as PropType<PodcastItem>,
-      required: true,
+    props: {
+        name: {
+            type: String,
+            required: true,
+        },
+        podcast: {
+            type: Object as PropType<PodcastItem>,
+            required: true,
+        },
+        transcript: {
+            type: Object as PropType<DirectusTranscriptItem>,
+            required: true,
+        },
     },
-    transcript: {
-      type: Object as PropType<DirectusTranscriptItem>,
-      required: true,
-    },
-  },
-  setup(props) {
-    const podcastPlayer = usePodcastPlayer();
+    setup(props) {
+        const podcastPlayer = usePodcastPlayer()
 
-    function playPodcastAtTimestamp(timestamp: number) {
-      if (podcastPlayer.podcast?.id !== props.podcast.id) {
-        // Loading a new episode: hand the offset to `setPodcast`, which applies
-        // it once metadata is available. Seeking right after the src is set
-        // would be reset to 0 by the browser.
-        podcastPlayer.setPodcast(props.podcast, { startAt: timestamp });
-      } else {
-        podcastPlayer.setCurrentTime(timestamp);
-      }
-      podcastPlayer.play();
-    }
+        function playPodcastAtTimestamp(timestamp: number) {
+            if (podcastPlayer.podcast?.id !== props.podcast.id) {
+                // Loading a new episode: hand the offset to `setPodcast`, which applies
+                // it once metadata is available. Seeking right after the src is set
+                // would be reset to 0 by the browser.
+                podcastPlayer.setPodcast(props.podcast, { startAt: timestamp })
+            } else {
+                podcastPlayer.setCurrentTime(timestamp)
+            }
+            podcastPlayer.play()
+        }
 
-    const paragraphs = computed(() => {
-      return prepareTranscript(props.transcript);
-    });
+        const paragraphs = computed(() => {
+            return prepareTranscript(props.transcript)
+        })
 
-    return {
-      paragraphs,
-      playPodcastAtTimestamp,
-      podcastPlayer,
-    };
-  },
-});
+        return {
+            paragraphs,
+            playPodcastAtTimestamp,
+            podcastPlayer,
+        }
+    },
+})
 </script>
diff --git a/nuxt-app/components/PrettyJSON.vue b/nuxt-app/components/PrettyJSON.vue
index 004830a0..0cd4bfc8 100644
--- a/nuxt-app/components/PrettyJSON.vue
+++ b/nuxt-app/components/PrettyJSON.vue
@@ -1,48 +1,51 @@
 <template>
-  <vue-json-pretty :data="content" :theme="theme" :show-line='showLine' :show-line-number='showLineNumber'/>
+    <vue-json-pretty :data="content" :theme="theme" :show-line="showLine" :show-line-number="showLineNumber" />
 </template>
 
-<script setup lang='ts'>
-import VueJsonPretty from 'vue-json-pretty';
+<script setup lang="ts">
+import VueJsonPretty from 'vue-json-pretty'
 
-const props = withDefaults(defineProps<{
-  data: object | string;
-  theme?: "dark" | "light"
-  showLine?: boolean
-  showLineNumber?: boolean
-}>(), {
-  theme: "dark",
-  showLine: false,
-  showLineNumber: true,
-});
+const props = withDefaults(
+    defineProps<{
+        data: object | string
+        theme?: 'dark' | 'light'
+        showLine?: boolean
+        showLineNumber?: boolean
+    }>(),
+    {
+        theme: 'dark',
+        showLine: false,
+        showLineNumber: true,
+    }
+)
 
 const content = computed(() => {
-  if (typeof props.data === 'string') {
-    return JSON.parse(props.data);
-  } else {
-    return props.data;
-  }
+    if (typeof props.data === 'string') {
+        return JSON.parse(props.data)
+    } else {
+        return props.data
+    }
 })
 </script>
 
 <style>
 .vjs-tree {
-  padding: 0 !important;
-  color: white;
+    padding: 0 !important;
+    color: white;
 }
 
 @media (min-width: 768px) {
-  .vjs-tree-node {
-    font-size: 1.5rem;
-    line-height: 1.5;
-  }
+    .vjs-tree-node {
+        font-size: 1.5rem;
+        line-height: 1.5;
+    }
 }
 
 .vjs-key {
-  color: white;
+    color: white;
 }
 
 .vjs-tree-brackets {
-  color: white;
+    color: white;
 }
 </style>
diff --git a/nuxt-app/components/PrimaryPbButton.vue b/nuxt-app/components/PrimaryPbButton.vue
index 7b326c80..dc4babcc 100644
--- a/nuxt-app/components/PrimaryPbButton.vue
+++ b/nuxt-app/components/PrimaryPbButton.vue
@@ -12,7 +12,7 @@ const handleClick = () => {
 <template>
     <button
         :class="[
-            'btn btn-primary rounded-full border-4 text-base font-bold leading-8 tracking-[2px] text-lime hover:bg-lime hover:text-black active:translate-y-1 ',
+            'btn btn-primary rounded-full border-4 text-base font-bold leading-8 tracking-[2px] text-lime hover:bg-lime hover:text-black active:translate-y-1',
             isClicked ? 'animate-grow-fade' : '',
         ]"
         @click="handleClick"
diff --git a/nuxt-app/components/SearchResultCard.vue b/nuxt-app/components/SearchResultCard.vue
index 63f8cca1..db17fd16 100644
--- a/nuxt-app/components/SearchResultCard.vue
+++ b/nuxt-app/components/SearchResultCard.vue
@@ -1,36 +1,44 @@
 <template>
     <div>
-        <nuxt-link class="block space-y-6 lg:flex lg:space-x-12 lg:space-y-0" :to="viewModel.url" data-cursor-more :target='viewModel.target'>
-          <nuxt-img
-            v-if="item.image"
-            class="h-32 w-32 object-cover md:h-48 md:w-48 lg:h-72 lg:w-72"
-            :src="item.image"
-            sizes="xs:128px md:192px lg:288px"
-            loading="lazy"
-            quality="80"
-            fit="cover"
-          />
+        <nuxt-link
+            class="block space-y-6 lg:flex lg:space-x-12 lg:space-y-0"
+            :to="viewModel.url"
+            data-cursor-more
+            :target="viewModel.target"
+        >
+            <nuxt-img
+                v-if="item.image"
+                class="h-32 w-32 object-cover md:h-48 md:w-48 lg:h-72 lg:w-72"
+                :src="item.image"
+                sizes="xs:128px md:192px lg:288px"
+                loading="lazy"
+                quality="80"
+                fit="cover"
+            />
 
             <div>
-              <!-- Type and date -->
-              <div class="text-xs font-light italic text-white md:text-base lg:text-xl">
-                {{ viewModel.typeAndDate }}
-              </div>
+                <!-- Type and date -->
+                <div class="text-xs font-light italic text-white md:text-base lg:text-xl">
+                    {{ viewModel.typeAndDate }}
+                </div>
 
-              <!-- Heading -->
-              <h2
-                class="mt-2 line-clamp-2 text-xl font-black leading-snug text-white md:text-3xl lg:mt-5 lg:text-4xl lg:leading-snug"
-              >
-                {{ viewModel.heading }}
-                <LeaveSiteIcon v-if="viewModel.isExternalUrl" class="ml-1 mt-px inline-block h-4 text-white xl:h-6" />
-              </h2>
+                <!-- Heading -->
+                <h2
+                    class="mt-2 line-clamp-2 text-xl font-black leading-snug text-white md:text-3xl lg:mt-5 lg:text-4xl lg:leading-snug"
+                >
+                    {{ viewModel.heading }}
+                    <LeaveSiteIcon
+                        v-if="viewModel.isExternalUrl"
+                        class="ml-1 mt-px inline-block h-4 text-white xl:h-6"
+                    />
+                </h2>
 
-              <!-- Description -->
-              <p
-                class="mt-4 line-clamp-4 text-sm font-light leading-normal text-white md:text-lg lg:mt-8 lg:text-xl lg:leading-relaxed"
-              >
-                {{ viewModel.description }}
-              </p>
+                <!-- Description -->
+                <p
+                    class="mt-4 line-clamp-4 text-sm font-light leading-normal text-white md:text-lg lg:mt-8 lg:text-xl lg:leading-relaxed"
+                >
+                    {{ viewModel.description }}
+                </p>
             </div>
         </nuxt-link>
     </div>
@@ -44,83 +52,82 @@ import { computed } from 'vue'
 
 const props = defineProps<{
     item: {
-      _type: string,
-      published_on: string,
+        _type: string
+        published_on: string
 
-      image: string,
+        image: string
 
-      slug?: string,
-      name?: string,
-      title?: string,
-      description?: string,
-      transcript?: string,
-      website_url?: string,
+        slug?: string
+        name?: string
+        title?: string
+        description?: string
+        transcript?: string
+        website_url?: string
     }
 }>()
 
 class ViewModel {
-  constructor(
-    public url = "",
-    public heading = "",
-    public typeAndDate = "",
-    public description = "",
-    public isExternalUrl = false,
-  ) {}
-  get target(): string {
+    constructor(
+        public url = '',
+        public heading = '',
+        public typeAndDate = '',
+        public description = '',
+        public isExternalUrl = false
+    ) {}
+    get target(): string {
+        if (this.isExternalUrl) {
+            return '_blank'
+        }
 
-    if (this.isExternalUrl) {
-      return '_blank';
+        return '_self'
     }
-
-    return '_self';
-  }
 }
 
 const viewModel = computed(() => {
-  const publishDate = new Date(props.item.published_on).toLocaleDateString("de-DE", {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit",
-  })
-  switch (props.item._type) {
-    case "podcast":
-      return new ViewModel(
-        `/podcast/${props.item.slug}`,
-        getFullPodcastTitle(props.item) || "",
-        "Podcast // " + publishDate,
-        getPlainText(props.item.description),
-      )
-    case "transcript":
-      return new ViewModel(
-        `/podcast/${props.item.slug}`,
-        getFullPodcastTitle(props.item) || "",
-        "Podcast // " + publishDate,
-        getPlainText(props.item.transcript),
-      )
-    case "meetup":
-      return new ViewModel(
-        `/meetup/${props.item.slug}`,
-        props.item.title || "",
-        "Meetup // " + publishDate,
-        getPlainText(props.item.description),
-      )
-    case "speaker":
-      return new ViewModel(
-        `/hall-of-fame/${props.item.slug}`,
-        getFullSpeakerName(props.item) || "",
-        "Speaker // " + publishDate,
-        getPlainText(props.item.description),
-      )
-    case "pick_of_the_day":
-      return new ViewModel(
-        props.item.website_url,
-        props.item.name || "",
-        "Pick of the Day // " + publishDate,
-        getPlainText(props.item.description),
-        true,
-      )
-    default:
-      return new ViewModel()
-  }
+    const publishDate = new Date(props.item.published_on).toLocaleDateString('de-DE', {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+    })
+    switch (props.item._type) {
+        case 'podcast':
+            return new ViewModel(
+                `/podcast/${props.item.slug}`,
+                getFullPodcastTitle(props.item) || '',
+                'Podcast // ' + publishDate,
+                getPlainText(props.item.description)
+            )
+        case 'transcript':
+            return new ViewModel(
+                `/podcast/${props.item.slug}`,
+                getFullPodcastTitle(props.item) || '',
+                'Podcast // ' + publishDate,
+                getPlainText(props.item.transcript)
+            )
+        case 'meetup':
+            return new ViewModel(
+                `/meetup/${props.item.slug}`,
+                props.item.title || '',
+                'Meetup // ' + publishDate,
+                getPlainText(props.item.description)
+            )
+        case 'speaker':
+            return new ViewModel(
+                `/hall-of-fame/${props.item.slug}`,
+                getFullSpeakerName(props.item) || '',
+                'Speaker // ' + publishDate,
+                getPlainText(props.item.description)
+            )
+        case 'pick_of_the_day':
+            return new ViewModel(
+                props.item.website_url,
+                props.item.name || '',
+                'Pick of the Day // ' + publishDate,
+                getPlainText(props.item.description),
+                true
+            )
+        default:
+            return new ViewModel()
+    }
 })
 </script>
diff --git a/nuxt-app/components/SocialNetworks.vue b/nuxt-app/components/SocialNetworks.vue
index ce9c055f..4fc061e3 100644
--- a/nuxt-app/components/SocialNetworks.vue
+++ b/nuxt-app/components/SocialNetworks.vue
@@ -21,22 +21,22 @@
 
 <script setup lang="ts">
 import BlueskyIcon from '~/assets/logos/bluesky.svg'
+import DiscordIcon from '~/assets/logos/discord.svg'
 import GithubIcon from '~/assets/logos/github.svg'
 import InstagramIcon from '~/assets/logos/instagram.svg'
 import LinkedinIcon from '~/assets/logos/linkedin.svg'
 import MastodonIcon from '~/assets/logos/mastodon.svg'
-import DiscordIcon from '~/assets/logos/discord.svg'
 //import TwitterIcon from '~/assets/logos/twitter.svg'
 import YoutubeIcon from '~/assets/logos/youtube.svg'
 import {
-  OPEN_BLUESKY_EVENT_ID,
-  OPEN_GITHUB_EVENT_ID,
-  OPEN_INSTAGRAM_EVENT_ID,
-  OPEN_LINKEDIN_EVENT_ID,
-  OPEN_MASTODON_EVENT_ID,
-  //OPEN_TWITTER_EVENT_ID,
-  OPEN_DISCORD_EVENT_ID,
-  OPEN_YOUTUBE_EVENT_ID,
+    OPEN_BLUESKY_EVENT_ID,
+    //OPEN_TWITTER_EVENT_ID,
+    OPEN_DISCORD_EVENT_ID,
+    OPEN_GITHUB_EVENT_ID,
+    OPEN_INSTAGRAM_EVENT_ID,
+    OPEN_LINKEDIN_EVENT_ID,
+    OPEN_MASTODON_EVENT_ID,
+    OPEN_YOUTUBE_EVENT_ID,
 } from '../config'
 import { trackGoal } from '../helpers'
 
@@ -62,22 +62,22 @@ const socialNetworks = [
         eventId: OPEN_LINKEDIN_EVENT_ID,
     },
     {
-      label: 'Bluesky',
-      icon: BlueskyIcon,
-      href: 'https://bsky.app/profile/programmier.bar',
-      eventId: OPEN_BLUESKY_EVENT_ID,
+        label: 'Bluesky',
+        icon: BlueskyIcon,
+        href: 'https://bsky.app/profile/programmier.bar',
+        eventId: OPEN_BLUESKY_EVENT_ID,
     },
     {
-      label: 'Instagram',
-      icon: InstagramIcon,
-      href: 'https://www.instagram.com/programmier.bar',
-      eventId: OPEN_INSTAGRAM_EVENT_ID,
+        label: 'Instagram',
+        icon: InstagramIcon,
+        href: 'https://www.instagram.com/programmier.bar',
+        eventId: OPEN_INSTAGRAM_EVENT_ID,
     },
     {
-      label: 'Discord',
-      icon: DiscordIcon,
-      href: $config.public.DISCORD_INVITE_LINK,
-      eventId: OPEN_DISCORD_EVENT_ID,
+        label: 'Discord',
+        icon: DiscordIcon,
+        href: $config.public.DISCORD_INVITE_LINK,
+        eventId: OPEN_DISCORD_EVENT_ID,
     },
     {
         label: 'YouTube',
@@ -85,11 +85,11 @@ const socialNetworks = [
         href: 'https://www.youtube.com/channel/UCi9Odm-45QGUBRs5KiF1-HQ',
         eventId: OPEN_YOUTUBE_EVENT_ID,
     },
-//    {
-//        label: 'Twitter',
-//        icon: TwitterIcon,
-//        href: 'https://twitter.com/programmierbar',
-//        eventId: OPEN_TWITTER_EVENT_ID,
-//    },
+    //    {
+    //        label: 'Twitter',
+    //        icon: TwitterIcon,
+    //        href: 'https://twitter.com/programmierbar',
+    //        eventId: OPEN_TWITTER_EVENT_ID,
+    //    },
 ]
 </script>
diff --git a/nuxt-app/components/SpeakerListItem.vue b/nuxt-app/components/SpeakerListItem.vue
index 96410cb4..561079d7 100644
--- a/nuxt-app/components/SpeakerListItem.vue
+++ b/nuxt-app/components/SpeakerListItem.vue
@@ -2,7 +2,7 @@
     <li class="flex flex-col md:flex-row-reverse md:items-center">
         <!-- Event image -->
         <NuxtLink
-            v-if='hasImage'
+            v-if="hasImage"
             class="block md:ml-16 md:h-60 md:w-1/2 lg:ml-20 lg:h-80 xl:h-96 2xl:h-112"
             :to="href"
             data-cursor-hover
@@ -17,10 +17,7 @@
             />
         </NuxtLink>
 
-        <div
-class="mt-10 md:mt-0"
-             :class="hasImage ? 'md:w-1/2' : ''"
-        >
+        <div class="mt-10 md:mt-0" :class="hasImage ? 'md:w-1/2' : ''">
             <!-- Name -->
             <h3 class="text-xl font-black text-white md:text-2xl lg:text-3xl">
                 {{ fullName }}
@@ -40,10 +37,10 @@ class="mt-10 md:mt-0"
 </template>
 
 <script lang="ts">
+import { getPlainText } from '~/helpers/sanitize'
 import { getFullSpeakerName } from 'shared-code'
 import type { PropType } from 'vue'
 import { computed, defineComponent } from 'vue'
-import { getPlainText } from '~/helpers/sanitize'
 import type { SpeakerItem } from '../types'
 import DirectusImage from './DirectusImage.vue'
 import LinkButton from './LinkButton.vue'
diff --git a/nuxt-app/components/TalkItem.vue b/nuxt-app/components/TalkItem.vue
index dd7fa74b..d951052c 100644
--- a/nuxt-app/components/TalkItem.vue
+++ b/nuxt-app/components/TalkItem.vue
@@ -1,62 +1,43 @@
 <template>
-  <div
-    :id="'talk-' + talk.id"
-    class="
-        flex flex-col
-        lg:grid lg:grid-cols-2 lg:grid-rows-[auto_1fr]
-    ">
-    <div
-class="
-            order-1 <!-- Mobile order -->
-            lg:order-none <!-- Reset order for grid -->
-            lg:col-start-1 lg:row-start-1 <!-- Desktop grid placement -->
-        ">
-      <p class='text-3xl font-black mb-2'>{{ talk.title }}</p>
-      <p class='text-xl italic font-light lg:mb-7'>{{ buildSpeakerNamesForTalk(talk) }}</p>
-    </div>
+    <div :id="'talk-' + talk.id" class="flex flex-col lg:grid lg:grid-cols-2 lg:grid-rows-[auto_1fr]">
+        <div
+            class="<!-- Mobile order --> <!-- Reset order for --> <!-- Desktop placement --> order-1 grid lg:order-none lg:col-start-1 lg:row-start-1"
+        >
+            <p class="mb-2 text-3xl font-black">{{ talk.title }}</p>
+            <p class="text-xl font-light italic lg:mb-7">{{ buildSpeakerNamesForTalk(talk) }}</p>
+        </div>
 
-    <div
-      :class="[
-        'order-3 lg:order-none md:mt-0 sm:mt-5',
-        (!talk.video_url && !talk.thumbnail) ? 'lg:col-span-2' : 'lg:col-start-1 lg:row-start-2'
-      ]"
-    >
-      <InnerHtml
-        :html='talk.abstract'
-        class='font-light text-xl space-y-8'
-      />
-    </div>
+        <div
+            :class="[
+                'order-3 sm:mt-5 md:mt-0 lg:order-none',
+                !talk.video_url && !talk.thumbnail ? 'lg:col-span-2' : 'lg:col-start-1 lg:row-start-2',
+            ]"
+        >
+            <InnerHtml :html="talk.abstract" class="space-y-8 text-xl font-light" />
+        </div>
 
-    <div
-class="
-            order-2 <!-- Mobile order -->
-            lg:order-none <!-- Reset order for grid -->
-            lg:col-start-2 lg:row-start-1 lg:row-span-2 <!-- Desktop grid placement & span -->
-            lg:self-start <!-- Don't stretch to row-span height, keep aspect-ratio -->
-            pl-0 lg:pl-10
-            mb-5 lg:mb-0
-        ">
-      <EmbeddedVideoPlayer v-if='talk.video_url' :url='talk.video_url' :thumbnail='talk.thumbnail'/>
-      <DirectusImage
-        v-if='!talk.video_url && talk.thumbnail'
-        class='object-cover aspect-video w-full'
-        :image='talk.thumbnail'
-        sizes='lg:600px'
-        loading='lazy'
-      />
+        <div
+            class="<!-- Mobile order --> <!-- Reset order for --> <!-- Desktop placement & span --> <!-- Don't stretch to row-span height, keep aspect-ratio --> order-2 mb-5 grid pl-0 lg:order-none lg:col-start-2 lg:row-span-2 lg:row-start-1 lg:mb-0 lg:self-start lg:pl-10"
+        >
+            <EmbeddedVideoPlayer v-if="talk.video_url" :url="talk.video_url" :thumbnail="talk.thumbnail" />
+            <DirectusImage
+                v-if="!talk.video_url && talk.thumbnail"
+                class="aspect-video w-full object-cover"
+                :image="talk.thumbnail"
+                sizes="lg:600px"
+                loading="lazy"
+            />
+        </div>
     </div>
-  </div>
 </template>
 
 <script setup lang="ts">
-import type { TalkItem } from '~/types';
-import { buildSpeakerNamesForTalk } from '~/helpers/buildSpeakerNamesForTalk';
+import { buildSpeakerNamesForTalk } from '~/helpers/buildSpeakerNamesForTalk'
+import type { TalkItem } from '~/types'
 
 const props = defineProps<{
-  talk: TalkItem
-}>();
-
+    talk: TalkItem
+}>()
 </script>
 
-<style lang="postcss" scoped>
-</style>
+<style lang="postcss" scoped></style>
diff --git a/nuxt-app/components/TestimonialSlider.vue b/nuxt-app/components/TestimonialSlider.vue
index 310289cc..ba897354 100644
--- a/nuxt-app/components/TestimonialSlider.vue
+++ b/nuxt-app/components/TestimonialSlider.vue
@@ -8,37 +8,44 @@
             @scroll="detectScrollState"
         >
             <ClientOnly>
-                <GenericLazyList class="flex" :items="randomizedTestimonials" direction="horizontal" :scroll-element="scrollBoxElement">
-                <template #default="{ item, index, viewportItems, addViewportItem }">
-                    <GenericListItem
-                        :key="item.id"
-                        :class="index > 0 && 'ml-12 ml-16 lg:ml-20 xl:ml-24 2xl:ml-32'"
-                        :item="item"
-                        :viewport-items="viewportItems"
-                        :add-viewport-item="addViewportItem"
-                    >
-                        <template #default="{ isNewToViewport }">
-                            <FadeAnimation :fade-in="isNewToViewport ? 'from_bottom' : 'none'" :threshold="0">
-                              <div class='w-60 md:w-120'>
-                                  <div>
-                                    <blockquote class='w-full'>
-                                      <QuoteStart class='mb-2 mb-5  scale-50 scale-100 origin-bottom-left' />
-                                      <InnerHtml
-                                        :html="item.text"
-                                        class='text-white font-light text-xl text-3xl italic'
-                                      />
-                                      <div class='flex justify-end'>
-                                        <QuoteEnd class='-mt-1 block scale-50 scale-100' />
-                                      </div>
-                                    </blockquote>
-                                    <p class='text-white font-light opacity-40 text-base italic mt-4 mt-10'>{{ item.subtitle }}</p>
-                                  </div>
-                              </div>
-                            </FadeAnimation>
-                        </template>
-                    </GenericListItem>
-                </template>
-            </GenericLazyList>
+                <GenericLazyList
+                    class="flex"
+                    :items="randomizedTestimonials"
+                    direction="horizontal"
+                    :scroll-element="scrollBoxElement"
+                >
+                    <template #default="{ item, index, viewportItems, addViewportItem }">
+                        <GenericListItem
+                            :key="item.id"
+                            :class="index > 0 && 'ml-12 ml-16 lg:ml-20 xl:ml-24 2xl:ml-32'"
+                            :item="item"
+                            :viewport-items="viewportItems"
+                            :add-viewport-item="addViewportItem"
+                        >
+                            <template #default="{ isNewToViewport }">
+                                <FadeAnimation :fade-in="isNewToViewport ? 'from_bottom' : 'none'" :threshold="0">
+                                    <div class="w-60 md:w-120">
+                                        <div>
+                                            <blockquote class="w-full">
+                                                <QuoteStart class="mb-2 mb-5 origin-bottom-left scale-100 scale-50" />
+                                                <InnerHtml
+                                                    :html="item.text"
+                                                    class="text-3xl text-xl font-light italic text-white"
+                                                />
+                                                <div class="flex justify-end">
+                                                    <QuoteEnd class="-mt-1 block scale-100 scale-50" />
+                                                </div>
+                                            </blockquote>
+                                            <p class="mt-10 mt-4 text-base font-light italic text-white opacity-40">
+                                                {{ item.subtitle }}
+                                            </p>
+                                        </div>
+                                    </div>
+                                </FadeAnimation>
+                            </template>
+                        </GenericListItem>
+                    </template>
+                </GenericLazyList>
             </ClientOnly>
         </div>
 
@@ -46,7 +53,7 @@
         <button
             v-for="index of 2"
             :key="index"
-            class="absolute top-0 block h-full w-5 md:w-40 from-black to-transparent transition-opacity duration-500 3xl:w-80"
+            class="absolute top-0 block h-full w-5 from-black to-transparent transition-opacity duration-500 md:w-40 3xl:w-80"
             :class="[
                 index === 1 ? 'left-0 bg-gradient-to-r' : 'right-0 bg-gradient-to-l',
                 ((index === 1 && scrollStartReached) || (index === 2 && scrollEndReached)) &&
@@ -58,28 +65,27 @@
             "
             type="button"
             :title="index === 1 ? 'Scroll left' : 'Scroll right'"
-            :data-cursor-arrow-left="(index === 1 && !scrollStartReached) ? true : null"
-            :data-cursor-arrow-right="(index === 2 && !scrollEndReached) ? true : null"
+            :data-cursor-arrow-left="index === 1 && !scrollStartReached ? true : null"
+            :data-cursor-arrow-right="index === 2 && !scrollEndReached ? true : null"
             @click="() => scrollTo(index === 1 ? 'left' : 'right')"
         />
     </div>
 </template>
 
 <script setup lang="ts">
+import QuoteEnd from '~/assets/icons/quote-end.svg'
+import QuoteStart from '~/assets/icons/quote-start.svg'
+import { useWeightedRandomSelection } from '~/composables/useWeightedRandomSelection'
 import { CLICK_SCROLL_LEFT_ARROW_EVENT_ID, CLICK_SCROLL_RIGHT_ARROW_EVENT_ID } from '~/config'
 import { trackGoal } from '~/helpers'
-import type { DirectusTestimonialItem, SpeakerPreviewItem } from '~/types';
+import type { DirectusTestimonialItem, SpeakerPreviewItem } from '~/types'
 import { onMounted, ref } from 'vue'
 import FadeAnimation from './FadeAnimation.vue'
 import GenericLazyList from './GenericLazyList.vue'
 import GenericListItem from './GenericListItem.vue'
 
-import QuoteEnd from '~/assets/icons/quote-end.svg'
-import QuoteStart from '~/assets/icons/quote-start.svg'
-import { useWeightedRandomSelection } from '~/composables/useWeightedRandomSelection'
-
 const props = defineProps<{
-  testimonials: DirectusTestimonialItem[]
+    testimonials: DirectusTestimonialItem[]
 }>()
 
 const { selectTestimonials } = useWeightedRandomSelection()
diff --git a/nuxt-app/components/tickets/TicketPricingSummary.vue b/nuxt-app/components/tickets/TicketPricingSummary.vue
index ef4167df..11556ba3 100644
--- a/nuxt-app/components/tickets/TicketPricingSummary.vue
+++ b/nuxt-app/components/tickets/TicketPricingSummary.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { VAT_RATE_PERCENT } from '~/config'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { VAT_RATE_PERCENT } from '~/config'
 
 defineProps<{
     /**
@@ -19,7 +19,7 @@ const store = useTicketCheckoutStore()
         <h3 class="mb-4 text-lg font-bold text-white">Zusammenfassung</h3>
 
         <div class="space-y-2 text-sm">
-            <div class="flex justify-between text-gray-300">
+            <div class="text-gray-300 flex justify-between">
                 <span>{{ store.ticketCount }}× Ticket</span>
                 <span>{{ store.formatPrice(store.unitPriceCents) }}</span>
             </div>
@@ -49,12 +49,12 @@ const store = useTicketCheckoutStore()
             <template v-else>
                 <hr class="my-3 border-gray-700" />
 
-                <div class="flex justify-between text-gray-300">
+                <div class="text-gray-300 flex justify-between">
                     <span>Zwischensumme (netto)</span>
                     <span>{{ store.formatPrice(store.totalCents) }}</span>
                 </div>
 
-                <div class="flex justify-between text-gray-300">
+                <div class="text-gray-300 flex justify-between">
                     <span>zzgl. {{ VAT_RATE_PERCENT }} % MwSt.</span>
                     <span>{{ store.formatPrice(store.vatAmountCents) }}</span>
                 </div>
diff --git a/nuxt-app/components/tickets/TicketPurchaseFlow.vue b/nuxt-app/components/tickets/TicketPurchaseFlow.vue
index 1b13cb0b..263e7be8 100644
--- a/nuxt-app/components/tickets/TicketPurchaseFlow.vue
+++ b/nuxt-app/components/tickets/TicketPurchaseFlow.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import { computed, onMounted } from 'vue'
-import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
 import Pagination from '~/components/Pagination.vue'
-import TicketStepQuantity from './TicketStepQuantity.vue'
+import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { computed, onMounted } from 'vue'
 import TicketStepAttendees from './TicketStepAttendees.vue'
 import TicketStepBilling from './TicketStepBilling.vue'
+import TicketStepQuantity from './TicketStepQuantity.vue'
 import TicketStepReview from './TicketStepReview.vue'
 
 const props = defineProps<{
diff --git a/nuxt-app/components/tickets/TicketStepAttendees.vue b/nuxt-app/components/tickets/TicketStepAttendees.vue
index 9092a837..4d1af722 100644
--- a/nuxt-app/components/tickets/TicketStepAttendees.vue
+++ b/nuxt-app/components/tickets/TicketStepAttendees.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { computed, watch, onMounted } from 'vue'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { computed, onMounted, watch } from 'vue'
 import TicketPricingSummary from './TicketPricingSummary.vue'
 
 const emit = defineEmits(['validityChange'])
@@ -16,9 +16,7 @@ function isValidEmail(email: string): boolean {
 const isFormValid = computed(() => {
     return store.attendees.every(
         (attendee) =>
-            attendee.firstName.trim() !== '' &&
-            attendee.lastName.trim() !== '' &&
-            isValidEmail(attendee.email)
+            attendee.firstName.trim() !== '' && attendee.lastName.trim() !== '' && isValidEmail(attendee.email)
     )
 })
 
@@ -46,9 +44,7 @@ function copyPurchaserInfo(index: number) {
 <template>
     <div class="ticket-step-attendees">
         <h2 class="mb-2 text-3xl font-bold text-white md:text-4xl">Teilnehmenden-Daten</h2>
-        <p class="mb-8 text-lg text-gray-300">
-            Bitte gib die Daten aller Teilnehmenden ein.
-        </p>
+        <p class="text-gray-300 mb-8 text-lg">Bitte gib die Daten aller Teilnehmenden ein.</p>
 
         <!-- Attendee forms -->
         <div class="space-y-8">
@@ -60,9 +56,7 @@ function copyPurchaserInfo(index: number) {
                 <div class="mb-4 flex items-center justify-between">
                     <h3 class="text-lg font-bold text-white">
                         Ticket {{ index + 1 }}
-                        <span v-if="store.ticketCount > 1" class="text-gray-400">
-                            / {{ store.ticketCount }}
-                        </span>
+                        <span v-if="store.ticketCount > 1" class="text-gray-400"> / {{ store.ticketCount }} </span>
                     </h3>
                     <button
                         v-if="store.purchaser.firstName && index > 0"
@@ -76,7 +70,7 @@ function copyPurchaserInfo(index: number) {
 
                 <div class="grid gap-4 md:grid-cols-2">
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
+                        <label class="text-gray-400 mb-2 block text-sm font-bold">
                             Vorname <span class="text-lime">*</span>
                         </label>
                         <input
@@ -89,7 +83,7 @@ function copyPurchaserInfo(index: number) {
                     </div>
 
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
+                        <label class="text-gray-400 mb-2 block text-sm font-bold">
                             Nachname <span class="text-lime">*</span>
                         </label>
                         <input
@@ -102,7 +96,7 @@ function copyPurchaserInfo(index: number) {
                     </div>
 
                     <div class="md:col-span-2">
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
+                        <label class="text-gray-400 mb-2 block text-sm font-bold">
                             E-Mail <span class="text-lime">*</span>
                         </label>
                         <input
@@ -112,9 +106,7 @@ function copyPurchaserInfo(index: number) {
                             class="w-full rounded-lg border border-gray-700 bg-gray-800 px-4 py-3 text-white placeholder-gray-500 focus:border-lime focus:outline-none"
                             @input="updateAttendee(index, 'email', ($event.target as HTMLInputElement).value)"
                         />
-                        <p class="mt-1 text-xs text-[#848a98]">
-                            Das Ticket wird an diese E-Mail-Adresse gesendet.
-                        </p>
+                        <p class="mt-1 text-xs text-[#848a98]">Das Ticket wird an diese E-Mail-Adresse gesendet.</p>
                     </div>
                 </div>
             </div>
diff --git a/nuxt-app/components/tickets/TicketStepBilling.vue b/nuxt-app/components/tickets/TicketStepBilling.vue
index 73f5c05e..a9429d86 100644
--- a/nuxt-app/components/tickets/TicketStepBilling.vue
+++ b/nuxt-app/components/tickets/TicketStepBilling.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { computed, watch, onMounted } from 'vue'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { computed, onMounted, watch } from 'vue'
 import TicketPricingSummary from './TicketPricingSummary.vue'
 
 const emit = defineEmits(['validityChange'])
@@ -85,13 +85,12 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
     if (!store.personalAddress) return
     store.updatePersonalAddress({ [field]: value })
 }
-
 </script>
 
 <template>
     <div class="ticket-step-billing">
         <h2 class="mb-2 text-3xl font-bold text-white md:text-4xl">Rechnungsdaten</h2>
-        <p class="mb-8 text-lg text-gray-300">Bitte gib die Daten ein, die auf der Rechnung stehen sollen.</p>
+        <p class="text-gray-300 mb-8 text-lg">Bitte gib die Daten ein, die auf der Rechnung stehen sollen.</p>
 
         <!-- Purchase type toggle -->
         <div class="mb-8">
@@ -102,7 +101,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                     :class="
                         store.purchaseType === 'personal'
                             ? 'border-lime bg-lime/10 text-lime'
-                            : 'border-gray-700 text-gray-400 hover:border-gray-600'
+                            : 'text-gray-400 border-gray-700 hover:border-gray-600'
                     "
                     @click="store.setPurchaseType('personal')"
                 >
@@ -114,7 +113,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                     :class="
                         store.purchaseType === 'company'
                             ? 'border-lime bg-lime/10 text-lime'
-                            : 'border-gray-700 text-gray-400 hover:border-gray-600'
+                            : 'text-gray-400 border-gray-700 hover:border-gray-600'
                     "
                     @click="store.setPurchaseType('company')"
                 >
@@ -129,7 +128,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
 
             <div class="grid gap-4 md:grid-cols-2">
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         Vorname <span class="text-lime">*</span>
                     </label>
                     <input
@@ -142,7 +141,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         Nachname <span class="text-lime">*</span>
                     </label>
                     <input
@@ -155,7 +154,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div class="md:col-span-2">
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         E-Mail <span class="text-lime">*</span>
                     </label>
                     <input
@@ -165,9 +164,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                         class="w-full rounded-lg border border-gray-700 bg-gray-800 px-4 py-3 text-white placeholder-gray-500 focus:border-lime focus:outline-none"
                         @input="updatePurchaser('email', ($event.target as HTMLInputElement).value)"
                     />
-                    <p class="mt-1 text-xs text-[#848a98]">
-                        Die Bestellbestätigung wird an diese Adresse gesendet.
-                    </p>
+                    <p class="mt-1 text-xs text-[#848a98]">Die Bestellbestätigung wird an diese Adresse gesendet.</p>
                 </div>
             </div>
         </div>
@@ -176,16 +173,12 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
         <div v-if="store.purchaseType === 'personal'" class="mb-8">
             <button
                 type="button"
-                class="flex items-center gap-2 text-gray-400 hover:text-white transition"
+                class="text-gray-400 flex items-center gap-2 transition hover:text-white"
                 @click="store.setShowPersonalAddress(!store.showPersonalAddress)"
             >
                 <span
                     class="flex h-5 w-5 items-center justify-center rounded border transition"
-                    :class="
-                        store.showPersonalAddress
-                            ? 'border-lime bg-lime text-black'
-                            : 'border-gray-600'
-                    "
+                    :class="store.showPersonalAddress ? 'border-lime bg-lime text-black' : 'border-gray-600'"
                 >
                     <svg
                         v-if="store.showPersonalAddress"
@@ -209,9 +202,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
 
                 <div class="grid gap-4">
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
-                            Straße und Hausnummer
-                        </label>
+                        <label class="text-gray-400 mb-2 block text-sm font-bold"> Straße und Hausnummer </label>
                         <input
                             :value="store.personalAddress.line1 || ''"
                             type="text"
@@ -222,9 +213,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                     </div>
 
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
-                            Adresszusatz
-                        </label>
+                        <label class="text-gray-400 mb-2 block text-sm font-bold"> Adresszusatz </label>
                         <input
                             :value="store.personalAddress.line2 || ''"
                             type="text"
@@ -236,22 +225,20 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
 
                     <div class="grid gap-4 md:grid-cols-2">
                         <div>
-                            <label class="mb-2 block text-sm font-bold text-gray-400">
-                                Postleitzahl
-                            </label>
+                            <label class="text-gray-400 mb-2 block text-sm font-bold"> Postleitzahl </label>
                             <input
                                 :value="store.personalAddress.postalCode || ''"
                                 type="text"
                                 placeholder="12345"
                                 class="w-full rounded-lg border border-gray-700 bg-gray-800 px-4 py-3 text-white placeholder-gray-500 focus:border-lime focus:outline-none"
-                                @input="updatePersonalAddressField('postalCode', ($event.target as HTMLInputElement).value)"
+                                @input="
+                                    updatePersonalAddressField('postalCode', ($event.target as HTMLInputElement).value)
+                                "
                             />
                         </div>
 
                         <div>
-                            <label class="mb-2 block text-sm font-bold text-gray-400">
-                                Stadt
-                            </label>
+                            <label class="text-gray-400 mb-2 block text-sm font-bold"> Stadt </label>
                             <input
                                 :value="store.personalAddress.city || ''"
                                 type="text"
@@ -263,9 +250,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                     </div>
 
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
-                            Land
-                        </label>
+                        <label class="text-gray-400 mb-2 block text-sm font-bold"> Land </label>
                         <input
                             :value="store.personalAddress.country || ''"
                             type="text"
@@ -279,12 +264,15 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
         </div>
 
         <!-- Company billing info (conditional) -->
-        <div v-if="store.purchaseType === 'company' && store.company" class="mb-8 rounded-lg border border-gray-700 bg-gray-800/50 p-6">
+        <div
+            v-if="store.purchaseType === 'company' && store.company"
+            class="mb-8 rounded-lg border border-gray-700 bg-gray-800/50 p-6"
+        >
             <h3 class="mb-4 text-lg font-bold text-white">Firmenadresse</h3>
 
             <div class="grid gap-4">
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         Firmenname <span class="text-lime">*</span>
                     </label>
                     <input
@@ -297,7 +285,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         Straße und Hausnummer <span class="text-lime">*</span>
                     </label>
                     <input
@@ -310,9 +298,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
-                        Adresszusatz
-                    </label>
+                    <label class="text-gray-400 mb-2 block text-sm font-bold"> Adresszusatz </label>
                     <input
                         :value="store.company.address.line2 || ''"
                         type="text"
@@ -324,7 +310,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
 
                 <div class="grid gap-4 md:grid-cols-2">
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
+                        <label class="text-gray-400 mb-2 block text-sm font-bold">
                             Postleitzahl <span class="text-lime">*</span>
                         </label>
                         <input
@@ -337,7 +323,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                     </div>
 
                     <div>
-                        <label class="mb-2 block text-sm font-bold text-gray-400">
+                        <label class="text-gray-400 mb-2 block text-sm font-bold">
                             Stadt <span class="text-lime">*</span>
                         </label>
                         <input
@@ -351,7 +337,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
+                    <label class="text-gray-400 mb-2 block text-sm font-bold">
                         Land <span class="text-lime">*</span>
                     </label>
                     <input
@@ -364,9 +350,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
-                        USt-IdNr. (optional)
-                    </label>
+                    <label class="text-gray-400 mb-2 block text-sm font-bold"> USt-IdNr. (optional) </label>
                     <input
                         :value="store.company.vatId || ''"
                         type="text"
@@ -377,9 +361,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                 </div>
 
                 <div>
-                    <label class="mb-2 block text-sm font-bold text-gray-400">
-                        Rechnungs-E-Mail (optional)
-                    </label>
+                    <label class="text-gray-400 mb-2 block text-sm font-bold"> Rechnungs-E-Mail (optional) </label>
                     <input
                         :value="store.company.billingEmail || ''"
                         type="email"
@@ -387,9 +369,7 @@ function updatePersonalAddressField(field: keyof NonNullable<typeof store.person
                         class="w-full rounded-lg border border-gray-700 bg-gray-800 px-4 py-3 text-white placeholder-gray-500 focus:border-lime focus:outline-none"
                         @input="updateCompanyField('billingEmail', ($event.target as HTMLInputElement).value)"
                     />
-                    <p class="mt-1 text-xs text-[#848a98]">
-                        Falls abweichend von der Käufer:innen-E-Mail
-                    </p>
+                    <p class="mt-1 text-xs text-[#848a98]">Falls abweichend von der Käufer:innen-E-Mail</p>
                 </div>
             </div>
         </div>
diff --git a/nuxt-app/components/tickets/TicketStepQuantity.vue b/nuxt-app/components/tickets/TicketStepQuantity.vue
index 1e493f14..15f3208e 100644
--- a/nuxt-app/components/tickets/TicketStepQuantity.vue
+++ b/nuxt-app/components/tickets/TicketStepQuantity.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { computed, ref, watch, onMounted } from 'vue'
-import { VAT_RATE_PERCENT } from '~/config'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { VAT_RATE_PERCENT } from '~/config'
+import { computed, onMounted, ref, watch } from 'vue'
 import TicketPricingSummary from './TicketPricingSummary.vue'
 
 defineProps<{
@@ -46,19 +46,16 @@ function incrementTickets() {
         store.setTicketCount(store.ticketCount + 1)
     }
 }
-
 </script>
 
 <template>
     <div class="ticket-step-quantity">
         <h2 class="mb-2 text-3xl font-bold text-white md:text-4xl">Tickets sichern</h2>
-        <p class="mb-8 text-lg text-gray-300">{{ conferenceTitle }}</p>
+        <p class="text-gray-300 mb-8 text-lg">{{ conferenceTitle }}</p>
 
         <!-- Ticket count selector -->
         <div class="mb-8">
-            <label class="mb-3 block text-sm font-bold uppercase tracking-wider text-gray-400">
-                Anzahl Tickets
-            </label>
+            <label class="text-gray-400 mb-3 block text-sm font-bold uppercase tracking-wider"> Anzahl Tickets </label>
             <div class="flex items-center gap-4">
                 <button
                     type="button"
@@ -86,7 +83,7 @@ function incrementTickets() {
         </div>
 
         <!-- Error state when pricing failed to load -->
-        <div v-if="store.hasPricingError" class="mb-8 rounded-lg bg-red-500/10 border border-red-500/50 p-4">
+        <div v-if="store.hasPricingError" class="bg-red-500/10 border-red-500/50 mb-8 rounded-lg border p-4">
             <p class="text-red-400 font-medium">{{ store.error }}</p>
         </div>
 
@@ -98,7 +95,7 @@ function incrementTickets() {
                         <span v-if="store.isEarlyBird" class="font-bold text-lime">Early Bird</span>
                         <span v-else>Regulär</span>
                     </p>
-                    <p v-if="store.isEarlyBird && formattedEarlyBirdDeadline" class="text-sm text-gray-400">
+                    <p v-if="store.isEarlyBird && formattedEarlyBirdDeadline" class="text-gray-400 text-sm">
                         Verfügbar bis {{ formattedEarlyBirdDeadline }}
                     </p>
                 </div>
diff --git a/nuxt-app/components/tickets/TicketStepReview.vue b/nuxt-app/components/tickets/TicketStepReview.vue
index 1c1e8f79..b29c2d0b 100644
--- a/nuxt-app/components/tickets/TicketStepReview.vue
+++ b/nuxt-app/components/tickets/TicketStepReview.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { computed, ref, watch, onMounted } from 'vue'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { computed, onMounted, ref, watch } from 'vue'
 import TicketPricingSummary from './TicketPricingSummary.vue'
 
 const emit = defineEmits(['validityChange'])
@@ -73,7 +73,7 @@ async function proceedToPayment() {
 <template>
     <div class="ticket-step-review">
         <h2 class="mb-2 text-3xl font-bold text-white md:text-4xl">Bestellung prüfen</h2>
-        <p class="mb-8 text-lg text-gray-300">Bitte überprüfe deine Angaben vor der Zahlung.</p>
+        <p class="text-gray-300 mb-8 text-lg">Bitte überprüfe deine Angaben vor der Zahlung.</p>
 
         <!-- Attendees summary -->
         <div class="mb-6 rounded-lg border border-gray-700 bg-gray-800/50 p-6">
@@ -85,10 +85,8 @@ async function proceedToPayment() {
                     class="flex items-center justify-between border-b border-gray-700 pb-3 last:border-0 last:pb-0"
                 >
                     <div>
-                        <p class="font-medium text-white">
-                            {{ attendee.firstName }} {{ attendee.lastName }}
-                        </p>
-                        <p class="text-sm text-gray-400">{{ attendee.email }}</p>
+                        <p class="font-medium text-white">{{ attendee.firstName }} {{ attendee.lastName }}</p>
+                        <p class="text-gray-400 text-sm">{{ attendee.email }}</p>
                     </div>
                     <span class="text-sm text-[#848a98]">Ticket {{ index + 1 }}</span>
                 </div>
@@ -99,14 +97,15 @@ async function proceedToPayment() {
         <div class="mb-6 rounded-lg border border-gray-700 bg-gray-800/50 p-6">
             <h3 class="mb-4 text-lg font-bold text-white">Rechnungsadresse</h3>
 
-            <div class="space-y-2 text-gray-300">
-                <p class="font-medium text-white">
-                    {{ store.purchaser.firstName }} {{ store.purchaser.lastName }}
-                </p>
+            <div class="text-gray-300 space-y-2">
+                <p class="font-medium text-white">{{ store.purchaser.firstName }} {{ store.purchaser.lastName }}</p>
                 <p>{{ store.purchaser.email }}</p>
 
                 <!-- Company address -->
-                <div v-if="store.purchaseType === 'company' && store.company" class="mt-4 border-t border-gray-700 pt-4">
+                <div
+                    v-if="store.purchaseType === 'company' && store.company"
+                    class="mt-4 border-t border-gray-700 pt-4"
+                >
                     <p class="font-medium text-white">{{ store.company.name }}</p>
                     <p>{{ store.company.address.line1 }}</p>
                     <p v-if="store.company.address.line2">{{ store.company.address.line2 }}</p>
@@ -118,7 +117,10 @@ async function proceedToPayment() {
                 </div>
 
                 <!-- Personal address (optional) -->
-                <div v-if="store.purchaseType === 'personal' && store.showPersonalAddress && store.personalAddress" class="mt-4 border-t border-gray-700 pt-4">
+                <div
+                    v-if="store.purchaseType === 'personal' && store.showPersonalAddress && store.personalAddress"
+                    class="mt-4 border-t border-gray-700 pt-4"
+                >
                     <p v-if="store.personalAddress.line1">{{ store.personalAddress.line1 }}</p>
                     <p v-if="store.personalAddress.line2">{{ store.personalAddress.line2 }}</p>
                     <p v-if="store.personalAddress.postalCode || store.personalAddress.city">
@@ -139,18 +141,14 @@ async function proceedToPayment() {
             <h3 class="mb-3 text-sm font-bold text-white">Rabattcode</h3>
             <div v-if="store.discountValid" class="flex items-center justify-between">
                 <div>
-                    <span class="text-sm text-green-400">
+                    <span class="text-green-400 text-sm">
                         {{ store.pricingSettings?.discountLabel || store.discountCode }}
                     </span>
-                    <span class="ml-2 text-sm text-gray-400">
+                    <span class="text-gray-400 ml-2 text-sm">
                         &ndash; {{ store.formatPrice(store.discountAmountCents) }} Rabatt
                     </span>
                 </div>
-                <button
-                    type="button"
-                    class="text-sm text-gray-400 hover:text-white"
-                    @click="removeDiscountCode"
-                >
+                <button type="button" class="text-gray-400 text-sm hover:text-white" @click="removeDiscountCode">
                     Entfernen
                 </button>
             </div>
@@ -172,7 +170,7 @@ async function proceedToPayment() {
                     <span v-else>Einlösen</span>
                 </button>
             </div>
-            <p v-if="discountMessage && !store.discountValid" class="mt-2 text-sm text-red-400">
+            <p v-if="discountMessage && !store.discountValid" class="text-red-400 mt-2 text-sm">
                 {{ discountMessage }}
             </p>
         </div>
@@ -185,10 +183,12 @@ async function proceedToPayment() {
                     type="checkbox"
                     class="mt-0.5 h-4 w-4 shrink-0 rounded border-gray-600 bg-gray-800 text-lime focus:ring-lime focus:ring-offset-0"
                 />
-                <span class="text-sm text-gray-300">
+                <span class="text-gray-300 text-sm">
                     Ich akzeptiere die Hinweise zu den
-                    <a href="/verhaltensregeln" target="_blank" class="text-lime hover:underline">Verhaltensregeln</a>, den
-                    <a href="/aufnahmen" target="_blank" class="text-lime hover:underline">Foto- und Videoaufnahmen</a>, dem
+                    <a href="/verhaltensregeln" target="_blank" class="text-lime hover:underline">Verhaltensregeln</a>,
+                    den
+                    <a href="/aufnahmen" target="_blank" class="text-lime hover:underline">Foto- und Videoaufnahmen</a>,
+                    dem
                     <a href="/datenschutz" target="_blank" class="text-lime hover:underline">Datenschutz</a>
                     und die
                     <a href="/agb" target="_blank" class="text-lime hover:underline">AGB</a>.
@@ -198,7 +198,7 @@ async function proceedToPayment() {
         </div>
 
         <!-- Error message -->
-        <p v-if="paymentError" class="mb-4 rounded-lg bg-red-500/10 p-4 text-red-400">
+        <p v-if="paymentError" class="bg-red-500/10 text-red-400 mb-4 rounded-lg p-4">
             {{ paymentError }}
         </p>
 
@@ -215,12 +215,8 @@ async function proceedToPayment() {
         </button>
 
         <p class="mt-4 text-center text-sm text-[#848a98]">
-            <span v-if="store.isEmployeeCode">
-                Durch den Team-Code ist keine Zahlung nötig.
-            </span>
-            <span v-else>
-                Du wirst zur sicheren Zahlungsseite von Stripe weitergeleitet.
-            </span>
+            <span v-if="store.isEmployeeCode"> Durch den Team-Code ist keine Zahlung nötig. </span>
+            <span v-else> Du wirst zur sicheren Zahlungsseite von Stripe weitergeleitet. </span>
         </p>
     </div>
 </template>
diff --git a/nuxt-app/composables/useDirectus.ts b/nuxt-app/composables/useDirectus.ts
index f8a87bd2..dcb82792 100644
--- a/nuxt-app/composables/useDirectus.ts
+++ b/nuxt-app/composables/useDirectus.ts
@@ -1,35 +1,38 @@
 import {
-  aggregate,
-  createUser,
-  readItems,
-  readMe,
-  readProviders,
-  readSingleton,
-  rest,
-  type QueryFilter, createItem, updateItem,
-} from '@directus/sdk';
+    aggregate,
+    createItem,
+    createUser,
+    readItems,
+    readMe,
+    readProviders,
+    readSingleton,
+    rest,
+    updateItem,
+    type QueryFilter,
+} from '@directus/sdk'
 import type {
-  ConferenceItem,
-  DirectusMemberItem,
-  DirectusNewsItem,
-  DirectusPickOfTheDayItem, DirectusPodcastItem,
-  DirectusProfileItem,
-  DirectusRatingItem,
-  DirectusTagItem,
-  DirectusTranscriptItem,
-  LoginProvider,
-  MeetupItem,
-  PodcastItem,
-  PodcastPreviewItem,
-  SpeakerItem,
-  SpeakerPreviewItem,
-  TagItem,
-} from '~/types';
+    ConferenceItem,
+    DirectusMemberItem,
+    DirectusNewsItem,
+    DirectusPickOfTheDayItem,
+    DirectusPodcastItem,
+    DirectusProfileItem,
+    DirectusRatingItem,
+    DirectusTagItem,
+    DirectusTranscriptItem,
+    LoginProvider,
+    MeetupItem,
+    PodcastItem,
+    PodcastPreviewItem,
+    SpeakerItem,
+    SpeakerPreviewItem,
+    TagItem,
+} from '~/types'
 import { DIRECTUS_CMS_URL, WEBSITE_URL } from './../config'
+import { anonymizeAndHashIP } from './../helpers/'
 // This import needs to be relative/file-based
 // so that it can be resolved during the nuxt build process
 import { directus, type Collections } from './../services'
-import { anonymizeAndHashIP } from './../helpers/'
 
 const collectionWithTagsName = ['members', 'speakers', 'podcasts', 'meetups', 'picks_of_the_day'] as const
 type CollectionWithTagsName = (typeof collectionWithTagsName)[number]
@@ -51,12 +54,12 @@ export function useDirectus() {
         return await directus.request(
             readSingleton('home_page', {
                 fields: [
-                  '*',
-                  'video.*',
-                  'highlights.*',
-                  'highlights.item.*',
-                  'highlights.item.cover_image.*',
-                  'highlights.item.poster.*',
+                    '*',
+                    'video.*',
+                    'highlights.*',
+                    'highlights.item.*',
+                    'highlights.item.cover_image.*',
+                    'highlights.item.poster.*',
                 ],
             })
         )
@@ -78,13 +81,13 @@ export function useDirectus() {
         )
     }
 
-  async function getConferencePage() {
-    return await directus.request(
-      readSingleton('conference_page', {
-        fields: ['*', 'cover_image.*', 'video.*'],
-      })
-    )
-  }
+    async function getConferencePage() {
+        return await directus.request(
+            readSingleton('conference_page', {
+                fields: ['*', 'cover_image.*', 'video.*'],
+            })
+        )
+    }
 
     async function getHallOfFamePage() {
         return await directus.request(
@@ -111,11 +114,11 @@ export function useDirectus() {
     }
 
     async function getAgbPage() {
-      return await directus.request(
-        readSingleton('agb_page', {
-          fields: ['*'],
-        })
-      )
+        return await directus.request(
+            readSingleton('agb_page', {
+                fields: ['*'],
+            })
+        )
     }
 
     async function getImprintPage() {
@@ -159,11 +162,11 @@ export function useDirectus() {
     }
 
     async function getRecordingsPage() {
-      return await directus.request(
-        readSingleton('recordings_page', {
-          fields: ['*'],
-        })
-      )
+        return await directus.request(
+            readSingleton('recordings_page', {
+                fields: ['*'],
+            })
+        )
     }
 
     async function getContactPage() {
@@ -183,11 +186,11 @@ export function useDirectus() {
     }
 
     async function getCocktailMenu() {
-      return await directus.request(
-        readSingleton('cocktail_menu', {
-          fields: ['*'],
-        })
-      )
+        return await directus.request(
+            readSingleton('cocktail_menu', {
+                fields: ['*'],
+            })
+        )
     }
 
     async function getLatestPodcasts(limit: number = 10) {
@@ -393,10 +396,10 @@ export function useDirectus() {
                             ...meetup,
                             tagsPrepared: meetup.tags.map((tag: DirectusTag) => tag.tag) as TagItem[],
                             talksPrepared: meetup.talks
-                              .sort((a, b) => a.sort - b.sort)
-                              .map((talk: any) => {
-                              return talk.talk;
-                            }),
+                                .sort((a, b) => a.sort - b.sort)
+                                .map((talk: any) => {
+                                    return talk.talk
+                                }),
                             speakersPrepared: meetup.speakers.map((speaker: any) => {
                                 return {
                                     first_name: speaker.speaker.first_name,
@@ -413,123 +416,117 @@ export function useDirectus() {
             )
     }
 
-  async function getConferenceBySlug(slug: string) {
-    return await directus
-      .request(
-        readItems('conferences', {
-          fields: [
-            'id',
-            'slug',
-            'published_on',
-            'start_on',
-            'end_on',
-            'title',
-            'headline_1',
-            'text_1',
-            'cover_image.*',
-            'cover_image',
-            'video.*',
-            'video',
-            'poster',
-            'poster.*',
-            'gallery_images',
-            'gallery_images.sort',
-            'gallery_images.directus_files_id.*',
-            'agenda',
-            'talks',
-            'talks.*',
-            'talks.talk.*',
-            'talks.talk.thumbnail.*',
-            'talks.talk.video_url',
-            'talks.talk.speakers.*',
-            'talks.talk.speakers.speaker',
-            'talks.talk.speakers.speaker.*',
-            'talks.talk.members.*',
-            'talks.talk.members.member',
-            'talks.talk.members.member.*',
-            'faqs',
-            'speakers',
-            'speakers.*',
-            'speakers.speakers_id.*',
-            'speakers.speakers_id.profile_image.*',
-            'tickets_text',
-            'ticketing_enabled',
-            'ticket_early_bird_price_cents',
-            'ticket_regular_price_cents',
-            'ticket_early_bird_deadline',
-            'ticket_max_quantity',
-            'partners',
-            'partners.*',
-            'partners.partner.*',
-            'partners.partner.name',
-            'partners.partner.url',
-            'partners.partner.image.*'
-          ],
-          filter: { slug: { _eq: slug } },
-          limit: 1,
-        })
-      )
-      .then((result) => {
-        const singleResult = result.pop() as unknown as ConferenceItem | undefined
-        if (!singleResult) {
-          // Unknown slug — return null so the caller can render a 404 instead
-          // of treating a missing conference as a fatal fetch failure.
-          return null
-        }
-        const speakersPrepared = singleResult.speakers.map((speaker: any) => {
-              return {
-                first_name: speaker.speakers_id.first_name,
-                last_name: speaker.speakers_id.last_name,
-                profile_image: speaker.speakers_id.profile_image,
-                occupation: speaker.speakers_id.occupation,
-                slug: speaker.speakers_id.slug,
-                description: speaker.speakers_id.description,
-                event_image: speaker.speakers_id.event_image,
-                academic_title: speaker.speakers_id.academic_title,
-                website_url: speaker.speakers_id.website_url,
-                twitter_url: speaker.speakers_id.twitter_url,
-                bluesky_url: speaker.speakers_id.bluesky_url,
-                linkedin_url: speaker.speakers_id.linkedin_url,
-                github_url: speaker.speakers_id.github_url,
-                instagram_url: speaker.speakers_id.instagram_url,
-                youtube_url: speaker.speakers_id.youtube_url,
-              } as SpeakerPreviewItem
-          })
-
-        const talksPrepared = singleResult.talks
-          .sort((a, b) => a.sort - b.sort)
-          .map((talk: any) => {
-          return talk.talk;
-        });
-
-        const partnersPrepared = singleResult.partners
-          .sort((a, b) => a.sort - b.sort)
-          .map((partner: any) => {
-            return partner.partner;
-          });
-
-        return {
-          ...singleResult,
-          speakersPrepared,
-          talksPrepared,
-          partnersPrepared,
-        };
-      })
+    async function getConferenceBySlug(slug: string) {
+        return await directus
+            .request(
+                readItems('conferences', {
+                    fields: [
+                        'id',
+                        'slug',
+                        'published_on',
+                        'start_on',
+                        'end_on',
+                        'title',
+                        'headline_1',
+                        'text_1',
+                        'cover_image.*',
+                        'cover_image',
+                        'video.*',
+                        'video',
+                        'poster',
+                        'poster.*',
+                        'gallery_images',
+                        'gallery_images.sort',
+                        'gallery_images.directus_files_id.*',
+                        'agenda',
+                        'talks',
+                        'talks.*',
+                        'talks.talk.*',
+                        'talks.talk.thumbnail.*',
+                        'talks.talk.video_url',
+                        'talks.talk.speakers.*',
+                        'talks.talk.speakers.speaker',
+                        'talks.talk.speakers.speaker.*',
+                        'talks.talk.members.*',
+                        'talks.talk.members.member',
+                        'talks.talk.members.member.*',
+                        'faqs',
+                        'speakers',
+                        'speakers.*',
+                        'speakers.speakers_id.*',
+                        'speakers.speakers_id.profile_image.*',
+                        'tickets_text',
+                        'ticketing_enabled',
+                        'ticket_early_bird_price_cents',
+                        'ticket_regular_price_cents',
+                        'ticket_early_bird_deadline',
+                        'ticket_max_quantity',
+                        'partners',
+                        'partners.*',
+                        'partners.partner.*',
+                        'partners.partner.name',
+                        'partners.partner.url',
+                        'partners.partner.image.*',
+                    ],
+                    filter: { slug: { _eq: slug } },
+                    limit: 1,
+                })
+            )
+            .then((result) => {
+                const singleResult = result.pop() as unknown as ConferenceItem | undefined
+                if (!singleResult) {
+                    // Unknown slug — return null so the caller can render a 404 instead
+                    // of treating a missing conference as a fatal fetch failure.
+                    return null
+                }
+                const speakersPrepared = singleResult.speakers.map((speaker: any) => {
+                    return {
+                        first_name: speaker.speakers_id.first_name,
+                        last_name: speaker.speakers_id.last_name,
+                        profile_image: speaker.speakers_id.profile_image,
+                        occupation: speaker.speakers_id.occupation,
+                        slug: speaker.speakers_id.slug,
+                        description: speaker.speakers_id.description,
+                        event_image: speaker.speakers_id.event_image,
+                        academic_title: speaker.speakers_id.academic_title,
+                        website_url: speaker.speakers_id.website_url,
+                        twitter_url: speaker.speakers_id.twitter_url,
+                        bluesky_url: speaker.speakers_id.bluesky_url,
+                        linkedin_url: speaker.speakers_id.linkedin_url,
+                        github_url: speaker.speakers_id.github_url,
+                        instagram_url: speaker.speakers_id.instagram_url,
+                        youtube_url: speaker.speakers_id.youtube_url,
+                    } as SpeakerPreviewItem
+                })
+
+                const talksPrepared = singleResult.talks
+                    .sort((a, b) => a.sort - b.sort)
+                    .map((talk: any) => {
+                        return talk.talk
+                    })
+
+                const partnersPrepared = singleResult.partners
+                    .sort((a, b) => a.sort - b.sort)
+                    .map((partner: any) => {
+                        return partner.partner
+                    })
+
+                return {
+                    ...singleResult,
+                    speakersPrepared,
+                    talksPrepared,
+                    partnersPrepared,
+                }
+            })
     }
 
-  async function getTestimonials() {
-    return await directus
-      .request(
-        readItems('testimonials', {
-          fields: [
-            'id',
-            'weight',
-            'text',
-            'subtitle',
-          ],
-          limit: -1,
-        })
-      )
+    async function getTestimonials() {
+        return await directus.request(
+            readItems('testimonials', {
+                fields: ['id', 'weight', 'text', 'subtitle'],
+                limit: -1,
+            })
+        )
     }
 
     async function getSpeakerBySlug(slug: string) {
@@ -614,9 +611,9 @@ export function useDirectus() {
             aggregate('speakers', {
                 aggregate: { count: '*' },
                 query: {
-                  filter: {'listed_hof': {'_eq': true}},
-                }
-            }),
+                    filter: { listed_hof: { _eq: true } },
+                },
+            })
         )
 
         return Number(result.pop()?.count)
@@ -644,22 +641,13 @@ export function useDirectus() {
     }
 
     async function getConferences() {
-      return await directus.request(
-        readItems('conferences', {
-          fields: [
-            'id',
-            'published_on',
-            'slug',
-            'start_on',
-            'end_on',
-            'title',
-            'text_1',
-            'poster.*',
-          ],
-          sort: ['-start_on'],
-          limit: -1,
-        })
-      )
+        return await directus.request(
+            readItems('conferences', {
+                fields: ['id', 'published_on', 'slug', 'start_on', 'end_on', 'title', 'text_1', 'poster.*'],
+                sort: ['-start_on'],
+                limit: -1,
+            })
+        )
     }
 
     async function getSpeakers(limit: number = -1) {
@@ -681,65 +669,64 @@ export function useDirectus() {
                 ],
                 limit: limit,
                 sort: ['podcasts.podcast.type', 'sort', '-published_on'],
-                filter: {'listed_hof': {'_eq': true}},
+                filter: { listed_hof: { _eq: true } },
             })
         )
     }
 
-  async function getSpeakersForBuild(limit: number) {
-
-      const ctos =  await directus.request(
-        readItems('speakers', {
-          fields: [
-            'id',
-            'slug',
-            'published_on',
-            'academic_title',
-            'first_name',
-            'last_name',
-            'occupation',
-            'description',
-            'profile_image.*',
-            'tags.tag.id',
-            'tags.tag.name',
-            'podcasts.podcast.type',
-          ],
-          limit: Math.round(limit/2),
-          sort: ['sort', '-published_on'],
-          filter: {
-            listed_hof: { _eq: true },
-            podcasts: { podcast: { type: { _eq: 'cto_special' } } },
-          },
-        })
-      )
-
-    const others =  await directus.request(
-      readItems('speakers', {
-        fields: [
-          'id',
-          'slug',
-          'published_on',
-          'academic_title',
-          'first_name',
-          'last_name',
-          'occupation',
-          'description',
-          'profile_image.*',
-          'tags.tag.id',
-          'tags.tag.name',
-          'podcasts.podcast.type',
-        ],
-        limit: Math.round(limit/2),
-        sort: ['sort', '-published_on'],
-        filter: {
-          listed_hof: { _eq: true },
-          podcasts: { podcast: { type: { _neq: 'cto_special' } } },
-        },
-      })
-    )
-
-    return [...ctos, ...others]
-  }
+    async function getSpeakersForBuild(limit: number) {
+        const ctos = await directus.request(
+            readItems('speakers', {
+                fields: [
+                    'id',
+                    'slug',
+                    'published_on',
+                    'academic_title',
+                    'first_name',
+                    'last_name',
+                    'occupation',
+                    'description',
+                    'profile_image.*',
+                    'tags.tag.id',
+                    'tags.tag.name',
+                    'podcasts.podcast.type',
+                ],
+                limit: Math.round(limit / 2),
+                sort: ['sort', '-published_on'],
+                filter: {
+                    listed_hof: { _eq: true },
+                    podcasts: { podcast: { type: { _eq: 'cto_special' } } },
+                },
+            })
+        )
+
+        const others = await directus.request(
+            readItems('speakers', {
+                fields: [
+                    'id',
+                    'slug',
+                    'published_on',
+                    'academic_title',
+                    'first_name',
+                    'last_name',
+                    'occupation',
+                    'description',
+                    'profile_image.*',
+                    'tags.tag.id',
+                    'tags.tag.name',
+                    'podcasts.podcast.type',
+                ],
+                limit: Math.round(limit / 2),
+                sort: ['sort', '-published_on'],
+                filter: {
+                    listed_hof: { _eq: true },
+                    podcasts: { podcast: { type: { _neq: 'cto_special' } } },
+                },
+            })
+        )
+
+        return [...ctos, ...others]
+    }
 
     async function getAllTopTags() {
         const allTags: Tag[] = []
@@ -807,7 +794,7 @@ export function useDirectus() {
                     'website_url',
                 ],
                 filter,
-                sort: ['sort']
+                sort: ['sort'],
             })
         )
     }
@@ -844,46 +831,42 @@ export function useDirectus() {
             )
     }
 
-  async function getProfileById(id: string) {
-    return (await directus
-      .request(
-        readItems('profiles', {
-          fields: [
-            'id',
-            'first_name',
-            'last_name',
-            'display_name',
-            'description',
-            'job_role',
-            'job_employer',
-            'profile_image.*'
-          ],
-          limit: 1,
-          filter: { id: { _eq: id } },
-        })
-      ))?.pop() as unknown as DirectusProfileItem
-  }
-
-  async function getTranscriptForPodcast(podcast: PodcastItem) {
-    return (await directus
-      .request(
-        readItems('transcripts', {
-          fields: [
-            'id',
-            'service',
-            'supported_features',
-            'speakers',
-            'raw_response',
-          ],
-          filter: {
-            podcast : { id: { _eq: podcast.id} }
-          },
-          sort: ['-date_updated']
-        })
-      ))?.pop() as unknown as DirectusTranscriptItem
-  }
+    async function getProfileById(id: string) {
+        return (
+            await directus.request(
+                readItems('profiles', {
+                    fields: [
+                        'id',
+                        'first_name',
+                        'last_name',
+                        'display_name',
+                        'description',
+                        'job_role',
+                        'job_employer',
+                        'profile_image.*',
+                    ],
+                    limit: 1,
+                    filter: { id: { _eq: id } },
+                })
+            )
+        )?.pop() as unknown as DirectusProfileItem
+    }
 
-  async function getSingleSignOnProviders() {
+    async function getTranscriptForPodcast(podcast: PodcastItem) {
+        return (
+            await directus.request(
+                readItems('transcripts', {
+                    fields: ['id', 'service', 'supported_features', 'speakers', 'raw_response'],
+                    filter: {
+                        podcast: { id: { _eq: podcast.id } },
+                    },
+                    sort: ['-date_updated'],
+                })
+            )
+        )?.pop() as unknown as DirectusTranscriptItem
+    }
+
+    async function getSingleSignOnProviders() {
         const directusProviders = await directus.request(readProviders())
 
         const providers = directusProviders.map((directusProvider): LoginProvider => {
@@ -924,39 +907,39 @@ export function useDirectus() {
         }
     }
 
-  async function createRating(vote: "up" | "down", podcast: DirectusPodcastItem, metadata?: Record<string, string>) {
-    const payload: Pick<DirectusRatingItem, "up_or_down" | "target" | "referer_url" | "ip" | "user_agent"> = {
-      up_or_down: vote,
-      target: [
-        {
-          target_collection: 'podcasts',
-          target: podcast.id
+    async function createRating(vote: 'up' | 'down', podcast: DirectusPodcastItem, metadata?: Record<string, string>) {
+        const payload: Pick<DirectusRatingItem, 'up_or_down' | 'target' | 'referer_url' | 'ip' | 'user_agent'> = {
+            up_or_down: vote,
+            target: [
+                {
+                    target_collection: 'podcasts',
+                    target: podcast.id,
+                },
+            ],
         }
-      ],
-    }
 
-    if (metadata?.ip) {
-      const hashedIP = await anonymizeAndHashIP(metadata.ip)
-      if (hashedIP) {
-        payload.ip = hashedIP
-      }
-    }
+        if (metadata?.ip) {
+            const hashedIP = await anonymizeAndHashIP(metadata.ip)
+            if (hashedIP) {
+                payload.ip = hashedIP
+            }
+        }
 
-    if (metadata?.user_agent) {
-      // Remove all numbers to anonymize user agent
-      payload.user_agent = metadata.user_agent.replace(/\d+/g, '')
-    }
+        if (metadata?.user_agent) {
+            // Remove all numbers to anonymize user agent
+            payload.user_agent = metadata.user_agent.replace(/\d+/g, '')
+        }
 
-    if (metadata?.referer_url) {
-      payload.referer_url = metadata.referer_url
-    }
+        if (metadata?.referer_url) {
+            payload.referer_url = metadata.referer_url
+        }
 
-    return await directus.request(createItem('ratings', payload))
-  }
+        return await directus.request(createItem('ratings', payload))
+    }
 
-  async function addCommentToRating(rating: {id: string}, comment: string) {
-    return await directus.request(updateItem('ratings', rating.id, { comment }));
-  }
+    async function addCommentToRating(rating: { id: string }, comment: string) {
+        return await directus.request(updateItem('ratings', rating.id, { comment }))
+    }
 
     // `news` is a meta collection whose content lives on the m2a `target`
     // (currently only `news_links`), so the source item is expanded alongside
diff --git a/nuxt-app/composables/useFlashMessage.ts b/nuxt-app/composables/useFlashMessage.ts
index 44f5a920..98023c13 100644
--- a/nuxt-app/composables/useFlashMessage.ts
+++ b/nuxt-app/composables/useFlashMessage.ts
@@ -1,37 +1,37 @@
 export interface FlashMessage {
-  type: "rating" | "rating-error"
-  text: string
-  payload: any
+    type: 'rating' | 'rating-error'
+    text: string
+    payload: any
 }
 
 export const useFlashMessage = () => {
-  const flashCookie = useCookie<FlashMessage | null>('flash-message');
-  const message = useState<FlashMessage | null>('flash-message', () => {
-    const cookieValue = flashCookie.value;
-    // Clear the cookie immediately after reading it so it only shows once
-    if (cookieValue) {
-      flashCookie.value = null;
-    }
-    return cookieValue;
-  });
+    const flashCookie = useCookie<FlashMessage | null>('flash-message')
+    const message = useState<FlashMessage | null>('flash-message', () => {
+        const cookieValue = flashCookie.value
+        // Clear the cookie immediately after reading it so it only shows once
+        if (cookieValue) {
+            flashCookie.value = null
+        }
+        return cookieValue
+    })
 
-  // `Record<string, unknown>`, not `{}` — the latter accepts any non-nullish value, including `0`
-  // and `""`, which is not what "payload" means here.
-  const setMessage = (text: string, type: "rating", payload: Record<string, unknown>) => {
-    message.value = {
-      text,
-      type,
-      payload
-    };
-  };
+    // `Record<string, unknown>`, not `{}` — the latter accepts any non-nullish value, including `0`
+    // and `""`, which is not what "payload" means here.
+    const setMessage = (text: string, type: 'rating', payload: Record<string, unknown>) => {
+        message.value = {
+            text,
+            type,
+            payload,
+        }
+    }
 
-  const clearMessage = () => {
-    message.value = null;
-  };
+    const clearMessage = () => {
+        message.value = null
+    }
 
-  return {
-    message,
-    setMessage,
-    clearMessage,
-  };
-};
+    return {
+        message,
+        setMessage,
+        clearMessage,
+    }
+}
diff --git a/nuxt-app/composables/usePodcastPlayer.ts b/nuxt-app/composables/usePodcastPlayer.ts
index c1d7d5ca..e4d1e635 100644
--- a/nuxt-app/composables/usePodcastPlayer.ts
+++ b/nuxt-app/composables/usePodcastPlayer.ts
@@ -2,11 +2,7 @@ import { onMounted, reactive, ref, shallowRef, toRefs, watch } from 'vue'
 import { PAUSE_PODCAST_EVENT_ID, PLAY_PODCAST_EVENT_ID } from '../config'
 import { trackGoal } from '../helpers'
 import type { PodcastItem } from '../types'
-import {
-    createAudioElementSource,
-    type MediaSource,
-    type SourceCallbacks,
-} from './useMediaSource'
+import { createAudioElementSource, type MediaSource, type SourceCallbacks } from './useMediaSource'
 
 type PodcastBasics = Pick<PodcastItem, 'id' | 'slug' | 'type' | 'number' | 'title' | 'audio_url'>
 
diff --git a/nuxt-app/composables/useTicketCheckoutStore.ts b/nuxt-app/composables/useTicketCheckoutStore.ts
index a0365574..12ae117d 100644
--- a/nuxt-app/composables/useTicketCheckoutStore.ts
+++ b/nuxt-app/composables/useTicketCheckoutStore.ts
@@ -1,7 +1,7 @@
-import { defineStore } from 'pinia'
 import { VAT_RATE } from '~/config'
-import type { TicketAttendee, CompanyBillingInfo, BillingAddress, Purchaser } from '~/types/items'
 import type { PurchaseType, TicketType } from '~/types/directus'
+import type { BillingAddress, CompanyBillingInfo, Purchaser, TicketAttendee } from '~/types/items'
+import { defineStore } from 'pinia'
 
 interface TicketPricingSettings {
     earlyBirdPriceCents: number | null
@@ -160,7 +160,11 @@ export const useTicketCheckoutStore = defineStore('ticketCheckout', {
             if (this.isEmployeeCode) {
                 return 0
             }
-            if (this.discountValid && this.pricingSettings?.discountPriceCents !== null && this.pricingSettings?.discountPriceCents !== undefined) {
+            if (
+                this.discountValid &&
+                this.pricingSettings?.discountPriceCents !== null &&
+                this.pricingSettings?.discountPriceCents !== undefined
+            ) {
                 return this.pricingSettings.discountPriceCents
             }
             return this.basePriceCents
@@ -247,11 +251,16 @@ export const useTicketCheckoutStore = defineStore('ticketCheckout', {
         /**
          * Set pricing settings from conference data
          */
-        setPricingSettings(settings: {
-            ticket_early_bird_price_cents: number | null
-            ticket_regular_price_cents: number | null
-            ticket_early_bird_deadline: string | null
-        } | null | undefined) {
+        setPricingSettings(
+            settings:
+                | {
+                      ticket_early_bird_price_cents: number | null
+                      ticket_regular_price_cents: number | null
+                      ticket_early_bird_deadline: string | null
+                  }
+                | null
+                | undefined
+        ) {
             if (!settings || settings.ticket_regular_price_cents === null) {
                 this.pricingError = true
                 this.error = 'Preise konnten nicht geladen werden. Bitte versuche es später erneut.'
@@ -475,7 +484,12 @@ export const useTicketCheckoutStore = defineStore('ticketCheckout', {
                     },
                 })
 
-                const result = response as { valid: boolean; discountPriceCents?: number; discountLabel?: string; isEmployeeCode?: boolean }
+                const result = response as {
+                    valid: boolean
+                    discountPriceCents?: number
+                    discountLabel?: string
+                    isEmployeeCode?: boolean
+                }
                 this.discountValid = result.valid
 
                 if (result.valid && this.pricingSettings) {
diff --git a/nuxt-app/composables/useVideoConsent.ts b/nuxt-app/composables/useVideoConsent.ts
index ba069da9..a0da0e47 100644
--- a/nuxt-app/composables/useVideoConsent.ts
+++ b/nuxt-app/composables/useVideoConsent.ts
@@ -1,4 +1,4 @@
-import { ref, onMounted } from 'vue'
+import { onMounted, ref } from 'vue'
 import { getCookie, setCookie } from '../helpers'
 
 const COOKIE_NAME = 'youtube_consent'
@@ -6,16 +6,16 @@ const COOKIE_NAME = 'youtube_consent'
 const hasConsented = ref(false)
 
 export function useVideoConsent() {
-  onMounted(() => {
-    hasConsented.value = getCookie(COOKIE_NAME) === 'true'
-  })
+    onMounted(() => {
+        hasConsented.value = getCookie(COOKIE_NAME) === 'true'
+    })
 
-  const grantConsent = (remember: boolean) => {
-    hasConsented.value = true
-    if (remember) {
-      setCookie(COOKIE_NAME, 'true', 365)
+    const grantConsent = (remember: boolean) => {
+        hasConsented.value = true
+        if (remember) {
+            setCookie(COOKIE_NAME, 'true', 365)
+        }
     }
-  }
 
-  return { hasConsented, grantConsent }
+    return { hasConsented, grantConsent }
 }
diff --git a/nuxt-app/composables/useWeightedRandomSelection.ts b/nuxt-app/composables/useWeightedRandomSelection.ts
index 007bd9cd..55ed53af 100644
--- a/nuxt-app/composables/useWeightedRandomSelection.ts
+++ b/nuxt-app/composables/useWeightedRandomSelection.ts
@@ -5,8 +5,8 @@ import type { DirectusTestimonialItem } from '~/types'
  * Returns a pseudo-random number between 0 and 1 based on the seed
  */
 function seededRandom(seed: number): number {
-  const x = Math.sin(seed) * 10000
-  return x - Math.floor(x)
+    const x = Math.sin(seed) * 10000
+    return x - Math.floor(x)
 }
 
 /**
@@ -14,7 +14,7 @@ function seededRandom(seed: number): number {
  * This ensures the same testimonials are shown for all users within the same hour
  */
 function getHourlySeed(): number {
-  return Math.floor(Date.now() / (1000 * 60 * 60))
+    return Math.floor(Date.now() / (1000 * 60 * 60))
 }
 
 /**
@@ -22,49 +22,49 @@ function getHourlySeed(): number {
  * Higher weight = more likely to be selected
  */
 export function useWeightedRandomSelection() {
-  const selectTestimonials = (
-    testimonials: DirectusTestimonialItem[],
-    maxCount: number = 5
-  ): DirectusTestimonialItem[] => {
-    if (!testimonials || testimonials.length <= maxCount) {
-      return testimonials || []
-    }
+    const selectTestimonials = (
+        testimonials: DirectusTestimonialItem[],
+        maxCount: number = 5
+    ): DirectusTestimonialItem[] => {
+        if (!testimonials || testimonials.length <= maxCount) {
+            return testimonials || []
+        }
 
-    const seed = getHourlySeed()
-    
-    // Create weighted pool where each testimonial appears based on its weight
-    const weightedPool: DirectusTestimonialItem[] = []
-    testimonials.forEach(testimonial => {
-      const weight = testimonial.weight || 5 // Default weight of 5
-      for (let i = 0; i < weight; i++) {
-        weightedPool.push(testimonial)
-      }
-    })
+        const seed = getHourlySeed()
 
-    const selected: DirectusTestimonialItem[] = []
-    const usedIds = new Set<string>()
+        // Create weighted pool where each testimonial appears based on its weight
+        const weightedPool: DirectusTestimonialItem[] = []
+        testimonials.forEach((testimonial) => {
+            const weight = testimonial.weight || 5 // Default weight of 5
+            for (let i = 0; i < weight; i++) {
+                weightedPool.push(testimonial)
+            }
+        })
 
-    // Select unique testimonials using seeded randomness
-    for (let i = 0; i < maxCount; i++) {
-      let attempts = 0
-      let selectedTestimonial: DirectusTestimonialItem
-      
-      do {
-        const randomIndex = Math.floor(seededRandom(seed + i + attempts) * weightedPool.length)
-        selectedTestimonial = weightedPool[randomIndex]
-        attempts++
-      } while (usedIds.has(selectedTestimonial.id) && attempts < 100)
-      
-      if (!usedIds.has(selectedTestimonial.id)) {
-        selected.push(selectedTestimonial)
-        usedIds.add(selectedTestimonial.id)
-      }
-    }
+        const selected: DirectusTestimonialItem[] = []
+        const usedIds = new Set<string>()
+
+        // Select unique testimonials using seeded randomness
+        for (let i = 0; i < maxCount; i++) {
+            let attempts = 0
+            let selectedTestimonial: DirectusTestimonialItem
+
+            do {
+                const randomIndex = Math.floor(seededRandom(seed + i + attempts) * weightedPool.length)
+                selectedTestimonial = weightedPool[randomIndex]
+                attempts++
+            } while (usedIds.has(selectedTestimonial.id) && attempts < 100)
 
-    return selected
-  }
+            if (!usedIds.has(selectedTestimonial.id)) {
+                selected.push(selectedTestimonial)
+                usedIds.add(selectedTestimonial.id)
+            }
+        }
 
-  return {
-    selectTestimonials
-  }
-}
\ No newline at end of file
+        return selected
+    }
+
+    return {
+        selectTestimonials,
+    }
+}
diff --git a/nuxt-app/helpers/aiSpamFilter.ts b/nuxt-app/helpers/aiSpamFilter.ts
index 017ee71b..09f7104b 100644
--- a/nuxt-app/helpers/aiSpamFilter.ts
+++ b/nuxt-app/helpers/aiSpamFilter.ts
@@ -1,19 +1,14 @@
-import { GoogleGenerativeAI } from '@google/generative-ai';
+import { GoogleGenerativeAI } from '@google/generative-ai'
 import { z } from 'zod'
 
 export const ResponseSchema = z.object({
-  confidenceScore: z
-    .number()
-    .min(0, )
-    .max(1, ),
-  isSpam: z
-    .boolean(),
-  reason: z
-    .string(),
+    confidenceScore: z.number().min(0).max(1),
+    isSpam: z.boolean(),
+    reason: z.string(),
 })
 
 function getValidationPrompt(name: string, email: string, message: string): string {
-  return `
+    return `
     You are an advanced AI security expert tasked with validating a website's contact form submission.
     Your goal is to distinguish between genuine inquiries and spam, gibberish, or bot-like messages.
 
@@ -36,44 +31,47 @@ function getValidationPrompt(name: string, email: string, message: string): stri
     - "isSpam": Must be true if it is spam, otherwise false.
     - "reason": A brief, one-sentence explanation for your decision.
     - "confidenceScore": A value between 0.0 (definitely not spam) and 1.0 (definitely spam).
-  `;
+  `
 }
 
 const FAIL_OPEN_RESULT = {
-  isSpam: false,
-  reason: 'AI validation unavailable; message allowed through.',
-  confidenceScore: 0,
+    isSpam: false,
+    reason: 'AI validation unavailable; message allowed through.',
+    confidenceScore: 0,
 }
 
-export async function filterSpam(input: { name: string, email: string, message: string }): Promise<{
-  isSpam: boolean,
-  reason: string,
-  confidenceScore: number
+export async function filterSpam(input: { name: string; email: string; message: string }): Promise<{
+    isSpam: boolean
+    reason: string
+    confidenceScore: number
 }> {
-  const { name, email, message } = input;
+    const { name, email, message } = input
 
-  const apiKey = useRuntimeConfig().geminiApiKey
-  if (!apiKey) {
-    console.error('Gemini API key (NUXT_GEMINI_API_KEY) is not configured.');
-    return FAIL_OPEN_RESULT
-  }
+    const apiKey = useRuntimeConfig().geminiApiKey
+    if (!apiKey) {
+        console.error('Gemini API key (NUXT_GEMINI_API_KEY) is not configured.')
+        return FAIL_OPEN_RESULT
+    }
 
-  try {
-    const genAI = new GoogleGenerativeAI(apiKey);
-    const model = genAI.getGenerativeModel({ model: 'gemini-3-flash-preview' });
+    try {
+        const genAI = new GoogleGenerativeAI(apiKey)
+        const model = genAI.getGenerativeModel({ model: 'gemini-3-flash-preview' })
 
-    const prompt = getValidationPrompt(name, email, message);
-    const result = await model.generateContent(prompt);
-    const responseText = result.response.text();
+        const prompt = getValidationPrompt(name, email, message)
+        const result = await model.generateContent(prompt)
+        const responseText = result.response.text()
 
-    const jsonString = responseText.replace(/```json/g, '').replace(/```/g, '').trim();
-    const validation = ResponseSchema.parse(JSON.parse(jsonString));
+        const jsonString = responseText
+            .replace(/```json/g, '')
+            .replace(/```/g, '')
+            .trim()
+        const validation = ResponseSchema.parse(JSON.parse(jsonString))
 
-    console.log('Gemini Validation: isSpam=%s, confidenceScore=%s', validation.isSpam, validation.confidenceScore);
+        console.log('Gemini Validation: isSpam=%s, confidenceScore=%s', validation.isSpam, validation.confidenceScore)
 
-    return validation;
-  } catch (error) {
-    console.error('Error during Gemini validation or processing:', error);
-    return FAIL_OPEN_RESULT
-  }
+        return validation
+    } catch (error) {
+        console.error('Error during Gemini validation or processing:', error)
+        return FAIL_OPEN_RESULT
+    }
 }
diff --git a/nuxt-app/helpers/buildSpeakerNamesForTalk.ts b/nuxt-app/helpers/buildSpeakerNamesForTalk.ts
index 24ce1b7c..c6710147 100644
--- a/nuxt-app/helpers/buildSpeakerNamesForTalk.ts
+++ b/nuxt-app/helpers/buildSpeakerNamesForTalk.ts
@@ -1,22 +1,22 @@
-import type { TalkItem } from '~/types';
-import { getFullSpeakerName } from 'shared-code';
+import type { TalkItem } from '~/types'
+import { getFullSpeakerName } from 'shared-code'
 
-export const buildSpeakerNamesForTalk = function(talk: TalkItem): string {
-  const result = 'mit ';
+export const buildSpeakerNamesForTalk = function (talk: TalkItem): string {
+    const result = 'mit '
 
-  const speakers: string[] = [];
+    const speakers: string[] = []
 
-  talk.speakers.forEach((speaker) => {
-    speakers.push(getFullSpeakerName(speaker.speaker));
-  });
+    talk.speakers.forEach((speaker) => {
+        speakers.push(getFullSpeakerName(speaker.speaker))
+    })
 
-  talk.members.forEach((member) => {
-    speakers.push(`${member.member.first_name} ${member.member.last_name}`);
-  });
+    talk.members.forEach((member) => {
+        speakers.push(`${member.member.first_name} ${member.member.last_name}`)
+    })
 
-  if (speakers.length === 0) {
-    return '';
-  }
+    if (speakers.length === 0) {
+        return ''
+    }
 
-  return result + speakers.join(' & ');
-};
+    return result + speakers.join(' & ')
+}
diff --git a/nuxt-app/helpers/detectOS.ts b/nuxt-app/helpers/detectOS.ts
index a6d19c3f..8c9b9c44 100644
--- a/nuxt-app/helpers/detectOS.ts
+++ b/nuxt-app/helpers/detectOS.ts
@@ -1,36 +1,35 @@
-export type OS =
-  | 'iOS' | 'Android' | 'macOS' | 'Windows' | 'Linux' | 'ChromeOS' | 'Unknown';
+export type OS = 'iOS' | 'Android' | 'macOS' | 'Windows' | 'Linux' | 'ChromeOS' | 'Unknown'
 
 export function getOS(userAgent: string): OS {
-  if (!userAgent) {
-    return 'Unknown';
-  }
+    if (!userAgent) {
+        return 'Unknown'
+    }
 
-  const ua = userAgent.toLowerCase();
+    const ua = userAgent.toLowerCase()
 
-  if (/iphone|ipad|ipod/.test(ua)) {
-    return 'iOS';
-  }
+    if (/iphone|ipad|ipod/.test(ua)) {
+        return 'iOS'
+    }
 
-  if (/android/.test(ua)) {
-    return 'Android';
-  }
+    if (/android/.test(ua)) {
+        return 'Android'
+    }
 
-  if (/macintosh|mac os x/.test(ua)) {
-    return 'macOS';
-  }
+    if (/macintosh|mac os x/.test(ua)) {
+        return 'macOS'
+    }
 
-  if (/windows/.test(ua)) {
-    return 'Windows';
-  }
+    if (/windows/.test(ua)) {
+        return 'Windows'
+    }
 
-  if (/cros/.test(ua)) {
-    return 'ChromeOS';
-  }
+    if (/cros/.test(ua)) {
+        return 'ChromeOS'
+    }
 
-  if (/linux/.test(ua)) {
-    return 'Linux';
-  }
+    if (/linux/.test(ua)) {
+        return 'Linux'
+    }
 
-  return 'Unknown';
+    return 'Unknown'
 }
diff --git a/nuxt-app/helpers/getAssetUrl.ts b/nuxt-app/helpers/getAssetUrl.ts
index c2789aa6..b52da362 100644
--- a/nuxt-app/helpers/getAssetUrl.ts
+++ b/nuxt-app/helpers/getAssetUrl.ts
@@ -1,4 +1,4 @@
-import { DIRECTUS_CMS_URL } from './../config';
+import { DIRECTUS_CMS_URL } from './../config'
 
 /**
  * Helper function to build the URL of an asset from Directus CMS.
@@ -8,22 +8,24 @@ import { DIRECTUS_CMS_URL } from './../config';
  *
  * @returns The full URL to the asset.
  */
-export function getAssetUrl(file?: { id: string } | string | null, options?: {queryParams: Record<string, string | number | boolean>}): string {
+export function getAssetUrl(
+    file?: { id: string } | string | null,
+    options?: { queryParams: Record<string, string | number | boolean> }
+): string {
+    if (!file) return ''
 
-  if (!file) return '';
+    const id = typeof file === 'string' ? file : file.id
 
-  const id = typeof file === 'string' ? file : file.id;
+    let url = `${DIRECTUS_CMS_URL}/assets/${id}`
 
-  let url = `${DIRECTUS_CMS_URL}/assets/${id}`;
-
-  if (options?.queryParams) {
-    // Convert all values to strings for URLSearchParams
-    const stringifiedParams: Record<string, string> = {};
-    for (const [key, value] of Object.entries(options.queryParams)) {
-      stringifiedParams[key] = String(value);
+    if (options?.queryParams) {
+        // Convert all values to strings for URLSearchParams
+        const stringifiedParams: Record<string, string> = {}
+        for (const [key, value] of Object.entries(options.queryParams)) {
+            stringifiedParams[key] = String(value)
+        }
+        url = `${url}?${new URLSearchParams(stringifiedParams).toString()}`
     }
-    url = `${url}?${(new URLSearchParams(stringifiedParams)).toString()}`;
-  }
 
-  return url;
+    return url
 }
diff --git a/nuxt-app/helpers/getMetaInfo.ts b/nuxt-app/helpers/getMetaInfo.ts
index 54d3a871..9a2247ec 100644
--- a/nuxt-app/helpers/getMetaInfo.ts
+++ b/nuxt-app/helpers/getMetaInfo.ts
@@ -1,8 +1,8 @@
 import type { MetaInfo } from 'vue-meta/types/vue-meta'
 import { BUZZSPROUT_TRACKING_URL, DIRECTUS_CMS_URL, TWITTER_HANDLE, WEBSITE_NAME, WEBSITE_URL } from '../config'
 import type { FileItem } from '../types'
+import { getAssetUrl } from './getAssetUrl'
 import { getTrimmedString } from './getTrimmedString'
-import { getAssetUrl } from './getAssetUrl';
 
 interface Data {
     type: 'website' | 'podcast' | 'profile' | 'article'
@@ -123,12 +123,12 @@ export function getMetaInfo({
         const imageWidth = widthIsSmaller ? Math.round((image.width / image.height) * imageMinSize) : imageMinSize
         const imageHeight = !widthIsSmaller ? Math.round((image.height / image.width) * imageMinSize) : imageMinSize
         const imageUrl = getAssetUrl(image, {
-          queryParams: {
-            width: imageWidth,
-            height: imageHeight,
-            fit: 'cover',
-            quality: '70'
-          }
+            queryParams: {
+                width: imageWidth,
+                height: imageHeight,
+                fit: 'cover',
+                quality: '70',
+            },
         })
         metaInfo.meta = metaInfo.meta?.concat([
             // Open Graph protocol
diff --git a/nuxt-app/helpers/ipProcessing.ts b/nuxt-app/helpers/ipProcessing.ts
index 7b0aa2b5..48d02791 100644
--- a/nuxt-app/helpers/ipProcessing.ts
+++ b/nuxt-app/helpers/ipProcessing.ts
@@ -3,28 +3,31 @@
  * Handles ::1, ::ffff:x.x.x.x, and other compressed forms.
  */
 function expandIPv6(ip: string): string {
-  // Handle IPv4-mapped IPv6 (e.g. ::ffff:192.168.1.1)
-  const v4Mapped = ip.match(/^(.*)::ffff:(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})$/i)
-  if (v4Mapped) {
-    // Convert the IPv4 part to two IPv6 groups
-    const v4Parts = v4Mapped[2].split('.').map(Number)
-    const group7 = ((v4Parts[0] << 8) | v4Parts[1]).toString(16)
-    const group8 = ((v4Parts[2] << 8) | v4Parts[3]).toString(16)
-    ip = `${v4Mapped[1] || '0:0:0:0:0'}:ffff:${group7}:${group8}`
-  }
+    // Handle IPv4-mapped IPv6 (e.g. ::ffff:192.168.1.1)
+    const v4Mapped = ip.match(/^(.*)::ffff:(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})$/i)
+    if (v4Mapped) {
+        // Convert the IPv4 part to two IPv6 groups
+        const v4Parts = v4Mapped[2].split('.').map(Number)
+        const group7 = ((v4Parts[0] << 8) | v4Parts[1]).toString(16)
+        const group8 = ((v4Parts[2] << 8) | v4Parts[3]).toString(16)
+        ip = `${v4Mapped[1] || '0:0:0:0:0'}:ffff:${group7}:${group8}`
+    }
 
-  // Expand :: into the correct number of zero groups
-  if (ip.includes('::')) {
-    const [left, right] = ip.split('::')
-    const leftGroups = left ? left.split(':') : []
-    const rightGroups = right ? right.split(':') : []
-    const missing = 8 - leftGroups.length - rightGroups.length
-    const zeroGroups = Array(missing).fill('0000')
-    const allGroups = [...leftGroups, ...zeroGroups, ...rightGroups]
-    return allGroups.map(g => g.padStart(4, '0')).join(':')
-  }
+    // Expand :: into the correct number of zero groups
+    if (ip.includes('::')) {
+        const [left, right] = ip.split('::')
+        const leftGroups = left ? left.split(':') : []
+        const rightGroups = right ? right.split(':') : []
+        const missing = 8 - leftGroups.length - rightGroups.length
+        const zeroGroups = Array(missing).fill('0000')
+        const allGroups = [...leftGroups, ...zeroGroups, ...rightGroups]
+        return allGroups.map((g) => g.padStart(4, '0')).join(':')
+    }
 
-  return ip.split(':').map(g => g.padStart(4, '0')).join(':')
+    return ip
+        .split(':')
+        .map((g) => g.padStart(4, '0'))
+        .join(':')
 }
 
 /**
@@ -33,32 +36,32 @@ function expandIPv6(ip: string): string {
  * Uses dynamic imports for node:crypto and node:net to avoid client bundle errors.
  */
 async function anonymizeAndHashIP(rawIP: string): Promise<string | undefined> {
-  const { createHash } = await import('node:crypto')
-  const { isIPv4, isIPv6 } = await import('node:net')
+    const { createHash } = await import('node:crypto')
+    const { isIPv4, isIPv6 } = await import('node:net')
 
-  const trimmed = rawIP.trim()
+    const trimmed = rawIP.trim()
 
-  if (isIPv4(trimmed)) {
-    // Anonymize IPv4: zero last 2 octets
-    const parts = trimmed.split('.')
-    parts[2] = '0'
-    parts[3] = '0'
-    const anonymized = parts.join('.')
-    return createHash('sha256').update(anonymized).digest('hex')
-  }
+    if (isIPv4(trimmed)) {
+        // Anonymize IPv4: zero last 2 octets
+        const parts = trimmed.split('.')
+        parts[2] = '0'
+        parts[3] = '0'
+        const anonymized = parts.join('.')
+        return createHash('sha256').update(anonymized).digest('hex')
+    }
 
-  if (isIPv6(trimmed)) {
-    // Expand to full form, then zero last 4 groups
-    const expanded = expandIPv6(trimmed)
-    const groups = expanded.split(':')
-    for (let i = 4; i < 8; i++) {
-      groups[i] = '0000'
+    if (isIPv6(trimmed)) {
+        // Expand to full form, then zero last 4 groups
+        const expanded = expandIPv6(trimmed)
+        const groups = expanded.split(':')
+        for (let i = 4; i < 8; i++) {
+            groups[i] = '0000'
+        }
+        const anonymized = groups.join(':')
+        return createHash('sha256').update(anonymized).digest('hex')
     }
-    const anonymized = groups.join(':')
-    return createHash('sha256').update(anonymized).digest('hex')
-  }
 
-  return undefined
+    return undefined
 }
 
-export { anonymizeAndHashIP };
+export { anonymizeAndHashIP }
diff --git a/nuxt-app/helpers/jsonLdGenerator.ts b/nuxt-app/helpers/jsonLdGenerator.ts
index 199f2966..6db18441 100644
--- a/nuxt-app/helpers/jsonLdGenerator.ts
+++ b/nuxt-app/helpers/jsonLdGenerator.ts
@@ -1,9 +1,9 @@
 import { BUZZSPROUT_RSS_FEED_URL, DIRECTUS_CMS_URL } from '~/config'
-import type { DirectusProfileItem, MemberItem, PodcastItem, SpeakerItem } from '~/types';
+import type { DirectusProfileItem, MemberItem, PodcastItem, SpeakerItem } from '~/types'
 import type { JsonLD } from 'nuxt-jsonld/dist/types/index.d'
 import type { Person, PodcastEpisode, PodcastSeries, WithContext } from 'schema-dts'
 import { getPodcastType } from 'shared-code'
-import { getAssetUrl } from './getAssetUrl';
+import { getAssetUrl } from './getAssetUrl'
 
 function generatePodcastUrl(podcast: PodcastItem): string {
     return `${DIRECTUS_CMS_URL}/podcast/${podcast.slug}`
@@ -85,27 +85,26 @@ function generatePodcastEpisodeFromPodcast(podcast?: PodcastItem): JsonLD | null
 }
 
 function generateProfile(profile?: DirectusProfileItem): JsonLD {
+    if (!profile) return null
 
-  if (!profile) return null
-
-  const profileSchema: WithContext<Person> = {
-    '@context': 'https://schema.org',
-    '@type': 'Person',
-    givenName: profile.first_name,
-    familyName: profile.last_name,
-    jobTitle: profile.job_role,
-    alternateName: profile.display_name,
-    image: getAssetUrl(profile.profile_image),
-  }
+    const profileSchema: WithContext<Person> = {
+        '@context': 'https://schema.org',
+        '@type': 'Person',
+        givenName: profile.first_name,
+        familyName: profile.last_name,
+        jobTitle: profile.job_role,
+        alternateName: profile.display_name,
+        image: getAssetUrl(profile.profile_image),
+    }
 
-  if (profile.job_employer) {
-    profileSchema.worksFor = {
-      '@type': 'Organization',
-      'name': profile.job_employer
+    if (profile.job_employer) {
+        profileSchema.worksFor = {
+            '@type': 'Organization',
+            name: profile.job_employer,
+        }
     }
-  }
 
-  return profileSchema;
+    return profileSchema
 }
 
 export { generatePersonFromSpeaker, generatePodcastEpisodeFromPodcast, generatePodcastSeries, generateProfile }
diff --git a/nuxt-app/helpers/trackGoal.ts b/nuxt-app/helpers/trackGoal.ts
index 534e351a..a99fc5e7 100644
--- a/nuxt-app/helpers/trackGoal.ts
+++ b/nuxt-app/helpers/trackGoal.ts
@@ -1,4 +1,4 @@
-import * as fathom from 'fathom-client';
+import * as fathom from 'fathom-client'
 
 /**
  * A helper function that tracks goals with Fathom Analytics.
@@ -8,6 +8,6 @@ import * as fathom from 'fathom-client';
  */
 export function trackGoal(eventId: string, value?: number): void {
     fathom.trackEvent(eventId, {
-      _value: value || 0
-    });
+        _value: value || 0,
+    })
 }
diff --git a/nuxt-app/pages/admin/checkin.vue b/nuxt-app/pages/admin/checkin.vue
index 24ce3831..c3d6e758 100644
--- a/nuxt-app/pages/admin/checkin.vue
+++ b/nuxt-app/pages/admin/checkin.vue
@@ -28,9 +28,7 @@
             <div v-else-if="!isAuthenticated" class="mt-16 text-center">
                 <p class="text-xl text-pink">Nicht eingeloggt.</p>
                 <p class="mt-2 text-white/60">Bitte zuerst im Directus einloggen.</p>
-                <NuxtLink to="/login" class="mt-4 inline-block text-lime hover:text-blue">
-                    Zum Login
-                </NuxtLink>
+                <NuxtLink to="/login" class="mt-4 inline-block text-lime hover:text-blue"> Zum Login </NuxtLink>
             </div>
 
             <!-- Scanner -->
@@ -49,12 +47,8 @@
                             {{ scanResult.firstName }}
                         </div>
                         <div class="mt-2 text-lg text-white/80">{{ scanResult.lastName }}</div>
-                        <div v-if="scanResult.alreadyCheckedIn" class="mt-4 text-yellow-400">
-                            Bereits eingecheckt
-                        </div>
-                        <div v-else class="mt-4 text-lime">
-                            Willkommen!
-                        </div>
+                        <div v-if="scanResult.alreadyCheckedIn" class="text-yellow-400 mt-4">Bereits eingecheckt</div>
+                        <div v-else class="mt-4 text-lime">Willkommen!</div>
                     </div>
                 </Transition>
 
@@ -148,7 +142,7 @@ onBeforeUnmount(() => {
 
 async function refreshStats() {
     try {
-        stats.value = await $fetch('/api/checkin/stats') as any
+        stats.value = (await $fetch('/api/checkin/stats')) as any
     } catch {
         // Stats not critical
     }
diff --git a/nuxt-app/pages/agb.vue b/nuxt-app/pages/agb.vue
index 07475410..c6e9a7b9 100644
--- a/nuxt-app/pages/agb.vue
+++ b/nuxt-app/pages/agb.vue
@@ -5,7 +5,7 @@
 
             <!-- Heading -->
             <SectionHeading class="mt-8 md:mt-0" element="h1">
-              {{ agbPage.heading }}
+                {{ agbPage.heading }}
             </SectionHeading>
 
             <!-- Text -->
@@ -29,7 +29,7 @@ const breadcrumbs = [{ label: 'AGB' }]
 const { data: agbPage } = useAsyncData(() => directus.getAgbPage())
 
 if (agbPage.value && agbPage.value.status !== 'published') {
-  throw new Error('The page was not found.')
+    throw new Error('The page was not found.')
 }
 
 useLoadingScreen(agbPage)
diff --git a/nuxt-app/pages/api/cocktails.vue b/nuxt-app/pages/api/cocktails.vue
index 7f5aad22..eff64dba 100644
--- a/nuxt-app/pages/api/cocktails.vue
+++ b/nuxt-app/pages/api/cocktails.vue
@@ -2,7 +2,7 @@
     <div v-if="cocktails" class="relative">
         <div class="container px-6 pb-20 pt-32 md:pb-32 md:pl-48 md:pt-40 lg:pb-52 lg:pr-8 lg:pt-56 2xl:pt-64 3xl:px-8">
             <Breadcrumbs :breadcrumbs="breadcrumbs" />
-            <PrettyJSON v-if="cocktails.menu" class='mt-6' :data="cocktails.menu"/>
+            <PrettyJSON v-if="cocktails.menu" class="mt-6" :data="cocktails.menu" />
         </div>
     </div>
 </template>
@@ -16,12 +16,12 @@ const directus = useDirectus()
 const breadcrumbs = [{ label: 'API' }, { label: 'Cocktails' }]
 
 // Query imprint page
-const {data: cocktails} = await useAsyncData(() => directus.getCocktailMenu())
+const { data: cocktails } = await useAsyncData(() => directus.getCocktailMenu())
 
 if (cocktails.value && cocktails.value.status !== 'published') {
-  if (cocktails.value) {
-    cocktails.value.menu = JSON.parse('{"error": "No cocktails available"}')
-  }
+    if (cocktails.value) {
+        cocktails.value.menu = JSON.parse('{"error": "No cocktails available"}')
+    }
 }
 
 // Set loading screen
diff --git a/nuxt-app/pages/aufnahmen.vue b/nuxt-app/pages/aufnahmen.vue
index 1da4ee8f..90c3e086 100644
--- a/nuxt-app/pages/aufnahmen.vue
+++ b/nuxt-app/pages/aufnahmen.vue
@@ -29,7 +29,7 @@ const breadcrumbs = [{ label: 'Hinweis zu Foto- und Videoaufnahmen' }]
 const { data: recordingsPage } = useAsyncData(() => directus.getRecordingsPage())
 
 if (recordingsPage.value && recordingsPage.value.status !== 'published') {
-  throw new Error('The page was not found.')
+    throw new Error('The page was not found.')
 }
 
 // Set loading screen
diff --git a/nuxt-app/pages/hall-of-fame/[slug].vue b/nuxt-app/pages/hall-of-fame/[slug].vue
index 433bc9db..b8456091 100644
--- a/nuxt-app/pages/hall-of-fame/[slug].vue
+++ b/nuxt-app/pages/hall-of-fame/[slug].vue
@@ -39,7 +39,12 @@
                         <div class="mt-6 text-base font-bold text-white md:mt-8 md:text-xl lg:text-2xl">
                             {{ speaker.occupation }}
                         </div>
-                        <IndividualPlatforms :platforms='platforms' :scope='"speaker"' :style='"color"' :sizes='"h-7 md:h-8 lg:h-10"' />
+                        <IndividualPlatforms
+                            :platforms="platforms"
+                            :scope="'speaker'"
+                            :style="'color'"
+                            :sizes="'h-7 md:h-8 lg:h-10'"
+                        />
                     </div>
                 </div>
 
@@ -170,14 +175,14 @@ useHead(() =>
 const breadcrumbs = computed(() => [{ label: 'Hall of Fame', href: '/hall-of-fame' }, { label: fullName.value || '' }])
 
 const platforms = computed(() => {
-  return {
-    github_url: speaker.value?.github_url,
-    twitter_url: speaker.value?.twitter_url,
-    bluesky_url: speaker.value?.bluesky_url,
-    linkedin_url: speaker.value?.linkedin_url,
-    instagram_url: speaker.value?.instagram_url,
-    youtube_url: speaker.value?.youtube_url,
-    website_url: speaker.value?.website_url,
-  }
-});
+    return {
+        github_url: speaker.value?.github_url,
+        twitter_url: speaker.value?.twitter_url,
+        bluesky_url: speaker.value?.bluesky_url,
+        linkedin_url: speaker.value?.linkedin_url,
+        instagram_url: speaker.value?.instagram_url,
+        youtube_url: speaker.value?.youtube_url,
+        website_url: speaker.value?.website_url,
+    }
+})
 </script>
diff --git a/nuxt-app/pages/kommt-bald.vue b/nuxt-app/pages/kommt-bald.vue
index 4250f3c1..17758e0d 100644
--- a/nuxt-app/pages/kommt-bald.vue
+++ b/nuxt-app/pages/kommt-bald.vue
@@ -1,13 +1,11 @@
 <template>
-        <div class="container px-6 pb-20 pt-32 md:pb-32 md:pl-48 md:pt-40 lg:pb-52 lg:pr-8 lg:pt-56 2xl:pt-64 3xl:px-8">
-            <Breadcrumbs :breadcrumbs="breadcrumbs" />
+    <div class="container px-6 pb-20 pt-32 md:pb-32 md:pl-48 md:pt-40 lg:pb-52 lg:pr-8 lg:pt-56 2xl:pt-64 3xl:px-8">
+        <Breadcrumbs :breadcrumbs="breadcrumbs" />
 
-            <SectionHeading class="mt-8 md:mt-0" element="h1">
-                Kommt bald!
-            </SectionHeading>
+        <SectionHeading class="mt-8 md:mt-0" element="h1"> Kommt bald! </SectionHeading>
 
-            <PrettyJSON :data="content" class='mt-6' />
-        </div>
+        <PrettyJSON :data="content" class="mt-6" />
+    </div>
 </template>
 
 <script setup lang="ts">
@@ -16,7 +14,7 @@ import { getMetaInfo } from '../helpers'
 const breadcrumbs = [{ label: 'Kommt bald!' }]
 
 const content = {
-  content: 'coming soon'
+    content: 'coming soon',
 }
 
 useHead(
@@ -28,4 +26,3 @@ useHead(
     })
 )
 </script>
-
diff --git a/nuxt-app/pages/konferenz/[slug]/index.vue b/nuxt-app/pages/konferenz/[slug]/index.vue
index 519187fe..16b7afd4 100644
--- a/nuxt-app/pages/konferenz/[slug]/index.vue
+++ b/nuxt-app/pages/konferenz/[slug]/index.vue
@@ -1,250 +1,290 @@
 <template>
-    <div v-if="conference && conferencePage" class='text-white'>
-      <article class="relative">
-
-        <section class="relative">
-          <PageCoverImage v-if='!conference.video && conference.cover_image' :cover-image="conference.cover_image" :overlay="false" />
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <Breadcrumbs :breadcrumbs="breadcrumbs" />
-            <SectionHeading class="mt-8 md:mt-0 md:pt-2/5-screen lg:pt-1/2-screen" element="h1">
-              {{ conference.title }}
-            </SectionHeading>
-            <InnerHtml
-              class="mt-8 text-3xl md:text-5xl font-black leading-normal text-white"
-              :html="conference.headline_1"
-            />
-          </div>
-        </section>
-
-        <section v-if='conference.video' class='mt-16 md:mt-28 lg:mt-32'>
-          <ScrollDownMouse />
-          <div class="bg-gray-900">
-            <video
-              class="min-h-80 w-full object-cover"
-              :src="videoUrl || ''"
-              :aria-label="conference.video.title || ''"
-              autoplay
-              loop
-              muted
-              playsinline
-            />
-          </div>
-        </section>
-
-        <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <InnerHtml
-              class="mt-2 text-2xl font-light leading-normal text-white"
-              :html="conference.text_1"
-            />
-          </div>
-        </section>
-
-        <section v-if='showTicketSection' class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <SectionHeading element="h2">
-              Tickets
-            </SectionHeading>
-              <BackgroundSpotlights :position='"-top-32 fixed right-[-40vw] -translate-x-1/2 transform"' :index='"0"' />
-              <InnerHtml
-                class="mt-2 text-2xl font-light leading-normal z-30 relative"
-                :html="conference.tickets_text"
-              />
-
-            <!-- Ticket price cards -->
-            <div v-if="conference.ticket_regular_price_cents" class="relative z-30 mt-12 grid gap-6 sm:grid-cols-2 lg:max-w-2xl">
-              <!-- Early Bird -->
-              <div
-                v-if="conference.ticket_early_bird_price_cents"
-                :class="[
-                  'group relative overflow-hidden rounded-2xl p-6 transition-all',
-                  isEarlyBird
-                    ? 'border-2 border-lime bg-[radial-gradient(ellipse_at_top_right,_rgba(99,102,241,0.4),_rgba(168,85,247,0.3)_35%,_rgba(207,255,0,0.12)_70%,_transparent)] hover:shadow-[0_0_30px_rgba(207,255,0,0.15)]'
-                    : 'opacity-60 border border-gray-700 bg-[radial-gradient(ellipse_at_top_right,_rgba(99,102,241,0.4),_rgba(168,85,247,0.3)_35%,_rgba(207,255,0,0.12)_70%,_transparent)]',
-                ]"
-              >
-                <div class="mb-1 text-xs font-bold uppercase tracking-widest text-lime">Early Bird</div>
-                <div v-if="isEarlyBird" class="mb-1 inline-block rounded-full bg-lime/20 px-2 py-0.5 text-xs font-medium text-lime">
-                  Jetzt verfügbar – bis {{ formatDeadline(conference.ticket_early_bird_deadline) }}
+    <div v-if="conference && conferencePage" class="text-white">
+        <article class="relative">
+            <section class="relative">
+                <PageCoverImage
+                    v-if="!conference.video && conference.cover_image"
+                    :cover-image="conference.cover_image"
+                    :overlay="false"
+                />
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <Breadcrumbs :breadcrumbs="breadcrumbs" />
+                    <SectionHeading class="mt-8 md:mt-0 md:pt-2/5-screen lg:pt-1/2-screen" element="h1">
+                        {{ conference.title }}
+                    </SectionHeading>
+                    <InnerHtml
+                        class="mt-8 text-3xl font-black leading-normal text-white md:text-5xl"
+                        :html="conference.headline_1"
+                    />
+                </div>
+            </section>
+
+            <section v-if="conference.video" class="mt-16 md:mt-28 lg:mt-32">
+                <ScrollDownMouse />
+                <div class="bg-gray-900">
+                    <video
+                        class="min-h-80 w-full object-cover"
+                        :src="videoUrl || ''"
+                        :aria-label="conference.video.title || ''"
+                        autoplay
+                        loop
+                        muted
+                        playsinline
+                    />
                 </div>
-                <div v-else class="mb-1 inline-block rounded-full bg-gray-700 px-2 py-0.5 text-xs font-medium text-gray-400">
-                  Abgelaufen
+            </section>
+
+            <section class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <InnerHtml class="mt-2 text-2xl font-light leading-normal text-white" :html="conference.text_1" />
                 </div>
-                <div class="mt-2 flex items-baseline gap-1">
-                  <span :class="['text-5xl font-black text-white', { 'line-through': !isEarlyBird }]">{{ formatCentsShort(conference.ticket_early_bird_price_cents ?? 0) }}</span>
-                  <span class="text-lg text-gray-400">€</span>
+            </section>
+
+            <section v-if="showTicketSection" class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Tickets </SectionHeading>
+                    <BackgroundSpotlights
+                        :position="'-top-32 fixed right-[-40vw] -translate-x-1/2 transform'"
+                        :index="'0'"
+                    />
+                    <InnerHtml
+                        class="relative z-30 mt-2 text-2xl font-light leading-normal"
+                        :html="conference.tickets_text"
+                    />
+
+                    <!-- Ticket price cards -->
+                    <div
+                        v-if="conference.ticket_regular_price_cents"
+                        class="relative z-30 mt-12 grid gap-6 sm:grid-cols-2 lg:max-w-2xl"
+                    >
+                        <!-- Early Bird -->
+                        <div
+                            v-if="conference.ticket_early_bird_price_cents"
+                            :class="[
+                                'group relative overflow-hidden rounded-2xl p-6 transition-all',
+                                isEarlyBird
+                                    ? 'border-2 border-lime bg-[radial-gradient(ellipse_at_top_right,_rgba(99,102,241,0.4),_rgba(168,85,247,0.3)_35%,_rgba(207,255,0,0.12)_70%,_transparent)] hover:shadow-[0_0_30px_rgba(207,255,0,0.15)]'
+                                    : 'border border-gray-700 bg-[radial-gradient(ellipse_at_top_right,_rgba(99,102,241,0.4),_rgba(168,85,247,0.3)_35%,_rgba(207,255,0,0.12)_70%,_transparent)] opacity-60',
+                            ]"
+                        >
+                            <div class="mb-1 text-xs font-bold uppercase tracking-widest text-lime">Early Bird</div>
+                            <div
+                                v-if="isEarlyBird"
+                                class="mb-1 inline-block rounded-full bg-lime/20 px-2 py-0.5 text-xs font-medium text-lime"
+                            >
+                                Jetzt verfügbar – bis {{ formatDeadline(conference.ticket_early_bird_deadline) }}
+                            </div>
+                            <div
+                                v-else
+                                class="text-gray-400 mb-1 inline-block rounded-full bg-gray-700 px-2 py-0.5 text-xs font-medium"
+                            >
+                                Abgelaufen
+                            </div>
+                            <div class="mt-2 flex items-baseline gap-1">
+                                <span :class="['text-5xl font-black text-white', { 'line-through': !isEarlyBird }]">{{
+                                    formatCentsShort(conference.ticket_early_bird_price_cents ?? 0)
+                                }}</span>
+                                <span class="text-gray-400 text-lg">€</span>
+                            </div>
+                            <div class="text-gray-400 mt-1 text-sm">
+                                {{ formatCentsGross(conference.ticket_early_bird_price_cents ?? 0) }} inkl. MwSt.
+                            </div>
+                        </div>
+
+                        <!-- Regular -->
+                        <div
+                            :class="[
+                                'group relative overflow-hidden rounded-2xl p-6 transition-all',
+                                !isEarlyBird
+                                    ? 'border-2 border-lime bg-[radial-gradient(ellipse_at_bottom_left,_rgba(99,102,241,0.35),_rgba(168,85,247,0.2)_45%,_transparent)] hover:shadow-[0_0_30px_rgba(207,255,0,0.15)]'
+                                    : 'hover:border-gray-400 border border-gray-500 bg-[radial-gradient(ellipse_at_bottom_left,_rgba(99,102,241,0.35),_rgba(168,85,247,0.2)_45%,_transparent)]',
+                            ]"
+                        >
+                            <div
+                                :class="[
+                                    'mb-1 text-xs font-bold uppercase tracking-widest',
+                                    !isEarlyBird ? 'text-lime' : 'text-gray-400',
+                                ]"
+                            >
+                                Regulär
+                            </div>
+                            <div
+                                v-if="!isEarlyBird"
+                                class="mb-1 inline-block rounded-full bg-lime/20 px-2 py-0.5 text-xs font-medium text-lime"
+                            >
+                                Aktueller Preis
+                            </div>
+                            <div class="mt-2 flex items-baseline gap-1">
+                                <span class="text-5xl font-black text-white">{{
+                                    formatCentsShort(conference.ticket_regular_price_cents ?? 0)
+                                }}</span>
+                                <span class="text-gray-400 text-lg">€</span>
+                            </div>
+                            <div class="text-gray-400 mt-1 text-sm">
+                                {{ formatCentsGross(conference.ticket_regular_price_cents ?? 0) }} inkl. MwSt.
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- CTA Button -->
+                    <div class="relative z-30 mt-10">
+                        <NuxtLink
+                            :to="`/konferenz/${conference.slug}/tickets`"
+                            data-cursor-hover
+                            class="inline-flex items-center gap-4 rounded-full bg-lime px-10 py-4 font-bold uppercase text-black transition-all hover:scale-105 hover:shadow-[0_0_40px_rgba(207,255,0,0.3)]"
+                        >
+                            <span class="text-xl md:text-2xl">Tickets kaufen</span>
+                            <svg
+                                xmlns="http://www.w3.org/2000/svg"
+                                width="24"
+                                height="24"
+                                viewBox="0 0 24 24"
+                                fill="none"
+                                stroke="currentColor"
+                                stroke-width="3"
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                            >
+                                <path d="M5 12h14M12 5l7 7-7 7" />
+                            </svg>
+                        </NuxtLink>
+                    </div>
                 </div>
-                <div class="mt-1 text-sm text-gray-400">
-                  {{ formatCentsGross(conference.ticket_early_bird_price_cents ?? 0) }} inkl. MwSt.
+            </section>
+
+            <section v-if="showTicketSection" class="relative">
+                <div class="container mt-16 px-6 md:mb-16 md:mt-28 md:pl-48 lg:mb-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Community </SectionHeading>
+                    <TestimonialSlider :testimonials="testimonials" />
                 </div>
-              </div>
-
-              <!-- Regular -->
-              <div
-                :class="[
-                  'group relative overflow-hidden rounded-2xl p-6 transition-all',
-                  !isEarlyBird
-                    ? 'border-2 border-lime bg-[radial-gradient(ellipse_at_bottom_left,_rgba(99,102,241,0.35),_rgba(168,85,247,0.2)_45%,_transparent)] hover:shadow-[0_0_30px_rgba(207,255,0,0.15)]'
-                    : 'border border-gray-500 bg-[radial-gradient(ellipse_at_bottom_left,_rgba(99,102,241,0.35),_rgba(168,85,247,0.2)_45%,_transparent)] hover:border-gray-400',
-                ]"
-              >
-                <div :class="['mb-1 text-xs font-bold uppercase tracking-widest', !isEarlyBird ? 'text-lime' : 'text-gray-400']">Regulär</div>
-                <div v-if="!isEarlyBird" class="mb-1 inline-block rounded-full bg-lime/20 px-2 py-0.5 text-xs font-medium text-lime">
-                  Aktueller Preis
+            </section>
+
+            <section class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2" class="mb-4"> Speaker </SectionHeading>
+                    <BackgroundSpotlights :position="'-top-96 -left-96'" :index="'0'" />
+                    <ConferenceSpeakersSlider :speakers="conference.speakersPrepared" />
                 </div>
-                <div class="mt-2 flex items-baseline gap-1">
-                  <span class="text-5xl font-black text-white">{{ formatCentsShort(conference.ticket_regular_price_cents ?? 0) }}</span>
-                  <span class="text-lg text-gray-400">€</span>
+            </section>
+
+            <section class="relative my-16">
+                <ConferenceGallery :images="galleryImages" />
+            </section>
+
+            <section class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Agenda </SectionHeading>
+                    <ConferenceAgenda :agenda="preparedAgenda" />
                 </div>
-                <div class="mt-1 text-sm text-gray-400">
-                  {{ formatCentsGross(conference.ticket_regular_price_cents ?? 0) }} inkl. MwSt.
+            </section>
+
+            <section class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Talks </SectionHeading>
+                    <div v-for="(talk, index) of conference.talksPrepared" :key="talk.id" class="relative mb-36">
+                        <BackgroundSpotlights
+                            v-if="index % 2 == 0"
+                            :position="'-top-96 fixed right-[-40vw] -translate-x-1/2 transform'"
+                            :index="'-10'"
+                        />
+                        <BackgroundSpotlights
+                            v-if="index % 2 != 0"
+                            :position="'-top-96 fixed left-[-12vw] -translate-x-1/2 transform'"
+                            :index="'-10'"
+                        />
+                        <TalkItem :talk="talk" />
+                    </div>
                 </div>
-              </div>
-            </div>
-
-            <!-- CTA Button -->
-            <div class="relative z-30 mt-10">
-              <NuxtLink
-                :to="`/konferenz/${conference.slug}/tickets`"
-                data-cursor-hover
-                class="inline-flex items-center gap-4 rounded-full bg-lime px-10 py-4 font-bold uppercase text-black transition-all hover:scale-105 hover:shadow-[0_0_40px_rgba(207,255,0,0.3)]"
-              >
-                <span class="text-xl md:text-2xl">Tickets kaufen</span>
-                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round">
-                  <path d="M5 12h14M12 5l7 7-7 7" />
-                </svg>
-              </NuxtLink>
-            </div>
-          </div>
-        </section>
-
-        <section v-if='showTicketSection' class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8 md:mb-16 lg:mb-48">
-            <SectionHeading element="h2">
-              Community
-            </SectionHeading>
-            <TestimonialSlider :testimonials='testimonials' />
-          </div>
-        </section>
-
-        <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <SectionHeading element="h2" class="mb-4">
-              Speaker
-            </SectionHeading>
-            <BackgroundSpotlights :position='"-top-96 -left-96"' :index='"0"' />
-            <ConferenceSpeakersSlider :speakers='conference.speakersPrepared' />
-          </div>
-        </section>
-
-        <section class="relative my-16">
-          <ConferenceGallery :images='galleryImages' />
-        </section>
-
-        <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <SectionHeading element="h2">
-              Agenda
-            </SectionHeading>
-            <ConferenceAgenda :agenda='preparedAgenda' />
-          </div>
-        </section>
-
-        <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <SectionHeading element="h2">
-              Talks
-            </SectionHeading>
-            <div v-for="(talk, index) of conference.talksPrepared" :key="talk.id" class='mb-36 relative'>
-              <BackgroundSpotlights v-if='index % 2 == 0' :position='"-top-96 fixed right-[-40vw] -translate-x-1/2 transform"' :index='"-10"' />
-              <BackgroundSpotlights v-if='index % 2 != 0' :position='"-top-96 fixed left-[-12vw] -translate-x-1/2 transform"' :index='"-10"' />
-              <TalkItem :talk='talk' />
-            </div>
-          </div>
-        </section>
-
-        <section v-if='!showTicketSection' class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8 md:mb-16 lg:mb-48">
-            <SectionHeading element="h2">
-              Community
-            </SectionHeading>
-            <TestimonialSlider :testimonials='testimonials' />
-          </div>
-        </section>
-
-        <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <InnerHtml
-              class="mt-8 text-3xl font-black leading-normal text-white"
-              :html="conferencePage.faqs_heading"
-            />
-            <InnerHtml
-              class="mt-2 text-2xl font-light leading-normal text-white"
-              :html="conferencePage.faqs_text_1"
-            />
-            <FaqList :faqs='combinedFaqs' />
-          </div>
-        </section>
-
-        <section v-if='conference.partnersPrepared.length > 0' class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <SectionHeading element="h2">
-              Partner
-            </SectionHeading>
-            <p class="text-base font-light leading-normal text-white md:mt-14 md:text-xl lg:text-2xl">
-              Dieses Event wird durch folgende Partner unterstützt:
-            </p>
-            <div class="mt-8 flex flex-wrap gap-16 justify-center items-center sm:justify-start sm:items-start">
-              <a
-                v-for="partner in conference.partnersPrepared"
-                :key="partner.id"
-                :href="partner.url"
-                target="_blank"
-                rel="noopener noreferrer"
-                class="flex items-center justify-center w-40 h-18 hover:scale-105 transition-all duration-200"
-                data-cursor-hover
-              >
-                <DirectusImage
-                  v-if="partner.image"
-                  :image="partner.image"
-                  :alt="partner.name"
-                  sizes="(max-width: 768px) 256px, (max-width: 1024px) 320px, 384px"
-                  class="w-full h-auto object-contain"
-                />
-              </a>
-            </div>
-          </div>
-        </section>
-
-        <section class="relative">
-          <div class="container my-16 px-6 md:my-28 md:pl-48 lg:my-32 lg:pr-8 3xl:px-8">
-            <p class="text-base font-light leading-normal text-white md:mt-14 md:text-xl lg:text-2xl">
-              Bitte beachte auch unsere
-              <NuxtLink class="text-lime font-bold hover:underline" data-cursor-hover :to="'/verhaltensregeln'">
-                Verhaltensregeln
-              </NuxtLink>
-              und den
-              <NuxtLink class="text-lime font-bold hover:underline" data-cursor-hover :to="'/aufnahmen'">
-                Hinweis zu Foto- und Videoaufnahmen.
-              </NuxtLink>
-            </p>
-          </div>
-        </section>
-      </article>
+            </section>
+
+            <section v-if="!showTicketSection" class="relative">
+                <div class="container mt-16 px-6 md:mb-16 md:mt-28 md:pl-48 lg:mb-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Community </SectionHeading>
+                    <TestimonialSlider :testimonials="testimonials" />
+                </div>
+            </section>
+
+            <section class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <InnerHtml
+                        class="mt-8 text-3xl font-black leading-normal text-white"
+                        :html="conferencePage.faqs_heading"
+                    />
+                    <InnerHtml
+                        class="mt-2 text-2xl font-light leading-normal text-white"
+                        :html="conferencePage.faqs_text_1"
+                    />
+                    <FaqList :faqs="combinedFaqs" />
+                </div>
+            </section>
+
+            <section v-if="conference.partnersPrepared.length > 0" class="relative">
+                <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                    <SectionHeading element="h2"> Partner </SectionHeading>
+                    <p class="text-base font-light leading-normal text-white md:mt-14 md:text-xl lg:text-2xl">
+                        Dieses Event wird durch folgende Partner unterstützt:
+                    </p>
+                    <div class="mt-8 flex flex-wrap items-center justify-center gap-16 sm:items-start sm:justify-start">
+                        <a
+                            v-for="partner in conference.partnersPrepared"
+                            :key="partner.id"
+                            :href="partner.url"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            class="flex h-18 w-40 items-center justify-center transition-all duration-200 hover:scale-105"
+                            data-cursor-hover
+                        >
+                            <DirectusImage
+                                v-if="partner.image"
+                                :image="partner.image"
+                                :alt="partner.name"
+                                sizes="(max-width: 768px) 256px, (max-width: 1024px) 320px, 384px"
+                                class="h-auto w-full object-contain"
+                            />
+                        </a>
+                    </div>
+                </div>
+            </section>
+
+            <section class="relative">
+                <div class="container my-16 px-6 md:my-28 md:pl-48 lg:my-32 lg:pr-8 3xl:px-8">
+                    <p class="text-base font-light leading-normal text-white md:mt-14 md:text-xl lg:text-2xl">
+                        Bitte beachte auch unsere
+                        <NuxtLink
+                            class="font-bold text-lime hover:underline"
+                            data-cursor-hover
+                            :to="'/verhaltensregeln'"
+                        >
+                            Verhaltensregeln
+                        </NuxtLink>
+                        und den
+                        <NuxtLink class="font-bold text-lime hover:underline" data-cursor-hover :to="'/aufnahmen'">
+                            Hinweis zu Foto- und Videoaufnahmen.
+                        </NuxtLink>
+                    </p>
+                </div>
+            </section>
+        </article>
     </div>
 </template>
 
 <script setup lang="ts">
+import ConferenceGallery from '~/components/ConferenceGallery.vue'
+import ConferenceSpeakersSlider from '~/components/ConferenceSpeakersSlider.vue'
+import TestimonialSlider from '~/components/TestimonialSlider.vue'
 import { useLoadingScreen, useNow } from '~/composables'
 import { useDirectus } from '~/composables/useDirectus'
-import { getMetaInfo, parseCmsDate, trackGoal } from '~/helpers';
-import type { ConferenceItem, DirectusConferencePage, DirectusTestimonialItem, DirectusFileItem, TalkItem as TalkItemType } from '~/types';
+import { VAT_RATE } from '~/config'
+import { getMetaInfo, parseCmsDate, trackGoal } from '~/helpers'
+import { getAssetUrl } from '~/helpers/getAssetUrl'
+import type {
+    ConferenceItem,
+    DirectusConferencePage,
+    DirectusFileItem,
+    DirectusTestimonialItem,
+    TalkItem as TalkItemType,
+} from '~/types'
 import { computed, type ComputedRef } from 'vue'
-import ConferenceSpeakersSlider from '~/components/ConferenceSpeakersSlider.vue';
-import ConferenceGallery from '~/components/ConferenceGallery.vue';
-import TestimonialSlider from '~/components/TestimonialSlider.vue';
-import { getAssetUrl } from '~/helpers/getAssetUrl';
-import { VAT_RATE } from '~/config';
 
 // Add route and router
 const route = useRoute()
@@ -262,7 +302,7 @@ const { data: pageData, error } = await useAsyncData(route.fullPath, async () =>
         ])
 
         if (!conferencePage) {
-          throw new Error('Could not load the conference singleton page from Directus.')
+            throw new Error('Could not load the conference singleton page from Directus.')
         }
 
         // A missing conference is a normal 404 (handled below), not a fetch
@@ -317,7 +357,12 @@ function formatCentsShort(netCents: number): string {
 
 function formatDeadline(deadline: string | null): string {
     if (!deadline) return ''
-    return parseCmsDate(deadline).toLocaleDateString('de-DE', { timeZone: 'Europe/Berlin', day: '2-digit', month: '2-digit', year: 'numeric' })
+    return parseCmsDate(deadline).toLocaleDateString('de-DE', {
+        timeZone: 'Europe/Berlin',
+        day: '2-digit',
+        month: '2-digit',
+        year: 'numeric',
+    })
 }
 
 function formatCentsGross(netCents: number): string {
@@ -343,61 +388,60 @@ const showTicketSection = computed(() => {
 })
 
 type preparedAgendaItem = {
-  start: string
-  end: string
-  title: string
-  subtitle: string
-  track: string
-  talk_identifier: string
-  _object: undefined | TalkItemType
-};
+    start: string
+    end: string
+    title: string
+    subtitle: string
+    track: string
+    talk_identifier: string
+    _object: undefined | TalkItemType
+}
 
 const preparedAgenda: ComputedRef<preparedAgendaItem[]> = computed(() => {
-  const agenda = conference.value?.agenda.map((talk) => {
-
-    const currentTalk: preparedAgendaItem = {
-      _object: undefined,
-      ...talk,
-    }
+    const agenda = conference.value?.agenda.map((talk) => {
+        const currentTalk: preparedAgendaItem = {
+            _object: undefined,
+            ...talk,
+        }
 
-    if (talk.talk_identifier) {
-      const preparedTalk = conference.value?.talksPrepared.find(t => t.id === talk.talk_identifier);
-      if (preparedTalk) {
-        currentTalk._object = preparedTalk;
-      }
-    }
+        if (talk.talk_identifier) {
+            const preparedTalk = conference.value?.talksPrepared.find((t) => t.id === talk.talk_identifier)
+            if (preparedTalk) {
+                currentTalk._object = preparedTalk
+            }
+        }
 
-    return currentTalk;
-  });
+        return currentTalk
+    })
 
-  if (!agenda) {
-    return [];
-  }
+    if (!agenda) {
+        return []
+    }
 
-  return agenda;
+    return agenda
 })
 
 const combinedFaqs: ComputedRef<[]> = computed(() => {
-  let faqs = [];
-  if (pageData.value?.conference?.faqs) {
-    faqs = [...pageData.value.conference.faqs];
-  }
-  if (pageData.value?.conferencePage?.faqs) {
-    faqs = [...faqs, ...pageData.value.conferencePage.faqs];
-  }
-  return faqs;
+    let faqs = []
+    if (pageData.value?.conference?.faqs) {
+        faqs = [...pageData.value.conference.faqs]
+    }
+    if (pageData.value?.conferencePage?.faqs) {
+        faqs = [...faqs, ...pageData.value.conferencePage.faqs]
+    }
+    return faqs
 })
 
-const galleryImages: ComputedRef<DirectusFileItem []> = computed(() => {
-  let images: DirectusFileItem[] = [];
+const galleryImages: ComputedRef<DirectusFileItem[]> = computed(() => {
+    let images: DirectusFileItem[] = []
 
-  if (pageData.value?.conference?.gallery_images) {
-    images = pageData.value.conference.gallery_images.map((gallery_image) => {
-      return gallery_image.directus_files_id;
-    })
-  }
+    if (pageData.value?.conference?.gallery_images) {
+        images = pageData.value.conference.gallery_images.map((gallery_image) => {
+            return gallery_image.directus_files_id
+        })
+    }
 
-  return images;
+    return images
 })
 
 const videoUrl = computed(() => getAssetUrl(pageData.value?.conference?.video))
@@ -407,7 +451,7 @@ useLoadingScreen(conference, conferencePage)
 
 // Set page meta data
 useHead(() =>
-  conference.value
+    conference.value
         ? getMetaInfo({
               type: 'article',
               path: route.path,
@@ -420,5 +464,8 @@ useHead(() =>
 )
 
 // Create breadcrumb list
-const breadcrumbs = computed(() => [{ label: 'Konferenz', href: '/konferenz' }, { label: conference.value?.title || '' }])
+const breadcrumbs = computed(() => [
+    { label: 'Konferenz', href: '/konferenz' },
+    { label: conference.value?.title || '' },
+])
 </script>
diff --git a/nuxt-app/pages/konferenz/[slug]/tickets/index.vue b/nuxt-app/pages/konferenz/[slug]/tickets/index.vue
index 60927dae..29242fda 100644
--- a/nuxt-app/pages/konferenz/[slug]/tickets/index.vue
+++ b/nuxt-app/pages/konferenz/[slug]/tickets/index.vue
@@ -69,9 +69,7 @@ const breadcrumbs = computed(() => [
                 class="border-yellow-500/50 bg-yellow-500/10 text-yellow-200 mb-8 rounded-lg border p-4"
             >
                 <p class="font-medium">Zahlung abgebrochen</p>
-                <p class="text-yellow-200/80 mt-1 text-sm">
-                    Die Zahlung wurde abgebrochen. Bitte versuche es erneut.
-                </p>
+                <p class="text-yellow-200/80 mt-1 text-sm">Die Zahlung wurde abgebrochen. Bitte versuche es erneut.</p>
             </div>
 
             <!-- Error state -->
diff --git a/nuxt-app/pages/konferenz/[slug]/tickets/success.vue b/nuxt-app/pages/konferenz/[slug]/tickets/success.vue
index b3f2684f..70c56ef0 100644
--- a/nuxt-app/pages/konferenz/[slug]/tickets/success.vue
+++ b/nuxt-app/pages/konferenz/[slug]/tickets/success.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { useDirectus } from '~/composables/useDirectus'
-import { getMetaInfo } from '~/helpers'
-import { computed, onMounted, onBeforeUnmount, ref } from 'vue'
 import { useTicketCheckoutStore } from '~/composables/useTicketCheckoutStore'
+import { getMetaInfo } from '~/helpers'
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
 
 const route = useRoute()
 const directus = useDirectus()
@@ -120,27 +120,15 @@ useHead(() =>
                 <!-- Success icon -->
                 <div class="mb-8 flex justify-center">
                     <div class="flex h-24 w-24 items-center justify-center rounded-full bg-lime/20">
-                        <svg
-                            class="h-12 w-12 text-lime"
-                            fill="none"
-                            stroke="currentColor"
-                            viewBox="0 0 24 24"
-                        >
-                            <path
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                stroke-width="2"
-                                d="M5 13l4 4L19 7"
-                            />
+                        <svg class="h-12 w-12 text-lime" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
                         </svg>
                     </div>
                 </div>
 
                 <h1 class="text-4xl font-bold md:text-5xl">Vielen Dank!</h1>
 
-                <p class="mt-6 text-xl text-gray-300">
-                    Deine Bestellung war erfolgreich.
-                </p>
+                <p class="text-gray-300 mt-6 text-xl">Deine Bestellung war erfolgreich.</p>
 
                 <!-- Loading state while polling -->
                 <div v-if="!pollingDone" class="mt-8 rounded-lg bg-gray-800/50 p-6">
@@ -148,7 +136,10 @@ useHead(() =>
                 </div>
 
                 <!-- Single ticket: show button to complete ticket -->
-                <div v-else-if="orderReady && isSingleTicket && profileUrl" class="mt-8 rounded-lg bg-gray-800/50 p-6 text-left">
+                <div
+                    v-else-if="orderReady && isSingleTicket && profileUrl"
+                    class="mt-8 rounded-lg bg-gray-800/50 p-6 text-left"
+                >
                     <h2 class="mb-4 text-lg font-bold text-lime">Nächster Schritt</h2>
                     <p class="text-gray-300">
                         Bitte vervollständige deine Angaben, damit wir dir dein Ticket mit QR-Code zusenden können.
@@ -166,18 +157,33 @@ useHead(() =>
                 <!-- Multi ticket: show info about emails -->
                 <div v-else-if="orderReady && !isSingleTicket" class="mt-8 rounded-lg bg-gray-800/50 p-6 text-left">
                     <h2 class="mb-4 text-lg font-bold text-lime">Was passiert jetzt?</h2>
-                    <ul class="space-y-3 text-gray-300">
+                    <ul class="text-gray-300 space-y-3">
                         <li class="flex items-start gap-3">
-                            <span class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime">1</span>
+                            <span
+                                class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime"
+                                >1</span
+                            >
                             <span>Du erhältst in Kürze eine Bestätigungsmail.</span>
                         </li>
                         <li class="flex items-start gap-3">
-                            <span class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime">2</span>
-                            <span>Alle Teilnehmenden erhalten eine E-Mail mit einem Link zur Vervollständigung ihrer Angaben.</span>
+                            <span
+                                class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime"
+                                >2</span
+                            >
+                            <span
+                                >Alle Teilnehmenden erhalten eine E-Mail mit einem Link zur Vervollständigung ihrer
+                                Angaben.</span
+                            >
                         </li>
                         <li class="flex items-start gap-3">
-                            <span class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime">3</span>
-                            <span>Sobald die Angaben vervollständigt sind, wird das Ticket mit QR-Code per E-Mail versendet.</span>
+                            <span
+                                class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime"
+                                >3</span
+                            >
+                            <span
+                                >Sobald die Angaben vervollständigt sind, wird das Ticket mit QR-Code per E-Mail
+                                versendet.</span
+                            >
                         </li>
                     </ul>
                 </div>
@@ -185,14 +191,26 @@ useHead(() =>
                 <!-- Fallback: polling timed out or no session_id -->
                 <div v-else class="mt-8 rounded-lg bg-gray-800/50 p-6 text-left">
                     <h2 class="mb-4 text-lg font-bold text-lime">Was passiert jetzt?</h2>
-                    <ul class="space-y-3 text-gray-300">
+                    <ul class="text-gray-300 space-y-3">
                         <li class="flex items-start gap-3">
-                            <span class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime">1</span>
-                            <span>Alle Teilnehmenden erhalten eine E-Mail mit einem Link zur Vervollständigung ihrer Angaben.</span>
+                            <span
+                                class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime"
+                                >1</span
+                            >
+                            <span
+                                >Alle Teilnehmenden erhalten eine E-Mail mit einem Link zur Vervollständigung ihrer
+                                Angaben.</span
+                            >
                         </li>
                         <li class="flex items-start gap-3">
-                            <span class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime">2</span>
-                            <span>Sobald die Angaben vervollständigt sind, wird das Ticket mit QR-Code per E-Mail versendet.</span>
+                            <span
+                                class="mt-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-full bg-lime/20 text-xs text-lime"
+                                >2</span
+                            >
+                            <span
+                                >Sobald die Angaben vervollständigt sind, wird das Ticket mit QR-Code per E-Mail
+                                versendet.</span
+                            >
                         </li>
                     </ul>
                 </div>
@@ -200,7 +218,8 @@ useHead(() =>
                 <p class="mt-8 text-sm text-[#848a98]">
                     Keine E-Mail erhalten? Bitte prüfe deinen Spam-Ordner oder kontaktiere uns unter
                     <a href="mailto:podcast@programmier.bar" class="text-lime hover:underline">
-                        podcast@programmier.bar</a>.
+                        podcast@programmier.bar</a
+                    >.
                 </p>
 
                 <div class="mt-12 flex flex-col gap-4 sm:flex-row sm:justify-center">
diff --git a/nuxt-app/pages/konferenz/index.vue b/nuxt-app/pages/konferenz/index.vue
index 1dd0d7b8..0890da11 100644
--- a/nuxt-app/pages/konferenz/index.vue
+++ b/nuxt-app/pages/konferenz/index.vue
@@ -1,88 +1,89 @@
 <template>
     <div v-if="conferencePage">
         <section class="relative">
-            <PageCoverImage v-if='!conferencePage.video && conferencePage.cover_image' :cover-image="conferencePage.cover_image"/>
+            <PageCoverImage
+                v-if="!conferencePage.video && conferencePage.cover_image"
+                :cover-image="conferencePage.cover_image"
+            />
             <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
                 <Breadcrumbs :breadcrumbs="breadcrumbs" />
-               <SectionHeading class="mt-8 md:mt-0 md:pt-2/5-screen lg:pt-1/2-screen" element="h1">
+                <SectionHeading class="mt-8 md:mt-0 md:pt-2/5-screen lg:pt-1/2-screen" element="h1">
                     {{ conferencePage.conference_heading }}
                 </SectionHeading>
                 <InnerHtml
-                  class="mt-8 text-3xl md:text-5xl font-black leading-normal text-white"
-                  :html="conferencePage.intro_heading"
+                    class="mt-8 text-3xl font-black leading-normal text-white md:text-5xl"
+                    :html="conferencePage.intro_heading"
                 />
             </div>
         </section>
 
-      <section v-if='conferencePage.video' class='mt-16 md:mt-28 lg:mt-32'>
-        <ScrollDownMouse />
-        <div class="bg-gray-900">
-          <video
-            class="min-h-80 w-full object-cover"
-            :src="videoUrl || ''"
-            :aria-label="conferencePage.video.title || ''"
-            autoplay
-            loop
-            muted
-            playsinline
-          />
-        </div>
-      </section>
+        <section v-if="conferencePage.video" class="mt-16 md:mt-28 lg:mt-32">
+            <ScrollDownMouse />
+            <div class="bg-gray-900">
+                <video
+                    class="min-h-80 w-full object-cover"
+                    :src="videoUrl || ''"
+                    :aria-label="conferencePage.video.title || ''"
+                    autoplay
+                    loop
+                    muted
+                    playsinline
+                />
+            </div>
+        </section>
 
-      <section class="relative">
-        <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-          <InnerHtml
-            class="mt-2 text-2xl font-light leading-normal text-white"
-            :html="conferencePage.intro_text_1"
-          />
-        </div>
-      </section>
+        <section class="relative">
+            <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                <InnerHtml
+                    class="mt-2 text-2xl font-light leading-normal text-white"
+                    :html="conferencePage.intro_text_1"
+                />
+            </div>
+        </section>
 
-      <section class="relative">
-          <ConferenceSection :heading='"Termine"' :conferences="conferences" />
+        <section class="relative">
+            <ConferenceSection :heading="'Termine'" :conferences="conferences" />
         </section>
 
-      <section class="relative">
-        <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8 md:mb-16 lg:mb-48">
-          <SectionHeading element="h2">
-            Community
-          </SectionHeading>
-          <TestimonialSlider :testimonials='testimonials' />
-        </div>
-      </section>
+        <section class="relative">
+            <div class="container mt-16 px-6 md:mb-16 md:mt-28 md:pl-48 lg:mb-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                <SectionHeading element="h2"> Community </SectionHeading>
+                <TestimonialSlider :testimonials="testimonials" />
+            </div>
+        </section>
 
-      <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
-            <InnerHtml
-              class="mt-8 text-3xl font-black leading-normal text-white"
-              :html="conferencePage.faqs_heading"
-            />
-            <InnerHtml
-              class="mt-2 text-2xl font-light leading-normal text-white"
-              :html="conferencePage.faqs_text_1"
-            />
-            <FaqList :faqs='conferencePage.faqs' />
-          </div>
+        <section class="relative">
+            <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                <InnerHtml
+                    class="mt-8 text-3xl font-black leading-normal text-white"
+                    :html="conferencePage.faqs_heading"
+                />
+                <InnerHtml
+                    class="mt-2 text-2xl font-light leading-normal text-white"
+                    :html="conferencePage.faqs_text_1"
+                />
+                <FaqList :faqs="conferencePage.faqs" />
+            </div>
         </section>
     </div>
 </template>
 
 <script setup lang="ts">
+import TestimonialSlider from '~/components/TestimonialSlider.vue'
 import { useLoadingScreen, usePageMeta } from '~/composables'
 import { useDirectus } from '~/composables/useDirectus'
-import type { DirectusConferenceItem, DirectusConferencePage, DirectusTestimonialItem } from '~/types';
+import { getAssetUrl } from '~/helpers/getAssetUrl'
+import type { DirectusConferenceItem, DirectusConferencePage, DirectusTestimonialItem } from '~/types'
 import { computed, type ComputedRef } from 'vue'
-import TestimonialSlider from '~/components/TestimonialSlider.vue';
-import { getAssetUrl } from '~/helpers/getAssetUrl';
 
 const breadcrumbs = [{ label: 'Konferenzen' }]
 const directus = useDirectus()
 
 const { data: pageData } = useAsyncData(async () => {
     const [conferencePage, conferences, testimonials] = await Promise.all([
-      directus.getConferencePage(),
-      directus.getConferences(),
-      directus.getTestimonials(),
+        directus.getConferencePage(),
+        directus.getConferences(),
+        directus.getTestimonials(),
     ])
 
     return { conferencePage, conferences, testimonials }
diff --git a/nuxt-app/pages/meetup/[slug].vue b/nuxt-app/pages/meetup/[slug].vue
index b894d40f..07a71e86 100644
--- a/nuxt-app/pages/meetup/[slug].vue
+++ b/nuxt-app/pages/meetup/[slug].vue
@@ -44,24 +44,28 @@
                 <!-- Heading and description -->
                 <SectionHeading class="hidden md:block" element="h2"> Meetup Infos </SectionHeading>
                 <InnerHtml
-                  class="mt-8 space-y-8 font-light leading-normal text-white md:mt-14 text-xl"
-                  :html="meetup.intro"
+                    class="mt-8 space-y-8 text-xl font-light leading-normal text-white md:mt-14"
+                    :html="meetup.intro"
                 />
-                <div v-for="talk of meetup.talksPrepared" :key="talk.id" class="mt-8 space-y-8 font-light leading-normal text-white md:mt-14">
-                  <TalkItem :talk='talk' />
+                <div
+                    v-for="talk of meetup.talksPrepared"
+                    :key="talk.id"
+                    class="mt-8 space-y-8 font-light leading-normal text-white md:mt-14"
+                >
+                    <TalkItem :talk="talk" />
                 </div>
                 <InnerHtml
-                    class="mt-8 space-y-8 font-light leading-normal text-white md:mt-14 text-xl"
+                    class="mt-8 space-y-8 text-xl font-light leading-normal text-white md:mt-14"
                     :html="meetup.description"
                 />
-                <p class="font-light leading-normal text-white md:mt-14 text-xl">
+                <p class="text-xl font-light leading-normal text-white md:mt-14">
                     Bitte beachte auch unsere
-                    <NuxtLink class="text-lime font-bold hover:underline" data-cursor-hover :to="'/verhaltensregeln'">
-                      Verhaltensregeln
+                    <NuxtLink class="font-bold text-lime hover:underline" data-cursor-hover :to="'/verhaltensregeln'">
+                        Verhaltensregeln
                     </NuxtLink>
                     und den
-                    <NuxtLink class="text-lime font-bold hover:underline" data-cursor-hover :to="'/aufnahmen'">
-                      Hinweis zu Foto- und Videoaufnahmen.
+                    <NuxtLink class="font-bold text-lime hover:underline" data-cursor-hover :to="'/aufnahmen'">
+                        Hinweis zu Foto- und Videoaufnahmen.
                     </NuxtLink>
                 </p>
 
@@ -96,17 +100,15 @@
             </div>
         </section>
 
-        <section v-if='galleryImages.length > 0' class="relative my-16">
-          <ConferenceGallery :images='galleryImages' />
+        <section v-if="galleryImages.length > 0" class="relative my-16">
+            <ConferenceGallery :images="galleryImages" />
         </section>
 
         <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8 md:mb-16 lg:mb-48">
-            <SectionHeading element="h2">
-              Community
-            </SectionHeading>
-            <TestimonialSlider :testimonials='testimonials' />
-          </div>
+            <div class="container mt-16 px-6 md:mb-16 md:mt-28 md:pl-48 lg:mb-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                <SectionHeading element="h2"> Community </SectionHeading>
+                <TestimonialSlider :testimonials="testimonials" />
+            </div>
         </section>
 
         <!-- Related podcasts -->
@@ -121,14 +123,14 @@
 
 <script setup lang="ts">
 import PlayCircleFilledIcon from '~/assets/icons/play-circle-filled.svg'
+import ConferenceGallery from '~/components/ConferenceGallery.vue'
+import TestimonialSlider from '~/components/TestimonialSlider.vue'
 import { useLoadingScreen, useLocaleString } from '~/composables'
 import { useDirectus } from '~/composables/useDirectus'
 import { OPEN_YOUTUBE_EVENT_ID } from '~/config'
 import { getMetaInfo, trackGoal } from '~/helpers'
-import type { DirectusFileItem, DirectusTestimonialItem, MeetupItem, TagItem } from '~/types';
+import type { DirectusFileItem, DirectusTestimonialItem, MeetupItem, TagItem } from '~/types'
 import { computed, type ComputedRef } from 'vue'
-import TestimonialSlider from '~/components/TestimonialSlider.vue';
-import ConferenceGallery from '~/components/ConferenceGallery.vue';
 
 // Add route and router
 const route = useRoute()
@@ -163,15 +165,15 @@ const relatedPodcasts = computed(() => pageData.value?.relatedPodcasts)
 const testimonials: ComputedRef<DirectusTestimonialItem[]> = computed(() => pageData.value?.testimonials || [])
 
 const galleryImages: ComputedRef<DirectusFileItem[]> = computed(() => {
-  let images: DirectusFileItem[] = [];
+    let images: DirectusFileItem[] = []
 
-  if (pageData.value?.meetup?.gallery_images) {
-    images = pageData.value.meetup.gallery_images.map((gallery_image) => {
-      return gallery_image.image;
-    })
-  }
+    if (pageData.value?.meetup?.gallery_images) {
+        images = pageData.value.meetup.gallery_images.map((gallery_image) => {
+            return gallery_image.image
+        })
+    }
 
-  return images;
+    return images
 })
 
 // Convert speaker count to local string
diff --git a/nuxt-app/pages/meetup/index.vue b/nuxt-app/pages/meetup/index.vue
index fba5c53d..8513a89e 100644
--- a/nuxt-app/pages/meetup/index.vue
+++ b/nuxt-app/pages/meetup/index.vue
@@ -22,34 +22,36 @@
         </section>
 
         <!-- Meetups -->
-        <MeetupSection v-if='meetups.length > 0' :heading='meetupPage.meetup_heading' :meetups="meetups" />
+        <MeetupSection v-if="meetups.length > 0" :heading="meetupPage.meetup_heading" :meetups="meetups" />
 
         <section class="relative">
-          <div class="container mt-16 px-6 md:mt-28 md:pl-48 lg:mt-32 lg:pr-8 3xl:px-8 md:mb-16 lg:mb-48">
-            <SectionHeading element="h2">
-              Community
-            </SectionHeading>
-            <TestimonialSlider :testimonials='testimonials' />
-          </div>
+            <div class="container mt-16 px-6 md:mb-16 md:mt-28 md:pl-48 lg:mb-48 lg:mt-32 lg:pr-8 3xl:px-8">
+                <SectionHeading element="h2"> Community </SectionHeading>
+                <TestimonialSlider :testimonials="testimonials" />
+            </div>
         </section>
 
-        <MeetupSection :heading='meetupPage.meetup_heading_past' :meetups="pastMeetups" />
+        <MeetupSection :heading="meetupPage.meetup_heading_past" :meetups="pastMeetups" />
     </div>
 </template>
 
 <script setup lang="ts">
+import TestimonialSlider from '~/components/TestimonialSlider.vue'
 import { useLoadingScreen, usePageMeta } from '~/composables'
 import { useDirectus } from '~/composables/useDirectus'
-import type { DirectusMeetupItem, DirectusMeetupPage, DirectusTestimonialItem } from '~/types';
+import type { DirectusMeetupItem, DirectusMeetupPage, DirectusTestimonialItem } from '~/types'
 import { computed, type ComputedRef } from 'vue'
-import TestimonialSlider from '~/components/TestimonialSlider.vue';
 
 const breadcrumbs = [{ label: 'Meetup' }]
 const directus = useDirectus()
 
 // Query meetup page and meetups
 const { data: pageData } = useAsyncData(async () => {
-    const [meetupPage, meetups, testimonials] = await Promise.all([directus.getMeetupPage(), directus.getMeetups(), directus.getTestimonials()])
+    const [meetupPage, meetups, testimonials] = await Promise.all([
+        directus.getMeetupPage(),
+        directus.getMeetups(),
+        directus.getTestimonials(),
+    ])
 
     const pastMeetups = meetups.filter((meetup) => {
         const now = new Date()
@@ -68,8 +70,12 @@ const { data: pageData } = useAsyncData(async () => {
 
 // Extract about page and members from page data
 const meetupPage: ComputedRef<DirectusMeetupPage | undefined> = computed(() => pageData.value?.meetupPage)
-const meetups: ComputedRef<DirectusMeetupItem[]> = computed(() => pageData.value ? pageData.value.upcomingMeetups : [])
-const pastMeetups: ComputedRef<DirectusMeetupItem[]> = computed(() => pageData.value ? pageData.value.pastMeetups : [])
+const meetups: ComputedRef<DirectusMeetupItem[]> = computed(() =>
+    pageData.value ? pageData.value.upcomingMeetups : []
+)
+const pastMeetups: ComputedRef<DirectusMeetupItem[]> = computed(() =>
+    pageData.value ? pageData.value.pastMeetups : []
+)
 const testimonials: ComputedRef<DirectusTestimonialItem[]> = computed(() => pageData.value?.testimonials || [])
 
 // Set loading screen
diff --git a/nuxt-app/pages/profiles/[slug].vue b/nuxt-app/pages/profiles/[slug].vue
index 33342a7f..1d9f4e09 100644
--- a/nuxt-app/pages/profiles/[slug].vue
+++ b/nuxt-app/pages/profiles/[slug].vue
@@ -1,53 +1,47 @@
 <template>
-    <div v-if="profile" class='text-white'>
-      <h2>Profile</h2>
-      <dl>
-        <dt>ID:</dt>
-        <dd>{{ profile.id }}</dd>
-        <dt>First Name:</dt>
-        <dd>{{ profile.first_name }}</dd>
-        <dt>Last Name:</dt>
-        <dd>{{ profile.last_name }}</dd>
-        <dt>Display Name:</dt>
-        <dd>{{ profile.display_name }}</dd>
-        <dt>Description:</dt>
-        <dd><InnerHtml
-            :html="profile.description"
-          /></dd>
-        <dt>Job Role:</dt>
-        <dd>{{ profile.job_role }}</dd>
-        <dt>Job Employer:</dt>
-        <dd>{{ profile.job_employer }}</dd>
-        <dt>Photo:</dt>
-        <dd>
-          <DirectusImage
-            v-if="profile.profile_image"
-            :image="profile.profile_image"
-          /></dd>
-      </dl>
+    <div v-if="profile" class="text-white">
+        <h2>Profile</h2>
+        <dl>
+            <dt>ID:</dt>
+            <dd>{{ profile.id }}</dd>
+            <dt>First Name:</dt>
+            <dd>{{ profile.first_name }}</dd>
+            <dt>Last Name:</dt>
+            <dd>{{ profile.last_name }}</dd>
+            <dt>Display Name:</dt>
+            <dd>{{ profile.display_name }}</dd>
+            <dt>Description:</dt>
+            <dd><InnerHtml :html="profile.description" /></dd>
+            <dt>Job Role:</dt>
+            <dd>{{ profile.job_role }}</dd>
+            <dt>Job Employer:</dt>
+            <dd>{{ profile.job_employer }}</dd>
+            <dt>Photo:</dt>
+            <dd>
+                <DirectusImage v-if="profile.profile_image" :image="profile.profile_image" />
+            </dd>
+        </dl>
     </div>
 </template>
 
 <script setup lang="ts">
+import DirectusImage from '~/components/DirectusImage.vue'
 import { useLoadingScreen } from '~/composables'
 import { useDirectus } from '~/composables/useDirectus'
 import { getMetaInfo } from '~/helpers'
-import type { DirectusProfileItem } from '~/types';
+import { generateProfile } from '~/helpers/jsonLdGenerator'
+import type { DirectusProfileItem } from '~/types'
 import { computed, type ComputedRef } from 'vue'
-import { generateProfile } from '~/helpers/jsonLdGenerator';
-import DirectusImage from '~/components/DirectusImage.vue';
 
 // Add route and router
 const route = useRoute()
 const directus = useDirectus()
 
 const { data: pageData } = useAsyncData(route.fullPath, async () => {
-    const [profile] = await Promise.all([
-        await directus.getProfileById(route.params.slug as string),
-    ])
+    const [profile] = await Promise.all([await directus.getProfileById(route.params.slug as string)])
 
-  if (!profile) {
-      console.info('No profile found with slug.', route.params.slug as string)
+    if (!profile) {
+        console.info('No profile found with slug.', route.params.slug as string)
     }
 
     return { profile }
diff --git a/nuxt-app/pages/speaker-portal.vue b/nuxt-app/pages/speaker-portal.vue
index 3705f307..0f9c6a25 100644
--- a/nuxt-app/pages/speaker-portal.vue
+++ b/nuxt-app/pages/speaker-portal.vue
@@ -24,8 +24,8 @@
             <div v-else-if="submitted" class="mt-16">
                 <SectionHeading element="h1">Vielen Dank!</SectionHeading>
                 <p class="mt-8 text-xl text-white">
-                    Deine Informationen wurden erfolgreich übermittelt.
-                    Wir melden uns bei dir, sobald wir alles geprüft haben.
+                    Deine Informationen wurden erfolgreich übermittelt. Wir melden uns bei dir, sobald wir alles geprüft
+                    haben.
                 </p>
             </div>
 
@@ -34,20 +34,13 @@
                 <SectionHeading class="mt-8 md:mt-0" element="h1">Speaker Portal</SectionHeading>
 
                 <p class="mt-8 text-lg text-white md:text-xl">
-                    Hallo {{ speaker.first_name }}! Bitte fülle die folgenden Informationen aus,
-                    damit wir dich optimal auf unserer Website präsentieren können.
+                    Hallo {{ speaker.first_name }}! Bitte fülle die folgenden Informationen aus, damit wir dich optimal
+                    auf unserer Website präsentieren können.
                 </p>
 
-                <p v-if="deadline" class="mt-4 text-base text-lime">
-                    Bitte bis {{ formatDate(deadline) }} ausfüllen.
-                </p>
+                <p v-if="deadline" class="mt-4 text-base text-lime">Bitte bis {{ formatDate(deadline) }} ausfüllen.</p>
 
-                <form
-                    class="mt-12 space-y-8"
-                    :class="formState"
-                    novalidate
-                    @submit.prevent="submitForm"
-                >
+                <form class="mt-12 space-y-8" :class="formState" novalidate @submit.prevent="submitForm">
                     <!-- Personal Info Section -->
                     <div class="bg-gray-900 p-6 md:p-8 lg:p-12">
                         <h2 class="mb-6 text-xl font-bold text-lime md:text-2xl">Persönliche Informationen</h2>
@@ -125,14 +118,18 @@
                                 required
                                 maxlength="2000"
                             />
-                            <p class="mt-1 text-sm text-white/60">{{ formData.description?.length || 0 }} / 2000 Zeichen</p>
+                            <p class="mt-1 text-sm text-white/60">
+                                {{ formData.description?.length || 0 }} / 2000 Zeichen
+                            </p>
                         </div>
                     </div>
 
                     <!-- Social Links Section -->
                     <div class="bg-gray-900 p-6 md:p-8 lg:p-12">
                         <h2 class="mb-6 text-xl font-bold text-lime md:text-2xl">Social Media & Links</h2>
-                        <p class="mb-6 text-white/60">Alle Felder sind optional. LinkedIn empfehlen wir besonders, da wir dich dort taggen können.</p>
+                        <p class="mb-6 text-white/60">
+                            Alle Felder sind optional. LinkedIn empfehlen wir besonders, da wir dich dort taggen können.
+                        </p>
 
                         <div class="grid gap-6 md:grid-cols-2">
                             <div>
@@ -295,8 +292,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onBeforeUnmount } from 'vue'
 import { getMetaInfo } from '~/helpers'
+import { onBeforeUnmount, onMounted, ref } from 'vue'
 
 const route = useRoute()
 
@@ -513,10 +510,13 @@ async function submitForm(event: Event) {
         const submitData = new FormData()
 
         submitData.append('token', token)
-        submitData.append('data', JSON.stringify({
-            ...formData.value,
-            occupation: `${formData.value.job_title} at ${formData.value.company}`,
-        }))
+        submitData.append(
+            'data',
+            JSON.stringify({
+                ...formData.value,
+                occupation: `${formData.value.job_title} at ${formData.value.company}`,
+            })
+        )
 
         if (profileImageFile.value) {
             submitData.append('profile_image', profileImageFile.value)
diff --git a/nuxt-app/pages/suche.vue b/nuxt-app/pages/suche.vue
index 00372d37..6dc6afd3 100644
--- a/nuxt-app/pages/suche.vue
+++ b/nuxt-app/pages/suche.vue
@@ -1,69 +1,68 @@
 <template>
-  <div class="relative min-h-screen overflow-hidden md:overflow-unset">
-    <div class="container px-6 pb-20 pt-32 md:pb-32 md:pl-48 md:pt-40 lg:pb-52 lg:pr-8 lg:pt-56 2xl:pt-64 3xl:px-8">
-      <Breadcrumbs :breadcrumbs="breadcrumbs" />
-
-      <SectionHeading class="mt-8 md:mt-0" element="h1"> Suchergebnisse </SectionHeading>
-
-      <!-- Search results -->
-      <GenericLazyList
-        v-if="searchResults?.length"
-        class="mt-12 md:mt-16 lg:mt-28"
-        :items="searchResults"
-        direction="vertical"
-      >
-        <template #default="{ item, viewportItems, addViewportItem }">
-          <GenericListItem
-            :key="item.objectID"
-            class="border-b-1 border-white/70 pb-9 last:border-b-0 last:pb-0 lg:pb-24 [&>:not(first-child)]:mt-10 [&>:not(first-child)]:lg:mt-24"
-            :item="item"
-            :viewport-items="viewportItems"
-            :add-viewport-item="addViewportItem"
-          >
-            <template #default="{ isNewToViewport }">
-              <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
-                <SearchResultCard :item="item"/>
-              </FadeAnimation>
-            </template>
-          </GenericListItem>
-        </template>
-      </GenericLazyList>
-
-      <!-- Algolia logo - necessary for free plans -->
-      <div
-        v-if="searchResults?.length"
-        class="container flex flex-col items-center justify-center w-max mt-15 lg:mt-36"
-        data-cursor-hover
-      >
-        <a href="https://algolia.com" target="_blank" class="h-6">
-          <component :is="AlgoliaIcon" />
-        </a>
-      </div>
-
-      <!-- Search figure -->
-      <div
-        v-if="!searchText && !searchResults?.length"
-        class="mt-20 flex h-full flex-col items-center justify-center space-y-6 md:mt-32 md:space-y-8 lg:mt-52 lg:space-y-10"
-      >
-        <SearchFigureIcon class="h-32 md:h-44 lg:h-60" />
-        <p class="text-center text-base font-semibold text-lime md:text-lg lg:text-2xl">Wonach suchst du?</p>
-      </div>
+    <div class="relative min-h-screen overflow-hidden md:overflow-unset">
+        <div class="container px-6 pb-20 pt-32 md:pb-32 md:pl-48 md:pt-40 lg:pb-52 lg:pr-8 lg:pt-56 2xl:pt-64 3xl:px-8">
+            <Breadcrumbs :breadcrumbs="breadcrumbs" />
+
+            <SectionHeading class="mt-8 md:mt-0" element="h1"> Suchergebnisse </SectionHeading>
+
+            <!-- Search results -->
+            <GenericLazyList
+                v-if="searchResults?.length"
+                class="mt-12 md:mt-16 lg:mt-28"
+                :items="searchResults"
+                direction="vertical"
+            >
+                <template #default="{ item, viewportItems, addViewportItem }">
+                    <GenericListItem
+                        :key="item.objectID"
+                        class="border-b-1 border-white/70 pb-9 last:border-b-0 last:pb-0 lg:pb-24 [&>:not(first-child)]:mt-10 [&>:not(first-child)]:lg:mt-24"
+                        :item="item"
+                        :viewport-items="viewportItems"
+                        :add-viewport-item="addViewportItem"
+                    >
+                        <template #default="{ isNewToViewport }">
+                            <FadeAnimation :fade-in="isNewToViewport ? 'from_right' : 'none'">
+                                <SearchResultCard :item="item" />
+                            </FadeAnimation>
+                        </template>
+                    </GenericListItem>
+                </template>
+            </GenericLazyList>
+
+            <!-- Algolia logo - necessary for free plans -->
+            <div
+                v-if="searchResults?.length"
+                class="mt-15 container flex w-max flex-col items-center justify-center lg:mt-36"
+                data-cursor-hover
+            >
+                <a href="https://algolia.com" target="_blank" class="h-6">
+                    <component :is="AlgoliaIcon" />
+                </a>
+            </div>
+
+            <!-- Search figure -->
+            <div
+                v-if="!searchText && !searchResults?.length"
+                class="mt-20 flex h-full flex-col items-center justify-center space-y-6 md:mt-32 md:space-y-8 lg:mt-52 lg:space-y-10"
+            >
+                <SearchFigureIcon class="h-32 md:h-44 lg:h-60" />
+                <p class="text-center text-base font-semibold text-lime md:text-lg lg:text-2xl">Wonach suchst du?</p>
+            </div>
+        </div>
     </div>
-  </div>
 </template>
 
 <script setup lang="ts">
-import AlgoliaIcon from '~/assets/logos/algolia-logo-white.svg'
 import SearchFigureIcon from '~/assets/images/search-figure.svg'
+import AlgoliaIcon from '~/assets/logos/algolia-logo-white.svg'
 import GenericLazyList from '~/components/GenericLazyList.vue'
 import GenericListItem from '~/components/GenericListItem.vue'
+import SearchResultCard from '~/components/SearchResultCard.vue'
 import { useLoadingScreen } from '~/composables'
+import { ALGOLIA_INDEX } from '~/config'
 import { getMetaInfo } from '~/helpers'
-import { computed, watch, ref } from 'vue'
-
+import { computed, ref, watch } from 'vue'
 import { useRoute as useNativeRoute } from 'vue-router'
-import SearchResultCard from '~/components/SearchResultCard.vue'
-import { ALGOLIA_INDEX } from '~/config'
 
 // Add route
 const route = useRoute()
diff --git a/nuxt-app/pages/ticket-portal.vue b/nuxt-app/pages/ticket-portal.vue
index 513e0cc1..074564f5 100644
--- a/nuxt-app/pages/ticket-portal.vue
+++ b/nuxt-app/pages/ticket-portal.vue
@@ -24,8 +24,8 @@
             <div v-else-if="submitted" class="mt-16">
                 <SectionHeading element="h1">Vielen Dank!</SectionHeading>
                 <p class="mt-8 text-xl text-white">
-                    Deine Angaben wurden erfolgreich gespeichert.
-                    Dein Ticket mit QR-Code wird dir in Kürze per E-Mail zugeschickt.
+                    Deine Angaben wurden erfolgreich gespeichert. Dein Ticket mit QR-Code wird dir in Kürze per E-Mail
+                    zugeschickt.
                 </p>
             </div>
 
@@ -34,16 +34,11 @@
                 <SectionHeading class="mt-8 md:mt-0" element="h1">Ticket vervollständigen</SectionHeading>
 
                 <p class="mt-8 text-lg text-white md:text-xl">
-                    Hallo {{ ticket.attendee_first_name }}! Bitte vervollständige deine Angaben,
-                    damit wir dir dein finales Ticket für die {{ ticket.conference_title }} zusenden können.
+                    Hallo {{ ticket.attendee_first_name }}! Bitte vervollständige deine Angaben, damit wir dir dein
+                    finales Ticket für die {{ ticket.conference_title }} zusenden können.
                 </p>
 
-                <form
-                    class="mt-12 space-y-8"
-                    :class="formState"
-                    novalidate
-                    @submit.prevent="submitForm"
-                >
+                <form class="mt-12 space-y-8" :class="formState" novalidate @submit.prevent="submitForm">
                     <!-- Personal Info Section -->
                     <div class="bg-gray-900 p-6 md:p-8 lg:p-12">
                         <h2 class="mb-6 text-xl font-bold text-lime md:text-2xl">Persönliche Informationen</h2>
@@ -185,8 +180,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
 import { getMetaInfo } from '~/helpers'
+import { onMounted, ref } from 'vue'
 
 const route = useRoute()
 
diff --git a/nuxt-app/plugins/vue-json-pretty.js b/nuxt-app/plugins/vue-json-pretty.js
index 124f8423..200e3d7f 100644
--- a/nuxt-app/plugins/vue-json-pretty.js
+++ b/nuxt-app/plugins/vue-json-pretty.js
@@ -1,4 +1,4 @@
 import Vue from 'vue'
 import VueJsonPretty from 'vue-json-pretty'
 
-Vue.component("VueJsonPretty", VueJsonPretty)
+Vue.component('VueJsonPretty', VueJsonPretty)
diff --git a/nuxt-app/server/api/checkin/scan.post.ts b/nuxt-app/server/api/checkin/scan.post.ts
index 74c2e1ee..5492f0f6 100644
--- a/nuxt-app/server/api/checkin/scan.post.ts
+++ b/nuxt-app/server/api/checkin/scan.post.ts
@@ -23,7 +23,10 @@ export default defineEventHandler(async (event) => {
     try {
         ticket = await directus.getTicketByCode(ticketCode)
     } catch (err: any) {
-        throw createError({ statusCode: 500, message: `Failed to look up ticket: ${JSON.stringify(err?.errors || err?.message || err)}` })
+        throw createError({
+            statusCode: 500,
+            message: `Failed to look up ticket: ${JSON.stringify(err?.errors || err?.message || err)}`,
+        })
     }
 
     if (!ticket) {
@@ -53,7 +56,10 @@ export default defineEventHandler(async (event) => {
             checked_in_at: new Date().toISOString(),
         } as any)
     } catch (err: any) {
-        throw createError({ statusCode: 500, message: `Failed to update ticket: ${JSON.stringify(err?.errors || err?.message || err)}` })
+        throw createError({
+            statusCode: 500,
+            message: `Failed to update ticket: ${JSON.stringify(err?.errors || err?.message || err)}`,
+        })
     }
 
     return {
diff --git a/nuxt-app/server/api/checkin/stats.get.ts b/nuxt-app/server/api/checkin/stats.get.ts
index 3e198045..46fcccda 100644
--- a/nuxt-app/server/api/checkin/stats.get.ts
+++ b/nuxt-app/server/api/checkin/stats.get.ts
@@ -7,7 +7,10 @@ export default defineEventHandler(async (event) => {
     try {
         conference = await directus.getLatestConferenceWithTicketing()
     } catch (err: any) {
-        throw createError({ statusCode: 500, message: `Failed to fetch conference: ${JSON.stringify(err?.errors || err?.message || err)}` })
+        throw createError({
+            statusCode: 500,
+            message: `Failed to fetch conference: ${JSON.stringify(err?.errors || err?.message || err)}`,
+        })
     }
 
     if (!conference) {
diff --git a/nuxt-app/server/api/email.post.ts b/nuxt-app/server/api/email.post.ts
index 4c347b13..ca587adf 100644
--- a/nuxt-app/server/api/email.post.ts
+++ b/nuxt-app/server/api/email.post.ts
@@ -1,5 +1,5 @@
+import { filterSpam } from '../../helpers'
 import { EmailSchema, sendEmail } from '../utils'
-import { filterSpam } from '../../helpers';
 
 export default defineEventHandler(async (event) => {
     // Read body once and use for both honeypot check and validation
@@ -21,14 +21,14 @@ export default defineEventHandler(async (event) => {
     }
     const clientData = parseResult.data
 
-    const spamValidation = await filterSpam(clientData);
+    const spamValidation = await filterSpam(clientData)
 
     if (spamValidation.isSpam === true && spamValidation.confidenceScore > 0.8) {
-      console.log(`Spam blocked. Reason: ${spamValidation.reason}`);
-      throw createError({
-        statusCode: 400,
-        statusMessage: 'Nachricht konnte nicht versendet werden.',
-      });
+        console.log(`Spam blocked. Reason: ${spamValidation.reason}`)
+        throw createError({
+            statusCode: 400,
+            statusMessage: 'Nachricht konnte nicht versendet werden.',
+        })
     }
 
     // Send email with user's message to us
diff --git a/nuxt-app/server/api/speaker-portal/validate.get.ts b/nuxt-app/server/api/speaker-portal/validate.get.ts
index 89954d88..b318fa0a 100644
--- a/nuxt-app/server/api/speaker-portal/validate.get.ts
+++ b/nuxt-app/server/api/speaker-portal/validate.get.ts
@@ -34,7 +34,8 @@ export default defineEventHandler(async (event) => {
         if (speaker.portal_submission_status === 'submitted' || speaker.portal_submission_status === 'approved') {
             throw createError({
                 statusCode: 409,
-                message: 'Du hast deine Informationen bereits eingereicht. Kontaktiere uns, falls du Änderungen vornehmen möchtest.',
+                message:
+                    'Du hast deine Informationen bereits eingereicht. Kontaktiere uns, falls du Änderungen vornehmen möchtest.',
             })
         }
 
diff --git a/nuxt-app/server/api/tickets/create-checkout.post.ts b/nuxt-app/server/api/tickets/create-checkout.post.ts
index cf1e52e5..9048cbcb 100644
--- a/nuxt-app/server/api/tickets/create-checkout.post.ts
+++ b/nuxt-app/server/api/tickets/create-checkout.post.ts
@@ -1,11 +1,11 @@
+import { VAT_RATE, VAT_RATE_PERCENT, WEBSITE_URL } from '~/config'
+import type { DirectusTicketOrderItem, TicketType } from '~/types/directus'
+import type { TicketAttendee } from '~/types/items'
 import type Stripe from 'stripe'
 import { CreateCheckoutSchema } from '../../utils/schema'
+import type { CreateCheckoutInput } from '../../utils/schema'
 import { getStripe } from '../../utils/stripe'
 import { isEarlyBirdPeriod } from '../../utils/ticketSettings'
-import { VAT_RATE, VAT_RATE_PERCENT, WEBSITE_URL } from '~/config'
-import type { TicketType, DirectusTicketOrderItem } from '~/types/directus'
-import type { TicketAttendee } from '~/types/items'
-import type { CreateCheckoutInput } from '../../utils/schema'
 
 function generateOrderNumber(): string {
     const year = new Date().getFullYear()
@@ -19,16 +19,12 @@ interface ConferencePricing {
     ticket_early_bird_deadline: string | null
 }
 
-function calculatePricing(
-    conference: ConferencePricing,
-    ticketCount: number,
-    discountPriceCents: number | null
-) {
+function calculatePricing(conference: ConferencePricing, ticketCount: number, discountPriceCents: number | null) {
     const isEarlyBird = isEarlyBirdPeriod(conference.ticket_early_bird_deadline)
     const basePriceCents =
         isEarlyBird && conference.ticket_early_bird_price_cents
             ? conference.ticket_early_bird_price_cents
-            : conference.ticket_regular_price_cents ?? 0
+            : (conference.ticket_regular_price_cents ?? 0)
 
     let unitPriceNetCents: number
     let ticketType: TicketType
@@ -44,14 +40,9 @@ function calculatePricing(
         ticketType = 'regular'
     }
 
-    const discountAmountCents =
-        discountPriceCents !== null
-            ? ticketCount * (basePriceCents - discountPriceCents)
-            : 0
+    const discountAmountCents = discountPriceCents !== null ? ticketCount * (basePriceCents - discountPriceCents) : 0
     const subtotalNetCents =
-        discountPriceCents !== null
-            ? ticketCount * basePriceCents
-            : ticketCount * unitPriceNetCents
+        discountPriceCents !== null ? ticketCount * basePriceCents : ticketCount * unitPriceNetCents
     const totalNetCents = subtotalNetCents - discountAmountCents
 
     // Calculate gross unit price for Stripe line items (round per-ticket for consistency)
diff --git a/nuxt-app/server/api/tickets/webhook.post.ts b/nuxt-app/server/api/tickets/webhook.post.ts
index 0ac07a2d..7eae07ec 100644
--- a/nuxt-app/server/api/tickets/webhook.post.ts
+++ b/nuxt-app/server/api/tickets/webhook.post.ts
@@ -1,5 +1,5 @@
-import { verifyWebhookSignature } from '../../utils/stripe'
 import type Stripe from 'stripe'
+import { verifyWebhookSignature } from '../../utils/stripe'
 
 /**
  * Stripe webhook handler for ticket purchases.
diff --git a/nuxt-app/server/api/vote.post.ts b/nuxt-app/server/api/vote.post.ts
index eba321f4..bb03fc8f 100644
--- a/nuxt-app/server/api/vote.post.ts
+++ b/nuxt-app/server/api/vote.post.ts
@@ -1,5 +1,5 @@
-import { VoteSchema } from '../utils'
 import { useDirectus } from '~/composables/useDirectus'
+import { VoteSchema } from '../utils'
 
 // The only path that writes a vote. The GET /podcast/[slug]/[up|down] links that
 // ship in RSS show notes no longer write — they redirect to the podcast page,
@@ -28,9 +28,7 @@ export default defineEventHandler(async (event) => {
 
     // Split x-forwarded-for on comma and take the first entry (the client IP)
     const xForwardedFor = event.node.req.headers['x-forwarded-for'] as string | undefined
-    const rawIP = xForwardedFor
-        ? xForwardedFor.split(',')[0].trim()
-        : event.node.req.socket.remoteAddress
+    const rawIP = xForwardedFor ? xForwardedFor.split(',')[0].trim() : event.node.req.socket.remoteAddress
     const userAgent = event.node.req.headers['user-agent']
     const referrer = event.node.req.headers['referer']
 
diff --git a/nuxt-app/server/middleware/cocktails.ts b/nuxt-app/server/middleware/cocktails.ts
index a6d88d0f..14143406 100644
--- a/nuxt-app/server/middleware/cocktails.ts
+++ b/nuxt-app/server/middleware/cocktails.ts
@@ -1,29 +1,27 @@
+import { useDirectus } from '~/composables/useDirectus'
 import type { H3Event } from 'h3'
-
 import { defineEventHandler, getHeader } from 'h3'
-import { useDirectus } from '~/composables/useDirectus'
 
 const directus = useDirectus()
 
 export default defineEventHandler(async (event) => {
-  if (event.path !== '/api/cocktails') return
+    if (event.path !== '/api/cocktails') return
 
-  const accept = (getHeader(event, 'accept') || '').toLowerCase()
-  const wantsOnlyJson =
-    accept.includes('application/json') && !accept.includes('text/html')
+    const accept = (getHeader(event, 'accept') || '').toLowerCase()
+    const wantsOnlyJson = accept.includes('application/json') && !accept.includes('text/html')
 
-  if (!wantsOnlyJson) {
-    return
-  }
+    if (!wantsOnlyJson) {
+        return
+    }
 
-  // Be a good citizen: content negotiation varies on Accept
-  event.node.res.setHeader('Vary', 'Accept')
+    // Be a good citizen: content negotiation varies on Accept
+    event.node.res.setHeader('Vary', 'Accept')
 
-  const cocktails = await directus.getCocktailMenu();
-  if (cocktails !== null && typeof cocktails === 'object' && cocktails.status !== 'published') {
-    cocktails.menu = JSON.parse('{"error": "No cocktails available"}')
-  }
+    const cocktails = await directus.getCocktailMenu()
+    if (cocktails !== null && typeof cocktails === 'object' && cocktails.status !== 'published') {
+        cocktails.menu = JSON.parse('{"error": "No cocktails available"}')
+    }
 
-  // Return your JSON payload
-  return cocktails.menu;
+    // Return your JSON payload
+    return cocktails.menu
 })
diff --git a/nuxt-app/server/middleware/rating.ts b/nuxt-app/server/middleware/rating.ts
index 879d072e..d9165423 100644
--- a/nuxt-app/server/middleware/rating.ts
+++ b/nuxt-app/server/middleware/rating.ts
@@ -4,19 +4,19 @@
 // podcast page, whose client-side script POSTs /api/vote. Crawlers follow the
 // redirect but don't run JS, so they never register a vote.
 export default eventHandler(function (event) {
-  const requestPath = event.path
-  if (!requestPath.startsWith('/podcast/')) {
-    return
-  }
+    const requestPath = event.path
+    if (!requestPath.startsWith('/podcast/')) {
+        return
+    }
 
-  // Path pattern "/podcast/[slug]/[up|down]"
-  const match = requestPath.match(/^\/podcast\/([^/]+)\/(up|down)$/)
-  if (!match) {
-    return
-  }
+    // Path pattern "/podcast/[slug]/[up|down]"
+    const match = requestPath.match(/^\/podcast\/([^/]+)\/(up|down)$/)
+    if (!match) {
+        return
+    }
 
-  const slug = match[1]
-  const direction = match[2]
+    const slug = match[1]
+    const direction = match[2]
 
-  return sendRedirect(event, `/podcast/${slug}?vote=${direction}`, 302)
+    return sendRedirect(event, `/podcast/${slug}?vote=${direction}`, 302)
 })
diff --git a/nuxt-app/server/utils/redirects.ts b/nuxt-app/server/utils/redirects.ts
index 841f3056..93e71568 100644
--- a/nuxt-app/server/utils/redirects.ts
+++ b/nuxt-app/server/utils/redirects.ts
@@ -1,5 +1,3 @@
-import type { H3Event } from 'h3'
-import { getOS } from '~/helpers'
 import {
     CONFERENCE_VANITY_HOSTS,
     DISCORD_INVITE_LINK,
@@ -7,6 +5,8 @@ import {
     PROGRAMMIER_CON_APP_IOS,
     WEBFINGER_HOST,
 } from '~/config'
+import { getOS } from '~/helpers'
+import type { H3Event } from 'h3'
 
 function hostStartsWithAny(host: string, prefixes: readonly string[]): boolean {
     return prefixes.some((prefix) => host.startsWith(prefix))
diff --git a/nuxt-app/server/utils/schema.ts b/nuxt-app/server/utils/schema.ts
index 3bc1ef6b..bf0aaecb 100644
--- a/nuxt-app/server/utils/schema.ts
+++ b/nuxt-app/server/utils/schema.ts
@@ -78,10 +78,7 @@ export const BillingAddressSchema = z.object({
         .min(1, 'Bitte trage die Straße und Hausnummer ein.')
         .max(200, 'Die Adresszeile darf nicht länger als 200 Zeichen sein.'),
     line2: z.string().max(200, 'Die Adresszeile darf nicht länger als 200 Zeichen sein.').optional(),
-    city: z
-        .string()
-        .min(1, 'Bitte trage die Stadt ein.')
-        .max(100, 'Die Stadt darf nicht länger als 100 Zeichen sein.'),
+    city: z.string().min(1, 'Bitte trage die Stadt ein.').max(100, 'Die Stadt darf nicht länger als 100 Zeichen sein.'),
     postalCode: z
         .string()
         .min(1, 'Bitte trage die Postleitzahl ein.')
@@ -116,10 +113,7 @@ export const CompanyBillingSchema = z.object({
             .max(200, 'Die E-Mail-Adresse darf nicht länger als 200 Zeichen sein.')
             .optional()
     ),
-    vatId: z
-        .string()
-        .max(50, 'Die USt-IdNr. darf nicht länger als 50 Zeichen sein.')
-        .optional(),
+    vatId: z.string().max(50, 'Die USt-IdNr. darf nicht länger als 50 Zeichen sein.').optional(),
 })
 
 export const CreateCheckoutSchema = z
diff --git a/nuxt-app/server/utils/stripe.ts b/nuxt-app/server/utils/stripe.ts
index 773fae97..56337531 100644
--- a/nuxt-app/server/utils/stripe.ts
+++ b/nuxt-app/server/utils/stripe.ts
@@ -20,10 +20,7 @@ export function getStripe(): Stripe {
 /**
  * Verify a Stripe webhook signature.
  */
-export function verifyWebhookSignature(
-    body: string | Buffer,
-    signature: string
-): Stripe.Event {
+export function verifyWebhookSignature(body: string | Buffer, signature: string): Stripe.Event {
     const config = useRuntimeConfig()
     if (!config.stripeWebhookSecret) {
         throw new Error('NUXT_STRIPE_WEBHOOK_SECRET is not configured')
diff --git a/nuxt-app/types/items.ts b/nuxt-app/types/items.ts
index d71e26b3..a7df8cca 100644
--- a/nuxt-app/types/items.ts
+++ b/nuxt-app/types/items.ts
@@ -1,11 +1,11 @@
 import type {
-  DirectusMeetupItem,
-  DirectusPodcastItem,
-  DirectusConferenceItem,
-  DirectusSpeakerItem,
-  DirectusMemberItem,
-  PurchaseType,
-} from '~/types/directus';
+    DirectusConferenceItem,
+    DirectusMeetupItem,
+    DirectusMemberItem,
+    DirectusPodcastItem,
+    DirectusSpeakerItem,
+    PurchaseType,
+} from '~/types/directus'
 
 export type LatestPodcastItem = Pick<
     DirectusPodcastItem,
@@ -29,11 +29,11 @@ interface PreparedSpeakersItem {
 }
 
 interface PreparedTalksItem {
-  talksPrepared: TalkItem[]
+    talksPrepared: TalkItem[]
 }
 
 interface PreparedPartnersItem {
-  partnersPrepared: PartnerItem[]
+    partnersPrepared: PartnerItem[]
 }
 
 interface PreparedPodcastsItems {
@@ -41,8 +41,9 @@ interface PreparedPodcastsItems {
 }
 
 export interface PodcastItem extends DirectusPodcastItem, PreparedTagsItem, PreparedSpeakersItem {}
- export interface MeetupItem extends DirectusMeetupItem, PreparedTagsItem, PreparedSpeakersItem, PreparedTalksItem {}
-export interface ConferenceItem extends DirectusConferenceItem, PreparedSpeakersItem, PreparedTalksItem, PreparedPartnersItem {}
+export interface MeetupItem extends DirectusMeetupItem, PreparedTagsItem, PreparedSpeakersItem, PreparedTalksItem {}
+export interface ConferenceItem
+    extends DirectusConferenceItem, PreparedSpeakersItem, PreparedTalksItem, PreparedPartnersItem {}
 export interface SpeakerItem extends DirectusSpeakerItem, PreparedTagsItem, PreparedPodcastsItems {}
 
 export interface MemberItem {
@@ -69,30 +70,30 @@ export interface MemberItem {
 }
 
 export interface TalkItem {
-  id: string
-  title: string
-  abstract: string
-  thumbnail: FileItem | null
-  video_url: string
-  members: {
-    id: number
-    podcast: DirectusPodcastItem
-    member: DirectusMemberItem
-    sort: number
-  }[]
-  speakers: {
-    id: number
-    podcast: DirectusPodcastItem
-    speaker: DirectusSpeakerItem
-    sort: number
-  }[]
+    id: string
+    title: string
+    abstract: string
+    thumbnail: FileItem | null
+    video_url: string
+    members: {
+        id: number
+        podcast: DirectusPodcastItem
+        member: DirectusMemberItem
+        sort: number
+    }[]
+    speakers: {
+        id: number
+        podcast: DirectusPodcastItem
+        speaker: DirectusSpeakerItem
+        sort: number
+    }[]
 }
 
 export interface PartnerItem {
-  id: string
-  name: string
-  image: FileItem | null
-  url: string
+    id: string
+    name: string
+    image: FileItem | null
+    url: string
 }
 
 export interface SpeakerPreviewItem {
@@ -162,35 +163,37 @@ export interface DirectusProfileItem {
 }
 
 export enum DirectusTranscriptItemServices {
-  Deepgram = 'deepgram',
+    Deepgram = 'deepgram',
 }
 
 interface DeepgramTranscriptResponse {
-  results: {
-    utterances: [{
-      transcript: string,
-      speaker: string,
-      words: [
-        {
-          punctuated_word: string,
-          start: number,
-          speaker: string,
-        }
-      ]
-    }]
-  }
+    results: {
+        utterances: [
+            {
+                transcript: string
+                speaker: string
+                words: [
+                    {
+                        punctuated_word: string
+                        start: number
+                        speaker: string
+                    },
+                ]
+            },
+        ]
+    }
 }
 
 export interface DirectusTranscriptItem {
-  id: string
-  date_updated: string
-  status: string
-  podcast: DirectusPodcastItem
-  podcast_audio_file: FileItem
-  speakers: [{name: string, identifier: string}]
-  service: DirectusTranscriptItemServices,
-  supported_features: string[]
-  raw_response: null | DeepgramTranscriptResponse
+    id: string
+    date_updated: string
+    status: string
+    podcast: DirectusPodcastItem
+    podcast_audio_file: FileItem
+    speakers: [{ name: string; identifier: string }]
+    service: DirectusTranscriptItemServices
+    supported_features: string[]
+    raw_response: null | DeepgramTranscriptResponse
 }
 
 // Ticket checkout types
diff --git a/nuxt-app/types/search.ts b/nuxt-app/types/search.ts
index 869dd9e6..7cad5771 100644
--- a/nuxt-app/types/search.ts
+++ b/nuxt-app/types/search.ts
@@ -1,36 +1,38 @@
 import type { MeetupItem, PickOfTheDayItem, PodcastItem, SpeakerItem } from './items'
 
-export interface PodcastSearchItem
-    extends Pick<
-        PodcastItem,
-        'id' | 'slug' | 'published_on' | 'type' | 'number' | 'title' | 'description' | 'cover_image' | 'tags'
-    > {
+export interface PodcastSearchItem extends Pick<
+    PodcastItem,
+    'id' | 'slug' | 'published_on' | 'type' | 'number' | 'title' | 'description' | 'cover_image' | 'tags'
+> {
     item_type: 'podcast'
 }
 
-export interface MeetupSearchItem
-    extends Pick<MeetupItem, 'id' | 'slug' | 'published_on' | 'title' | 'description' | 'cover_image' | 'tags'> {
+export interface MeetupSearchItem extends Pick<
+    MeetupItem,
+    'id' | 'slug' | 'published_on' | 'title' | 'description' | 'cover_image' | 'tags'
+> {
     item_type: 'meetup'
 }
 
-export interface PickOfTheDaySearchItem
-    extends Pick<PickOfTheDayItem, 'id' | 'published_on' | 'name' | 'website_url' | 'description' | 'image' | 'tags'> {
+export interface PickOfTheDaySearchItem extends Pick<
+    PickOfTheDayItem,
+    'id' | 'published_on' | 'name' | 'website_url' | 'description' | 'image' | 'tags'
+> {
     item_type: 'pick_of_the_day'
 }
 
-export interface SpeakerSearchItem
-    extends Pick<
-        SpeakerItem,
-        | 'id'
-        | 'slug'
-        | 'published_on'
-        | 'academic_title'
-        | 'first_name'
-        | 'last_name'
-        | 'description'
-        | 'profile_image'
-        | 'tags'
-    > {
+export interface SpeakerSearchItem extends Pick<
+    SpeakerItem,
+    | 'id'
+    | 'slug'
+    | 'published_on'
+    | 'academic_title'
+    | 'first_name'
+    | 'last_name'
+    | 'description'
+    | 'profile_image'
+    | 'tags'
+> {
     item_type: 'speaker'
 }
 

From f5cf6730d80f7f83ddce5183276c45315e12c93d Mon Sep 17 00:00:00 2001
From: Jan Gregor Emge-Triebel <emge.triebel@lotum.de>
Date: Tue, 4 Aug 2026 15:05:23 +0200
Subject: [PATCH 2/4] Gate formatting in CI, and fix the editor config that
 fought it
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds `prettier:check` and runs it in the nuxt-app job. --check writes
nothing and exits non-zero; the existing `prettier` script would "pass" by
mutating the working tree, which is the same trap the ESLint step already
documents.

Without this, formatting is voluntary — and voluntary is how 90 files
drifted after Phase 2's prettier 3.2.5 -> 3.9.6 with nothing noticing.

nuxt-app/.editorconfig said indent_size = 2 while .prettierrc says
tabWidth: 4. Editors read both, so they indented at 2 and the formatter
immediately widened to 4. Corrected, plus max_line_length to match
printWidth. A root .editorconfig is not the fix: nuxt-app and the Directus
extension both set root = true, so a file above them is never read.

No pre-commit hook. Everything here arrives via PR where CI runs, hooks are
bypassable and absent in fresh clones (including agent commits), so a hook
would be a second mechanism for one guarantee.

Also drops the deprecated jsxBracketSameLine, which printed a warning on
every run. Verified inert: removing it changed no file.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JkKMceYAzAYLrSyC42FWTf
---
 .github/workflows/run_tests.yml |  6 ++++++
 AGENTS.md                       | 16 ++++++++++++++++
 nuxt-app/.editorconfig          |  7 ++++++-
 nuxt-app/.prettierrc            |  1 -
 nuxt-app/package.json           |  1 +
 5 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/run_tests.yml b/.github/workflows/run_tests.yml
index a497fe1e..54033864 100644
--- a/.github/workflows/run_tests.yml
+++ b/.github/workflows/run_tests.yml
@@ -53,6 +53,12 @@ jobs:
       - name: Install dependencies
         run: npm ci
 
+      # Keep `prettier:check`, not `prettier` — the latter writes, so it would pass by mutating.
+      # Without this step formatting is voluntary, which is how 90 files drifted after the Prettier
+      # 3.2 -> 3.9 bump in Phase 2 with nothing noticing.
+      - name: Check formatting
+        run: npm run prettier:check
+
       # Keep `lint`, not `eslint` — the latter runs with --fix, so it mutates instead of failing.
       - name: Run ESLint
         run: npm run lint
diff --git a/AGENTS.md b/AGENTS.md
index a3afe170..24c96620 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -111,6 +111,22 @@ Additional hints can be found in:
 - **Imports**: Auto-sorted, use `type` keyword for type-only imports
 - **Components**: PascalCase, single-word names allowed
 
+### Formatting is enforced, not requested
+
+CI runs `npm run prettier:check` in `nuxt-app`, so unformatted code fails the build. Nobody should be
+expected to remember the formatter — turn on **format on save** and it never comes up:
+
+- **WebStorm**: Settings → Languages & Frameworks → JavaScript → Prettier → *On save*
+- **VS Code**: the Prettier extension, plus `"editor.formatOnSave": true`
+
+Both read `nuxt-app/.prettierrc` on their own, and `nuxt-app/.editorconfig` covers indentation and line
+endings before that is set up. Keep those two in step — they overlap, and an editor that indents to a
+different width than Prettier produces a diff on every save. If a PR fails the check, `npm run prettier`
+fixes it — never hand-edit to satisfy it.
+
+Note that `npm run lint` (ESLint) needs `nuxt prepare` to have run first, since `eslint.config.mjs`
+extends the generated `.nuxt/eslint.config.mjs`. `npm ci` does this via `postinstall`.
+
 ## Key Patterns
 
 ### Type System
diff --git a/nuxt-app/.editorconfig b/nuxt-app/.editorconfig
index 5d126348..93633713 100644
--- a/nuxt-app/.editorconfig
+++ b/nuxt-app/.editorconfig
@@ -1,9 +1,14 @@
 # editorconfig.org
+#
+# Keep in step with .prettierrc — Prettier is the source of truth and CI runs `npm run
+# prettier:check`. This file exists so an editor indents correctly *before* the formatter runs; where
+# the two disagree, the editor loses and every save produces a diff.
 root = true
 
 [*]
 indent_style = space
-indent_size = 2
+indent_size = 4
+max_line_length = 120
 end_of_line = lf
 charset = utf-8
 trim_trailing_whitespace = true
diff --git a/nuxt-app/.prettierrc b/nuxt-app/.prettierrc
index 2bab4db0..59c69a76 100755
--- a/nuxt-app/.prettierrc
+++ b/nuxt-app/.prettierrc
@@ -9,7 +9,6 @@
     "jsxSingleQuote": false,
     "trailingComma": "es5",
     "bracketSpacing": true,
-    "jsxBracketSameLine": false,
     "arrowParens": "always",
     "endOfLine": "lf"
 }
diff --git a/nuxt-app/package.json b/nuxt-app/package.json
index 523ba5fd..931f07e8 100644
--- a/nuxt-app/package.json
+++ b/nuxt-app/package.json
@@ -13,6 +13,7 @@
         "eslint": "eslint --fix .",
         "lint": "eslint .",
         "prettier": "prettier . --write",
+        "prettier:check": "prettier . --check",
         "typecheck": "nuxt prepare && vue-tsc --noEmit -p .nuxt/tsconfig.json",
         "typecheck:ratchet": "node scripts/typecheck-ratchet.mjs",
         "test": "vitest run",

From f982654fbfce4685b090ed454913de72d1a42f37 Mon Sep 17 00:00:00 2001
From: Jan Gregor Emge-Triebel <emge.triebel@lotum.de>
Date: Tue, 4 Aug 2026 15:05:23 +0200
Subject: [PATCH 3/4] Plan: record the sweep, the gate, and the missing branch
 protection

Documents how a 90-file reformat was verified, given that none of the gates
can see a formatter change: 11 routes fetched from local production builds
before and after, 10 byte-identical once source-derived hashes were masked
and class tokens sorted.

Four detectors were built and discarded first; each mask narrows
sensitivity, so the final one asserts it can still see an added class, a
removed class, a changed attribute and inline whitespace. The single real
difference (a line break putting text on its own line) was measured in
Chromium with a positive control that shifts 4.12px.

Also records two corrections to claims made earlier in this document: that
"sweep after stripe" had the order backwards, and that "this repo has no
.editorconfig" came from checking only the repo root when two existed.

And that main has no branch protection, so no CI check has ever blocked a
merge. Phase 0 made upgrades detectable, not unmergeable.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JkKMceYAzAYLrSyC42FWTf
---
 docs/dependency-upgrade-plan.md | 143 ++++++++++++++++++++++++++++----
 1 file changed, 127 insertions(+), 16 deletions(-)

diff --git a/docs/dependency-upgrade-plan.md b/docs/dependency-upgrade-plan.md
index b42963cd..c7090862 100644
--- a/docs/dependency-upgrade-plan.md
+++ b/docs/dependency-upgrade-plan.md
@@ -40,6 +40,7 @@ each phase leaves the app in a shippable state and can be reverted on its own.
 | 5 | Ecosystem majors (Pinia, ESLint, Zod, Directus SDK, Stripe, DOMPurify) | 🔄 In progress — 5 of 7 done, 1 **reverted upstream**; only `stripe` left; **audit at zero** |
 | 6 | Deferred: Tailwind 4, Node 24 | ⬜ Deliberately deferred |
 | — | [Registry sweep and the formatter bump](#registry-sweep-and-the-formatter-bump--done-2026-08-04) | ✅ Done (2026-08-04) |
+| — | [Prettier sweep + format gate](#the-prettier-sweep-and-the-format-gate--done-2026-08-04) | ✅ Done (2026-08-04) |
 | — | [After the plan — follow-up backlog](#after-the-plan--follow-up-backlog) | 📋 Consolidated, unscheduled |
 
 Each phase's own write-up ends with what it deliberately left behind. Those are also gathered into
@@ -1521,6 +1522,100 @@ Worth stating plainly: **none of those four gates can see a formatter change.**
 check in CI (see the backlog item below), so what actually verified this upgrade was the tree-diff
 comparison above, not the gate run. The gates were run to prove the two patch bumps changed nothing.
 
+## The Prettier sweep and the format gate — done 2026-08-04
+
+**90 files reformatted, and a CI step so it cannot happen again.** The drift came from Phase 2's
+`prettier` 3.2.5 → 3.9.6: the new version formats slightly differently, nobody ran `--write`, and no
+gate looked. Eight phases later the repo was 90 files from its own committed config.
+
+Both halves matter, and they fix different problems. The sweep fixes today. The gate is what stops
+the next Prettier release re-opening it — without it, formatting is voluntary, and "voluntary" already
+has a track record here.
+
+| change | why |
+| --- | --- |
+| `npm run prettier` across `nuxt-app` | 90 files. Its own commit, no hand edits |
+| `prettier:check` script + CI step | `--check` writes nothing and exits non-zero; `prettier` would pass by mutating |
+| `nuxt-app/.editorconfig` fixed | it said `indent_size = 2` while `.prettierrc` says `tabWidth: 4`. See below — this was a real pre-existing conflict, not a missing file |
+| `AGENTS.md` editor note | format-on-save for WebStorm and VS Code, both of which read `.prettierrc` unaided |
+| dropped `jsxBracketSameLine` | deprecated, and it printed a warning on every run. Verified inert: removing it changed no file |
+
+### The editor config had been telling editors the wrong indent width
+
+`nuxt-app/.editorconfig` set `indent_size = 2`. `.prettierrc` sets `tabWidth: 4`. Both are read by
+WebStorm and VS Code, so an editor indented new lines at 2 and the formatter immediately widened them
+to 4 — which is a small but perfect example of why the drift went unnoticed: the tooling disagreed
+with itself and nothing arbitrated.
+
+Corrected to 4, plus `max_line_length = 120` to match `printWidth`.
+
+**A root `.editorconfig` was written first and then deleted, because it was dead on arrival.** Both
+`nuxt-app/.editorconfig` and
+`directus-cms/extensions/directus-extension-programmierbar-bundle/.editorconfig` declare `root = true`,
+which stops the upward search — so a file at the repo root is never consulted for either tree. The
+claim that this repo had no `.editorconfig` came from checking only the repo root; two existed. Fixing
+the one that was actually being read was the whole job.
+
+**Deliberately no pre-commit hook.** It is the conventional answer and it does not earn its keep here:
+two active humans, essentially everything arrives via PR where CI already runs, and hooks are
+bypassable with `--no-verify` and absent in fresh clones — including the agent-authored commits, which
+are a real share of this repo's history. That means the CI check would still be needed, so a hook buys
+a second mechanism for one guarantee. Revisit if "CI red for a trailing comma" becomes a recurring
+annoyance.
+
+### Verifying a 90-file reformat, when no gate can see one
+
+The four gates pass, and that is nearly meaningless here: a formatter change is invisible to `lint`,
+`test`, `typecheck` and `build` by construction. Prettier is AST-preserving in principle; the question
+is whether *this* run changed anything a visitor receives.
+
+So the actual verification was a **rendered-output comparison**: build before, build after, fetch 11
+routes from a local production server, and diff. Four attempts at a detector were thrown away first,
+which is the part worth recording:
+
+| attempt | result |
+| --- | --- |
+| strip all whitespace, compare | useless — counts quote/semicolon/comma normalisation as "content changed" (63 files) |
+| collapse template whitespace | useless — attribute reflow inside tags reads as a change (46 files) |
+| raw HTML diff | 11/11 differ, all from source-derived hashes: chunk names, `data-v-*` ids, scoped keyframe names, per-build payload uuid |
+| **mask those, sort class tokens** | **10/11 byte-identical; 1 real difference** |
+
+Class *order* is masked on purpose and it is safe to mask: the CSS cascade resolves by stylesheet
+order and specificity, never by the order tokens appear in a `class` attribute. Sorting the tokens
+still catches a class that was **added or removed**, since that changes the multiset rather than its
+order. Most of the reordering noise came from the Tailwind plugin finally running on files it had
+never formatted.
+
+**The one real difference**, on the conference detail page:
+
+```diff
+-<div class="mb-1 text-xs font-bold uppercase tracking-widest text-lime">Regulär</div>
++<div class="mb-1 text-xs font-bold uppercase tracking-widest text-lime"> Regulär </div>
+```
+
+The source line was over 120 characters, so Prettier broke it and `Regulär` landed on its own line;
+Vue condenses that to a single leading and trailing space. This is the one failure mode worth fearing
+in a mass reformat — Prettier decides whitespace significance from a tag's *default* display, so a
+`<div>` made `inline-block` by a Tailwind class is invisible to it, and added whitespace between two
+such siblings is a visible gap.
+
+**Measured rather than reasoned about**, in Chromium against the real compiled stylesheet:
+
+| | geometry |
+| --- | --- |
+| `>Regulär<` | `width 600, height 16` |
+| `> Regulär <` | `width 600, height 16` — identical |
+| **control:** same edit between two `inline-block` siblings | **shifts 4.12px** |
+
+The control is the point. Without it, "identical geometry" could equally mean the measurement cannot
+see whitespace at all. The element in question is a block-level `div` with no inline class, so CSS
+trims the whitespace at its line-box edges.
+
+**Blind spots, stated plainly.** Chunk filenames are pure content hashes, so a *different* chunk being
+loaded is indistinguishable from the same chunk rehashed. Asset filenames keep their logical name, so
+those are still compared. And 11 routes is not every route — the four portal and checkout pages are
+behind flags or payment state and were not exercised.
+
 ## Phase 6 — Deliberately deferred
 
 Not blocked by EOL. Do **not** fold these into the phases above.
@@ -1592,22 +1687,29 @@ computed on the podcast index. Fixing two lines restores type checking to a lot
 
 ### 3. Build and tooling correctness
 
-- [ ] ⚠️ **`nuxt-app` is 89 files away from Prettier-clean, and nothing in CI notices.**
-      `npx prettier . --check` reports `Code style issues found in 89 files` on `main`. Measured to be
-      **entirely from Prettier itself**, not from the Tailwind plugin: re-running the check with the
-      plugin removed reports the same 89 files. Phase 2 took `prettier` 3.2.5 → 3.9.6 and no one ran
-      `--write` afterwards, so eight phases of formatting output drifted unnoticed.
-
-      Two separable pieces of work, and the second is what stops it recurring:
-
-      1. **One sweep** — `npm run prettier` and commit it alone. Large but mechanical, and it must not
-         ride along with a behavioural change or it will bury it.
-      2. **A gate.** `.github/workflows/run_tests.yml` runs `lint`, `test`, `typecheck:ratchet` and
-         `build` — no format check. Adding `npx prettier . --check` is one step, and without it the
-         sweep starts rotting the day it lands.
-
-      Sequencing matters: do the sweep **after** `stripe`, or a 89-file reformat will collide with the
-      one remaining Phase 5 diff.
+- [x] ✅ **Swept 90 files back to Prettier-clean and added the CI gate** — done 2026-08-04. See
+      [the write-up](#the-prettier-sweep-and-the-format-gate--done-2026-08-04). The drift was
+      **entirely from Prettier itself**, not from the Tailwind plugin — the check reports the same
+      count with the plugin removed — and dated to Phase 2's `prettier` 3.2.5 → 3.9.6.
+
+      **Ran before `stripe`, reversing this document's own sequencing note.** That note said to sweep
+      afterwards, to avoid colliding with the one remaining Phase 5 diff. It had the order backwards:
+      `stripe` had not started, so sweeping first is what makes *its* diff clean. The advice would
+      have been right only if the stripe PR were already open.
+- [ ] ⚠️ **`main` has no branch protection, so none of the CI checks actually blocks a merge.**
+      `GET /repos/programmierbar/website/branches/main/protection` returns **404 Branch not
+      protected**. `lint`, `test`, `typecheck:ratchet`, `build` and the new format check all go red
+      and rely on a human noticing before clicking merge.
+
+      Worth stating precisely, because it is a gap in Phase 0's premise rather than a missing feature:
+      Phase 0 made upgrades **detectable**, which it achieved. It did not make a broken upgrade
+      **unmergeable**. Eight phases of dependency changes were verified by exactly those checks, so a
+      red ratchet is currently a suggestion.
+
+      Requires a repo admin — Settings → Branches → require status checks. Pairs with
+      [installing Renovate](#1-install-the-renovate-github-app--highest-value-item-here), which is
+      also gated on the same person: bot-authored dependency PRs are precisely the case where nobody
+      is watching the checks.
 - [ ] ⚠️ **`components/TalkItem.vue` has HTML comments inside a `class` attribute**, so the browser
       receives `<!--`, `Mobile`, `order`, `Reset`, `for`, `grid` and `-->` as class names on two
       `<div>`s. Found via the formatter bump, which deduplicated the resulting `grid grid`.
@@ -2177,4 +2279,13 @@ Tracked so nobody has to rediscover them. None are urgent on their own.
 | 2026-08-04 | Left `TalkItem.vue`'s HTML-comments-inside-`class` bug **unfixed and logged**. The comments' words are being served as class names, and removing them also removes an accidental `display: grid` from two `<div>`s — a layout change needing a browser, not a formatting fix. Fixing it in a dependency PR would have meant an unverified visual change hidden inside a version bump. |
 | 2026-08-04 | Recorded that `nuxt-app` is **89 files from Prettier-clean on `main`** and that no CI step checks formatting. Measured as Prettier-core drift, not plugin drift — the count is identical with the Tailwind plugin removed — dating to Phase 2's `prettier` 3.2.5 → 3.9.6. Deliberately **not** swept here: 89 files of churn alongside a version bump is how a real change gets lost. The sweep needs its own PR plus a `--check` gate, after `stripe`. |
 | 2026-08-04 | Stated plainly that none of the four gates can see a formatter change, so the tree-diff comparison *was* the verification for this item and the gate run only covered the patch bumps. Recorded because "all gates green" on a formatting PR is a claim that sounds like evidence and is not. |
+| 2026-08-04 | Swept 90 files back to Prettier-clean **and** added `prettier:check` to CI in one PR, in separate commits. Either half alone fails: the sweep without the gate starts rotting on the next Prettier release, and the gate without the sweep turns every subsequent PR red. |
+| 2026-08-04 | **Reversed this document's own "sweep after `stripe`" advice** at the maintainer's prompting. The note was written to avoid colliding with an in-flight Phase 5 diff, but `stripe` had not started — so sweeping *first* is what keeps its diff clean. The advice would only have been right with the stripe PR already open. |
+| 2026-08-04 | Chose **no pre-commit hook**, against the conventional answer. Two active humans, everything arrives via PR where CI already runs, and hooks are bypassable and absent from fresh clones — including agent-authored commits, a real share of this repo's history. The CI check would still be needed, so a hook would mean maintaining two mechanisms for one guarantee. |
+| 2026-08-04 | Fixed `nuxt-app/.editorconfig` from `indent_size = 2` to `4`, matching `.prettierrc`'s `tabWidth`. Editors read both, so they had been indenting at 2 while the formatter widened to 4 — the tooling disagreeing with itself, which is a fair summary of how the drift survived eight phases. |
+| 2026-08-04 | **Wrote a root `.editorconfig`, then deleted it as dead code.** Two already existed (`nuxt-app/`, and the Directus extension), both with `root = true`, which stops the upward search — a root-level file is never consulted for either tree. The premise "this repo has no `.editorconfig`" came from checking only the repo root. Checking one directory and generalising to a repo is the same error the comment audit made in Phase 5. |
+| 2026-08-04 | Verified the reformat by **rendered-output comparison**, not by the gates, which cannot see a formatter change at all. 11 routes fetched from local production builds before and after; 10 byte-identical once source-derived hashes were masked and class tokens sorted. Recorded because "all gates green" on a formatting PR sounds like evidence and is not. |
+| 2026-08-04 | **Four detectors were built and discarded** before that comparison worked: whitespace-stripping counted quote normalisation as a content change (63 false positives), template-collapsing counted attribute reflow (46), and the raw diff was drowned in chunk hashes, `data-v-*` ids, keyframe names and a per-build uuid. Each mask narrows sensitivity, so the final script asserts it can still see an added class, a removed class, a changed attribute and inline whitespace. |
+| 2026-08-04 | The sweep's single rendered difference — `>Regulär<` becoming `> Regulär <` where Prettier broke a 120+ character line — was **measured in Chromium rather than reasoned about**, with a positive control. Identical geometry for the real case; the same edit between two `inline-block` siblings shifts 4.12px. Without the control, "identical" would have been indistinguishable from a measurement that cannot see whitespace. Prettier judges whitespace significance from a tag's default display, so a `<div>` made `inline-block` by a Tailwind class is exactly the blind spot to check for. |
+| 2026-08-04 | Recorded that `main` has **no branch protection** (404 from the protection endpoint), so no CI check has ever blocked a merge. Phase 0 made upgrades detectable, not unmergeable — a distinction the plan had been treating as settled. Needs a repo admin, like Renovate. |
 | 2026-08-03 | SDK 22's `RequestError` refactor was treated as the one real risk and checked at runtime, not by reading. `isTransientError()` casts to `{ response?: { status?: number } }`, so a shape change would compile, pass every gate, and silently stop prerender retries under `prerender.failOnError` — one flaky CMS response would then abort a deploy. `RequestError` preserves `.response`; confirmed across 7 transient codes, 5 permanent codes and a connection refusal. |

From 58214ecdcf31e7670b1ce7e7d048cd5e60f51e0e Mon Sep 17 00:00:00 2001
From: Jan Gregor Emge-Triebel <emge.triebel@lotum.de>
Date: Tue, 4 Aug 2026 16:00:59 +0200
Subject: [PATCH 4/4] Plan: fix the "four things" count and log the tuple-type
 finding

Copilot caught a real inconsistency on #241: the sentence said four
packages were behind while the table below it listed six. Four needed a
decision; two were lockfile drift already inside their declared ranges.
Reworded so the text and the table agree.

Also logs a reviewer finding from #242 that is out of scope there:
types/items.ts types Deepgram's utterances, words and speakers as
single-element tuples rather than arrays. Pre-existing and untouched by the
reformat, and harmless today because the only consumer calls .forEach.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JkKMceYAzAYLrSyC42FWTf
---
 docs/dependency-upgrade-plan.md | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/docs/dependency-upgrade-plan.md b/docs/dependency-upgrade-plan.md
index c7090862..19d5cbd7 100644
--- a/docs/dependency-upgrade-plan.md
+++ b/docs/dependency-upgrade-plan.md
@@ -1433,7 +1433,8 @@ pushing plain text through an HTML sink for no reason.
 ## Registry sweep and the formatter bump — done 2026-08-04
 
 Asked whether anything besides `stripe` was still behind, and answered against the npm registry
-rather than against this document. **Four things were, and one of them appeared in no phase at all.**
+rather than against this document. **Six were: four needing a decision, and two that were only
+lockfile drift.** One of the four appeared in no phase at all.
 
 | package | installed | latest | status |
 | --- | --- | --- | --- |
@@ -1710,6 +1711,17 @@ computed on the podcast index. Fixing two lines restores type checking to a lot
       [installing Renovate](#1-install-the-renovate-github-app--highest-value-item-here), which is
       also gated on the same person: bot-authored dependency PRs are precisely the case where nobody
       is watching the checks.
+- [ ] **`types/items.ts` types Deepgram's arrays as single-element tuples.**
+      `DeepgramTranscriptResponse.results.utterances`, the nested `words`, and
+      `DirectusTranscriptItem.speakers` are all written `[{ … }]` rather than `{ … }[]`, so the type
+      claims exactly one element where the API returns many. Found by a reviewer on #242; pre-existing,
+      and untouched by the reformat.
+
+      **Currently harmless, which is why it is here and not in that PR.** The only consumer is
+      `helpers/prepareTranscript.ts:32`, which calls `.forEach` — that compiles against a tuple and
+      iterates all N elements at runtime. It would bite the first person to index past `[0]` or read
+      `.length`, which TypeScript narrows to the literal `1`. Fix is `{ … }[]` in three places; worth
+      re-running the typecheck ratchet with it, since it touches types feeding the transcript path.
 - [ ] ⚠️ **`components/TalkItem.vue` has HTML comments inside a `class` attribute**, so the browser
       receives `<!--`, `Mobile`, `order`, `Reset`, `for`, `grid` and `-->` as class names on two
       `<div>`s. Found via the formatter bump, which deduplicated the resulting `grid grid`.