{"id":351,"date":"2021-01-08T14:12:28","date_gmt":"2021-01-08T12:12:28","guid":{"rendered":"https:\/\/rudolfkaspernaruski.com\/?page_id=351"},"modified":"2025-07-02T08:40:47","modified_gmt":"2025-07-02T05:40:47","slug":"vota-uhendust","status":"publish","type":"page","link":"https:\/\/rudolfkaspernaruski.com\/en\/vota-uhendust\/","title":{"rendered":"Contact me"},"content":{"rendered":"\n<p><br><br><br><br><br><!-- Tailwind CSS CDN --><br><script src=\"https:\/\/cdn.tailwindcss.com\"><\/script><br><!-- Google Fonts: Inter -->  <style>\n        body {<br \/>\n            font-family: 'Inter', sans-serif;<br \/>\n            \/* Keep theme's background *\/<br \/>\n        }<br \/>\n        \/* Custom styles for smoother transitions *\/<br \/>\n        .transition-all {<br \/>\n            transition-property: all;<br \/>\n            transition-duration: 300ms;<br \/>\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);<br \/>\n        }<br \/>\n        \/* Removed custom background for this section to allow theme's background to show through *\/<br \/>\n        \/* Specific input styling to match theme *\/<br \/>\n        input[type=\"text\"],<br \/>\n        input[type=\"email\"],<br \/>\n        input[type=\"tel\"],<br \/>\n        textarea {<br \/>\n            outline: none;<br \/>\n            box-shadow: none;<br \/>\n            transition: border-color 0.3s, box-shadow 0.3s;<br \/>\n        }<br \/>\n        input[type=\"text\"]:focus,<br \/>\n        input[type=\"email\"]:focus,<br \/>\n        input[type=\"tel\"]:focus,<br \/>\n        textarea:focus {<br \/>\n            border-color: #D4B068; \/* Accent color on focus *\/<br \/>\n            box-shadow: 0 0 0 2px rgba(212, 176, 104, 0.3); \/* Soft accent glow *\/<br \/>\n        }<br \/>\n        \/* Inner container to restore desired padding and max-width for content *\/<br \/>\n        .contact-content-wrapper {<br \/>\n            max-width: 1200px; \/* Adjust this value to your preferred maximum content width for the form box *\/<br \/>\n            width: 100%;<br \/>\n            margin-left: auto;<br \/>\n            margin-right: auto;<br \/>\n            padding-left: 1rem; \/* Restore horizontal padding within the content *\/<br \/>\n            padding-right: 1rem; \/* Restore horizontal padding within the content *\/<br \/>\n            box-sizing: border-box; \/* Include padding in the width calculation *\/<br \/>\n        }<br \/>\n    <\/style><\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<p><!-- This section will now adapt to your theme's existing background --><\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>V\u00f5ta \u00dchendust<\/title>\n    <!-- Tailwind CSS CDN -->\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <!-- Google Fonts: Inter -->\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n    <style>\n        body {\n            font-family: 'Inter', sans-serif;\n            \/* Keep theme's background *\/\n        }\n        \/* Custom styles for smoother transitions *\/\n        .transition-all {\n            transition-property: all;\n            transition-duration: 300ms;\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        }\n        \/* Inner container to restore desired padding and max-width for content *\/\n        .contact-content-wrapper {\n            max-width: 800px; \/* Adjust this value for the overall width of the white box *\/\n            width: 100%;\n            margin-left: auto;\n            margin-right: auto;\n            padding-left: 1rem;\n            padding-right: 1rem;\n            box-sizing: border-box;\n        }\n\n        \/* Specific styling for the contact details display *\/\n        .direct-contact-details {\n            display: flex;\n            flex-direction: column;\n            gap: 1.5rem; \/* Space between contact items *\/\n        }\n        .direct-contact-item {\n            display: flex;\n            align-items: center;\n            gap: 1rem;\n        }\n        .direct-contact-item .icon-wrapper {\n            padding: 0.75rem;\n            background-color: #fefcbf; \/* bg-yellow-100 *\/\n            border-radius: 9999px; \/* rounded-full *\/\n            color: #d97706; \/* text-yellow-600 *\/\n            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); \/* shadow-md *\/\n        }\n        .direct-contact-item a {\n            color: #1f2937; \/* text-gray-800 *\/\n            font-weight: 600; \/* font-semibold *\/\n            font-size: 1.125rem; \/* text-lg *\/\n            text-decoration: none;\n            transition: color 0.3s ease;\n        }\n        .direct-contact-item a:hover {\n            color: #D4B068; \/* Accent color on hover *\/\n        }\n        .custom-message {\n            font-size: 1.125rem; \/* text-lg *\/\n            line-height: 1.6;\n            color: #4b5563; \/* text-gray-700 *\/\n            margin-top: 2rem;\n            margin-bottom: 2rem; \/* Added margin-bottom for spacing *\/\n            text-align: center; \/* Center the message *\/\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <!-- This section will now adapt to your theme's existing background -->\n    <section class=\"py-20 md:py-32 overflow-hidden\">\n        <!-- The content wrapper will now house the contact details box -->\n        <div class=\"contact-content-wrapper mx-auto px-4 relative z-1\">\n            <div class=\"text-center mb-12\">\n                <h2 class=\"text-5xl md:text-6xl font-extrabold text-gray-800 leading-tight mb-4 tracking-wider\">\n                    V\u00f5ta \u00dchendust\n                <\/h2>\n                <!-- Removed the introductory paragraph as requested -->\n            <\/div>\n\n            <!-- Contact Details Box - Now spans full width and has the white background -->\n            <div class=\"space-y-8 bg-white rounded-xl shadow-2xl p-8 md:p-12 lg:p-16 text-center\">\n                <h3 class=\"text-3xl font-bold text-gray-800 mb-6 tracking-wide\">Kontaktandmed<\/h3>\n                <p class=\"custom-message\">\n                    V\u00f5ta minuga \u00fchendust kui on k\u00fcsimusi v\u00f5i saan sulle kuidagi ehk abiks olla.\n                <\/p>\n                <div class=\"direct-contact-details flex flex-col items-center justify-center\">\n                    <div class=\"direct-contact-item\">\n                        <!-- Phone Icon -->\n                        <div class=\"icon-wrapper\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-phone\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2 3.18 2 2 0 0 1 4.18 1h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-1.11 2.45L6.9 11.4A11 11 0 0 0 12.6 17.1l1.41-1.74a2 2 0 0 1 2.45-1.11 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92Z\"\/><\/svg>\n                        <\/div>\n                        <a href=\"tel:+37256928377\">+372 5692 8377<\/a>\n                    <\/div>\n                    <div class=\"direct-contact-item\">\n                        <!-- Mail Icon -->\n                        <div class=\"icon-wrapper\">\n                            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-mail\"><rect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"\/><path d=\"m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7\"\/><\/svg>\n                        <\/div>\n                        <a href=\"mailto:Rudolfkaspernaruski@gmail.com\">Rudolfkaspernaruski@gmail.com<\/a>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n<\/body>\n<\/html>\n\n\n\n\n<p><script><br \/>\n        document.addEventListener('DOMContentLoaded', function() {<br \/>\n            const contactForm = document.getElementById('contactForm');<br \/>\n            const formMessage = document.getElementById('formMessage');<\/p>\n<p>            contactForm.addEventListener('submit', function(event) {<br \/>\n                event.preventDefault(); \/\/ Prevent default form submission<\/p>\n<p>                \/\/ Simulate form data collection<br \/>\n                const formData = {<br \/>\n                    name: document.getElementById('name').value,<br \/>\n                    email: document.getElementById('email').value,<br \/>\n                    subject: document.getElementById('subject').value,<br \/>\n                    message: document.getElementById('message').value<br \/>\n                };<\/p>\n<p>                console.log('Form Submitted:', formData);<\/p>\n<p>                \/\/ Simulate an API call<br \/>\n                formMessage.textContent = 'S\u00f5numi saatmine...';<br \/>\n                formMessage.className = 'mt-4 text-center text-sm font-medium text-blue-500';<\/p>\n<p>                setTimeout(() => {<br \/>\n                    \/\/ For this example, just show a success message after a delay<br \/>\n                    formMessage.textContent = 'S\u00f5num edukalt saadetud! V\u00f5tame sinuga peatselt \u00fchendust.';<br \/>\n                    formMessage.className = 'mt-4 text-center text-sm font-medium text-green-600';<br \/>\n                    contactForm.reset(); \/\/ Clear the form fields<br \/>\n                }, 2000); \/\/ Simulate 2-second network delay<br \/>\n            });<br \/>\n        });<br \/>\n    <\/script><br><br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; &nbsp; V\u00f5ta \u00dchendust V\u00f5ta \u00dchendust Kontaktandmed V\u00f5ta minuga \u00fchendust kui on k\u00fcsimusi v\u00f5i saan sulle kuidagi ehk abiks olla. +372 5692 8377 Rudolfkaspernaruski@gmail.com<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-351","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/pages\/351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/comments?post=351"}],"version-history":[{"count":5,"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/pages\/351\/revisions"}],"predecessor-version":[{"id":757,"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/pages\/351\/revisions\/757"}],"wp:attachment":[{"href":"https:\/\/rudolfkaspernaruski.com\/en\/wp-json\/wp\/v2\/media?parent=351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}