{"id":233170,"date":"2026-05-13T06:46:23","date_gmt":"2026-05-13T04:46:23","guid":{"rendered":"https:\/\/deinperfectday.de\/?page_id=233170"},"modified":"2026-05-13T07:12:49","modified_gmt":"2026-05-13T05:12:49","slug":"support","status":"publish","type":"page","link":"https:\/\/deinperfectday.de\/es\/support\/","title":{"rendered":"Apoyo"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8221;1&#8243; _builder_version=&#8221;4.27.6&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_row _builder_version=&#8221;4.27.6&#8243; _module_preset=&#8221;default&#8221;][et_pb_column _builder_version=&#8221;4.27.6&#8243; _module_preset=&#8221;default&#8221; type=&#8221;4_4&#8243;][et_pb_text _builder_version=&#8221;4.27.6&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; sticky_enabled=&#8221;0&#8243;]<\/p>\n    <section class=\"pfd-support\" id=\"pfd-support-1\" aria-labelledby=\"pfd-support-1-title\">\n        <div class=\"pfd-support__card\">\n            <header class=\"pfd-support__header\">\n                <div class=\"pfd-support__icon\" aria-hidden=\"true\">\n                    <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\">\n                        <path d=\"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z\"\/>\n                    <\/svg>\n                <\/div>\n                <div>\n                    <h2 class=\"pfd-support__title\" id=\"pfd-support-1-title\">Support kontaktieren<\/h2>\n                    <p class=\"pfd-support__lede\">Wir melden uns typisch innerhalb von 1\u20132 Werktagen zur\u00fcck. <span class=\"pfd-support__required-note\">Mit <span aria-hidden=\"true\">*<\/span><span class=\"pfd-sr-only\"> Sternchen <\/span> markierte Felder sind Pflichtfelder.<\/span><\/p>\n                <\/div>\n            <\/header>\n\n            <form class=\"pfd-support__form\" novalidate aria-describedby=\"pfd-support-1-status\">\n                <input type=\"hidden\" name=\"action\" value=\"pfd_support_submit\">\n                <input type=\"hidden\" name=\"_nonce\" value=\"d688a4bbfd\">\n                <input type=\"hidden\" name=\"_t\" value=\"1779170401\">\n                <input type=\"hidden\" name=\"source\" value=\"\">\n\n                <!-- Honeypot: f\u00fcr Menschen unsichtbar, Bots bef\u00fcllen es.\n                     `aria-hidden` + `tabindex=-1` + `autocomplete=off` \u2192\n                     unsichtbar f\u00fcr Screenreader UND Tastatur-Nav. -->\n                <div class=\"pfd-support__honeypot\" aria-hidden=\"true\">\n                    <label>Bitte leer lassen\n                        <input type=\"text\" name=\"_hp\" autocomplete=\"off\" tabindex=\"-1\">\n                    <\/label>\n                <\/div>\n\n                <div class=\"pfd-support__grid\">\n                    <div class=\"pfd-support__field\">\n                        <label for=\"pfd-support-1-name\">Name <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                        <input id=\"pfd-support-1-name\" type=\"text\" name=\"name\" required aria-required=\"true\" maxlength=\"80\" autocomplete=\"name\">\n                    <\/div>\n                    <div class=\"pfd-support__field\">\n                        <label for=\"pfd-support-1-email\">E-Mail <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                        <input id=\"pfd-support-1-email\" type=\"email\" name=\"email\" required aria-required=\"true\" maxlength=\"160\" autocomplete=\"email\" inputmode=\"email\">\n                    <\/div>\n                <\/div>\n\n                                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-1-category\">Anliegen<\/label>\n                    <div class=\"pfd-support__select\">\n                        <select id=\"pfd-support-1-category\" name=\"category\">\n                                                            <option value=\"bug\">\ud83d\udc1b Bug \/ Problem<\/option>\n                                                            <option value=\"feature\">\u2728 Feature-Wunsch<\/option>\n                                                            <option value=\"question\">\u2753 Frage<\/option>\n                                                            <option value=\"other\">\ud83d\udde8 Sonstiges<\/option>\n                                                    <\/select>\n                        <svg class=\"pfd-support__select-arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\" focusable=\"false\">\n                            <polyline points=\"6 9 12 15 18 9\"><\/polyline>\n                        <\/svg>\n                    <\/div>\n                <\/div>\n                \n                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-1-subject\">Betreff <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                    <input id=\"pfd-support-1-subject\" type=\"text\" name=\"subject\" required aria-required=\"true\" maxlength=\"160\">\n                <\/div>\n\n                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-1-message\">Nachricht <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                    <textarea id=\"pfd-support-1-message\" name=\"message\" rows=\"6\" required aria-required=\"true\" minlength=\"10\" maxlength=\"4000\" aria-describedby=\"pfd-support-1-message-help pfd-support-1-message-counter\" placeholder=\"Beschreib uns kurz, was wir f\u00fcr dich tun k\u00f6nnen \u2026\"><\/textarea>\n                    <span class=\"pfd-sr-only\" id=\"pfd-support-1-message-help\">Mindestens 10, maximal 4000 Zeichen.<\/span>\n                    <span class=\"pfd-support__counter\" id=\"pfd-support-1-message-counter\" aria-hidden=\"true\"><span class=\"pfd-support__counter-now\">0<\/span> \/ 4000<\/span>\n                <\/div>\n\n                <div class=\"pfd-support__field pfd-support__field--consent\">\n                    <label class=\"pfd-support__consent\" for=\"pfd-support-1-consent\">\n                        <input id=\"pfd-support-1-consent\" type=\"checkbox\" name=\"consent\" value=\"1\" required aria-required=\"true\">\n                        <span class=\"pfd-support__consent-box\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 16 16\" width=\"12\" height=\"12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\">\n                                <polyline points=\"3 8 7 12 13 4\"\/>\n                            <\/svg>\n                        <\/span>\n                        <span class=\"pfd-support__consent-text\">\n                            Ich habe die <a href=\"https:\/\/deinperfectday.de\/datenschutzerklaerung\/\" target=\"_blank\" rel=\"noopener noreferrer\">Datenschutzerkl\u00e4rung<span class=\"pfd-sr-only\"> (\u00f6ffnet in neuem Tab)<\/span><\/a> gelesen und stimme zu, dass meine Angaben (Name, E-Mail, Betreff, Nachricht) zur Bearbeitung meiner Anfrage gespeichert und verarbeitet werden d\u00fcrfen. <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span>\n                        <\/span>\n                    <\/label>\n                <\/div>\n\n                <div class=\"pfd-support__actions\">\n                    <button type=\"submit\" class=\"pfd-support__submit\">\n                        <span class=\"pfd-support__submit-label\">Anfrage senden<\/span>\n                        <svg class=\"pfd-support__submit-spinner\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" aria-hidden=\"true\" focusable=\"false\">\n                            <path d=\"M12 3a9 9 0 1 0 9 9\"\/>\n                        <\/svg>\n                        <span class=\"pfd-sr-only pfd-support__submit-loading-text\">Anfrage wird gesendet \u2026<\/span>\n                    <\/button>\n                    <p class=\"pfd-support__legal\">Deine Daten werden ausschlie\u00dflich zur Bearbeitung deiner Anfrage genutzt \u2014 Details siehe <a href=\"https:\/\/deinperfectday.de\/datenschutzerklaerung\/\" target=\"_blank\" rel=\"noopener noreferrer\">Datenschutzerkl\u00e4rung<span class=\"pfd-sr-only\"> (\u00f6ffnet in neuem Tab)<\/span><\/a>.<\/p>\n                <\/div>\n\n                <div class=\"pfd-support__status\" id=\"pfd-support-1-status\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/div>\n            <\/form>\n        <\/div>\n    <\/section>\n\n    <style>\n    \/* Scoped CSS \u2014 bewusst inline + auf `.pfd-support` gescoped, damit der\n       Shortcode auf jedem Theme funktioniert ohne extra Enqueue.\n\n       Theme-Resets sind hier AGGRESSIV, weil der Divi-Builder ALLE\n       Inputs, Labels, <p>-Tags und Divs mit eigenen Margins\/Paddings\n       belegt (.et_pb_module p { padding-bottom: 1em } etc.). Ohne den\n       harten Reset wirkt das Formular \u201everteilt\" mit riesigen\n       Vertikal-L\u00fccken zwischen Label und Input. Siehe Issue 1.8.1.\n       BuddyBoss + Astra haben dieselben Symptome, weniger heftig. *\/\n    .pfd-support,\n    .pfd-support * {\n        box-sizing: border-box !important;\n    }\n    .pfd-support h1, .pfd-support h2, .pfd-support h3,\n    .pfd-support h4, .pfd-support h5, .pfd-support h6,\n    .pfd-support p,  .pfd-support label,\n    .pfd-support div, .pfd-support span,\n    .pfd-support form, .pfd-support fieldset,\n    .pfd-support input, .pfd-support select, .pfd-support textarea,\n    .pfd-support button {\n        margin: 0 !important;\n        padding: 0;\n        line-height: 1.5;\n        font-family: inherit !important;\n        font-weight: inherit;\n        font-style: inherit;\n        text-transform: none;\n        letter-spacing: normal;\n        text-shadow: none;\n        background: transparent;\n        box-shadow: none;\n        border: 0 none;\n        color: inherit;\n    }\n    \/* Divi und einige Page-Builder setzen ::before\/::after Inhalte f\u00fcr\n       Form-Elemente \u2014 die killen wir, damit unser Layout nicht durch\n       Pseudo-Boxen verschoben wird. *\/\n    .pfd-support input::before, .pfd-support input::after,\n    .pfd-support select::before, .pfd-support select::after,\n    .pfd-support textarea::before, .pfd-support textarea::after,\n    .pfd-support label::before, .pfd-support label::after {\n        content: none !important;\n    }\n    \/* Divi-Specific: Divi zwingt `form { margin: 0 0 1.8em }` und packt\n       graue Backgrounds auf alle `input\/textarea\/select`. Au\u00dferdem wird\n       der Submit-Button automatisch mit `.et_pb_button`-Pseudo-Pfeilen\n       belegt \u2014 die killen wir explizit. *\/\n    body.et_pb_pagebuilder_layout .pfd-support form,\n    body[class*=\"et_pb_\"] .pfd-support form {\n        margin: 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support input,\n    .pfd-support textarea,\n    .pfd-support select {\n        background-color: #FFFFFF !important;\n        -webkit-text-fill-color: var(--pfd-ink-900);\n    }\n    .pfd-support button.pfd-support__submit::before,\n    .pfd-support button.pfd-support__submit::after {\n        content: none !important;\n        display: none !important;\n    }\n    \/* CRITICAL \u2014 hidden Inputs m\u00fcssen WIRKLICH unsichtbar sein. Divi\n       belegt `<input>` mit `min-height: 60px` und `margin-bottom: 16px`\n       UNABH\u00c4NGIG vom `type`-Attribut, sodass `<input type=\"hidden\">`\n       trotzdem visuell Platz beansprucht (~80px je St\u00fcck). Wir haben\n       vier davon (action, _nonce, _t, source) \u2192 das war die riesige\n       L\u00fccke zwischen Header und Name\/E-Mail-Row. *\/\n    .pfd-support input[type=\"hidden\"] {\n        display: none !important;\n        position: absolute !important;\n        width: 0 !important;\n        height: 0 !important;\n        min-height: 0 !important;\n        max-height: 0 !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        border: 0 none !important;\n        visibility: hidden !important;\n        opacity: 0 !important;\n        line-height: 0 !important;\n    }\n    .pfd-support {\n        \/* Coral-Palette \u2014 die WCAG-2.1 AA-Konformit\u00e4t ist hier ein\n           Sonderfall: Coral-500 (#FF6B47) auf Wei\u00df hat nur 2.92:1\n           Kontrast \u2192 Text auf diesem Hintergrund w\u00e4re fail.\n           Submit-Button-BG verwendet daher Coral-700 (#B73E1E), das\n           erreicht mit wei\u00dfem Text 5.55:1 \u2192 AA f\u00fcr normalen Text.\n           Coral-500 bleibt f\u00fcr rein dekorative Akzente (Icon-Pille,\n           Pflichtfeld-Stern als zus\u00e4tzliche visuelle Markierung \u2014\n           nicht alleinige Information). *\/\n        --pfd-coral-50: #FFF1ED;\n        --pfd-coral-100: #FFE3DA;\n        --pfd-coral-500: #FF6B47;  \/* Dekoration only *\/\n        --pfd-coral-600: #E5532E;  \/* Akzent-Border, Pflichtfeld-Stern *\/\n        --pfd-coral-700: #B73E1E;  \/* Button-BG: 5.55:1 mit #FFF *\/\n        --pfd-coral-800: #8E2F17;  \/* Hover-State: 7.6:1 mit #FFF *\/\n        --pfd-ink-900: #1A1F2C;\n        --pfd-ink-700: #3F4654;    \/* Labels: 9.8:1 \u2713 *\/\n        --pfd-ink-600: #525866;    \/* Sek-Text: 6.0:1 \u2713 *\/\n        --pfd-ink-500: #6B7280;    \/* Placeholder\/Hint: 4.85:1 \u2713 *\/\n        --pfd-ink-400: #7C8499;    \/* Input-Border: 3.4:1 \u2713 (Non-text 3:1) *\/\n        --pfd-ink-300: #C7CCD6;    \/* Nur f\u00fcr Inline-Trennlinien *\/\n        --pfd-ink-100: #EEF0F5;\n        --pfd-paper:   #FFFFFF;\n        --pfd-bg:      #FAFAFC;\n        --pfd-error:   #C53030;    \/* 5.9:1 mit #FFF \u2713 *\/\n        --pfd-error-bg: #FBEAEA;\n        --pfd-success: #1B5E3A;    \/* 7.1:1 mit #FFF \u2713 *\/\n        --pfd-success-bg: #E7F7EE;\n        --pfd-radius:  14px;\n        --pfd-radius-sm: 10px;\n        --pfd-shadow:  0 1px 2px rgba(20,24,33,0.04), 0 8px 24px rgba(20,24,33,0.06);\n        --pfd-focus:   0 0 0 3px rgba(255,107,71,0.40);\n\n        max-width: 680px !important;\n        margin: 1.5em auto !important;\n        padding: 0 !important;\n        font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif !important;\n        font-size: 15px !important;\n        line-height: 1.5 !important;\n        color: var(--pfd-ink-900);\n        display: block;\n    }\n    \/* Visually hidden \u2014 Standard SR-Only-Pattern. Inhalt bleibt f\u00fcr\n       Screenreader lesbar, ist aber visuell unsichtbar.\n       WCAG 1.3.1 \/ 4.1.2 \u2014 programmatic name without visual clutter. *\/\n    .pfd-support .pfd-sr-only {\n        position: absolute !important;\n        width: 1px !important;\n        height: 1px !important;\n        padding: 0 !important;\n        margin: -1px !important;\n        overflow: hidden !important;\n        clip: rect(0,0,0,0) !important;\n        white-space: nowrap !important;\n        border: 0 !important;\n    }\n    .pfd-support__card {\n        background: #FFFFFF !important;\n        border: 1px solid #EEF0F5 !important;\n        border-radius: var(--pfd-radius);\n        box-shadow: var(--pfd-shadow);\n        padding: 28px !important;\n        display: block;\n        color: #1A1F2C !important;\n    }\n    .pfd-support__card * {\n        color: inherit;\n    }\n    .pfd-support__header {\n        display: flex !important;\n        align-items: flex-start !important;\n        gap: 14px;\n        margin: 0 0 22px 0 !important;\n        padding: 0 0 18px 0 !important;\n        border-bottom: 1px solid var(--pfd-ink-100) !important;\n    }\n    .pfd-support__icon {\n        flex: 0 0 40px;\n        width: 40px;\n        height: 40px;\n        border-radius: 12px;\n        background: var(--pfd-coral-50) !important;\n        color: var(--pfd-coral-600);\n        display: flex !important;\n        align-items: center;\n        justify-content: center;\n    }\n    .pfd-support__icon svg {\n        display: block;\n    }\n    .pfd-support__title {\n        margin: 0 0 4px 0 !important;\n        padding: 0 !important;\n        font-size: 18px !important;\n        font-weight: 700 !important;\n        line-height: 1.3 !important;\n        color: var(--pfd-ink-900) !important;\n        letter-spacing: -0.01em;\n    }\n    .pfd-support__lede {\n        margin: 0 !important;\n        padding: 0 !important;\n        font-size: 13px !important;\n        line-height: 1.45 !important;\n        color: var(--pfd-ink-500) !important;\n        font-weight: 400 !important;\n    }\n    .pfd-support__form {\n        display: block !important;\n        margin: 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support__grid {\n        display: grid !important;\n        grid-template-columns: 1fr 1fr;\n        gap: 14px;\n        margin: 0 0 14px 0 !important;\n    }\n    .pfd-support__field {\n        display: block !important;\n        margin: 0 0 14px 0 !important;\n        padding: 0 !important;\n        position: relative;\n    }\n    .pfd-support__grid .pfd-support__field {\n        margin-bottom: 0 !important;\n    }\n    .pfd-support__form > .pfd-support__field:last-of-type {\n        margin-bottom: 0 !important;\n    }\n    .pfd-support__form label {\n        display: block !important;\n        font-size: 12px !important;\n        font-weight: 600 !important;\n        line-height: 1.4 !important;\n        text-transform: uppercase !important;\n        letter-spacing: 0.04em !important;\n        color: var(--pfd-ink-700) !important;\n        margin: 0 0 6px 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support__req {\n        color: var(--pfd-coral-600) !important;\n        margin-left: 2px !important;\n        text-transform: none !important;\n    }\n    .pfd-support__form input[type=\"text\"],\n    .pfd-support__form input[type=\"email\"],\n    .pfd-support__form select,\n    .pfd-support__form textarea {\n        display: block !important;\n        width: 100% !important;\n        max-width: 100% !important;\n        padding: 11px 14px !important;\n        margin: 0 !important;\n        border: 1px solid var(--pfd-ink-400) !important;\n        border-radius: var(--pfd-radius-sm) !important;\n        font-size: 15px !important;\n        font-family: inherit !important;\n        font-weight: 400 !important;\n        line-height: 1.4 !important;\n        color: var(--pfd-ink-900) !important;\n        background: var(--pfd-paper) !important;\n        box-sizing: border-box !important;\n        transition: border-color 0.15s, box-shadow 0.15s;\n        appearance: none !important;\n        -webkit-appearance: none !important;\n        -moz-appearance: none !important;\n        height: auto !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target \u2265 24px, hier komfortable 44px *\/\n        text-transform: none !important;\n        letter-spacing: normal !important;\n    }\n    \/* aria-invalid setzen JS \/ Browser bei Validation-Fehlern. WCAG\n       3.3.1: Fehler programmatisch identifizierbar. *\/\n    .pfd-support__form input[aria-invalid=\"true\"],\n    .pfd-support__form select[aria-invalid=\"true\"],\n    .pfd-support__form textarea[aria-invalid=\"true\"] {\n        border-color: var(--pfd-error) !important;\n        box-shadow: 0 0 0 1px var(--pfd-error) inset;\n    }\n    .pfd-support__form input::placeholder,\n    .pfd-support__form textarea::placeholder {\n        color: var(--pfd-ink-500);\n        opacity: 1;\n    }\n    .pfd-support__form input[type=\"text\"]:hover,\n    .pfd-support__form input[type=\"email\"]:hover,\n    .pfd-support__form select:hover,\n    .pfd-support__form textarea:hover {\n        border-color: var(--pfd-ink-500);\n    }\n    .pfd-support__form input[type=\"text\"]:focus,\n    .pfd-support__form input[type=\"email\"]:focus,\n    .pfd-support__form select:focus,\n    .pfd-support__form textarea:focus {\n        outline: 2px solid transparent; \/* sichtbar in Windows High-Contrast-Mode *\/\n        outline-offset: 2px;\n        border-color: var(--pfd-coral-700);\n        box-shadow: var(--pfd-focus);\n    }\n    \/* WCAG 2.4.7 \u2014 Focus Visible. Wenn High-Contrast-Mode aktiv ist\n       (Windows Forced Colors), greift unser custom-Focus nicht\n       zuverl\u00e4ssig. Wir nutzen `outline` damit der Browser den Ring\n       in CanvasText\/Highlight zeichnet. *\/\n    @media (forced-colors: active) {\n        .pfd-support__form input:focus,\n        .pfd-support__form select:focus,\n        .pfd-support__form textarea:focus,\n        .pfd-support__submit:focus,\n        .pfd-support__consent input[type=\"checkbox\"]:focus + .pfd-support__consent-box {\n            outline: 2px solid CanvasText !important;\n            outline-offset: 2px !important;\n        }\n    }\n    .pfd-support__form textarea {\n        resize: vertical !important;\n        min-height: 132px !important;\n        height: auto !important;\n    }\n    .pfd-support__select {\n        position: relative !important;\n        display: block !important;\n    }\n    .pfd-support__select select {\n        padding-right: 40px !important;\n        cursor: pointer !important;\n    }\n    .pfd-support__select-arrow {\n        position: absolute !important;\n        right: 14px;\n        top: 50%;\n        transform: translateY(-50%);\n        color: var(--pfd-ink-500);\n        pointer-events: none;\n        display: block;\n    }\n    .pfd-support__counter {\n        display: block !important;\n        text-align: right !important;\n        font-size: 11px !important;\n        line-height: 1.3 !important;\n        color: var(--pfd-ink-500) !important;\n        margin: 4px 0 0 0 !important;\n        padding: 0 !important;\n        font-variant-numeric: tabular-nums;\n    }\n    .pfd-support__counter-now {\n        font-weight: 600;\n    }\n    .pfd-support__honeypot,\n    .pfd-support__honeypot * {\n        position: absolute !important;\n        left: -9999px !important;\n        top: auto !important;\n        width: 1px !important;\n        height: 1px !important;\n        overflow: hidden !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        opacity: 0 !important;\n        pointer-events: none !important;\n    }\n    .pfd-support__actions {\n        display: flex !important;\n        flex-wrap: wrap !important;\n        align-items: center !important;\n        gap: 16px;\n        margin: 22px 0 0 0 !important;\n        padding: 18px 0 0 0 !important;\n        border-top: 1px solid var(--pfd-ink-100) !important;\n    }\n    .pfd-support__submit {\n        position: relative !important;\n        \/* WCAG 1.4.3 \u2014 wei\u00dfer Text auf Coral-700 = 5.55:1 \u2713\n           Coral-500 w\u00e4re nur 2.92:1 \u2192 fail f\u00fcr Button-Text. *\/\n        background: var(--pfd-coral-700) !important;\n        color: #fff !important;\n        border: 1px solid var(--pfd-coral-700) !important;\n        padding: 12px 22px !important;\n        margin: 0 !important;\n        border-radius: var(--pfd-radius-sm) !important;\n        font-size: 15px !important;\n        font-weight: 600 !important;\n        font-family: inherit !important;\n        line-height: 1.2 !important;\n        cursor: pointer !important;\n        transition: background 0.15s, transform 0.05s, box-shadow 0.15s, border-color 0.15s;\n        display: inline-flex !important;\n        align-items: center !important;\n        justify-content: center !important;\n        gap: 8px;\n        box-shadow: 0 1px 2px rgba(183,62,30,0.22) !important;\n        text-transform: none !important;\n        text-decoration: none !important;\n        letter-spacing: normal !important;\n        height: auto !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target *\/\n        min-width: 44px !important;\n    }\n    .pfd-support__submit:hover:not(:disabled) {\n        background: var(--pfd-coral-800) !important;\n        border-color: var(--pfd-coral-800) !important;\n        box-shadow: 0 4px 12px rgba(142,47,23,0.32);\n    }\n    .pfd-support__submit:active:not(:disabled) {\n        transform: translateY(1px);\n        box-shadow: 0 1px 2px rgba(183,62,30,0.22);\n    }\n    .pfd-support__submit:focus-visible {\n        outline: 2px solid var(--pfd-coral-700) !important;\n        outline-offset: 2px !important;\n        box-shadow: var(--pfd-focus) !important;\n    }\n    .pfd-support__submit:disabled {\n        opacity: 0.7;\n        cursor: wait;\n    }\n    .pfd-support__submit-spinner {\n        display: none;\n        animation: pfd-spin 0.8s linear infinite;\n    }\n    .pfd-support--loading .pfd-support__submit-label {\n        opacity: 0.7;\n    }\n    .pfd-support--loading .pfd-support__submit-spinner {\n        display: inline-block;\n    }\n    @keyframes pfd-spin {\n        from { transform: rotate(0deg); }\n        to   { transform: rotate(360deg); }\n    }\n    .pfd-support__legal {\n        flex: 1 1 240px;\n        margin: 0 !important;\n        padding: 0 !important;\n        font-size: 12px !important;\n        color: var(--pfd-ink-500) !important;\n        line-height: 1.45 !important;\n        font-weight: 400 !important;\n    }\n    .pfd-support__legal a,\n    .pfd-support__consent-text a {\n        \/* Coral-700 f\u00fcr Link-Farbe: 5.55:1 auf wei\u00dfem Card-BG \u2713 AA. *\/\n        color: var(--pfd-coral-700) !important;\n        text-decoration: underline;\n        text-underline-offset: 2px;\n        border-radius: 3px;\n    }\n    .pfd-support__legal a:hover,\n    .pfd-support__consent-text a:hover {\n        color: var(--pfd-coral-800) !important;\n    }\n    .pfd-support__legal a:focus-visible,\n    .pfd-support__consent-text a:focus-visible {\n        outline: 2px solid var(--pfd-coral-700) !important;\n        outline-offset: 2px !important;\n        text-decoration: none;\n    }\n    .pfd-support__field--consent {\n        margin: 18px 0 0 0 !important;\n        padding: 14px 16px !important;\n        background: #FAFAFC !important;\n        border: 1px solid var(--pfd-ink-100) !important;\n        border-radius: var(--pfd-radius-sm);\n    }\n    \/* Hohe Spezifit\u00e4t, weil `.pfd-support__form label` (0,0,1,1) sonst\n       gewinnt und das Consent-Label zu `display: block` zwingt \u2192 keine\n       Flex-Layout, Box-Span f\u00e4llt einfach in den Textfluss. Mit\n       `.pfd-support__form label.pfd-support__consent` matchen wir\n       beide Selektoren und gewinnen die Cascade. *\/\n    .pfd-support__form label.pfd-support__consent,\n    .pfd-support label.pfd-support__consent {\n        display: flex !important;\n        align-items: flex-start !important;\n        gap: 12px !important;\n        cursor: pointer !important;\n        font-size: 13px !important;\n        line-height: 1.5 !important;\n        text-transform: none !important;\n        letter-spacing: normal !important;\n        font-weight: 400 !important;\n        color: var(--pfd-ink-700) !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target *\/\n        position: relative !important;\n    }\n    .pfd-support__consent input[type=\"checkbox\"] {\n        \/* WCAG 2.2 2.5.8 \u2014 Checkbox-Hit-Area auf 24\u00d724+ ziehen (volle\n           H\u00f6he des Label-Wrappers), opacity 0 f\u00fcr visuelle\n           Ausblendung. Custom-Box rendert daneben \u2014 Visual ist\n           rein dekorativ. *\/\n        position: absolute !important;\n        opacity: 0 !important;\n        top: 0 !important;\n        left: 0 !important;\n        width: 24px !important;\n        height: 24px !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        z-index: 1;\n        cursor: pointer;\n    }\n    .pfd-support__consent-box {\n        \/* `!important` \u00fcberall, weil unser globaler `.pfd-support span`-\n           Reset spezifischer ist (`.pfd-support span` = 0,0,1,1 vs.\n           `.pfd-support__consent-box` = 0,0,1,0) \u2014 sonst gewinnen die\n           Reset-Regeln `border: 0 none` und `background: transparent`,\n           und die Checkbox wird unsichtbar (siehe Issue v1.9.0). *\/\n        flex: 0 0 22px !important;\n        width: 22px !important;\n        height: 22px !important;\n        border: 2px solid var(--pfd-ink-400) !important;\n        border-radius: 5px !important;\n        background: #FFFFFF !important;\n        display: inline-flex !important;\n        align-items: center !important;\n        justify-content: center !important;\n        margin: 2px 0 0 0 !important;\n        color: #FFFFFF !important;\n        transition: background 0.15s, border-color 0.15s;\n        box-sizing: border-box !important;\n    }\n    .pfd-support__consent-box svg {\n        opacity: 0;\n        transform: scale(0.8);\n        transition: opacity 0.12s, transform 0.12s;\n        display: block;\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:checked + .pfd-support__consent-box {\n        \/* Coral-700 als Background \u2014 bei dunklerem Akzent ist der\n           wei\u00dfe Haken-Kontrast unbedenklich (10.6:1 f\u00fcr AAA-Niveau). *\/\n        background: var(--pfd-coral-700) !important;\n        border-color: var(--pfd-coral-700) !important;\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:checked + .pfd-support__consent-box svg {\n        opacity: 1;\n        transform: scale(1);\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:focus-visible + .pfd-support__consent-box {\n        outline: 2px solid var(--pfd-coral-700);\n        outline-offset: 3px;\n        box-shadow: var(--pfd-focus);\n    }\n    .pfd-support__consent-text {\n        flex: 1 1 auto;\n    }\n    .pfd-support__field--consent.pfd-support__field--invalid {\n        background: var(--pfd-error-bg) !important;\n        border-color: var(--pfd-error) !important;\n    }\n    .pfd-support__field--consent.pfd-support__field--invalid .pfd-support__consent-box {\n        border-color: var(--pfd-error);\n    }\n    .pfd-support__status {\n        margin: 18px 0 0 0 !important;\n        padding: 12px 14px !important;\n        border-radius: var(--pfd-radius-sm);\n        font-size: 14px !important;\n        line-height: 1.45 !important;\n        display: none;\n        white-space: pre-line;\n    }\n    .pfd-support__status--success {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        background: var(--pfd-success-bg);\n        border: 1px solid #B6E2C5;\n        color: var(--pfd-success); \/* 7.1:1 \u2713 AAA *\/\n    }\n    .pfd-support__status--error {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        background: var(--pfd-error-bg);\n        border: 1px solid #F0BABA;\n        color: var(--pfd-error); \/* 5.9:1 \u2713 AA *\/\n    }\n    .pfd-support__status::before {\n        content: '';\n        flex: 0 0 18px;\n        width: 18px;\n        height: 18px;\n        margin-top: 1px;\n        background-repeat: no-repeat;\n        background-size: contain;\n    }\n    .pfd-support__status--success::before {\n        background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%231B5E3A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'\/><\/svg>\");\n    }\n    .pfd-support__status--error::before {\n        background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%23C53030' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'\/><line x1='12' y1='8' x2='12' y2='12'\/><line x1='12' y1='16' x2='12.01' y2='16'\/><\/svg>\");\n    }\n    \/* WCAG 2.3.3 \u2014 Animation aus, wenn User reduced-motion bevorzugt.\n       Auch f\u00fcr Loading-Spinner \u2014 der dreht sonst endlos und kann bei\n       Vestibular-Sensitivit\u00e4t Symptome ausl\u00f6sen. *\/\n    @media (prefers-reduced-motion: reduce) {\n        .pfd-support *,\n        .pfd-support *::before,\n        .pfd-support *::after {\n            animation-duration: 0.001ms !important;\n            animation-iteration-count: 1 !important;\n            transition-duration: 0.001ms !important;\n        }\n        .pfd-support__submit-spinner {\n            animation: none !important;\n        }\n    }\n\n    \/* Responsive: ein-Spalter unter 520 px *\/\n    @media (max-width: 520px) {\n        .pfd-support__card { padding: 20px !important; }\n        .pfd-support__grid { grid-template-columns: 1fr; }\n        .pfd-support__actions { flex-direction: column; align-items: stretch; }\n        .pfd-support__submit { justify-content: center; }\n        .pfd-support__legal { order: 2; text-align: center; }\n    }\n\n    \/* HINWEIS: Dark-Mode wurde bewusst entfernt. Die Card bleibt\n       IMMER hell, auch wenn das Theme dunkel ist \u2014 der User soll auf\n       schwarzem Theme-Hintergrund eine klar abgesetzte wei\u00dfe Card\n       sehen, statt eine im Dark-Look untergehende. *\/\n    <\/style>\n\n    <script>\n    (function () {\n        var container = document.getElementById(\"pfd-support-1\");\n        if (!container) return;\n        var form    = container.querySelector('.pfd-support__form');\n        var submit  = container.querySelector('.pfd-support__submit');\n        var status  = container.querySelector('.pfd-support__status');\n        var srcInput = container.querySelector('input[name=\"source\"]');\n        if (srcInput) srcInput.value = window.location.href;\n\n        \/\/ Live-Counter f\u00fcr die Nachricht \u2014 gibt visuelles Feedback bei\n        \/\/ ~4000 Zeichen-Limit, und erinnert daran, dass das ein Limit ist.\n        var msg = form.querySelector('textarea[name=\"message\"]');\n        var counter = container.querySelector('.pfd-support__counter-now');\n        var counterMax = msg ? (parseInt(msg.getAttribute('maxlength'), 10) || 4000) : 4000;\n        if (msg && counter) {\n            var update = function () {\n                counter.textContent = String(msg.value.length);\n                counter.parentElement.style.color =\n                    msg.value.length > counterMax * 0.92 ? 'var(--pfd-coral-600)' : '';\n            };\n            msg.addEventListener('input', update);\n            update();\n        }\n\n        function setStatus(type, message) {\n            status.className = 'pfd-support__status pfd-support__status--' + type;\n            status.textContent = message;\n        }\n\n        \/\/ Mappt Backend-Field-Codes auf deutsche Labels UND ordnet\n        \/\/ jedem Code das zugeh\u00f6rige Form-Feld zu \u2014 f\u00fcr `aria-invalid`\n        \/\/ und Focus-Management. WCAG 3.3.1 + 3.3.3.\n        var FIELD_MAP = {\n            'name_required':     { label: 'Name fehlt oder ist zu kurz (min. 2 Zeichen)',  selector: 'input[name=\"name\"]' },\n            'email_invalid':     { label: 'E-Mail-Adresse fehlt oder ist ung\u00fcltig',         selector: 'input[name=\"email\"]' },\n            'subject_required':  { label: 'Betreff fehlt oder ist zu kurz (min. 3 Zeichen)', selector: 'input[name=\"subject\"]' },\n            'message_too_short': { label: 'Nachricht ist zu kurz (min. 10 Zeichen)',         selector: 'textarea[name=\"message\"]' },\n            'consent_required':  { label: 'Bitte stimme der Datenverarbeitung zu',           selector: 'input[name=\"consent\"]' }\n        };\n\n        var consentField = container.querySelector('.pfd-support__field--consent');\n        var consentBox   = container.querySelector('input[name=\"consent\"]');\n\n        \/\/ Reset von `aria-invalid` + Consent-Invalid-Styling, sobald\n        \/\/ der User das Feld korrigiert \u2014 vermeidet stehenbleibende\n        \/\/ Fehlerstatus, die f\u00fcr Screenreader irref\u00fchrend w\u00e4ren.\n        Array.prototype.forEach.call(\n            form.querySelectorAll('input, textarea, select'),\n            function (el) {\n                el.addEventListener('input', function () {\n                    if (el.getAttribute('aria-invalid') === 'true' &&\n                        el.value && el.checkValidity()) {\n                        el.setAttribute('aria-invalid', 'false');\n                    }\n                });\n            }\n        );\n\n        if (consentBox && consentField) {\n            consentBox.addEventListener('change', function () {\n                if (consentBox.checked) {\n                    consentField.classList.remove('pfd-support__field--invalid');\n                    consentBox.setAttribute('aria-invalid', 'false');\n                }\n            });\n        }\n\n        function clearAriaInvalid() {\n            Array.prototype.forEach.call(\n                form.querySelectorAll('[aria-invalid=\"true\"]'),\n                function (el) { el.setAttribute('aria-invalid', 'false'); }\n            );\n            if (consentField) consentField.classList.remove('pfd-support__field--invalid');\n        }\n\n        function setStatusFromError(fields, fallbackText) {\n            \/\/ Toggle aria-live auf assertive f\u00fcr Fehler \u2014 damit\n            \/\/ Screenreader die Fehlermeldung sofort lesen, nicht erst\n            \/\/ beim n\u00e4chsten Sprech-Slot. WCAG 4.1.3.\n            status.setAttribute('aria-live', 'assertive');\n            status.setAttribute('role', 'alert');\n\n            if (fields && fields.length > 0) {\n                \/\/ aria-invalid + Focus auf erstes Fehler-Feld\n                var firstInvalidEl = null;\n                fields.forEach(function (f) {\n                    var meta = FIELD_MAP[f];\n                    if (!meta) return;\n                    var el = form.querySelector(meta.selector);\n                    if (!el) return;\n                    el.setAttribute('aria-invalid', 'true');\n                    if (f === 'consent_required' && consentField) {\n                        consentField.classList.add('pfd-support__field--invalid');\n                    }\n                    if (!firstInvalidEl) firstInvalidEl = el;\n                });\n\n                var lines = fields.map(function (f) {\n                    return '\u2022 ' + ((FIELD_MAP[f] && FIELD_MAP[f].label) || f);\n                });\n                setStatus('error', 'Bitte korrigiere folgende Eingaben:\\n' + lines.join('\\n'));\n\n                if (firstInvalidEl && typeof firstInvalidEl.focus === 'function') {\n                    \/\/ setTimeout, damit aria-live erst \u201eschaltet\"\n                    setTimeout(function () { firstInvalidEl.focus(); }, 60);\n                }\n                return;\n            }\n\n            setStatus('error', fallbackText);\n        }\n\n        function setStatus(type, message) {\n            status.className = 'pfd-support__status pfd-support__status--' + type;\n            status.textContent = message;\n            if (type === 'success') {\n                status.setAttribute('aria-live', 'polite');\n                status.setAttribute('role', 'status');\n            }\n        }\n\n        form.addEventListener('submit', function (ev) {\n            ev.preventDefault();\n\n            clearAriaInvalid();\n\n            \/\/ Client-seitige Vorab-Validierung der Datenschutz-Checkbox.\n            if (consentBox && !consentBox.checked) {\n                setStatusFromError(['consent_required'], '');\n                return;\n            }\n\n            submit.disabled = true;\n            container.classList.add('pfd-support--loading');\n            form.setAttribute('aria-busy', 'true');\n            status.className = 'pfd-support__status';\n            status.textContent = '';\n\n            var data = new FormData(form);\n\n            fetch(\"https:\\\/\\\/deinperfectday.de\\\/wp-admin\\\/admin-ajax.php\", {\n                method: 'POST',\n                body: data,\n                credentials: 'same-origin'\n            })\n            .then(function (r) { return r.json().catch(function () { return { ok: false }; }); })\n            .then(function (j) {\n                if (j && j.success && j.data && j.data.ok) {\n                    var ticketId = j.data.ticketId || '\u2014';\n                    var msg = 'Danke! Deine Anfrage ist angekommen \u2014 Ticket-ID ' +\n                              ticketId + '. Wir melden uns per E-Mail zur\u00fcck.';\n                    \/\/ Wenn die Plattform Mail-Probleme hatte (z.B. SMTP nicht\n                    \/\/ konfiguriert), informieren wir den User transparent \u2014\n                    \/\/ das Ticket ist trotzdem in der DB und wird intern\n                    \/\/ bearbeitet.\n                    if (j.data.warning === 'mail_autoreply_failed') {\n                        msg += ' (Hinweis: die automatische Best\u00e4tigungs-Mail konnte gerade nicht zugestellt werden \u2014 deine Anfrage wurde aber gespeichert.)';\n                    } else if (j.data.warning === 'mail_team_failed') {\n                        msg += ' (Hinweis: unsere Mail-Zustellung hat aktuell Probleme \u2014 wir bearbeiten deine Anfrage manuell aus dem System.)';\n                    }\n                    setStatus('success', msg);\n                    form.reset();\n                    if (counter) counter.textContent = '0';\n                    clearAriaInvalid();\n                    return;\n                }\n\n                var err    = (j && j.data && j.data.error)  ? j.data.error  : 'unknown';\n                var fields = (j && j.data && j.data.fields) ? j.data.fields : [];\n\n                if (err === 'validation') {\n                    setStatusFromError(fields, 'Bitte f\u00fclle alle Pflichtfelder korrekt aus.');\n                    return;\n                }\n\n                var text = ({\n                    'rate_limited':         'Zu viele Anfragen \u2014 bitte sp\u00e4ter erneut versuchen.',\n                    'mail_failed':          'Mail-Versand ist gerade nicht m\u00f6glich, bitte sp\u00e4ter erneut.',\n                    'platform_unreachable': 'Plattform-Server gerade nicht erreichbar.',\n                    'invalid_nonce':        'Sitzung abgelaufen \u2014 Seite neu laden und nochmal probieren.',\n                    'too_fast':             'Bitte ein paar Sekunden warten und nochmal versuchen.'\n                })[err] || 'Es gab ein Problem \u2014 bitte sp\u00e4ter erneut versuchen.';\n                setStatusFromError([], text);\n            })\n            .catch(function () {\n                setStatusFromError([], 'Netzwerk-Problem \u2014 bitte sp\u00e4ter erneut versuchen.');\n            })\n            .finally(function () {\n                submit.disabled = false;\n                container.classList.remove('pfd-support--loading');\n                form.setAttribute('aria-busy', 'false');\n            });\n        });\n    })();\n    <\/script>\n    \n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"    <section class=\"pfd-support\" id=\"pfd-support-2\" aria-labelledby=\"pfd-support-2-title\">\n        <div class=\"pfd-support__card\">\n            <header class=\"pfd-support__header\">\n                <div class=\"pfd-support__icon\" aria-hidden=\"true\">\n                    <svg viewBox=\"0 0 24 24\" width=\"22\" height=\"22\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\">\n                        <path d=\"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z\"\/>\n                    <\/svg>\n                <\/div>\n                <div>\n                    <h2 class=\"pfd-support__title\" id=\"pfd-support-2-title\">Support kontaktieren<\/h2>\n                    <p class=\"pfd-support__lede\">Wir melden uns typisch innerhalb von 1\u20132 Werktagen zur\u00fcck. <span class=\"pfd-support__required-note\">Mit <span aria-hidden=\"true\">*<\/span><span class=\"pfd-sr-only\"> Sternchen <\/span> markierte Felder sind Pflichtfelder.<\/span><\/p>\n                <\/div>\n            <\/header>\n\n            <form class=\"pfd-support__form\" novalidate aria-describedby=\"pfd-support-2-status\">\n                <input type=\"hidden\" name=\"action\" value=\"pfd_support_submit\">\n                <input type=\"hidden\" name=\"_nonce\" value=\"d688a4bbfd\">\n                <input type=\"hidden\" name=\"_t\" value=\"1779170401\">\n                <input type=\"hidden\" name=\"source\" value=\"\">\n\n                <!-- Honeypot: f\u00fcr Menschen unsichtbar, Bots bef\u00fcllen es.\n                     `aria-hidden` + `tabindex=-1` + `autocomplete=off` \u2192\n                     unsichtbar f\u00fcr Screenreader UND Tastatur-Nav. -->\n                <div class=\"pfd-support__honeypot\" aria-hidden=\"true\">\n                    <label>Bitte leer lassen\n                        <input type=\"text\" name=\"_hp\" autocomplete=\"off\" tabindex=\"-1\">\n                    <\/label>\n                <\/div>\n\n                <div class=\"pfd-support__grid\">\n                    <div class=\"pfd-support__field\">\n                        <label for=\"pfd-support-2-name\">Name <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                        <input id=\"pfd-support-2-name\" type=\"text\" name=\"name\" required aria-required=\"true\" maxlength=\"80\" autocomplete=\"name\">\n                    <\/div>\n                    <div class=\"pfd-support__field\">\n                        <label for=\"pfd-support-2-email\">E-Mail <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                        <input id=\"pfd-support-2-email\" type=\"email\" name=\"email\" required aria-required=\"true\" maxlength=\"160\" autocomplete=\"email\" inputmode=\"email\">\n                    <\/div>\n                <\/div>\n\n                                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-2-category\">Anliegen<\/label>\n                    <div class=\"pfd-support__select\">\n                        <select id=\"pfd-support-2-category\" name=\"category\">\n                                                            <option value=\"bug\">\ud83d\udc1b Bug \/ Problem<\/option>\n                                                            <option value=\"feature\">\u2728 Feature-Wunsch<\/option>\n                                                            <option value=\"question\">\u2753 Frage<\/option>\n                                                            <option value=\"other\">\ud83d\udde8 Sonstiges<\/option>\n                                                    <\/select>\n                        <svg class=\"pfd-support__select-arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\" focusable=\"false\">\n                            <polyline points=\"6 9 12 15 18 9\"><\/polyline>\n                        <\/svg>\n                    <\/div>\n                <\/div>\n                \n                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-2-subject\">Betreff <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                    <input id=\"pfd-support-2-subject\" type=\"text\" name=\"subject\" required aria-required=\"true\" maxlength=\"160\">\n                <\/div>\n\n                <div class=\"pfd-support__field\">\n                    <label for=\"pfd-support-2-message\">Nachricht <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span><\/label>\n                    <textarea id=\"pfd-support-2-message\" name=\"message\" rows=\"6\" required aria-required=\"true\" minlength=\"10\" maxlength=\"4000\" aria-describedby=\"pfd-support-2-message-help pfd-support-2-message-counter\" placeholder=\"Beschreib uns kurz, was wir f\u00fcr dich tun k\u00f6nnen \u2026\"><\/textarea>\n                    <span class=\"pfd-sr-only\" id=\"pfd-support-2-message-help\">Mindestens 10, maximal 4000 Zeichen.<\/span>\n                    <span class=\"pfd-support__counter\" id=\"pfd-support-2-message-counter\" aria-hidden=\"true\"><span class=\"pfd-support__counter-now\">0<\/span> \/ 4000<\/span>\n                <\/div>\n\n                <div class=\"pfd-support__field pfd-support__field--consent\">\n                    <label class=\"pfd-support__consent\" for=\"pfd-support-2-consent\">\n                        <input id=\"pfd-support-2-consent\" type=\"checkbox\" name=\"consent\" value=\"1\" required aria-required=\"true\">\n                        <span class=\"pfd-support__consent-box\" aria-hidden=\"true\">\n                            <svg viewBox=\"0 0 16 16\" width=\"12\" height=\"12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" focusable=\"false\">\n                                <polyline points=\"3 8 7 12 13 4\"\/>\n                            <\/svg>\n                        <\/span>\n                        <span class=\"pfd-support__consent-text\">\n                            Ich habe die <a href=\"https:\/\/deinperfectday.de\/datenschutzerklaerung\/\" target=\"_blank\" rel=\"noopener noreferrer\">Datenschutzerkl\u00e4rung<span class=\"pfd-sr-only\"> (\u00f6ffnet in neuem Tab)<\/span><\/a> gelesen und stimme zu, dass meine Angaben (Name, E-Mail, Betreff, Nachricht) zur Bearbeitung meiner Anfrage gespeichert und verarbeitet werden d\u00fcrfen. <span class=\"pfd-support__req\" aria-hidden=\"true\">*<\/span>\n                        <\/span>\n                    <\/label>\n                <\/div>\n\n                <div class=\"pfd-support__actions\">\n                    <button type=\"submit\" class=\"pfd-support__submit\">\n                        <span class=\"pfd-support__submit-label\">Anfrage senden<\/span>\n                        <svg class=\"pfd-support__submit-spinner\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" aria-hidden=\"true\" focusable=\"false\">\n                            <path d=\"M12 3a9 9 0 1 0 9 9\"\/>\n                        <\/svg>\n                        <span class=\"pfd-sr-only pfd-support__submit-loading-text\">Anfrage wird gesendet \u2026<\/span>\n                    <\/button>\n                    <p class=\"pfd-support__legal\">Deine Daten werden ausschlie\u00dflich zur Bearbeitung deiner Anfrage genutzt \u2014 Details siehe <a href=\"https:\/\/deinperfectday.de\/datenschutzerklaerung\/\" target=\"_blank\" rel=\"noopener noreferrer\">Datenschutzerkl\u00e4rung<span class=\"pfd-sr-only\"> (\u00f6ffnet in neuem Tab)<\/span><\/a>.<\/p>\n                <\/div>\n\n                <div class=\"pfd-support__status\" id=\"pfd-support-2-status\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/div>\n            <\/form>\n        <\/div>\n    <\/section>\n\n    <style>\n    \/* Scoped CSS \u2014 bewusst inline + auf `.pfd-support` gescoped, damit der\n       Shortcode auf jedem Theme funktioniert ohne extra Enqueue.\n\n       Theme-Resets sind hier AGGRESSIV, weil der Divi-Builder ALLE\n       Inputs, Labels, <p>-Tags und Divs mit eigenen Margins\/Paddings\n       belegt (.et_pb_module p { padding-bottom: 1em } etc.). Ohne den\n       harten Reset wirkt das Formular \u201everteilt\" mit riesigen\n       Vertikal-L\u00fccken zwischen Label und Input. Siehe Issue 1.8.1.\n       BuddyBoss + Astra haben dieselben Symptome, weniger heftig. *\/\n    .pfd-support,\n    .pfd-support * {\n        box-sizing: border-box !important;\n    }\n    .pfd-support h1, .pfd-support h2, .pfd-support h3,\n    .pfd-support h4, .pfd-support h5, .pfd-support h6,\n    .pfd-support p,  .pfd-support label,\n    .pfd-support div, .pfd-support span,\n    .pfd-support form, .pfd-support fieldset,\n    .pfd-support input, .pfd-support select, .pfd-support textarea,\n    .pfd-support button {\n        margin: 0 !important;\n        padding: 0;\n        line-height: 1.5;\n        font-family: inherit !important;\n        font-weight: inherit;\n        font-style: inherit;\n        text-transform: none;\n        letter-spacing: normal;\n        text-shadow: none;\n        background: transparent;\n        box-shadow: none;\n        border: 0 none;\n        color: inherit;\n    }\n    \/* Divi und einige Page-Builder setzen ::before\/::after Inhalte f\u00fcr\n       Form-Elemente \u2014 die killen wir, damit unser Layout nicht durch\n       Pseudo-Boxen verschoben wird. *\/\n    .pfd-support input::before, .pfd-support input::after,\n    .pfd-support select::before, .pfd-support select::after,\n    .pfd-support textarea::before, .pfd-support textarea::after,\n    .pfd-support label::before, .pfd-support label::after {\n        content: none !important;\n    }\n    \/* Divi-Specific: Divi zwingt `form { margin: 0 0 1.8em }` und packt\n       graue Backgrounds auf alle `input\/textarea\/select`. Au\u00dferdem wird\n       der Submit-Button automatisch mit `.et_pb_button`-Pseudo-Pfeilen\n       belegt \u2014 die killen wir explizit. *\/\n    body.et_pb_pagebuilder_layout .pfd-support form,\n    body[class*=\"et_pb_\"] .pfd-support form {\n        margin: 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support input,\n    .pfd-support textarea,\n    .pfd-support select {\n        background-color: #FFFFFF !important;\n        -webkit-text-fill-color: var(--pfd-ink-900);\n    }\n    .pfd-support button.pfd-support__submit::before,\n    .pfd-support button.pfd-support__submit::after {\n        content: none !important;\n        display: none !important;\n    }\n    \/* CRITICAL \u2014 hidden Inputs m\u00fcssen WIRKLICH unsichtbar sein. Divi\n       belegt `<input>` mit `min-height: 60px` und `margin-bottom: 16px`\n       UNABH\u00c4NGIG vom `type`-Attribut, sodass `<input type=\"hidden\">`\n       trotzdem visuell Platz beansprucht (~80px je St\u00fcck). Wir haben\n       vier davon (action, _nonce, _t, source) \u2192 das war die riesige\n       L\u00fccke zwischen Header und Name\/E-Mail-Row. *\/\n    .pfd-support input[type=\"hidden\"] {\n        display: none !important;\n        position: absolute !important;\n        width: 0 !important;\n        height: 0 !important;\n        min-height: 0 !important;\n        max-height: 0 !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        border: 0 none !important;\n        visibility: hidden !important;\n        opacity: 0 !important;\n        line-height: 0 !important;\n    }\n    .pfd-support {\n        \/* Coral-Palette \u2014 die WCAG-2.1 AA-Konformit\u00e4t ist hier ein\n           Sonderfall: Coral-500 (#FF6B47) auf Wei\u00df hat nur 2.92:1\n           Kontrast \u2192 Text auf diesem Hintergrund w\u00e4re fail.\n           Submit-Button-BG verwendet daher Coral-700 (#B73E1E), das\n           erreicht mit wei\u00dfem Text 5.55:1 \u2192 AA f\u00fcr normalen Text.\n           Coral-500 bleibt f\u00fcr rein dekorative Akzente (Icon-Pille,\n           Pflichtfeld-Stern als zus\u00e4tzliche visuelle Markierung \u2014\n           nicht alleinige Information). *\/\n        --pfd-coral-50: #FFF1ED;\n        --pfd-coral-100: #FFE3DA;\n        --pfd-coral-500: #FF6B47;  \/* Dekoration only *\/\n        --pfd-coral-600: #E5532E;  \/* Akzent-Border, Pflichtfeld-Stern *\/\n        --pfd-coral-700: #B73E1E;  \/* Button-BG: 5.55:1 mit #FFF *\/\n        --pfd-coral-800: #8E2F17;  \/* Hover-State: 7.6:1 mit #FFF *\/\n        --pfd-ink-900: #1A1F2C;\n        --pfd-ink-700: #3F4654;    \/* Labels: 9.8:1 \u2713 *\/\n        --pfd-ink-600: #525866;    \/* Sek-Text: 6.0:1 \u2713 *\/\n        --pfd-ink-500: #6B7280;    \/* Placeholder\/Hint: 4.85:1 \u2713 *\/\n        --pfd-ink-400: #7C8499;    \/* Input-Border: 3.4:1 \u2713 (Non-text 3:1) *\/\n        --pfd-ink-300: #C7CCD6;    \/* Nur f\u00fcr Inline-Trennlinien *\/\n        --pfd-ink-100: #EEF0F5;\n        --pfd-paper:   #FFFFFF;\n        --pfd-bg:      #FAFAFC;\n        --pfd-error:   #C53030;    \/* 5.9:1 mit #FFF \u2713 *\/\n        --pfd-error-bg: #FBEAEA;\n        --pfd-success: #1B5E3A;    \/* 7.1:1 mit #FFF \u2713 *\/\n        --pfd-success-bg: #E7F7EE;\n        --pfd-radius:  14px;\n        --pfd-radius-sm: 10px;\n        --pfd-shadow:  0 1px 2px rgba(20,24,33,0.04), 0 8px 24px rgba(20,24,33,0.06);\n        --pfd-focus:   0 0 0 3px rgba(255,107,71,0.40);\n\n        max-width: 680px !important;\n        margin: 1.5em auto !important;\n        padding: 0 !important;\n        font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif !important;\n        font-size: 15px !important;\n        line-height: 1.5 !important;\n        color: var(--pfd-ink-900);\n        display: block;\n    }\n    \/* Visually hidden \u2014 Standard SR-Only-Pattern. Inhalt bleibt f\u00fcr\n       Screenreader lesbar, ist aber visuell unsichtbar.\n       WCAG 1.3.1 \/ 4.1.2 \u2014 programmatic name without visual clutter. *\/\n    .pfd-support .pfd-sr-only {\n        position: absolute !important;\n        width: 1px !important;\n        height: 1px !important;\n        padding: 0 !important;\n        margin: -1px !important;\n        overflow: hidden !important;\n        clip: rect(0,0,0,0) !important;\n        white-space: nowrap !important;\n        border: 0 !important;\n    }\n    .pfd-support__card {\n        background: #FFFFFF !important;\n        border: 1px solid #EEF0F5 !important;\n        border-radius: var(--pfd-radius);\n        box-shadow: var(--pfd-shadow);\n        padding: 28px !important;\n        display: block;\n        color: #1A1F2C !important;\n    }\n    .pfd-support__card * {\n        color: inherit;\n    }\n    .pfd-support__header {\n        display: flex !important;\n        align-items: flex-start !important;\n        gap: 14px;\n        margin: 0 0 22px 0 !important;\n        padding: 0 0 18px 0 !important;\n        border-bottom: 1px solid var(--pfd-ink-100) !important;\n    }\n    .pfd-support__icon {\n        flex: 0 0 40px;\n        width: 40px;\n        height: 40px;\n        border-radius: 12px;\n        background: var(--pfd-coral-50) !important;\n        color: var(--pfd-coral-600);\n        display: flex !important;\n        align-items: center;\n        justify-content: center;\n    }\n    .pfd-support__icon svg {\n        display: block;\n    }\n    .pfd-support__title {\n        margin: 0 0 4px 0 !important;\n        padding: 0 !important;\n        font-size: 18px !important;\n        font-weight: 700 !important;\n        line-height: 1.3 !important;\n        color: var(--pfd-ink-900) !important;\n        letter-spacing: -0.01em;\n    }\n    .pfd-support__lede {\n        margin: 0 !important;\n        padding: 0 !important;\n        font-size: 13px !important;\n        line-height: 1.45 !important;\n        color: var(--pfd-ink-500) !important;\n        font-weight: 400 !important;\n    }\n    .pfd-support__form {\n        display: block !important;\n        margin: 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support__grid {\n        display: grid !important;\n        grid-template-columns: 1fr 1fr;\n        gap: 14px;\n        margin: 0 0 14px 0 !important;\n    }\n    .pfd-support__field {\n        display: block !important;\n        margin: 0 0 14px 0 !important;\n        padding: 0 !important;\n        position: relative;\n    }\n    .pfd-support__grid .pfd-support__field {\n        margin-bottom: 0 !important;\n    }\n    .pfd-support__form > .pfd-support__field:last-of-type {\n        margin-bottom: 0 !important;\n    }\n    .pfd-support__form label {\n        display: block !important;\n        font-size: 12px !important;\n        font-weight: 600 !important;\n        line-height: 1.4 !important;\n        text-transform: uppercase !important;\n        letter-spacing: 0.04em !important;\n        color: var(--pfd-ink-700) !important;\n        margin: 0 0 6px 0 !important;\n        padding: 0 !important;\n    }\n    .pfd-support__req {\n        color: var(--pfd-coral-600) !important;\n        margin-left: 2px !important;\n        text-transform: none !important;\n    }\n    .pfd-support__form input[type=\"text\"],\n    .pfd-support__form input[type=\"email\"],\n    .pfd-support__form select,\n    .pfd-support__form textarea {\n        display: block !important;\n        width: 100% !important;\n        max-width: 100% !important;\n        padding: 11px 14px !important;\n        margin: 0 !important;\n        border: 1px solid var(--pfd-ink-400) !important;\n        border-radius: var(--pfd-radius-sm) !important;\n        font-size: 15px !important;\n        font-family: inherit !important;\n        font-weight: 400 !important;\n        line-height: 1.4 !important;\n        color: var(--pfd-ink-900) !important;\n        background: var(--pfd-paper) !important;\n        box-sizing: border-box !important;\n        transition: border-color 0.15s, box-shadow 0.15s;\n        appearance: none !important;\n        -webkit-appearance: none !important;\n        -moz-appearance: none !important;\n        height: auto !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target \u2265 24px, hier komfortable 44px *\/\n        text-transform: none !important;\n        letter-spacing: normal !important;\n    }\n    \/* aria-invalid setzen JS \/ Browser bei Validation-Fehlern. WCAG\n       3.3.1: Fehler programmatisch identifizierbar. *\/\n    .pfd-support__form input[aria-invalid=\"true\"],\n    .pfd-support__form select[aria-invalid=\"true\"],\n    .pfd-support__form textarea[aria-invalid=\"true\"] {\n        border-color: var(--pfd-error) !important;\n        box-shadow: 0 0 0 1px var(--pfd-error) inset;\n    }\n    .pfd-support__form input::placeholder,\n    .pfd-support__form textarea::placeholder {\n        color: var(--pfd-ink-500);\n        opacity: 1;\n    }\n    .pfd-support__form input[type=\"text\"]:hover,\n    .pfd-support__form input[type=\"email\"]:hover,\n    .pfd-support__form select:hover,\n    .pfd-support__form textarea:hover {\n        border-color: var(--pfd-ink-500);\n    }\n    .pfd-support__form input[type=\"text\"]:focus,\n    .pfd-support__form input[type=\"email\"]:focus,\n    .pfd-support__form select:focus,\n    .pfd-support__form textarea:focus {\n        outline: 2px solid transparent; \/* sichtbar in Windows High-Contrast-Mode *\/\n        outline-offset: 2px;\n        border-color: var(--pfd-coral-700);\n        box-shadow: var(--pfd-focus);\n    }\n    \/* WCAG 2.4.7 \u2014 Focus Visible. Wenn High-Contrast-Mode aktiv ist\n       (Windows Forced Colors), greift unser custom-Focus nicht\n       zuverl\u00e4ssig. Wir nutzen `outline` damit der Browser den Ring\n       in CanvasText\/Highlight zeichnet. *\/\n    @media (forced-colors: active) {\n        .pfd-support__form input:focus,\n        .pfd-support__form select:focus,\n        .pfd-support__form textarea:focus,\n        .pfd-support__submit:focus,\n        .pfd-support__consent input[type=\"checkbox\"]:focus + .pfd-support__consent-box {\n            outline: 2px solid CanvasText !important;\n            outline-offset: 2px !important;\n        }\n    }\n    .pfd-support__form textarea {\n        resize: vertical !important;\n        min-height: 132px !important;\n        height: auto !important;\n    }\n    .pfd-support__select {\n        position: relative !important;\n        display: block !important;\n    }\n    .pfd-support__select select {\n        padding-right: 40px !important;\n        cursor: pointer !important;\n    }\n    .pfd-support__select-arrow {\n        position: absolute !important;\n        right: 14px;\n        top: 50%;\n        transform: translateY(-50%);\n        color: var(--pfd-ink-500);\n        pointer-events: none;\n        display: block;\n    }\n    .pfd-support__counter {\n        display: block !important;\n        text-align: right !important;\n        font-size: 11px !important;\n        line-height: 1.3 !important;\n        color: var(--pfd-ink-500) !important;\n        margin: 4px 0 0 0 !important;\n        padding: 0 !important;\n        font-variant-numeric: tabular-nums;\n    }\n    .pfd-support__counter-now {\n        font-weight: 600;\n    }\n    .pfd-support__honeypot,\n    .pfd-support__honeypot * {\n        position: absolute !important;\n        left: -9999px !important;\n        top: auto !important;\n        width: 1px !important;\n        height: 1px !important;\n        overflow: hidden !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        opacity: 0 !important;\n        pointer-events: none !important;\n    }\n    .pfd-support__actions {\n        display: flex !important;\n        flex-wrap: wrap !important;\n        align-items: center !important;\n        gap: 16px;\n        margin: 22px 0 0 0 !important;\n        padding: 18px 0 0 0 !important;\n        border-top: 1px solid var(--pfd-ink-100) !important;\n    }\n    .pfd-support__submit {\n        position: relative !important;\n        \/* WCAG 1.4.3 \u2014 wei\u00dfer Text auf Coral-700 = 5.55:1 \u2713\n           Coral-500 w\u00e4re nur 2.92:1 \u2192 fail f\u00fcr Button-Text. *\/\n        background: var(--pfd-coral-700) !important;\n        color: #fff !important;\n        border: 1px solid var(--pfd-coral-700) !important;\n        padding: 12px 22px !important;\n        margin: 0 !important;\n        border-radius: var(--pfd-radius-sm) !important;\n        font-size: 15px !important;\n        font-weight: 600 !important;\n        font-family: inherit !important;\n        line-height: 1.2 !important;\n        cursor: pointer !important;\n        transition: background 0.15s, transform 0.05s, box-shadow 0.15s, border-color 0.15s;\n        display: inline-flex !important;\n        align-items: center !important;\n        justify-content: center !important;\n        gap: 8px;\n        box-shadow: 0 1px 2px rgba(183,62,30,0.22) !important;\n        text-transform: none !important;\n        text-decoration: none !important;\n        letter-spacing: normal !important;\n        height: auto !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target *\/\n        min-width: 44px !important;\n    }\n    .pfd-support__submit:hover:not(:disabled) {\n        background: var(--pfd-coral-800) !important;\n        border-color: var(--pfd-coral-800) !important;\n        box-shadow: 0 4px 12px rgba(142,47,23,0.32);\n    }\n    .pfd-support__submit:active:not(:disabled) {\n        transform: translateY(1px);\n        box-shadow: 0 1px 2px rgba(183,62,30,0.22);\n    }\n    .pfd-support__submit:focus-visible {\n        outline: 2px solid var(--pfd-coral-700) !important;\n        outline-offset: 2px !important;\n        box-shadow: var(--pfd-focus) !important;\n    }\n    .pfd-support__submit:disabled {\n        opacity: 0.7;\n        cursor: wait;\n    }\n    .pfd-support__submit-spinner {\n        display: none;\n        animation: pfd-spin 0.8s linear infinite;\n    }\n    .pfd-support--loading .pfd-support__submit-label {\n        opacity: 0.7;\n    }\n    .pfd-support--loading .pfd-support__submit-spinner {\n        display: inline-block;\n    }\n    @keyframes pfd-spin {\n        from { transform: rotate(0deg); }\n        to   { transform: rotate(360deg); }\n    }\n    .pfd-support__legal {\n        flex: 1 1 240px;\n        margin: 0 !important;\n        padding: 0 !important;\n        font-size: 12px !important;\n        color: var(--pfd-ink-500) !important;\n        line-height: 1.45 !important;\n        font-weight: 400 !important;\n    }\n    .pfd-support__legal a,\n    .pfd-support__consent-text a {\n        \/* Coral-700 f\u00fcr Link-Farbe: 5.55:1 auf wei\u00dfem Card-BG \u2713 AA. *\/\n        color: var(--pfd-coral-700) !important;\n        text-decoration: underline;\n        text-underline-offset: 2px;\n        border-radius: 3px;\n    }\n    .pfd-support__legal a:hover,\n    .pfd-support__consent-text a:hover {\n        color: var(--pfd-coral-800) !important;\n    }\n    .pfd-support__legal a:focus-visible,\n    .pfd-support__consent-text a:focus-visible {\n        outline: 2px solid var(--pfd-coral-700) !important;\n        outline-offset: 2px !important;\n        text-decoration: none;\n    }\n    .pfd-support__field--consent {\n        margin: 18px 0 0 0 !important;\n        padding: 14px 16px !important;\n        background: #FAFAFC !important;\n        border: 1px solid var(--pfd-ink-100) !important;\n        border-radius: var(--pfd-radius-sm);\n    }\n    \/* Hohe Spezifit\u00e4t, weil `.pfd-support__form label` (0,0,1,1) sonst\n       gewinnt und das Consent-Label zu `display: block` zwingt \u2192 keine\n       Flex-Layout, Box-Span f\u00e4llt einfach in den Textfluss. Mit\n       `.pfd-support__form label.pfd-support__consent` matchen wir\n       beide Selektoren und gewinnen die Cascade. *\/\n    .pfd-support__form label.pfd-support__consent,\n    .pfd-support label.pfd-support__consent {\n        display: flex !important;\n        align-items: flex-start !important;\n        gap: 12px !important;\n        cursor: pointer !important;\n        font-size: 13px !important;\n        line-height: 1.5 !important;\n        text-transform: none !important;\n        letter-spacing: normal !important;\n        font-weight: 400 !important;\n        color: var(--pfd-ink-700) !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        min-height: 44px !important; \/* WCAG 2.2 2.5.8 \u2014 Touch-Target *\/\n        position: relative !important;\n    }\n    .pfd-support__consent input[type=\"checkbox\"] {\n        \/* WCAG 2.2 2.5.8 \u2014 Checkbox-Hit-Area auf 24\u00d724+ ziehen (volle\n           H\u00f6he des Label-Wrappers), opacity 0 f\u00fcr visuelle\n           Ausblendung. Custom-Box rendert daneben \u2014 Visual ist\n           rein dekorativ. *\/\n        position: absolute !important;\n        opacity: 0 !important;\n        top: 0 !important;\n        left: 0 !important;\n        width: 24px !important;\n        height: 24px !important;\n        margin: 0 !important;\n        padding: 0 !important;\n        z-index: 1;\n        cursor: pointer;\n    }\n    .pfd-support__consent-box {\n        \/* `!important` \u00fcberall, weil unser globaler `.pfd-support span`-\n           Reset spezifischer ist (`.pfd-support span` = 0,0,1,1 vs.\n           `.pfd-support__consent-box` = 0,0,1,0) \u2014 sonst gewinnen die\n           Reset-Regeln `border: 0 none` und `background: transparent`,\n           und die Checkbox wird unsichtbar (siehe Issue v1.9.0). *\/\n        flex: 0 0 22px !important;\n        width: 22px !important;\n        height: 22px !important;\n        border: 2px solid var(--pfd-ink-400) !important;\n        border-radius: 5px !important;\n        background: #FFFFFF !important;\n        display: inline-flex !important;\n        align-items: center !important;\n        justify-content: center !important;\n        margin: 2px 0 0 0 !important;\n        color: #FFFFFF !important;\n        transition: background 0.15s, border-color 0.15s;\n        box-sizing: border-box !important;\n    }\n    .pfd-support__consent-box svg {\n        opacity: 0;\n        transform: scale(0.8);\n        transition: opacity 0.12s, transform 0.12s;\n        display: block;\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:checked + .pfd-support__consent-box {\n        \/* Coral-700 als Background \u2014 bei dunklerem Akzent ist der\n           wei\u00dfe Haken-Kontrast unbedenklich (10.6:1 f\u00fcr AAA-Niveau). *\/\n        background: var(--pfd-coral-700) !important;\n        border-color: var(--pfd-coral-700) !important;\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:checked + .pfd-support__consent-box svg {\n        opacity: 1;\n        transform: scale(1);\n    }\n    .pfd-support__consent input[type=\"checkbox\"]:focus-visible + .pfd-support__consent-box {\n        outline: 2px solid var(--pfd-coral-700);\n        outline-offset: 3px;\n        box-shadow: var(--pfd-focus);\n    }\n    .pfd-support__consent-text {\n        flex: 1 1 auto;\n    }\n    .pfd-support__field--consent.pfd-support__field--invalid {\n        background: var(--pfd-error-bg) !important;\n        border-color: var(--pfd-error) !important;\n    }\n    .pfd-support__field--consent.pfd-support__field--invalid .pfd-support__consent-box {\n        border-color: var(--pfd-error);\n    }\n    .pfd-support__status {\n        margin: 18px 0 0 0 !important;\n        padding: 12px 14px !important;\n        border-radius: var(--pfd-radius-sm);\n        font-size: 14px !important;\n        line-height: 1.45 !important;\n        display: none;\n        white-space: pre-line;\n    }\n    .pfd-support__status--success {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        background: var(--pfd-success-bg);\n        border: 1px solid #B6E2C5;\n        color: var(--pfd-success); \/* 7.1:1 \u2713 AAA *\/\n    }\n    .pfd-support__status--error {\n        display: flex;\n        align-items: flex-start;\n        gap: 10px;\n        background: var(--pfd-error-bg);\n        border: 1px solid #F0BABA;\n        color: var(--pfd-error); \/* 5.9:1 \u2713 AA *\/\n    }\n    .pfd-support__status::before {\n        content: '';\n        flex: 0 0 18px;\n        width: 18px;\n        height: 18px;\n        margin-top: 1px;\n        background-repeat: no-repeat;\n        background-size: contain;\n    }\n    .pfd-support__status--success::before {\n        background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%231B5E3A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'\/><\/svg>\");\n    }\n    .pfd-support__status--error::before {\n        background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%23C53030' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'\/><line x1='12' y1='8' x2='12' y2='12'\/><line x1='12' y1='16' x2='12.01' y2='16'\/><\/svg>\");\n    }\n    \/* WCAG 2.3.3 \u2014 Animation aus, wenn User reduced-motion bevorzugt.\n       Auch f\u00fcr Loading-Spinner \u2014 der dreht sonst endlos und kann bei\n       Vestibular-Sensitivit\u00e4t Symptome ausl\u00f6sen. *\/\n    @media (prefers-reduced-motion: reduce) {\n        .pfd-support *,\n        .pfd-support *::before,\n        .pfd-support *::after {\n            animation-duration: 0.001ms !important;\n            animation-iteration-count: 1 !important;\n            transition-duration: 0.001ms !important;\n        }\n        .pfd-support__submit-spinner {\n            animation: none !important;\n        }\n    }\n\n    \/* Responsive: ein-Spalter unter 520 px *\/\n    @media (max-width: 520px) {\n        .pfd-support__card { padding: 20px !important; }\n        .pfd-support__grid { grid-template-columns: 1fr; }\n        .pfd-support__actions { flex-direction: column; align-items: stretch; }\n        .pfd-support__submit { justify-content: center; }\n        .pfd-support__legal { order: 2; text-align: center; }\n    }\n\n    \/* HINWEIS: Dark-Mode wurde bewusst entfernt. Die Card bleibt\n       IMMER hell, auch wenn das Theme dunkel ist \u2014 der User soll auf\n       schwarzem Theme-Hintergrund eine klar abgesetzte wei\u00dfe Card\n       sehen, statt eine im Dark-Look untergehende. *\/\n    <\/style>\n\n    <script>\n    (function () {\n        var container = document.getElementById(\"pfd-support-2\");\n        if (!container) return;\n        var form    = container.querySelector('.pfd-support__form');\n        var submit  = container.querySelector('.pfd-support__submit');\n        var status  = container.querySelector('.pfd-support__status');\n        var srcInput = container.querySelector('input[name=\"source\"]');\n        if (srcInput) srcInput.value = window.location.href;\n\n        \/\/ Live-Counter f\u00fcr die Nachricht \u2014 gibt visuelles Feedback bei\n        \/\/ ~4000 Zeichen-Limit, und erinnert daran, dass das ein Limit ist.\n        var msg = form.querySelector('textarea[name=\"message\"]');\n        var counter = container.querySelector('.pfd-support__counter-now');\n        var counterMax = msg ? (parseInt(msg.getAttribute('maxlength'), 10) || 4000) : 4000;\n        if (msg && counter) {\n            var update = function () {\n                counter.textContent = String(msg.value.length);\n                counter.parentElement.style.color =\n                    msg.value.length > counterMax * 0.92 ? 'var(--pfd-coral-600)' : '';\n            };\n            msg.addEventListener('input', update);\n            update();\n        }\n\n        function setStatus(type, message) {\n            status.className = 'pfd-support__status pfd-support__status--' + type;\n            status.textContent = message;\n        }\n\n        \/\/ Mappt Backend-Field-Codes auf deutsche Labels UND ordnet\n        \/\/ jedem Code das zugeh\u00f6rige Form-Feld zu \u2014 f\u00fcr `aria-invalid`\n        \/\/ und Focus-Management. WCAG 3.3.1 + 3.3.3.\n        var FIELD_MAP = {\n            'name_required':     { label: 'Name fehlt oder ist zu kurz (min. 2 Zeichen)',  selector: 'input[name=\"name\"]' },\n            'email_invalid':     { label: 'E-Mail-Adresse fehlt oder ist ung\u00fcltig',         selector: 'input[name=\"email\"]' },\n            'subject_required':  { label: 'Betreff fehlt oder ist zu kurz (min. 3 Zeichen)', selector: 'input[name=\"subject\"]' },\n            'message_too_short': { label: 'Nachricht ist zu kurz (min. 10 Zeichen)',         selector: 'textarea[name=\"message\"]' },\n            'consent_required':  { label: 'Bitte stimme der Datenverarbeitung zu',           selector: 'input[name=\"consent\"]' }\n        };\n\n        var consentField = container.querySelector('.pfd-support__field--consent');\n        var consentBox   = container.querySelector('input[name=\"consent\"]');\n\n        \/\/ Reset von `aria-invalid` + Consent-Invalid-Styling, sobald\n        \/\/ der User das Feld korrigiert \u2014 vermeidet stehenbleibende\n        \/\/ Fehlerstatus, die f\u00fcr Screenreader irref\u00fchrend w\u00e4ren.\n        Array.prototype.forEach.call(\n            form.querySelectorAll('input, textarea, select'),\n            function (el) {\n                el.addEventListener('input', function () {\n                    if (el.getAttribute('aria-invalid') === 'true' &&\n                        el.value && el.checkValidity()) {\n                        el.setAttribute('aria-invalid', 'false');\n                    }\n                });\n            }\n        );\n\n        if (consentBox && consentField) {\n            consentBox.addEventListener('change', function () {\n                if (consentBox.checked) {\n                    consentField.classList.remove('pfd-support__field--invalid');\n                    consentBox.setAttribute('aria-invalid', 'false');\n                }\n            });\n        }\n\n        function clearAriaInvalid() {\n            Array.prototype.forEach.call(\n                form.querySelectorAll('[aria-invalid=\"true\"]'),\n                function (el) { el.setAttribute('aria-invalid', 'false'); }\n            );\n            if (consentField) consentField.classList.remove('pfd-support__field--invalid');\n        }\n\n        function setStatusFromError(fields, fallbackText) {\n            \/\/ Toggle aria-live auf assertive f\u00fcr Fehler \u2014 damit\n            \/\/ Screenreader die Fehlermeldung sofort lesen, nicht erst\n            \/\/ beim n\u00e4chsten Sprech-Slot. WCAG 4.1.3.\n            status.setAttribute('aria-live', 'assertive');\n            status.setAttribute('role', 'alert');\n\n            if (fields && fields.length > 0) {\n                \/\/ aria-invalid + Focus auf erstes Fehler-Feld\n                var firstInvalidEl = null;\n                fields.forEach(function (f) {\n                    var meta = FIELD_MAP[f];\n                    if (!meta) return;\n                    var el = form.querySelector(meta.selector);\n                    if (!el) return;\n                    el.setAttribute('aria-invalid', 'true');\n                    if (f === 'consent_required' && consentField) {\n                        consentField.classList.add('pfd-support__field--invalid');\n                    }\n                    if (!firstInvalidEl) firstInvalidEl = el;\n                });\n\n                var lines = fields.map(function (f) {\n                    return '\u2022 ' + ((FIELD_MAP[f] && FIELD_MAP[f].label) || f);\n                });\n                setStatus('error', 'Bitte korrigiere folgende Eingaben:\\n' + lines.join('\\n'));\n\n                if (firstInvalidEl && typeof firstInvalidEl.focus === 'function') {\n                    \/\/ setTimeout, damit aria-live erst \u201eschaltet\"\n                    setTimeout(function () { firstInvalidEl.focus(); }, 60);\n                }\n                return;\n            }\n\n            setStatus('error', fallbackText);\n        }\n\n        function setStatus(type, message) {\n            status.className = 'pfd-support__status pfd-support__status--' + type;\n            status.textContent = message;\n            if (type === 'success') {\n                status.setAttribute('aria-live', 'polite');\n                status.setAttribute('role', 'status');\n            }\n        }\n\n        form.addEventListener('submit', function (ev) {\n            ev.preventDefault();\n\n            clearAriaInvalid();\n\n            \/\/ Client-seitige Vorab-Validierung der Datenschutz-Checkbox.\n            if (consentBox && !consentBox.checked) {\n                setStatusFromError(['consent_required'], '');\n                return;\n            }\n\n            submit.disabled = true;\n            container.classList.add('pfd-support--loading');\n            form.setAttribute('aria-busy', 'true');\n            status.className = 'pfd-support__status';\n            status.textContent = '';\n\n            var data = new FormData(form);\n\n            fetch(\"https:\\\/\\\/deinperfectday.de\\\/wp-admin\\\/admin-ajax.php\", {\n                method: 'POST',\n                body: data,\n                credentials: 'same-origin'\n            })\n            .then(function (r) { return r.json().catch(function () { return { ok: false }; }); })\n            .then(function (j) {\n                if (j && j.success && j.data && j.data.ok) {\n                    var ticketId = j.data.ticketId || '\u2014';\n                    var msg = 'Danke! Deine Anfrage ist angekommen \u2014 Ticket-ID ' +\n                              ticketId + '. Wir melden uns per E-Mail zur\u00fcck.';\n                    \/\/ Wenn die Plattform Mail-Probleme hatte (z.B. SMTP nicht\n                    \/\/ konfiguriert), informieren wir den User transparent \u2014\n                    \/\/ das Ticket ist trotzdem in der DB und wird intern\n                    \/\/ bearbeitet.\n                    if (j.data.warning === 'mail_autoreply_failed') {\n                        msg += ' (Hinweis: die automatische Best\u00e4tigungs-Mail konnte gerade nicht zugestellt werden \u2014 deine Anfrage wurde aber gespeichert.)';\n                    } else if (j.data.warning === 'mail_team_failed') {\n                        msg += ' (Hinweis: unsere Mail-Zustellung hat aktuell Probleme \u2014 wir bearbeiten deine Anfrage manuell aus dem System.)';\n                    }\n                    setStatus('success', msg);\n                    form.reset();\n                    if (counter) counter.textContent = '0';\n                    clearAriaInvalid();\n                    return;\n                }\n\n                var err    = (j && j.data && j.data.error)  ? j.data.error  : 'unknown';\n                var fields = (j && j.data && j.data.fields) ? j.data.fields : [];\n\n                if (err === 'validation') {\n                    setStatusFromError(fields, 'Bitte f\u00fclle alle Pflichtfelder korrekt aus.');\n                    return;\n                }\n\n                var text = ({\n                    'rate_limited':         'Zu viele Anfragen \u2014 bitte sp\u00e4ter erneut versuchen.',\n                    'mail_failed':          'Mail-Versand ist gerade nicht m\u00f6glich, bitte sp\u00e4ter erneut.',\n                    'platform_unreachable': 'Plattform-Server gerade nicht erreichbar.',\n                    'invalid_nonce':        'Sitzung abgelaufen \u2014 Seite neu laden und nochmal probieren.',\n                    'too_fast':             'Bitte ein paar Sekunden warten und nochmal versuchen.'\n                })[err] || 'Es gab ein Problem \u2014 bitte sp\u00e4ter erneut versuchen.';\n                setStatusFromError([], text);\n            })\n            .catch(function () {\n                setStatusFromError([], 'Netzwerk-Problem \u2014 bitte sp\u00e4ter erneut versuchen.');\n            })\n            .finally(function () {\n                submit.disabled = false;\n                container.classList.remove('pfd-support--loading');\n                form.setAttribute('aria-busy', 'false');\n            });\n        });\n    })();\n    <\/script>\n    \n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-233170","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/pages\/233170","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/comments?post=233170"}],"version-history":[{"count":5,"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/pages\/233170\/revisions"}],"predecessor-version":[{"id":233181,"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/pages\/233170\/revisions\/233181"}],"wp:attachment":[{"href":"https:\/\/deinperfectday.de\/es\/wp-json\/wp\/v2\/media?parent=233170"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}