{"id":1628,"date":"2026-08-21T15:50:11","date_gmt":"2026-08-21T13:50:11","guid":{"rendered":"https:\/\/www.steinkorb-zenter.ch\/?page_id=1628"},"modified":"2026-08-21T19:32:04","modified_gmt":"2026-08-21T17:32:04","slug":"1628-2","status":"publish","type":"page","link":"https:\/\/www.steinkorb-zenter.ch\/?page_id=1628","title":{"rendered":"Konfigurator"},"content":{"rendered":"    <style>\n        #gk-konfigurator {\n            max-width: 1100px;\n            font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n            color: #1a1a1a;\n            line-height: 1.45;\n        }\n        #gk-konfigurator h2 { font-size: 1.5rem; font-weight: 700; margin-bottom: 6px; }\n        #gk-konfigurator h3 { font-size: 1.1rem; font-weight: 600; margin: 22px 0 12px; }\n        .gk-hint { font-size: 0.85rem; color: #777; margin-bottom: 18px; }\n\n        \/* Inputs wie im Screenshot *\/\n        .gk-inputs {\n            display: grid;\n            grid-template-columns: repeat(4, 1fr);\n            gap: 10px;\n            margin-bottom: 20px;\n            width: 100%;\n        }\n        @media (max-width: 600px) {\n            .gk-inputs {\n                grid-template-columns: 1fr;\n            }\n        }\n        .gk-input-box {\n            background: #fff;\n            border: 1px solid #e2e2e2;\n            border-radius: 12px;\n            padding: 8px 8px;\n            box-shadow: 0 1px 3px rgba(0,0,0,0.04);\n        }\n        .gk-input-box label {\n            display: block;\n            font-size: 0.72rem;\n            color: #666;\n            margin-bottom: 5px;\n            text-align: center;\n        }\n        .gk-stepper {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: 6px;\n        }\n        .gk-stepper button {\n            width: 32px;\n            height: 32px;\n            min-height: 32px;\n            border: 1px solid #d0d0d0;\n            border-radius: 8px;\n            background: #fff;\n            font-size: 1.1rem;\n            cursor: pointer;\n            color: #333;\n            line-height: 32px;\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            flex-shrink: 0;\n            padding: 0 !important;\n            margin: 0 !important;\n            box-sizing: border-box;\n            vertical-align: middle;\n        }\n        .gk-stepper button:hover { background: #f5f5f5; border-color: #0066cc; }\n        .gk-stepper input {\n            width: 56px;\n            height: 32px;\n            min-height: 32px;\n            border: 1px solid #e0e0e0;\n            border-radius: 6px;\n            text-align: center;\n            font-size: 0.95rem;\n            font-weight: 600;\n            outline: none;\n            background: #fafafa;\n            padding: 0 !important;\n            margin: 0 !important;\n            line-height: 32px;\n            box-sizing: border-box;\n            vertical-align: middle;\n            -moz-appearance: textfield;\n            appearance: textfield;\n        }\n        .gk-stepper input::-webkit-outer-spin-button,\n        .gk-stepper input::-webkit-inner-spin-button {\n            -webkit-appearance: none;\n            margin: 0;\n        }\n\n        \/* Layout: Steine + Summary\/Form *\/\n        .gk-main {\n            display: grid;\n            grid-template-columns: 2fr 1fr;\n            gap: 24px;\n            align-items: start;\n        }\n        @media (max-width: 800px) {\n            .gk-main { grid-template-columns: 1fr; }\n            .gk-summary-box { order: 2; }\n        }\n\n        .gk-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\n            gap: 12px;\n        }\n        .gk-card {\n            background: #fff;\n            border: 2px solid #e8e8e8;\n            border-radius: 12px;\n            padding: 12px;\n            cursor: pointer;\n            text-align: center;\n            transition: all 0.2s ease;\n            position: relative;\n            box-shadow: 0 1px 4px rgba(0,0,0,0.04);\n        }\n        .gk-card:hover {\n            border-color: #4d94db;\n            transform: translateY(-2px);\n            box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n        }\n        .gk-card.selected {\n            border-color: #0066cc;\n            background: #f0f7ff;\n            box-shadow: 0 0 0 3px rgba(0,102,204,0.15);\n        }\n        .gk-card img {\n            width: 80px;\n            height: 80px;\n            object-fit: cover;\n            border-radius: 8px;\n            margin-bottom: 8px;\n        }\n        .gk-card strong {\n            display: block;\n            font-size: 0.85rem;\n            margin-bottom: 3px;\n            line-height: 1.3;\n        }\n        .gk-card .preis {\n            font-size: 0.82rem;\n            color: #0066cc;\n            font-weight: 600;\n        }\n        .gk-info-btn {\n            position: absolute;\n            top: 8px;\n            right: 8px;\n            width: 22px;\n            height: 22px;\n            border-radius: 50%;\n            background: #f0f0f0;\n            border: none;\n            font-size: 0.75rem;\n            font-weight: 700;\n            color: #555;\n            cursor: pointer;\n            line-height: 1;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n        }\n        .gk-info-btn:hover { background: #0066cc; color: #fff; }\n        #gk-regel-hinweis, .gk-schnell-regel {\n            font-size: 0.82rem;\n            margin: 8px 0 0;\n            line-height: 1.45;\n            padding: 8px 10px;\n            border-radius: 8px;\n            background: #f1f5f9;\n            color: #475569;\n        }\n        #gk-regel-hinweis.gk-regel-a, .gk-schnell-regel.gk-regel-a {\n            background: #e8f5e9;\n            border-left: 3px solid #2e7d32;\n        }\n        #gk-regel-hinweis.gk-regel-b, .gk-schnell-regel.gk-regel-b {\n            background: #e3f2fd;\n            border-left: 3px solid #0066cc;\n        }\n        .gk-regel-aktiv {\n            font-weight: 700;\n            color: #1a1a1a;\n            background: rgba(255,255,255,0.7);\n            padding: 2px 6px;\n            border-radius: 4px;\n        }\n        .gk-regel-inaktiv { color: #94a3b8; }\n        .gk-range-hint {\n            display: block;\n            font-size: 0.72rem;\n            color: #94a3b8;\n            margin-top: 4px;\n            font-weight: 500;\n        }\n        .gk-input-box .gk-range-hint { text-align: center; }\n        .gk-schnell-field .gk-range-hint { margin-top: 3px; font-size: 0.7rem; }\n        .gk-zube-qty {\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            gap: 4px;\n            margin-top: 8px;\n        }\n        .gk-zube-qty button {\n            width: 28px;\n            height: 28px;\n            border: 1px solid #d0d0d0;\n            border-radius: 6px;\n            background: #fff;\n            cursor: pointer;\n            font-size: 1rem;\n            line-height: 1;\n            padding: 0;\n        }\n        .gk-zube-qty button:hover { border-color: #0066cc; }\n        .gk-zube-qty input {\n            width: 40px;\n            height: 28px;\n            text-align: center;\n            border: 1px solid #e0e0e0;\n            border-radius: 6px;\n            font-weight: 600;\n            font-size: 0.9rem;\n            padding: 0;\n            -moz-appearance: textfield;\n        }\n        .gk-zube-qty input::-webkit-outer-spin-button,\n        .gk-zube-qty input::-webkit-inner-spin-button { -webkit-appearance: none; }\n        .gk-card.gk-zubehoer.selected { border-color: #0066cc; background: #f0f7ff; }\n\n\n\n        \/* Summary rechts *\/\n        .gk-summary-box {\n            background: #fff;\n            border: 1px solid #e8e8e8;\n            border-radius: 14px;\n            padding: 18px;\n            position: sticky;\n            top: 20px;\n            box-shadow: 0 2px 10px rgba(0,0,0,0.05);\n        }\n        .gk-summary-box h4 {\n            margin: 0 0 12px;\n            font-size: 0.95rem;\n            font-weight: 600;\n            color: #333;\n        }\n        .gk-summary-box .row {\n            display: flex;\n            justify-content: space-between;\n            font-size: 0.88rem;\n            margin: 6px 0;\n            color: #444;\n        }\n        .gk-summary-box .total {\n            margin-top: 12px;\n            padding-top: 6px;\n            border-top: 1px solid #eee;\n            font-size: 1.2rem;\n            font-weight: 700;\n            color: #0066cc;\n            display: flex;\n            justify-content: space-between;\n        }\n\n        \/* Form in rechter Spalte *\/\n        .gk-summary-box #gk-form {\n            margin-top: 18px;\n            padding-top: 16px;\n            border-top: 1px solid #eee;\n        }\n        .gk-summary-box #gk-form h4 {\n            margin: 0 0 12px;\n        }\n        #gk-form label {\n            font-size: 0.78rem;\n            color: #555;\n            font-weight: 500;\n            display: block;\n        }\n        #gk-form input, #gk-form textarea {\n            width: 100%;\n            padding: 8px 10px;\n            border: 1px solid #ddd;\n            border-radius: 8px;\n            margin-top: 3px;\n            margin-bottom: 10px;\n            font-size: 0.88rem;\n            box-sizing: border-box;\n        }\n        #gk-form input:focus, #gk-form textarea:focus {\n            outline: none;\n            border-color: #0066cc;\n            box-shadow: 0 0 0 3px rgba(0,102,204,0.12);\n        }\n        #gk-form button[type=submit] {\n            background: linear-gradient(135deg, #0066cc 0%, #0052a3 100%);\n            color: #fff;\n            padding: 11px 18px;\n            border: none;\n            border-radius: 8px;\n            font-size: 0.88rem;\n            font-weight: 600;\n            cursor: pointer;\n            width: 100%;\n            box-shadow: 0 3px 10px rgba(0,102,204,0.25);\n        }\n        #gk-form button[type=submit]:hover {\n            transform: translateY(-1px);\n            box-shadow: 0 5px 14px rgba(0,102,204,0.35);\n        }\n        #gk-message { margin-top: 12px; font-weight: 500; font-size: 0.85rem; }\n\n        \/* Modal *\/\n        .gk-modal {\n            display: none;\n            position: fixed;\n            inset: 0;\n            background: rgba(0,0,0,0.55);\n            z-index: 99999;\n            align-items: center;\n            justify-content: center;\n            padding: 20px;\n        }\n        .gk-modal.open { display: flex; }\n        .gk-modal-inner {\n            background: #fff;\n            border-radius: 16px;\n            max-width: 480px;\n            width: 100%;\n            padding: 24px;\n            position: relative;\n            box-shadow: 0 20px 50px rgba(0,0,0,0.2);\n            text-align: center;\n        }\n        .gk-modal-inner img {\n            display: block;\n            max-width: 100%;\n            max-height: 280px;\n            width: auto;\n            height: auto;\n            object-fit: contain;\n            border-radius: 10px;\n            margin: 0 auto 14px auto;\n        }\n        .gk-modal-inner h3 { margin: 0 0 8px; font-size: 1.15rem; }\n        .gk-modal-inner p { font-size: 0.9rem; color: #555; margin: 0; }\n        .gk-modal-close {\n            position: absolute;\n            top: 12px;\n            right: 14px;\n            background: none;\n            border: none;\n            font-size: 1.4rem;\n            cursor: pointer;\n            color: #888;\n            line-height: 1;\n        }\n        .gk-modal-close:hover { color: #333; }\n    <\/style>\n\n    <div id=\"gk-konfigurator\">\n        <h2>Gabionen-Konfigurator<\/h2>\n        <p class=\"gk-hint\">Masse eingeben, Steine und Zubeh\u00f6r w\u00e4hlen und unverbindliches Angebot anfordern.<\/p>\n\n        <div class=\"gk-inputs\">\n                                    <div class=\"gk-input-box\">\n                <label>H\u00f6he (m)<\/label>\n                <div class=\"gk-stepper\">\n                    <button type=\"button\" data-target=\"gk-hoehe\" data-step=\"-0.04\">\u2212<\/button>\n                    <input type=\"number\" id=\"gk-hoehe\" value=\"1\" step=\"0.04\" min=\"0.2\" max=\"2.52\">\n                    <button type=\"button\" data-target=\"gk-hoehe\" data-step=\"0.04\">+<\/button>\n                <\/div>\n                <span class=\"gk-range-hint\" id=\"gk-range-hoehe\"><\/span>\n            <\/div>\n            <div class=\"gk-input-box\">\n                <label>L\u00e4nge (m)<\/label>\n                <div class=\"gk-stepper\">\n                    <button type=\"button\" data-target=\"gk-laenge\" data-step=\"-0.04\">\u2212<\/button>\n                    <input type=\"number\" id=\"gk-laenge\" value=\"1\" step=\"0.04\" min=\"0.2\" max=\"10\">\n                    <button type=\"button\" data-target=\"gk-laenge\" data-step=\"0.04\">+<\/button>\n                <\/div>\n                <span class=\"gk-range-hint\" id=\"gk-range-laenge\"><\/span>\n            <\/div>\n            <div class=\"gk-input-box\">\n                <label>Tiefe (m)<\/label>\n                <div class=\"gk-stepper\">\n                    <button type=\"button\" data-target=\"gk-tiefe\" data-step=\"-0.04\">\u2212<\/button>\n                    <input type=\"number\" id=\"gk-tiefe\" value=\"0.2\" step=\"0.04\" min=\"0.12\" max=\"1\">\n                    <button type=\"button\" data-target=\"gk-tiefe\" data-step=\"0.04\">+<\/button>\n                <\/div>\n            <\/div>\n            <div class=\"gk-input-box\">\n                <label>Anzahl<\/label>\n                <div class=\"gk-stepper\">\n                    <button type=\"button\" data-target=\"gk-anzahl\" data-step=\"-1\">\u2212<\/button>\n                    <input type=\"number\" id=\"gk-anzahl\" value=\"1\" step=\"1\" min=\"1\">\n                    <button type=\"button\" data-target=\"gk-anzahl\" data-step=\"1\">+<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n        <p id=\"gk-step-error\" style=\"display:none;color:#0066cc;font-size:0.85rem;margin:8px 0 0;\">Deine Masse wurden angepasst.<\/p>\n        <p id=\"gk-regel-hinweis\" class=\"gk-regel-a\"><span class=\"gk-regel-aktiv\">Bereich A aktiv<\/span> L\u00e4nge max. 2.72 m \u00b7 H\u00f6he max. 1.40 m &nbsp;|&nbsp; <span class=\"gk-regel-inaktiv\">Bereich B<\/span> L\u00e4nge max. 1.12 m \u00b7 H\u00f6he max. 2.92 m<\/p>\n\n        <div class=\"gk-main\">\n            <div class=\"gk-left\">\n                <h3>Steine w\u00e4hlen<\/h3>\n                <div class=\"gk-grid\" id=\"gk-steine\">\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3388\"\n                         data-preis=\"1.35\"\n                         data-name=\"Alpenkalk\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Alpenkalk\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Alpenkalk.jpg\"\n                                data-desc=\"K\u00f6rnung 30-60 mm \/ Schwarz\/Weiss \/ ungewaschen\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Alpenkalk-300x300.jpg\" alt=\"\">                        <strong>Alpenkalk<\/strong>\n                        <span class=\"preis\">1.35 CHF\/kg<\/span>\n                    <\/div>\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3380\"\n                         data-preis=\"1.8\"\n                         data-name=\"Carrera Weiss\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Carrera Weiss\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/carrera-weiss.jpg\"\n                                data-desc=\"40-60mm\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/carrera-weiss-300x300.jpg\" alt=\"\">                        <strong>Carrera Weiss<\/strong>\n                        <span class=\"preis\">1.80 CHF\/kg<\/span>\n                    <\/div>\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3382\"\n                         data-preis=\"3.5\"\n                         data-name=\"Glasstein\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Glasstein\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Glassteine.jpg\"\n                                data-desc=\"40-100mm\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Glassteine-300x300.jpg\" alt=\"\">                        <strong>Glasstein<\/strong>\n                        <span class=\"preis\">3.50 CHF\/kg<\/span>\n                    <\/div>\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3377\"\n                         data-preis=\"1\"\n                         data-name=\"Jurakalk\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Jurakalk\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Jurakalk.jpg\"\n                                data-desc=\"40-60 mm \/ ungewaschen, leicht gelblich\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Jurakalk-300x300.jpg\" alt=\"\">                        <strong>Jurakalk<\/strong>\n                        <span class=\"preis\">1.00 CHF\/kg<\/span>\n                    <\/div>\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3383\"\n                         data-preis=\"1.8\"\n                         data-name=\"Schotter Gr\u00fcn\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Schotter Gr\u00fcn\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Schottergruen.jpg\"\n                                data-desc=\"K\u00f6rnung 30-60 mm \/ gewaschen\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Schottergruen-300x300.jpg\" alt=\"\">                        <strong>Schotter Gr\u00fcn<\/strong>\n                        <span class=\"preis\">1.80 CHF\/kg<\/span>\n                    <\/div>\n                                        <div class=\"gk-card gk-stein\"\n                         data-id=\"3385\"\n                         data-preis=\"1.8\"\n                         data-name=\"Schotter Rot\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Schotter Rot\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Schotterrot.jpg\"\n                                data-desc=\"K\u00f6rnung 32-45 mm \/ ungewaschen\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/Schotterrot-300x300.jpg\" alt=\"\">                        <strong>Schotter Rot<\/strong>\n                        <span class=\"preis\">1.80 CHF\/kg<\/span>\n                    <\/div>\n                                                        <\/div>\n\n                <h3>Zubeh\u00f6r (optional)<\/h3>\n                <div class=\"gk-grid\" id=\"gk-zubehoer\">\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3494\"\n                         data-preis=\"27\"\n                         data-name=\"Sicherungsrohr (betonieren) 1500mm\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Sicherungsrohr (betonieren) 1500mm\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_42_02-1030x773.png\"\n                                data-desc=\"Das verzinkte Sicherungsrohr dient zur stabilen Verankerung und als zuverl\u00e4ssige Sturzsicherung f\u00fcr Steink\u00f6rbe. Es wird in ein Betonfundament einbetoniert und im Inneren des Steinkorbes positioniert. Dadurch wird der Steinkorb zuverl\u00e4ssig gegen Umkippen und Verschieben gesichert.\r\n\r\nTechnische Angaben:\r\n\r\nStahlrohr, verzinkt\r\nAussendurchmesser: 42 mm\r\nWandst\u00e4rke: 2,5 mm\r\nzum Einbetonieren in ein Fundament\r\ngeeignet zur Sicherung von Steink\u00f6rben\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_42_02-300x225.png\" alt=\"\">                        <strong>Sicherungsrohr (betonieren) 1500mm<\/strong>\n                        <span class=\"preis\">27.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3497\"\n                         data-preis=\"35\"\n                         data-name=\"Sicherungsrohr (betonieren) 2000mm\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Sicherungsrohr (betonieren) 2000mm\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_42_02-1030x773.png\"\n                                data-desc=\"Das verzinkte Sicherungsrohr dient zur stabilen Verankerung und als zuverl\u00e4ssige Sturzsicherung f\u00fcr Steink\u00f6rbe. Es wird in ein Betonfundament einbetoniert und im Inneren des Steinkorbes positioniert. Dadurch wird der Steinkorb zuverl\u00e4ssig gegen Umkippen und Verschieben gesichert.\r\n\r\nTechnische Angaben:\r\n\r\nStahlrohr, verzinkt\r\nAussendurchmesser: 42 mm\r\nWandst\u00e4rke: 2,5 mm\r\nzum Einbetonieren in ein Fundament\r\ngeeignet zur Sicherung von Steink\u00f6rben\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_42_02-300x225.png\" alt=\"\">                        <strong>Sicherungsrohr (betonieren) 2000mm<\/strong>\n                        <span class=\"preis\">35.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3390\"\n                         data-preis=\"65\"\n                         data-name=\"Sicherungsrohr (schrauben) 1500 mm\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Sicherungsrohr (schrauben) 1500 mm\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_43_22-1030x1030.png\"\n                                data-desc=\"Das verzinkte Sicherungsrohr mit angeschweisster Grundplatte dient zur stabilen Befestigung und als zuverl\u00e4ssige Sturzsicherung f\u00fcr Steink\u00f6rbe. Die Grundplatte wird mit vier Schrauben direkt auf einem bestehenden Betonfundament befestigt.\r\n\r\nDas Sicherungsrohr wird im Inneren des Steinkorbes positioniert und sch\u00fctzt diesen zuverl\u00e4ssig vor dem Umkippen und Verschieben.\r\n\r\nTechnische Angaben:\r\nStahlrohr, verzinkt\r\nAussendurchmesser: 42 mm\r\nWandst\u00e4rke: 2,5 mm\r\nGrundplatte: 120 \u00d7 120 \u00d7 8 mm\r\n4 Befestigungsl\u00f6cher\r\nLochdurchmesser: 13 mm\r\nzum Anschrauben auf ein Betonfundament\r\nBefestigungsmaterial nicht inbegriffen\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_43_22-300x300.png\" alt=\"\">                        <strong>Sicherungsrohr (schrauben) 1500 mm<\/strong>\n                        <span class=\"preis\">65.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3484\"\n                         data-preis=\"78\"\n                         data-name=\"Sicherungsrohr (schrauben) 2000 mm\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Sicherungsrohr (schrauben) 2000 mm\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_43_22-1030x1030.png\"\n                                data-desc=\"Das verzinkte Sicherungsrohr mit angeschweisster Grundplatte dient zur stabilen Befestigung und als zuverl\u00e4ssige Sturzsicherung f\u00fcr Steink\u00f6rbe. Die Grundplatte wird mit vier Schrauben direkt auf einem bestehenden Betonfundament befestigt.\r\n\r\nDas Sicherungsrohr wird im Inneren des Steinkorbes positioniert und sch\u00fctzt diesen zuverl\u00e4ssig vor dem Umkippen und Verschieben.\r\n\r\nTechnische Angaben:\r\nStahlrohr, verzinkt\r\nAussendurchmesser: 42 mm\r\nWandst\u00e4rke: 2,5 mm\r\nGrundplatte: 120 \u00d7 120 \u00d7 8 mm\r\n4 Befestigungsl\u00f6cher\r\nLochdurchmesser: 13 mm\r\nzum Anschrauben auf ein Betonfundament\r\nBefestigungsmaterial nicht inbegriffen\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_43_22-300x300.png\" alt=\"\">                        <strong>Sicherungsrohr (schrauben) 2000 mm<\/strong>\n                        <span class=\"preis\">78.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3501\"\n                         data-preis=\"5\"\n                         data-name=\"Stahlklemmen\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Stahlklemmen\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-14_27_49-1030x1030.png\"\n                                data-desc=\"Die Stahlklemmen dienen zur sicheren Befestigung von separat bestellten Deckgittern auf den Steink\u00f6rben. Mit den Klemmen l\u00e4sst sich das Deckgitter einfach und zuverl\u00e4ssig am Steinkorbgitter befestigen.\r\n\r\nTechnische Angaben:\r\n\r\nMaterial: Stahl\r\nGr\u00f6sse: 15 \u00d7 25 mm\r\ngeeignet f\u00fcr Deckgitter von Steink\u00f6rben\r\neinfache und sichere Montage\r\n\r\nPreis pro Packung mit 20 St\u00fcck\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-14_27_49-300x300.png\" alt=\"\">                        <strong>Stahlklemmen<\/strong>\n                        <span class=\"preis\">5.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                        <div class=\"gk-card gk-zubehoer\"\n                         data-id=\"3499\"\n                         data-preis=\"12\"\n                         data-name=\"Verbindungsplatten\">\n                        <button type=\"button\" class=\"gk-info-btn\"\n                                data-title=\"Verbindungsplatten\"\n                                data-img=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_51_46-1030x824.png\"\n                                data-desc=\"Mit unseren robusten Verbindungsplatten lassen sich zwei Steink\u00f6rbe sicher und b\u00fcndig miteinander verbinden. Die Platten verhindern, dass sich die K\u00f6rbe gegeneinander verschieben, und sorgen f\u00fcr einen sauberen, stabilen \u00dcbergang.\r\n\r\nBestehend aus:\r\n\r\n2 Stahlplatten, 20 \u00d7 3 mm\r\n1 Stahlschraube, M6 \u00d7 30 mm\r\ninklusive Mutter\r\nIdeal f\u00fcr die Montage mehrerer Steink\u00f6rbe in einer durchgehenden Reihe.\">i<\/button>\n                        <img decoding=\"async\" src=\"https:\/\/www.steinkorb-zenter.ch\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-23.-Aug.-2026-13_51_46-300x240.png\" alt=\"\">                        <strong>Verbindungsplatten<\/strong>\n                        <span class=\"preis\">12.00 CHF \/ Stk.<\/span>\n                        <div class=\"gk-zube-qty\" onclick=\"event.stopPropagation();\">\n                            <button type=\"button\" class=\"gk-zube-minus\">\u2212<\/button>\n                            <input type=\"number\" class=\"gk-zube-input\" value=\"0\" min=\"0\" step=\"1\">\n                            <button type=\"button\" class=\"gk-zube-plus\">+<\/button>\n                        <\/div>\n                    <\/div>\n                                                        <\/div>\n            <\/div>\n\n            <div class=\"gk-summary-box\">\n                <h4>Ihre Konfiguration<\/h4>\n                <div class=\"row\"><span>Volumen<\/span><strong id=\"gk-volumen\">0.220 m\u00b3<\/strong><\/div>\n                <div class=\"row\"><span>Ben\u00f6tigte Steine<\/span><strong id=\"gk-benoetigte-steine\">0 kg<\/strong><\/div>\n                <div class=\"row\"><span>Faktor<\/span><strong id=\"gk-faktor\">1700 kg\/m\u00b3<\/strong><\/div>\n                <div class=\"row\"><span>Steine<\/span><strong id=\"gk-steinarten\">keine<\/strong><\/div>\n                <div class=\"row\"><span>Preis Gitter<\/span><strong id=\"gk-preis-korb\">0.00 CHF<\/strong><\/div>\n                <div class=\"row\"><span>Preis Steine<\/span><strong id=\"gk-preis-steine\">0.00 CHF<\/strong><\/div>\n                <div class=\"row\"><span>Preis Zubeh\u00f6r<\/span><strong id=\"gk-preis-zubehoer\">0.00 CHF<\/strong><\/div>\n                <div class=\"total\"><span>Gesamtpreis<\/span><strong id=\"gk-gesamt\">0.00 CHF<\/strong><\/div>\n\n                <form id=\"gk-form\">\n                    <h4>Angebot anfordern<\/h4>\n                    <label>Name *<\/label>\n                    <input type=\"text\" name=\"name\" required>\n\n                    <label>E-Mail *<\/label>\n                    <input type=\"email\" name=\"email\" required>\n\n                    <label>Telefon<\/label>\n                    <input type=\"text\" name=\"telefon\">\n\n                    <label>Adresse<\/label>\n                    <textarea name=\"adresse\" rows=\"2\" placeholder=\"Strasse, PLZ Ort\"><\/textarea>\n\n                    <label>Bemerkung<\/label>\n                    <textarea name=\"bemerkung\" rows=\"2\"><\/textarea>\n\n                    <button type=\"submit\">PDF-Angebot senden<\/button>\n                <\/form>\n                <div id=\"gk-message\"><\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- Modal -->\n    <div class=\"gk-modal\" id=\"gk-modal\">\n        <div class=\"gk-modal-inner\">\n            <button type=\"button\" class=\"gk-modal-close\" id=\"gk-modal-close\">\u00d7<\/button>\n            <img decoding=\"async\" id=\"gk-modal-img\" src=\"\" alt=\"\">\n            <h3 id=\"gk-modal-title\"><\/h3>\n            <p id=\"gk-modal-desc\"><\/p>\n        <\/div>\n    <\/div>\n\n    <script>\n    const gitterP1 = 225;\n    const gitterP2 = 320;\n    const gitterP3 = 348;\n    const gitterP4 = 484;\n    const dichte = 1600;\n    \/\/ Massregeln je H\u00f6henbereich (Meter)\n    const REGEL_A = { hMax: 1.40, lMax: 2.72 }; \/\/ bis 140 cm H\u00f6he\n    const REGEL_B = { hMax: 2.92, lMax: 1.12 }; \/\/ \u00fcber 140 cm H\u00f6he\n    let selectedSteine = [];\n    let selectedZubehoer = [];\n\n    \/\/ Stepper Buttons\n    document.querySelectorAll('#gk-konfigurator .gk-stepper button').forEach(btn => {\n        btn.addEventListener('click', () => {\n            const input = document.getElementById(btn.dataset.target);\n            if (!input) return;\n            const step = parseFloat(btn.dataset.step);\n            let val = parseFloat(input.value) || 0;\n            const stepAbs = Math.abs(step);\n            val = +(val + step).toFixed(2);\n            \/\/ auf Schritt runden\n            if (stepAbs > 0) {\n                val = Math.round(val \/ stepAbs) * stepAbs;\n                val = +val.toFixed(2);\n            }\n            const min = parseFloat(input.min);\n            const max = parseFloat(input.max);\n            if (!isNaN(min)) val = Math.max(min, val);\n            if (!isNaN(max)) val = Math.min(max, val);\n            input.value = val;\n            if (input.id !== 'gk-anzahl') {\n                adjustSteps();\n                applyMassRules();\n            }\n            try { berechnen(); } catch (err) { console.error(\"GK berechnen:\", err); }\n        });\n    });\n\n    \/\/ Info Modal\n    document.querySelectorAll('#gk-konfigurator .gk-info-btn').forEach(btn => {\n        btn.addEventListener('click', (e) => {\n            e.stopPropagation();\n            document.getElementById('gk-modal-title').textContent = btn.dataset.title || '';\n            document.getElementById('gk-modal-desc').textContent = btn.dataset.desc || 'Keine Beschreibung vorhanden.';\n            const img = document.getElementById('gk-modal-img');\n            if (btn.dataset.img) {\n                img.src = btn.dataset.img;\n                img.style.display = 'block';\n            } else {\n                img.style.display = 'none';\n            }\n            document.getElementById('gk-modal').classList.add('open');\n        });\n    });\n    const gkModalClose = document.getElementById('gk-modal-close');\n    const gkModal = document.getElementById('gk-modal');\n    if (gkModalClose) gkModalClose.addEventListener('click', () => {\n        if (gkModal) gkModal.classList.remove('open');\n    });\n    if (gkModal) gkModal.addEventListener('click', (e) => {\n        if (e.target.id === 'gk-modal') gkModal.classList.remove('open');\n    });\n\n    \/\/ Auswahl Steine (mehrere m\u00f6glich)\n    document.querySelectorAll('#gk-konfigurator .gk-stein').forEach(el => {\n        el.addEventListener('click', () => {\n            const id = el.dataset.id;\n            const idx = selectedSteine.findIndex(s => s.id === id);\n            if (idx > -1) {\n                selectedSteine.splice(idx, 1);\n                el.classList.remove('selected');\n            } else {\n                selectedSteine.push({\n                    id: id,\n                    name: el.dataset.name,\n                    preis: parseFloat(el.dataset.preis)\n                });\n                el.classList.add('selected');\n            }\n            berechnen();\n        });\n    });\n\n        function syncZubehoerFromDom() {\n        selectedZubehoer = [];\n        document.querySelectorAll('#gk-konfigurator .gk-zubehoer').forEach(el => {\n            const input = el.querySelector('.gk-zube-input');\n            const qty = parseInt(input && input.value, 10) || 0;\n            if (qty > 0) {\n                el.classList.add('selected');\n                selectedZubehoer.push({\n                    id: el.dataset.id,\n                    name: el.dataset.name,\n                    preis: parseFloat(el.dataset.preis) || 0,\n                    qty: qty\n                });\n            } else {\n                el.classList.remove('selected');\n            }\n        });\n        berechnen();\n    }\n    document.querySelectorAll('#gk-konfigurator .gk-zubehoer').forEach(el => {\n        const input = el.querySelector('.gk-zube-input');\n        const minus = el.querySelector('.gk-zube-minus');\n        const plus = el.querySelector('.gk-zube-plus');\n        if (minus) minus.addEventListener('click', (e) => {\n            e.stopPropagation();\n            let v = parseInt(input.value, 10) || 0;\n            input.value = Math.max(0, v - 1);\n            syncZubehoerFromDom();\n        });\n        if (plus) plus.addEventListener('click', (e) => {\n            e.stopPropagation();\n            let v = parseInt(input.value, 10) || 0;\n            input.value = v + 1;\n            syncZubehoerFromDom();\n        });\n        if (input) {\n            input.addEventListener('click', e => e.stopPropagation());\n            input.addEventListener('change', () => {\n                let v = parseInt(input.value, 10);\n                if (isNaN(v) || v < 0) v = 0;\n                input.value = v;\n                syncZubehoerFromDom();\n            });\n        }\n        el.addEventListener('click', (e) => {\n            if (!input) return;\n            if (e.target.closest('.gk-zube-qty') || e.target.closest('.gk-info-btn')) return;\n            let v = parseInt(input.value, 10) || 0;\n            input.value = v > 0 ? 0 : 1;\n            syncZubehoerFromDom();\n        });\n    });\n\n    function snap04(v) {\n        const n = parseFloat(v);\n        if (isNaN(n)) return v;\n        const cm = Math.round(n * 100);\n        const snapped = Math.round(cm \/ 4) * 4;\n        return +(snapped \/ 100).toFixed(2);\n    }\n    function adjustSteps() {\n        let changed = false;\n        ['gk-laenge','gk-hoehe','gk-tiefe'].forEach(id => {\n            const el = document.getElementById(id);\n            if (!el) return;\n            const orig = parseFloat(el.value);\n            let val = snap04(el.value);\n            const min = parseFloat(el.min); const max = parseFloat(el.max);\n            if (!isNaN(min)) val = Math.max(min, val);\n            if (!isNaN(max)) val = Math.min(max, val);\n            val = snap04(val);\n            if (orig !== val) changed = true;\n            el.value = val.toFixed(2);\n        });\n        const info = document.getElementById('gk-step-error');\n        if (info) {\n            info.style.display = changed ? 'block' : 'none';\n            info.style.color = '#0066cc';\n            info.textContent = 'Deine Masse wurden angepasst.';\n        }\n        return changed;\n    }\n    function getRegel(h) {\n        \/\/ bis 1.40 m H\u00f6he: L max 2.72 \/ H max 1.40\n        \/\/ \u00fcber 1.40 m: L max 1.12 \/ H max 2.92\n        if (h <= 1.40) return { hMax: 1.40, lMax: 2.72, label: 'Bereich A (H\u00f6he bis 1.40 m): L\u00e4nge max. 2.72 m' };\n        return { hMax: 2.92, lMax: 1.12, label: 'Bereich B (H\u00f6he \u00fcber 1.40 m): L\u00e4nge max. 1.12 m, H\u00f6he max. 2.92 m' };\n    }\n    function updateRegelHinweis() {\n        const hEl = document.getElementById('gk-hoehe');\n        const lEl = document.getElementById('gk-laenge');\n        const h = parseFloat(hEl && hEl.value) || 0;\n        const l = parseFloat(lEl && lEl.value) || 0;\n        const hMin = parseFloat(hEl && hEl.min) || 0.2;\n        const lMin = parseFloat(lEl && lEl.min) || 0.2;\n        const el = document.getElementById('gk-regel-hinweis');\n        const rangeL = document.getElementById('gk-range-laenge');\n        const rangeH = document.getElementById('gk-range-hoehe');\n        const r = getRegel(h);\n        if (rangeL) rangeL.textContent = 'm\u00f6glich: ' + lMin.toFixed(2) + ' \u2013 ' + r.lMax.toFixed(2) + ' m';\n        const hMaxMoeglich = (l > 1.12) ? 1.40 : 2.92;\n        if (rangeH) rangeH.textContent = 'm\u00f6glich: ' + hMin.toFixed(2) + ' \u2013 ' + hMaxMoeglich.toFixed(2) + ' m';\n        if (!el) return;\n        if (h <= 1.40) {\n            el.innerHTML = '<span class=\"gk-regel-aktiv\">Bereich A aktiv<\/span> L\u00e4nge max. 2.72 m \u00b7 H\u00f6he max. 1.40 m &nbsp;|&nbsp; <span class=\"gk-regel-inaktiv\">Bereich B<\/span> L\u00e4nge max. 1.12 m \u00b7 H\u00f6he max. 2.92 m';\n            el.className = 'gk-regel-a';\n        } else {\n            el.innerHTML = '<span class=\"gk-regel-inaktiv\">Bereich A<\/span> L\u00e4nge max. 2.72 m \u00b7 H\u00f6he max. 1.40 m &nbsp;|&nbsp; <span class=\"gk-regel-aktiv\">Bereich B aktiv<\/span> L\u00e4nge max. 1.12 m \u00b7 H\u00f6he max. 2.92 m';\n            el.className = 'gk-regel-b';\n        }\n    }\n    function applyMassRules() {\n        const hEl = document.getElementById('gk-hoehe');\n        const lEl = document.getElementById('gk-laenge');\n        if (!hEl || !lEl) return false;\n        let h = snap04(parseFloat(hEl.value) || 0);\n        let l = snap04(parseFloat(lEl.value) || 0);\n        const hMin = parseFloat(hEl.min) || 0.2;\n        const lMin = parseFloat(lEl.min) || 0.2;\n        \/\/ Max immer global erlauben beim Tippen; hier nur nach Eingabe begrenzen\n        const globalHMax = 2.92;\n        const globalLMax = 2.72;\n        hEl.max = globalHMax;\n        lEl.max = globalLMax;\n        let changed = false;\n        if (h < hMin) { h = hMin; changed = true; }\n        if (l < lMin) { l = lMin; changed = true; }\n        if (h > globalHMax) { h = globalHMax; changed = true; }\n        if (l > globalLMax) { l = globalLMax; changed = true; }\n        \/\/ Bereich anwenden\n        const r = getRegel(h);\n        if (h > r.hMax) { h = r.hMax; changed = true; }\n        if (l > r.lMax) { l = r.lMax; changed = true; }\n        \/\/ Nach H\u00f6henwechsel Regel nochmals (falls H\u00f6he korrigiert)\n        const r2 = getRegel(h);\n        if (l > r2.lMax) { l = r2.lMax; changed = true; }\n        h = snap04(h); l = snap04(l);\n        if (parseFloat(hEl.value) !== h || parseFloat(lEl.value) !== l) changed = true;\n        hEl.value = h.toFixed(2);\n        lEl.value = l.toFixed(2);\n        const info = document.getElementById('gk-step-error');\n        if (info) {\n            if (changed) {\n                info.style.display = 'block';\n                info.style.color = '#0066cc';\n                info.textContent = 'Deine Masse wurden angepasst.';\n            }\n        }\n        updateRegelHinweis();\n        return changed;\n    }\n    function berechnen() {\n        const lEl = document.getElementById('gk-laenge');\n        const hEl = document.getElementById('gk-hoehe');\n        const tEl = document.getElementById('gk-tiefe');\n        const aEl = document.getElementById('gk-anzahl');\n        if (!lEl || !hEl || !tEl) return;\n        const l = parseFloat(lEl.value) || 0;\n        const h = parseFloat(hEl.value) || 0;\n        const t = parseFloat(tEl.value) || 0;\n        const a = parseInt(aEl && aEl.value, 10) || 1;\n\n        const volumen = l * h * t * a;\n        const gewicht = volumen * dichte;\n\n        const front = l * h;\n        let gitterProKorb = gitterP4;\n        if (front <= 1.0) gitterProKorb = gitterP1;\n        else if (front <= 1.5) gitterProKorb = gitterP2;\n        else if (front <= 3.0) gitterProKorb = gitterP3;\n        const tiefeBasis = 0.20;\n        let tiefeSteps = Math.round((t - tiefeBasis) \/ 0.04);\n        if (tiefeSteps < 0) tiefeSteps = 0;\n        const tiefeFaktor = 1 + tiefeSteps * 0.04;\n        const preisGitter = gitterProKorb * tiefeFaktor * a;\n\n        let maxPreis = 0;\n        if (selectedSteine.length > 0) {\n            maxPreis = Math.max.apply(null, selectedSteine.map(function(s) { return s.preis; }));\n        }\n        const preisSteine = gewicht * maxPreis;\n        const preisZubehoer = selectedZubehoer.reduce(function(sum, z) {\n            return sum + z.preis * (z.qty || 1);\n        }, 0);\n        const gesamt = preisGitter + preisSteine + preisZubehoer;\n\n        function setTxt(id, val) {\n            const n = document.getElementById(id);\n            if (n) n.textContent = val;\n        }\n        setTxt('gk-volumen', volumen.toFixed(3) + ' m\u00b3');\n        setTxt('gk-benoetigte-steine', Math.round(gewicht) + ' kg');\n        setTxt('gk-faktor', dichte + ' kg\/m\u00b3');\n        setTxt('gk-steinarten', selectedSteine.length === 0\n            ? 'keine'\n            : selectedSteine.length + ' Steinart' + (selectedSteine.length > 1 ? 'en' : '') + ' ausgew\u00e4hlt');\n        setTxt('gk-preis-korb', preisGitter.toFixed(2) + ' CHF');\n        setTxt('gk-preis-steine', preisSteine.toFixed(2) + ' CHF');\n        setTxt('gk-preis-zubehoer', preisZubehoer.toFixed(2) + ' CHF');\n        setTxt('gk-gesamt', gesamt.toFixed(2) + ' CHF');\n    }\n\n    ['gk-laenge','gk-hoehe','gk-tiefe','gk-anzahl'].forEach(function(id) {\n        const el = document.getElementById(id);\n        if (!el) return;\n        el.addEventListener('input', function() {\n            updateRegelHinweis();\n            berechnen();\n        });\n        if (id !== 'gk-anzahl') {\n            el.addEventListener('change', function() {\n                adjustSteps();\n                applyMassRules();\n                berechnen();\n            });\n            el.addEventListener('blur', function() {\n                adjustSteps();\n                applyMassRules();\n                berechnen();\n            });\n        }\n    });\n\n    (function(){\n        const hEl = document.getElementById('gk-hoehe');\n        const lEl = document.getElementById('gk-laenge');\n        const tEl = document.getElementById('gk-tiefe');\n        if (hEl) hEl.max = 2.92;\n        if (lEl) lEl.max = 2.72;\n        \/\/ Werte vom Schnellrechner (URL-Parameter) \u00fcbernehmen\n        try {\n            const params = new URLSearchParams(window.location.search);\n            const map = {\n                'gk_hoehe': hEl,\n                'gk_laenge': lEl,\n                'gk_tiefe': tEl\n            };\n            Object.keys(map).forEach(function(key) {\n                const el = map[key];\n                if (!el) return;\n                const raw = params.get(key);\n                if (raw === null || raw === '') return;\n                let val = parseFloat(String(raw).replace(',', '.'));\n                if (isNaN(val)) return;\n                el.value = val;\n            });\n            adjustSteps();\n            applyMassRules();\n        } catch (e) {}\n        updateRegelHinweis();\n    })();\n\n    const gkForm = document.getElementById('gk-form');\n    if (gkForm) {\n        gkForm.addEventListener('submit', function(e) {\n            e.preventDefault();\n            adjustSteps();\n            applyMassRules();\n            berechnen();\n            const btn = this.querySelector('button[type=submit]');\n            if (btn) {\n                btn.disabled = true;\n                btn.textContent = 'Wird gesendet...';\n            }\n            const formData = new FormData(this);\n            formData.append('action', 'gk_send_angebot');\n            formData.append('laenge', document.getElementById('gk-laenge').value);\n            formData.append('hoehe', document.getElementById('gk-hoehe').value);\n            formData.append('tiefe', document.getElementById('gk-tiefe').value);\n            formData.append('anzahl', document.getElementById('gk-anzahl').value);\n            formData.append('stein', selectedSteine.map(function(s){ return s.name; }).join(', ') || 'keine');\n            formData.append('zubehoer', selectedZubehoer.map(function(z){ return z.qty + 'x ' + z.name; }).join(', ') || 'keins');\n            formData.append('volumen', (document.getElementById('gk-volumen') || {}).textContent || '');\n            formData.append('gewicht', (document.getElementById('gk-benoetigte-steine') || {}).textContent || '');\n            formData.append('faktor', (document.getElementById('gk-faktor') || {}).textContent || '');\n            formData.append('preis_korb', (document.getElementById('gk-preis-korb') || {}).textContent || '');\n            formData.append('preis_steine', (document.getElementById('gk-preis-steine') || {}).textContent || '');\n            formData.append('preis_zubehoer', (document.getElementById('gk-preis-zubehoer') || {}).textContent || '');\n            formData.append('gesamt', (document.getElementById('gk-gesamt') || {}).textContent || '');\n\n            fetch(\"https:\/\/www.steinkorb-zenter.ch\/wp-admin\/admin-ajax.php\", {\n                method: 'POST',\n                body: formData\n            })\n            .then(function(r) { return r.json(); })\n            .then(function(data) {\n                const msg = document.getElementById('gk-message');\n                if (msg) {\n                    msg.innerHTML = data.success\n                        ? '<span style=\"color:#27ae60;\">Ihr unverbindliches Angebot wurde per Mail gesendet (PDF angeh\u00e4ngt).<\/span>'\n                        : '<span style=\"color:#c0392b;\">Fehler beim Senden.<\/span>';\n                }\n                if (btn) {\n                    btn.disabled = false;\n                    btn.textContent = 'PDF-Angebot per Mail senden';\n                }\n            })\n            .catch(function() {\n                const msg = document.getElementById('gk-message');\n                if (msg) msg.innerHTML = '<span style=\"color:#c0392b;\">Fehler beim Senden.<\/span>';\n                if (btn) {\n                    btn.disabled = false;\n                    btn.textContent = 'PDF-Angebot per Mail senden';\n                }\n            });\n        });\n    }\n\n    try { berechnen(); } catch (err) { console.error('GK berechnen:', err); }\n    <\/script>\n    \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":{"footnotes":""},"class_list":["post-1628","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/pages\/1628","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1628"}],"version-history":[{"count":4,"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/pages\/1628\/revisions"}],"predecessor-version":[{"id":3331,"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=\/wp\/v2\/pages\/1628\/revisions\/3331"}],"wp:attachment":[{"href":"https:\/\/www.steinkorb-zenter.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1628"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}