feat:accessibility, new routes, cookie consent, and UI improvements

- Add contact, privacy, and terms pages
- Add CookieConsent component with accept/decline and localStorage
- Add self-hosted DM Sans font with @font-face definitions
- Improve registration form with field validation, blur handlers, and
performer toggle
- Redesign Info section with 'Ongedesemd Brood' hero and FAQ layout
- Remove scroll-snap behavior from all sections
- Add reduced motion support and selection color theming
- Add SVG favicon and SEO meta tags in root layout
- Improve accessibility: aria attributes, semantic HTML, focus styles
- Add link-hover underline animation utility

apps/web/src/routes/__root.tsx

@@ -8,10 +8,18 @@ import {
 	Scripts,
 } from "@tanstack/react-router";
 import { TanStackRouterDevtools } from "@tanstack/react-router-devtools";
+import { CookieConsent } from "@/components/CookieConsent";
 import { Toaster } from "@/components/ui/sonner";
 import type { orpc } from "@/utils/orpc";
 
 import appCss from "../index.css?url";
+
+const siteUrl = "https://kunstenkamp.be";
+const siteTitle = "Kunstenkamp Open Mic Night - Ongedesemd Brood";
+const siteDescription =
+	"Doe mee met de Open Mic Night op 18 april! Een avond vol muziek, theater, dans, woordkunst en meer. Iedereen is welkom - van beginner tot professional.";
+const eventImage = `${siteUrl}/assets/og-image.jpg`;
+
 export interface RouterAppContext {
 	orpc: typeof orpc;
 	queryClient: QueryClient;
@@ -28,7 +36,57 @@ export const Route = createRootRouteWithContext<RouterAppContext>()({
 				content: "width=device-width, initial-scale=1",
 			},
 			{
-				title: "My App",
+				title: siteTitle,
+			},
+			{
+				name: "description",
+				content: siteDescription,
+			},
+			{
+				name: "theme-color",
+				content: "#d82560",
+			},
+			// Open Graph
+			{
+				property: "og:type",
+				content: "website",
+			},
+			{
+				property: "og:url",
+				content: siteUrl,
+			},
+			{
+				property: "og:title",
+				content: siteTitle,
+			},
+			{
+				property: "og:description",
+				content: siteDescription,
+			},
+			{
+				property: "og:image",
+				content: eventImage,
+			},
+			{
+				property: "og:locale",
+				content: "nl_BE",
+			},
+			// Twitter Card
+			{
+				name: "twitter:card",
+				content: "summary_large_image",
+			},
+			{
+				name: "twitter:title",
+				content: siteTitle,
+			},
+			{
+				name: "twitter:description",
+				content: siteDescription,
+			},
+			{
+				name: "twitter:image",
+				content: eventImage,
 			},
 		],
 		links: [
@@ -36,17 +94,58 @@ export const Route = createRootRouteWithContext<RouterAppContext>()({
 				rel: "stylesheet",
 				href: appCss,
 			},
+			{
+				rel: "canonical",
+				href: siteUrl,
+			},
+			{
+				rel: "icon",
+				type: "image/svg+xml",
+				href: "/favicon.svg",
+			},
+			{
+				rel: "preconnect",
+				href: "https://analytics.zias.be",
+			},
 		],
 		scripts: [
 			{
 				src: "https://analytics.zias.be/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js",
 				defer: true,
 				"data-domain": "kunstenkamp.be",
+				"data-api": "https://analytics.zias.be/api/event",
 			},
 			{
 				children:
 					"window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }",
 			},
+			// JSON-LD Schema for Event
+			{
+				type: "application/ld+json",
+				children: JSON.stringify({
+					"@context": "https://schema.org",
+					"@type": "Event",
+					name: "Kunstenkamp Open Mic Night",
+					description:
+						"Een avond vol muziek, theater, dans, woordkunst en meer. Iedereen is welkom om zijn of haar talent te tonen.",
+					startDate: "2026-04-18T19:00:00+02:00",
+					eventStatus: "https://schema.org/EventScheduled",
+					eventAttendanceMode: "https://schema.org/OfflineEventAttendanceMode",
+					organizer: {
+						"@type": "Organization",
+						name: "Kunstenkamp",
+						url: siteUrl,
+					},
+					image: eventImage,
+					offers: {
+						"@type": "Offer",
+						price: "0",
+						priceCurrency: "EUR",
+						availability: "https://schema.org/InStock",
+						validFrom: "2026-03-01T00:00:00+02:00",
+					},
+				}),
+			},
 		],
 	}),
 
@@ -55,13 +154,22 @@ export const Route = createRootRouteWithContext<RouterAppContext>()({
 
 function RootDocument() {
 	return (
-		<html lang="en">
+		<html lang="nl">
 			<head>
 				<HeadContent />
 			</head>
 			<body>
-				<Outlet />
+				<a
+					href="#main-content"
+					className="fixed top-0 left-0 z-[100] -translate-y-full bg-[#d82560] px-4 py-2 text-white transition-transform focus:translate-y-0"
+				>
+					Ga naar hoofdinhoud
+				</a>
+				<div id="main-content">
+					<Outlet />
+				</div>
 				<Toaster />
+				<CookieConsent />
 				<TanStackRouterDevtools position="bottom-left" />
 				<ReactQueryDevtools position="bottom" buttonPosition="bottom-right" />
 				<Scripts />