VOICE.NRW | WEBSITE / EMERGENT

DIESE DATEIEN SIND ASSETS, KEIN WEBSITE-DEPLOYMENT.
Der tatsächliche Quellcode und die aktuellen Animationen der Website wurden für
beides nicht geprüft. Die Integration ist deshalb vom bestehenden Projekt aus
zu planen, nicht umgekehrt.

EINFACHSTER EINBAU
Den Inhalt von public/brand/ unter dem entsprechenden statischen Asset-Pfad des
bestehenden Projekts ablegen. Bei einem Projekt mit public-Verzeichnis ergibt
sich beispielsweise /brand/voice-nrw-horizontal-on-dark.svg.
Der tatsächlich vorhandene Public-Pfad und ein eventueller Base-Pfad sind vom
Projekt zu übernehmen. Keine neue Route und kein Backend-Endpunkt sind nötig.

Dunkler Hintergrund: voice-nrw-horizontal-on-dark.svg
Heller Hintergrund:  voice-nrw-horizontal-on-light.svg
Eine Farbe:           voice-nrw-horizontal-black.svg oder ...-white.svg
Nur Bildzeichen:      voice-nrw-icon-copper.svg / ...-navy.svg / ...-black.svg

Beispiel für ein statisches Logo, nur an passender bestehender Stelle einsetzen:
<img src="/brand/voice-nrw-horizontal-on-dark.svg" alt="VOICE.NRW"
     width="1306" height="285" style="width:240px;max-width:100%;height:auto">

Kein Hintergrund ist im horizontalen SVG eingebaut. Das Seitenlayout bleibt
unverändert. Die Maße width/height reservieren das richtige Seitenverhältnis;
die tatsächlich dargestellte Breite wird passend zur vorhandenen Seite gewählt.
Keine Beschneidung, keine Verzerrung, keine erneute Textsetzung.

OPTIONAL: REACT-REFERENZ
integration/VoiceNrwLogo.tsx und voice-nrw-logo.css sind ein optionales Beispiel
für ein vorhandenes kompatibles React-Projekt. Keine Abhängigkeit installieren,
um diese Dateien verwenden zu können. Ohne React das SVG als normales Bild nutzen.
Die Komponente enthält keine Schrift, keinen Netzwerkabruf und keine Logik für
Konten, Dienste, Zahlungen oder Navigation. Sie ist nicht live getestet.

<VoiceNrwLogo variant="on-dark" width={240} />
<VoiceNrwLogo variant="on-light" width={240} />

Bewegung ist standardmäßig AUS. animate={true} aktiviert lediglich ein kurzes,
einmaliges Einblenden. Die CSS-Datei berücksichtigt prefers-reduced-motion.
Existiert bereits eine Animation am Logo, diese möglichst weiterverwenden und
nicht gleichzeitig die Beispielanimation aktivieren. Keine Endlosschleife.
Die eigenständigen SVG-Dateien sind immer statisch und enthalten kein JavaScript.

FAVICON / APP-ICONS
favicon.svg und favicon.ico zeigen das Kupfer-Signet auf Navy.
apple-touch-icon.png ist 180 x 180 px, die App-Icons 192 bzw. 512 px.
icon-maskable-512.png hat zusätzlichen Schutzraum.
head.fragment.html und manifest-icons.fragment.json sind NUR Ergänzungsvorlagen.
Bestehendes Manifest, App-Namen, Start-URL, Scope, Service Worker und sonstige
Felder niemals blind durch eine neue Datei ersetzen. Vorhandene Einträge gezielt
aktualisieren und bestehende Deployment-/Cache-Mechanismen beibehalten.

SCHUTZGRENZE
Nur das Marken-Asset austauschen. Keine Änderungen an Daten, Backend,
Authentifizierung, Preisen, Zahlungsabläufen, Podcast-Funktionen, Routing oder
öffentlichen SEO-Inhalten. Keine automatische Veröffentlichung.
