{"id":525,"date":"2026-01-08T05:17:20","date_gmt":"2026-01-08T05:17:20","guid":{"rendered":"https:\/\/salmon-narwhal-351333.hostingersite.com\/?page_id=525"},"modified":"2026-04-20T19:07:47","modified_gmt":"2026-04-20T16:07:47","slug":"join-team","status":"publish","type":"page","link":"https:\/\/kana.com.sa\/en\/join-team\/","title":{"rendered":"\u0627\u0646\u0636\u0645 \u0644\u0634\u0631\u0643\u0627\u0621 \u0627\u0644\u0633\u0639\u0627\u062f\u0629"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\r\n
<\/div>\r\n\r\n
\r\n

Join the Happiness Team<\/h1>\r\n

\r\n Be part of our journey to empower creators and spread happiness through art\r\n <\/p>\r\n <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t
\n\t\t\t\t\t\r\n
\r\n
\r\n

Why join us?<\/h2>\r\n\r\n
\r\n \r\n
\r\n
\r\n <\/i>\r\n <\/div>\r\n

Be part of the change<\/h3>\r\n

Help build a more inclusive and accepting society<\/p>\r\n <\/div>\r\n\r\n \r\n

\r\n
\r\n <\/i>\r\n <\/div>\r\n

Develop your skills<\/h3>\r\n

Gain new experiences working with talented creatives<\/p>\r\n <\/div>\r\n\r\n \r\n

\r\n
\r\n <\/i>\r\n <\/div>\r\n

Spread happiness<\/h3>\r\n

Be a source of inspiration and joy for others through art<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u0646\u0645\u0648\u0630\u062c \u0627\u0644\u0627\u0646\u0636\u0645\u0627\u0645 - \u0643\u0646\u0649<\/title>\r\n <link\r\n href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\"\r\n rel=\"stylesheet\"\r\n \/>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'LamaSans-KANA', \"Arial\";\r\n background: #ffffff;\r\n padding: 0;\r\n margin: 0;\r\n }\r\n\r\n .form-section {\r\n padding: 80px 20px;\r\n background: #ffffff;\r\n }\r\n\r\n .form-container {\r\n max-width: 900px;\r\n margin: 0 auto;\r\n }\r\n\r\n .form-card {\r\n background: linear-gradient(135deg, rgba(51, 89, 167, 0.05) 0%, rgba(96, 188, 109, 0.05) 100%);\r\n border-radius: 24px;\r\n padding: 60px 50px;\r\n border: 1px solid rgba(51, 89, 167, 0.1);\r\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);\r\n }\r\n\r\n .form-header {\r\n text-align: center;\r\n margin-bottom: 40px;\r\n }\r\n\r\n .form-title {\r\n color: #3359a7;\r\n font-size: 32px;\r\n font-weight: bold;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .form-subtitle {\r\n color: rgba(0, 0, 0, 0.6);\r\n font-size: 16px;\r\n }\r\n\r\n .form-grid {\r\n display: grid;\r\n gap: 30px;\r\n }\r\n\r\n .form-row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 24px;\r\n }\r\n\r\n .form-row-3 {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr 1fr;\r\n gap: 24px;\r\n }\r\n\r\n .form-group {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n }\r\n\r\n .form-label {\r\n color: #3359a7;\r\n font-weight: 600;\r\n font-size: 14px;\r\n }\r\n\r\n .form-input,\r\n .form-textarea {\r\n width: 100%;\r\n padding: 14px 18px;\r\n border: 2px solid rgba(51, 89, 167, 0.2);\r\n border-radius: 12px !important;\r\n font-size: 15px;\r\n transition: all 0.3s ease;\r\n background: white;\r\n color: #1a1a1a !important;\r\n -webkit-border-radius: 12px !important;\r\n -moz-border-radius: 12px !important;\r\n }\r\n\r\n .form-input::placeholder,\r\n .form-textarea::placeholder {\r\n color: #9ca3af;\r\n opacity: 1;\r\n }\r\n\r\n .form-input:focus,\r\n .form-textarea:focus {\r\n outline: none;\r\n border-color: #3359a7;\r\n border-radius: 12px !important;\r\n box-shadow: 0 0 0 3px rgba(51, 89, 167, 0.1);\r\n -webkit-border-radius: 12px !important;\r\n -moz-border-radius: 12px !important;\r\n }\r\n\r\n .form-textarea {\r\n resize: none;\r\n font-family: inherit;\r\n }\r\n\r\n .role-label {\r\n color: #3359a7;\r\n font-weight: 600;\r\n font-size: 14px;\r\n margin-bottom: 16px;\r\n }\r\n\r\n .role-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\r\n gap: 16px;\r\n margin-bottom: 30px;\r\n }\r\n\r\n .role-card {\r\n padding: 20px;\r\n border: 2px solid #e5e7eb;\r\n border-radius: 16px;\r\n text-align: center;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n background: white;\r\n }\r\n\r\n .role-card:hover {\r\n border-color: rgba(51, 89, 167, 0.5);\r\n transform: translateY(-2px);\r\n }\r\n\r\n .role-card.active {\r\n border-color: #3359a7;\r\n background: rgba(51, 89, 167, 0.05);\r\n }\r\n\r\n .role-icon {\r\n font-size: 32px;\r\n margin-bottom: 12px;\r\n transition: color 0.3s ease;\r\n }\r\n\r\n .role-card:not(.active) .role-icon {\r\n color: #9ca3af;\r\n }\r\n\r\n .role-text {\r\n font-size: 14px;\r\n font-weight: 600;\r\n color: rgba(0, 0, 0, 0.7);\r\n transition: color 0.3s ease;\r\n }\r\n\r\n .role-card.active .role-text {\r\n color: #3359a7;\r\n }\r\n\r\n .role-card .role-icon {\r\n color: #9ca3af;\r\n }\r\n\r\n .submit-btn {\r\n width: 100%;\r\n padding: 18px;\r\n background: #60bc6d;\r\n color: white;\r\n border: none;\r\n border-radius: 50px;\r\n font-size: 18px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 10px;\r\n margin-top: 10px;\r\n }\r\n\r\n .submit-btn:hover:not(:disabled) {\r\n background: #52a55f;\r\n transform: translateY(-2px);\r\n box-shadow: 0 8px 20px rgba(96, 188, 109, 0.3);\r\n }\r\n\r\n .submit-btn:disabled {\r\n opacity: 0.5;\r\n cursor: not-allowed;\r\n }\r\n\r\n .success-message {\r\n text-align: center;\r\n padding: 80px 20px;\r\n }\r\n\r\n .success-icon {\r\n width: 96px;\r\n height: 96px;\r\n background: rgba(96, 188, 109, 0.1);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 0 auto 30px;\r\n }\r\n\r\n .success-icon i {\r\n font-size: 48px;\r\n color: #60bc6d;\r\n }\r\n\r\n .success-title {\r\n color: #3359a7;\r\n font-size: 36px;\r\n font-weight: bold;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .success-text {\r\n color: rgba(0, 0, 0, 0.7);\r\n font-size: 18px;\r\n max-width: 500px;\r\n margin: 0 auto 30px;\r\n }\r\n\r\n .success-hashtag {\r\n color: #f19f3d;\r\n font-size: 20px;\r\n font-weight: 600;\r\n }\r\n\r\n .spinner {\r\n width: 20px;\r\n height: 20px;\r\n border: 2px solid rgba(255, 255, 255, 0.3);\r\n border-top-color: white;\r\n border-radius: 50%;\r\n animation: spin 0.8s linear infinite;\r\n }\r\n\r\n @keyframes spin {\r\n to { transform: rotate(360deg); }\r\n }\r\n\r\n .required {\r\n color: #ef4444;\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .form-card {\r\n padding: 40px 30px;\r\n }\r\n\r\n .form-row,\r\n .form-row-3 {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .role-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n\r\n .form-title {\r\n font-size: 26px;\r\n }\r\n }\r\n <\/style>\r\n <!-- \u0646\u0641\u0633 CSS \u062d\u0642\u0643 \u0628\u0627\u0644\u0636\u0628\u0637 -->\r\n<\/head>\r\n\r\n<body>\r\n<section class=\"form-section\">\r\n <div class=\"form-container\">\r\n <div class=\"form-card\">\r\n\r\n <div id=\"formContent\">\r\n <div class=\"form-header\">\r\n <h2 class=\"form-title\">Joining form<\/h2>\r\n <p class=\"form-subtitle\">Complete the following form to join the Kenna family<\/p>\r\n <\/div>\r\n\r\n <form id=\"kanaForm\" class=\"form-grid\" action=\"\">\r\n\r\n <div class=\"form-row\">\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Full name <span class=\"required\">*<\/span><\/label>\r\n <input type=\"text\" name=\"name\" class=\"form-input\" required \/>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Email <span class=\"required\">*<\/span><\/label>\r\n <input type=\"email\" name=\"email\" class=\"form-input\" required \/>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"form-row-3\">\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Mobile number <span class=\"required\">*<\/span><\/label>\r\n <input type=\"tel\" name=\"phone\" class=\"form-input\" required \/>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Age<\/label>\r\n <input type=\"number\" name=\"age\" class=\"form-input\" \/>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">City <span class=\"required\">*<\/span><\/label>\r\n <input type=\"text\" name=\"city\" class=\"form-input\" required \/>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Role -->\r\n <div>\r\n <label class=\"role-label\">How would you like to join? <span class=\"required\">*<\/span><\/label>\r\n\r\n <div class=\"role-grid\">\r\n <div class=\"role-card\" data-role=\"artist\" data-color=\"#ef532d\">\r\n <div class=\"role-icon\"><i class=\"fas fa-palette\"><\/i><\/div>\r\n <p class=\"role-text\">Artist<\/p>\r\n <\/div>\r\n <div class=\"role-card\" data-role=\"volunteer\" data-color=\"#60bc6d\">\r\n <div class=\"role-icon\"><i class=\"fas fa-hand-holding-heart\"><\/i><\/div>\r\n <p class=\"role-text\">Volunteer<\/p>\r\n <\/div>\r\n <div class=\"role-card\" data-role=\"trainer\" data-color=\"#3359a7\">\r\n <div class=\"role-icon\"><i class=\"fas fa-graduation-cap\"><\/i><\/div>\r\n <p class=\"role-text\">Technical trainer<\/p>\r\n <\/div>\r\n <div class=\"role-card\" data-role=\"photgrapher\" data-color=\"#ef532d\">\r\n <div class=\"role-icon\"><i class=\"fa-solid fa-camera\"><\/i><\/div>\r\n <p class=\"role-text\">Photographer<\/p>\r\n <\/div>\r\n <div class=\"role-card\" data-role=\"designer\" data-color=\"#60bc6d\">\r\n <div class=\"role-icon\"><i class=\"fa-solid fa-object-group\"><\/i><\/div>\r\n <p class=\"role-text\">Designer<\/p>\r\n <\/div>\r\n <div class=\"role-card\" data-role=\"other\" data-color=\"#3359a7\">\r\n <div class=\"role-icon\"><i class=\"fa-solid fa-circle-question\"><\/i><\/div>\r\n <p class=\"role-text\">Other<\/p>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <input type=\"hidden\" name=\"role\" id=\"roleInput\" required \/>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Your experience and skills<\/label>\r\n <textarea name=\"experience\" class=\"form-textarea\" rows=\"3\"><\/textarea>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label class=\"form-label\">Why do you want to join me? <span class=\"required\">*<\/span><\/label>\r\n <textarea name=\"motivation\" class=\"form-textarea\" rows=\"4\" required><\/textarea>\r\n <\/div>\r\n\r\n <button type=\"submit\" class=\"submit-btn\" id=\"submitBtn\">\r\n <i class=\"fas fa-heart\"><\/i>\r\n <span>Submitting an application<\/span>\r\n <\/button>\r\n <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\r\n <\/div>\r\n\r\n <div id=\"successMessage\" style=\"display:none;\">\r\n <div class=\"success-message\">\r\n <div class=\"success-icon\">\r\n <i class=\"fas fa-check-circle\"><\/i>\r\n <\/div>\r\n <h3 class=\"success-title\">Your order has been received!<\/h3>\r\n <p class=\"success-text\">we will get back to you soon<\/p>\r\n <p class=\"success-hashtag\"># Art Unites Us<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<script>\r\nconst KANA_AJAX_URL = \"\/wp-admin\/admin-ajax.php\";\r\n\r\nconst roleCards = document.querySelectorAll(\".role-card\");\r\nconst roleInput = document.getElementById(\"roleInput\");\r\n\r\nroleCards.forEach(card => {\r\n card.addEventListener(\"click\", () => {\r\n roleCards.forEach(c => {\r\n c.classList.remove(\"active\");\r\n c.querySelector(\".role-icon\").style.color = \"#9ca3af\";\r\n });\r\n\r\n card.classList.add(\"active\");\r\n roleInput.value = card.dataset.role;\r\n card.querySelector(\".role-icon\").style.color = card.dataset.color;\r\n });\r\n});\r\n\r\nconst form = document.getElementById(\"kanaForm\");\r\nconst submitBtn = document.getElementById(\"submitBtn\");\r\n\r\nform.addEventListener(\"submit\", async e => {\r\n e.preventDefault();\r\n\r\n if (!roleInput.value) {\r\n alert(\"\u0627\u0644\u0631\u062c\u0627\u0621 \u0627\u062e\u062a\u064a\u0627\u0631 \u0637\u0631\u064a\u0642\u0629 \u0627\u0644\u0627\u0646\u0636\u0645\u0627\u0645\");\r\n return;\r\n }\r\n\r\n submitBtn.disabled = true;\r\n submitBtn.innerHTML = '<div class=\"spinner\"><\/div><span>\u062c\u0627\u0631\u064a \u0627\u0644\u062a\u0642\u062f\u064a\u0645...<\/span>';\r\n\r\n const formData = new FormData(form);\r\n\r\n try {\r\n const response = await fetch(KANA_AJAX_URL, {\r\n method: \"POST\",\r\n body: new URLSearchParams({\r\n action: \"kana_send_application\",\r\n ...Object.fromEntries(formData)\r\n })\r\n });\r\n\r\n if (!response.ok) throw new Error(\"Network error\");\r\n\r\n const result = await response.json();\r\n\r\n if (result.success) {\r\n document.getElementById(\"formContent\").style.display = \"none\";\r\n document.getElementById(\"successMessage\").style.display = \"block\";\r\n } else {\r\n throw new Error(result.data || \"\u0641\u0634\u0644 \u0627\u0644\u0625\u0631\u0633\u0627\u0644\");\r\n }\r\n\r\n } catch (err) {\r\n alert(\"\u062d\u062f\u062b \u062e\u0637\u0623 \u0623\u062b\u0646\u0627\u0621 \u0627\u0644\u0625\u0631\u0633\u0627\u0644\");\r\n submitBtn.disabled = false;\r\n submitBtn.innerHTML = '<i class=\"fas fa-heart\"><\/i><span>\u062a\u0642\u062f\u064a\u0645 \u0627\u0644\u0637\u0644\u0628<\/span>';\r\n console.error(err);\r\n }\r\n});\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>\u0627\u0646\u0636\u0645 \u0644\u0641\u0631\u064a\u0642 \u0627\u0644\u0633\u0639\u0627\u062f\u0629 \u0643\u0646 \u062c\u0632\u0621\u0627\u064b \u0645\u0646 \u0631\u062d\u0644\u062a\u0646\u0627 \u0641\u064a \u062a\u0645\u0643\u064a\u0646 \u0627\u0644\u0645\u0628\u062f\u0639\u064a\u0646 \u0648\u0646\u0634\u0631 \u0627\u0644\u0633\u0639\u0627\u062f\u0629 \u0645\u0646 \u062e\u0644\u0627\u0644 \u0627\u0644\u0641\u0646 \u0644\u0645\u0627\u0630\u0627 \u062a\u0646\u0636\u0645 \u0625\u0644\u064a\u0646\u0627\u061f \u0643\u0646 \u062c\u0632\u0621\u0627\u064b \u0645\u0646 \u0627\u0644\u062a\u063a\u064a\u064a\u0631 \u0633\u0627\u0647\u0645 \u0641\u064a \u0628\u0646\u0627\u0621 \u0645\u062c\u062a\u0645\u0639 \u0623\u0643\u062b\u0631 \u0634\u0645\u0648\u0644\u064a\u0629 \u0648\u062a\u0642\u0628\u0644\u0627\u064b \u0644\u0644\u062c\u0645\u064a\u0639 \u0637\u0648\u0631 \u0645\u0647\u0627\u0631\u0627\u062a\u0643 \u0627\u0643\u062a\u0633\u0628 \u062e\u0628\u0631\u0627\u062a \u062c\u062f\u064a\u062f\u0629 \u0641\u064a \u0627\u0644\u0639\u0645\u0644 \u0645\u0639 \u0627\u0644\u0645\u0628\u062f\u0639\u064a\u0646 \u0627\u0644\u0645\u0648\u0647\u0648\u0628\u064a\u0646 \u0627\u0646\u0634\u0631 \u0627\u0644\u0633\u0639\u0627\u062f\u0629 \u0643\u0646 \u0645\u0635\u062f\u0631 \u0625\u0644\u0647\u0627\u0645 \u0648\u0641\u0631\u062d \u0644\u0644\u0622\u062e\u0631\u064a\u0646 \u0645\u0646 \u062e\u0644\u0627\u0644 \u0627\u0644\u0641\u0646 \u0646\u0645\u0648\u0630\u062c \u0627\u0644\u0627\u0646\u0636\u0645\u0627\u0645 – \u0643\u0646\u0649 \u0646\u0645\u0648\u0630\u062c…<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-525","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/pages\/525","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/comments?post=525"}],"version-history":[{"count":68,"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/pages\/525\/revisions"}],"predecessor-version":[{"id":892,"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/pages\/525\/revisions\/892"}],"wp:attachment":[{"href":"https:\/\/kana.com.sa\/en\/wp-json\/wp\/v2\/media?parent=525"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}