Firmenfeier \u2013 Aufl\u00f6sungstest<\/title>\r\n\r\n<style>\r\n :root{\r\n --quiz-bg: #DFE3E4C9;\r\n --quiz-text: #2F3C47;\r\n --quiz-font-size: 18px;\r\n\r\n --sage: #9caf88;\r\n --start-btn-bg: #eef5ec;\r\n --start-btn-bg-hover:#e3ecd5;\r\n\r\n --outro-btn-bg:#2F3C47;\r\n --outro-btn-bg-hover:#24303a;\r\n }\r\n\r\n html { scroll-behavior: smooth; }\r\n\r\n .start-screen { text-align:center; max-width:1300px; margin:1rem auto; }\r\n .start-button-wrapper{ display:flex; justify-content:center; margin-top:1.8rem; }\r\n .start-button{\r\n padding:1.05rem 2rem; border-radius:16px; border:1px solid #cfd8cc;\r\n background:var(--start-btn-bg); color:var(--quiz-text); cursor:pointer;\r\n font-size:1.4rem; font-weight:700; transition:background .2s ease, transform .1s ease;\r\n }\r\n .start-button:hover{ background:var(--start-btn-bg-hover); transform:translateY(-1px); }\r\n\r\n .quiz-box{\r\n max-width:13000px; margin:1rem auto; padding:1rem 1.25rem;\r\n border:1px solid #2F3C47; border-radius:14px;\r\n font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;\r\n background:var(--quiz-bg); color:var(--quiz-text); font-size:var(--quiz-font-size);\r\n }\r\n .quiz-title{ margin:0 0 .5rem 0; font-size:1.4rem; font-weight:700; }\r\n\r\n .quiz-progress{ margin:.5rem 0 1rem 0; font-size:.95rem; }\r\n .quiz-progress .bar{ height:8px; background:#eee; border-radius:999px; overflow:hidden; }\r\n .quiz-progress .bar-fill{ height:100%; background:var(--sage); transition:width .25s ease; width:10%; }\r\n\r\n fieldset{ border:0; padding:0; margin:0; }\r\n legend{ font-weight:700; margin-bottom:.5rem; font-size:1.1rem; }\r\n label{\r\n display:block; padding:.55rem .65rem; border:1px solid #ddd; border-radius:12px;\r\n margin:.45rem 0; cursor:pointer; transition:background-color .2s;\r\n }\r\n label:hover{ background:#f3f4f6; }\r\n input[type=\"radio\"]{ margin-right:.6rem; }\r\n\r\n .quiz-actions{ display:flex; gap:.5rem; margin-top:1rem; }\r\n button{\r\n padding:.65rem 1rem; border-radius:12px; border:1px solid #ccc;\r\n background:#f7f7f7; cursor:pointer; font-size:1rem;\r\n }\r\n button[disabled]{ opacity:.55; cursor:not-allowed; }\r\n .btn-restart{ background:var(--start-btn-bg); border-color:#b8d7b0; }\r\n\r\n .quiz-result{\r\n margin-top:1rem; padding:1rem; border:1px solid #e5e5e5; border-radius:12px; background:#fafafa;\r\n }\r\n .quiz-result ul{ margin-top:.6rem; padding-left:1.2rem; }\r\n .quiz-result li{ margin-bottom:.9rem; }\r\n\r\n .answer-correct{\r\n background:#ecfdf5; border-left:4px solid #22c55e; padding:.45rem .65rem;\r\n border-radius:10px; margin-top:.35rem;\r\n }\r\n .answer-wrong{\r\n background:#fef2f2; border-left:4px solid #ef4444; padding:.45rem .65rem;\r\n border-radius:10px; margin-top:.35rem;\r\n }\r\n\r\n .result-cta{ margin-top:1.5rem; display:flex; justify-content:center; }\r\n .result-button{\r\n display:inline-block; padding:.8rem 1.6rem; border-radius:14px;\r\n background:var(--outro-btn-bg); color:#fff; text-decoration:none; font-weight:700;\r\n transition:background-color .2s ease, transform .1s ease;\r\n }\r\n .result-button:hover{ background:var(--outro-btn-bg-hover); transform:translateY(-1px); }\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n<div id=\"quizAppBr\">\r\n <div id=\"startScreenBr\" class=\"start-screen\">\r\n <div class=\"start-button-wrapper\">\r\n <button id=\"btnStartBr\" class=\"start-button\">Zum Aufl\u00f6sungstest<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div id=\"quizBr\" class=\"quiz-box\" lang=\"de\" hidden>\r\n <h2 class=\"quiz-title\">Jetzt wird noch mal volle Konzentration gefordert, um den Fall abzuschlie\u00dfen.\r\n MAGNIFICUM w\u00fcnscht euch viel Erfolg!<\/h2>\r\n\r\n <div class=\"quiz-progress\" aria-live=\"polite\">\r\n <span id=\"progressTextBr\">Frage 1 von 5<\/span>\r\n <div class=\"bar\">\r\n <div class=\"bar-fill\" id=\"progressBarBr\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <form id=\"quizFormBr\">\r\n <fieldset class=\"quiz-step\" data-step=\"1\" hidden>\r\n <legend>1) Wer hat den Brand am Haus von Frau Habegger gelegt?<\/legend>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Walter M\u00fcller<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Omid Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Elnaz Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"richtig\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Benjamin Lang<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"2\" hidden>\r\n <legend>2) Was war das Motiv?<\/legend>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass die Sehlnauer Feuerwehr besser ausger\u00fcstet wird.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"richtig\"> Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um es selbst zu kaufen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um dort eine Fleischmoudi-Filiale zu er\u00f6ffnen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass Frau Habegger ihr Grundst\u00fcck wegen Brandschutz aufr\u00e4umen\/reinigen muss.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Frau Habegger aus Hass umzubringen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass Omid Sarwari seinen Job verliert.<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"3\" hidden>\r\n <legend>3) Wer hat das Feuer gel\u00f6scht?<\/legend>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Pfarrer Kunz<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Regina Frei<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Christine Habegger<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"richtig\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Alvaro Sch\u00e4r<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"4\" hidden>\r\n <legend>4) Warum hat die Person sich nicht gemeldet?<\/legend>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Um den T\u00e4ter \/ die T\u00e4terin zu sch\u00fctzen.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Damit nicht auffliegt, dass heimlich Fotos der Dorfbewohner gemacht wurden.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"richtig\"> Damit die geheime Liebesbeziehung nicht ans Licht kommt.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Um nicht als Unterst\u00fctzer*in von Christine Habegger zu gelten.<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"5\" hidden>\r\n <legend>5) Wer hat seine Nachbarn heimlich durchs Fenster fotografiert?<\/legend>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Omid Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"richtig\"> Doris Brechb\u00fchl<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Benjamin Lang<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Pius Langenegger<\/label>\r\n <\/fieldset>\r\n <\/form>\r\n\r\n <div class=\"quiz-actions\">\r\n <button type=\"button\" id=\"btnNextBr\" disabled>Weiter<\/button>\r\n <button type=\"button\" id=\"btnRestartBr\" class=\"btn-restart\" hidden>Nochmal spielen<\/button>\r\n <\/div>\r\n\r\n <div id=\"resultBr\" class=\"quiz-result\" hidden aria-live=\"polite\"><\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n const AUDIO_URL = 'https:\/\/magnificum.net\/wp-content\/uploads\/2025\/12\/suspense-cinematic-atmosphere-255436.mp3';\r\n\r\n const startScreen = document.getElementById('startScreenBr');\r\n const btnStart = document.getElementById('btnStartBr');\r\n const quiz = document.getElementById('quizBr');\r\n const quizForm = document.getElementById('quizFormBr');\r\n\r\n const steps = Array.from(quizForm.querySelectorAll('.quiz-step'));\r\n\r\n const btnNext = document.getElementById('btnNextBr');\r\n const btnRestart = document.getElementById('btnRestartBr');\r\n const resultBox = document.getElementById('resultBr');\r\n const progressText = document.getElementById('progressTextBr');\r\n const progressBar = document.getElementById('progressBarBr');\r\n\r\n \/\/ --- Audio setup ---\r\n const bgAudio = new Audio(AUDIO_URL);\r\n bgAudio.loop = true;\r\n bgAudio.preload = 'auto';\r\n bgAudio.volume = 1;\r\n\r\n let fadeRAF = null;\r\n\r\n function cancelFade() {\r\n if (fadeRAF) cancelAnimationFrame(fadeRAF);\r\n fadeRAF = null;\r\n }\r\n\r\n function fadeOutAudio(audio, durationMs = 1500) {\r\n cancelFade();\r\n const startVol = audio.volume ?? 1;\r\n const start = performance.now();\r\n\r\n function tick(now) {\r\n const t = Math.min(1, (now - start) \/ durationMs);\r\n audio.volume = Math.max(0, startVol * (1 - t));\r\n\r\n if (t < 1) {\r\n fadeRAF = requestAnimationFrame(tick);\r\n } else {\r\n audio.pause();\r\n audio.currentTime = 0; \/\/ optional: zur\u00fcckspulen\r\n audio.volume = startVol; \/\/ f\u00fcr \"Nochmal spielen\" wieder bereit\r\n fadeRAF = null;\r\n }\r\n }\r\n fadeRAF = requestAnimationFrame(tick);\r\n }\r\n\r\n function startAudio() {\r\n \/\/ Nur im Click-Handler sicher m\u00f6glich (Autoplay-Policies)\r\n cancelFade();\r\n bgAudio.currentTime = 0;\r\n bgAudio.volume = 1;\r\n bgAudio.play().catch(() => {\r\n \/\/ Falls der Browser blockt (selten, da Klick), einfach still bleiben\r\n });\r\n }\r\n\r\n const questionTexts = [\r\n 'Wer hat den Brand am Haus von Frau Habegger gelegt?',\r\n 'Was war das Motiv?',\r\n 'Wer hat das Feuer gel\u00f6scht?',\r\n 'Warum hat die Person sich nicht gemeldet?',\r\n 'Wer hat seine Nachbarn heimlich durchs Fenster fotografiert?'\r\n ];\r\n const correctAnswers = [\r\n 'Yolanda Langenegger',\r\n 'Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um es selbst zu kaufen.',\r\n 'Nathalie Ruch',\r\n 'Damit die geheime Liebesbeziehung nicht ans Licht kommt.',\r\n 'Doris Brechb\u00fchl'\r\n ];\r\n\r\n let current = 0;\r\n const total = steps.length;\r\n\r\n btnStart.addEventListener('click', () => {\r\n startScreen.style.display = 'none';\r\n quiz.hidden = false;\r\n toggleStep(0, true);\r\n updateProgress();\r\n\r\n \/\/ Audio starten\r\n startAudio();\r\n\r\n \/\/ Quiz mittig in den Viewport scrollen + Fokus\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n const firstRadio = steps[0].querySelector('input[type=\"radio\"]');\r\n if (firstRadio) firstRadio.focus({ preventScroll: true });\r\n });\r\n });\r\n\r\n steps.forEach((fs) => {\r\n fs.addEventListener('change', () => {\r\n btnNext.disabled = !getSelected(fs);\r\n });\r\n });\r\n\r\n btnNext.addEventListener('click', () => {\r\n const fs = steps[current];\r\n if (!getSelected(fs)) return;\r\n\r\n if (current === total - 1) return showResult();\r\n\r\n toggleStep(current, false);\r\n current += 1;\r\n toggleStep(current, true);\r\n updateProgress();\r\n btnNext.disabled = !getSelected(steps[current]);\r\n\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n });\r\n });\r\n\r\n btnRestart.addEventListener('click', resetQuiz);\r\n\r\n function getSelected(fieldset) {\r\n return fieldset.querySelector('input[type=\"radio\"]:checked');\r\n }\r\n function toggleStep(index, show) {\r\n if (!steps[index]) return;\r\n steps[index].hidden = !show;\r\n }\r\n function updateProgress() {\r\n const stepNr = current + 1;\r\n progressText.textContent = `Frage ${stepNr} von ${total}`;\r\n progressBar.style.width = Math.round((stepNr \/ total) * 100) + '%';\r\n }\r\n\r\n function showResult() {\r\n \/\/ Beim Ergebnis: Audio ausfaden\r\n fadeOutAudio(bgAudio, 1500);\r\n\r\n let score = 0;\r\n let list = '<h3>Auswertung (gr\u00fcn = richtig, rot = falsch):<\/h3><ul>';\r\n\r\n steps.forEach((fs, i) => {\r\n const sel = getSelected(fs);\r\n const isCorrect = !!(sel && sel.value === 'richtig');\r\n if (isCorrect) score++;\r\n\r\n const playerText = sel ? sel.parentElement.textContent.trim() : 'Keine Antwort';\r\n\r\n list += `\r\n <li>\r\n <strong>${questionTexts[i]}<\/strong>\r\n <div class=\"${isCorrect ? 'answer-correct' : 'answer-wrong'}\">\r\n ${isCorrect ? '\u2714 Richtig \u2013 deine Antwort:' : '\u2718 Falsch \u2013 deine Antwort:'}\r\n ${playerText}\r\n <\/div>\r\n ${!isCorrect ? `\r\n <div class=\"answer-correct\">\r\n \u2714 Richtige Antwort: ${correctAnswers[i]}\r\n <\/div>` : ''}\r\n <\/li>\r\n `;\r\n });\r\n\r\n list += '<\/ul>';\r\n\r\n steps[current].hidden = true;\r\n btnNext.hidden = true;\r\n btnRestart.hidden = false;\r\n progressText.textContent = 'Ergebnis';\r\n progressBar.style.width = '100%';\r\n\r\n const Prozent = Math.round((score \/ total) * 100);\r\n\r\n resultBox.innerHTML = `\r\n <strong>Du hast ${score} von ${total} richtig (${Prozent}%).<\/strong>\r\n ${list}\r\n <div class=\"result-cta\">\r\n <a href=\"https:\/\/magnificum.net\/br-outro\" class=\"result-button\">H\u00f6rspiel Outro zum Fall<\/a>\r\n <\/div>\r\n `;\r\n resultBox.hidden = false;\r\n\r\n requestAnimationFrame(() => {\r\n resultBox.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n });\r\n }\r\n\r\n function resetQuiz() {\r\n \/\/ Falls gerade gefadet wurde: stoppen & wieder startbereit machen\r\n cancelFade();\r\n bgAudio.pause();\r\n bgAudio.currentTime = 0;\r\n bgAudio.volume = 1;\r\n\r\n quizForm.reset();\r\n steps.forEach((fs, i) => (fs.hidden = i !== 0));\r\n current = 0;\r\n btnNext.hidden = false;\r\n btnRestart.hidden = true;\r\n btnNext.disabled = true;\r\n resultBox.hidden = true;\r\n resultBox.innerHTML = '';\r\n updateProgress();\r\n\r\n \/\/ Audio beim Neustart wieder starten\r\n startAudio();\r\n\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n const firstRadio = steps[0].querySelector('input[type=\"radio\"]');\r\n if (firstRadio) firstRadio.focus({ preventScroll: true });\r\n });\r\n }\r\n})();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-77302bc elementor-widget elementor-widget-spacer\" data-id=\"77302bc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-de099b5 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"de099b5\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-5af5954\" data-id=\"5af5954\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-510708a elementor-widget elementor-widget-text-editor\" data-id=\"510708a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"text-align: center;\"><span style=\"color: #ffffff;\"><strong><a style=\"color: #ffffff;\" href=\"\/datenschutz\">DATENSCHUTZ<\/a>\u00a0 |\u00a0 <a style=\"color: #ffffff;\" href=\"\/impressum\">IMPRESSUM<\/a><\/strong><\/span><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Firmenfeier \u2013 Aufl\u00f6sungstest Zum Aufl\u00f6sungstest Jetzt wird noch mal volle Konzentration gefordert, um den Fall abzuschlie\u00dfen. MAGNIFICUM w\u00fcnscht euch viel Erfolg! Frage 1 von 5 1) Wer hat den Brand am Haus von Frau Habegger gelegt? Nathalie Ruch Walter M\u00fcller Omid Sarwari Elnaz Sarwari Yolanda Langenegger Benjamin Lang 2) Was war das Motiv? Zu erreichen, dass die Sehlnauer Feuerwehr besser ausger\u00fcstet wird. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8875","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/comments?post=8875"}],"version-history":[{"count":73,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875\/revisions"}],"predecessor-version":[{"id":23308,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875\/revisions\/23308"}],"wp:attachment":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/media?parent=8875"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t\t\t

\n\t\t\t

<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nFirmenfeier \u2013 Aufl\u00f6sungstest<\/title>\r\n\r\n<style>\r\n :root{\r\n --quiz-bg: #DFE3E4C9;\r\n --quiz-text: #2F3C47;\r\n --quiz-font-size: 18px;\r\n\r\n --sage: #9caf88;\r\n --start-btn-bg: #eef5ec;\r\n --start-btn-bg-hover:#e3ecd5;\r\n\r\n --outro-btn-bg:#2F3C47;\r\n --outro-btn-bg-hover:#24303a;\r\n }\r\n\r\n html { scroll-behavior: smooth; }\r\n\r\n .start-screen { text-align:center; max-width:1300px; margin:1rem auto; }\r\n .start-button-wrapper{ display:flex; justify-content:center; margin-top:1.8rem; }\r\n .start-button{\r\n padding:1.05rem 2rem; border-radius:16px; border:1px solid #cfd8cc;\r\n background:var(--start-btn-bg); color:var(--quiz-text); cursor:pointer;\r\n font-size:1.4rem; font-weight:700; transition:background .2s ease, transform .1s ease;\r\n }\r\n .start-button:hover{ background:var(--start-btn-bg-hover); transform:translateY(-1px); }\r\n\r\n .quiz-box{\r\n max-width:13000px; margin:1rem auto; padding:1rem 1.25rem;\r\n border:1px solid #2F3C47; border-radius:14px;\r\n font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;\r\n background:var(--quiz-bg); color:var(--quiz-text); font-size:var(--quiz-font-size);\r\n }\r\n .quiz-title{ margin:0 0 .5rem 0; font-size:1.4rem; font-weight:700; }\r\n\r\n .quiz-progress{ margin:.5rem 0 1rem 0; font-size:.95rem; }\r\n .quiz-progress .bar{ height:8px; background:#eee; border-radius:999px; overflow:hidden; }\r\n .quiz-progress .bar-fill{ height:100%; background:var(--sage); transition:width .25s ease; width:10%; }\r\n\r\n fieldset{ border:0; padding:0; margin:0; }\r\n legend{ font-weight:700; margin-bottom:.5rem; font-size:1.1rem; }\r\n label{\r\n display:block; padding:.55rem .65rem; border:1px solid #ddd; border-radius:12px;\r\n margin:.45rem 0; cursor:pointer; transition:background-color .2s;\r\n }\r\n label:hover{ background:#f3f4f6; }\r\n input[type=\"radio\"]{ margin-right:.6rem; }\r\n\r\n .quiz-actions{ display:flex; gap:.5rem; margin-top:1rem; }\r\n button{\r\n padding:.65rem 1rem; border-radius:12px; border:1px solid #ccc;\r\n background:#f7f7f7; cursor:pointer; font-size:1rem;\r\n }\r\n button[disabled]{ opacity:.55; cursor:not-allowed; }\r\n .btn-restart{ background:var(--start-btn-bg); border-color:#b8d7b0; }\r\n\r\n .quiz-result{\r\n margin-top:1rem; padding:1rem; border:1px solid #e5e5e5; border-radius:12px; background:#fafafa;\r\n }\r\n .quiz-result ul{ margin-top:.6rem; padding-left:1.2rem; }\r\n .quiz-result li{ margin-bottom:.9rem; }\r\n\r\n .answer-correct{\r\n background:#ecfdf5; border-left:4px solid #22c55e; padding:.45rem .65rem;\r\n border-radius:10px; margin-top:.35rem;\r\n }\r\n .answer-wrong{\r\n background:#fef2f2; border-left:4px solid #ef4444; padding:.45rem .65rem;\r\n border-radius:10px; margin-top:.35rem;\r\n }\r\n\r\n .result-cta{ margin-top:1.5rem; display:flex; justify-content:center; }\r\n .result-button{\r\n display:inline-block; padding:.8rem 1.6rem; border-radius:14px;\r\n background:var(--outro-btn-bg); color:#fff; text-decoration:none; font-weight:700;\r\n transition:background-color .2s ease, transform .1s ease;\r\n }\r\n .result-button:hover{ background:var(--outro-btn-bg-hover); transform:translateY(-1px); }\r\n<\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n<div id=\"quizAppBr\">\r\n <div id=\"startScreenBr\" class=\"start-screen\">\r\n <div class=\"start-button-wrapper\">\r\n <button id=\"btnStartBr\" class=\"start-button\">Zum Aufl\u00f6sungstest<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div id=\"quizBr\" class=\"quiz-box\" lang=\"de\" hidden>\r\n <h2 class=\"quiz-title\">Jetzt wird noch mal volle Konzentration gefordert, um den Fall abzuschlie\u00dfen.\r\n MAGNIFICUM w\u00fcnscht euch viel Erfolg!<\/h2>\r\n\r\n <div class=\"quiz-progress\" aria-live=\"polite\">\r\n <span id=\"progressTextBr\">Frage 1 von 5<\/span>\r\n <div class=\"bar\">\r\n <div class=\"bar-fill\" id=\"progressBarBr\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <form id=\"quizFormBr\">\r\n <fieldset class=\"quiz-step\" data-step=\"1\" hidden>\r\n <legend>1) Wer hat den Brand am Haus von Frau Habegger gelegt?<\/legend>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Walter M\u00fcller<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Omid Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Elnaz Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"richtig\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q1\" value=\"falsch\"> Benjamin Lang<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"2\" hidden>\r\n <legend>2) Was war das Motiv?<\/legend>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass die Sehlnauer Feuerwehr besser ausger\u00fcstet wird.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"richtig\"> Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um es selbst zu kaufen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um dort eine Fleischmoudi-Filiale zu er\u00f6ffnen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass Frau Habegger ihr Grundst\u00fcck wegen Brandschutz aufr\u00e4umen\/reinigen muss.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Frau Habegger aus Hass umzubringen.<\/label>\r\n <label><input type=\"radio\" name=\"q2\" value=\"falsch\"> Zu erreichen, dass Omid Sarwari seinen Job verliert.<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"3\" hidden>\r\n <legend>3) Wer hat das Feuer gel\u00f6scht?<\/legend>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Pfarrer Kunz<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Regina Frei<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Christine Habegger<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"richtig\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q3\" value=\"falsch\"> Alvaro Sch\u00e4r<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"4\" hidden>\r\n <legend>4) Warum hat die Person sich nicht gemeldet?<\/legend>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Um den T\u00e4ter \/ die T\u00e4terin zu sch\u00fctzen.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Damit nicht auffliegt, dass heimlich Fotos der Dorfbewohner gemacht wurden.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"richtig\"> Damit die geheime Liebesbeziehung nicht ans Licht kommt.<\/label>\r\n <label><input type=\"radio\" name=\"q4\" value=\"falsch\"> Um nicht als Unterst\u00fctzer*in von Christine Habegger zu gelten.<\/label>\r\n <\/fieldset>\r\n\r\n <fieldset class=\"quiz-step\" data-step=\"5\" hidden>\r\n <legend>5) Wer hat seine Nachbarn heimlich durchs Fenster fotografiert?<\/legend>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Omid Sarwari<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"richtig\"> Doris Brechb\u00fchl<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Yolanda Langenegger<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Nathalie Ruch<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Benjamin Lang<\/label>\r\n <label><input type=\"radio\" name=\"q5\" value=\"falsch\"> Pius Langenegger<\/label>\r\n <\/fieldset>\r\n <\/form>\r\n\r\n <div class=\"quiz-actions\">\r\n <button type=\"button\" id=\"btnNextBr\" disabled>Weiter<\/button>\r\n <button type=\"button\" id=\"btnRestartBr\" class=\"btn-restart\" hidden>Nochmal spielen<\/button>\r\n <\/div>\r\n\r\n <div id=\"resultBr\" class=\"quiz-result\" hidden aria-live=\"polite\"><\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n const AUDIO_URL = 'https:\/\/magnificum.net\/wp-content\/uploads\/2025\/12\/suspense-cinematic-atmosphere-255436.mp3';\r\n\r\n const startScreen = document.getElementById('startScreenBr');\r\n const btnStart = document.getElementById('btnStartBr');\r\n const quiz = document.getElementById('quizBr');\r\n const quizForm = document.getElementById('quizFormBr');\r\n\r\n const steps = Array.from(quizForm.querySelectorAll('.quiz-step'));\r\n\r\n const btnNext = document.getElementById('btnNextBr');\r\n const btnRestart = document.getElementById('btnRestartBr');\r\n const resultBox = document.getElementById('resultBr');\r\n const progressText = document.getElementById('progressTextBr');\r\n const progressBar = document.getElementById('progressBarBr');\r\n\r\n \/\/ --- Audio setup ---\r\n const bgAudio = new Audio(AUDIO_URL);\r\n bgAudio.loop = true;\r\n bgAudio.preload = 'auto';\r\n bgAudio.volume = 1;\r\n\r\n let fadeRAF = null;\r\n\r\n function cancelFade() {\r\n if (fadeRAF) cancelAnimationFrame(fadeRAF);\r\n fadeRAF = null;\r\n }\r\n\r\n function fadeOutAudio(audio, durationMs = 1500) {\r\n cancelFade();\r\n const startVol = audio.volume ?? 1;\r\n const start = performance.now();\r\n\r\n function tick(now) {\r\n const t = Math.min(1, (now - start) \/ durationMs);\r\n audio.volume = Math.max(0, startVol * (1 - t));\r\n\r\n if (t < 1) {\r\n fadeRAF = requestAnimationFrame(tick);\r\n } else {\r\n audio.pause();\r\n audio.currentTime = 0; \/\/ optional: zur\u00fcckspulen\r\n audio.volume = startVol; \/\/ f\u00fcr \"Nochmal spielen\" wieder bereit\r\n fadeRAF = null;\r\n }\r\n }\r\n fadeRAF = requestAnimationFrame(tick);\r\n }\r\n\r\n function startAudio() {\r\n \/\/ Nur im Click-Handler sicher m\u00f6glich (Autoplay-Policies)\r\n cancelFade();\r\n bgAudio.currentTime = 0;\r\n bgAudio.volume = 1;\r\n bgAudio.play().catch(() => {\r\n \/\/ Falls der Browser blockt (selten, da Klick), einfach still bleiben\r\n });\r\n }\r\n\r\n const questionTexts = [\r\n 'Wer hat den Brand am Haus von Frau Habegger gelegt?',\r\n 'Was war das Motiv?',\r\n 'Wer hat das Feuer gel\u00f6scht?',\r\n 'Warum hat die Person sich nicht gemeldet?',\r\n 'Wer hat seine Nachbarn heimlich durchs Fenster fotografiert?'\r\n ];\r\n const correctAnswers = [\r\n 'Yolanda Langenegger',\r\n 'Frau Habegger dazu zu bringen, ihr Haus zu verkaufen, um es selbst zu kaufen.',\r\n 'Nathalie Ruch',\r\n 'Damit die geheime Liebesbeziehung nicht ans Licht kommt.',\r\n 'Doris Brechb\u00fchl'\r\n ];\r\n\r\n let current = 0;\r\n const total = steps.length;\r\n\r\n btnStart.addEventListener('click', () => {\r\n startScreen.style.display = 'none';\r\n quiz.hidden = false;\r\n toggleStep(0, true);\r\n updateProgress();\r\n\r\n \/\/ Audio starten\r\n startAudio();\r\n\r\n \/\/ Quiz mittig in den Viewport scrollen + Fokus\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n const firstRadio = steps[0].querySelector('input[type=\"radio\"]');\r\n if (firstRadio) firstRadio.focus({ preventScroll: true });\r\n });\r\n });\r\n\r\n steps.forEach((fs) => {\r\n fs.addEventListener('change', () => {\r\n btnNext.disabled = !getSelected(fs);\r\n });\r\n });\r\n\r\n btnNext.addEventListener('click', () => {\r\n const fs = steps[current];\r\n if (!getSelected(fs)) return;\r\n\r\n if (current === total - 1) return showResult();\r\n\r\n toggleStep(current, false);\r\n current += 1;\r\n toggleStep(current, true);\r\n updateProgress();\r\n btnNext.disabled = !getSelected(steps[current]);\r\n\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n });\r\n });\r\n\r\n btnRestart.addEventListener('click', resetQuiz);\r\n\r\n function getSelected(fieldset) {\r\n return fieldset.querySelector('input[type=\"radio\"]:checked');\r\n }\r\n function toggleStep(index, show) {\r\n if (!steps[index]) return;\r\n steps[index].hidden = !show;\r\n }\r\n function updateProgress() {\r\n const stepNr = current + 1;\r\n progressText.textContent = `Frage ${stepNr} von ${total}`;\r\n progressBar.style.width = Math.round((stepNr \/ total) * 100) + '%';\r\n }\r\n\r\n function showResult() {\r\n \/\/ Beim Ergebnis: Audio ausfaden\r\n fadeOutAudio(bgAudio, 1500);\r\n\r\n let score = 0;\r\n let list = '<h3>Auswertung (gr\u00fcn = richtig, rot = falsch):<\/h3><ul>';\r\n\r\n steps.forEach((fs, i) => {\r\n const sel = getSelected(fs);\r\n const isCorrect = !!(sel && sel.value === 'richtig');\r\n if (isCorrect) score++;\r\n\r\n const playerText = sel ? sel.parentElement.textContent.trim() : 'Keine Antwort';\r\n\r\n list += `\r\n <li>\r\n <strong>${questionTexts[i]}<\/strong>\r\n <div class=\"${isCorrect ? 'answer-correct' : 'answer-wrong'}\">\r\n ${isCorrect ? '\u2714 Richtig \u2013 deine Antwort:' : '\u2718 Falsch \u2013 deine Antwort:'}\r\n ${playerText}\r\n <\/div>\r\n ${!isCorrect ? `\r\n <div class=\"answer-correct\">\r\n \u2714 Richtige Antwort: ${correctAnswers[i]}\r\n <\/div>` : ''}\r\n <\/li>\r\n `;\r\n });\r\n\r\n list += '<\/ul>';\r\n\r\n steps[current].hidden = true;\r\n btnNext.hidden = true;\r\n btnRestart.hidden = false;\r\n progressText.textContent = 'Ergebnis';\r\n progressBar.style.width = '100%';\r\n\r\n const Prozent = Math.round((score \/ total) * 100);\r\n\r\n resultBox.innerHTML = `\r\n <strong>Du hast ${score} von ${total} richtig (${Prozent}%).<\/strong>\r\n ${list}\r\n <div class=\"result-cta\">\r\n <a href=\"https:\/\/magnificum.net\/br-outro\" class=\"result-button\">H\u00f6rspiel Outro zum Fall<\/a>\r\n <\/div>\r\n `;\r\n resultBox.hidden = false;\r\n\r\n requestAnimationFrame(() => {\r\n resultBox.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n });\r\n }\r\n\r\n function resetQuiz() {\r\n \/\/ Falls gerade gefadet wurde: stoppen & wieder startbereit machen\r\n cancelFade();\r\n bgAudio.pause();\r\n bgAudio.currentTime = 0;\r\n bgAudio.volume = 1;\r\n\r\n quizForm.reset();\r\n steps.forEach((fs, i) => (fs.hidden = i !== 0));\r\n current = 0;\r\n btnNext.hidden = false;\r\n btnRestart.hidden = true;\r\n btnNext.disabled = true;\r\n resultBox.hidden = true;\r\n resultBox.innerHTML = '';\r\n updateProgress();\r\n\r\n \/\/ Audio beim Neustart wieder starten\r\n startAudio();\r\n\r\n requestAnimationFrame(() => {\r\n quiz.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n const firstRadio = steps[0].querySelector('input[type=\"radio\"]');\r\n if (firstRadio) firstRadio.focus({ preventScroll: true });\r\n });\r\n }\r\n})();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-77302bc elementor-widget elementor-widget-spacer\" data-id=\"77302bc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-de099b5 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"de099b5\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-5af5954\" data-id=\"5af5954\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-510708a elementor-widget elementor-widget-text-editor\" data-id=\"510708a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"text-align: center;\"><span style=\"color: #ffffff;\"><strong><a style=\"color: #ffffff;\" href=\"\/datenschutz\">DATENSCHUTZ<\/a>\u00a0 |\u00a0 <a style=\"color: #ffffff;\" href=\"\/impressum\">IMPRESSUM<\/a><\/strong><\/span><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Firmenfeier \u2013 Aufl\u00f6sungstest Zum Aufl\u00f6sungstest Jetzt wird noch mal volle Konzentration gefordert, um den Fall abzuschlie\u00dfen. MAGNIFICUM w\u00fcnscht euch viel Erfolg! Frage 1 von 5 1) Wer hat den Brand am Haus von Frau Habegger gelegt? Nathalie Ruch Walter M\u00fcller Omid Sarwari Elnaz Sarwari Yolanda Langenegger Benjamin Lang 2) Was war das Motiv? Zu erreichen, dass die Sehlnauer Feuerwehr besser ausger\u00fcstet wird. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8875","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/comments?post=8875"}],"version-history":[{"count":73,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875\/revisions"}],"predecessor-version":[{"id":23308,"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/pages\/8875\/revisions\/23308"}],"wp:attachment":[{"href":"https:\/\/magnificum.net\/en\/wp-json\/wp\/v2\/media?parent=8875"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}