{"id":164,"date":"2025-06-24T22:47:12","date_gmt":"2025-06-24T20:47:12","guid":{"rendered":"https:\/\/a11ybridge.de\/?page_id=164"},"modified":"2025-06-29T13:57:05","modified_gmt":"2025-06-29T11:57:05","slug":"pricing","status":"publish","type":"page","link":"https:\/\/a11ybridge.de\/en\/pricing\/","title":{"rendered":"Pricing"},"content":{"rendered":"<p><meta charset=\"UTF-8\"><br \/>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<link href=\"https:\/\/cdn.jsdelivr.net\/npm\/tailwindcss@2.2.19\/dist\/tailwind.min.css\" rel=\"stylesheet\">\n<style>\n<p>    .switch {\n      position: relative;\n      display: inline-block;\n      width: 52px;\n      height: 28px;\n    }\n    .switch input {\n      opacity: 0;\n      width: 0;\n      height: 0;\n    }\n    .slider {\n      position: absolute;\n      cursor: pointer;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      background-color: #ccc;\n      transition: .4s;\n      border-radius: 9999px;\n    }\n    .slider:before {\n      position: absolute;\n      content: \"\";\n      height: 20px;\n      width: 20px;\n      left: 4px;\n      bottom: 4px;\n      background-color: white;\n      transition: .4s;\n      border-radius: 50%;\n    }\n    input:checked + .slider {\n      background-color: #3b82f6;\n    }\n    input:checked + .slider:before {\n      transform: translateX(24px);\n    }\n<\/style>\n\n                <!-- VOLLST\u00c4NDIGE CSS-STYLES F\u00dcR TAILWIND-ERSATZ -->\n        <style>\n        \/* Reset und Base Styles *\/\n        #a11ybridge-wrapper * {\n            box-sizing: border-box;\n        }\n        \n        #a11ybridge-wrapper {\n            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n            background-color: #f8fafc;\n            color: #1a202c;\n            padding: 2rem;\n            line-height: 1.5;\n        }\n        \n        \/* Layout *\/\n        #a11ybridge-wrapper .max-w-7xl {\n            max-width: 1280px;\n            margin: 0 auto;\n        }\n        \n        \/* Typography *\/\n        #a11ybridge-wrapper .text-4xl {\n            font-size: 2.25rem;\n            line-height: 2.5rem;\n        }\n        #a11ybridge-wrapper .text-3xl {\n            font-size: 1.875rem;\n            line-height: 2.25rem;\n        }\n        #a11ybridge-wrapper .text-xl {\n            font-size: 1.25rem;\n            line-height: 1.75rem;\n        }\n        #a11ybridge-wrapper .text-sm {\n            font-size: 0.875rem;\n            line-height: 1.25rem;\n        }\n        #a11ybridge-wrapper .text-xs {\n            font-size: 0.75rem;\n            line-height: 1rem;\n        }\n        \n        \/* Font Weights *\/\n        #a11ybridge-wrapper .font-bold {\n            font-weight: 700;\n        }\n        #a11ybridge-wrapper .font-medium {\n            font-weight: 500;\n        }\n        \n        \/* Text Alignment *\/\n        #a11ybridge-wrapper .text-center {\n            text-align: center;\n        }\n        \n        \/* Colors *\/\n        #a11ybridge-wrapper .text-gray-900 {\n            color: #1a202c;\n        }\n        #a11ybridge-wrapper .text-gray-800 {\n            color: #2d3748;\n        }\n        #a11ybridge-wrapper .text-gray-700 {\n            color: #4a5568;\n        }\n        #a11ybridge-wrapper .text-gray-600 {\n            color: #718096;\n        }\n        #a11ybridge-wrapper .text-gray-500 {\n            color: #a0aec0;\n        }\n        #a11ybridge-wrapper .text-blue-600 {\n            color: #3182ce;\n        }\n        #a11ybridge-wrapper .text-green-600 {\n            color: #38a169;\n        }\n        #a11ybridge-wrapper .text-green-500 {\n            color: #48bb78;\n        }\n        #a11ybridge-wrapper .text-purple-600 {\n            color: #805ad5;\n        }\n        #a11ybridge-wrapper .text-white {\n            color: #ffffff;\n        }\n        \n        \/* Backgrounds *\/\n        #a11ybridge-wrapper .bg-gray-50 {\n            background-color: #f8fafc;\n        }\n        #a11ybridge-wrapper .bg-white {\n            background-color: #ffffff;\n        }\n        #a11ybridge-wrapper .bg-blue-500 {\n            background-color: #4299e1;\n        }\n        #a11ybridge-wrapper .bg-blue-600 {\n            background-color: #3182ce;\n        }\n        #a11ybridge-wrapper .bg-gray-600 {\n            background-color: #718096;\n        }\n        #a11ybridge-wrapper .bg-gray-700 {\n            background-color: #4a5568;\n        }\n        \n        \/* Hover States *\/\n        #a11ybridge-wrapper .hover\\\\:bg-blue-700:hover {\n            background-color: #2c5282;\n        }\n        #a11ybridge-wrapper .hover\\\\:bg-gray-700:hover {\n            background-color: #4a5568;\n        }\n        #a11ybridge-wrapper .hover\\\\:bg-green-50:hover {\n            background-color: #f0fff4;\n        }\n        \n        \/* Spacing *\/\n        #a11ybridge-wrapper .p-5 {\n            padding: 1.25rem;\n        }\n        #a11ybridge-wrapper .p-6 {\n            padding: 1.5rem;\n        }\n        #a11ybridge-wrapper .px-4 {\n            padding-left: 1rem;\n            padding-right: 1rem;\n        }\n        #a11ybridge-wrapper .py-1 {\n            padding-top: 0.25rem;\n            padding-bottom: 0.25rem;\n        }\n        #a11ybridge-wrapper .mb-2 {\n            margin-bottom: 0.5rem;\n        }\n        #a11ybridge-wrapper .mb-3 {\n            margin-bottom: 0.75rem;\n        }\n        #a11ybridge-wrapper .mb-4 {\n            margin-bottom: 1rem;\n        }\n        #a11ybridge-wrapper .mb-6 {\n            margin-bottom: 1.5rem;\n        }\n        #a11ybridge-wrapper .mb-12 {\n            margin-bottom: 3rem;\n        }\n        #a11ybridge-wrapper .mt-2 {\n            margin-top: 0.5rem;\n        }\n        #a11ybridge-wrapper .mt-6 {\n            margin-top: 1.5rem;\n        }\n        #a11ybridge-wrapper .mt-12 {\n            margin-top: 3rem;\n        }\n        #a11ybridge-wrapper .mr-2 {\n            margin-right: 0.5rem;\n        }\n        \n        \/* Layout *\/\n        #a11ybridge-wrapper .flex {\n            display: flex;\n        }\n        #a11ybridge-wrapper .flex-col {\n            flex-direction: column;\n        }\n        #a11ybridge-wrapper .inline-flex {\n            display: inline-flex;\n        }\n        #a11ybridge-wrapper .justify-center {\n            justify-content: center;\n        }\n        #a11ybridge-wrapper .justify-between {\n            justify-content: space-between;\n        }\n        #a11ybridge-wrapper .items-center {\n            align-items: center;\n        }\n        #a11ybridge-wrapper .items-start {\n            align-items: flex-start;\n        }\n        #a11ybridge-wrapper .gap-4 {\n            gap: 1rem;\n        }\n        #a11ybridge-wrapper .gap-6 {\n            gap: 1.5rem;\n        }\n        #a11ybridge-wrapper .space-y-2 > * + * {\n            margin-top: 0.5rem;\n        }\n                \n        \/* Grid *\/\n        #a11ybridge-wrapper .grid {\n            display: grid;\n            grid-template-columns: repeat(4, minmax(0, 1fr));\n        }\n        @media (max-width: 1023px) {\n            #a11ybridge-wrapper .grid {\n                grid-template-columns: repeat(2, minmax(0, 1fr));\n            }\n        }\n        @media (max-width: 767px) {\n            #a11ybridge-wrapper .grid {\n                grid-template-columns: repeat(1, minmax(0, 1fr));\n            }\n        }\n        \n        \/* Sizing *\/\n        #a11ybridge-wrapper .w-full {\n            width: 100%;\n        }\n        #a11ybridge-wrapper .h-12 {\n            height: 3rem;\n        }\n        \n        \/* Positioning *\/\n        #a11ybridge-wrapper .relative {\n            position: relative;\n        }\n        #a11ybridge-wrapper .absolute {\n            position: absolute;\n        }\n        #a11ybridge-wrapper .-top-3 {\n            top: -0.75rem;\n        }\n        #a11ybridge-wrapper .left-1\\\\\/2 {\n            left: 50%;\n        }\n        #a11ybridge-wrapper .transform {\n            transform: translateX(-50%);\n        }\n        #a11ybridge-wrapper .-translate-x-1\\\\\/2 {\n            transform: translateX(-50%);\n        }\n        \n        \/* Borders *\/\n        #a11ybridge-wrapper .border {\n            border-width: 1px;\n            border-color: #e2e8f0;\n        }\n        #a11ybridge-wrapper .border-2 {\n            border-width: 2px;\n        }\n        #a11ybridge-wrapper .border-blue-500 {\n            border-color: #4299e1;\n        }\n        #a11ybridge-wrapper .border-green-600 {\n            border-color: #38a169;\n        }\n        #a11ybridge-wrapper .rounded {\n            border-radius: 0.25rem;\n        }\n        #a11ybridge-wrapper .rounded-lg {\n            border-radius: 0.5rem;\n        }\n        #a11ybridge-wrapper .rounded-full {\n            border-radius: 9999px;\n        }\n        \n        \/* Shadows *\/\n        #a11ybridge-wrapper .shadow {\n            box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);\n        }\n        #a11ybridge-wrapper .shadow-lg {\n            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n        }\n        \n        \/* Misc *\/\n        #a11ybridge-wrapper .italic {\n            font-style: italic;\n        }\n        \n        \/* Toggle Switch Styles *\/\n        #a11ybridge-wrapper .switch {\n            position: relative;\n            display: inline-block;\n            width: 60px;\n            height: 34px;\n        }\n        #a11ybridge-wrapper .switch input {\n            opacity: 0;\n            width: 0;\n            height: 0;\n        }\n        #a11ybridge-wrapper .slider {\n            position: absolute;\n            cursor: pointer;\n            top: 0;\n            left: 0;\n            right: 0;\n            bottom: 0;\n            background-color: #ccc;\n            transition: .4s;\n            border-radius: 34px;\n        }\n        #a11ybridge-wrapper .slider:before {\n            position: absolute;\n            content: \"\";\n            height: 26px;\n            width: 26px;\n            left: 4px;\n            bottom: 4px;\n            background-color: white;\n            transition: .4s;\n            border-radius: 50%;\n        }\n        #a11ybridge-wrapper input:checked + .slider {\n            background-color: #4299e1;\n        }\n        #a11ybridge-wrapper input:checked + .slider:before {\n            transform: translateX(26px);\n        }\n        \n        \/* Button Styles *\/\n        #a11ybridge-wrapper a {\n            text-decoration: none;\n            cursor: pointer;\n            transition: all 0.2s ease;\n        }\n        <\/style>\n        \n    <div id=\"a11ybridge-wrapper\" class=\"bg-gray-50 text-gray-900 p-5 font-sans items-stretch\">\n      <div class=\"max-w-7xl mx-auto\">\n        <h2 class=\"text-4xl font-bold text-center mb-4\">A11yBridge Preispakete<\/h2>\n        <p class=\"text-center text-gray-600 mb-6\">W\u00e4hle den passenden Plan f\u00fcr deine Website. Alle Pl\u00e4ne sind jederzeit k\u00fcndbar. Sparen Sie zus\u00e4tzlich 17% bei j\u00e4hrlicher Zahlung.<\/p>\n\n        <div class=\"flex justify-center items-center gap-4 mb-12\">\n          <span class=\"text-sm font-medium\">Monatlich<\/span>\n          <label class=\"switch\">\n            <input type=\"checkbox\" id=\"toggleCheckbox\" onchange=\"togglePricing()\">\n            <span class=\"slider\"><\/span>\n          <\/label>\n          <span class=\"text-sm font-medium\">J\u00e4hrlich <span class=\"text-green-600 font-bold\">(-17%)<\/span><\/span>\n        <\/div>\n\n        <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12\" id=\"pricingCards\">\n                      <div class=\"border shadowp-6 rounded-lg bg-white flex flex-col justify-between\">\n                            \n              <div>\n                <h3 class=\"text-xl font-bold text-center mb-4 text-green-600\">\n                  \ud83c\udd93                                                                        Free                <\/h3>\n                \n                <p class=\"text-3xl font-bold text-center mb-2 text-green-600\"\n                   data-monthly=\"0 \u20ac\"\n                   data-yearly=\"0 \u20ac\">\n                   0 \u20ac                <\/p>\n                \n                <p class=\"text-center text-sm text-gray-500 mb-4\">\n                  F\u00fcr immer kostenlos                <\/p>\n                \n                <p class=\"text-sm text-gray-600 mb-3 text-center\">Basis-Barrierefreiheit f\u00fcr kleine Websites.<\/p>\n                <!-- TODO: <p class=\"text-xs italic text-gray-500 mb-6 text-center\">Perfekt zum Ausprobieren und f\u00fcr kleine Projekte.<\/p>-->\n                \n                <ul class=\"text-sm text-gray-700 mt-2 space-y-2\">\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Basis-Toolbar<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>100 KI Aktionen \/ Monat<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>TTS (Text-to-Speech) inklusive<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>KI-gesteuerte Textvereinfachung inklusive<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Kein Premium Support<\/span>\n                    <\/li>\n                                  <\/ul>\n              <\/div>\n              \n              <div class=\"mt-6\">\n                                  <a href=\"#\"\n                      style=\"text-decoration: none;\"\n                     class=\"inline-flex justify-center items-center text-green-600 border-2 border-green-600 text-sm font-medium text-center w-full h-12 px-4 rounded hover:bg-green-50\">\n                     Kostenlos starten                  <\/a>\n                              <\/div>\n            <\/div>\n                      <div class=\"border border-2 border-blue-500 shadow-lg relativep-6 rounded-lg bg-white flex flex-col justify-between\">\n                              <!--div class=\"absolute -top-3 left-1\/2 transform -translate-x-1\/2 bg-blue-500 text-white px-4 py-1 rounded-full text-sm font-medium\">\n                  BELIEBT\n                <\/div-->\n                            \n              <div>\n                <h3 class=\"text-xl font-bold text-center mb-4 text-blue-600\">\n                                    \ud83d\ude80                                                      Starter                <\/h3>\n                \n                <p class=\"text-3xl font-bold text-center mb-2 text-blue-600\"\n                   data-monthly=\"9,99 \u20ac\"\n                   data-yearly=\"99,99 \u20ac\">\n                   9,99 \u20ac                <\/p>\n                \n                <p class=\"text-center text-sm text-gray-500 mb-4\">\n                  pro Monat                <\/p>\n                \n                <p class=\"text-sm text-gray-600 mb-3 text-center\">Erweiterte Barrierefreiheit mit allen Voice Commands.<\/p>\n                <!-- TODO: <p class=\"text-xs italic text-gray-500 mb-6 text-center\">BELIEBT - Ideal f\u00fcr Content Creators und kleine Unternehmen.<\/p>-->\n                \n                <ul class=\"text-sm text-gray-700 mt-2 space-y-2\">\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Alle Free-Features<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>5.000 KI Aktionen \/ Monat<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>1 Domain<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>E-Mail Support<\/span>\n                    <\/li>\n                                  <\/ul>\n              <\/div>\n              \n              <div class=\"mt-6\">\n                                  <a href=\"#\"\n                      style=\"text-decoration: none;\"\n                     class=\"paddle-checkout-button inline-flex justify-center items-center text-white text-sm font-medium text-center w-full h-12 px-4 rounded bg-blue-600 hover:bg-blue-700\"\n                     data-product-id-monthly-sandbox=\"pri_01jwxggn9jn76kmnm0dbtad3aj\"\n                     data-product-id-yearly-sandbox=\"pri_01jxf43wpzcdyg49cbxbsng9re\"\n                     data-product-id-monthly-production=\"pri_01jwxh3hhaaasrx560n379bbc5\"\n                     data-product-id-yearly-production=\"pri_01jxmrpfw00v4xk386w4h7pnkn\"\n                     data-user-id=\"0\"\n                     data-is-sandbox=\"0\">\n                     Plan w\u00e4hlen                  <\/a>\n                              <\/div>\n            <\/div>\n                      <div class=\"border shadowp-6 rounded-lg bg-white flex flex-col justify-between\">\n                            \n              <div>\n                <h3 class=\"text-xl font-bold text-center mb-4 text-purple-600\">\n                                                      \ud83d\udc8e                                    Pro                <\/h3>\n                \n                <p class=\"text-3xl font-bold text-center mb-2 text-blue-600\"\n                   data-monthly=\"24,99 \u20ac\"\n                   data-yearly=\"249,99 \u20ac\">\n                   24,99 \u20ac                <\/p>\n                \n                <p class=\"text-center text-sm text-gray-500 mb-4\">\n                  pro Monat                <\/p>\n                \n                <p class=\"text-sm text-gray-600 mb-3 text-center\">Professionelle L\u00f6sung mit noch mehr KI Aktionen und 3 Domains.<\/p>\n                <!-- TODO: <p class=\"text-xs italic text-gray-500 mb-6 text-center\">Empfohlen f\u00fcr Agenturen und wachsende Unternehmen.<\/p>-->\n                \n                <ul class=\"text-sm text-gray-700 mt-2 space-y-2\">\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Alle Starter-Features<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>50.000 KI-Aktionen \/ Monat<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>3 Domains<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Priorisierter Support<\/span>\n                    <\/li>\n                                  <\/ul>\n              <\/div>\n              \n              <div class=\"mt-6\">\n                                  <a href=\"#\"\n                      style=\"text-decoration: none;\"\n                     class=\"paddle-checkout-button inline-flex justify-center items-center text-white text-sm font-medium text-center w-full h-12 px-4 rounded bg-gray-600 hover:bg-gray-700\"\n                     data-product-id-monthly-sandbox=\"pri_01jwxgseakw1cq51s25xdr0hvs\"\n                     data-product-id-yearly-sandbox=\"pri_01jxf6050ph7vz34andgb0dw47\"\n                     data-product-id-monthly-production=\"pri_01jwxgyvwjyqbmyf7y1g450w2d\"\n                     data-product-id-yearly-production=\"pri_01jxmrs209nvtv1r41w5hnf7h5\"\n                     data-user-id=\"0\"\n                     data-is-sandbox=\"0\">\n                     Plan w\u00e4hlen                  <\/a>\n                              <\/div>\n            <\/div>\n                      <div class=\"border shadowp-6 rounded-lg bg-white flex flex-col justify-between\">\n                            \n              <div>\n                <h3 class=\"text-xl font-bold text-center mb-4 text-gray-800\">\n                                                                        \ud83c\udfe2                  Business                <\/h3>\n                \n                <p class=\"text-3xl font-bold text-center mb-2 text-blue-600\"\n                   data-monthly=\"99,99 \u20ac\"\n                   data-yearly=\"999,99 \u20ac\">\n                   99,99 \u20ac                <\/p>\n                \n                <p class=\"text-center text-sm text-gray-500 mb-4\">\n                  pro Monat                <\/p>\n                \n                <p class=\"text-sm text-gray-600 mb-3 text-center\">Enterprise-L\u00f6sung mit 100.000 KI Aktionen und 10 Domains.<\/p>\n                <!-- TODO: <p class=\"text-xs italic text-gray-500 mb-6 text-center\">F\u00fcr gro\u00dfe Organisationen mit hohen Anforderungen.<\/p>-->\n                \n                <ul class=\"text-sm text-gray-700 mt-2 space-y-2\">\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Alle Pro-Features<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>100.000 KI-Aktionen \/ Monat<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>10 Domains<\/span>\n                    <\/li>\n                                      <li class=\"flex items-start\">\n                      <span class=\"mr-2 text-green-500\">\u2713<\/span>\n                      <span>Priorisierter Premium Support<\/span>\n                    <\/li>\n                                  <\/ul>\n              <\/div>\n              \n              <div class=\"mt-6\">\n                                  <a href=\"#\"\n                      style=\"text-decoration: none;\"\n                     class=\"paddle-checkout-button inline-flex justify-center items-center text-white text-sm font-medium text-center w-full h-12 px-4 rounded bg-gray-600 hover:bg-gray-700\"\n                     data-product-id-monthly-sandbox=\"pri_01jxmr59kstx42v7j006gxzbm5\"\n                     data-product-id-yearly-sandbox=\"pri_01jxmr8mbtzmq6ngqg71jrfnqg\"\n                     data-product-id-monthly-production=\"pri_01jxmrvfs9ajf4kemrsx9ehsye\"\n                     data-product-id-yearly-production=\"pri_01jxmrx9ptkqrz2fm17q8t7gpd\"\n                     data-user-id=\"0\"\n                     data-is-sandbox=\"0\">\n                     Plan w\u00e4hlen                  <\/a>\n                              <\/div>\n            <\/div>\n                  <\/div>\n\n        <div class=\"mt-12 text-center text-sm text-gray-600\">\n          <p class=\"mb-2\">\ud83d\ude80 <strong>Voice Commands:<\/strong> Alle Pl\u00e4ne k\u00f6nnen alle Voice Commands nutzen<\/p>\n          <p class=\"mb-2\">\u26a1 <strong>KI-Power:<\/strong> Von 100 (Free) auf 5.000 (Starter) - das ist 50x mehr Leistung!<\/p>\n          <p>\ud83d\udcbc <strong>Support:<\/strong> E-Mail \u2192 Priorisierter Support \u2192 Premium Support<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"pricing-features-table\">\n        <h2>Feature-\u00dcbersicht<\/h2>\n        <table class=\"features-comparison\">\n            <thead>\n                <tr>\n                    <th>Feature \/ Service<\/th>\n                    <th>Free<\/th>\n                    <th>Starter<br><small>9,99\u20ac\/Monat<\/small><\/th>\n                    <th>Pro<br><small>24,99\u20ac\/Monat<\/small><\/th>\n                    <th>Business<br><small>99,99\u20ac\/Monat<\/small><\/th>\n                <\/tr>\n            <\/thead>\n            <tbody>\n                <tr>\n                    <td>Schriftgr\u00f6\u00dfen- und Schriftart-Einstellungen<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <tr>\n                    <td>Farbanpassung<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <tr>\n                    <td>Tastatur-Navigation<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <!--tr>\n                    <td>Alt-Texte f\u00fcr interaktive Elemente (KI)<\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 100 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 5000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 50000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 100000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                <\/tr-->\n                <tr>\n                    <td>\u00dcbersetzung in einfache Sprache (KI)<\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 100 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 5000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 50000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 100000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                <\/tr>\n                <tr>\n                    <td>Fokusmodus<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <tr>\n                    <td>Farbfilter f\u00fcr visuelle St\u00f6rungen<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <tr>\n                    <td>Text-to-Speech<\/td>\n                    <td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <tr>\n                    <td>Lizenz-Management<\/td>\n                    <td>\u274c<\/td><td>\u2705<\/td><td>\u2705<\/td><td>\u2705<\/td>\n                <\/tr>\n                <!--tr>\n                    <td>Voice-Commands (KI)<\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: 2 Befehle stehen zur Verf\u00fcgung und max. 100 Anfragen pro Monat\">\u26a0\ufe0f<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 5000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 50000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                    <td><span class=\"tooltip\" title=\"Eingeschr\u00e4nkt: max. 100000 Anfragen pro Monat\">\u2705<\/span><\/td>\n                <\/tr!-->\n                <!--tr>\n                    <td>Eigene Voice-Commands (KI)<\/td>\n                    <td>\u274c<\/td>\n                    <td>\u274c<\/td>\n                    <td>\u274c<\/td>\n                    <td><span class=\"tooltip\" title=\"Geplant f\u00fcr n\u00e4chstes Update\">\ud83d\udea7<\/span><\/td>\n                <\/tr!-->\n                <tr>\n                    <td>Monatliches Aktionslimit (global)<\/td>\n                    <td>100<\/td><td>5.000<\/td><td>50.000<\/td><td>100.000<\/td>\n                <\/tr>\n                <tr>\n                    <td>Priorisierter Support<\/td>\n                    <td>\u274c<\/td><td>\u274c<\/td><td>\u2705<\/td><td><span class=\"tooltip\" title=\"Antwortzeit unter 24h\">\u2705 (Top)<\/span><\/td>\n                <\/tr>\n                <tr>\n                    <td>Mehrbenutzer-Management<\/td>\n                    <td>\u274c<\/td><td>\u274c<\/td><td>\u274c<\/td><td><span class=\"tooltip\" title=\"Geplant f\u00fcr n\u00e4chstes Update\">\ud83d\udea7<\/span><\/td>\n                <\/tr>\n            <\/tbody>\n        <\/table>\n    <\/div>\n\n    <style>\n    .pricing-features-table {\n        margin-top: 40px;\n    }\n    .features-comparison {\n        width: 100%;\n        border-collapse: collapse;\n        margin-top: 15px;\n        font-size: 14px;\n    }\n    .features-comparison th,\n    .features-comparison td {\n        border: 1px solid #ddd;\n        padding: 10px;\n        text-align: center;\n    }\n    .features-comparison thead {\n        background: #f9f9f9;\n    }\n    .features-comparison td:first-child {\n        text-align: left;\n        font-weight: 500;\n    }\n\n    \/* Tooltip Effekt *\/\n    .tooltip {\n        position: relative;\n        cursor: help;\n    }\n    .tooltip:hover::after {\n        content: attr(title);\n        position: absolute;\n        bottom: 120%; \n        left: 50%;\n        transform: translateX(-50%);\n        background: #333;\n        color: #fff;\n        white-space: nowrap;\n        padding: 5px 8px;\n        border-radius: 4px;\n        font-size: 12px;\n        z-index: 999;\n    }\n    .tooltip:hover::before {\n        content: \"\";\n        position: absolute;\n        bottom: 110%;\n        left: 50%;\n        transform: translateX(-50%);\n        border-width: 6px;\n        border-style: solid;\n        border-color: transparent transparent #333 transparent;\n        z-index: 998;\n    }\n    <\/style>\n\n    <script src=\"https:\/\/cdn.paddle.com\/paddle\/v2\/paddle.js\"><\/script>\n    <script>\n      \/\/ Paddle Umgebung & Vendor konfigurieren (user-spezifisch)\n      Paddle.Environment.set('production');\n      var siteLang = 'en';\n      Paddle.Initialize({ \n        token: \"live_3229db0582b531f968693ea8cbf\",\n        checkout: {\n            settings: { locale: siteLang },\n            custom_data: { lang: siteLang }   \/\/ <<\u2014 wird im Webhook ankommen\n        }\n      });\n      Paddle.Setup({\n        vendor: 226694      });\n\n      \/\/ Debug-Info f\u00fcr Entwicklung\n      console.log('A11yBridge Paddle Config:', {\n        mode: 'production',\n        vendor: 226694,\n        user_email: '',\n        is_sandbox_user: false      });\n\n      \/\/ Pricing-Buttons aktivieren\n      document.querySelectorAll('.paddle-checkout-button').forEach(button => {\n        button.addEventListener('click', (e) => {\n          e.preventDefault();\n\n          const isSandbox = false;\n          const isYearly = document.getElementById(\"toggleCheckbox\")?.checked;\n          const userId = button.dataset.userId ?? '123456';\/\/ button.dataset.userId;\n          const interval = isYearly ? 'yearly' : 'monthly';\n          const mode = isSandbox ? 'sandbox' : 'production';\n\n          \/\/ Produkt-ID dynamisch holen\n          const productIdKey = `productId${capitalize(interval)}${capitalize(mode)}`;\n          const productId = button.dataset[productIdKey];\/\/ 'pro_01k5ea6ppw8f3xcbarbf614dd0';\/\/\n          const parentUrl = window.location.origin + window.location.pathname;\n          const rawUrl = window.location.href;\n          const cleanUrl = rawUrl.split('#')[0]; \/\/ entfernt Fragment\n\n          if (!productId) {\n            alert(\"Produkt-ID fehlt. Bitte \u00fcberpr\u00fcfe die Konfiguration.\");\n            return;\n          }\n\n            \/\/ define items\n          let itemsList = [\n            {\n              priceId: productId,\n              quantity: 1\n            }\n          ];\n          \/\/ Paddle-Checkout starten\n          \/\/*\n          var siteLang = 'en';\n          Paddle.Checkout.open({\n            vendor: 226694,\n            seller: 226694,\n            product: productId,\n            passthrough: JSON.stringify({ \n                user_id: userId,\n                lang: siteLang,\n                locale: siteLang,\n                custom_data: {\n                    lang: siteLang,\n                    locale: siteLang,\n                    parent_url: cleanUrl\n                }\n            }),\n            items: itemsList,\n            productid: productId,\n            displayMode: 'overlay',\n            parentUrl: window.location.origin + window.location.pathname\n          });\n          \/*\/\n          Paddle.Checkout.open({\n            passthrough: JSON.stringify({ user_id: userId }),\n            items: itemsList,\n            displayMode: 'overlay'\n          });\n          \/\/*\/\n        });\n      });\n\n      \/\/ Hilfsfunktionen\n      function capitalize(str) {\n          return str.charAt(0).toUpperCase() + str.slice(1);\n        }\n        \n        function togglePricing() {\n            const isYearly = document.getElementById('toggleCheckbox')?.checked;\n            const prices = document.querySelectorAll('[data-monthly][data-yearly]');\n            prices.forEach(el => {\n                el.textContent = isYearly ? el.dataset.yearly : el.dataset.monthly;\n            });\n        }\n        \n        function is_sandbox(){\n            return ;\n        }\n    <\/script>\n        \n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-164","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/pages\/164","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/comments?post=164"}],"version-history":[{"count":11,"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/pages\/164\/revisions"}],"predecessor-version":[{"id":227,"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/pages\/164\/revisions\/227"}],"wp:attachment":[{"href":"https:\/\/a11ybridge.de\/en\/wp-json\/wp\/v2\/media?parent=164"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}