{"id":65,"date":"2025-11-10T19:08:32","date_gmt":"2025-11-10T11:08:32","guid":{"rendered":"https:\/\/najicode.com\/?page_id=65"},"modified":"2025-11-14T21:45:57","modified_gmt":"2025-11-14T13:45:57","slug":"services","status":"publish","type":"page","link":"https:\/\/najicode.com\/en\/services\/","title":{"rendered":"Services"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"65\" class=\"elementor elementor-65\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4195252 e-flex e-con-boxed e-con e-parent\" data-id=\"4195252\" 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-405188d elementor-widget elementor-widget-html\" data-id=\"405188d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2705 Najicode \u2014 Improved Full Service Page (Pastel Premium Aesthetic) -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Outfit:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n\r\n<style>\r\n:root{\r\n  --navy:#0F2145;\r\n  --white:#ffffff;\r\n\r\n  --pink1:#ffeaf5;\r\n  --pink2:#fdf2fc;\r\n  --blueSoft:#eef0ff;\r\n\r\n  --pinkGlow:#ffd8f1;\r\n  --lilacGlow:#e4d9ff;\r\n  --goldGlow:#ffe7b0;\r\n\r\n  --chipBg:rgba(255,255,255,0.7);\r\n\r\n  --shadowSoft:0 8px 22px rgba(80,70,150,0.08);\r\n  --shadowHover:0 16px 38px rgba(80,70,150,0.18);\r\n}\r\n\r\n*{margin:0;padding:0;box-sizing:border-box;}\r\nbody{font-family:'Outfit',sans-serif;}\r\n\r\n\/* ---------------------------------------------------\r\n   SECTION \u2014 SERVICE PAGE\r\n--------------------------------------------------- *\/\r\n.service-page{\r\n  padding:140px 0 120px;\r\n  background:linear-gradient(160deg,var(--pink1),var(--pink2),var(--blueSoft));\r\n  background-size:200% 200%;\r\n  animation:svcBG 12s ease-in-out infinite alternate;\r\n  text-align:center;\r\n  position:relative;\r\n  overflow:hidden;\r\n}\r\n\r\n@keyframes svcBG{\r\n  0%{background-position:0% 50%;}\r\n  100%{background-position:100% 50%;}\r\n}\r\n\r\n\/* Glowing gold center *\/\r\n.service-page::before{\r\n  content:\"\";\r\n  position:absolute;\r\n  top:18%; left:50%;\r\n  transform:translateX(-50%);\r\n  width:950px; height:550px;\r\n  background:radial-gradient(circle, var(--goldGlow) 0%, transparent 80%);\r\n  filter:blur(120px);\r\n  opacity:.42;\r\n  z-index:0;\r\n}\r\n\r\n\/* Max-width container *\/\r\n.s-inner{\r\n  max-width:1200px;\r\n  margin:0 auto;\r\n  padding:0 20px;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n\/* ---------------------------------------------------\r\n   HEADER + TITLE\r\n--------------------------------------------------- *\/\r\n.service-badge{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  gap:8px;\r\n  padding:6px 14px;\r\n  border-radius:999px;\r\n  background:var(--chipBg);\r\n  border:1px solid rgba(255,255,255,0.9);\r\n  color:#666;\r\n  font-size:12px;\r\n  margin-bottom:18px;\r\n}\r\n\r\n.service-badge-dot{\r\n  width:9px;\r\n  height:9px;\r\n  border-radius:50%;\r\n  background:linear-gradient(135deg,#ff72b6,#ffb347);\r\n  box-shadow:0 0 0 6px rgba(255,150,180,0.25);\r\n}\r\n\r\n.service-title{\r\n  font-size:clamp(34px,4vw,46px);\r\n  font-weight:700;\r\n  color:var(--navy);\r\n  margin-bottom:16px;\r\n  opacity:0;\r\n  animation:titleFadeUp 1.2s ease forwards;\r\n  position:relative;\r\n}\r\n\r\n@keyframes titleFadeUp{\r\n  0%{opacity:0; transform:translateY(15px);}\r\n  100%{opacity:1; transform:translateY(0);}\r\n}\r\n\r\n\/* Shine animation *\/\r\n.service-title span{\r\n  display:inline-block;\r\n  position:relative;\r\n  overflow:hidden;\r\n}\r\n.service-title span::after{\r\n  content:\"\";\r\n  position:absolute;\r\n  left:-120%;\r\n  top:0;\r\n  width:120%; height:100%;\r\n  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.8), transparent);\r\n  animation:shine 2.8s infinite ease-in-out;\r\n}\r\n@keyframes shine{\r\n  0%{left:-120%;}\r\n  100%{left:120%;}\r\n}\r\n\r\n.service-sub{\r\n  font-size:15px;\r\n  color:#555;\r\n  max-width:650px;\r\n  margin:14px auto 55px;\r\n}\r\n\r\n\/* ---------------------------------------------------\r\n   SERVICE GRID\r\n--------------------------------------------------- *\/\r\n.service-grid{\r\n  display:grid;\r\n  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));\r\n  gap:32px;\r\n  margin-top:40px;\r\n}\r\n\r\n\/* ---------------------------------------------------\r\n   SERVICE CARD \u2014 Premium Pastel Style\r\n--------------------------------------------------- *\/\r\n.service-card{\r\n  background:white;\r\n  border-radius:22px;\r\n  padding:32px 26px;\r\n  text-align:left;\r\n  border:1px solid #f3ecf7;\r\n  box-shadow:var(--shadowSoft);\r\n  position:relative;\r\n  overflow:hidden;\r\n\r\n  transform-style:preserve-3d;\r\n  transition:transform .35s ease, box-shadow .35s ease;\r\n}\r\n\r\n\/* Glow layer *\/\r\n.service-card::before{\r\n  content:\"\";\r\n  position:absolute;\r\n  inset:0;\r\n  border-radius:22px;\r\n  background:\r\n    radial-gradient(circle at 50% -20%, var(--pinkGlow), transparent 65%),\r\n    radial-gradient(circle at 50% 140%, var(--lilacGlow), transparent 70%);\r\n  opacity:.38;\r\n  filter:blur(55px);\r\n  transition:.4s ease;\r\n  pointer-events:none;\r\n}\r\n\r\n\/* Hover Tilt + Shine *\/\r\n.service-card::after{\r\n  content:\"\";\r\n  position:absolute;\r\n  top:0; left:-130%;\r\n  width:130%; height:100%;\r\n  background:linear-gradient(120deg, transparent, rgba(255,255,255,0.6), transparent);\r\n  opacity:0;\r\n  transition:.6s ease;\r\n  pointer-events:none;\r\n}\r\n\r\n.service-card:hover::after{\r\n  left:130%;\r\n  opacity:1;\r\n}\r\n\r\n.service-card:hover{\r\n  transform:perspective(800px) rotateX(4deg) rotateY(-4deg) translateY(-8px);\r\n  box-shadow:var(--shadowHover);\r\n}\r\n.service-card:hover::before{opacity:.72;}\r\n\r\n\/* Text *\/\r\n.service-card h3{\r\n  font-size:20px;\r\n  font-weight:600;\r\n  color:var(--navy);\r\n  margin-bottom:10px;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n.service-card p{\r\n  font-size:15px;\r\n  color:#555;\r\n  line-height:1.7;\r\n  position:relative;\r\n  z-index:2;\r\n}\r\n\r\n\/* ---------------------------------------------------\r\n   CTA BUTTONS\r\n--------------------------------------------------- *\/\r\n.service-cta-wrapper{\r\n  margin-top:65px;\r\n  display:flex;\r\n  flex-direction:column;\r\n  gap:18px;\r\n  align-items:center;\r\n}\r\n\r\n\/* \u2b50 FIXED: Center align on desktop *\/\r\n@media(min-width:900px){\r\n  .service-cta-wrapper{\r\n    flex-direction:row;\r\n    justify-content:center; \/* \u2705 centered horizontally *\/\r\n    align-items:center;\r\n    gap:20px;\r\n  }\r\n}\r\n\r\n\/* Main CTA *\/\r\n.service-cta{\r\n  background:linear-gradient(135deg,#3d2f87,#f36fb0);\r\n  color:white;\r\n  padding:15px 40px;\r\n  border-radius:999px;\r\n  font-weight:600;\r\n  text-decoration:none;\r\n  transition:.3s ease;\r\n  box-shadow:0 10px 24px rgba(90,50,145,0.35);\r\n  font-size:14px;\r\n}\r\n\r\n.service-cta:hover{\r\n  transform:translateY(-4px);\r\n  box-shadow:0 14px 34px rgba(90,50,145,0.45);\r\n}\r\n\r\n\/* Outline CTA *\/\r\n.service-cta-outline{\r\n  border:2px solid var(--navy);\r\n  color:var(--navy);\r\n  padding:14px 40px;\r\n  border-radius:999px;\r\n  font-weight:600;\r\n  text-decoration:none;\r\n  transition:.3s ease;\r\n  font-size:14px;\r\n}\r\n\r\n.service-cta-outline:hover{\r\n  background:var(--navy);\r\n  color:white;\r\n  transform:translateY(-4px);\r\n}\r\n\r\n\/* Responsive *\/\r\n@media(max-width:768px){\r\n  .service-title{font-size:32px;}\r\n  .service-sub{font-size:14px;}\r\n  .service-card:hover{\r\n    transform:none;\r\n  }\r\n}\r\n<\/style>\r\n\r\n\r\n<!-- ---------------------------------------------------\r\n     HTML STRUCTURE\r\n--------------------------------------------------- -->\r\n<section class=\"service-page\">\r\n  <div class=\"s-inner\">\r\n\r\n    <div class=\"service-badge\">\r\n      <span class=\"service-badge-dot\"><\/span>\r\n      <span>All services offered by Najicode<\/span>\r\n    <\/div>\r\n\r\n    <h2 class=\"service-title\"><span>My Services<\/span><\/h2>\r\n    <p class=\"service-sub\">Here are the services I offer to help businesses, brands, and agencies build a strong online presence \u2014 with clean design, performance, and strategic results.<\/p>\r\n\r\n    <div class=\"service-grid\">\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Website Development<\/h3>\r\n        <p>I build modern, elegant, and high-performing websites designed to elevate your brand image and deliver a seamless user experience.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Business Website<\/h3>\r\n        <p>Clean and professional websites tailored for small businesses to increase trust, credibility, and online presence.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Corporate Website<\/h3>\r\n        <p>Comprehensive websites for companies with structured layouts, scalable pages, and consistent brand identity.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Landing Page \/ Sales Page<\/h3>\r\n        <p>Conversion-focused pages crafted for marketing campaigns, lead generation, and high performance.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Web Systems<\/h3>\r\n        <p>Custom dashboards, booking systems, user portals, LMS, and digital solutions built to improve operations.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>E-Commerce Website<\/h3>\r\n        <p>Mobile-first online stores with product management, payment gateways, secure checkout, and fast loading speed.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>Website Revamp<\/h3>\r\n        <p>I can revamp any type of website with cleaner design, improved structure, faster loading speed, and a more modern, professional look.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>TikTok Ads Management<\/h3>\r\n        <p>Complete TikTok ads setup, strategy, and optimisation to help you generate leads and scale your business profitably.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-card\">\r\n        <h3>TikTok Ads Coaching<\/h3>\r\n        <p>1-to-1 coaching to guide you step-by-step in planning, running, and improving your TikTok advertising campaigns.<\/p>\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"service-cta-wrapper\">\r\n      <a href=\"https:\/\/api.whatsapp.com\/send\/?phone=60192484260&text&type=phone_number&app_absent=0\" target=\"_blank\" class=\"service-cta\">\r\n        Contact Me on WhatsApp\r\n      <\/a>\r\n\r\n      <a href=\"https:\/\/najicode.com\/en\/pricing\/\" target=\"_blank\" class=\"service-cta-outline\">\r\n        See Pricing\r\n      <\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\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>All services offered by Najicode My Services Here are the services I offer to help businesses, brands, and agencies build a strong online presence \u2014 with clean design, performance, and strategic results. Website Development I build modern, elegant, and high-performing websites designed to elevate your brand image and deliver a seamless user experience. Business Website [&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-65","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/65","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=65"}],"version-history":[{"count":10,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/65\/revisions"}],"predecessor-version":[{"id":114,"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/pages\/65\/revisions\/114"}],"wp:attachment":[{"href":"https:\/\/najicode.com\/en\/wp-json\/wp\/v2\/media?parent=65"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}