{"id":11,"date":"2025-11-10T17:47:50","date_gmt":"2025-11-10T09:47:50","guid":{"rendered":"https:\/\/najicode.com\/?page_id=11"},"modified":"2026-01-01T20:35:18","modified_gmt":"2026-01-01T12:35:18","slug":"home","status":"publish","type":"page","link":"https:\/\/najicode.com\/en\/","title":{"rendered":"Home"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"11\" class=\"elementor elementor-11\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-34a943b e-flex e-con-boxed e-con e-parent\" data-id=\"34a943b\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0508eb9 elementor-widget elementor-widget-html\" data-id=\"0508eb9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* =========================\r\n   FULLSCREEN CONTAINER\r\n========================= *\/\r\n.blob-profile-container{\r\n  position:relative;\r\n  width:100%;\r\n  min-height:100vh;\r\n  overflow:hidden;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  background:#eaf6ff;\r\n}\r\n\r\n\/* =========================\r\n   SKY ANIMATION\r\n========================= *\/\r\n.sky-layer{\r\n  position:absolute;\r\n  inset:0;\r\n  background:linear-gradient(180deg,#cfefff,#f7fbff);\r\n  z-index:0;\r\n}\r\n.sky-layer::before,\r\n.sky-layer::after{\r\n  content:\"\";\r\n  position:absolute;\r\n  width:200%;\r\n  height:200%;\r\n  background:\r\n    radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), transparent 40%),\r\n    radial-gradient(circle at 70% 50%, rgba(255,255,255,.45), transparent 45%);\r\n  animation:cloudMove 70s linear infinite;\r\n}\r\n.sky-layer::after{animation-duration:110s;opacity:.6;}\r\n@keyframes cloudMove{\r\n  from{transform:translateX(-10%) translateY(0);}\r\n  to{transform:translateX(-40%) translateY(-10%);}\r\n}\r\n\r\n\/* =========================\r\n   PROFILE WRAPPER\r\n========================= *\/\r\n.profile-wrap{\r\n  position:relative;\r\n  width:560px;\r\n  height:560px;\r\n  z-index:2;\r\n}\r\n\r\n\/* =========================\r\n   GLOW BLOB\r\n========================= *\/\r\n.blob{\r\n  position:absolute;\r\n  inset:-40px;\r\n  background:linear-gradient(135deg,#f7c1d6,#cfe8f6);\r\n  border-radius:50%;\r\n  filter:blur(55px);\r\n  animation:blobMove 10s infinite alternate ease-in-out;\r\n  z-index:1;\r\n}\r\n@keyframes blobMove{\r\n  from{transform:translate(-20px,-15px) scale(1);}\r\n  to{transform:translate(20px,15px) scale(1.12);}\r\n}\r\n\r\n\/* =========================\r\n   RING + IMAGE\r\n========================= *\/\r\n.profile-ring{\r\n  position:absolute;\r\n  inset:0;\r\n  padding:18px;\r\n  border-radius:50%;\r\n  background:linear-gradient(135deg,#fff,#fbeaf2);\r\n  z-index:3;\r\n}\r\n.profile-img{\r\n  width:100%;\r\n  height:100%;\r\n  border-radius:50%;\r\n  overflow:hidden;\r\n  background:#fff;\r\n  box-shadow:0 30px 70px rgba(0,0,0,.18);\r\n}\r\n.profile-img img{\r\n  width:100%;\r\n  height:100%;\r\n  object-fit:cover;\r\n}\r\n\r\n\/* =========================\r\n   PETAL BUTTONS\r\n========================= *\/\r\n.petal-btn{\r\n  position:absolute;\r\n  width:86px;\r\n  height:86px;\r\n  background:linear-gradient(135deg,#f7b3cf,#ffd6e6);\r\n  color:#7a3555;\r\n  font-weight:700;\r\n  font-size:16px;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  text-decoration:none;\r\n  z-index:5;\r\n  box-shadow:0 14px 34px rgba(0,0,0,.18);\r\n  animation:floatPetal 6s infinite ease-in-out;\r\n  transition:.3s;\r\n  border-radius:65% 35% 65% 35% \/ 65% 65% 35% 35%;\r\n}\r\n.petal-btn:hover{transform:scale(1.12);}\r\n@keyframes floatPetal{\r\n  0%,100%{transform:translateY(0);}\r\n  50%{transform:translateY(-10px);}\r\n}\r\n\r\n\/* Button Positions *\/\r\n.petal-about{top:-24px; left:50%; transform:translateX(-50%);}\r\n.petal-contact{right:-24px; top:50%; transform:translateY(-50%) rotate(90deg);}\r\n.petal-pricing{bottom:-24px; left:50%; transform:translateX(-50%) rotate(180deg);}\r\n.petal-services{left:-24px; top:50%; transform:translateY(-50%) rotate(-90deg);}\r\n\r\n\/* =========================\r\n   POPUP BASE\r\n========================= *\/\r\n.popup-overlay{\r\n  position:fixed;\r\n  inset:0;\r\n  background:rgba(0,0,0,.45);\r\n  display:none;\r\n  align-items:center;\r\n  justify-content:center;\r\n  z-index:999;\r\n}\r\n.popup-box{\r\n  background:#fff;\r\n  max-width:520px;\r\n  width:92%;\r\n  padding:36px;\r\n  border-radius:24px;\r\n  box-shadow:0 30px 80px rgba(0,0,0,.25);\r\n  position:relative;\r\n  animation:popupIn .35s ease;\r\n}\r\n@keyframes popupIn{\r\n  from{opacity:0; transform:scale(.92);}\r\n  to{opacity:1; transform:scale(1);}\r\n}\r\n.popup-close{\r\n  position:absolute;\r\n  top:16px;\r\n  right:20px;\r\n  font-size:24px;\r\n  cursor:pointer;\r\n}\r\n.popup-title{\r\n  font-size:26px;\r\n  font-weight:800;\r\n  margin-bottom:14px;\r\n}\r\n.popup-text{\r\n  font-size:14px;\r\n  line-height:1.7;\r\n  color:#555;\r\n}\r\n.popup-list{\r\n  margin:16px 0 24px;\r\n  padding-left:18px;\r\n}\r\n.popup-list li{margin-bottom:8px;}\r\n.popup-cta{\r\n  display:inline-block;\r\n  padding:14px 30px;\r\n  background:linear-gradient(135deg,#f7b3cf,#ffd6e6);\r\n  color:#7a3555;\r\n  font-weight:700;\r\n  border-radius:30px;\r\n  text-decoration:none;\r\n  box-shadow:0 12px 30px rgba(0,0,0,.18);\r\n}\r\n\/* =========================\r\n   POPUP CTA BUTTON ANIMATION\r\n========================= *\/\r\n.popup-cta{\r\n  animation:ctaPulse 3.5s ease-in-out infinite;\r\n  position:relative;\r\n}\r\n\r\n\/* soft breathing pulse *\/\r\n@keyframes ctaPulse{\r\n  0%{\r\n    transform:scale(1);\r\n    box-shadow:0 12px 30px rgba(0,0,0,.18);\r\n  }\r\n  50%{\r\n    transform:scale(1.04);\r\n    box-shadow:0 18px 42px rgba(247,179,207,.45);\r\n  }\r\n  100%{\r\n    transform:scale(1);\r\n    box-shadow:0 12px 30px rgba(0,0,0,.18);\r\n  }\r\n}\r\n\r\n\/* hover interaction *\/\r\n.popup-cta:hover{\r\n  animation:none;\r\n  transform:translateY(-3px) scale(1.06);\r\n  box-shadow:0 22px 50px rgba(247,179,207,.55);\r\n}\r\n\r\n\/* click feedback *\/\r\n.popup-cta:active{\r\n  transform:scale(.96);\r\n}\r\n\r\n\/* =========================\r\n   RESPONSIVE\r\n========================= *\/\r\n@media(max-width:768px){\r\n  .profile-wrap{width:300px;height:300px;}\r\n  .petal-btn{width:64px;height:64px;font-size:13px;}\r\n}\r\n<\/style>\r\n\r\n<div class=\"blob-profile-container\">\r\n  <div class=\"sky-layer\"><\/div>\r\n\r\n  <div class=\"profile-wrap\">\r\n    <div class=\"blob\"><\/div>\r\n\r\n    <div class=\"profile-ring\">\r\n      <div class=\"profile-img\">\r\n        <img decoding=\"async\" src=\"https:\/\/najicode.com\/wp-content\/uploads\/2026\/01\/Untitled-design-16-scaled.png\" alt=\"Profile\">\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <a class=\"petal-btn petal-about\" onclick=\"openAbout()\">About<\/a>\r\n    <a class=\"petal-btn petal-contact\" onclick=\"openContact()\">Contact<\/a>\r\n    <a class=\"petal-btn petal-pricing\" onclick=\"openPricing()\">Pricing<\/a>\r\n    <a class=\"petal-btn petal-services\" onclick=\"openServices()\">Services<\/a>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- ABOUT POPUP -->\r\n<div class=\"popup-overlay\" id=\"aboutPopup\" onclick=\"closePopup(event)\">\r\n  <div class=\"popup-box\">\r\n    <span class=\"popup-close\" onclick=\"closePopup(event)\">\u00d7<\/span>\r\n    <div class=\"popup-title\">About Me<\/div>\r\n    <ul class=\"popup-list\">\r\n      <li>UKM graduate with a Bachelor\u2019s Degree in Information Technology (Honours)<\/li>\r\n      <li>4 years of experience in web development<\/li>\r\n      <li>Built 40+ websites throughout my career<\/li>\r\n      <li>Mother of two<\/li>\r\n      <li>Full-time housewife<\/li>\r\n    <\/ul>\r\n    <a href=\"https:\/\/wasap.my\/60192484260\" target=\"_blank\" class=\"popup-cta\">WhatsApp Me<\/a>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- SERVICES POPUP -->\r\n<div class=\"popup-overlay\" id=\"servicesPopup\" onclick=\"closePopup(event)\">\r\n  <div class=\"popup-box\">\r\n    <span class=\"popup-close\" onclick=\"closePopup(event)\">\u00d7<\/span>\r\n    <div class=\"popup-title\">Services<\/div>\r\n    <ul class=\"popup-list\">\r\n      <li>Business \/ Corporate Website<\/li>\r\n      <li>Landing \/ Sales Page<\/li>\r\n      <li>E-commerce Website<\/li>\r\n      <li>TikTok Ads Management<\/li>\r\n      <li>Google Ads Management<\/li>\r\n    <\/ul>\r\n    <a href=\"https:\/\/najicode.com\/en\/past-projects\/\" target=\"_blank\" class=\"popup-cta\">View Past Works<\/a>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- PRICING POPUP -->\r\n<div class=\"popup-overlay\" id=\"pricingPopup\" onclick=\"closePopup(event)\">\r\n  <div class=\"popup-box\">\r\n    <span class=\"popup-close\" onclick=\"closePopup(event)\">\u00d7<\/span>\r\n    <div class=\"popup-title\">Pricing<\/div>\r\n    <ul class=\"popup-list\">\r\n      <li><strong>Corporate \/ Company Website<\/strong>: Starts from RM3,500<\/li>\r\n      <li><strong>E-commerce Website<\/strong>: Starts from RM3,800<\/li>\r\n      <li><strong>Landing \/ Sales \/ One-Page Website<\/strong>: Fixed RM1,800<\/li>\r\n    <\/ul>\r\n    <a href=\"https:\/\/najicode.com\/en\/pricing\/\" target=\"_blank\" class=\"popup-cta\">Read More<\/a>\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- CONTACT POPUP -->\r\n<div class=\"popup-overlay\" id=\"contactPopup\" onclick=\"closePopup(event)\">\r\n  <div class=\"popup-box\">\r\n    <span class=\"popup-close\" onclick=\"closePopup(event)\">\u00d7<\/span>\r\n\r\n    <div class=\"popup-title\">Contact<\/div>\r\n\r\n    <div class=\"popup-text\">\r\n      If you are looking for a reliable web developer who understands both strategy and execution,\r\n      I would be happy to discuss how we can turn your ideas into a high-performing website.\r\n    <\/div>\r\n\r\n    <ul class=\"popup-list\">\r\n      <li><strong>Location:<\/strong> Semenyih, Selangor<\/li>\r\n      <li><strong>Phone:<\/strong> 019-248 4260<\/li>\r\n      <li><strong>Email:<\/strong> hello@najicode.com<\/li>\r\n    <\/ul>\r\n\r\n    <a href=\"https:\/\/wasap.my\/60192484260\" target=\"_blank\" class=\"popup-cta\">\r\n      Start a Conversation\r\n    <\/a>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nfunction openAbout(){document.getElementById(\"aboutPopup\").style.display=\"flex\";}\r\nfunction openServices(){document.getElementById(\"servicesPopup\").style.display=\"flex\";}\r\nfunction openPricing(){document.getElementById(\"pricingPopup\").style.display=\"flex\";}\r\nfunction openContact(){document.getElementById(\"contactPopup\").style.display=\"flex\";}\r\nfunction closePopup(e){\r\n  if(e.target.classList.contains(\"popup-overlay\") || e.target.classList.contains(\"popup-close\")){\r\n    document.getElementById(\"aboutPopup\").style.display=\"none\";\r\n    document.getElementById(\"servicesPopup\").style.display=\"none\";\r\n    document.getElementById(\"pricingPopup\").style.display=\"none\";\r\n    document.getElementById(\"contactPopup\").style.display=\"none\";\r\n  }\r\n}\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>About Contact Pricing Services \u00d7 About Me UKM graduate with a Bachelor\u2019s Degree in Information Technology (Honours) 4 years of experience in web development Built 40+ websites throughout my career Mother of two Full-time housewife WhatsApp Me \u00d7 Services Business \/ Corporate Website Landing \/ Sales Page E-commerce Website TikTok Ads Management Google Ads Management [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/comments?post=11"}],"version-history":[{"count":76,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":534,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/11\/revisions\/534"}],"wp:attachment":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/media?parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}