{"id":2472,"date":"2025-08-06T23:17:37","date_gmt":"2025-08-06T20:17:37","guid":{"rendered":"https:\/\/azgruppe.eu\/?page_id=2472"},"modified":"2025-08-07T01:30:04","modified_gmt":"2025-08-06T22:30:04","slug":"angebot-umzug-transport","status":"publish","type":"page","link":"https:\/\/azgruppe.eu\/tr\/angebot-umzug-transport\/","title":{"rendered":"Angebot Umzug &amp; Transport"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"2472\" class=\"elementor elementor-2472\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e159dee elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"e159dee\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-eaf006d\" data-id=\"eaf006d\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-3e72035 elementor-widget elementor-widget-html\" data-id=\"3e72035\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"de\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Umzug & Transport Anfrageformular<\/title>\n    <style>\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n\n        body {\n            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n            background-color: #f5f5f5;\n            padding: 0px;\n            line-height: 1.6;\n        }\n\n        .form-container {\n            max-width: 1000px;\n            margin: 0 auto;\n            background: white;\n            border-radius: 12px;\n            padding: 40px;\n            box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n        }\n\n        .form-section {\n            margin-bottom: 40px;\n        }\n\n        .section-title {\n            font-size: 24px;\n            font-weight: 600;\n            color: #333;\n            margin-bottom: 20px;\n            padding-bottom: 10px;\n            border-bottom: 2px solid #e0e0e0;\n        }\n\n        .form-row {\n            display: flex;\n            gap: 20px;\n            margin-bottom: 20px;\n        }\n\n        .form-group {\n            flex: 1;\n            margin-bottom: 20px;\n        }\n\n        .form-group.full-width {\n            flex: 1 1 100%;\n        }\n\n        label {\n            display: block;\n            margin-bottom: 8px;\n            font-weight: 500;\n            color: #555;\n            font-size: 14px;\n        }\n\n        .required {\n            color: #e74c3c;\n        }\n\n        input[type=\"text\"],\n        input[type=\"email\"],\n        input[type=\"tel\"],\n        input[type=\"number\"],\n        input[type=\"date\"],\n        select,\n        textarea {\n            width: 100%;\n            padding: 12px 16px;\n            border: 2px solid #e0e0e0;\n            border-radius: 8px;\n            font-size: 16px;\n            transition: all 0.3s ease;\n            background-color: #fff;\n        }\n\n        input[type=\"text\"]:focus,\n        input[type=\"email\"]:focus,\n        input[type=\"tel\"]:focus,\n        input[type=\"number\"]:focus,\n        input[type=\"date\"]:focus,\n        select:focus,\n        textarea:focus {\n            outline: none;\n            border-color: #e53e3e;\n            box-shadow: 0 0 0 3px rgba(229, 62, 62, 0.1);\n        }\n\n        select {\n            appearance: none;\n            background-image: url(\"data:image\/svg+xml,%3csvg xmlns='http:\/\/www.w3.org\/2000\/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'\/%3e%3c\/svg%3e\");\n            background-position: right 12px center;\n            background-repeat: no-repeat;\n            background-size: 16px;\n            padding-right: 40px;\n        }\n\n        textarea {\n            min-height: 120px;\n            resize: vertical;\n        }\n\n        .checkbox-group {\n            display: flex;\n            gap: 20px;\n            margin-bottom: 20px;\n            flex-wrap: wrap;\n        }\n\n        .checkbox-item {\n            display: flex;\n            align-items: center;\n            gap: 8px;\n        }\n\n        .checkbox-item input[type=\"checkbox\"],\n        .checkbox-item input[type=\"radio\"] {\n            width: 18px;\n            height: 18px;\n            accent-color: #e53e3e;\n        }\n\n        .checkbox-item label {\n            margin-bottom: 0;\n            font-weight: normal;\n            cursor: pointer;\n        }\n\n        .file-upload {\n            position: relative;\n            display: inline-block;\n            margin-bottom: 15px;\n        }\n\n        .file-upload input[type=\"file\"] {\n            position: absolute;\n            opacity: 0;\n            width: 0;\n            height: 0;\n        }\n\n        .file-upload-label {\n            display: inline-block;\n            padding: 12px 20px;\n            background-color: #f8f9fa;\n            border: 2px dashed #dee2e6;\n            border-radius: 8px;\n            cursor: pointer;\n            transition: all 0.3s ease;\n            text-align: center;\n            min-width: 200px;\n        }\n\n        .file-upload-label:hover {\n            background-color: #e9ecef;\n            border-color: #e53e3e;\n        }\n\n        .privacy-checkbox {\n            margin: 30px 0;\n            padding: 20px;\n            background-color: #f8f9fa;\n            border-radius: 8px;\n            border-left: 4px solid #e53e3e;\n        }\n\n        .privacy-checkbox input[type=\"checkbox\"] {\n            margin-right: 12px;\n            width: 18px;\n            height: 18px;\n            accent-color: #e53e3e;\n        }\n\n        .privacy-text {\n            font-size: 14px;\n            line-height: 1.5;\n            color: #666;\n        }\n\n        .privacy-link {\n            color: #e74c3c;\n            text-decoration: none;\n            font-weight: 500;\n        }\n\n        .privacy-link:hover {\n            text-decoration: underline;\n        }\n\n        .submit-btn {\n            background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);\n            color: white;\n            padding: 15px 40px;\n            border: none;\n            border-radius: 8px;\n            font-size: 16px;\n            font-weight: 600;\n            cursor: pointer;\n            transition: all 0.3s ease;\n            text-transform: uppercase;\n            letter-spacing: 0.5px;\n            position: relative;\n        }\n\n        .submit-btn:hover {\n            background: linear-gradient(135deg, #c0392b 0%, #a93226 100%);\n            transform: translateY(-2px);\n            box-shadow: 0 8px 25px rgba(231, 76, 60, 0.3);\n        }\n\n        .submit-btn:active {\n            transform: translateY(0);\n        }\n\n        .submit-btn:disabled {\n            background: #ccc;\n            cursor: not-allowed;\n            transform: none;\n        }\n\n        .loading {\n            display: none;\n            position: absolute;\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n        }\n\n        .spinner {\n            width: 20px;\n            height: 20px;\n            border: 2px solid #ffffff;\n            border-top: 2px solid transparent;\n            border-radius: 50%;\n            animation: spin 1s linear infinite;\n        }\n\n        @keyframes spin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n\n        .success-message {\n            background: linear-gradient(135deg, #27ae60, #2ecc71);\n            color: white;\n            padding: 20px;\n            border-radius: 8px;\n            text-align: center;\n            margin: 20px 0;\n            display: none;\n        }\n\n        .error-message {\n            background: linear-gradient(135deg, #e74c3c, #c0392b);\n            color: white;\n            padding: 20px;\n            border-radius: 8px;\n            text-align: center;\n            margin: 20px 0;\n            display: none;\n        }\n\n        @media (max-width: 768px) {\n            .form-container {\n                padding: 20px;\n                margin: 10px;\n            }\n            \n            .form-row {\n                flex-direction: column;\n                gap: 0;\n            }\n            \n            .checkbox-group {\n                flex-direction: column;\n                gap: 10px;\n            }\n        }\n    <\/style>\n<\/head>\n<body>\n    <div class=\"form-container\">\n        <div class=\"success-message\" id=\"successMessage\">\n            \u2705 <strong>Vielen Dank!<\/strong> Ihre Anfrage wurde erfolgreich gesendet. Wir werden uns so schnell wie m\u00f6glich bei Ihnen melden.\n        <\/div>\n        \n        <div class=\"error-message\" id=\"errorMessage\">\n            \u274c <strong>Fehler!<\/strong> Beim Senden ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut.\n        <\/div>\n\n        <form id=\"umzugForm\" action=\"\">\n            <!-- Umzug Details -->\n            <div class=\"form-section\">\n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"location_from\">Von (Stadt) <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"location_from\" name=\"location_from\" required placeholder=\"z.B. Frankfurt\">\n                    <\/div>\n                    <div class=\"form-group\">\n                        <label for=\"location_to\">Nach (Stadt) <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"location_to\" name=\"location_to\" required placeholder=\"z.B. M\u00fcnchen\">\n                    <\/div>\n                <\/div>\n                \n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"move_date\">Gew\u00fcnschter Umzugstermin <span class=\"required\">*<\/span><\/label>\n                        <input type=\"date\" id=\"move_date\" name=\"move_date\" required>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Kontaktdaten -->\n            <div class=\"form-section\">\n                <h4 class=\"section-title\">Kontaktdaten<\/h4>\n                \n                <!-- Kundentyp -->\n                <div class=\"checkbox-group\">\n                    <div class=\"checkbox-item\">\n                        <input type=\"radio\" id=\"company\" name=\"customer_type\" value=\"company\">\n                        <label for=\"company\">Firma<\/label>\n                    <\/div>\n                    <div class=\"checkbox-item\">\n                        <input type=\"radio\" id=\"individual_male\" name=\"customer_type\" value=\"individual_male\">\n                        <label for=\"individual_male\">Herr<\/label>\n                    <\/div>\n                    <div class=\"checkbox-item\">\n                        <input type=\"radio\" id=\"individual_female\" name=\"customer_type\" value=\"individual_female\">\n                        <label for=\"individual_female\">Frau<\/label>\n                    <\/div>\n                    <div class=\"checkbox-item\">\n                        <input type=\"radio\" id=\"diverse\" name=\"customer_type\" value=\"diverse\">\n                        <label for=\"diverse\">Divers<\/label>\n                    <\/div>\n                <\/div>\n\n                <!-- Vor- und Nachname -->\n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"firstname\">Vorname <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"firstname\" name=\"firstname\" required>\n                    <\/div>\n                    <div class=\"form-group\">\n                        <label for=\"lastname\">Nachname <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"lastname\" name=\"lastname\" required>\n                    <\/div>\n                <\/div>\n\n                <!-- E-Mail und Telefon -->\n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"email\">E-Mail-Adresse <span class=\"required\">*<\/span><\/label>\n                        <input type=\"email\" id=\"email\" name=\"email\" required>\n                    <\/div>\n                    <div class=\"form-group\">\n                        <label for=\"phone\">Telefonnummer <span class=\"required\">*<\/span><\/label>\n                        <input type=\"tel\" id=\"phone\" name=\"phone\" required pattern=\"[0-9+\\-\\s()]*\" title=\"Nur Zahlen, +, -, Leerzeichen und Klammern sind erlaubt\">\n                    <\/div>\n                <\/div>\n\n                <!-- PLZ und Ort -->\n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"postal_code\">PLZ <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"postal_code\" name=\"postal_code\" required pattern=\"[0-9]*\" title=\"Nur Zahlen sind erlaubt\">\n                    <\/div>\n                    <div class=\"form-group\">\n                        <label for=\"city\">Ort <span class=\"required\">*<\/span><\/label>\n                        <input type=\"text\" id=\"city\" name=\"city\" required>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Zus\u00e4tzliche Informationen -->\n            <div class=\"form-section\">\n                <div class=\"form-group full-width\">\n                    <label for=\"message\">Ihre Nachricht<\/label>\n                    <textarea id=\"message\" name=\"message\" placeholder=\"Beschreiben Sie Ihren Umzug detailliert. Gibt es besondere Herausforderungen oder W\u00fcnsche?\"><\/textarea>\n                <\/div>\n            <\/div>\n\n            <!-- Datenschutz Einverst\u00e4ndnis -->\n            <div class=\"privacy-checkbox\">\n                <div class=\"checkbox-item\">\n                    <input type=\"checkbox\" id=\"privacy\" name=\"privacy\" required>\n                    <label for=\"privacy\" class=\"privacy-text\">\n                        <span class=\"required\">*<\/span> Ja, ich habe die <a href=\"#\" class=\"privacy-link\">Datenschutzerkl\u00e4rung<\/a> zur Kenntnis genommen und bin damit einverstanden, dass die von mir angegebenen Daten elektronisch erhoben und gespeichert werden. Meine Daten werden dabei nur streng zweckgebunden zur Bearbeitung und Beantwortung meiner Anfrage benutzt. Mit dem Absenden des Kontaktformulars erkl\u00e4re ich mich mit der Verarbeitung einverstanden.\n                    <\/label>\n                <\/div>\n            <\/div>\n\n            <!-- Senden Button -->\n            <div class=\"form-group\">\n                <button type=\"submit\" class=\"submit-btn\" id=\"submitBtn\">\n                    <span id=\"btnText\">Kostenvoranschlag Anfordern<\/span>\n                    <div class=\"loading\" id=\"loading\">\n                        <div class=\"spinner\"><\/div>\n                    <\/div>\n                <\/button>\n            <\/div>\n        <input type=\"hidden\" name=\"trp-form-language\" value=\"tr\"\/><\/form>\n    <\/div>\n\n    <script>\n        \/\/ Formular senden\n        document.getElementById('umzugForm').addEventListener('submit', function(e) {\n            e.preventDefault();\n            \n            \/\/ Loading state\n            const submitBtn = document.getElementById('submitBtn');\n            const btnText = document.getElementById('btnText');\n            const loading = document.getElementById('loading');\n            const successMessage = document.getElementById('successMessage');\n            const errorMessage = document.getElementById('errorMessage');\n            \n            \/\/ Hide previous messages\n            successMessage.style.display = 'none';\n            errorMessage.style.display = 'none';\n            \n            \/\/ Pflichtfelder pr\u00fcfen\n            const requiredFields = this.querySelectorAll('[required]');\n            let isValid = true;\n            \n            requiredFields.forEach(field => {\n                if (!field.value.trim()) {\n                    field.style.borderColor = '#e74c3c';\n                    isValid = false;\n                } else {\n                    field.style.borderColor = '#e0e0e0';\n                }\n            });\n            \n            if (!isValid) {\n                errorMessage.innerHTML = '\u274c <strong>Fehler!<\/strong> Bitte f\u00fcllen Sie alle Pflichtfelder aus.';\n                errorMessage.style.display = 'block';\n                errorMessage.scrollIntoView({ behavior: 'smooth', block: 'center' });\n                return;\n            }\n            \n            \/\/ Show loading\n            btnText.style.display = 'none';\n            loading.style.display = 'block';\n            submitBtn.disabled = true;\n            \n            \/\/ Prepare form data\n            const formData = new FormData(this);\n            formData.append('action', 'submit_umzug_form');\n            \n            \/\/ Get nonce from WordPress\n            const nonce = document.querySelector('meta[name=\"umzug-nonce\"]')?.getAttribute('content') || '';\n            if (!nonce) {\n                errorMessage.innerHTML = '\u274c <strong>Fehler!<\/strong> Sicherheitsfehler. Bitte laden Sie die Seite neu.';\n                errorMessage.style.display = 'block';\n                return;\n            }\n            formData.append('nonce', nonce);\n            \n            \/\/ Send to WordPress\n            fetch('\/wp-admin\/admin-ajax.php', {\n                method: 'POST',\n                body: formData\n            })\n            .then(response => response.json())\n            .then(data => {\n                \/\/ Hide loading\n                btnText.style.display = 'inline';\n                loading.style.display = 'none';\n                submitBtn.disabled = false;\n                \n                if (data.success) {\n                    successMessage.style.display = 'block';\n                    this.reset(); \/\/ Clear form\n                    \n                    \/\/ Scroll to success message\n                    successMessage.scrollIntoView({ \n                        behavior: 'smooth', \n                        block: 'center' \n                    });\n                } else {\n                    errorMessage.innerHTML = `\u274c <strong>Fehler!<\/strong> ${data.data || 'Beim Senden ist ein Fehler aufgetreten.'}`;\n                    errorMessage.style.display = 'block';\n                    errorMessage.scrollIntoView({ behavior: 'smooth', block: 'center' });\n                }\n            })\n            .catch(error => {\n                console.error('Error:', error);\n                \n                \/\/ Hide loading\n                btnText.style.display = 'inline';\n                loading.style.display = 'none';\n                submitBtn.disabled = false;\n                \n                errorMessage.innerHTML = '\u274c <strong>Fehler!<\/strong> Beim Senden ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut.';\n                errorMessage.style.display = 'block';\n                errorMessage.scrollIntoView({ behavior: 'smooth', block: 'center' });\n            });\n        });\n\n        \/\/ Real-time form validation\n        document.querySelectorAll('input, select, textarea').forEach(field => {\n            field.addEventListener('blur', function() {\n                if (this.hasAttribute('required') && !this.value.trim()) {\n                    this.style.borderColor = '#e74c3c';\n                } else {\n                    this.style.borderColor = '#e0e0e0';\n                }\n            });\n        });\n\n        \/\/ Set minimum date to today\n        document.getElementById('move_date').min = new Date().toISOString().split('T')[0];\n    <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Umzug &#038; Transport Anfrageformular \u2705 Vielen Dank! Ihre Anfrage wurde erfolgreich gesendet. Wir werden uns so schnell wie m\u00f6glich bei Ihnen melden. \u274c Fehler! Beim Senden ist ein Fehler aufgetreten. Bitte versuchen Sie es erneut. Von (Stadt) * Nach (Stadt) * Gew\u00fcnschter Umzugstermin * Kontaktdaten Firma Herr Frau Divers Vorname * Nachname * E-Mail-Adresse * [&hellip;]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2472","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/pages\/2472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/comments?post=2472"}],"version-history":[{"count":7,"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/pages\/2472\/revisions"}],"predecessor-version":[{"id":2484,"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/pages\/2472\/revisions\/2484"}],"wp:attachment":[{"href":"https:\/\/azgruppe.eu\/tr\/wp-json\/wp\/v2\/media?parent=2472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}