{"id":177,"date":"2026-06-30T15:14:40","date_gmt":"2026-06-30T15:14:40","guid":{"rendered":"https:\/\/yourdigitaldesigns.com\/?page_id=177"},"modified":"2026-06-30T15:45:04","modified_gmt":"2026-06-30T15:45:04","slug":"contact-us","status":"publish","type":"page","link":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/","title":{"rendered":"Contact Us"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"177\" class=\"elementor elementor-177\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-8f0287d elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"8f0287d\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3a0e7ff\" data-id=\"3a0e7ff\" data-element_type=\"column\" data-e-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-11e2eba elementor-widget elementor-widget-html\" data-id=\"11e2eba\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t <section class=\"ydd-contact-v2\" id=\"ydd-contact-1\" data-ydd-contact data-ajax-url=\"https:\/\/yourdigitaldesigns.com\/wp-admin\/admin-ajax.php\" data-security=\"0f72709d27\" > <div class=\"ydd-contact-v2__grid\"><\/div> <div class=\"ydd-contact-v2__glow ydd-contact-v2__glow--purple\"><\/div> <div class=\"ydd-contact-v2__glow ydd-contact-v2__glow--cyan\"><\/div> <div class=\"ydd-contact-v2__container\"> <!-- ================================================= LEFT INTRODUCTION ================================================== --> <div class=\"ydd-contact-v2__intro\"> <div class=\"ydd-contact-v2__eyebrow\"> <span><\/span> Contact Your Digital Designs <\/div> <h1 class=\"ydd-contact-v2__title\"> Let\u2019s turn your next idea into <span>a system that works.<\/span> <\/h1> <p class=\"ydd-contact-v2__lead\"> Whether you are launching something new, improving an existing website, or simplifying the way your business operates, the right solution begins with a clear conversation. <\/p> <p class=\"ydd-contact-v2__description\"> Build your project inquiry using the guided planner. Your selections, goals, timeline, budget, and contact information will be organized into one clear brief for our team. <\/p> <div class=\"ydd-contact-v2__benefits\"> <div class=\"ydd-contact-v2__benefit\"> <span class=\"ydd-contact-v2__benefit-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <div> <strong>Clear recommendations<\/strong> <p> Straightforward guidance without unnecessary technical language. <\/p> <\/div> <\/div> <div class=\"ydd-contact-v2__benefit\"> <span class=\"ydd-contact-v2__benefit-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <div> <strong>Thoughtful project planning<\/strong> <p> A solution shaped around your customers, operations, and growth goals. <\/p> <\/div> <\/div> <div class=\"ydd-contact-v2__benefit\"> <span class=\"ydd-contact-v2__benefit-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <div> <strong>A practical next step<\/strong> <p> A clearer understanding of what should happen next and why. <\/p> <\/div> <\/div> <\/div> <button type=\"button\" class=\"ydd-contact-v2__start-button\" data-start-planner > Build your project brief <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M5 12h14\"><\/path> <path d=\"m13 6 6 6-6 6\"><\/path> <\/svg> <\/button> <div class=\"ydd-contact-v2__response\"> <span class=\"ydd-contact-v2__response-dot\"><\/span> <div> <strong>Reviewed by a real person<\/strong> <p> Every inquiry is carefully reviewed before we respond. <\/p> <\/div> <\/div> <div class=\"ydd-contact-v2__markets\"> <span class=\"ydd-contact-v2__markets-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <circle cx=\"12\" cy=\"12\" r=\"9\"><\/circle> <path d=\"M3 12h18\"><\/path> <path d=\"M12 3c2.7 2.5 4.1 5.5 4.1 9S14.7 18.5 12 21\"><\/path> <path d=\"M12 3c-2.7 2.5-4.1 5.5-4.1 9s1.4 6.5 4.1 9\"><\/path> <\/svg> <\/span> <div> <span>United States experience<\/span> <span>Thailand market understanding<\/span> <span>International collaboration<\/span> <\/div> <\/div> <\/div> <!-- ================================================= RIGHT PROJECT PLANNER ================================================== --> <div class=\"ydd-contact-v2__planner-wrap\" data-planner-wrap> <div class=\"ydd-contact-v2__orbit ydd-contact-v2__orbit--one\"><\/div> <div class=\"ydd-contact-v2__orbit ydd-contact-v2__orbit--two\"><\/div> <div class=\"ydd-contact-v2__floating-status\"> <span class=\"ydd-contact-v2__floating-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z\"><\/path> <\/svg> <\/span> <div> <small>Conversation status<\/small> <strong>Ready when you are<\/strong> <\/div> <span class=\"ydd-contact-v2__live-dot\"><\/span> <\/div> <div class=\"ydd-contact-v2__planner\"> <form class=\"ydd-contact-v2__form\" data-project-form novalidate > <input type=\"hidden\" name=\"action\" value=\"ydd_submit_contact\" > <input type=\"hidden\" name=\"security\" value=\"0f72709d27\" > <input type=\"hidden\" name=\"form_started\" value=\"1782858640\" > <!-- Honeypot --> <div class=\"ydd-contact-v2__honeypot\" aria-hidden=\"true\" > <label> Website <input type=\"text\" name=\"company_website\" tabindex=\"-1\" autocomplete=\"off\" > <\/label> <\/div> <!-- HEADER --> <div class=\"ydd-contact-v2__planner-header\"> <div> <span class=\"ydd-contact-v2__planner-label\"> Professional project inquiry <\/span> <h2 data-step-heading> What would you like us to help you build? <\/h2> <p data-step-description> Select the project type that most closely matches what brought you here. <\/p> <\/div> <div class=\"ydd-contact-v2__step-counter\"> <span>Step<\/span> <strong data-step-number>01<\/strong> <small>of 03<\/small> <\/div> <\/div> <!-- PROGRESS NAVIGATION --> <div class=\"ydd-contact-v2__progress-nav\" aria-label=\"Inquiry progress\" > <div class=\"ydd-contact-v2__progress-item is-active\" data-progress-item=\"1\" > <span>01<\/span> <div> <small>Project<\/small> <strong>What you need<\/strong> <\/div> <\/div> <div class=\"ydd-contact-v2__progress-item\" data-progress-item=\"2\" > <span>02<\/span> <div> <small>Goals<\/small> <strong>What matters<\/strong> <\/div> <\/div> <div class=\"ydd-contact-v2__progress-item\" data-progress-item=\"3\" > <span>03<\/span> <div> <small>Contact<\/small> <strong>Tell us about you<\/strong> <\/div> <\/div> <\/div> <div class=\"ydd-contact-v2__progress-track\"> <span data-progress-bar><\/span> <\/div> <div class=\"ydd-contact-v2__notice\" data-form-notice role=\"alert\" aria-live=\"polite\" hidden ><\/div> <!-- ================================================= STEP 1 ================================================== --> <div class=\"ydd-contact-v2__step is-active\" data-step=\"1\" > <fieldset class=\"ydd-contact-v2__fieldset\"> <legend class=\"ydd-contact-v2__legend\"> Choose one primary project type <\/legend> <div class=\"ydd-contact-v2__project-grid\"> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"New website\" required > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <rect x=\"3\" y=\"4\" width=\"18\" height=\"16\" rx=\"2\"><\/rect> <path d=\"M3 9h18\"><\/path> <path d=\"M8 14h3\"><\/path> <path d=\"M8 17h7\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>New website<\/small> <strong>Build something new<\/strong> <p> Create a professional digital presence from the ground up. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"Website redesign or improvement\" > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M3 3v18h18\"><\/path> <path d=\"m7 15 4-4 3 3 5-7\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>Existing website<\/small> <strong>Improve what we have<\/strong> <p> Modernize the design, message, usability, or performance. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"Online store or e-commerce\" > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <circle cx=\"9\" cy=\"20\" r=\"1\"><\/circle> <circle cx=\"19\" cy=\"20\" r=\"1\"><\/circle> <path d=\"M3 4h2l2.4 10.2a2 2 0 0 0 2 1.5h7.8a2 2 0 0 0 2-1.6L21 7H6\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>E-commerce<\/small> <strong>Sell products online<\/strong> <p> Products, checkout, payments, orders, and customer accounts. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"Automation or business system\" > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M12 2v4\"><\/path> <path d=\"m4.93 4.93 2.83 2.83\"><\/path> <path d=\"M2 12h4\"><\/path> <path d=\"m4.93 19.07 2.83-2.83\"><\/path> <path d=\"M12 18v4\"><\/path> <path d=\"m16.24 16.24 2.83 2.83\"><\/path> <path d=\"M18 12h4\"><\/path> <path d=\"m16.24 7.76 2.83-2.83\"><\/path> <circle cx=\"12\" cy=\"12\" r=\"3\"><\/circle> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>Systems and automation<\/small> <strong>Simplify our operations<\/strong> <p> Connect workflows, forms, payments, data, and communication. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"Customer or staff portal\" > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <circle cx=\"9\" cy=\"8\" r=\"4\"><\/circle> <path d=\"M3 21v-2a6 6 0 0 1 12 0v2\"><\/path> <path d=\"M16 11h5\"><\/path> <path d=\"M18.5 8.5v5\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>Private portal<\/small> <strong>Connect users and teams<\/strong> <p> Secure dashboards, memberships, courses, records, or documents. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <label class=\"ydd-contact-v2__project-card\"> <input type=\"radio\" name=\"project_type\" value=\"Other custom project\" > <span class=\"ydd-contact-v2__project-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <circle cx=\"12\" cy=\"12\" r=\"9\"><\/circle> <path d=\"M9.5 9a2.55 2.55 0 0 1 4.95.85c0 1.85-2.45 2.1-2.45 3.65\"><\/path> <path d=\"M12 17h.01\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__project-copy\"> <small>Something different<\/small> <strong>Discuss another idea<\/strong> <p> Share the challenge even when the final solution is not clear. <\/p> <\/span> <span class=\"ydd-contact-v2__project-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <\/label> <\/div> <\/fieldset> <div class=\"ydd-contact-v2__recommendation\" data-recommendation > <span class=\"ydd-contact-v2__recommendation-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M9 18h6\"><\/path> <path d=\"M10 22h4\"><\/path> <path d=\"M8.5 14.5A7 7 0 1 1 15.5 14.5c-.9.7-1.5 1.4-1.5 2.5h-4c0-1.1-.6-1.8-1.5-2.5z\"><\/path> <\/svg> <\/span> <div> <small>Your recommended starting point<\/small> <h3 data-recommendation-title> Select a project type to receive a tailored starting recommendation. <\/h3> <p data-recommendation-description> Your selection will help us prepare the next part of your project brief. <\/p> <div class=\"ydd-contact-v2__recommendation-tags\"> <span data-tag-one>Project strategy<\/span> <span data-tag-two>Clear priorities<\/span> <span data-tag-three>Practical planning<\/span> <\/div> <\/div> <\/div> <div class=\"ydd-contact-v2__step-actions\"> <span class=\"ydd-contact-v2__required-note\"> Choose one option to continue <\/span> <button type=\"button\" class=\"ydd-contact-v2__next-button\" data-next-step > Continue to your goals <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M5 12h14\"><\/path> <path d=\"m13 6 6 6-6 6\"><\/path> <\/svg> <\/button> <\/div> <\/div> <!-- ================================================= STEP 2 ================================================== --> <div class=\"ydd-contact-v2__step\" data-step=\"2\" hidden > <fieldset class=\"ydd-contact-v2__fieldset\"> <legend class=\"ydd-contact-v2__legend\"> What would make this project successful? <\/legend> <p class=\"ydd-contact-v2__field-help\"> Select every goal that applies. You can choose more than one. <\/p> <div class=\"ydd-contact-v2__goals-grid\">  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Attract more customers\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Attract more customers <\/strong> <small> Increase qualified interest and inquiries. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Improve trust and credibility\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Improve trust and credibility <\/strong> <small> Present the business more professionally. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Accept bookings or appointments\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Accept bookings or appointments <\/strong> <small> Allow customers to schedule online. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Accept online payments\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Accept online payments <\/strong> <small> Create a convenient payment experience. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Sell products online\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Sell products online <\/strong> <small> Build a complete online shopping journey. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Improve Google visibility\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Improve Google visibility <\/strong> <small> Strengthen search and local discovery. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Support multiple languages\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Support multiple languages <\/strong> <small> Reach local and international audiences. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Automate repetitive work\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Automate repetitive work <\/strong> <small> Reduce manual administration and follow-up. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Create a customer portal\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Create a customer portal <\/strong> <small> Give users secure access to information. <\/small> <\/span> <\/label>  <label class=\"ydd-contact-v2__goal\"> <input type=\"checkbox\" name=\"goals[]\" value=\"Connect existing systems\" > <span class=\"ydd-contact-v2__goal-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> <strong> Connect existing systems <\/strong> <small> Improve data flow between business tools. <\/small> <\/span> <\/label>  <\/div> <\/fieldset> <div class=\"ydd-contact-v2__details-grid\"> <label class=\"ydd-contact-v2__field\"> <span>Approximate project budget<\/span> <select name=\"budget\"> <option value=\"Not sure yet\">Not sure yet<\/option> <option value=\"Under \u0e3f25,000\">Under \u0e3f25,000<\/option> <option value=\"\u0e3f25,000 \u2013 \u0e3f50,000\">\u0e3f25,000 \u2013 \u0e3f50,000<\/option> <option value=\"\u0e3f50,000 \u2013 \u0e3f100,000\">\u0e3f50,000 \u2013 \u0e3f100,000<\/option> <option value=\"\u0e3f100,000 \u2013 \u0e3f250,000\">\u0e3f100,000 \u2013 \u0e3f250,000<\/option> <option value=\"\u0e3f250,000+\">\u0e3f250,000+<\/option> <option value=\"Prefer to discuss\">Prefer to discuss<\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field\"> <span>Preferred timeline<\/span> <select name=\"timeline\"> <option value=\"Flexible\">Flexible<\/option> <option value=\"As soon as possible\">As soon as possible<\/option> <option value=\"Within 1 month\">Within 1 month<\/option> <option value=\"Within 2\u20133 months\">Within 2\u20133 months<\/option> <option value=\"Within 3\u20136 months\">Within 3\u20136 months<\/option> <option value=\"More than 6 months\">More than 6 months<\/option> <option value=\"Not sure yet\">Not sure yet<\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field\"> <span>Business location<\/span> <select name=\"market\"> <option value=\"Thailand\">Thailand<\/option> <option value=\"United States\">United States<\/option> <option value=\"Southeast Asia\">Southeast Asia<\/option> <option value=\"International\">International<\/option> <option value=\"Other\">Other<\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field\"> <span>Current website status<\/span> <select name=\"website_status\"> <option value=\"No website yet\">No website yet<\/option> <option value=\"Existing website\">Existing website<\/option> <option value=\"Website under development\">Website under development<\/option> <option value=\"Not applicable\">Not applicable<\/option> <\/select> <\/label> <\/div> <div class=\"ydd-contact-v2__summary-card\"> <div class=\"ydd-contact-v2__summary-heading\"> <span class=\"ydd-contact-v2__summary-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M9 11l3 3L22 4\"><\/path> <path d=\"M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11\"><\/path> <\/svg> <\/span> <div> <small>Your project brief so far<\/small> <strong data-summary-project> Project type selected in Step 1 <\/strong> <\/div> <\/div> <div class=\"ydd-contact-v2__summary-goals\" data-summary-goals > <span>No goals selected yet<\/span> <\/div> <\/div> <div class=\"ydd-contact-v2__step-actions\"> <button type=\"button\" class=\"ydd-contact-v2__back-button\" data-back-step > <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M19 12H5\"><\/path> <path d=\"m11 18-6-6 6-6\"><\/path> <\/svg> Back <\/button> <button type=\"button\" class=\"ydd-contact-v2__next-button\" data-next-step > Continue to contact details <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M5 12h14\"><\/path> <path d=\"m13 6 6 6-6 6\"><\/path> <\/svg> <\/button> <\/div> <\/div> <!-- ================================================= STEP 3 ================================================== --> <div class=\"ydd-contact-v2__step\" data-step=\"3\" hidden > <div class=\"ydd-contact-v2__contact-grid\"> <label class=\"ydd-contact-v2__field\"> <span> Your name <em>*<\/em> <\/span> <input type=\"text\" name=\"name\" autocomplete=\"name\" placeholder=\"Enter your full name\" required > <\/label> <label class=\"ydd-contact-v2__field\"> <span> Email address <em>*<\/em> <\/span> <input type=\"email\" name=\"email\" autocomplete=\"email\" placeholder=\"you@company.com\" required > <\/label> <label class=\"ydd-contact-v2__field\"> <span>Phone, WhatsApp, or LINE<\/span> <input type=\"text\" name=\"phone\" autocomplete=\"tel\" placeholder=\"+66, +1, LINE ID, or WhatsApp\" > <\/label> <label class=\"ydd-contact-v2__field\"> <span>Company or organization<\/span> <input type=\"text\" name=\"company\" autocomplete=\"organization\" placeholder=\"Your business name\" > <\/label> <label class=\"ydd-contact-v2__field\"> <span>Current website<\/span> <input type=\"url\" name=\"website_url\" placeholder=\"https:\/\/yourwebsite.com\" > <\/label> <label class=\"ydd-contact-v2__field\"> <span>Preferred contact method<\/span> <select name=\"preferred_contact\"> <option value=\"Email\">Email<\/option> <option value=\"Phone\">Phone<\/option> <option value=\"WhatsApp\">WhatsApp<\/option> <option value=\"LINE\">LINE<\/option> <option value=\"Video meeting\">Video meeting<\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field\"> <span>Preferred language<\/span> <select name=\"preferred_language\"> <option value=\"English\">English<\/option> <option value=\"Thai\">Thai<\/option> <option value=\"Either English or Thai\"> Either English or Thai <\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field\"> <span>How did you hear about us?<\/span> <select name=\"referral_source\"> <option value=\"Not specified\">Select an option<\/option> <option value=\"Google\">Google<\/option> <option value=\"Social media\">Social media<\/option> <option value=\"Referral\">Referral<\/option> <option value=\"Existing customer\">Existing customer<\/option> <option value=\"Local business connection\"> Local business connection <\/option> <option value=\"Other\">Other<\/option> <\/select> <\/label> <label class=\"ydd-contact-v2__field ydd-contact-v2__field--full\"> <span> Tell us about the project <em>*<\/em> <\/span> <textarea name=\"message\" rows=\"6\" minlength=\"20\" placeholder=\"Describe what your business does, the challenge you are trying to solve, and what a successful result would look like.\" required ><\/textarea> <small> A few useful details will help us prepare a more relevant response. <\/small> <\/label> <\/div> <div class=\"ydd-contact-v2__final-summary\"> <div> <small>Selected project<\/small> <strong data-final-project> Your project type <\/strong> <\/div> <div> <small>Selected priorities<\/small> <strong data-final-goal-count> 0 project goals <\/strong> <\/div> <div> <small>Next step<\/small> <strong>Personal review by our team<\/strong> <\/div> <\/div> <label class=\"ydd-contact-v2__consent\"> <input type=\"checkbox\" name=\"consent\" value=\"Yes\" required > <span class=\"ydd-contact-v2__consent-check\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span> I agree that Your Digital Designs may use the information provided to review and respond to this project inquiry. <\/span> <\/label> <div class=\"ydd-contact-v2__step-actions\"> <button type=\"button\" class=\"ydd-contact-v2__back-button\" data-back-step > <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M19 12H5\"><\/path> <path d=\"m11 18-6-6 6-6\"><\/path> <\/svg> Back <\/button> <button type=\"submit\" class=\"ydd-contact-v2__submit-button\" data-submit-button > <span data-submit-text> Send my project inquiry <\/span> <span class=\"ydd-contact-v2__submit-loader\" aria-hidden=\"true\" ><\/span> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M22 2 11 13\"><\/path> <path d=\"m22 2-7 20-4-9-9-4Z\"><\/path> <\/svg> <\/button> <\/div> <div class=\"ydd-contact-v2__privacy-note\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <rect x=\"5\" y=\"10\" width=\"14\" height=\"10\" rx=\"2\"><\/rect> <path d=\"M8 10V7a4 4 0 0 1 8 0v3\"><\/path> <\/svg> Your information is sent securely and is used only to review and respond to your inquiry. <\/div> <\/div> <\/form> <!-- SUCCESS STATE --> <div class=\"ydd-contact-v2__success\" data-success-state hidden > <span class=\"ydd-contact-v2__success-icon\"> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"m5 12 4 4L19 6\"><\/path> <\/svg> <\/span> <span class=\"ydd-contact-v2__success-label\"> Inquiry successfully delivered <\/span> <h2>Thank you. Your project is now on our radar.<\/h2> <p> We have received your selections and contact information. A member of our team will personally review the project before responding. <\/p> <div class=\"ydd-contact-v2__reference\"> <span>Inquiry reference<\/span> <strong data-reference-number>YDD-PENDING<\/strong> <\/div> <div class=\"ydd-contact-v2__success-steps\"> <div> <span>01<\/span> <strong>Brief received<\/strong> <small>Your information is safely recorded.<\/small> <\/div> <div> <span>02<\/span> <strong>Personal review<\/strong> <small>We examine your goals and requirements.<\/small> <\/div> <div> <span>03<\/span> <strong>Relevant response<\/strong> <small>We contact you with the next step.<\/small> <\/div> <\/div> <button type=\"button\" class=\"ydd-contact-v2__restart-button\" data-restart-form > Submit another inquiry <\/button> <\/div> <\/div> <div class=\"ydd-contact-v2__floating-confidence\"> <span> <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"> <path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"><\/path> <path d=\"m9 12 2 2 4-4\"><\/path> <\/svg> <\/span> <div> <strong>No-pressure conversation<\/strong> <small>Useful guidance from the beginning<\/small> <\/div> <\/div> <\/div> <\/div> <\/section> <style> \/* ========================================================= FOUNDATION ========================================================== *\/ .ydd-contact-v2 { --ydd-ink: #11162b; --ydd-text: #5d647b; --ydd-muted: #858b9e; --ydd-purple: #6d56f4; --ydd-purple-deep: #533de0; --ydd-blue: #438ee8; --ydd-cyan: #12c7d1; --ydd-green: #24c89b; --ydd-border: rgba(72, 67, 118, 0.12); position: relative; isolation: isolate; overflow: hidden; width: 100vw; margin-left: calc(50% - 50vw); padding: clamp(105px, 8vw, 145px) 22px clamp(85px, 8vw, 125px); color: var(--ydd-ink); background: radial-gradient( circle at 6% 10%, rgba(109, 86, 244, 0.17), transparent 31% ), radial-gradient( circle at 95% 89%, rgba(18, 199, 209, 0.16), transparent 32% ), linear-gradient( 135deg, #f8f7ff 0%, #ffffff 48%, #f1fdff 100% ); font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif; } .ydd-contact-v2 *, .ydd-contact-v2 *::before, .ydd-contact-v2 *::after { box-sizing: border-box; } .ydd-contact-v2 button, .ydd-contact-v2 input, .ydd-contact-v2 select, .ydd-contact-v2 textarea { font-family: inherit; } .ydd-contact-v2__container { position: relative; z-index: 4; display: grid; grid-template-columns: minmax(410px, 0.72fr) minmax(720px, 1.28fr); align-items: center; gap: clamp(50px, 5vw, 86px); width: min(1560px, 100%); margin: 0 auto; } .ydd-contact-v2__grid { position: absolute; inset: 0; opacity: 0.5; pointer-events: none; background-image: linear-gradient( rgba(85, 72, 165, 0.035) 1px, transparent 1px ), linear-gradient( 90deg, rgba(85, 72, 165, 0.035) 1px, transparent 1px ); background-size: 50px 50px; mask-image: linear-gradient( to bottom, transparent, #000 12%, #000 90%, transparent ); } .ydd-contact-v2__glow { position: absolute; border-radius: 50%; pointer-events: none; filter: blur(28px); animation: yddContactGlow 13s ease-in-out infinite; } .ydd-contact-v2__glow--purple { top: -230px; left: -180px; width: 500px; height: 500px; background: radial-gradient( circle, rgba(111, 85, 246, 0.28), transparent 70% ); } .ydd-contact-v2__glow--cyan { right: -210px; bottom: -230px; width: 530px; height: 530px; background: radial-gradient( circle, rgba(13, 205, 210, 0.24), transparent 70% ); animation-delay: -6s; } @keyframes yddContactGlow { 50% { transform: translate3d(24px, -20px, 0) scale(1.08); } } \/* ========================================================= LEFT INTRODUCTION ========================================================== *\/ .ydd-contact-v2__intro { position: relative; z-index: 5; opacity: 0; transform: translateY(24px); } .ydd-contact-v2.is-visible .ydd-contact-v2__intro { animation: yddContactIntroIn 0.85s cubic-bezier(0.22, 1, 0.36, 1) forwards; } @keyframes yddContactIntroIn { to { opacity: 1; transform: translateY(0); } } .ydd-contact-v2__eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 25px; padding: 10px 15px; border: 1px solid rgba(109, 86, 244, 0.15); border-radius: 999px; color: var(--ydd-purple-deep); background: rgba(255, 255, 255, 0.82); box-shadow: 0 10px 30px rgba(70, 56, 143, 0.07); font-size: 11px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; backdrop-filter: blur(14px); } .ydd-contact-v2__eyebrow > span { position: relative; width: 9px; height: 9px; border-radius: 50%; background: var(--ydd-green); box-shadow: 0 0 0 5px rgba(36, 200, 155, 0.12); } .ydd-contact-v2__eyebrow > span::after { content: \"\"; position: absolute; inset: -5px; border: 1px solid rgba(36, 200, 155, 0.5); border-radius: inherit; animation: yddContactPulse 2.3s ease-out infinite; } @keyframes yddContactPulse { 0% { opacity: 0.7; transform: scale(0.7); } 80%, 100% { opacity: 0; transform: scale(1.9); } } .ydd-contact-v2__title { max-width: 720px; margin: 0; color: var(--ydd-ink); font-size: clamp(52px, 5.25vw, 82px); font-weight: 760; line-height: 0.99; letter-spacing: -0.057em; } .ydd-contact-v2__title span { display: block; margin-top: 12px; color: transparent; background: linear-gradient( 90deg, #6c53f4, #795df7 30%, #468be6 68%, #0ec2ca ); background-size: 185% auto; -webkit-background-clip: text; background-clip: text; animation: yddContactTitle 7s ease-in-out infinite; } @keyframes yddContactTitle { 50% { background-position: 100% 50%; } } .ydd-contact-v2__lead { max-width: 650px; margin: 29px 0 0; color: var(--ydd-text); font-size: clamp(17px, 1.45vw, 20px); line-height: 1.72; } .ydd-contact-v2__description { max-width: 640px; margin: 16px 0 0; color: #71788e; font-size: 15px; line-height: 1.72; } \/* BENEFITS *\/ .ydd-contact-v2__benefits { display: grid; gap: 13px; max-width: 590px; margin-top: 31px; } .ydd-contact-v2__benefit { display: grid; grid-template-columns: 45px minmax(0, 1fr); align-items: center; gap: 14px; padding: 15px 17px; border: 1px solid rgba(72, 67, 118, 0.1); border-radius: 16px; background: rgba(255, 255, 255, 0.68); transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease; } .ydd-contact-v2__benefit:hover { border-color: rgba(109, 86, 244, 0.22); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.075), rgba(18, 199, 209, 0.045) ); box-shadow: 0 14px 30px rgba(66, 55, 128, 0.075); transform: translateX(4px); } .ydd-contact-v2__benefit-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; color: #23886f; background: linear-gradient( 135deg, rgba(36, 200, 155, 0.15), rgba(18, 199, 209, 0.1) ); } .ydd-contact-v2__benefit-icon svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__benefit strong { display: block; margin-bottom: 4px; color: var(--ydd-ink); font-size: 14px; } .ydd-contact-v2__benefit p { margin: 0; color: var(--ydd-muted); font-size: 12px; line-height: 1.5; } .ydd-contact-v2__start-button { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 57px; margin-top: 31px; padding: 0 23px; border: 1px solid transparent !important; border-radius: 15px; color: #fff !important; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ) !important; box-shadow: 0 14px 31px rgba(93, 72, 223, 0.28); font-size: 13px; font-weight: 800; cursor: pointer; transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease; } .ydd-contact-v2__start-button:hover { color: #fff !important; background: linear-gradient( 135deg, #7d63ff, #38a3e9 ) !important; box-shadow: 0 19px 39px rgba(93, 72, 223, 0.36); transform: translateY(-3px); } .ydd-contact-v2__start-button svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.25s ease; } .ydd-contact-v2__start-button:hover svg { transform: translateX(4px); } .ydd-contact-v2__response { display: inline-flex; align-items: center; gap: 12px; margin: 22px 0 0 16px; vertical-align: middle; } .ydd-contact-v2__response-dot { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--ydd-green); box-shadow: 0 0 0 6px rgba(36, 200, 155, 0.1); } .ydd-contact-v2__response strong { display: block; color: #50576c; font-size: 12px; } .ydd-contact-v2__response p { margin: 3px 0 0; color: var(--ydd-muted); font-size: 10px; } .ydd-contact-v2__markets { display: flex; align-items: center; gap: 13px; margin-top: 29px; } .ydd-contact-v2__markets-icon { display: grid; flex: 0 0 auto; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(109, 86, 244, 0.12); border-radius: 12px; color: var(--ydd-purple); background: rgba(109, 86, 244, 0.065); } .ydd-contact-v2__markets-icon svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__markets > div { display: flex; flex-wrap: wrap; gap: 7px 17px; } .ydd-contact-v2__markets > div span { position: relative; color: #747b90; font-size: 10px; font-weight: 700; } .ydd-contact-v2__markets > div span:not(:last-child)::after { content: \"\"; position: absolute; top: 50%; right: -10px; width: 4px; height: 4px; border-radius: 50%; background: var(--ydd-cyan); transform: translateY(-50%); } \/* ========================================================= PLANNER WRAPPER ========================================================== *\/ .ydd-contact-v2__planner-wrap { --ydd-rotate-x: 0deg; --ydd-rotate-y: 0deg; position: relative; min-width: 0; padding: 61px 7px 57px; perspective: 1600px; opacity: 0; transform: translateY(28px); } .ydd-contact-v2.is-visible .ydd-contact-v2__planner-wrap { animation: yddContactPlannerIn 0.95s 0.12s cubic-bezier(0.22, 1, 0.36, 1) forwards; } @keyframes yddContactPlannerIn { to { opacity: 1; transform: translateY(0); } } .ydd-contact-v2__orbit { position: absolute; z-index: -1; border: 1px solid rgba(109, 86, 244, 0.12); border-radius: 50%; pointer-events: none; } .ydd-contact-v2__orbit::after { content: \"\"; position: absolute; top: 50%; left: -5px; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: var(--ydd-cyan); } .ydd-contact-v2__orbit--one { top: 5px; right: -1%; width: 470px; height: 470px; animation: yddOrbitOne 22s linear infinite; } .ydd-contact-v2__orbit--two { right: 13%; bottom: 10px; width: 300px; height: 300px; opacity: 0.55; animation: yddOrbitTwo 17s linear infinite; } @keyframes yddOrbitOne { to { transform: rotate(360deg); } } @keyframes yddOrbitTwo { to { transform: rotate(-360deg); } } \/* ========================================================= MAIN PLANNER ========================================================== *\/ .ydd-contact-v2__planner { position: relative; z-index: 3; overflow: hidden; min-height: 700px; padding: clamp(27px, 2.7vw, 40px); border: 1px solid rgba(109, 86, 244, 0.17); border-radius: 29px; background: radial-gradient( circle at 100% 0%, rgba(109, 86, 244, 0.1), transparent 34% ), rgba(255, 255, 255, 0.92); box-shadow: 0 44px 100px rgba(44, 40, 91, 0.18), 0 14px 36px rgba(68, 54, 145, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.95); backdrop-filter: blur(22px); transform: rotateX(var(--ydd-rotate-x)) rotateY(var(--ydd-rotate-y)); transform-style: preserve-3d; transition: transform 0.2s ease-out, border-color 0.3s ease, box-shadow 0.3s ease; } .ydd-contact-v2__planner-wrap:hover .ydd-contact-v2__planner { border-color: rgba(109, 86, 244, 0.28); box-shadow: 0 50px 110px rgba(44, 40, 91, 0.21), 0 18px 43px rgba(68, 54, 145, 0.11); } .ydd-contact-v2__honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; } \/* HEADER *\/ .ydd-contact-v2__planner-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; } .ydd-contact-v2__planner-label { display: block; margin-bottom: 9px; color: var(--ydd-purple); font-size: 10px; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; } .ydd-contact-v2__planner-header h2 { max-width: 610px; margin: 0; color: var(--ydd-ink); font-size: clamp(28px, 2.3vw, 38px); font-weight: 760; line-height: 1.12; letter-spacing: -0.04em; } .ydd-contact-v2__planner-header p { max-width: 590px; margin: 12px 0 0; color: #70778c; font-size: 14px; line-height: 1.6; } .ydd-contact-v2__step-counter { display: grid; flex: 0 0 auto; place-items: center; width: 70px; height: 70px; border: 1px solid rgba(109, 86, 244, 0.15); border-radius: 20px; background: linear-gradient( 135deg, rgba(109, 86, 244, 0.11), rgba(18, 199, 209, 0.07) ); box-shadow: 0 11px 25px rgba(70, 56, 143, 0.08); } .ydd-contact-v2__step-counter span, .ydd-contact-v2__step-counter small { color: var(--ydd-muted); font-size: 8px; font-weight: 750; text-transform: uppercase; } .ydd-contact-v2__step-counter strong { color: var(--ydd-purple); font-size: 20px; line-height: 1; } \/* PROGRESS *\/ .ydd-contact-v2__progress-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 27px; } .ydd-contact-v2__progress-item { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 10px; min-width: 0; padding: 11px 12px; border: 1px solid rgba(72, 67, 118, 0.08); border-radius: 13px; color: #888da0; background: rgba(249, 249, 254, 0.68); transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease; } .ydd-contact-v2__progress-item > span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; color: var(--ydd-purple); background: rgba(109, 86, 244, 0.07); font-size: 9px; font-weight: 850; } .ydd-contact-v2__progress-item small, .ydd-contact-v2__progress-item strong { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .ydd-contact-v2__progress-item small { margin-bottom: 2px; color: inherit; font-size: 8px; font-weight: 750; text-transform: uppercase; } .ydd-contact-v2__progress-item strong { color: #5f667b; font-size: 11px; } .ydd-contact-v2__progress-item.is-active { border-color: rgba(109, 86, 244, 0.24); color: var(--ydd-purple); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.1), rgba(18, 199, 209, 0.06) ); } .ydd-contact-v2__progress-item.is-active > span, .ydd-contact-v2__progress-item.is-complete > span { color: #fff; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ); box-shadow: 0 8px 17px rgba(109, 86, 244, 0.23); } .ydd-contact-v2__progress-track { height: 6px; margin-top: 13px; overflow: hidden; border-radius: 999px; background: rgba(109, 86, 244, 0.08); } .ydd-contact-v2__progress-track span { display: block; width: 33.333%; height: 100%; border-radius: inherit; background: linear-gradient( 90deg, var(--ydd-purple), var(--ydd-blue), var(--ydd-cyan) ); transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1); } .ydd-contact-v2__notice { margin-top: 18px; padding: 13px 15px; border: 1px solid rgba(219, 74, 106, 0.18); border-radius: 13px; color: #a43351; background: rgba(219, 74, 106, 0.065); font-size: 13px; line-height: 1.5; } \/* STEPS *\/ .ydd-contact-v2__step { margin-top: 26px; animation: yddContactStepIn 0.45s cubic-bezier(0.22, 1, 0.36, 1); } @keyframes yddContactStepIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } } .ydd-contact-v2__fieldset { min-width: 0; margin: 0; padding: 0; border: 0; } .ydd-contact-v2__legend { margin-bottom: 7px; color: var(--ydd-ink); font-size: 16px; font-weight: 780; } .ydd-contact-v2__field-help { margin: 0 0 17px; color: var(--ydd-muted); font-size: 13px; line-height: 1.5; } \/* PROJECT CARDS *\/ .ydd-contact-v2__project-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; } .ydd-contact-v2__project-card { position: relative; display: grid; grid-template-columns: 50px minmax(0, 1fr) 28px; align-items: center; gap: 13px; min-height: 112px; padding: 16px; border: 1px solid rgba(72, 67, 118, 0.11); border-radius: 17px; color: #62697e; background: rgba(250, 250, 255, 0.75); cursor: pointer; transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease; } .ydd-contact-v2__project-card:hover { border-color: rgba(109, 86, 244, 0.25); color: var(--ydd-purple-deep); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.085), rgba(18, 199, 209, 0.05) ); box-shadow: 0 13px 29px rgba(68, 55, 142, 0.08); transform: translateY(-2px); } .ydd-contact-v2__project-card:has(input:checked) { border-color: rgba(109, 86, 244, 0.31); color: var(--ydd-purple-deep); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.13), rgba(18, 199, 209, 0.08) ); box-shadow: 0 15px 33px rgba(68, 55, 142, 0.11); } .ydd-contact-v2__project-card > input { position: absolute; opacity: 0; pointer-events: none; } .ydd-contact-v2__project-icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 15px; color: var(--ydd-purple); background: rgba(109, 86, 244, 0.08); transition: color 0.25s ease, background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease; } .ydd-contact-v2__project-icon svg { width: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__project-card:has(input:checked) .ydd-contact-v2__project-icon { color: #fff; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ); box-shadow: 0 10px 22px rgba(109, 86, 244, 0.25); transform: scale(1.04); } .ydd-contact-v2__project-copy small, .ydd-contact-v2__project-copy strong, .ydd-contact-v2__project-copy p { display: block; } .ydd-contact-v2__project-copy small { margin-bottom: 4px; color: var(--ydd-muted); font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; } .ydd-contact-v2__project-copy strong { color: inherit; font-size: 14px; line-height: 1.3; } .ydd-contact-v2__project-copy p { margin: 5px 0 0; color: #7b8194; font-size: 11px; line-height: 1.42; } .ydd-contact-v2__project-check { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid rgba(109, 86, 244, 0.14); border-radius: 9px; color: transparent; background: rgba(255, 255, 255, 0.72); transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease, transform 0.25s ease; } .ydd-contact-v2__project-check svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__project-card:has(input:checked) .ydd-contact-v2__project-check { border-color: transparent; color: #fff; background: linear-gradient( 135deg, var(--ydd-green), var(--ydd-cyan) ); transform: scale(1.06); } \/* RECOMMENDATION *\/ .ydd-contact-v2__recommendation { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 15px; margin-top: 17px; padding: 20px; border: 1px solid rgba(109, 86, 244, 0.13); border-radius: 18px; background: linear-gradient( 135deg, rgba(109, 86, 244, 0.08), rgba(18, 199, 209, 0.05) ); } .ydd-contact-v2__recommendation-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; color: #fff; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ); box-shadow: 0 10px 22px rgba(109, 86, 244, 0.24); } .ydd-contact-v2__recommendation-icon svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__recommendation small { display: block; margin-bottom: 5px; color: var(--ydd-purple); font-size: 9px; font-weight: 850; letter-spacing: 0.09em; text-transform: uppercase; } .ydd-contact-v2__recommendation h3 { margin: 0; color: var(--ydd-ink); font-size: 16px; line-height: 1.42; } .ydd-contact-v2__recommendation p { margin: 9px 0 0; color: #687086; font-size: 13px; line-height: 1.62; } .ydd-contact-v2__recommendation-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; } .ydd-contact-v2__recommendation-tags span { padding: 7px 10px; border: 1px solid rgba(109, 86, 244, 0.11); border-radius: 999px; color: #626a80; background: rgba(255, 255, 255, 0.72); font-size: 9px; font-weight: 750; } \/* GOALS *\/ .ydd-contact-v2__goals-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; } .ydd-contact-v2__goal { position: relative; display: grid; grid-template-columns: 31px minmax(0, 1fr); align-items: center; gap: 11px; min-height: 79px; padding: 13px 14px; border: 1px solid rgba(72, 67, 118, 0.1); border-radius: 15px; background: rgba(250, 250, 255, 0.72); cursor: pointer; transition: border-color 0.23s ease, background 0.23s ease, transform 0.23s ease, box-shadow 0.23s ease; } .ydd-contact-v2__goal:hover { border-color: rgba(109, 86, 244, 0.22); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.075), rgba(18, 199, 209, 0.045) ); transform: translateY(-1px); } .ydd-contact-v2__goal:has(input:checked) { border-color: rgba(109, 86, 244, 0.28); background: linear-gradient( 135deg, rgba(109, 86, 244, 0.12), rgba(18, 199, 209, 0.07) ); box-shadow: 0 10px 23px rgba(68, 55, 142, 0.08); } .ydd-contact-v2__goal > input { position: absolute; opacity: 0; pointer-events: none; } .ydd-contact-v2__goal-check { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid rgba(109, 86, 244, 0.15); border-radius: 10px; color: transparent; background: #fff; } .ydd-contact-v2__goal-check svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__goal:has(input:checked) .ydd-contact-v2__goal-check { border-color: transparent; color: #fff; background: linear-gradient( 135deg, var(--ydd-green), var(--ydd-cyan) ); } .ydd-contact-v2__goal strong, .ydd-contact-v2__goal small { display: block; } .ydd-contact-v2__goal strong { margin-bottom: 4px; color: var(--ydd-ink); font-size: 13px; } .ydd-contact-v2__goal small { color: var(--ydd-muted); font-size: 10px; line-height: 1.4; } \/* FIELDS *\/ .ydd-contact-v2__details-grid, .ydd-contact-v2__contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 20px; } .ydd-contact-v2__field { display: grid; gap: 8px; } .ydd-contact-v2__field--full { grid-column: 1 \/ -1; } .ydd-contact-v2__field > span { color: #4d556b; font-size: 12px; font-weight: 750; } .ydd-contact-v2__field em { color: #d84f72; font-style: normal; } .ydd-contact-v2__field input, .ydd-contact-v2__field select, .ydd-contact-v2__field textarea { width: 100%; min-height: 51px; padding: 0 14px; border: 1px solid rgba(72, 67, 118, 0.13) !important; border-radius: 13px; outline: none !important; color: var(--ydd-ink) !important; background: rgba(250, 250, 255, 0.82) !important; box-shadow: none !important; font-size: 13px !important; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .ydd-contact-v2__field textarea { min-height: 148px; padding-top: 13px; resize: vertical; line-height: 1.6; } .ydd-contact-v2__field input:focus, .ydd-contact-v2__field select:focus, .ydd-contact-v2__field textarea:focus { border-color: rgba(109, 86, 244, 0.45) !important; background: #fff !important; box-shadow: 0 0 0 4px rgba(109, 86, 244, 0.075) !important; } .ydd-contact-v2__field > small { color: var(--ydd-muted); font-size: 10px; line-height: 1.45; } \/* SUMMARY *\/ .ydd-contact-v2__summary-card { margin-top: 17px; padding: 18px; border: 1px solid rgba(109, 86, 244, 0.12); border-radius: 17px; background: linear-gradient( 135deg, rgba(109, 86, 244, 0.07), rgba(18, 199, 209, 0.045) ); } .ydd-contact-v2__summary-heading { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; } .ydd-contact-v2__summary-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; color: #fff; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ); } .ydd-contact-v2__summary-icon svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__summary-heading small, .ydd-contact-v2__summary-heading strong { display: block; } .ydd-contact-v2__summary-heading small { margin-bottom: 3px; color: var(--ydd-purple); font-size: 9px; font-weight: 800; text-transform: uppercase; } .ydd-contact-v2__summary-heading strong { color: var(--ydd-ink); font-size: 14px; } .ydd-contact-v2__summary-goals { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; } .ydd-contact-v2__summary-goals span { padding: 7px 10px; border: 1px solid rgba(109, 86, 244, 0.11); border-radius: 999px; color: #626a80; background: rgba(255, 255, 255, 0.73); font-size: 9px; font-weight: 750; } .ydd-contact-v2__final-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 18px; } .ydd-contact-v2__final-summary > div { padding: 14px; border: 1px solid rgba(72, 67, 118, 0.09); border-radius: 14px; background: rgba(249, 249, 254, 0.74); } .ydd-contact-v2__final-summary small, .ydd-contact-v2__final-summary strong { display: block; } .ydd-contact-v2__final-summary small { margin-bottom: 5px; color: var(--ydd-muted); font-size: 9px; text-transform: uppercase; } .ydd-contact-v2__final-summary strong { color: var(--ydd-ink); font-size: 12px; line-height: 1.4; } \/* CONSENT *\/ .ydd-contact-v2__consent { position: relative; display: grid; grid-template-columns: 29px minmax(0, 1fr); align-items: flex-start; gap: 11px; margin-top: 16px; padding: 14px; border: 1px solid rgba(72, 67, 118, 0.1); border-radius: 14px; color: #646c81; background: rgba(249, 249, 254, 0.72); font-size: 11px; line-height: 1.55; cursor: pointer; } .ydd-contact-v2__consent > input { position: absolute; opacity: 0; pointer-events: none; } .ydd-contact-v2__consent-check { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid rgba(109, 86, 244, 0.16); border-radius: 9px; color: transparent; background: #fff; } .ydd-contact-v2__consent-check svg { width: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__consent:has(input:checked) .ydd-contact-v2__consent-check { border-color: transparent; color: #fff; background: linear-gradient( 135deg, var(--ydd-green), var(--ydd-cyan) ); } \/* ACTIONS *\/ .ydd-contact-v2__step-actions { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 20px; } .ydd-contact-v2__required-note { color: var(--ydd-muted); font-size: 11px; } .ydd-contact-v2__next-button, .ydd-contact-v2__submit-button { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 55px; padding: 0 20px; border: 1px solid transparent !important; border-radius: 14px; color: #fff !important; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ) !important; box-shadow: 0 13px 28px rgba(93, 72, 223, 0.25) !important; font-size: 12px; font-weight: 800; cursor: pointer; transition: transform 0.24s ease, box-shadow 0.24s ease, background 0.24s ease; } .ydd-contact-v2__next-button:hover, .ydd-contact-v2__submit-button:hover { color: #fff !important; background: linear-gradient( 135deg, #7c63ff, #38a3e9 ) !important; box-shadow: 0 18px 36px rgba(93, 72, 223, 0.34) !important; transform: translateY(-2px); } .ydd-contact-v2__next-button svg, .ydd-contact-v2__submit-button svg, .ydd-contact-v2__back-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__back-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 51px; padding: 0 17px; border: 1px solid rgba(109, 86, 244, 0.15) !important; border-radius: 13px; color: var(--ydd-purple-deep) !important; background: rgba(109, 86, 244, 0.065) !important; box-shadow: none !important; font-size: 12px; font-weight: 780; cursor: pointer; transition: border-color 0.22s ease, background 0.22s ease, transform 0.22s ease; } .ydd-contact-v2__back-button:hover { border-color: rgba(109, 86, 244, 0.28) !important; color: var(--ydd-purple-deep) !important; background: linear-gradient( 135deg, rgba(109, 86, 244, 0.12), rgba(18, 199, 209, 0.07) ) !important; transform: translateY(-1px); } .ydd-contact-v2__submit-button[disabled] { opacity: 0.72; cursor: wait; transform: none; } .ydd-contact-v2__submit-loader { display: none; width: 17px; height: 17px; border: 2px solid rgba(255, 255, 255, 0.35); border-top-color: #fff; border-radius: 50%; animation: yddContactSpin 0.8s linear infinite; } .ydd-contact-v2__submit-button.is-loading .ydd-contact-v2__submit-loader { display: block; } .ydd-contact-v2__submit-button.is-loading > svg { display: none; } @keyframes yddContactSpin { to { transform: rotate(360deg); } } .ydd-contact-v2__privacy-note { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 14px; color: var(--ydd-muted); font-size: 9px; text-align: center; } .ydd-contact-v2__privacy-note svg { width: 14px; fill: none; stroke: var(--ydd-green); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } \/* FLOATING CARDS *\/ .ydd-contact-v2__floating-status, .ydd-contact-v2__floating-confidence { position: absolute; z-index: 8; display: flex; align-items: center; gap: 12px; border: 1px solid rgba(109, 86, 244, 0.14); border-radius: 18px; background: rgba(255, 255, 255, 0.94); box-shadow: 0 19px 45px rgba(51, 45, 100, 0.14); backdrop-filter: blur(18px); } .ydd-contact-v2__floating-status { top: 4px; right: -20px; min-width: 230px; padding: 15px 17px; animation: yddFloatStatus 5s ease-in-out infinite; } .ydd-contact-v2__floating-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 14px; color: #fff; background: linear-gradient( 135deg, var(--ydd-purple), var(--ydd-blue) ); } .ydd-contact-v2__floating-icon svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__floating-status small, .ydd-contact-v2__floating-status strong, .ydd-contact-v2__floating-confidence small, .ydd-contact-v2__floating-confidence strong { display: block; } .ydd-contact-v2__floating-status small, .ydd-contact-v2__floating-confidence small { color: var(--ydd-muted); font-size: 9px; } .ydd-contact-v2__floating-status strong, .ydd-contact-v2__floating-confidence strong { margin-top: 3px; color: var(--ydd-ink); font-size: 12px; } .ydd-contact-v2__live-dot { width: 8px; height: 8px; margin-left: auto; border-radius: 50%; background: var(--ydd-green); box-shadow: 0 0 0 5px rgba(36, 200, 155, 0.11); } .ydd-contact-v2__floating-confidence { right: 13px; bottom: 0; min-width: 245px; padding: 15px 17px; animation: yddFloatConfidence 5.8s ease-in-out infinite; } .ydd-contact-v2__floating-confidence > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; color: #fff; background: linear-gradient( 135deg, var(--ydd-green), var(--ydd-cyan) ); } .ydd-contact-v2__floating-confidence svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; } @keyframes yddFloatStatus { 50% { transform: translateY(-9px) rotate(1deg); } } @keyframes yddFloatConfidence { 50% { transform: translateY(8px) rotate(-1deg); } } \/* SUCCESS *\/ .ydd-contact-v2__success { padding: 45px 25px; text-align: center; animation: yddContactStepIn 0.55s cubic-bezier(0.22, 1, 0.36, 1); } .ydd-contact-v2__success-icon { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 20px; border-radius: 50%; color: #fff; background: linear-gradient( 135deg, var(--ydd-green), var(--ydd-cyan) ); box-shadow: 0 16px 34px rgba(36, 200, 155, 0.26); } .ydd-contact-v2__success-icon svg { width: 34px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ydd-contact-v2__success-label { color: var(--ydd-purple); font-size: 10px; font-weight: 850; letter-spacing: 0.11em; text-transform: uppercase; } .ydd-contact-v2__success h2 { max-width: 620px; margin: 12px auto 0; color: var(--ydd-ink); font-size: clamp(31px, 3.4vw, 48px); line-height: 1.12; letter-spacing: -0.04em; } .ydd-contact-v2__success > p { max-width: 590px; margin: 17px auto 0; color: var(--ydd-text); font-size: 15px; line-height: 1.7; } .ydd-contact-v2__reference { display: inline-flex; align-items: center; gap: 10px; margin-top: 22px; padding: 12px 16px; border: 1px solid rgba(109, 86, 244, 0.13); border-radius: 13px; background: rgba(109, 86, 244, 0.06); } .ydd-contact-v2__reference span { color: var(--ydd-muted); font-size: 10px; text-transform: uppercase; } .ydd-contact-v2__reference strong { color: var(--ydd-purple-deep); font-size: 13px; } .ydd-contact-v2__success-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin-top: 28px; } .ydd-contact-v2__success-steps > div { padding: 17px; border: 1px solid rgba(72, 67, 118, 0.09); border-radius: 15px; background: rgba(249, 249, 254, 0.73); } .ydd-contact-v2__success-steps span { display: grid; place-items: center; width: 34px; height: 34px; margin: 0 auto 10px; border-radius: 11px; color: var(--ydd-purple); background: rgba(109, 86, 244, 0.08); font-size: 9px; font-weight: 850; } .ydd-contact-v2__success-steps strong, .ydd-contact-v2__success-steps small { display: block; } .ydd-contact-v2__success-steps strong { color: var(--ydd-ink); font-size: 12px; } .ydd-contact-v2__success-steps small { margin-top: 5px; color: var(--ydd-muted); font-size: 10px; line-height: 1.45; } .ydd-contact-v2__restart-button { min-height: 48px; margin-top: 24px; padding: 0 18px; border: 1px solid rgba(109, 86, 244, 0.17) !important; border-radius: 13px; color: var(--ydd-purple-deep) !important; background: rgba(109, 86, 244, 0.07) !important; font-size: 11px; font-weight: 800; cursor: pointer; } \/* ========================================================= RESPONSIVE ========================================================== *\/ @media (max-width: 1240px) { .ydd-contact-v2__container { grid-template-columns: 1fr; width: min(920px, 100%); } .ydd-contact-v2__intro { max-width: 790px; margin: 0 auto; text-align: center; } .ydd-contact-v2__lead, .ydd-contact-v2__description, .ydd-contact-v2__benefits { margin-right: auto; margin-left: auto; } .ydd-contact-v2__markets { justify-content: center; } .ydd-contact-v2__planner-wrap { width: min(880px, 100%); margin: 0 auto; } } @media (max-width: 780px) { .ydd-contact-v2 { padding-right: 15px; padding-left: 15px; } .ydd-contact-v2__intro { text-align: left; } .ydd-contact-v2__title { font-size: clamp(42px, 12vw, 61px); } .ydd-contact-v2__response { margin-left: 0; } .ydd-contact-v2__markets { justify-content: flex-start; } .ydd-contact-v2__planner-wrap { padding-top: 70px; } .ydd-contact-v2__planner { min-height: 0; padding: 24px 17px; border-radius: 23px; } .ydd-contact-v2__planner-header { flex-direction: column; } .ydd-contact-v2__step-counter { position: absolute; top: 19px; right: 17px; width: 58px; height: 58px; } .ydd-contact-v2__planner-header h2 { padding-right: 64px; font-size: 29px; } .ydd-contact-v2__progress-nav { display: flex; overflow-x: auto; scrollbar-width: none; } .ydd-contact-v2__progress-nav::-webkit-scrollbar { display: none; } .ydd-contact-v2__progress-item { flex: 0 0 165px; } .ydd-contact-v2__project-grid, .ydd-contact-v2__goals-grid, .ydd-contact-v2__details-grid, .ydd-contact-v2__contact-grid { grid-template-columns: 1fr; } .ydd-contact-v2__project-card { min-height: 105px; } .ydd-contact-v2__field--full { grid-column: auto; } .ydd-contact-v2__final-summary, .ydd-contact-v2__success-steps { grid-template-columns: 1fr; } .ydd-contact-v2__step-actions { align-items: stretch; flex-direction: column-reverse; } .ydd-contact-v2__next-button, .ydd-contact-v2__submit-button, .ydd-contact-v2__back-button { width: 100%; } .ydd-contact-v2__required-note { text-align: center; } .ydd-contact-v2__floating-status { right: 2px; } .ydd-contact-v2__floating-confidence { right: 5px; } } @media (max-width: 500px) { .ydd-contact-v2__eyebrow { font-size: 8px; } .ydd-contact-v2__title { font-size: clamp(39px, 12vw, 53px); } .ydd-contact-v2__benefit { grid-template-columns: 42px minmax(0, 1fr); } .ydd-contact-v2__start-button { width: 100%; } .ydd-contact-v2__response { display: flex; } .ydd-contact-v2__markets { align-items: flex-start; } .ydd-contact-v2__markets > div { flex-direction: column; gap: 6px; } .ydd-contact-v2__markets > div span::after { display: none; } .ydd-contact-v2__project-card { grid-template-columns: 46px minmax(0, 1fr) 27px; gap: 10px; padding: 13px; } .ydd-contact-v2__project-icon { width: 46px; height: 46px; } .ydd-contact-v2__recommendation { grid-template-columns: 1fr; } .ydd-contact-v2__floating-confidence { display: none; } } \/* ACCESSIBILITY *\/ .ydd-contact-v2 button:focus-visible, .ydd-contact-v2 input:focus-visible, .ydd-contact-v2 select:focus-visible, .ydd-contact-v2 textarea:focus-visible, .ydd-contact-v2 label:has(input:focus-visible) { outline: 3px solid rgba(18, 199, 209, 0.5) !important; outline-offset: 3px; } @media (prefers-reduced-motion: reduce) { .ydd-contact-v2 *, .ydd-contact-v2 *::before, .ydd-contact-v2 *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } .ydd-contact-v2__intro, .ydd-contact-v2__planner-wrap { opacity: 1; transform: none; } } \r\n\/* =========================================================\r\n   CRISP TEXT \/ NO RASTERIZED FORM LAYERS\r\n   This block intentionally comes last so it overrides the\r\n   earlier 3D, blur, transform, and undersized text rules.\r\n========================================================== *\/\r\n\r\n.ydd-contact-v2 {\r\n    --ydd-text: #4f576d;\r\n    --ydd-muted: #687086;\r\n    text-rendering: optimizeLegibility;\r\n    -webkit-font-smoothing: auto;\r\n    -moz-osx-font-smoothing: auto;\r\n}\r\n\r\n\/* Keep every text-bearing parent on the normal 2D paint path. *\/\r\n.ydd-contact-v2__intro,\r\n.ydd-contact-v2__planner-wrap,\r\n.ydd-contact-v2__planner,\r\n.ydd-contact-v2__form,\r\n.ydd-contact-v2__step,\r\n.ydd-contact-v2__floating-status,\r\n.ydd-contact-v2__floating-confidence,\r\n.ydd-contact-v2__eyebrow {\r\n    -webkit-transform: none !important;\r\n    transform: none !important;\r\n    transform-style: flat !important;\r\n    perspective: none !important;\r\n    will-change: auto !important;\r\n    filter: none !important;\r\n}\r\n\r\n\/* Remove backdrop blur from all containers that hold text. *\/\r\n.ydd-contact-v2__planner,\r\n.ydd-contact-v2__floating-status,\r\n.ydd-contact-v2__floating-confidence,\r\n.ydd-contact-v2__eyebrow {\r\n    -webkit-backdrop-filter: none !important;\r\n    backdrop-filter: none !important;\r\n}\r\n\r\n.ydd-contact-v2__planner {\r\n    background:\r\n        radial-gradient(\r\n            circle at 100% 0%,\r\n            rgba(109, 86, 244, 0.07),\r\n            transparent 34%\r\n        ),\r\n        #ffffff !important;\r\n}\r\n\r\n.ydd-contact-v2__floating-status,\r\n.ydd-contact-v2__floating-confidence,\r\n.ydd-contact-v2__eyebrow {\r\n    background: rgba(255, 255, 255, 0.985) !important;\r\n}\r\n\r\n\/* Opacity-only entrance animations preserve sharp glyph rendering. *\/\r\n.ydd-contact-v2__intro,\r\n.ydd-contact-v2__planner-wrap {\r\n    opacity: 1 !important;\r\n}\r\n\r\n.ydd-contact-v2.is-visible .ydd-contact-v2__intro {\r\n    animation: yddContactCrispFade 0.55s ease both !important;\r\n}\r\n\r\n.ydd-contact-v2.is-visible .ydd-contact-v2__planner-wrap {\r\n    animation: yddContactCrispFade 0.65s 0.08s ease both !important;\r\n}\r\n\r\n.ydd-contact-v2__step {\r\n    animation: yddContactCrispStep 0.3s ease both !important;\r\n}\r\n\r\n@keyframes yddContactCrispFade {\r\n    from { opacity: 0; }\r\n    to { opacity: 1; }\r\n}\r\n\r\n@keyframes yddContactCrispStep {\r\n    from { opacity: 0; }\r\n    to { opacity: 1; }\r\n}\r\n\r\n\/* Do not animate entire text cards with transforms. *\/\r\n.ydd-contact-v2__benefit:hover,\r\n.ydd-contact-v2__project-card:hover,\r\n.ydd-contact-v2__goal:hover,\r\n.ydd-contact-v2__start-button:hover,\r\n.ydd-contact-v2__next-button:hover,\r\n.ydd-contact-v2__submit-button:hover,\r\n.ydd-contact-v2__back-button:hover,\r\n.ydd-contact-v2__restart-button:hover,\r\n.ydd-contact-v2__planner-wrap:hover .ydd-contact-v2__planner {\r\n    -webkit-transform: none !important;\r\n    transform: none !important;\r\n}\r\n\r\n\/* Floating cards stay crisp instead of moving on a rasterized layer. *\/\r\n.ydd-contact-v2__floating-status,\r\n.ydd-contact-v2__floating-confidence {\r\n    animation: none !important;\r\n}\r\n\r\n\/* Standard font weights avoid synthetic fractional-weight softness. *\/\r\n.ydd-contact-v2__title,\r\n.ydd-contact-v2__planner-header h2,\r\n.ydd-contact-v2__success h2 {\r\n    font-weight: 700 !important;\r\n}\r\n\r\n.ydd-contact-v2__eyebrow,\r\n.ydd-contact-v2__planner-label,\r\n.ydd-contact-v2__legend,\r\n.ydd-contact-v2__project-copy strong,\r\n.ydd-contact-v2__recommendation h3,\r\n.ydd-contact-v2__goal strong,\r\n.ydd-contact-v2__field > span,\r\n.ydd-contact-v2__next-button,\r\n.ydd-contact-v2__submit-button,\r\n.ydd-contact-v2__back-button,\r\n.ydd-contact-v2__start-button {\r\n    font-weight: 700 !important;\r\n}\r\n\r\n\/* =========================================================\r\n   LARGER, DARKER SMALL TEXT\r\n========================================================== *\/\r\n\r\n.ydd-contact-v2__eyebrow {\r\n    font-size: 12px !important;\r\n}\r\n\r\n.ydd-contact-v2__lead {\r\n    color: #4f576d !important;\r\n}\r\n\r\n.ydd-contact-v2__description {\r\n    color: #5e667c !important;\r\n    font-size: 16px !important;\r\n}\r\n\r\n.ydd-contact-v2__benefit strong {\r\n    font-size: 15px !important;\r\n}\r\n\r\n.ydd-contact-v2__benefit p {\r\n    color: #626a80 !important;\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__response strong {\r\n    color: #41495f !important;\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__response p {\r\n    color: #687086 !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__markets > div span {\r\n    color: #5e667c !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__planner-label {\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__planner-header p {\r\n    color: #596178 !important;\r\n    font-size: 15px !important;\r\n}\r\n\r\n.ydd-contact-v2__step-counter span,\r\n.ydd-contact-v2__step-counter small {\r\n    color: #61697f !important;\r\n    font-size: 9px !important;\r\n}\r\n\r\n.ydd-contact-v2__progress-item small {\r\n    color: #656d82 !important;\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__progress-item strong {\r\n    color: #4e566c !important;\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__legend {\r\n    font-size: 18px !important;\r\n}\r\n\r\n.ydd-contact-v2__field-help {\r\n    color: #60687e !important;\r\n    font-size: 14px !important;\r\n}\r\n\r\n.ydd-contact-v2__project-copy small {\r\n    color: #626a80 !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__project-copy strong {\r\n    color: #4d556b !important;\r\n    font-size: 16px !important;\r\n}\r\n\r\n.ydd-contact-v2__project-copy p {\r\n    color: #626a80 !important;\r\n    font-size: 13px !important;\r\n    line-height: 1.5 !important;\r\n}\r\n\r\n.ydd-contact-v2__recommendation small {\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__recommendation h3 {\r\n    font-size: 18px !important;\r\n    line-height: 1.42 !important;\r\n}\r\n\r\n.ydd-contact-v2__recommendation p {\r\n    color: #566078 !important;\r\n    font-size: 14px !important;\r\n}\r\n\r\n.ydd-contact-v2__recommendation-tags span,\r\n.ydd-contact-v2__summary-goals span {\r\n    color: #50596f !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__goal strong {\r\n    font-size: 14px !important;\r\n}\r\n\r\n.ydd-contact-v2__goal small {\r\n    color: #5e667d !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__field > span {\r\n    color: #414a61 !important;\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__field input,\r\n.ydd-contact-v2__field select,\r\n.ydd-contact-v2__field textarea {\r\n    color: #171c31 !important;\r\n    background: #ffffff !important;\r\n    font-size: 14px !important;\r\n}\r\n\r\n.ydd-contact-v2__field input::placeholder,\r\n.ydd-contact-v2__field textarea::placeholder {\r\n    color: #747c91 !important;\r\n    opacity: 1 !important;\r\n}\r\n\r\n.ydd-contact-v2__field > small {\r\n    color: #626a80 !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__summary-heading small {\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__summary-heading strong {\r\n    font-size: 15px !important;\r\n}\r\n\r\n.ydd-contact-v2__final-summary small {\r\n    color: #626a80 !important;\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__final-summary strong {\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__consent {\r\n    color: #505970 !important;\r\n    font-size: 12px !important;\r\n}\r\n\r\n.ydd-contact-v2__required-note {\r\n    color: #5f687e !important;\r\n    font-size: 12px !important;\r\n}\r\n\r\n.ydd-contact-v2__next-button,\r\n.ydd-contact-v2__submit-button,\r\n.ydd-contact-v2__back-button,\r\n.ydd-contact-v2__start-button {\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__privacy-note {\r\n    color: #626a80 !important;\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__floating-status small,\r\n.ydd-contact-v2__floating-confidence small {\r\n    color: #626a80 !important;\r\n    font-size: 10px !important;\r\n}\r\n\r\n.ydd-contact-v2__floating-status strong,\r\n.ydd-contact-v2__floating-confidence strong {\r\n    color: #242a40 !important;\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__success-label {\r\n    font-size: 11px !important;\r\n}\r\n\r\n.ydd-contact-v2__success > p {\r\n    color: #4f576d !important;\r\n    font-size: 16px !important;\r\n}\r\n\r\n.ydd-contact-v2__success-steps strong {\r\n    font-size: 13px !important;\r\n}\r\n\r\n.ydd-contact-v2__success-steps small {\r\n    color: #626a80 !important;\r\n    font-size: 11px !important;\r\n}\r\n\r\n\/* Never inherit theme filters or text effects inside the form. *\/\r\n.ydd-contact-v2__planner *,\r\n.ydd-contact-v2__intro * {\r\n    text-shadow: none !important;\r\n}\r\n\r\n<\/style> <script> (function () { \"use strict\"; function initializeContactSection(section) { if (!section || section.dataset.initialized === \"true\") { return; } section.dataset.initialized = \"true\"; const form = section.querySelector(\"[data-project-form]\"); const plannerWrap = section.querySelector(\"[data-planner-wrap]\"); const planner = section.querySelector(\".ydd-contact-v2__planner\"); const steps = Array.from(section.querySelectorAll(\"[data-step]\")); const progressItems = Array.from( section.querySelectorAll(\"[data-progress-item]\") ); const nextButtons = Array.from( section.querySelectorAll(\"[data-next-step]\") ); const backButtons = Array.from( section.querySelectorAll(\"[data-back-step]\") ); const projectInputs = Array.from( section.querySelectorAll('input[name=\"project_type\"]') ); const goalInputs = Array.from( section.querySelectorAll('input[name=\"goals[]\"]') ); const stepNumber = section.querySelector(\"[data-step-number]\"); const stepHeading = section.querySelector(\"[data-step-heading]\"); const stepDescription = section.querySelector( \"[data-step-description]\" ); const progressBar = section.querySelector(\"[data-progress-bar]\"); const notice = section.querySelector(\"[data-form-notice]\"); const summaryProject = section.querySelector( \"[data-summary-project]\" ); const summaryGoals = section.querySelector(\"[data-summary-goals]\"); const finalProject = section.querySelector(\"[data-final-project]\"); const finalGoalCount = section.querySelector( \"[data-final-goal-count]\" ); const recommendationTitle = section.querySelector( \"[data-recommendation-title]\" ); const recommendationDescription = section.querySelector( \"[data-recommendation-description]\" ); const tagOne = section.querySelector(\"[data-tag-one]\"); const tagTwo = section.querySelector(\"[data-tag-two]\"); const tagThree = section.querySelector(\"[data-tag-three]\"); const submitButton = section.querySelector(\"[data-submit-button]\"); const submitText = section.querySelector(\"[data-submit-text]\"); const successState = section.querySelector(\"[data-success-state]\"); const referenceNumber = section.querySelector( \"[data-reference-number]\" ); const restartButton = section.querySelector(\"[data-restart-form]\"); const startPlannerButton = section.querySelector( \"[data-start-planner]\" ); let currentStep = 1; const headings = { 1: { title: \"What would you like us to help you build?\", description: \"Select the project type that most closely matches what brought you here.\" }, 2: { title: \"What should this project accomplish?\", description: \"Choose your priorities and give us an idea of the intended budget, timeline, and market.\" }, 3: { title: \"Where should we send our response?\", description: \"Complete your contact information and tell us a little more about the project.\" } }; const recommendations = { \"New website\": { title: \"Begin with your audience, message, and essential customer journey.\", description: \"We will examine what visitors should understand, trust, and do before recommending the ideal pages, content, design direction, and technology.\", tags: [ \"Website strategy\", \"Customer journey\", \"Content structure\" ] }, \"Website redesign or improvement\": { title: \"Identify what is working and what is holding the current website back.\", description: \"We can review the design, mobile experience, messaging, speed, structure, and conversion path before prioritizing the improvements most likely to create value.\", tags: [ \"Website review\", \"Conversion improvements\", \"Modern redesign\" ] }, \"Online store or e-commerce\": { title: \"Plan the complete journey from product discovery to fulfilled order.\", description: \"We will consider products, categories, checkout, payments, shipping, customer accounts, notifications, and how your team will manage the store.\", tags: [ \"Product experience\", \"Secure checkout\", \"Order workflow\" ] }, \"Automation or business system\": { title: \"Map the current workflow before selecting the technology.\", description: \"We will identify repetitive work, disconnected information, delays, and opportunities to connect your forms, payments, messages, records, and internal tasks.\", tags: [ \"Workflow mapping\", \"System integration\", \"Smart automation\" ] }, \"Customer or staff portal\": { title: \"Define who needs access, what they should see, and what they should be able to do.\", description: \"We can organize user roles, dashboards, records, courses, documents, communication, and secure access into a clear portal experience.\", tags: [ \"User access\", \"Private dashboards\", \"Secure information\" ] }, \"Other custom project\": { title: \"Start with the challenge even when the final solution is not yet clear.\", description: \"Explain the opportunity, difficulty, or idea you are considering. We will help turn it into clear requirements and practical next steps.\", tags: [ \"Idea exploration\", \"Strategic guidance\", \"Custom solution\" ] } }; function getSelectedProject() { const selected = projectInputs.find(function (input) { return input.checked; }); return selected ? selected.value : \"\"; } function getSelectedGoals() { return goalInputs .filter(function (input) { return input.checked; }) .map(function (input) { return input.value; }); } function showNotice(message) { if (!notice) { return; } notice.textContent = message; notice.hidden = false; notice.scrollIntoView({ behavior: \"smooth\", block: \"nearest\" }); } function clearNotice() { if (!notice) { return; } notice.hidden = true; notice.textContent = \"\"; } function updateRecommendation() { const project = getSelectedProject(); if (!project || !recommendations[project]) { return; } const recommendation = recommendations[project]; recommendationTitle.textContent = recommendation.title; recommendationDescription.textContent = recommendation.description; tagOne.textContent = recommendation.tags[0]; tagTwo.textContent = recommendation.tags[1]; tagThree.textContent = recommendation.tags[2]; updateSummary(); } function updateSummary() { const project = getSelectedProject(); const goals = getSelectedGoals(); if (summaryProject) { summaryProject.textContent = project || \"Choose a project type in Step 1\"; } if (finalProject) { finalProject.textContent = project || \"Project not selected\"; } if (finalGoalCount) { finalGoalCount.textContent = goals.length + (goals.length === 1 ? \" project goal\" : \" project goals\"); } if (summaryGoals) { summaryGoals.innerHTML = \"\"; if (!goals.length) { const empty = document.createElement(\"span\"); empty.textContent = \"No goals selected yet\"; summaryGoals.appendChild(empty); } else { goals.forEach(function (goal) { const badge = document.createElement(\"span\"); badge.textContent = goal; summaryGoals.appendChild(badge); }); } } } function validateStep(step) { clearNotice(); if (step === 1 && !getSelectedProject()) { showNotice( \"Please choose the project type that most closely matches your inquiry.\" ); return false; } if (step === 2 && getSelectedGoals().length === 0) { showNotice( \"Please select at least one goal for your project.\" ); return false; } if (step === 3) { const requiredFields = Array.from( form.querySelectorAll( '[data-step=\"3\"] input[required], [data-step=\"3\"] textarea[required]' ) ); const invalidField = requiredFields.find(function (field) { return !field.checkValidity(); }); if (invalidField) { invalidField.reportValidity(); invalidField.focus(); return false; } } return true; } function goToStep(step) { currentStep = Math.max(1, Math.min(3, step)); clearNotice(); steps.forEach(function (stepElement) { const isActive = Number(stepElement.dataset.step) === currentStep; stepElement.hidden = !isActive; stepElement.classList.toggle(\"is-active\", isActive); }); progressItems.forEach(function (item) { const itemStep = Number(item.dataset.progressItem); item.classList.toggle( \"is-active\", itemStep === currentStep ); item.classList.toggle( \"is-complete\", itemStep < currentStep ); }); if (stepNumber) { stepNumber.textContent = String(currentStep).padStart(2, \"0\"); } if (stepHeading) { stepHeading.textContent = headings[currentStep].title; } if (stepDescription) { stepDescription.textContent = headings[currentStep].description; } if (progressBar) { progressBar.style.width = currentStep === 1 ? \"33.333%\" : currentStep === 2 ? \"66.666%\" : \"100%\"; } updateSummary(); planner.scrollIntoView({ behavior: \"smooth\", block: \"nearest\" }); } projectInputs.forEach(function (input) { input.addEventListener(\"change\", updateRecommendation); }); goalInputs.forEach(function (input) { input.addEventListener(\"change\", updateSummary); }); nextButtons.forEach(function (button) { button.addEventListener(\"click\", function () { if (!validateStep(currentStep)) { return; } goToStep(currentStep + 1); }); }); backButtons.forEach(function (button) { button.addEventListener(\"click\", function () { goToStep(currentStep - 1); }); }); if (startPlannerButton) { startPlannerButton.addEventListener(\"click\", function () { planner.scrollIntoView({ behavior: \"smooth\", block: \"center\" }); window.setTimeout(function () { const firstProject = projectInputs[0]; if (firstProject) { firstProject.focus(); } }, 500); }); } form.addEventListener(\"submit\", async function (event) { event.preventDefault(); if (!validateStep(3)) { return; } clearNotice(); submitButton.disabled = true; submitButton.classList.add(\"is-loading\"); submitText.textContent = \"Sending your inquiry...\"; try { const formData = new FormData(form); const response = await fetch( section.dataset.ajaxUrl, { method: \"POST\", credentials: \"same-origin\", body: formData } ); const result = await response.json(); if (!response.ok || !result.success) { throw new Error( result && result.data && result.data.message ? result.data.message : \"Your inquiry could not be sent. Please try again.\" ); } form.hidden = true; successState.hidden = false; if ( referenceNumber && result.data && result.data.reference ) { referenceNumber.textContent = result.data.reference; } successState.scrollIntoView({ behavior: \"smooth\", block: \"center\" }); } catch (error) { showNotice( error.message || \"Your inquiry could not be sent. Please try again.\" ); } finally { submitButton.disabled = false; submitButton.classList.remove(\"is-loading\"); submitText.textContent = \"Send my project inquiry\"; } }); if (restartButton) { restartButton.addEventListener(\"click\", function () { form.reset(); form.hidden = false; successState.hidden = true; recommendationTitle.textContent = \"Select a project type to receive a tailored starting recommendation.\"; recommendationDescription.textContent = \"Your selection will help us prepare the next part of your project brief.\"; tagOne.textContent = \"Project strategy\"; tagTwo.textContent = \"Clear priorities\"; tagThree.textContent = \"Practical planning\"; goToStep(1); }); } \/* Crisp-text version: the pointer-driven 3D tilt was intentionally removed so form text always remains on the browser's normal 2D text-rendering path. *\/ if (\"IntersectionObserver\" in window) { const observer = new IntersectionObserver( function (entries) { entries.forEach(function (entry) { if (entry.isIntersecting) { section.classList.add(\"is-visible\"); observer.disconnect(); } }); }, { threshold: 0.12 } ); observer.observe(section); } else { section.classList.add(\"is-visible\"); } updateSummary(); } document .querySelectorAll(\"[data-ydd-contact]\") .forEach(initializeContactSection); })(); <\/script> \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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d62a797 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"d62a797\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d39ef0e\" data-id=\"d39ef0e\" data-element_type=\"column\" data-e-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-8e5f7ca elementor-widget elementor-widget-html\" data-id=\"8e5f7ca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n    <section\r\n        class=\"ydd-contact-channels\"\r\n        id=\"ydd-contact-channels-2\"\r\n        data-ydd-contact-channels\r\n    >\r\n\r\n        <!-- Decorative background -->\r\n\r\n        <div class=\"ydd-contact-channels__grid\"><\/div>\r\n\r\n        <div\r\n            class=\"ydd-contact-channels__glow\r\n            ydd-contact-channels__glow--purple\"\r\n        ><\/div>\r\n\r\n        <div\r\n            class=\"ydd-contact-channels__glow\r\n            ydd-contact-channels__glow--cyan\"\r\n        ><\/div>\r\n\r\n\r\n        <div class=\"ydd-contact-channels__container\">\r\n\r\n            <!-- =================================================\r\n                 SECTION INTRODUCTION\r\n            ================================================== -->\r\n\r\n            <div class=\"ydd-contact-channels__heading\">\r\n\r\n                <div class=\"ydd-contact-channels__eyebrow\">\r\n                    <span><\/span>\r\n                    Continue the conversation\r\n                <\/div>\r\n\r\n                <div class=\"ydd-contact-channels__heading-grid\">\r\n\r\n                    <div>\r\n                        <h2>\r\n                            Choose the right team.\r\n                            <span>Reach us directly.<\/span>\r\n                        <\/h2>\r\n                    <\/div>\r\n\r\n                    <div class=\"ydd-contact-channels__intro-copy\">\r\n\r\n                        <p>\r\n                            Whether you are preparing to begin a new project,\r\n                            following up on an active implementation, or simply\r\n                            prefer to speak with us through LINE, you can connect\r\n                            directly with the team best prepared to assist you.\r\n                        <\/p>\r\n\r\n                        <div class=\"ydd-contact-channels__availability\">\r\n\r\n                            <span class=\"ydd-contact-channels__live-dot\"><\/span>\r\n\r\n                            <div>\r\n                                <strong>\r\n                                    Direct and carefully routed communication\r\n                                <\/strong>\r\n\r\n                                <small>\r\n                                    Choose a contact method below and your\r\n                                    message will reach the appropriate team.\r\n                                <\/small>\r\n                            <\/div>\r\n\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- =================================================\r\n                 CONTACT CHANNEL CARDS\r\n            ================================================== -->\r\n\r\n            <div class=\"ydd-contact-channels__cards\">\r\n\r\n                <!-- SALES -->\r\n\r\n                <article\r\n                    class=\"ydd-contact-channels__card\r\n                    ydd-contact-channels__card--sales\"\r\n                >\r\n\r\n                    <div class=\"ydd-contact-channels__card-top\">\r\n\r\n                        <span class=\"ydd-contact-channels__icon\">\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M4 4h16v16H4z\"><\/path>\r\n                                <path d=\"m4 7 8 6 8-6\"><\/path>\r\n                            <\/svg>\r\n\r\n                        <\/span>\r\n\r\n                        <span class=\"ydd-contact-channels__badge\">\r\n                            Best for new projects\r\n                        <\/span>\r\n\r\n                    <\/div>\r\n\r\n                    <span class=\"ydd-contact-channels__card-label\">\r\n                        Sales and proposals\r\n                    <\/span>\r\n\r\n                    <h3>\r\n                        Project Strategy &\r\n                        Proposal Follow-Up\r\n                    <\/h3>\r\n\r\n                    <p>\r\n                        This is the best place to continue a new project\r\n                        conversation. Our sales team will review your inquiry,\r\n                        clarify your goals, answer initial questions, and guide\r\n                        you through the next steps.\r\n                    <\/p>\r\n\r\n                    <p class=\"ydd-contact-channels__secondary-copy\">\r\n                        This address is also used to prepare tailored proposals,\r\n                        discuss project scope, confirm requirements, and explain\r\n                        recommended pricing and timelines.\r\n                    <\/p>\r\n\r\n                    <div class=\"ydd-contact-channels__address\">\r\n\r\n                        <span>\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M4 4h16v16H4z\"><\/path>\r\n                                <path d=\"m4 7 8 6 8-6\"><\/path>\r\n                            <\/svg>\r\n                        <\/span>\r\n\r\n                        <div>\r\n                            <small>Sales email<\/small>\r\n\r\n                            <strong>\r\n                                sales@yourdigitaldesigns.com                            <\/strong>\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                    <div class=\"ydd-contact-channels__actions\">\r\n\r\n                        <a\r\n                            href=\"mailto:sales@yourdigitaldesigns.com?subject=Project inquiry and proposal follow-up\"\r\n                            class=\"ydd-contact-channels__primary-button\"\r\n                        >\r\n                            Email our sales team\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M5 12h14\"><\/path>\r\n                                <path d=\"m13 6 6 6-6 6\"><\/path>\r\n                            <\/svg>\r\n                        <\/a>\r\n\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"ydd-contact-channels__copy-button\"\r\n                            data-copy-value=\"sales@yourdigitaldesigns.com\"\r\n                            data-copy-default=\"Copy email\"\r\n                        >\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <rect\r\n                                    x=\"8\"\r\n                                    y=\"8\"\r\n                                    width=\"12\"\r\n                                    height=\"12\"\r\n                                    rx=\"2\"\r\n                                ><\/rect>\r\n\r\n                                <path\r\n                                    d=\"M16 8V6a2 2 0 0 0-2-2H6\r\n                                    a2 2 0 0 0-2 2v8\r\n                                    a2 2 0 0 0 2 2h2\"\r\n                                ><\/path>\r\n                            <\/svg>\r\n\r\n                            <span>Copy email<\/span>\r\n                        <\/button>\r\n\r\n                    <\/div>\r\n\r\n                <\/article>\r\n\r\n\r\n                <!-- IT -->\r\n\r\n                <article\r\n                    class=\"ydd-contact-channels__card\r\n                    ydd-contact-channels__card--it\"\r\n                >\r\n\r\n                    <div class=\"ydd-contact-channels__card-top\">\r\n\r\n                        <span class=\"ydd-contact-channels__icon\">\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <circle cx=\"12\" cy=\"12\" r=\"3\"><\/circle>\r\n\r\n                                <path d=\"M12 2v4\"><\/path>\r\n                                <path d=\"M12 18v4\"><\/path>\r\n                                <path d=\"M2 12h4\"><\/path>\r\n                                <path d=\"M18 12h4\"><\/path>\r\n\r\n                                <path\r\n                                    d=\"m4.93 4.93\r\n                                    2.83 2.83\"\r\n                                ><\/path>\r\n\r\n                                <path\r\n                                    d=\"m16.24 16.24\r\n                                    2.83 2.83\"\r\n                                ><\/path>\r\n\r\n                                <path\r\n                                    d=\"m19.07 4.93\r\n                                    -2.83 2.83\"\r\n                                ><\/path>\r\n\r\n                                <path\r\n                                    d=\"m7.76 16.24\r\n                                    -2.83 2.83\"\r\n                                ><\/path>\r\n                            <\/svg>\r\n\r\n                        <\/span>\r\n\r\n                        <span class=\"ydd-contact-channels__badge\">\r\n                            Best for active work\r\n                        <\/span>\r\n\r\n                    <\/div>\r\n\r\n                    <span class=\"ydd-contact-channels__card-label\">\r\n                        Technical assistance\r\n                    <\/span>\r\n\r\n                    <h3>\r\n                        IT Support &\r\n                        Project Follow-Up\r\n                    <\/h3>\r\n\r\n                    <p>\r\n                        Use this channel for technical questions, implementation\r\n                        follow-up, website access, system connections, reported\r\n                        issues, or assistance relating to an existing project.\r\n                    <\/p>\r\n\r\n                    <p class=\"ydd-contact-channels__secondary-copy\">\r\n                        Providing the website address, project name, and a clear\r\n                        description of the issue will help our technical team\r\n                        review your request more efficiently.\r\n                    <\/p>\r\n\r\n                    <div class=\"ydd-contact-channels__address\">\r\n\r\n                        <span>\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M4 4h16v16H4z\"><\/path>\r\n                                <path d=\"m4 7 8 6 8-6\"><\/path>\r\n                            <\/svg>\r\n                        <\/span>\r\n\r\n                        <div>\r\n                            <small>IT follow-up email<\/small>\r\n\r\n                            <strong>\r\n                                it@yourdigitaldesigns.com                            <\/strong>\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                    <div class=\"ydd-contact-channels__actions\">\r\n\r\n                        <a\r\n                            href=\"mailto:it@yourdigitaldesigns.com?subject=Technical support and project follow-up\"\r\n                            class=\"ydd-contact-channels__primary-button\"\r\n                        >\r\n                            Contact our IT team\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M5 12h14\"><\/path>\r\n                                <path d=\"m13 6 6 6-6 6\"><\/path>\r\n                            <\/svg>\r\n                        <\/a>\r\n\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"ydd-contact-channels__copy-button\"\r\n                            data-copy-value=\"it@yourdigitaldesigns.com\"\r\n                            data-copy-default=\"Copy email\"\r\n                        >\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <rect\r\n                                    x=\"8\"\r\n                                    y=\"8\"\r\n                                    width=\"12\"\r\n                                    height=\"12\"\r\n                                    rx=\"2\"\r\n                                ><\/rect>\r\n\r\n                                <path\r\n                                    d=\"M16 8V6a2 2 0 0 0-2-2H6\r\n                                    a2 2 0 0 0-2 2v8\r\n                                    a2 2 0 0 0 2 2h2\"\r\n                                ><\/path>\r\n                            <\/svg>\r\n\r\n                            <span>Copy email<\/span>\r\n                        <\/button>\r\n\r\n                    <\/div>\r\n\r\n                <\/article>\r\n\r\n\r\n                <!-- LINE -->\r\n\r\n                <article\r\n                    class=\"ydd-contact-channels__card\r\n                    ydd-contact-channels__card--line\"\r\n                >\r\n\r\n                    <div class=\"ydd-contact-channels__card-top\">\r\n\r\n                        <span class=\"ydd-contact-channels__icon\">\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path\r\n                                    d=\"M21 11.5\r\n                                    c0 4.7-4.3 8.5-9.5 8.5\r\n                                    a10.7 10.7 0 0 1-3.1-.5\r\n                                    L3 22l1.6-4.5\r\n                                    A8 8 0 0 1 2 11.5\r\n                                    C2 6.8 6.3 3 11.5 3\r\n                                    S21 6.8 21 11.5z\"\r\n                                ><\/path>\r\n                            <\/svg>\r\n\r\n                        <\/span>\r\n\r\n                        <span class=\"ydd-contact-channels__badge\">\r\n                            Convenient in Thailand\r\n                        <\/span>\r\n\r\n                    <\/div>\r\n\r\n                    <span class=\"ydd-contact-channels__card-label\">\r\n                        LINE communication\r\n                    <\/span>\r\n\r\n                    <h3>\r\n                        Quick Questions &\r\n                        Local Coordination\r\n                    <\/h3>\r\n\r\n                    <p>\r\n                        Prefer LINE? Connect with us for convenient local\r\n                        communication, meeting coordination, brief questions,\r\n                        or to let us know that you have submitted a project\r\n                        inquiry.\r\n                    <\/p>\r\n\r\n                    <p class=\"ydd-contact-channels__secondary-copy\">\r\n                        For detailed project requirements, formal proposals, or\r\n                        technical reports, we may continue the conversation by\r\n                        email so the information remains organized and easy to\r\n                        reference.\r\n                    <\/p>\r\n\r\n                    <div class=\"ydd-contact-channels__address\">\r\n\r\n                        <span class=\"ydd-contact-channels__line-mark\">\r\n                            LINE\r\n                        <\/span>\r\n\r\n                        <div>\r\n                            <small>Official LINE account<\/small>\r\n\r\n                            <strong>\r\n                                @YourDigitalDesigns                            <\/strong>\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                    <div class=\"ydd-contact-channels__actions\">\r\n\r\n                        <a\r\n                            href=\"https:\/\/line.me\/ti\/p\/~YOUR_LINE_ID\"\r\n                            class=\"ydd-contact-channels__primary-button\"\r\n                            target=\"_blank\"\r\n                            rel=\"noopener noreferrer\"\r\n                        >\r\n                            Open our LINE account\r\n\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <path d=\"M5 12h14\"><\/path>\r\n                                <path d=\"m13 6 6 6-6 6\"><\/path>\r\n                            <\/svg>\r\n                        <\/a>\r\n\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"ydd-contact-channels__copy-button\"\r\n                            data-copy-value=\"@YourDigitalDesigns\"\r\n                            data-copy-default=\"Copy LINE ID\"\r\n                        >\r\n                            <svg\r\n                                viewBox=\"0 0 24 24\"\r\n                                aria-hidden=\"true\"\r\n                            >\r\n                                <rect\r\n                                    x=\"8\"\r\n                                    y=\"8\"\r\n                                    width=\"12\"\r\n                                    height=\"12\"\r\n                                    rx=\"2\"\r\n                                ><\/rect>\r\n\r\n                                <path\r\n                                    d=\"M16 8V6a2 2 0 0 0-2-2H6\r\n                                    a2 2 0 0 0-2 2v8\r\n                                    a2 2 0 0 0 2 2h2\"\r\n                                ><\/path>\r\n                            <\/svg>\r\n\r\n                            <span>Copy LINE ID<\/span>\r\n                        <\/button>\r\n\r\n                    <\/div>\r\n\r\n                <\/article>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- =================================================\r\n                 BOTTOM GUIDANCE BAR\r\n            ================================================== -->\r\n\r\n            <div class=\"ydd-contact-channels__guidance\">\r\n\r\n                <span class=\"ydd-contact-channels__guidance-icon\">\r\n\r\n                    <svg\r\n                        viewBox=\"0 0 24 24\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n                        <path d=\"M9 18h6\"><\/path>\r\n                        <path d=\"M10 22h4\"><\/path>\r\n\r\n                        <path\r\n                            d=\"M8.5 14.5\r\n                            A7 7 0 1 1 15.5 14.5\r\n                            c-.9.7-1.5 1.4-1.5 2.5h-4\r\n                            c0-1.1-.6-1.8-1.5-2.5z\"\r\n                        ><\/path>\r\n                    <\/svg>\r\n\r\n                <\/span>\r\n\r\n                <div class=\"ydd-contact-channels__guidance-copy\">\r\n\r\n                    <small>Not sure which option to use?<\/small>\r\n\r\n                    <strong>\r\n                        Begin with our Sales and Proposals team.\r\n                    <\/strong>\r\n\r\n                    <p>\r\n                        They can review your message and ensure it reaches the\r\n                        correct person if technical assistance or another form\r\n                        of follow-up is required.\r\n                    <\/p>\r\n\r\n                <\/div>\r\n\r\n                <a\r\n                    href=\"mailto:sales@yourdigitaldesigns.com?subject=Project inquiry and proposal follow-up\"\r\n                    class=\"ydd-contact-channels__guidance-button\"\r\n                >\r\n                    Start with sales\r\n\r\n                    <svg\r\n                        viewBox=\"0 0 24 24\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n                        <path d=\"M5 12h14\"><\/path>\r\n                        <path d=\"m13 6 6 6-6 6\"><\/path>\r\n                    <\/svg>\r\n                <\/a>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div\r\n                class=\"ydd-contact-channels__copy-status\"\r\n                data-copy-status\r\n                role=\"status\"\r\n                aria-live=\"polite\"\r\n            ><\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/section>\r\n\r\n\r\n    <style>\r\n    \/* =========================================================\r\n       FOUNDATION\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels {\r\n        --ydd-channels-ink: #11162b;\r\n        --ydd-channels-text: #596177;\r\n        --ydd-channels-muted: #72798d;\r\n        --ydd-channels-purple: #6d56f4;\r\n        --ydd-channels-purple-deep: #533de0;\r\n        --ydd-channels-blue: #438ee8;\r\n        --ydd-channels-cyan: #12c7d1;\r\n        --ydd-channels-green: #20bf8f;\r\n        --ydd-channels-border: rgba(72, 67, 118, 0.13);\r\n\r\n        position: relative;\r\n        isolation: isolate;\r\n        overflow: hidden;\r\n\r\n        width: 100vw;\r\n        margin-left: calc(50% - 50vw);\r\n\r\n        padding:\r\n            clamp(88px, 8vw, 130px)\r\n            22px\r\n            clamp(90px, 8vw, 130px);\r\n\r\n        color: var(--ydd-channels-ink);\r\n\r\n        background:\r\n            radial-gradient(\r\n                circle at 8% 8%,\r\n                rgba(109, 86, 244, 0.15),\r\n                transparent 30%\r\n            ),\r\n            radial-gradient(\r\n                circle at 94% 91%,\r\n                rgba(18, 199, 209, 0.15),\r\n                transparent 31%\r\n            ),\r\n            linear-gradient(\r\n                135deg,\r\n                #f8f7ff 0%,\r\n                #ffffff 48%,\r\n                #f2fdff 100%\r\n            );\r\n\r\n        font-family:\r\n            Inter,\r\n            -apple-system,\r\n            BlinkMacSystemFont,\r\n            \"Segoe UI\",\r\n            sans-serif;\r\n\r\n        text-rendering: optimizeLegibility;\r\n    }\r\n\r\n    .ydd-contact-channels *,\r\n    .ydd-contact-channels *::before,\r\n    .ydd-contact-channels *::after {\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .ydd-contact-channels a,\r\n    .ydd-contact-channels button {\r\n        font-family: inherit;\r\n    }\r\n\r\n    .ydd-contact-channels__container {\r\n        position: relative;\r\n        z-index: 4;\r\n\r\n        width: min(1460px, 100%);\r\n        margin: 0 auto;\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       DECORATIVE BACKGROUND\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels__grid {\r\n        position: absolute;\r\n        inset: 0;\r\n\r\n        opacity: 0.5;\r\n        pointer-events: none;\r\n\r\n        background-image:\r\n            linear-gradient(\r\n                rgba(85, 72, 165, 0.035) 1px,\r\n                transparent 1px\r\n            ),\r\n            linear-gradient(\r\n                90deg,\r\n                rgba(85, 72, 165, 0.035) 1px,\r\n                transparent 1px\r\n            );\r\n\r\n        background-size: 50px 50px;\r\n\r\n        mask-image:\r\n            linear-gradient(\r\n                to bottom,\r\n                transparent,\r\n                #000 12%,\r\n                #000 88%,\r\n                transparent\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__glow {\r\n        position: absolute;\r\n\r\n        border-radius: 50%;\r\n        pointer-events: none;\r\n\r\n        filter: blur(28px);\r\n\r\n        animation:\r\n            yddChannelsGlow\r\n            13s\r\n            ease-in-out\r\n            infinite;\r\n    }\r\n\r\n    .ydd-contact-channels__glow--purple {\r\n        top: -220px;\r\n        left: -170px;\r\n\r\n        width: 470px;\r\n        height: 470px;\r\n\r\n        background:\r\n            radial-gradient(\r\n                circle,\r\n                rgba(111, 85, 246, 0.25),\r\n                transparent 70%\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__glow--cyan {\r\n        right: -190px;\r\n        bottom: -220px;\r\n\r\n        width: 500px;\r\n        height: 500px;\r\n\r\n        background:\r\n            radial-gradient(\r\n                circle,\r\n                rgba(13, 205, 210, 0.22),\r\n                transparent 70%\r\n            );\r\n\r\n        animation-delay: -6s;\r\n    }\r\n\r\n    @keyframes yddChannelsGlow {\r\n        50% {\r\n            transform: translate3d(22px, -18px, 0)\r\n                scale(1.07);\r\n        }\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       HEADING\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels__heading {\r\n        animation:\r\n            yddChannelsFadeIn\r\n            0.75s\r\n            ease\r\n            both;\r\n    }\r\n\r\n    @keyframes yddChannelsFadeIn {\r\n        from {\r\n            opacity: 0;\r\n        }\r\n\r\n        to {\r\n            opacity: 1;\r\n        }\r\n    }\r\n\r\n    .ydd-contact-channels__eyebrow {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n\r\n        margin-bottom: 25px;\r\n        padding: 10px 15px;\r\n\r\n        border: 1px solid rgba(109, 86, 244, 0.16);\r\n        border-radius: 999px;\r\n\r\n        color: var(--ydd-channels-purple-deep);\r\n        background: #ffffff;\r\n\r\n        box-shadow:\r\n            0 10px 28px\r\n            rgba(70, 56, 143, 0.07);\r\n\r\n        font-size: 11px;\r\n        font-weight: 800;\r\n        letter-spacing: 0.13em;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ydd-contact-channels__eyebrow > span {\r\n        position: relative;\r\n\r\n        width: 9px;\r\n        height: 9px;\r\n\r\n        border-radius: 50%;\r\n\r\n        background: var(--ydd-channels-green);\r\n\r\n        box-shadow:\r\n            0 0 0 5px\r\n            rgba(32, 191, 143, 0.12);\r\n    }\r\n\r\n    .ydd-contact-channels__eyebrow > span::after {\r\n        content: \"\";\r\n\r\n        position: absolute;\r\n        inset: -5px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(32, 191, 143, 0.46);\r\n\r\n        border-radius: inherit;\r\n\r\n        animation:\r\n            yddChannelsPulse\r\n            2.3s\r\n            ease-out\r\n            infinite;\r\n    }\r\n\r\n    @keyframes yddChannelsPulse {\r\n        0% {\r\n            opacity: 0.7;\r\n            transform: scale(0.7);\r\n        }\r\n\r\n        80%,\r\n        100% {\r\n            opacity: 0;\r\n            transform: scale(1.9);\r\n        }\r\n    }\r\n\r\n    .ydd-contact-channels__heading-grid {\r\n        display: grid;\r\n        grid-template-columns:\r\n            minmax(0, 1fr)\r\n            minmax(400px, 0.72fr);\r\n\r\n        align-items: end;\r\n        gap: clamp(45px, 7vw, 105px);\r\n    }\r\n\r\n    .ydd-contact-channels__heading h2 {\r\n        max-width: 850px;\r\n        margin: 0;\r\n\r\n        color: var(--ydd-channels-ink);\r\n\r\n        font-size:\r\n            clamp(48px, 5.1vw, 78px);\r\n\r\n        font-weight: 700;\r\n        line-height: 1;\r\n        letter-spacing: -0.055em;\r\n    }\r\n\r\n    .ydd-contact-channels__heading h2 span {\r\n        display: block;\r\n        margin-top: 10px;\r\n\r\n        color: transparent;\r\n\r\n        background:\r\n            linear-gradient(\r\n                90deg,\r\n                #6c53f4,\r\n                #795df7 30%,\r\n                #468be6 68%,\r\n                #0ec2ca\r\n            );\r\n\r\n        background-size: 185% auto;\r\n\r\n        -webkit-background-clip: text;\r\n        background-clip: text;\r\n\r\n        animation:\r\n            yddChannelsGradientText\r\n            7s\r\n            ease-in-out\r\n            infinite;\r\n    }\r\n\r\n    @keyframes yddChannelsGradientText {\r\n        50% {\r\n            background-position: 100% 50%;\r\n        }\r\n    }\r\n\r\n    .ydd-contact-channels__intro-copy > p {\r\n        margin: 0;\r\n\r\n        color: var(--ydd-channels-text);\r\n\r\n        font-size: 17px;\r\n        line-height: 1.72;\r\n    }\r\n\r\n    .ydd-contact-channels__availability {\r\n        display: grid;\r\n        grid-template-columns: 12px minmax(0, 1fr);\r\n        align-items: flex-start;\r\n        gap: 12px;\r\n\r\n        margin-top: 22px;\r\n        padding: 16px;\r\n\r\n        border: 1px solid var(--ydd-channels-border);\r\n        border-radius: 15px;\r\n\r\n        background: #ffffff;\r\n    }\r\n\r\n    .ydd-contact-channels__live-dot {\r\n        position: relative;\r\n\r\n        width: 10px;\r\n        height: 10px;\r\n        margin-top: 5px;\r\n\r\n        border-radius: 50%;\r\n\r\n        background: var(--ydd-channels-green);\r\n\r\n        box-shadow:\r\n            0 0 0 6px\r\n            rgba(32, 191, 143, 0.1);\r\n    }\r\n\r\n    .ydd-contact-channels__availability strong,\r\n    .ydd-contact-channels__availability small {\r\n        display: block;\r\n    }\r\n\r\n    .ydd-contact-channels__availability strong {\r\n        margin-bottom: 4px;\r\n\r\n        color: #40485e;\r\n\r\n        font-size: 13px;\r\n    }\r\n\r\n    .ydd-contact-channels__availability small {\r\n        color: var(--ydd-channels-muted);\r\n\r\n        font-size: 12px;\r\n        line-height: 1.5;\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       CONTACT CARDS\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels__cards {\r\n        display: grid;\r\n        grid-template-columns: repeat(3, 1fr);\r\n        gap: 18px;\r\n\r\n        margin-top: 58px;\r\n    }\r\n\r\n    .ydd-contact-channels__card {\r\n        position: relative;\r\n\r\n        display: flex;\r\n        flex-direction: column;\r\n\r\n        min-width: 0;\r\n        min-height: 610px;\r\n        padding: clamp(24px, 2.3vw, 34px);\r\n\r\n        border: 1px solid var(--ydd-channels-border);\r\n        border-radius: 25px;\r\n\r\n        background: #ffffff;\r\n\r\n        box-shadow:\r\n            0 24px 58px\r\n            rgba(48, 43, 96, 0.1);\r\n\r\n        transition:\r\n            border-color 0.25s ease,\r\n            box-shadow 0.25s ease,\r\n            background 0.25s ease;\r\n    }\r\n\r\n    .ydd-contact-channels__card::before {\r\n        content: \"\";\r\n\r\n        position: absolute;\r\n        top: 0;\r\n        right: 0;\r\n        left: 0;\r\n\r\n        height: 5px;\r\n\r\n        border-radius: 25px 25px 0 0;\r\n\r\n        background:\r\n            linear-gradient(\r\n                90deg,\r\n                var(--ydd-channels-purple),\r\n                var(--ydd-channels-blue),\r\n                var(--ydd-channels-cyan)\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__card:hover {\r\n        border-color:\r\n            rgba(109, 86, 244, 0.29);\r\n\r\n        background:\r\n            linear-gradient(\r\n                180deg,\r\n                #ffffff,\r\n                #fbfbff\r\n            );\r\n\r\n        box-shadow:\r\n            0 31px 72px\r\n            rgba(48, 43, 96, 0.15);\r\n    }\r\n\r\n    .ydd-contact-channels__card--it::before {\r\n        background:\r\n            linear-gradient(\r\n                90deg,\r\n                #5e73eb,\r\n                #449ce6,\r\n                #17c6d1\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__card--line::before {\r\n        background:\r\n            linear-gradient(\r\n                90deg,\r\n                #20b987,\r\n                #21c9a4,\r\n                #14c4d2\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__card-top {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: space-between;\r\n        gap: 15px;\r\n    }\r\n\r\n    .ydd-contact-channels__icon {\r\n        display: grid;\r\n        place-items: center;\r\n\r\n        width: 58px;\r\n        height: 58px;\r\n\r\n        border-radius: 17px;\r\n\r\n        color: #ffffff;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                var(--ydd-channels-purple),\r\n                var(--ydd-channels-blue)\r\n            );\r\n\r\n        box-shadow:\r\n            0 13px 28px\r\n            rgba(109, 86, 244, 0.24);\r\n    }\r\n\r\n    .ydd-contact-channels__card--it\r\n    .ydd-contact-channels__icon {\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #5075ea,\r\n                #2dafe0\r\n            );\r\n    }\r\n\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__icon {\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #22b987,\r\n                #17c9ae\r\n            );\r\n\r\n        box-shadow:\r\n            0 13px 28px\r\n            rgba(32, 191, 143, 0.22);\r\n    }\r\n\r\n    .ydd-contact-channels__icon svg {\r\n        width: 27px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.8;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n    .ydd-contact-channels__badge {\r\n        padding: 8px 11px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(109, 86, 244, 0.13);\r\n\r\n        border-radius: 999px;\r\n\r\n        color: var(--ydd-channels-purple-deep);\r\n        background: rgba(109, 86, 244, 0.07);\r\n\r\n        font-size: 10px;\r\n        font-weight: 700;\r\n        text-align: center;\r\n    }\r\n\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__badge {\r\n        border-color:\r\n            rgba(32, 191, 143, 0.17);\r\n\r\n        color: #168064;\r\n        background:\r\n            rgba(32, 191, 143, 0.08);\r\n    }\r\n\r\n    .ydd-contact-channels__card-label {\r\n        display: block;\r\n\r\n        margin-top: 27px;\r\n\r\n        color: var(--ydd-channels-purple);\r\n\r\n        font-size: 11px;\r\n        font-weight: 800;\r\n        letter-spacing: 0.11em;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__card-label {\r\n        color: #168569;\r\n    }\r\n\r\n    .ydd-contact-channels__card h3 {\r\n        margin: 10px 0 0;\r\n\r\n        color: var(--ydd-channels-ink);\r\n\r\n        font-size: clamp(27px, 2.2vw, 35px);\r\n        font-weight: 700;\r\n        line-height: 1.15;\r\n        letter-spacing: -0.035em;\r\n    }\r\n\r\n    .ydd-contact-channels__card > p {\r\n        margin: 20px 0 0;\r\n\r\n        color: var(--ydd-channels-text);\r\n\r\n        font-size: 15px;\r\n        line-height: 1.68;\r\n    }\r\n\r\n    .ydd-contact-channels__card\r\n    .ydd-contact-channels__secondary-copy {\r\n        margin-top: 13px;\r\n\r\n        color: var(--ydd-channels-muted);\r\n\r\n        font-size: 13px;\r\n        line-height: 1.62;\r\n    }\r\n\r\n    .ydd-contact-channels__address {\r\n        display: grid;\r\n        grid-template-columns: 43px minmax(0, 1fr);\r\n        align-items: center;\r\n        gap: 12px;\r\n\r\n        margin-top: auto;\r\n        padding: 15px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(72, 67, 118, 0.1);\r\n\r\n        border-radius: 15px;\r\n\r\n        background: #f8f8fd;\r\n    }\r\n\r\n    .ydd-contact-channels__address > span {\r\n        display: grid;\r\n        place-items: center;\r\n\r\n        width: 43px;\r\n        height: 43px;\r\n\r\n        border-radius: 13px;\r\n\r\n        color: var(--ydd-channels-purple);\r\n\r\n        background:\r\n            rgba(109, 86, 244, 0.09);\r\n    }\r\n\r\n    .ydd-contact-channels__address > span svg {\r\n        width: 20px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.8;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n    .ydd-contact-channels__address\r\n    .ydd-contact-channels__line-mark {\r\n        color: #ffffff;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #21b987,\r\n                #13c9ad\r\n            );\r\n\r\n        font-size: 9px;\r\n        font-weight: 800;\r\n    }\r\n\r\n    .ydd-contact-channels__address small,\r\n    .ydd-contact-channels__address strong {\r\n        display: block;\r\n        overflow-wrap: anywhere;\r\n    }\r\n\r\n    .ydd-contact-channels__address small {\r\n        margin-bottom: 4px;\r\n\r\n        color: var(--ydd-channels-muted);\r\n\r\n        font-size: 10px;\r\n        font-weight: 700;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ydd-contact-channels__address strong {\r\n        color: #424a60;\r\n\r\n        font-size: 14px;\r\n        line-height: 1.4;\r\n    }\r\n\r\n    .ydd-contact-channels__actions {\r\n        display: grid;\r\n        grid-template-columns:\r\n            minmax(0, 1fr)\r\n            auto;\r\n\r\n        gap: 10px;\r\n        margin-top: 14px;\r\n    }\r\n\r\n    .ydd-contact-channels__primary-button {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 10px;\r\n\r\n        min-height: 53px;\r\n        padding: 0 17px;\r\n\r\n        border: 1px solid transparent;\r\n        border-radius: 14px;\r\n\r\n        color: #ffffff !important;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                var(--ydd-channels-purple),\r\n                var(--ydd-channels-blue)\r\n            ) !important;\r\n\r\n        box-shadow:\r\n            0 13px 27px\r\n            rgba(93, 72, 223, 0.24);\r\n\r\n        font-size: 13px;\r\n        font-weight: 800;\r\n\r\n        text-align: center;\r\n        text-decoration: none !important;\r\n\r\n        transition:\r\n            background 0.23s ease,\r\n            box-shadow 0.23s ease;\r\n    }\r\n\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__primary-button {\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #21b987,\r\n                #19bfc9\r\n            ) !important;\r\n\r\n        box-shadow:\r\n            0 13px 27px\r\n            rgba(32, 191, 143, 0.23);\r\n    }\r\n\r\n    .ydd-contact-channels__primary-button:hover,\r\n    .ydd-contact-channels__primary-button:focus {\r\n        color: #ffffff !important;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #7d63ff,\r\n                #38a3e9\r\n            ) !important;\r\n\r\n        box-shadow:\r\n            0 17px 34px\r\n            rgba(93, 72, 223, 0.32);\r\n    }\r\n\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__primary-button:hover,\r\n    .ydd-contact-channels__card--line\r\n    .ydd-contact-channels__primary-button:focus {\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #2bc895,\r\n                #1cc8d0\r\n            ) !important;\r\n    }\r\n\r\n    .ydd-contact-channels__primary-button svg {\r\n        width: 18px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.8;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n    .ydd-contact-channels__copy-button {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 8px;\r\n\r\n        min-height: 53px;\r\n        padding: 0 14px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(109, 86, 244, 0.17) !important;\r\n\r\n        border-radius: 14px;\r\n\r\n        color:\r\n            var(--ydd-channels-purple-deep) !important;\r\n\r\n        background:\r\n            rgba(109, 86, 244, 0.065) !important;\r\n\r\n        box-shadow: none !important;\r\n\r\n        font-size: 11px;\r\n        font-weight: 700;\r\n\r\n        white-space: nowrap;\r\n        cursor: pointer;\r\n\r\n        transition:\r\n            border-color 0.23s ease,\r\n            background 0.23s ease;\r\n    }\r\n\r\n    .ydd-contact-channels__copy-button:hover,\r\n    .ydd-contact-channels__copy-button:focus {\r\n        border-color:\r\n            rgba(109, 86, 244, 0.32) !important;\r\n\r\n        color:\r\n            var(--ydd-channels-purple-deep) !important;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                rgba(109, 86, 244, 0.12),\r\n                rgba(18, 199, 209, 0.07)\r\n            ) !important;\r\n    }\r\n\r\n    .ydd-contact-channels__copy-button.is-copied {\r\n        border-color:\r\n            rgba(32, 191, 143, 0.25) !important;\r\n\r\n        color: #14785f !important;\r\n\r\n        background:\r\n            rgba(32, 191, 143, 0.1) !important;\r\n    }\r\n\r\n    .ydd-contact-channels__copy-button svg {\r\n        width: 16px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.8;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       GUIDANCE BAR\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels__guidance {\r\n        display: grid;\r\n        grid-template-columns:\r\n            58px\r\n            minmax(0, 1fr)\r\n            auto;\r\n\r\n        align-items: center;\r\n        gap: 18px;\r\n\r\n        margin-top: 20px;\r\n        padding: 22px 24px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(109, 86, 244, 0.16);\r\n\r\n        border-radius: 20px;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                #ffffff,\r\n                #f6f8ff\r\n            );\r\n\r\n        box-shadow:\r\n            0 18px 45px\r\n            rgba(48, 43, 96, 0.08);\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-icon {\r\n        display: grid;\r\n        place-items: center;\r\n\r\n        width: 58px;\r\n        height: 58px;\r\n\r\n        border-radius: 17px;\r\n\r\n        color: #ffffff;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                var(--ydd-channels-purple),\r\n                var(--ydd-channels-blue)\r\n            );\r\n\r\n        box-shadow:\r\n            0 12px 25px\r\n            rgba(109, 86, 244, 0.23);\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-icon svg {\r\n        width: 26px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.7;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-copy small,\r\n    .ydd-contact-channels__guidance-copy strong {\r\n        display: block;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-copy small {\r\n        margin-bottom: 4px;\r\n\r\n        color: var(--ydd-channels-purple);\r\n\r\n        font-size: 10px;\r\n        font-weight: 800;\r\n        letter-spacing: 0.08em;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-copy strong {\r\n        color: var(--ydd-channels-ink);\r\n\r\n        font-size: 17px;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-copy p {\r\n        margin: 6px 0 0;\r\n\r\n        color: var(--ydd-channels-text);\r\n\r\n        font-size: 13px;\r\n        line-height: 1.55;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-button {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 9px;\r\n\r\n        min-height: 50px;\r\n        padding: 0 17px;\r\n\r\n        border:\r\n            1px solid\r\n            rgba(109, 86, 244, 0.18);\r\n\r\n        border-radius: 13px;\r\n\r\n        color:\r\n            var(--ydd-channels-purple-deep) !important;\r\n\r\n        background:\r\n            rgba(109, 86, 244, 0.07) !important;\r\n\r\n        font-size: 12px;\r\n        font-weight: 800;\r\n\r\n        white-space: nowrap;\r\n        text-decoration: none !important;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-button:hover,\r\n    .ydd-contact-channels__guidance-button:focus {\r\n        color:\r\n            var(--ydd-channels-purple-deep) !important;\r\n\r\n        background:\r\n            linear-gradient(\r\n                135deg,\r\n                rgba(109, 86, 244, 0.13),\r\n                rgba(18, 199, 209, 0.08)\r\n            ) !important;\r\n    }\r\n\r\n    .ydd-contact-channels__guidance-button svg {\r\n        width: 17px;\r\n\r\n        fill: none;\r\n        stroke: currentColor;\r\n        stroke-width: 1.8;\r\n        stroke-linecap: round;\r\n        stroke-linejoin: round;\r\n    }\r\n\r\n    .ydd-contact-channels__copy-status {\r\n        min-height: 1px;\r\n\r\n        color: var(--ydd-channels-muted);\r\n\r\n        font-size: 12px;\r\n        text-align: center;\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       TABLET\r\n    ========================================================== *\/\r\n\r\n    @media (max-width: 1120px) {\r\n\r\n        .ydd-contact-channels__heading-grid {\r\n            grid-template-columns: 1fr;\r\n            gap: 28px;\r\n        }\r\n\r\n        .ydd-contact-channels__intro-copy {\r\n            max-width: 760px;\r\n        }\r\n\r\n        .ydd-contact-channels__cards {\r\n            grid-template-columns: 1fr;\r\n            max-width: 820px;\r\n            margin-right: auto;\r\n            margin-left: auto;\r\n        }\r\n\r\n        .ydd-contact-channels__card {\r\n            min-height: 0;\r\n        }\r\n\r\n        .ydd-contact-channels__address {\r\n            margin-top: 30px;\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       MOBILE\r\n    ========================================================== *\/\r\n\r\n    @media (max-width: 720px) {\r\n\r\n        .ydd-contact-channels {\r\n            padding-right: 15px;\r\n            padding-left: 15px;\r\n        }\r\n\r\n        .ydd-contact-channels__heading h2 {\r\n            font-size:\r\n                clamp(41px, 11.7vw, 59px);\r\n        }\r\n\r\n        .ydd-contact-channels__intro-copy > p {\r\n            font-size: 16px;\r\n        }\r\n\r\n        .ydd-contact-channels__cards {\r\n            margin-top: 40px;\r\n        }\r\n\r\n        .ydd-contact-channels__card {\r\n            padding: 24px 19px;\r\n            border-radius: 21px;\r\n        }\r\n\r\n        .ydd-contact-channels__card-top {\r\n            align-items: flex-start;\r\n            flex-direction: column;\r\n        }\r\n\r\n        .ydd-contact-channels__card h3 {\r\n            font-size: 29px;\r\n        }\r\n\r\n        .ydd-contact-channels__actions {\r\n            grid-template-columns: 1fr;\r\n        }\r\n\r\n        .ydd-contact-channels__primary-button,\r\n        .ydd-contact-channels__copy-button {\r\n            width: 100%;\r\n        }\r\n\r\n        .ydd-contact-channels__guidance {\r\n            grid-template-columns:\r\n                50px\r\n                minmax(0, 1fr);\r\n        }\r\n\r\n        .ydd-contact-channels__guidance-icon {\r\n            width: 50px;\r\n            height: 50px;\r\n        }\r\n\r\n        .ydd-contact-channels__guidance-button {\r\n            grid-column: 1 \/ -1;\r\n            width: 100%;\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       SMALL MOBILE\r\n    ========================================================== *\/\r\n\r\n    @media (max-width: 480px) {\r\n\r\n        .ydd-contact-channels__eyebrow {\r\n            font-size: 8px;\r\n        }\r\n\r\n        .ydd-contact-channels__heading h2 {\r\n            font-size:\r\n                clamp(38px, 12vw, 51px);\r\n        }\r\n\r\n        .ydd-contact-channels__availability {\r\n            grid-template-columns:\r\n                10px\r\n                minmax(0, 1fr);\r\n        }\r\n\r\n        .ydd-contact-channels__address {\r\n            grid-template-columns:\r\n                39px\r\n                minmax(0, 1fr);\r\n        }\r\n\r\n        .ydd-contact-channels__address > span {\r\n            width: 39px;\r\n            height: 39px;\r\n        }\r\n\r\n        .ydd-contact-channels__guidance {\r\n            grid-template-columns: 1fr;\r\n            text-align: left;\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       ACCESSIBILITY\r\n    ========================================================== *\/\r\n\r\n    .ydd-contact-channels a:focus-visible,\r\n    .ydd-contact-channels button:focus-visible {\r\n        outline:\r\n            3px solid\r\n            rgba(18, 199, 209, 0.52) !important;\r\n\r\n        outline-offset: 3px;\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       REDUCED MOTION\r\n    ========================================================== *\/\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n\r\n        .ydd-contact-channels *,\r\n        .ydd-contact-channels *::before,\r\n        .ydd-contact-channels *::after {\r\n            animation-duration: 0.01ms !important;\r\n            animation-iteration-count: 1 !important;\r\n            transition-duration: 0.01ms !important;\r\n        }\r\n\r\n    }\r\n    <\/style>\r\n\r\n\r\n    <script>\r\n    (function () {\r\n        \"use strict\";\r\n\r\n        function initializeContactChannels(section) {\r\n\r\n            if (\r\n                !section ||\r\n                section.dataset.initialized === \"true\"\r\n            ) {\r\n                return;\r\n            }\r\n\r\n            section.dataset.initialized = \"true\";\r\n\r\n            const copyButtons = Array.from(\r\n                section.querySelectorAll(\r\n                    \"[data-copy-value]\"\r\n                )\r\n            );\r\n\r\n            const status = section.querySelector(\r\n                \"[data-copy-status]\"\r\n            );\r\n\r\n\r\n            function fallbackCopy(value) {\r\n\r\n                const textarea =\r\n                    document.createElement(\"textarea\");\r\n\r\n                textarea.value = value;\r\n\r\n                textarea.setAttribute(\r\n                    \"readonly\",\r\n                    \"\"\r\n                );\r\n\r\n                textarea.style.position = \"fixed\";\r\n                textarea.style.opacity = \"0\";\r\n                textarea.style.pointerEvents = \"none\";\r\n\r\n                document.body.appendChild(textarea);\r\n\r\n                textarea.select();\r\n\r\n                const copied =\r\n                    document.execCommand(\"copy\");\r\n\r\n                document.body.removeChild(textarea);\r\n\r\n                return copied;\r\n            }\r\n\r\n\r\n            async function copyValue(value) {\r\n\r\n                if (\r\n                    navigator.clipboard &&\r\n                    window.isSecureContext\r\n                ) {\r\n                    await navigator.clipboard.writeText(\r\n                        value\r\n                    );\r\n\r\n                    return true;\r\n                }\r\n\r\n                return fallbackCopy(value);\r\n            }\r\n\r\n\r\n            copyButtons.forEach(function (button) {\r\n\r\n                button.addEventListener(\r\n                    \"click\",\r\n                    async function () {\r\n\r\n                        const value =\r\n                            button.dataset.copyValue;\r\n\r\n                        const textElement =\r\n                            button.querySelector(\"span\");\r\n\r\n                        const defaultText =\r\n                            button.dataset.copyDefault ||\r\n                            \"Copy\";\r\n\r\n                        try {\r\n\r\n                            const copied =\r\n                                await copyValue(value);\r\n\r\n                            if (!copied) {\r\n                                throw new Error(\r\n                                    \"Copy failed\"\r\n                                );\r\n                            }\r\n\r\n                            button.classList.add(\r\n                                \"is-copied\"\r\n                            );\r\n\r\n                            if (textElement) {\r\n                                textElement.textContent =\r\n                                    \"Copied\";\r\n                            }\r\n\r\n                            if (status) {\r\n                                status.textContent =\r\n                                    value +\r\n                                    \" copied to your clipboard.\";\r\n                            }\r\n\r\n                            window.setTimeout(\r\n                                function () {\r\n\r\n                                    button.classList.remove(\r\n                                        \"is-copied\"\r\n                                    );\r\n\r\n                                    if (textElement) {\r\n                                        textElement.textContent =\r\n                                            defaultText;\r\n                                    }\r\n\r\n                                    if (status) {\r\n                                        status.textContent = \"\";\r\n                                    }\r\n\r\n                                },\r\n                                1800\r\n                            );\r\n\r\n                        } catch (error) {\r\n\r\n                            if (status) {\r\n                                status.textContent =\r\n                                    \"Please copy this contact manually: \" +\r\n                                    value;\r\n                            }\r\n\r\n                        }\r\n\r\n                    }\r\n                );\r\n\r\n            });\r\n\r\n        }\r\n\r\n\r\n        document\r\n            .querySelectorAll(\r\n                \"[data-ydd-contact-channels]\"\r\n            )\r\n            .forEach(\r\n                initializeContactChannels\r\n            );\r\n\r\n    })();\r\n    <\/script>\r\n\r\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>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"nf_dc_page":"","om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-177","page","type-page","status-publish"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.9 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Contact Us - Your Digital Designs<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Contact Us - Your Digital Designs\" \/>\n<meta property=\"og:url\" content=\"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/\" \/>\n<meta property=\"og:site_name\" content=\"Your Digital Designs\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-30T15:45:04+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/contact-us\\\/\",\"url\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/contact-us\\\/\",\"name\":\"Contact Us - Your Digital Designs\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/#website\"},\"datePublished\":\"2026-06-30T15:14:40+00:00\",\"dateModified\":\"2026-06-30T15:45:04+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/contact-us\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[[\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/contact-us\\\/\"]]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/contact-us\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Contact Us\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/\",\"name\":\"Your Digital Designs\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/yourdigitaldesigns.com\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Contact Us - Your Digital Designs","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/","og_locale":"en_US","og_type":"article","og_title":"Contact Us - Your Digital Designs","og_url":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/","og_site_name":"Your Digital Designs","article_modified_time":"2026-06-30T15:45:04+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/","url":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/","name":"Contact Us - Your Digital Designs","isPartOf":{"@id":"https:\/\/yourdigitaldesigns.com\/en\/#website"},"datePublished":"2026-06-30T15:14:40+00:00","dateModified":"2026-06-30T15:45:04+00:00","breadcrumb":{"@id":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":[["https:\/\/yourdigitaldesigns.com\/en\/contact-us\/"]]}]},{"@type":"BreadcrumbList","@id":"https:\/\/yourdigitaldesigns.com\/en\/contact-us\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/yourdigitaldesigns.com\/en\/"},{"@type":"ListItem","position":2,"name":"Contact Us"}]},{"@type":"WebSite","@id":"https:\/\/yourdigitaldesigns.com\/en\/#website","url":"https:\/\/yourdigitaldesigns.com\/en\/","name":"Your Digital Designs","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/yourdigitaldesigns.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/pages\/177","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/comments?post=177"}],"version-history":[{"count":5,"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/pages\/177\/revisions"}],"predecessor-version":[{"id":189,"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/pages\/177\/revisions\/189"}],"wp:attachment":[{"href":"https:\/\/yourdigitaldesigns.com\/en\/wp-json\/wp\/v2\/media?parent=177"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}