{
 "$schema": "../../schema.json",
 "schema": "fundus/1",
 "id": "trauerfall-sofortleiste",
 "name": "Trauerfall-Sofortleiste mit erster Anleitung",
 "name_en": "Bereavement call bar with first-steps guide",
 "kurz": "Die Nummer auf jeder Seite, dazu „Was ist jetzt zu tun?“ nach Sterbeort, eine Checkliste zum Drucken und ein Rückruf, der nur verspricht, was das Haus hält.",
 "kategorie": "Sektionen & Funktionen",
 "kategorie_slug": "sektionen",
 "kategorie_nr": 16,
 "bau_chat": "D",
 "prioritaet": "D",
 "trendstatus": "etabliert",
 "belegstatus": "belegt",
 "website_belege": 3,
 "stimmung": [
  "ruhig",
  "präzise",
  "warm"
 ],
 "stimmung_roh": [
  "ruhig",
  "klar",
  "vertrauenswürdig",
  "menschlich"
 ],
 "technik": [
  "css",
  "position-sticky",
  "vanilla-js",
  "form",
  "form-validation",
  "localstorage"
 ],
 "technik_gruppen": [
  "css",
  "js"
 ],
 "leistungskosten": "niedrig",
 "steckbrief": {
  "beschreibung": "Eine schmale Leiste auf jeder Seite: „Im Trauerfall · Tag und Nacht“, die Nummer als tel:-Link und der Knopf „Was ist jetzt zu tun?“. Am Desktop steht sie oben, auf dem Telefon unten in der Daumenzone. Der Knopf öffnet eine Anleitung nach Sterbeort (zu Hause; Krankenhaus, Heim, Hospiz; unerwartet oder Unfall; im Ausland) mit drei bis fünf nummerierten Schritten und dem Satz „Sie haben Zeit.“. Dazu eine Unterlagen-Checkliste mit echten Checkboxen zum Drucken und ein Rückruf mit zwei Feldern. Die Rückrufzeit steht nur da, wenn das Haus sie wirklich hält.",
  "warum_es_wirkt": "Wer gerade einen Menschen verloren hat, sucht nicht im Menü. Er braucht eine Nummer, unter der jemand abnimmt, und die Antwort auf „Was muss ich jetzt tun?“. Die Leiste gibt beides auf jeder Seite, ohne Werbung davor. Die Weiche nach Sterbeort nimmt Fragen vorweg, die am Telefon sonst zuerst kommen: Wer stellt den Tod fest, wen rufe ich wann an, was lege ich bereit.",
  "wann_einsetzen": "Bestattungshaus, Trauerbegleitung mit Bereitschaft, Bestattungswald oder Friedhofsverwaltung (dort mit dem Hinweis, zuerst ein Bestattungshaus zu beauftragen). Übertragbar auf andere Lagen mit Bereitschaft: Notdienst einer Praxis, Tierarzt-Notdienst, Pflegedienst.",
  "wann_nicht": "Wenn nachts niemand abnimmt: dann keine „Tag und Nacht“-Zeile, sondern die echten Zeiten der Rufbereitschaft. Nicht für Trauerredner ohne Bereitschaft (dort Erreichbarkeit und Rückruf). Nie als blinkender Störer, nie mit Countdown oder Verkaufsbotschaft.",
  "varianten": [
   "Leiste: Desktop oben (sticky), Telefon unten in der Daumenzone, Anleitung als aufklappbares Feld darunter bzw. darüber",
   "Eigene Seite „Was ist jetzt zu tun?“ mit Reitern nach Sterbeort, Checkliste zum Drucken und Rückruf",
   "Waldbestattung: Nummer der Verwaltung mit echten Zeiten und der Hinweis, zuerst ein Bestattungshaus zu beauftragen",
   "Rufbereitschaft nachts statt „Tag und Nacht“ (ehrliche Zeitangabe, Rückrufzusage nur, wenn sie stimmt)"
  ],
  "umsetzung": "Leiste als eigene Landmarke (<aside aria-label=\"Im Trauerfall\">) mit Sprunglink am Seitenanfang. Am Desktop position: sticky; top: 0, auf dem Telefon position: fixed; bottom: 0 mit env(safe-area-inset-bottom). scroll-padding-top bzw. scroll-padding-bottom in Höhe der Leiste, damit Fokus und Sprungziele nie darunter liegen (WCAG 2.4.11). Ein Consent-Banner steht über der Leiste, nicht unter ihr. Der Knopf „Was ist jetzt zu tun?“ ist ein Disclosure (aria-expanded, aria-controls) und öffnet ein Feld mit Reitern nach Sterbeort (role=tablist, Pfeiltasten, Pos1/Ende, automatische Aktivierung). Checkliste als fieldset mit echten Checkboxen; Stand nur lokal (localStorage), nichts wird gesendet; „Liste drucken“ ruft window.print(), @media print zeigt nur Kopf mit Nummer und Liste. Rückruf: zwei Felder (Name, Telefon, autocomplete name/tel), Fehlerliste über dem Formular, Bestätigung mit Uhrzeit aus der echten Zusage des Hauses; bei Fehler die Nummer zum Anrufen. Die Zeile „Tag und Nacht“ kommt aus der Konfiguration und wird zur Rufbereitschaft, wenn nachts kein Mensch abnimmt.",
  "mobil": "Leiste unten in der Daumenzone mit „Anrufen“ und „Was tun?“. Die Anleitung öffnet sich darüber als Feld mit eigener Scrollfläche und Schließen-Knopf. Der Seiteninhalt bekommt unten Platz in Höhe der Leiste.",
  "reduzierte_bewegung": "Das Feld öffnet und schließt ohne Übergang. Sonst bewegt sich nichts.",
  "barrierefreiheit": "Eigene Landmarke mit Sprunglink. Reiter nach APG (Pfeiltasten, Pos1, Ende), Checkliste als fieldset mit legend, Zähler als Text. Fokus nie unter der Leiste (scroll-padding, WCAG 2.4.11). Knöpfe 48 px, Text ab 19 px, Sekundärtext 6,5 : 1. Rückruf mit Fehlerliste und verknüpften Fehlermeldungen (aria-describedby), Bestätigung in einer role=status-Region. Keine Bewegung außer Öffnen und Schließen."
 },
 "messwerte": {
  "easing": "cubic-bezier(0.4, 0, 0.2, 1) öffnen, cubic-bezier(0.4, 0, 1, 1) schließen",
  "dauer_ms": "300 öffnen, 200 schließen, 150 Farbe",
  "stagger_ms": "",
  "distanz": "höchstens 6 px",
  "sonstiges": "Leiste 56 px (Telefon 64 px plus Sicherheitsabstand), Knöpfe 48 px, Nummer 1.5rem wght 600 in Tabellenziffern",
  "herkunft": "eigene Festlegung",
  "quelle": "Rezept bestattung-wuerdig (animationsstil_ui token-toggle-asymmetrisch, Regel: nichts bewegt sich von selbst)"
 },
 "kurve": {
  "bezier": [
   0.4,
   0.0,
   0.2,
   1.0
  ],
  "css": "cubic-bezier(0.4, 0, 0.2, 1)",
  "name": "Material Standard",
  "dauer_ms": 300
 },
 "gesehen_bei": [
  {
   "seite": "Bestattung Wien – Erste Schritte",
   "url": "https://www.bestattungwien.at/erste-schritte",
   "auszeichnung": "",
   "beobachtung": "Erste Schritte nach Sterbeort gegliedert (Zuhause; Krankenhaus, Pflegeheim, Pensionistenheim oder Hospiz; Ausland; öffentlicher Ort). Die 24-h-Nummer steht im Kopf und nach jedem Abschnitt noch einmal. Unterlagen als Liste. Österreichische Begriffe beim Übertragen auf Deutschland ersetzen.",
   "art": "website"
  },
  {
   "seite": "Trostwerk – Was nun zu tun ist",
   "url": "https://www.trostwerk.de/bestattung",
   "auszeichnung": "",
   "beobachtung": "Im Kopf „Tag und Nacht:“ mit Telefonnummer. Die Seite beruhigt zuerst („Sie haben Zeit“), dann die Reihenfolge bei erwartetem Tod zu Hause: Hausärztin oder 116 117 für die Todesbescheinigung, danach das Bestattungshaus; Krankenhaus, Hospiz und Heim übernehmen die Bescheinigung selbst.",
   "art": "website"
  },
  {
   "seite": "mymoria – Beerdigungskosten",
   "url": "https://www.mymoria.de/bestattung/beerdigungskosten/",
   "auszeichnung": "",
   "beobachtung": "Telefon im Kopf und in der Seitenleiste mit „Rund um die Uhr für Sie erreichbar“; die Nummer bleibt auch auf Inhaltsseiten sichtbar.",
   "art": "website"
  },
  {
   "seite": "Landeshauptstadt Stuttgart – Sterbefall anzeigen",
   "url": "https://www.stuttgart.de/organigramm/leistungen/sterbefall-anzeigen.php",
   "auszeichnung": "",
   "beobachtung": "Frist: spätestens am dritten Werktag nach dem Tod, Samstag zählt nicht als Werktag. Ein beauftragtes Bestattungshaus zeigt den Sterbefall an. Unterlagen: Todesbescheinigung, Ausweis, Geburtsurkunde, Urkunde der letzten Ehe oder Lebenspartnerschaft und Nachweis ihrer Auflösung. Grundlage der Checkliste (am 02.11.2026 per WebFetch gelesen).",
   "art": "artikel"
  }
 ],
 "tutorials": [
  {
   "titel": "W3C: Understanding SC 2.4.11 Focus Not Obscured (Minimum)",
   "url": "https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-minimum.html"
  },
  {
   "titel": "WAI-ARIA APG: Tabs Pattern",
   "url": "https://www.w3.org/WAI/ARIA/apg/patterns/tabs/"
  },
  {
   "titel": "MDN: Printing",
   "url": "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_media_queries/Printing"
  }
 ],
 "kombinierbar_mit": [
  "tabs-pfeiltasten-focusgroup",
  "akkordeon-hoehe-auto",
  "sprunglinks-landmarken",
  "formular-fehlerzusammenfassung",
  "consent-banner-gestaltet",
  "oeffnungszeiten-status",
  "tabellenziffern",
  "zoom-und-textabstand-robust"
 ],
 "urls": {
  "detail": "https://cecodesign.de/lab/fundus/sektionen/trauerfall-sofortleiste/",
  "meta": "https://cecodesign.de/lab/fundus/sektionen/trauerfall-sofortleiste/meta.json",
  "demo": "https://cecodesign.de/lab/fundus/sektionen/trauerfall-sofortleiste/demo"
 },
 "herkunft": {
  "quelldateien": [
   "Rezept-Runde 02.11.2026"
  ],
  "pruefnotizen": [
   "Belege am 02.11.2026 per WebFetch inhaltlich gelesen (nur Text, CSS nicht gemessen).",
   "Frist § 28 PStG und Unterlagen nach stuttgart.de; Landesrecht (wie lange Verstorbene zu Hause bleiben dürfen, Fristen bis zur Bestattung) bewusst nicht konkret genannt. Alle Texte der Anleitung vom Kunden prüfen lassen.",
   "Telefonnummern der Demo aus den Rufnummern für Medienproduktionen der Bundesnetzagentur (089 99998 xxx)."
  ]
 },
 "bau": {
  "status": "fertig",
  "kurz": "Die Nummer auf jeder Seite, dazu „Was ist jetzt zu tun?“ nach Sterbeort, eine Checkliste zum Drucken und ein Rückruf, der nur verspricht, was das Haus hält.",
  "demo": true,
  "abhaengigkeiten": [],
  "werte": {
   "easing": "öffnen cubic-bezier(0.4, 0, 0.2, 1), schließen cubic-bezier(0.4, 0, 1, 1) (token-toggle-asymmetrisch auf UI-Maß)",
   "dauer_ms": {
    "oeffnen": 300,
    "schliessen": 200,
    "farbe": 150
   },
   "distanz": "Feld translateY −6px → 0 (Telefon +6px → 0), dazu opacity 0 → 1; sonst keine Bewegung",
   "leiste": "Desktop position: sticky; top: 0, Höhe 64px, Schiefer #2b2d2c; Telefon (≤ 760px) position: fixed; bottom: 0, 96px plus env(safe-area-inset-bottom), zwei Knöpfe 52px („Anrufen“ mit Nummer in hellem Moos #8fb59a, „Was ist zu tun?“ mit Rand)",
   "fokus_nicht_verdeckt": "scroll-padding-top: calc(64px + 16px) am Desktop, scroll-padding-bottom: calc(96px + env(safe-area-inset-bottom) + 16px) und body padding-bottom auf dem Telefon; Fokus verlässt die Leiste → Feld schließt",
   "feld": "Disclosure (aria-expanded, aria-controls), absolut unter bzw. über der Leiste, max-height calc(100svh − Leiste), eigene Scrollfläche, Escape schließt und gibt den Fokus an den Knopf; Raster 15rem | 1fr | 19rem (≤ 1100px: Rückruf darunter)",
   "reiter": "role=tablist, im Feld senkrecht (aria-orientation vertical), auf der Seite waagerecht mit Umbruch; Pfeiltasten, Pos1, Ende, automatische Aktivierung; gewählt Fläche Sandstein #e8e1d5 mit 3px Schiefer-Kante",
   "schritte": "ol mit CSS-Zähler, Ziffer Source Serif 4 2rem (Seite 2.5rem) in #5a554d; nach jedem Reiter die Nummer noch einmal",
   "checkliste": "zwei fieldset mit legend, 10 echte Checkboxen 26px, accent-color #2b2d2c, Zähler „n von 10 bereit“ (aria-live polite), Stand in localStorage, nichts wird gesendet; window.print() und Klasse .druck (beforeprint/afterprint und Demo-Schalter) zeigen nur Kopf mit Nummer und Liste",
   "rueckruf": "zwei Felder (autocomplete name/tel), Fehlerliste mit Sprunglinks über den Feldern, aria-invalid und aria-describedby; Senden 900 ms simuliert, aria-busy; Bestätigung „Wir rufen Sie bis hh.mm Uhr an“ aus Europe/Berlin plus Zusage; Fehler mit Nummer zum Anrufen und „Noch einmal senden“",
   "zusage": "Tag und Nacht: 15 Min.; Rufbereitschaft: werktags 8–18 Uhr 15 Min., sonst 30 Min. mit „Sprechen Sie auf Band“; Wald: Bürozeit Mo–Fr 8–16 Uhr „heute bis 16 Uhr“, sonst nächster Werktag ab 8 Uhr",
   "schrift": "Source Serif 4 (opsz automatisch) für Überschriften und Ziffern der Schritte, Commissioner (FLAR 0, VOLM 0) Text 1.1875rem/1.65, Labels 1rem 500, Nummer 1.5rem 600 tabular-nums",
   "farben": "Kalk #f4f1eb, Text #24221f, Sandstein #e8e1d5, Schiefer #2b2d2c, Moos #3f5b48 (Rückruf-Knopf, Hover #34503d), helles Moos #8fb59a auf Schiefer, leise #5a554d, Linie #d3ccc0, auf Schiefer leise #c9c3b8, Fehler #8a2f1d",
   "knoepfe": "48px hoch (Leiste mobil 52px), Radius 6px, nur Farbwechsel 150 ms, kein Skalieren; Fokus outline 3px #24221f (auf Schiefer #f4f1eb), Versatz 3px; Textlink mit Pfeil (pfeil-icon-button Variante linie): Schaft opacity 0 → 1, Spitze translateX 3px",
   "vorfuehrung": "Leiste/Wald: Feld auf, Reiter weiter alle 2200 ms, Rückruf ausfüllen und senden, Feld zu; Seite: zur Anleitung, Reiter, Rückruf, dann vier Häkchen in der Checkliste"
  },
  "ausloeser": "klick",
  "touch": "Leiste unten in der Daumenzone mit „Anrufen“ (zweizeilig mit Nummer) und „Was ist zu tun?“; das Feld öffnet sich darüber mit eigener Scrollfläche, Kopfzeile mit „Schließen“ bleibt oben stehen. Reiter als Knöpfe in zwei Spalten. Consent-Banner steht über der Leiste, nicht darunter.",
  "reduziert": "Mit .reduziert öffnet und schließt das Feld ohne Übergang, Chevron dreht ohne Übergang. Sonst bewegt sich nichts, auch nicht in der Grundeinstellung.",
  "korrekturen": {},
  "geprueft": "02.11.2026",
  "notiz": "Welt: Rezept bestattung-wuerdig, erfundenes Bestattungshaus Steinlinde in München-Pasing, Variante Wald mit dem erfundenen Ruhewald am Hochanger (Landkreis München). Nummern aus dem Bereich der Bundesnetzagentur für Medienproduktionen (089 99998 120/340); 116 117, 112 und die Telefonseelsorge 0800 111 0 111 sind echt. Bilder als eigene flache SVG (Abschiedsraum mit Fenster zum Garten, Buchenwald mit Weg), ohne Verläufe, Kreuz, Kerze oder Hände. Schrift: Source Serif 4 als variable Datei mit opsz (source-serif-4-latin-opsz-normal.woff); eine Italic liegt nicht in assets/fonts. Pult: Variante, Nachts (Mensch am Telefon oder Rufbereitschaft), Rückruf scheitert, Consent-Banner, Druckansicht. Anleitung nach trostwerk.de (Reihenfolge Hausarzt oder 116 117, dann Bestattungshaus; „Sie haben Zeit“) und bestattungwien.at (nach Sterbeort, Nummer nach jedem Abschnitt), Unterlagen nach stuttgart.de (§ 28 PStG, dritter Werktag). Landesrecht (wie lange Verstorbene zu Hause bleiben dürfen, Fristen) bewusst nicht konkret; alle Texte als Platzhalter „vom Kunden prüfen lassen“ markiert. Geprüft: pruef.sh (alle drei Varianten), zugang.sh regeln/breite320 ohne Befund; Feld offen, Fehlerzustände und Druckansicht per vorübergehendem Testaufruf angesehen. AD-Review-Nachbesserung: Pult startet eingeklappt (verdeckte am Desktop die Bildunterschrift) und sitzt auf dem Telefon über der Sofortleiste statt über der Wortmarke. AD-Review 02.11.2026: Note 5",
  "varianten": [
   {
    "id": "leiste",
    "name": "Leiste mit Anleitung",
    "knopf": "Leiste",
    "wann": "Startseite und alle Seiten eines Bestattungshauses: die Nummer immer sichtbar, die Anleitung als Feld unter der Leiste (Telefon: darüber).",
    "werte": {
     "leiste": "Desktop sticky oben 64px, Telefon fixed unten 96px",
     "feld": "Raster 15rem | 1fr | 19rem mit Reitern senkrecht, Schritten und Rückruf",
     "fuss": "Link „Unterlagen-Checkliste zum Drucken“ führt zur Seite"
    }
   },
   {
    "id": "seite",
    "name": "Eigene Seite „Was ist jetzt zu tun?“",
    "knopf": "Seite",
    "wann": "Ziel der Leiste und der Tür „Ein Mensch ist gestorben“: ausführliche Schritte nach Sterbeort, Checkliste zum Drucken, Rückruf und was das Haus übernimmt.",
    "werte": {
     "leiste_knopf": "wird zum aktuellen Seitenziel (aria-current=page, Rand statt Fläche)",
     "kopf": "Text 1fr und Kontaktkarte 20rem Sandstein mit Nummer 1.75rem",
     "reiter": "waagerecht mit Umbruch, gewählt inset 0 −3px 0 #2b2d2c",
     "raster": "Anleitung 1fr | Rückruf 20rem; darunter Checkliste 1.25fr | „Was wir übernehmen“ 1fr",
     "druck": "@page 18mm 16mm, nur Kopf mit Nummer und Liste"
    }
   },
   {
    "id": "wald",
    "name": "Bestattungswald: Verwaltung",
    "knopf": "Wald",
    "wann": "Baum- und Waldbestattung oder Friedhofsverwaltung ohne eigene Bereitschaft: echte Bürozeiten statt „Tag und Nacht“ und zuerst der Hinweis, ein Bestattungshaus zu beauftragen.",
    "werte": {
     "leiste": "„Verwaltung Mo–Fr 8–16 Uhr“, Nummer 089 99998 340",
     "hinweis": "Kasten Sandstein mit 4px Schiefer-Kante: „Bitte beauftragen Sie zuerst ein Bestattungshaus.“",
     "reiter": "zwei: „Es gibt schon einen Platz“ · „Noch kein Platz“",
     "zusage": "während der Bürozeit „heute bis 16 Uhr“, sonst nächster Werktag ab 8 Uhr"
    }
   }
  ]
 }
}
