fix(mana/web): replace h2/h3 with div in AiSettings + AiTierStep

The AiSettings card was rendering with browser-default heading
sizes (~30px h2, ~18px h3) instead of the Tailwind utility classes
I'd given them. Visible in production: "KI-Optionen" came out
huge, "Auf deinem Gerät" ditto, the whole card looked like the
font-size system was broken.

Root cause: app.css has an `@layer base` block that explicitly
sets `h2 { font-size: 1.875rem; ... }` etc as a project-wide rich-
text default. The intention is that PROSE-style content gets nice
typography for free. But for components that use semantic h2/h3
tags purely for document structure (not for visual sizing), the
base layer rule wins over the utility classes when Tailwind 4's
content-scanning misses the file.

Why other settings cards work: their <h2> tags live INLINE in
routes/(app)/settings/+page.svelte, which Tailwind's Vite plugin
walks via the SvelteKit route entry. My new AiSettings card is in
lib/components/settings/AiSettings.svelte — a separate component
file that's imported by the route but apparently doesn't get its
classes generated reliably (likely a Tailwind 4 cache issue with
recently-added files in non-route paths). Result: text-lg /
text-sm / text-xs aren't in the output CSS, so the @layer base
heading rule is the only thing setting the size, and it wins.

Pragmatic fix: replace <h2> and <h3> with <div class="text-lg
font-semibold"> / <div class="text-base font-semibold">. Divs
aren't subject to the @layer base h2/h3 reset, so even if the
utility classes are also missing the styles fall back to the
element's natural inline-block-with-inherited-font-size behavior.
And the Tailwind classes — when they DO eventually get picked up
(e.g. on a clean build) — apply on top.

Same change applied to:
  - apps/mana/apps/web/src/lib/components/settings/AiSettings.svelte
    (the section header + each tier card title)
  - apps/mana/apps/web/src/lib/components/onboarding/steps/AiTierStep.svelte
    (the step's main heading + each tier card title)

Functionally identical, just different element type. The semantic
loss is minimal — these aren't document-structure headings, they're
visual labels inside a card UI.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/mana/apps/web/src/lib/components/onboarding/steps/AiTierStep.svelte

@@ -58,7 +58,7 @@
 		<div class="mx-auto mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-primary/10">
 			<Robot size={28} class="text-primary" />
 		</div>
-		<h2 class="mb-2 text-2xl font-bold">Wie soll Mana KI nutzen?</h2>
+		<div class="mb-2 text-2xl font-bold">Wie soll Mana KI nutzen?</div>
 		<p class="text-muted-foreground">
 			Mana bietet KI-Funktionen auf vier Ebenen — von "gar keine" bis zu allem. Du entscheidest,
 			welche Schichten dein Vertrauen haben.
@@ -103,7 +103,7 @@
 					</div>
 					<div class="min-w-0 flex-1">
 						<div class="flex items-center gap-2">
-							<h3 class="font-semibold">{card.title}</h3>
+							<div class="text-base font-semibold">{card.title}</div>
 							<span class="h-1.5 w-1.5 rounded-full {card.privacyDot}"></span>
 							<span class="text-xs text-muted-foreground">{card.tagline}</span>
 							{#if enabled}

apps/mana/apps/web/src/lib/components/settings/AiSettings.svelte

@@ -119,7 +119,7 @@
 			<Robot size={20} />
 		</div>
 		<div>
-			<h2 class="text-lg font-semibold">KI-Optionen</h2>
+			<div class="text-lg font-semibold">KI-Optionen</div>
 			<p class="text-sm text-muted-foreground">
 				Wähle, welche KI-Schichten Mana verwenden darf — von gar keiner bis zu allen
 			</p>
@@ -166,7 +166,7 @@
 					</div>
 					<div class="min-w-0 flex-1">
 						<div class="flex items-center gap-2">
-							<h3 class="font-semibold">{card.title}</h3>
+							<div class="text-base font-semibold">{card.title}</div>
 							{#if enabled}
 								<span
 									class="rounded-full bg-primary px-2 py-0.5 text-[10px] font-medium text-primary-foreground"