diff --git a/app/components/errors.tsx b/app/components/errors.tsx
index 475bde94e..75f41c08e 100644
--- a/app/components/errors.tsx
+++ b/app/components/errors.tsx
@@ -4,11 +4,19 @@ import * as React from 'react'
 import { useMatches } from 'react-router'
 import { type MdxListItem } from '#app/types.ts'
 import { getErrorMessage } from '#app/utils/misc.ts'
+import {
+	type NotFoundMatch,
+	sortNotFoundMatches,
+} from '#app/utils/not-found-matches.ts'
+import { notFoundQueryFromPathname } from '#app/utils/not-found-query.ts'
 import { ArrowLink } from './arrow-button.tsx'
+import { Grid } from './grid.tsx'
 import { Facepalm, Grimmacing, MissingSomething } from './kifs.tsx'
 import { BlogSection } from './sections/blog-section.tsx'
+import { HeaderSection } from './sections/header-section.tsx'
 import { HeroSection, type HeroSectionProps } from './sections/hero-section.tsx'
-import { H2, H6 } from './typography.tsx'
+import { Spacer } from './spacer.tsx'
+import { H2, H4, H6 } from './typography.tsx'
 
 function RedBox({ error }: { error: Error }) {
 	const [isVisible, setIsVisible] = React.useState(true)
@@ -54,18 +62,21 @@ function RedBox({ error }: { error: Error }) {
 function ErrorPage({
 	error,
 	articles,
+	possibleMatches,
+	possibleMatchesQuery,
 	heroProps,
 }: {
 	error?: Error
 	articles?: Array<MdxListItem>
+	possibleMatches?: Array<NotFoundMatch>
+	possibleMatchesQuery?: string
 	heroProps: HeroSectionProps
 }) {
-	if (articles?.length) {
-		Object.assign(heroProps, {
-			arrowUrl: '#articles',
-			arrowLabel: 'But wait, there is more!',
-		})
-	}
+	const resolvedHeroProps: HeroSectionProps = possibleMatches?.length
+		? { ...heroProps, arrowUrl: '#possible-matches', arrowLabel: 'Possible matches' }
+		: articles?.length
+			? { ...heroProps, arrowUrl: '#articles', arrowLabel: 'But wait, there is more!' }
+			: heroProps
 	return (
 		<>
 			<noscript>
@@ -87,7 +98,14 @@ function ErrorPage({
 				{error && import.meta.env.MODE === 'development' ? (
 					<RedBox error={error} />
 				) : null}
-				<HeroSection {...heroProps} />
+				<HeroSection {...resolvedHeroProps} />
+
+				{possibleMatches?.length ? (
+					<PossibleMatchesSection
+						matches={possibleMatches}
+						query={possibleMatchesQuery}
+					/>
+				) : null}
 
 				{articles?.length ? (
 					<>
@@ -104,19 +122,118 @@ function ErrorPage({
 	)
 }
 
-function FourOhFour({ articles }: { articles?: Array<MdxListItem> }) {
-	const matches = useMatches()
-	const last = matches[matches.length - 1]
-	const pathname = last?.pathname
+function PossibleMatchesSection({
+	matches,
+	query,
+}: {
+	matches: Array<NotFoundMatch>
+	query?: string
+}) {
+	const q = typeof query === 'string' ? query.trim() : ''
+	const searchUrl = q ? `/search?q=${encodeURIComponent(q)}` : '/search'
+	const sorted = sortNotFoundMatches(matches)
+
+	return (
+		<>
+			<div id="possible-matches" />
+			<HeaderSection
+				title="Possible matches"
+				subTitle={q ? `Semantic search for "${q}"` : 'Semantic search results.'}
+				cta="Search the site"
+				ctaUrl={searchUrl}
+			/>
+			<Spacer size="2xs" />
+			<Grid>
+				<div className="col-span-full lg:col-span-8 lg:col-start-3">
+					<ul className="space-y-6">
+						{sorted.slice(0, 8).map((m) => (
+							<li
+								key={`${m.type}:${m.url}`}
+								className="rounded-lg bg-gray-100 p-6 dark:bg-gray-800"
+							>
+								<div className="flex items-start gap-4">
+									<div className="shrink-0">
+										{m.imageUrl ? (
+											<img
+												src={m.imageUrl}
+												alt={m.imageAlt ?? ''}
+												className="h-16 w-16 rounded-lg object-cover"
+												loading="lazy"
+											/>
+										) : (
+											<div className="h-16 w-16 rounded-lg bg-gray-200 dark:bg-gray-700" />
+										)}
+									</div>
+									<div className="min-w-0 flex-1">
+										<H4 className="truncate">
+											<a href={m.url} className="hover:underline">
+												{m.title}
+											</a>
+										</H4>
+										<div className="mt-1 flex flex-wrap items-baseline gap-x-3 gap-y-1 text-sm text-slate-500">
+											<span>{m.type}</span>
+											<span className="truncate">{m.url}</span>
+										</div>
+										{m.summary ? (
+											<p className="mt-3 line-clamp-3 text-base text-slate-600 dark:text-slate-400">
+												{m.summary}
+											</p>
+										) : null}
+									</div>
+								</div>
+							</li>
+						))}
+					</ul>
+					{sorted.length > 8 ? (
+						<p className="mt-4 text-sm text-slate-500">
+							<a href={searchUrl} className="underlined">
+								See all results
+							</a>
+						</p>
+					) : null}
+				</div>
+			</Grid>
+		</>
+	)
+}
+
+function FourOhFour({
+	articles,
+	possibleMatches: possibleMatchesProp,
+	possibleMatchesQuery,
+	pathname: pathnameProp,
+}: {
+	articles?: Array<MdxListItem>
+	possibleMatches?: Array<NotFoundMatch>
+	possibleMatchesQuery?: string
+	pathname?: string
+}) {
+	const routeMatches = useMatches()
+	const last = routeMatches[routeMatches.length - 1]
+	const pathname = typeof pathnameProp === 'string' ? pathnameProp : last?.pathname
+	const derivedQuery = notFoundQueryFromPathname(pathname ?? '/')
+	const effectiveQuery =
+		typeof possibleMatchesQuery === 'string' && possibleMatchesQuery.trim()
+			? possibleMatchesQuery.trim()
+			: derivedQuery
+
+	const q = effectiveQuery ? effectiveQuery.trim() : ''
+	const searchUrl = q ? `/search?q=${encodeURIComponent(q)}` : '/search'
+	const heroActionTo =
+		Array.isArray(possibleMatchesProp) && possibleMatchesProp.length > 0
+			? '#possible-matches'
+			: searchUrl
 
 	return (
 		<ErrorPage
 			articles={articles}
+			possibleMatches={possibleMatchesProp}
+			possibleMatchesQuery={effectiveQuery}
 			heroProps={{
 				title: "404 - Oh no, you found a page that's missing stuff.",
 				subtitle: `"${pathname}" is not a page on kentcdodds.com. So sorry.`,
 				image: <MissingSomething className="rounded-lg" aspectRatio="3:4" />,
-				action: <ArrowLink href="/">Go home</ArrowLink>,
+				action: <ArrowLink to={heroActionTo}>Possible matches</ArrowLink>,
 			}}
 		/>
 	)
diff --git a/app/root.tsx b/app/root.tsx
index ce7fcf03c..15de6510c 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -30,9 +30,9 @@ import {
 import { type Route } from './+types/root'
 import { AppHotkeys } from './components/app-hotkeys.tsx'
 import { ArrowLink } from './components/arrow-button.tsx'
-import { ErrorPage, FourHundred } from './components/errors.tsx'
+import { ErrorPage, FourHundred, FourOhFour } from './components/errors.tsx'
 import { Footer } from './components/footer.tsx'
-import { Grimmacing, MissingSomething } from './components/kifs.tsx'
+import { Grimmacing } from './components/kifs.tsx'
 import { Navbar } from './components/navbar.tsx'
 import { NotificationMessage } from './components/notification-message.tsx'
 import { Spacer } from './components/spacer.tsx'
@@ -437,16 +437,7 @@ export function ErrorBoundary() {
 		if (error.status === 404) {
 			return (
 				<ErrorDoc>
-					<ErrorPage
-						heroProps={{
-							title: "404 - Oh no, you found a page that's missing stuff.",
-							subtitle: `"${location.pathname}" is not a page on kentcdodds.com. So sorry.`,
-							image: (
-								<MissingSomething className="rounded-lg" aspectRatio="3:4" />
-							),
-							action: <ArrowLink href="/">Go home</ArrowLink>,
-						}}
-					/>
+					<FourOhFour pathname={location.pathname} />
 				</ErrorDoc>
 			)
 		}
diff --git a/app/routes/$.tsx b/app/routes/$.tsx
index c556979dd..e6481168d 100644
--- a/app/routes/$.tsx
+++ b/app/routes/$.tsx
@@ -5,14 +5,40 @@
 // ensure the user gets the right status code and we can display a nicer error
 // message for them than the Remix and/or browser default.
 
-import { useLocation } from 'react-router'
+import { data as json } from 'react-router'
 import { ArrowLink } from '#app/components/arrow-button.tsx'
 import { GeneralErrorBoundary } from '#app/components/error-boundary.tsx'
-import { ErrorPage } from '#app/components/errors.tsx'
-import { Facepalm, MissingSomething } from '#app/components/kifs.tsx'
+import { ErrorPage, FourOhFour } from '#app/components/errors.tsx'
+import { Facepalm } from '#app/components/kifs.tsx'
+import { type NotFoundMatch } from '#app/utils/not-found-matches.ts'
+import { getNotFoundSuggestions } from '#app/utils/not-found-suggestions.server.ts'
 
-export async function loader() {
-	throw new Response('Not found', { status: 404 })
+export async function loader({ request }: { request: Request }) {
+	const accept = request.headers.get('accept') ?? ''
+	const wantsHtml =
+		accept.includes('text/html') || accept.includes('application/xhtml+xml')
+	if (!wantsHtml || request.method.toUpperCase() !== 'GET') {
+		throw new Response('Not found', { status: 404 })
+	}
+
+	const pathname = new URL(request.url).pathname
+	const suggestions = await getNotFoundSuggestions({ request, pathname, limit: 8 })
+
+	const data: {
+		possibleMatches?: Array<NotFoundMatch>
+		possibleMatchesQuery?: string
+	} = {}
+	if (suggestions) {
+		data.possibleMatches = suggestions.matches
+		data.possibleMatchesQuery = suggestions.query
+	}
+
+	throw json(data, {
+		status: 404,
+		headers: {
+			'Cache-Control': 'private, max-age=60',
+		},
+	})
 }
 
 export default function NotFound() {
@@ -22,7 +48,6 @@ export default function NotFound() {
 }
 
 export function ErrorBoundary() {
-	const location = useLocation()
 	return (
 		<GeneralErrorBoundary
 			statusHandlers={{
@@ -36,16 +61,10 @@ export function ErrorBoundary() {
 						}}
 					/>
 				),
-				404: () => (
-					<ErrorPage
-						heroProps={{
-							title: "404 - Oh no, you found a page that's missing stuff.",
-							subtitle: `"${location.pathname}" is not a page on kentcdodds.com. So sorry.`,
-							image: (
-								<MissingSomething className="rounded-lg" aspectRatio="3:4" />
-							),
-							action: <ArrowLink href="/">Go home</ArrowLink>,
-						}}
+				404: ({ error }) => (
+					<FourOhFour
+						possibleMatches={error.data.possibleMatches}
+						possibleMatchesQuery={error.data.possibleMatchesQuery}
 					/>
 				),
 			}}
diff --git a/app/routes/$slug.tsx b/app/routes/$slug.tsx
index a0119ed88..166d79631 100644
--- a/app/routes/$slug.tsx
+++ b/app/routes/$slug.tsx
@@ -19,6 +19,8 @@ import {
 	useMdxComponent,
 } from '#app/utils/mdx.tsx'
 import { requireValidSlug, reuseUsefulLoaderHeaders } from '#app/utils/misc.ts'
+import { type NotFoundMatch } from '#app/utils/not-found-matches.ts'
+import { getNotFoundSuggestions } from '#app/utils/not-found-suggestions.server.ts'
 import { getServerTimeHeader } from '#app/utils/timing.server.ts'
 import { type Route } from './+types/$slug'
 
@@ -42,24 +44,47 @@ export async function loader({ params, request }: Route.LoaderArgs) {
 	}
 
 	const timings = {}
+	const pathname = new URL(request.url).pathname
 	const page = await getMdxPage(
 		{ contentDir: 'pages', slug: params.slug },
 		{ request, timings },
 	).catch(() => null)
 
-	const headers = {
-		'Cache-Control': 'private, max-age=3600',
-		Vary: 'Cookie',
-		'Server-Timing': getServerTimeHeader(timings),
-	}
 	if (!page) {
-		const blogRecommendations = await getBlogRecommendations({
-			request,
-			timings,
+		const [recommendations, suggestions] = await Promise.all([
+			getBlogRecommendations({ request, timings }),
+			getNotFoundSuggestions({ request, pathname, limit: 8 }),
+		])
+		const data: {
+			recommendations: Array<unknown>
+			possibleMatches?: Array<NotFoundMatch>
+			possibleMatchesQuery?: string
+		} = { recommendations }
+		if (suggestions) {
+			data.possibleMatches = suggestions.matches
+			data.possibleMatchesQuery = suggestions.query
+		}
+		throw json(data, {
+			status: 404,
+			headers: {
+				// Don't cache speculative 404 slugs for long.
+				'Cache-Control': 'private, max-age=60',
+				Vary: 'Cookie',
+				'Server-Timing': getServerTimeHeader(timings),
+			},
 		})
-		throw json({ blogRecommendations }, { status: 404, headers })
 	}
-	return json({ page }, { status: 200, headers })
+	return json(
+		{ page },
+		{
+			status: 200,
+			headers: {
+				'Cache-Control': 'private, max-age=3600',
+				Vary: 'Cookie',
+				'Server-Timing': getServerTimeHeader(timings),
+			},
+		},
+	)
 }
 
 export const headers: HeadersFunction = reuseUsefulLoaderHeaders
@@ -154,7 +179,11 @@ export function ErrorBoundary() {
 			statusHandlers={{
 				400: ({ error }) => <FourHundred error={error.data} />,
 				404: ({ error }) => (
-					<FourOhFour articles={error.data.recommendations} />
+					<FourOhFour
+						articles={error.data.recommendations}
+						possibleMatches={error.data.possibleMatches}
+						possibleMatchesQuery={error.data.possibleMatchesQuery}
+					/>
 				),
 			}}
 		/>
diff --git a/app/routes/blog_/$slug.tsx b/app/routes/blog_/$slug.tsx
index cfa8d2922..1d8b6f298 100644
--- a/app/routes/blog_/$slug.tsx
+++ b/app/routes/blog_/$slug.tsx
@@ -40,6 +40,8 @@ import {
 	requireValidSlug,
 	reuseUsefulLoaderHeaders,
 } from '#app/utils/misc.ts'
+import { type NotFoundMatch } from '#app/utils/not-found-matches.ts'
+import { getNotFoundSuggestions } from '#app/utils/not-found-suggestions.server.ts'
 import { prisma } from '#app/utils/prisma.server.ts'
 import { getUser } from '#app/utils/session.server.ts'
 import { teamEmoji, useTeam } from '#app/utils/team-provider.tsx'
@@ -63,6 +65,8 @@ export const handle: KCDHandle = {
 
 type CatchData = {
 	recommendations: Array<MdxListItem>
+	possibleMatches?: Array<NotFoundMatch>
+	possibleMatchesQuery?: string
 }
 
 export async function loader({ request, params }: Route.LoaderArgs) {
@@ -81,13 +85,17 @@ export async function loader({ request, params }: Route.LoaderArgs) {
 
 	if (!page) {
 		// Avoid caching/creating per-slug stats entries for random 404 slugs. (issue #461)
-		const recommendations = await getBlogRecommendations({
-			request,
-			timings,
-			limit: 3,
-			keywords: [],
-			exclude: [params.slug],
-		})
+		const pathname = new URL(request.url).pathname
+		const [recommendations, suggestions] = await Promise.all([
+			getBlogRecommendations({
+				request,
+				timings,
+				limit: 3,
+				keywords: [],
+				exclude: [params.slug],
+			}),
+			getNotFoundSuggestions({ request, pathname, limit: 8 }),
+		])
 		const headers = {
 			// Don't cache speculative 404 slugs for long.
 			'Cache-Control': 'private, max-age=60',
@@ -95,6 +103,10 @@ export async function loader({ request, params }: Route.LoaderArgs) {
 			'Server-Timing': getServerTimeHeader(timings),
 		}
 		const catchData: CatchData = { recommendations }
+		if (suggestions) {
+			catchData.possibleMatches = suggestions.matches
+			catchData.possibleMatchesQuery = suggestions.query
+		}
 		throw json(catchData, { status: 404, headers })
 	}
 
@@ -629,7 +641,11 @@ export function ErrorBoundary() {
 			statusHandlers={{
 				400: ({ error }) => <FourHundred error={error.statusText} />,
 				404: ({ error }) => (
-					<FourOhFour articles={error.data.recommendations} />
+					<FourOhFour
+						articles={error.data.recommendations}
+						possibleMatches={error.data.possibleMatches}
+						possibleMatchesQuery={error.data.possibleMatchesQuery}
+					/>
 				),
 			}}
 		/>
diff --git a/app/utils/__tests__/not-found-matches.test.ts b/app/utils/__tests__/not-found-matches.test.ts
new file mode 100644
index 000000000..ef9040e21
--- /dev/null
+++ b/app/utils/__tests__/not-found-matches.test.ts
@@ -0,0 +1,25 @@
+import { describe, expect, test } from 'vitest'
+import { normalizeNotFoundUrl } from '../not-found-matches.ts'
+
+describe('normalizeNotFoundUrl', () => {
+	test('keeps internal paths as-is', () => {
+		expect(normalizeNotFoundUrl('/blog/react')).toBe('/blog/react')
+	})
+
+	test('strips origin from absolute http(s) URLs', () => {
+		expect(
+			normalizeNotFoundUrl('https://kentcdodds.com/blog/react?q=1#hash'),
+		).toBe('/blog/react?q=1#hash')
+	})
+
+	test('rejects protocol-relative URLs', () => {
+		expect(normalizeNotFoundUrl('//evil.com/pwned')).toBe('')
+		expect(normalizeNotFoundUrl('https://example.com//evil.com/pwned')).toBe('')
+	})
+
+	test('rejects non-http schemes', () => {
+		expect(normalizeNotFoundUrl('javascript:alert(1)')).toBe('')
+		expect(normalizeNotFoundUrl('data:text/html;base64,PHNjcmlwdD4=')).toBe('')
+	})
+})
+
diff --git a/app/utils/not-found-matches.ts b/app/utils/not-found-matches.ts
new file mode 100644
index 000000000..472cbb6c0
--- /dev/null
+++ b/app/utils/not-found-matches.ts
@@ -0,0 +1,68 @@
+export type NotFoundMatch = {
+	url: string
+	type: string
+	title: string
+	summary?: string
+	imageUrl?: string
+	imageAlt?: string
+}
+
+function isSafeInternalPath(path: string) {
+	// Reject protocol-relative URLs (`//evil.com/...`) which browsers treat as absolute.
+	return path.startsWith('/') && !path.startsWith('//')
+}
+
+export function normalizeNotFoundUrl(rawUrl: string) {
+	const url = rawUrl.trim()
+	if (!url) return ''
+	// Only allow internal app paths. This also keeps client/server rendering consistent
+	// when `/resources/search` returns absolute URLs.
+	if (isSafeInternalPath(url)) return url
+	if (/^https?:\/\//i.test(url)) {
+		try {
+			const u = new URL(url)
+			const path = `${u.pathname}${u.search}${u.hash}`
+			return isSafeInternalPath(path) ? path : ''
+		} catch {
+			return ''
+		}
+	}
+	return ''
+}
+
+function normalizeType(type: string) {
+	// Keep UI labels simple and consistent.
+	if (type === 'jsx-page') return 'page'
+	return type
+}
+
+function getTypePriority(type: string, priorities: ReadonlyArray<string>) {
+	const normalized = normalizeType(type)
+	const idx = priorities.indexOf(normalized)
+	return idx === -1 ? Number.POSITIVE_INFINITY : idx
+}
+
+/**
+ * Stable sort that keeps semantic ranking within each type group.
+ */
+export function sortNotFoundMatches(
+	matches: ReadonlyArray<NotFoundMatch>,
+	{
+		priorities = ['blog', 'page'],
+	}: {
+		priorities?: ReadonlyArray<string>
+	} = {},
+): Array<NotFoundMatch> {
+	return matches
+		.map((m, index) => ({
+			m: { ...m, type: normalizeType(m.type) },
+			index,
+			priority: getTypePriority(m.type, priorities),
+		}))
+		.sort((a, b) => {
+			if (a.priority !== b.priority) return a.priority - b.priority
+			return a.index - b.index
+		})
+		.map((x) => x.m)
+}
+
diff --git a/app/utils/not-found-query.ts b/app/utils/not-found-query.ts
new file mode 100644
index 000000000..1aa93c62a
--- /dev/null
+++ b/app/utils/not-found-query.ts
@@ -0,0 +1,34 @@
+function safeDecodeURIComponent(value: string) {
+	try {
+		return decodeURIComponent(value)
+	} catch {
+		return value
+	}
+}
+
+/**
+ * Convert a missing pathname into a semantic-search-friendly query string.
+ *
+ * Example: `/blog/react-testing-library` -> `blog react testing library`
+ */
+export function notFoundQueryFromPathname(pathname: string) {
+	const cleaned = (pathname ?? '').split(/[?#]/)[0] ?? ''
+	const segments = cleaned.split('/').filter(Boolean)
+	if (segments.length === 0) return ''
+
+	const words = segments
+		.map((segment) => {
+			let text = safeDecodeURIComponent(segment)
+			text = text.replace(/[-_.]+/g, ' ')
+			// Split simple camelCase boundaries.
+			text = text.replace(/([a-z])([A-Z])/g, '$1 $2')
+			return text
+		})
+		.join(' ')
+		.replace(/\s+/g, ' ')
+		.trim()
+
+	// Keep queries reasonably small; embeddings don't benefit from very long URL-ish strings.
+	return words.length > 120 ? words.slice(0, 120).trim() : words
+}
+
diff --git a/app/utils/not-found-suggestions.server.ts b/app/utils/not-found-suggestions.server.ts
new file mode 100644
index 000000000..332da7eb8
--- /dev/null
+++ b/app/utils/not-found-suggestions.server.ts
@@ -0,0 +1,138 @@
+import {
+	normalizeNotFoundUrl,
+	sortNotFoundMatches,
+	type NotFoundMatch,
+} from './not-found-matches.ts'
+import { notFoundQueryFromPathname } from './not-found-query.ts'
+import { semanticSearchKCD } from './semantic-search.server.ts'
+
+class LocalTimeoutError extends Error {
+	constructor(message: string) {
+		super(message)
+		this.name = 'LocalTimeoutError'
+	}
+}
+
+function requestWantsHtml(request: Request) {
+	// Avoid expensive semantic search for asset/API requests.
+	const accept = request.headers.get('accept') ?? ''
+	return (
+		accept.includes('text/html') ||
+		accept.includes('application/xhtml+xml')
+	)
+}
+
+function normalizePathname(pathname: string) {
+	const cleaned = (pathname.split(/[?#]/)[0] ?? '').trim()
+	if (!cleaned) return '/'
+	if (cleaned === '/') return '/'
+	return cleaned.replace(/\/+$/, '') || '/'
+}
+
+function toUrlKey(url: string) {
+	// Normalize relative and absolute URLs for dedupe.
+	try {
+		const u = new URL(url, 'https://kentcdodds.com')
+		return `${u.pathname}${u.search}`
+	} catch {
+		return url
+	}
+}
+
+export async function getNotFoundSuggestions({
+	request,
+	pathname,
+	limit = 8,
+	topK = 15,
+	priorities,
+}: {
+	request: Request
+	pathname?: string
+	limit?: number
+	topK?: number
+	priorities?: ReadonlyArray<string>
+}): Promise<{ query: string; matches: Array<NotFoundMatch> } | null> {
+	// Unit tests don't load MSW handlers; avoid real network calls.
+	if (process.env.NODE_ENV === 'test') return null
+	if (request.method.toUpperCase() !== 'GET') return null
+	if (!requestWantsHtml(request)) return null
+
+	const resolvedPathname = normalizePathname(
+		typeof pathname === 'string' && pathname ? pathname : new URL(request.url).pathname,
+	)
+	const query = notFoundQueryFromPathname(resolvedPathname)
+	if (!query || query.length < 3) return null
+
+	try {
+		// 404s should stay fast even if semantic search is slow/unavailable.
+		const timeoutMs = 1500
+		let timeoutId: ReturnType<typeof setTimeout> | null = null
+		const timeoutPromise = new Promise<never>((_, reject) => {
+			timeoutId = setTimeout(
+				() => reject(new LocalTimeoutError('Timeout')),
+				timeoutMs,
+			)
+		})
+		const results = await Promise.race([
+			semanticSearchKCD({ query, topK }),
+			timeoutPromise,
+		]).finally(() => {
+			if (timeoutId) clearTimeout(timeoutId)
+		})
+
+		const byUrl = new Map<string, NotFoundMatch>()
+
+		for (const r of results) {
+			const rawUrl =
+				typeof r.url === 'string' && r.url.trim()
+					? r.url.trim()
+					: typeof r.id === 'string' && r.id.startsWith('/')
+						? r.id
+						: ''
+			const url = rawUrl ? normalizeNotFoundUrl(rawUrl) : ''
+			if (!url) continue
+
+			// Skip suggesting the missing URL itself.
+			if (normalizePathname(url) === resolvedPathname) continue
+
+			const key = toUrlKey(url)
+			if (byUrl.has(key)) continue
+
+			byUrl.set(key, {
+				url,
+				type: typeof r.type === 'string' && r.type.trim() ? r.type.trim() : 'result',
+				title:
+					typeof r.title === 'string' && r.title.trim()
+						? r.title.trim()
+						: url,
+				summary:
+					typeof r.summary === 'string' && r.summary.trim()
+						? r.summary.trim()
+						: typeof r.snippet === 'string' && r.snippet.trim()
+							? r.snippet.trim()
+							: undefined,
+				imageUrl:
+					typeof r.imageUrl === 'string' && r.imageUrl.trim()
+						? r.imageUrl.trim()
+						: undefined,
+				imageAlt:
+					typeof r.imageAlt === 'string' && r.imageAlt.trim()
+						? r.imageAlt.trim()
+						: undefined,
+			})
+		}
+
+		const matches = sortNotFoundMatches([...byUrl.values()], { priorities }).slice(
+			0,
+			Math.max(0, Math.floor(limit)),
+		)
+
+		return { query, matches }
+	} catch (error: unknown) {
+		if (error instanceof LocalTimeoutError) return null
+		// 404 pages should never fail the request because semantic search failed.
+		console.error('Semantic search failed while rendering 404 suggestions', error)
+		return null
+	}
+}
+