{
 "schema": "fundus-rezept/1",
 "stand": "02.11.2026",
 "basis": {
  "stand": "02.11.2026 (Runde 5: Redaktion nach KI-Audit und Lückenrecherche)",
  "muster": [
   "vt-cross-document-mpa",
   "css-view-reveal-nativ",
   "unterstreichung-varianten",
   "button-zustaende",
   "validierung-nach-interaktion",
   "consent-banner-gestaltet",
   "fokus-stil-system",
   "sprunglinks-landmarken",
   "bewegung-pausieren-schalter",
   "fehlerseite-leerzustand",
   "dialog-modal-nativ",
   "zoom-und-textabstand-robust",
   "kontrastmodus-forced-colors",
   "firmendaten-strukturiert",
   "sofort-navigation-vorladen"
  ],
  "beschreibung": "Grundausstattung, die jedes Rezept ohne Nennung bekommt: native Seitenübergänge zwischen echten Seiten (vt-cross-document-mpa) und Vorladen der Hauptwege (sofort-navigation-vorladen), beides nicht bei Onepagern; native Scroll-Reveals nur wo sinnvoll, Link-Unterstreichung, vollständige Button-Zustände, Validierung erst nach Interaktion, ein gestaltetes Consent-Banner, Fehlerseite und Leerzustand, natives Dialog-Modal und eine einzige Datenquelle für Firmendaten, aus der Kontaktblock, Öffnungszeiten und JSON-LD entstehen (firmendaten-strukturiert). Dazu die Barrierefreiheit der Kategorie zugang: sichtbarer Fokus, Sprunglinks und Landmarken, Pause für Bewegung, 200 % Zoom und Textabstände ohne Abschneiden (zoom-und-textabstand-robust), Kontrastmodus (kontrastmodus-forced-colors). In Sektionen dürfen Basis-Muster genannt werden, wenn sie dort besonders wichtig sind (z. B. Formular-Validierung); in den Kategorie-Listen der Rezepte stehen sie nicht.",
  "regeln": [
   "Keine Schrift kommt in mehr als 3 Rezepten vor (headline, text und akzent zusammen gezählt, alternative_eigenprojekt ausgenommen).",
   "Ein Rezept darf Headline- und Textschrift nicht 1:1 mit einem anderen Rezept teilen.",
   "Pflichtfeld signatur: 1–2 Muster, die kein anderes Rezept nutzt (Basis ausgenommen); jedes Signatur-Muster steht auch in den Muster-Listen des Rezepts.",
   "cinematic-video-hero nur mit eigenem, hochwertigem Footage. Für typische KMU-Kunden (Gastro, Mode/Concept Store) ist ein Foto-Hero Standard, Video steht unter hero_variante.",
   "Kontakt/Anfrage, Online-Termin und Anfahrt sind eigene Sektionen (kontakt-anfrage-formular bzw. mehrschritt-anfrage, termin-buchung-zwei-klick, karte-zwei-klick, oeffnungszeiten-status), auch wenn ein Rezept sie nicht nennt; die Adresse steht immer auch als Text da; studio-visitenkarte-footer steht nur im Footer.",
   "Drittanbieter-Inhalte (Video, Karte, Buchung, Social Feeds) erst nach Einwilligung bzw. Klick laden.",
   "Höchstens ein Material-Effekt (Glow, Verlaufsrahmen, Raster, Textur) pro Ansicht.",
   "Automatisch bewegte Inhalte (Laufband, Wortwechsel, Autoplay) nie für wichtige Information; immer pausierbar und unter prefers-reduced-motion statisch.",
   "Barrierefreiheit gehört zur Grundausstattung (BFSG seit 28.06.2025): sichtbarer Fokus (fokus-stil-system), Sprunglinks und Landmarken, Pause für alles, was sich länger als 5 s bewegt (bewegung-pausieren-schalter), native Dialoge, 200 % Zoom und 320 px Breite ohne Abschneiden (zoom-und-textabstand-robust), Kontrastmodus prüfen (kontrastmodus-forced-colors). Rechtliches (Erklärung zur Barrierefreiheit) vom Kunden prüfen lassen.",
   "Firmendaten (Name, Adresse, Telefon, Zeiten samt Sonderzeiten, Leistungen, Profil-Links) aus einer Quelle; JSON-LD nur für sichtbare Inhalte, keine eigenen Bewertungssterne im Markup (firmendaten-strukturiert).",
   "Wer online Verträge mit Verbrauchern schließt (Shop, Kurs, Abo, Mitgliedschaft, Online-Anmeldung), braucht im Footer ohne Login „Vertrag widerrufen“ und bei Dauerverträgen „Verträge hier kündigen“ (widerruf-und-kuendigung-schaltflaeche, seit 19.06.2026) – vom Kunden prüfen lassen.",
   "Bewertungen von Google oder anderen Plattformen nur mit Echtheitshinweis direkt an den gezeigten Bewertungen (bewertungsprofil-mit-echtheitshinweis); bewertungen-verteilung nur für eigene, geprüfte Bewertungen.",
   "Pflichtangaben (Impressum, Datenschutzerklärung, Branchenpflichten aus Leitfaden 8a und den Rezept-regeln) als Seiten, Links oder markierte Platzhalter; keine Rechtstexte erfinden, alles vom Kunden prüfen lassen. Chatbots und KI-Funktionen direkt beim Start kennzeichnen (Art. 50 KI-VO), keine pauschalen Umweltaussagen ohne Nachweis.",
   "consent-banner-gestaltet nur, wenn beim Laden einwilligungspflichtige Dienste laufen. Laden alle Dritten erst per 2-Klick, genügt ein Einstellungs-Dialog im Footer („Datenschutz-Einstellungen“) zum Widerrufen.",
   "Starter- und Beispielseiten ohne echte Daten: Bewertungen, Preise, Allergene und Kennzahlen als markierte Platzhalter, nie erfundene Kundenstimmen als echt.",
   "Werbung mit Rate, Zins, „0 %“, Ratenzahlung, Leasing oder „später bezahlen“ braucht ab 20.11.2026 finanzierung-pflichtangaben: effektiver Jahreszins mindestens so groß wie die Rate, Warnhinweis „Achtung! Kreditaufnahme kostet Geld.“ direkt dabei (vom Kunden prüfen lassen).",
   "Verkauf von Waren an Verbraucher braucht seit 27.09.2026 den EU-Hinweis zur gesetzlichen Gewährleistung (eu-gewaehrleistungshinweis), mindestens als Footer-Link, sicherer an Produktseite und Checkout; nur die amtliche Vorlage der EU-Kommission."
  ],
  "herkunft": "Art-Director-Prüfung der 18 Rezepte, Runde 3 (Basis-Block, Signatur-Pflichtfeld, Schriftverteilung, 2-Klick-Muster). Runde 5 (02.11.2026): zugang-Muster, Firmendaten und Vorladen in die Grundausstattung, Regeln zu Kontakt, Verträgen, Bewertungen und Pflichtangaben (KI-Audit Befund 3, Lückenrecherche N1–N3, N6, K5)."
 },
 "id": "freelancer-stille-visitenkarte",
 "name": "Freelancer: Stille Visitenkarte",
 "branche": "Freelance-Designer, Interaction-Designer, Einzelberater mit Portfolio",
 "stimmung": [
  "ruhig",
  "präzise",
  "persönlich",
  "handwerklich"
 ],
 "kurz": "Eine schmale Lesespalte, ein einleitender Satz statt Hero und Bewegung im 100-ms-Bereich. Die Qualität zeigt sich in Details wie Laufweite, Ziffern, Fokus und Kopier-Feedback, nicht in Effekten. Gebaut wie die Seiten von Paco Coursey, Emil Kowalski und Rauno Freiberg: Grotesk für alles, eine Serif-Kursive als Stimme, Mono für Metadaten.",
 "referenzen": [
  {
   "seite": "Paco Coursey",
   "url": "https://paco.me/",
   "art": "website",
   "herkunft": "beobachtet",
   "abgerufen": "2026-10-31",
   "quelle": "/_next/static/chunks/6f8cd1f2e1c78e16.css, 043ac70fdbeb5d40.css, 1902af4af6f089fe.css",
   "beobachtung": "Next.js. @font-face: Sohne, Inter und Newsreader, jeweils als Subset (sohne-subset-0.woff2, newsreader-subset-0.woff2). Tokens: --content-width 640px, --page-width 1072px; --text 16px, --text-s 14px, --text-xs 12px; --leading-s 20px, --leading-l 32px. Dauer-Tokens --transition-fastest 80ms, -fast .1s, -med .16s, -xx .24s, -xxl .32s, -long .48s, -slow 1.2s; dazu ein kompletter Satz Penner-Kurven als CSS-Variablen (z. B. --ease-out-quart cubic-bezier(.165,.84,.44,1)). Zwei Werte für --text-color (#3a3a3a/#e5e5e5), also ein Dark Mode. Abschnitte als h2: Building → Projects → Writing → Now → Connect."
  },
  {
   "seite": "Emil Kowalski",
   "url": "https://emilkowal.ski/",
   "art": "website",
   "herkunft": "beobachtet",
   "abgerufen": "2026-10-31",
   "quelle": "/_next/static/css/d54e455ee7d8468f.css (@font-face), /_next/static/css/747876a3d8c444e8.css (Kurven)",
   "beobachtung": "Next.js mit next/font: Sans, Serif, Mono und eine eigene „serifInline“ für kursive Wörter im Fließtext. --font-variations \"opsz\" auto, --font-settings \"cv01\",\"ss03\". Bewegung: cubic-bezier(.4,0,.2,1) 12×, Dauer .15s 12×; transform .2s cubic-bezier(.165,.84,.44,1); Hintergrund .12s. Palette fast nur Grau: #0b0b09, #252525, #989898, #d6d6d6, #f8f8f8. Header als Spalte (mb-32 flex flex-col)."
  },
  {
   "seite": "Rauno Freiberg",
   "url": "https://rauno.me/",
   "art": "website",
   "herkunft": "beobachtet",
   "abgerufen": "2026-10-31",
   "quelle": "/_next/static/css/e621362aa87785a2.css, /_next/static/css/647af292b7760dc7.css",
   "beobachtung": "Next.js. @font-face: eigene Sans „X“ und JetBrains Mono, Serif per System (--fonts-serif: Georgia). --transitions-snappy cubic-bezier(.2,.8,.2,1); Zeilen blenden gestaffelt ein (data-transition-lines, --line-fade-duration, --line-fade-delay, ease-in-out). h1 ist ein ganzer Satz: „Rauno Freiberg is an Estonian interaction designer working with Vercel …“. prefers-reduced-motion berücksichtigt."
  }
 ],
 "schrift": {
  "paarung_basis": "",
  "abweichung": "",
  "headline": "host-grotesk",
  "text": "host-grotesk",
  "akzent": "newsreader",
  "techniken": [
   "eine-familie-wenig-gewichte",
   "gemischte-schnitte-zeile",
   "lesesatz-text-wrap",
   "text-box-trim",
   "tabellenziffern"
  ],
  "groessen": "Kein Riesen-Hero: h1 als Satz clamp(1.25rem, 2vw, 1.5rem), wght 500, line-height 1.4. h2 1rem, wght 500, Farbe Sekundärgrau. Fließtext 1rem/1.6 (Paco 16px, Leading 20–32px), Klein 0.875rem. Spalte max-width 640px (Paco --content-width), Seite 1072px. Newsreader Italic nur für einzelne Wörter im Satz, 1.05em, opsz auto. Laufweite 0 bis -0.01em. Host Grotesk nur in 400 und 500.",
  "alternative_eigenprojekt": "Switzer oder Satoshi statt Host Grotesk (ITF-FFL); näher an Söhne/Paco ist Switzer"
 },
 "farbe": {
  "prinzip": "Fast nur Graustufen in 8–10 Stufen (Paco #fcfcfc bis #646464, Emil #0b0b09 bis #f8f8f8), Kontrast über Grauwert statt über Farbe. Höchstens eine Farbe für Fokus- und Link-Zustände. Dark Mode als gleichwertige Variante.",
  "beispiel": [
   "#fcfcfc Grund",
   "#0b0b09 Text",
   "#646464 Sekundärtext, h2",
   "#e8e8e8 Linien, Trenner",
   "#f0f0f0 Hover-Fläche",
   "#2f5bea Fokus-Ring und Link-Hover (einzige Farbe)"
  ]
 },
 "animationsstil": "token-tech-praezise",
 "bewegung": {
  "easing": "cubic-bezier(0.2, 0, 0.38, 0.9) (token-tech-praezise, productive); Eintritt cubic-bezier(0, 0, 0.38, 0.9), Austritt cubic-bezier(0.2, 0, 1, 0.9)",
  "beobachtet": "Dauer-Tokens 80–480 ms (Paco); cubic-bezier(.4,0,.2,1) .15s und easeOutQuart cubic-bezier(0.165, 0.84, 0.44, 1) .2s (Emil); „snappy“ cubic-bezier(.2,.8,.2,1) (Rauno)",
  "dauer_ms": "Hover/Farbe 80–160, Transform 200–240, Einblendungen 320–480, nie über 500 außer Theme-Wechsel",
  "regel": "Kurze Dauern aus den Tokens, nichts federt, nichts dreht sich. Exits schneller als Entrances (Austrittskurve). Einziges Inszenierungsmoment ist das gestaffelte Einblenden der Intro-Zeilen beim ersten Laden."
 },
 "hero_beschreibung": "Kein Hero-Muster: ein Intro-Satz in Textgröße (Name, Rolle, Kunden, Ort, 1–2 Wörter kursiv in Newsreader), der beim ersten Laden zeilenweise gestaffelt erscheint (Sektion „Intro-Satz“).",
 "muster": {
  "seitenuebergang": [],
  "preloader": [],
  "navigation": [
   "theme-umschalter-view-transition"
  ],
  "hero": [],
  "hero_variante": [],
  "sektionen": [
   {
    "zweck": "Intro-Satz (ersetzt den Hero)",
    "muster": [
     "gestaffelte-einblendung"
    ]
   },
   {
    "zweck": "Projekte / Arbeiten",
    "muster": [
     "projektindex-hover-vorschau"
    ]
   },
   {
    "zweck": "Angebot / Leistungen (was ich mache, für wen, wie man anfragt)",
    "muster": [
     "akkordeon-hoehe-auto"
    ],
    "varianten": {
     "akkordeon-hoehe-auto": "basis"
    }
   },
   {
    "zweck": "Schreiben / Notizen",
    "muster": [
     "editorial-magazin-layout"
    ],
    "varianten": {
     "editorial-magazin-layout": "magazin"
    }
   },
   {
    "zweck": "Über mich / Jetzt",
    "muster": [
     "team-ueber-mich-layout"
    ],
    "varianten": {
     "team-ueber-mich-layout": "statement"
    }
   },
   {
    "zweck": "Stimmen von Kunden",
    "muster": [
     "testimonials-neu-gedacht"
    ],
    "varianten": {
     "testimonials-neu-gedacht": "zitat"
    }
   },
   {
    "zweck": "Kontakt (E-Mail mit Kopier-Feedback, Verfügbarkeit)",
    "muster": [
     "kopieren-feedback",
     "kontakt-anfrage-formular"
    ],
    "varianten": {
     "kontakt-anfrage-formular": "satz"
    }
   }
  ],
  "scroll": [],
  "schrift_animation": [],
  "hover": [
   "listen-hover-bildvorschau",
   "hover-absicht-timing"
  ],
  "cursor": [],
  "mikro": [
   "kopieren-feedback",
   "gestaffelte-einblendung",
   "einblenden-starting-style",
   "druck-feedback"
  ],
  "material": [],
  "galerie": [
   "galerie-shared-element-vollbild"
  ],
  "footer": [
   "studio-visitenkarte-footer"
  ],
  "button": [
   "pfeil-icon-button",
   "kopieren-feedback"
  ]
 },
 "signatur": [
  "gestaffelte-einblendung"
 ],
 "varianten_demo": {
  "galerie-shared-element-vollbild": "basis",
  "studio-visitenkarte-footer": "basis",
  "theme-umschalter-view-transition": "tokens",
  "pfeil-icon-button": "seitenwechsel"
 },
 "nicht_verwenden": [
  "smooth-scroll-lenis – die Seite wird gelesen; Trägheit stört beim Lesen und ist bei keiner der drei Seiten im Einsatz",
  "schrift-hero-viewportbreit – widerspricht der leisen Haltung; die Referenzen beginnen mit Namen oder Satz in Textgröße",
  "kontextueller-cursor, cursor-follower-lerp, magnetische-elemente – Inszenierung statt Präzision",
  "prozent-zaehler und jede Art Preloader – die Seite ist klein und soll sofort stehen",
  "marquee-laufband – laut und repetitiv, bricht die Lesespalte",
  "Inter als Hauptschrift – Paco nutzt sie, sie steht aber auf der Verbotsliste (KI-Standardlook); Host Grotesk stattdessen"
 ],
 "regeln": [
  "Eine Spalte, max. 640px breit, linksbündig; Seite max. 1072px.",
  "Hero ist ein Satz in Textgröße: Name, Rolle, Arbeitgeber/Kunden, Ort, mit 1–2 kursiv gesetzten Wörtern in Newsreader.",
  "Nur zwei Gewichte (400/500); Hierarchie über Grauwert und Abstand, nicht über Größe.",
  "Jede Interaktion bekommt einen Zustand: Hover 80–160 ms, Fokus-Ring sichtbar, E-Mail-Adresse mit Kopier-Feedback.",
  "Jahreszahlen und Daten in Tabellenziffern, rechtsbündig in Listen.",
  "Dark Mode gleichwertig mitgestalten (Paco: zwei Textfarben-Token), Umschalten per View Transition.",
  "Bilder nur in Projektseiten oder als Hover-Vorschau; Startseite funktioniert als reiner Text.",
  "Pflichtangaben und Recht (Leitfaden 8a): Impressum auch als Freelancer (geschäftsmäßiges Angebot) und Datenschutzerklärung; Kundenprojekte und Logos nur mit Freigabe; Arbeiten aus Anstellung nur mit Erlaubnis des Arbeitgebers – vom Kunden prüfen lassen."
 ],
 "template_tauglich": true,
 "aufwand": "niedrig",
 "leistung": "Ideal für statische Auslieferung: zwei Schriftdateien als Subset (Paco lädt nur Subsets), kein JS-Framework für Animationen nötig, alles mit CSS-Transitions, @starting-style und View Transitions. Sehr gute Lighthouse-Werte erreichbar. Mobil identisch, weil schon einspaltig.",
 "offen": [
  "4. Referenz aus dem deutschen KMU-Segment fehlt (AD-Prüfung Runde 3; Referenzen bisher international/Premium-lastig)."
 ],
 "stimmung_tags": [
  "ruhig",
  "präzise"
 ],
 "raum": {
  "basis_px": 4,
  "skala_px": [
   4,
   8,
   12,
   16,
   20,
   24,
   32,
   48,
   64,
   96
  ],
  "sektion": "clamp(48px, 6vw, 80px)",
  "dichte": "dicht",
  "hinweis": "Dichter Rhythmus in einer schmalen Spalte: Zeilen 20 bis 32 px (Paco), Listeneinträge 12 px, Abschnitte 48 bis 80 px. Ruhe entsteht durch den breiten Rand, nicht durch große Sprünge."
 },
 "raster": {
  "spalten": 1,
  "rand": "clamp(20px, 5vw, 48px)",
  "spalt": "24px",
  "max_breite": "640px (Spalte), Seite 1072px",
  "hinweis": "Eine Spalte, linksbündig. Jahreszahlen in Listen rechtsbündig in Tabellenziffern. Projektseiten dürfen Bilder bis 1072px zeigen."
 },
 "form": {
  "radius_klein": "6px",
  "radius_gross": "8px",
  "pille": true,
  "linie": "1px #e8e8e8 als Trenner",
  "schatten": "keiner; Hover nur über Fläche #f0f0f0",
  "hinweis": "Konturpille für den Kontakt (pfeil-icon-button, Variante seitenwechsel), 6 px für Hover-Flächen und Kopier-Feedback, 8 px für Vorschaubilder."
 },
 "bildsprache": {
  "licht": "Neutral, Screenshots und Prototyp-Videos scharf auf neutralem Grund; Dark Mode mitgedacht.",
  "ausschnitt": "Ausschnitt einer echten Oberfläche, auf die Interaktion gezoomt.",
  "personen": "Höchstens ein Porträt auf der Info-Seite.",
  "formate": [
   "16:10",
   "4:3",
   "1:1"
  ],
  "nicht": "Keine Bilder auf der Startseite außer als Hover-Vorschau, keine Device-Mockups, keine Stock-Arbeitsplätze."
 },
 "ton": {
  "anrede": "du",
  "saetze": "Ich-Form, ganze Sätze in Textgröße, ein bis zwei kursive Wörter als Stimme. Listen knapp mit Jahr.",
  "haltung": "Leise und genau. Die Leser:in wird selten angesprochen; bei Beratung für Firmen Sie verwenden.",
  "beispiele": [
   "Ich gestalte Oberflächen für Werkzeuge, die man jeden Tag benutzt.",
   "Schreib mir, wenn du an etwas Ähnlichem arbeitest."
  ],
  "nicht": "„Passionate Designer“, Skill-Balken in Prozent, „Ich brenne für …“, Logo-Wände ohne Kontext."
 },
 "hero_aufbau": {
  "raster": "Eine Spalte, 640px, linksbündig; kein eigener Hero-Block.",
  "bild": "Kein Bild.",
  "h1": "clamp(1.25rem, 2vw, 1.5rem), Host Grotesk 500, Zeilenhöhe 1.4, als ganzer Satz oben links.",
  "handlung": "Kein CTA-Paar: E-Mail-Adresse mit Kopier-Feedback (kopieren-feedback) und ein Textlink zu den Arbeiten.",
  "zusatz": "Der Satz erscheint zeilenweise gestaffelt (gestaffelte-einblendung); 1 bis 2 Wörter in Newsreader Italic; Ort und Rolle in #646464."
 },
 "url": "https://cecodesign.de/lab/fundus/rezepte/freelancer-stille-visitenkarte/",
 "tokens_css": "https://cecodesign.de/lab/fundus/rezepte/freelancer-stille-visitenkarte/tokens.css",
 "bauplan": "https://cecodesign.de/lab/fundus/rezepte/freelancer-stille-visitenkarte/bauplan.txt",
 "rezept_json": "https://cecodesign.de/lab/fundus/rezepte/freelancer-stille-visitenkarte/rezept.json",
 "nicht_verwenden_ids": [
  {
   "ids": [
    "smooth-scroll-lenis"
   ],
   "grund": "die Seite wird gelesen; Trägheit stört beim Lesen und ist bei keiner der drei Seiten im Einsatz"
  },
  {
   "ids": [
    "schrift-hero-viewportbreit"
   ],
   "grund": "widerspricht der leisen Haltung; die Referenzen beginnen mit Namen oder Satz in Textgröße"
  },
  {
   "ids": [
    "kontextueller-cursor"
   ],
   "grund": ", cursor-follower-lerp, magnetische-elemente – Inszenierung statt Präzision"
  },
  {
   "ids": [
    "prozent-zaehler"
   ],
   "grund": "und jede Art Preloader – die Seite ist klein und soll sofort stehen"
  },
  {
   "ids": [
    "marquee-laufband"
   ],
   "grund": "laut und repetitiv, bricht die Lesespalte"
  },
  {
   "ids": [],
   "grund": "Inter als Hauptschrift – Paco nutzt sie, sie steht aber auf der Verbotsliste (KI-Standardlook); Host Grotesk stattdessen"
  }
 ],
 "alle_muster": [
  {
   "id": "gestaffelte-einblendung",
   "rolle": "Signatur",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/gestaffelte-einblendung/meta.json"
  },
  {
   "id": "projektindex-hover-vorschau",
   "rolle": "Sektion: Projekte / Arbeiten",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hero-layouts/projektindex-hover-vorschau/meta.json"
  },
  {
   "id": "akkordeon-hoehe-auto",
   "rolle": "Sektion: Angebot / Leistungen (was ich mache, für wen, wie man anfragt)",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/akkordeon-hoehe-auto/meta.json",
   "variante": "basis",
   "demo_url": "https://cecodesign.de/lab/fundus/mikroanimationen/akkordeon-hoehe-auto/demo?v=basis"
  },
  {
   "id": "editorial-magazin-layout",
   "rolle": "Sektion: Schreiben / Notizen",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hero-layouts/editorial-magazin-layout/meta.json",
   "variante": "magazin",
   "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/editorial-magazin-layout/demo?v=magazin"
  },
  {
   "id": "team-ueber-mich-layout",
   "rolle": "Sektion: Über mich / Jetzt",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hero-layouts/team-ueber-mich-layout/meta.json",
   "variante": "statement",
   "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/team-ueber-mich-layout/demo?v=statement"
  },
  {
   "id": "testimonials-neu-gedacht",
   "rolle": "Sektion: Stimmen von Kunden",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hero-layouts/testimonials-neu-gedacht/meta.json",
   "variante": "zitat",
   "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/testimonials-neu-gedacht/demo?v=zitat"
  },
  {
   "id": "kopieren-feedback",
   "rolle": "Sektion: Kontakt (E-Mail mit Kopier-Feedback, Verfügbarkeit)",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/kopieren-feedback/meta.json"
  },
  {
   "id": "kontakt-anfrage-formular",
   "rolle": "Sektion: Kontakt (E-Mail mit Kopier-Feedback, Verfügbarkeit)",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hero-layouts/kontakt-anfrage-formular/meta.json",
   "variante": "satz",
   "demo_url": "https://cecodesign.de/lab/fundus/hero-layouts/kontakt-anfrage-formular/demo?v=satz"
  },
  {
   "id": "theme-umschalter-view-transition",
   "rolle": "Navigation",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/navigation/theme-umschalter-view-transition/meta.json",
   "variante": "tokens",
   "demo_url": "https://cecodesign.de/lab/fundus/navigation/theme-umschalter-view-transition/demo?v=tokens"
  },
  {
   "id": "listen-hover-bildvorschau",
   "rolle": "Hover",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hover/listen-hover-bildvorschau/meta.json"
  },
  {
   "id": "hover-absicht-timing",
   "rolle": "Hover",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/hover/hover-absicht-timing/meta.json"
  },
  {
   "id": "einblenden-starting-style",
   "rolle": "Mikroanimation",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/einblenden-starting-style/meta.json"
  },
  {
   "id": "druck-feedback",
   "rolle": "Mikroanimation",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/mikroanimationen/druck-feedback/meta.json"
  },
  {
   "id": "galerie-shared-element-vollbild",
   "rolle": "Galerie",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/galerien-slider/galerie-shared-element-vollbild/meta.json",
   "variante": "basis",
   "demo_url": "https://cecodesign.de/lab/fundus/galerien-slider/galerie-shared-element-vollbild/demo?v=basis"
  },
  {
   "id": "studio-visitenkarte-footer",
   "rolle": "Footer",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/footer/studio-visitenkarte-footer/meta.json",
   "variante": "basis",
   "demo_url": "https://cecodesign.de/lab/fundus/footer/studio-visitenkarte-footer/demo?v=basis"
  },
  {
   "id": "pfeil-icon-button",
   "rolle": "Buttons",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/buttons/pfeil-icon-button/meta.json",
   "variante": "seitenwechsel",
   "demo_url": "https://cecodesign.de/lab/fundus/buttons/pfeil-icon-button/demo?v=seitenwechsel"
  },
  {
   "id": "token-tech-praezise",
   "rolle": "Animationsstil",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/animationsstile/token-tech-praezise/meta.json"
  },
  {
   "id": "eine-familie-wenig-gewichte",
   "rolle": "Schrift-Technik",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/typo-techniken/eine-familie-wenig-gewichte/meta.json"
  },
  {
   "id": "gemischte-schnitte-zeile",
   "rolle": "Schrift-Technik",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/typo-techniken/gemischte-schnitte-zeile/meta.json"
  },
  {
   "id": "lesesatz-text-wrap",
   "rolle": "Schrift-Technik",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/typo-techniken/lesesatz-text-wrap/meta.json"
  },
  {
   "id": "text-box-trim",
   "rolle": "Schrift-Technik",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/typo-techniken/text-box-trim/meta.json"
  },
  {
   "id": "tabellenziffern",
   "rolle": "Schrift-Technik",
   "demo": true,
   "meta": "https://cecodesign.de/lab/fundus/typo-techniken/tabellenziffern/meta.json"
  }
 ]
}