feat(ui): Ernten, Chargen-Nachweis und aktive Navigation

- Ernten: Jahrgang als grosse Serifenzahl mit auslaufender Linie, Karten
  heben sich mit Honigschimmer, Pfeil und Unterstrich
- Ernte-Detail: grosser Titel, mitlaufendes Bild, Fuellstandsbalken je
  Charge (verfuegbare von abgefuellten Glaesern)
- Chargen-Seite (QR-Code auf dem Glas): Echtheitssiegel stempelt sich ein,
  Zeitleiste mit Waben und sich fuellender Linie, Werte in Serifenschrift
- Produktverweise heben sich, gezeichneter Pfeil statt Textzeichen
- Fix: aktive Seite in der Kopfzeile zeigte den Unterstrich in Textfarbe
  statt in Honig (unlayered CSS ueberstimmte die Utility-Klasse)

Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>

src/components/product-card.tsx

@@ -41,13 +41,31 @@ export function ProductTeaserLink({
   return (
     <Link
       href={`/honig/${slug}`}
-      className="group flex items-center gap-4 border border-ink/10 p-4 transition-colors hover:border-forest"
+      className="group flex items-center gap-5 border border-ink/10 p-4 transition-[border-color,transform,box-shadow] duration-500 ease-[var(--ease-arrive)] hover:-translate-y-0.5 hover:border-forest/50 hover:shadow-[0_18px_34px_-24px_rgba(36,53,43,0.45)]"
     >
-      <ContentImage src={image ?? null} alt={name} tone="honey" className="w-16 h-16 flex-shrink-0" sizes="64px" />
-      <span>
-        <span className="block text-forest">{name}</span>
-        <span className="block mt-1 text-sm text-ink/70 group-hover:text-forest transition-colors">
-          {t.product.viewProduct}
+      <span className="block overflow-hidden rounded-lg">
+        <ContentImage
+          src={image ?? null}
+          alt={name}
+          tone="honey"
+          className="w-16 h-16 flex-shrink-0 transition-transform duration-700 ease-[var(--ease-arrive)] group-hover:scale-110"
+          sizes="64px"
+        />
+      </span>
+      <span className="flex-1">
+        <span className="block font-serif text-xl text-forest">{name}</span>
+        <span className="mt-1 inline-flex items-center gap-1.5 text-sm text-ink/70 transition-colors group-hover:text-forest">
+          {t.product.viewProduct.replace(/\s*→\s*$/, "")}
+          <svg
+            aria-hidden="true"
+            viewBox="0 0 24 24"
+            className="h-3.5 w-3.5 transition-transform duration-300 ease-[var(--ease-arrive)] group-hover:translate-x-1"
+            fill="none"
+            stroke="currentColor"
+            strokeWidth="1.6"
+          >
+            <path d="M4 12h15M13 6l6 6-6 6" strokeLinecap="round" strokeLinejoin="round" />
+          </svg>
         </span>
       </span>
     </Link>

src/components/site-chrome.tsx

@@ -359,7 +359,7 @@ export function Header({ companyName }: { companyName: string }) {
                   href={item.href}
                   aria-current={active ? "page" : undefined}
                   className={`link-draw pb-1 text-sm whitespace-nowrap transition-colors ${
-                    active ? "text-forest [background-image:linear-gradient(var(--color-honey),var(--color-honey))] [background-size:100%_2px]" : "text-ink/80 hover:text-forest"
+                    active ? "text-forest" : "text-ink/80 hover:text-forest"
                   }`}
                 >
                   {t.nav[item.key]}