frontend/src/lib/geschichte/JourneyInterlude.svelte

@@ -9,6 +9,7 @@ let { note }: Props = $props();
 </script>
 
 <div
+	role="note"
 	aria-label={m.journey_interlude_aria_label()}
 	class="my-2 border-l-4 border-journey-border bg-journey-tint px-4 py-3"
 >

frontend/src/lib/geschichte/JourneyInterlude.svelte.spec.ts

@@ -27,6 +27,14 @@ describe('JourneyInterlude', () => {
 		expect(el).not.toBeNull();
 	});
 
+	it('has role="note" so the aria-label is announced by screen readers', async () => {
+		render(JourneyInterlude, { props: { note: 'Notiz' } });
+
+		const el = document.querySelector('[role="note"]');
+		expect(el).not.toBeNull();
+		expect(el?.getAttribute('aria-label')).toBe(m.journey_interlude_aria_label());
+	});
+
 	it('renders the section-break glyph ❦', async () => {
 		render(JourneyInterlude, { props: { note: 'Notiz' } });