{"id":98,"date":"2026-08-17T17:54:30","date_gmt":"2026-08-17T14:54:30","guid":{"rendered":"https:\/\/darkseagreen-llama-386714.hostingersite.com\/?page_id=98"},"modified":"2026-08-17T18:17:41","modified_gmt":"2026-08-17T15:17:41","slug":"kader-jo","status":"publish","type":"page","link":"https:\/\/kaderjo.com\/ar\/","title":{"rendered":"Kader Jo"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"98\" class=\"elementor elementor-98\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7583a999 e-con-full e-flex e-con e-parent\" data-id=\"7583a999\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bfeeec2 elementor-widget elementor-widget-html\" data-id=\"bfeeec2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<meta charset=\"utf-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\r\n<title>KaderJo \u2014 get found by employers in Jordan<\/title>\r\n<meta name=\"description\" content=\"Build one profile and let employers find you. KaderJo is a talent marketplace for Jordan: candidates are ranked against real requirements, and employers pay only to open a conversation.\">\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin=\"\">\r\n<!--\r\n  Archivo carries a width axis, so its expanded caps echo the wide geometric\r\n  lettering in the KADERJO wordmark. IBM Plex Sans sets the body and has a proper\r\n  Arabic sibling, which matters when this page gets an Arabic version.\r\n-->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Archivo:wdth,wght@100..125,400..800&amp;family=IBM+Plex+Mono:wght@400;500&amp;family=IBM+Plex+Sans:wght@400;500;600&amp;display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n\/* ==========================================================================\r\n   Tokens \u2014 every colour taken from the logo file itself.\r\n   ========================================================================== *\/\r\n:root {\r\n  --ink:        #1B1B1B;   \/* the logo's black *\/\r\n  --teal:       #16A89A;   \/* the mark and wordmark teal *\/\r\n  --teal-bright:#1DCCBB;   \/* the highlight inside the JO *\/\r\n  --teal-deep:  #0C7A6F;   \/* pressed states, teal text on light *\/\r\n  --wash:       #E6F6F4;   \/* teal at 8% \u2014 chips and fills *\/\r\n  --paper:      #F6F8F7;   \/* cool off-white, not a warm cream *\/\r\n  --card:       #FFFFFF;\r\n  --line:       #E3E9E7;\r\n  --slate:      #5E6B69;\r\n  --amber:      #B67A22;   \/* the honest shortfall, never an error *\/\r\n\r\n  --display: 'Archivo', system-ui, sans-serif;\r\n  --body:    'IBM Plex Sans', system-ui, sans-serif;\r\n  --mono:    'IBM Plex Mono', ui-monospace, monospace;\r\n\r\n  --shell: 1180px;\r\n  --r: 16px;\r\n}\r\n\r\n*, *::before, *::after { box-sizing: border-box; }\r\n\r\nhtml { scroll-behavior: smooth; }\r\n\r\nbody {\r\n  margin: 0;\r\n  background: var(--paper);\r\n  color: var(--ink);\r\n  font: 400 17px\/1.6 var(--body);\r\n  -webkit-font-smoothing: antialiased;\r\n}\r\n\r\nh1, h2, h3 {\r\n  font-family: var(--display);\r\n  font-variation-settings: 'wdth' 112;   \/* the wordmark's width *\/\r\n  line-height: 1.05;\r\n  letter-spacing: -0.02em;\r\n  margin: 0;\r\n}\r\n\r\np { margin: 0 0 1em; }\r\na { color: var(--teal-deep); }\r\n\r\nimg, svg { max-width: 100%; }\r\n\r\n.shell { width: 100%; max-width: var(--shell); margin-inline: auto; padding-inline: 22px; }\r\n\r\n\/* Eyebrows carry a real count or a real label, never decoration. *\/\r\n.eyebrow {\r\n  font: 500 11.5px\/1 var(--mono);\r\n  letter-spacing: 0.16em;\r\n  text-transform: uppercase;\r\n  color: var(--teal-deep);\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 9px;\r\n  margin: 0 0 18px;\r\n}\r\n\r\n\/* The notch: the teal wedge cut into the logo's K, reused as a marker. *\/\r\n.notch {\r\n  width: 10px; height: 14px;\r\n  background: var(--teal);\r\n  clip-path: polygon(0 0, 100% 50%, 0 100%);\r\n  flex: none;\r\n}\r\n\r\n.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }\r\n\r\n\/* ==========================================================================\r\n   Buttons\r\n   ========================================================================== *\/\r\n.btn {\r\n  display: inline-flex; align-items: center; justify-content: center; gap: 8px;\r\n  padding: 14px 24px;\r\n  border: 1.5px solid var(--ink);\r\n  border-radius: 11px;\r\n  background: var(--ink);\r\n  color: #fff;\r\n  font: 600 15.5px\/1 var(--body);\r\n  text-decoration: none;\r\n  cursor: pointer;\r\n  transition: transform .14s ease, background .14s ease, border-color .14s ease;\r\n}\r\n.btn:hover { background: var(--teal-deep); border-color: var(--teal-deep); transform: translateY(-1px); }\r\n\r\n.btn--teal { background: var(--teal); border-color: var(--teal); }\r\n.btn--teal:hover { background: var(--teal-deep); border-color: var(--teal-deep); }\r\n\r\n.btn--line { background: transparent; color: var(--ink); border-color: var(--line); }\r\n.btn--line:hover { background: var(--wash); border-color: var(--teal); color: var(--teal-deep); transform: translateY(-1px); }\r\n\r\n.btn--onink { background: #fff; border-color: #fff; color: var(--ink); }\r\n.btn--onink:hover { background: var(--teal-bright); border-color: var(--teal-bright); color: var(--ink); }\r\n\r\n.btn--ghostink { background: transparent; border-color: rgba(255,255,255,.28); color: #fff; }\r\n.btn--ghostink:hover { background: rgba(255,255,255,.1); border-color: #fff; color: #fff; }\r\n\r\na:focus-visible, button:focus-visible, summary:focus-visible {\r\n  outline: 3px solid var(--teal-bright);\r\n  outline-offset: 3px;\r\n  border-radius: 6px;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Header\r\n   ========================================================================== *\/\r\n.top {\r\n  position: sticky; top: 0; z-index: 50;\r\n  background: rgba(246,248,247,.9);\r\n  backdrop-filter: blur(10px);\r\n  border-bottom: 1px solid var(--line);\r\n}\r\n.top__in { display: flex; align-items: center; gap: 22px; height: 74px; }\r\n.top__logo { display: flex; align-items: center; flex: none; }\r\n.top__logo img { height: 34px; width: auto; display: block; }\r\n\r\n.top__nav { margin-inline-start: auto; display: flex; align-items: center; gap: 4px; }\r\n.top__nav a {\r\n  padding: 9px 13px; border-radius: 8px;\r\n  font: 500 15px\/1 var(--body); color: var(--ink); text-decoration: none;\r\n}\r\n.top__nav a:hover { background: var(--wash); color: var(--teal-deep); }\r\n.top__nav .btn { margin-inline-start: 8px; padding: 11px 18px; }\r\n\r\n.top__burger { display: none; }\r\n\r\n@media (max-width: 860px) {\r\n  .top__nav a:not(.btn) { display: none; }\r\n}\r\n\r\n\/* ==========================================================================\r\n   Hero \u2014 the thesis: two doors, and the instrument that does the ranking\r\n   ========================================================================== *\/\r\n.hero { padding: 74px 0 84px; }\r\n\r\n.hero__grid {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr);\r\n  gap: 56px;\r\n  align-items: center;\r\n}\r\n\r\n.hero h1 {\r\n  font-size: clamp(35px, 4.2vw, 52px);\r\n  font-weight: 800;\r\n  font-variation-settings: 'wdth' 106;\r\n  margin-bottom: 20px;\r\n  text-wrap: balance;\r\n}\r\n.hero h1 em {\r\n  font-style: normal;\r\n  color: var(--teal);\r\n  \/* The one place the bright logo teal appears in type. *\/\r\n  background: linear-gradient(180deg, var(--teal-bright), var(--teal));\r\n  -webkit-background-clip: text; background-clip: text;\r\n  -webkit-text-fill-color: transparent;\r\n}\r\n\r\n.hero__lead { font-size: 19px; color: var(--slate); max-width: 46ch; }\r\n\r\n.hero__doors { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }\r\n\r\n.hero__note {\r\n  margin: 22px 0 0; font-size: 14px; color: var(--slate);\r\n  display: flex; align-items: center; gap: 9px;\r\n}\r\n\r\n\/* ---- The instrument: real result rows, exactly as the product shows them ---- *\/\r\n.rig {\r\n  background: var(--card);\r\n  border: 1px solid var(--line);\r\n  border-radius: 22px;\r\n  padding: 20px;\r\n  box-shadow: 0 24px 60px -32px rgba(27,27,27,.3);\r\n}\r\n\r\n.rig__bar {\r\n  display: flex; align-items: center; gap: 10px;\r\n  padding: 0 4px 16px;\r\n  border-bottom: 1px solid var(--line);\r\n  margin-bottom: 6px;\r\n}\r\n.rig__q {\r\n  flex: 1; min-width: 0;\r\n  font: 500 13.5px\/1 var(--mono);\r\n  color: var(--slate);\r\n  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\r\n}\r\n.rig__q b { color: var(--ink); font-weight: 500; }\r\n.rig__count { font: 500 11.5px\/1 var(--mono); color: var(--teal-deep); flex: none; }\r\n\r\n.row {\r\n  display: grid;\r\n  grid-template-columns: 62px minmax(0, 1fr);\r\n  gap: 16px;\r\n  align-items: center;\r\n  padding: 15px 4px;\r\n  border-bottom: 1px dotted var(--line);\r\n}\r\n.row:last-child { border-bottom: 0; }\r\n\r\n.row__name { font: 600 15.5px\/1.2 var(--body); margin: 0 0 3px; }\r\n.row__meta { font-size: 12.8px; color: var(--slate); margin: 0; }\r\n.row__why  { font: 500 12px\/1.35 var(--mono); color: var(--teal-deep); margin: 6px 0 0; }\r\n.row__gap  { font: 400 12px\/1.35 var(--mono); color: var(--amber); margin: 3px 0 0; }\r\n\r\n\/* The ring: the product's own instrument, on the marketing page. *\/\r\n.ring { display: block; width: 62px; height: 62px; }\r\n.ring__track { fill: none; stroke: var(--line); stroke-width: 7; }\r\n.ring__bar {\r\n  fill: none; stroke: var(--teal); stroke-width: 7; stroke-linecap: round;\r\n  transform: rotate(-90deg); transform-origin: 50% 50%;\r\n  transition: stroke-dashoffset 1.1s cubic-bezier(.22,.75,.28,1);\r\n}\r\n.ring__num {\r\n  font: 500 26px var(--mono); fill: var(--ink); text-anchor: middle;\r\n}\r\n\/* A \"match\" caption under the header carries the unit, so the ring itself\r\n   shows only the number \u2014 the per-cent sign crowded the stroke. *\/\r\n\r\n@media (max-width: 520px) {\r\n  .hero__doors { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }\r\n  .hero__doors .btn { width: 100%; }\r\n}\r\n\r\n@media (max-width: 620px) {\r\n  .rig { padding: 16px; }\r\n  .rig__bar { flex-wrap: wrap; row-gap: 6px; }\r\n  .rig__q { white-space: normal; overflow: visible; line-height: 1.5; }\r\n  .row { grid-template-columns: 52px minmax(0, 1fr); gap: 13px; }\r\n  .ring { width: 52px; height: 52px; }\r\n}\r\n\r\n@media (max-width: 940px) {\r\n  .hero { padding: 48px 0 60px; }\r\n  \/* minmax(0,\u2026), not 1fr: a plain 1fr cannot shrink below its content's\r\n     min-content width, and the nowrap query line below was dragging the whole\r\n     page wider than the phone. *\/\r\n  .hero__grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }\r\n}\r\n\r\n\/* ==========================================================================\r\n   Thesis line\r\n   ========================================================================== *\/\r\n.thesis { padding: 10px 0 84px; }\r\n.thesis__in {\r\n  border-top: 1px solid var(--line);\r\n  border-bottom: 1px solid var(--line);\r\n  padding: 52px 0;\r\n}\r\n.thesis h2 {\r\n  font-size: clamp(27px, 3.5vw, 41px);\r\n  font-weight: 800;\r\n  max-width: 26ch;\r\n  text-wrap: balance;\r\n}\r\n.thesis h2 span { color: var(--slate); }\r\n.thesis p { margin: 22px 0 0; max-width: 58ch; color: var(--slate); font-size: 18px; }\r\n\r\n\/* ==========================================================================\r\n   Two doors\r\n   ========================================================================== *\/\r\n.doors { padding: 0 0 90px; }\r\n\r\n.doors__grid {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 0;\r\n  border: 1px solid var(--line);\r\n  border-radius: var(--r);\r\n  overflow: hidden;\r\n  background: var(--card);\r\n}\r\n\r\n.door { padding: 40px 38px 38px; }\r\n.door + .door { border-inline-start: 1px solid var(--line); }\r\n\r\n.door h3 { font-size: 25px; font-weight: 700; margin-bottom: 8px; }\r\n.door__sub { color: var(--slate); font-size: 15.5px; margin-bottom: 26px; }\r\n\r\n\/* A real sequence, so it is numbered. *\/\r\n.steps { list-style: none; margin: 0 0 30px; padding: 0; counter-reset: s; }\r\n.steps li {\r\n  counter-increment: s;\r\n  display: grid; grid-template-columns: 30px minmax(0, 1fr);\r\n  column-gap: 14px; row-gap: 0;\r\n  padding: 13px 0;\r\n  border-top: 1px solid var(--line);\r\n}\r\n.steps li::before {\r\n  content: counter(s);\r\n  font: 500 12px\/28px var(--mono);\r\n  color: var(--teal-deep);\r\n  background: var(--wash);\r\n  border-radius: 8px;\r\n  text-align: center;\r\n  height: 28px;\r\n}\r\n.steps b,\r\n.steps span { grid-column: 2; min-width: 0; }\r\n.steps b { display: block; font: 600 15.5px\/1.35 var(--body); }\r\n.steps span { display: block; font-size: 14px; color: var(--slate); line-height: 1.5; margin-top: 3px; }\r\n\r\n@media (max-width: 860px) {\r\n  .doors__grid { grid-template-columns: minmax(0, 1fr); }\r\n  .door + .door { border-inline-start: 0; border-top: 1px solid var(--line); }\r\n  .door { padding: 32px 24px; }\r\n}\r\n\r\n\/* ==========================================================================\r\n   Quiet band \u2014 the anonymous mode, dark for weight\r\n   ========================================================================== *\/\r\n.quiet {\r\n  background: var(--ink);\r\n  color: #fff;\r\n  padding: 84px 0;\r\n  position: relative;\r\n  overflow: hidden;\r\n}\r\n\/* One large notch, bled off the edge: the K's wedge at scale. *\/\r\n.quiet::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset-block: -20%;\r\n  inset-inline-end: -8%;\r\n  width: 42%;\r\n  background: linear-gradient(160deg, var(--teal), var(--teal-deep));\r\n  clip-path: polygon(0 0, 100% 50%, 0 100%);\r\n  opacity: .13;\r\n  pointer-events: none;\r\n}\r\n.quiet__grid {\r\n  position: relative; z-index: 1;\r\n  display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr);\r\n  gap: 60px; align-items: center;\r\n}\r\n.quiet .eyebrow { color: var(--teal-bright); }\r\n.quiet h2 { font-size: clamp(28px, 3.7vw, 42px); font-weight: 700; margin-bottom: 18px; }\r\n.quiet p { color: rgba(255,255,255,.72); font-size: 17.5px; max-width: 52ch; }\r\n.quiet__cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }\r\n\r\n\/* A card showing what an employer actually sees of a hidden candidate. *\/\r\n.masked {\r\n  background: rgba(255,255,255,.055);\r\n  border: 1px solid rgba(255,255,255,.14);\r\n  border-radius: var(--r);\r\n  padding: 24px;\r\n}\r\n.masked__head { display: flex; align-items: center; gap: 13px; margin-bottom: 16px; }\r\n.masked__av {\r\n  width: 46px; height: 46px; border-radius: 50%; flex: none;\r\n  background: rgba(255,255,255,.1);\r\n  display: grid; place-items: center;\r\n}\r\n.masked__av svg { width: 22px; height: 22px; fill: rgba(255,255,255,.4); }\r\n.masked__id b { display: block; font: 500 15px\/1.2 var(--mono); color: #fff; }\r\n.masked__id span { font-size: 13px; color: rgba(255,255,255,.6); }\r\n\r\n.masked__list { list-style: none; margin: 0; padding: 0; font-size: 14px; }\r\n.masked__list li {\r\n  display: flex; justify-content: space-between; gap: 14px;\r\n  padding: 10px 0; border-top: 1px solid rgba(255,255,255,.11);\r\n  color: rgba(255,255,255,.72);\r\n}\r\n.masked__list b { color: #fff; font-weight: 500; }\r\n.masked__list .hid { color: var(--teal-bright); font-family: var(--mono); font-size: 12.5px; }\r\n\r\n@media (max-width: 940px) {\r\n  .quiet__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }\r\n  .quiet { padding: 60px 0; }\r\n}\r\n\r\n\/* ==========================================================================\r\n   Plans\r\n   ========================================================================== *\/\r\n.plans { padding: 90px 0; }\r\n.plans__head { max-width: 58ch; margin-bottom: 34px; }\r\n.plans__head h2 { font-size: clamp(28px, 3.6vw, 40px); font-weight: 700; margin-bottom: 14px; }\r\n.plans__head p { color: var(--slate); }\r\n\r\n.plans__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }\r\n\r\n.plan {\r\n  background: var(--card);\r\n  border: 1px solid var(--line);\r\n  border-radius: var(--r);\r\n  padding: 32px 30px;\r\n  display: flex; flex-direction: column;\r\n}\r\n.plan--hire { border-color: color-mix(in srgb, var(--teal) 40%, var(--line)); }\r\n\r\n.plan h3 { font-size: 21px; font-weight: 700; margin-bottom: 6px; }\r\n.plan__who { font: 500 11.5px\/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--teal-deep); margin-bottom: 16px; }\r\n.plan__free { font-size: 15.5px; color: var(--slate); margin-bottom: 18px; }\r\n\r\n.plan ul { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 10px; font-size: 15px; }\r\n.plan li { position: relative; padding-inline-start: 19px; }\r\n.plan li::before {\r\n  content: \"\"; position: absolute;\r\n  inset-inline-start: 0; top: .6em;\r\n  width: 8px; height: 8px;\r\n  background: var(--teal); border-radius: 50%;\r\n}\r\n.plan li.is-paid::before { background: var(--amber); }\r\n.plan li em {\r\n  margin-inline-start: 7px;\r\n  white-space: nowrap;\r\n  font-style: normal; color: var(--amber);\r\n  font-family: var(--mono); font-size: 11.5px;\r\n  letter-spacing: .08em; text-transform: uppercase;\r\n  border: 1px solid color-mix(in srgb, var(--amber) 35%, transparent);\r\n  border-radius: 5px; padding: 1px 6px;\r\n}\r\n.plan .btn { margin-top: auto; }\r\n\r\n@media (max-width: 860px) { .plans__grid { grid-template-columns: minmax(0, 1fr); } .plans { padding: 60px 0; } }\r\n\r\n\/* ==========================================================================\r\n   Questions\r\n   ========================================================================== *\/\r\n.qs { padding: 0 0 96px; }\r\n.qs h2 { font-size: clamp(26px, 3.2vw, 36px); font-weight: 700; margin-bottom: 26px; }\r\n\r\ndetails {\r\n  background: var(--card);\r\n  border: 1px solid var(--line);\r\n  border-radius: 12px;\r\n  margin-bottom: 10px;\r\n  overflow: hidden;\r\n}\r\nsummary {\r\n  cursor: pointer; list-style: none;\r\n  padding: 18px 22px;\r\n  font: 600 16.5px\/1.4 var(--body);\r\n  display: flex; align-items: center; justify-content: space-between; gap: 16px;\r\n}\r\nsummary::-webkit-details-marker { display: none; }\r\nsummary::after {\r\n  content: \"+\";\r\n  font: 400 22px\/1 var(--mono); color: var(--teal-deep); flex: none;\r\n}\r\ndetails[open] summary::after { content: \"\u2013\"; }\r\ndetails[open] summary { border-bottom: 1px solid var(--line); }\r\n.qs__a { padding: 18px 22px 22px; color: var(--slate); font-size: 15.5px; }\r\n.qs__a p:last-child { margin-bottom: 0; }\r\n\r\n\/* ==========================================================================\r\n   Footer\r\n   ========================================================================== *\/\r\n.foot { background: var(--ink); color: rgba(255,255,255,.66); padding: 60px 0 34px; font-size: 14.5px; }\r\n.foot__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; }\r\n.foot img {\r\n  height: 30px; width: auto; opacity: .92;\r\n  \/* Whited out for the dark footer. If you have a reversed logo file, drop this\r\n     filter and point the src at it \u2014 the teal will come back. *\/\r\n  filter: brightness(0) invert(1);\r\n}\r\n.foot h4 { font: 500 11.5px\/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #fff; margin: 0 0 16px; }\r\n.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }\r\n.foot a { color: rgba(255,255,255,.66); text-decoration: none; }\r\n.foot a:hover { color: var(--teal-bright); }\r\n.foot__note { margin-top: 18px; max-width: 34ch; line-height: 1.55; }\r\n.foot__base {\r\n  margin-top: 46px; padding-top: 22px;\r\n  border-top: 1px solid rgba(255,255,255,.13);\r\n  display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap;\r\n  font-size: 13.5px;\r\n}\r\n\r\n@media (max-width: 860px) { .foot__grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 32px; } }\r\n@media (max-width: 520px) { .foot__grid { grid-template-columns: minmax(0, 1fr); } }\r\n\r\n\/* ==========================================================================\r\n   Motion \u2014 one orchestrated load, nothing scattered\r\n   ========================================================================== *\/\r\n.rise { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }\r\n.rise.is-in { opacity: 1; transform: none; }\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  html { scroll-behavior: auto; }\r\n  .rise { opacity: 1; transform: none; transition: none; }\r\n  .ring__bar { transition: none; }\r\n  .btn:hover { transform: none; }\r\n}\r\n<\/style>\r\n\r\n\r\n\r\n<main id=\"top\">\r\n\r\n  <!-- ================= Hero ================= -->\r\n  <section class=\"hero\">\r\n    <div class=\"shell hero__grid\">\r\n\r\n      <div class=\"rise\">\r\n        <p class=\"eyebrow\"><span class=\"notch\" aria-hidden=\"true\"><\/span>Talent marketplace \u00b7 Jordan<\/p>\r\n        <h1>You don't apply.<br>You get <em>found<\/em>.<\/h1>\r\n        <p class=\"hero__lead\">\r\n          Fill in one profile. Employers across Jordan search it by skill, years and\r\n          degree \u2014 and pay to reach you, not the other way round.\r\n        <\/p>\r\n\r\n        <div class=\"hero__doors\">\r\n          <a class=\"btn\" href=\"\/sign-in\/?tab=up&amp;for=candidate\">I'm looking for work<\/a>\r\n          <a class=\"btn btn--line\" href=\"\/plans\/?for=company\">We're hiring<\/a>\r\n        <\/div>\r\n\r\n        <p class=\"hero__note\">\r\n          <span class=\"notch\" aria-hidden=\"true\"><\/span>\r\n          Free to build a profile and be found. No CV blasting, no application black hole.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <!--\r\n        The signature element. This is the product's own instrument, not a stock\r\n        illustration: a real search, real match rings, and the shortfall spelled\r\n        out. Showing an imperfect result on a landing page is the risk \u2014 it is\r\n        also the most honest and most distinctive thing here.\r\n      -->\r\n      <div class=\"rig rise\" aria-label=\"Example of an employer's search results\">\r\n        <div class=\"rig__bar\">\r\n          <p class=\"rig__q\"><b>wordpress<\/b> \u00b7 <b>3+ yrs<\/b> \u00b7 <b>Amman<\/b> \u00b7 bachelor<\/p>\r\n          <span class=\"rig__count\">match \u00b7 3 of 47<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"row\">\r\n          <svg class=\"ring\" viewBox=\"0 0 100 100\" role=\"img\" aria-label=\"94 per cent match\">\r\n            <circle class=\"ring__track\" cx=\"50\" cy=\"50\" r=\"42\"><\/circle>\r\n            <circle class=\"ring__bar\" cx=\"50\" cy=\"50\" r=\"42\" data-pct=\"94\"><\/circle>\r\n            <text class=\"ring__num\" x=\"50\" y=\"58\">94<\/text>\r\n          <\/svg>\r\n          <div>\r\n            <p class=\"row__name\">Development Department Manager<\/p>\r\n            <p class=\"row__meta\">8 yrs \u00b7 Amman \u00b7 Bachelor, Computer Science<\/p>\r\n            <p class=\"row__why\">2 of 2 skills \u00b7 title matches<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row\">\r\n          <svg class=\"ring\" viewBox=\"0 0 100 100\" role=\"img\" aria-label=\"81 per cent match\">\r\n            <circle class=\"ring__track\" cx=\"50\" cy=\"50\" r=\"42\"><\/circle>\r\n            <circle class=\"ring__bar\" cx=\"50\" cy=\"50\" r=\"42\" data-pct=\"81\"><\/circle>\r\n            <text class=\"ring__num\" x=\"50\" y=\"58\">81<\/text>\r\n          <\/svg>\r\n          <div>\r\n            <p class=\"row__name\">Front-end Developer<\/p>\r\n            <p class=\"row__meta\">4 yrs \u00b7 Zarqa \u00b7 Bachelor, Software Engineering<\/p>\r\n            <p class=\"row__why\">2 of 2 skills<\/p>\r\n            <p class=\"row__gap\">elsewhere, but open to relocating<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"row\">\r\n          <svg class=\"ring\" viewBox=\"0 0 100 100\" role=\"img\" aria-label=\"68 per cent match\">\r\n            <circle class=\"ring__track\" cx=\"50\" cy=\"50\" r=\"42\"><\/circle>\r\n            <circle class=\"ring__bar\" cx=\"50\" cy=\"50\" r=\"42\" data-pct=\"68\"><\/circle>\r\n            <text class=\"ring__num\" x=\"50\" y=\"58\">68<\/text>\r\n          <\/svg>\r\n          <div>\r\n            <p class=\"row__name\">Web Developer<\/p>\r\n            <p class=\"row__meta\">6 yrs \u00b7 Irbid \u00b7 Diploma, Computer Information Systems<\/p>\r\n            <p class=\"row__why\">2 of 2 skills \u00b7 6 yrs experience<\/p>\r\n            <p class=\"row__gap\">Diploma, you asked for Bachelor<\/p>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ================= Thesis ================= -->\r\n  <section class=\"thesis\">\r\n    <div class=\"shell\">\r\n      <div class=\"thesis__in rise\">\r\n        <h2>Nobody is filtered out. <span>They're ranked, and told why.<\/span><\/h2>\r\n        <p>\r\n          Most job sites hide anyone who misses a box. Ask KaderJo for a bachelor's\r\n          degree and the strong candidate with a diploma still appears \u2014 lower down,\r\n          labelled <span class=\"mono\">Diploma, you asked for Bachelor<\/span>. You decide\r\n          whether that matters. It usually does not.\r\n        <\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ================= Two doors ================= -->\r\n  <section class=\"doors\" id=\"how\">\r\n    <div class=\"shell\">\r\n      <p class=\"eyebrow rise\"><span class=\"notch\" aria-hidden=\"true\"><\/span>How it works \u00b7 two sides<\/p>\r\n\r\n      <div class=\"doors__grid rise\">\r\n\r\n        <div class=\"door\">\r\n          <h3>For people looking<\/h3>\r\n          <p class=\"door__sub\">One profile, kept current, working for you in the background.<\/p>\r\n\r\n          <ol class=\"steps\">\r\n            <li>\r\n              <b>Fill in what you've done<\/b>\r\n              <span>Roles, education, skills, certificates, languages, projects. It tells you what's still missing and what each part is worth.<\/span>\r\n            <\/li>\r\n            <li>\r\n              <b>Choose who can see you<\/b>\r\n              <span>Public, or hidden until an employer unlocks you. Your current employer will not stumble across it.<\/span>\r\n            <\/li>\r\n            <li>\r\n              <b>Get found, or export a CV<\/b>\r\n              <span>Employers search you by skill and experience. On a paid plan you can also export a designed PDF in six templates.<\/span>\r\n            <\/li>\r\n          <\/ol>\r\n\r\n          <a class=\"btn\" href=\"\/sign-in\/?tab=up&amp;for=candidate\">Create my profile \u2014 free<\/a>\r\n        <\/div>\r\n\r\n        <div class=\"door\">\r\n          <h3>For people hiring<\/h3>\r\n          <p class=\"door__sub\">Search everyone. Spend a credit only when you want to talk.<\/p>\r\n\r\n          <ol class=\"steps\">\r\n            <li>\r\n              <b>Filter the whole database<\/b>\r\n              <span>Skills, years, degree, field of study, university, city, work mode, availability, salary expectation, languages.<\/span>\r\n            <\/li>\r\n            <li>\r\n              <b>Read the shortlist and the gaps<\/b>\r\n              <span>Every result carries a match percentage and the reason for it, so you can judge a near-miss instead of never seeing it.<\/span>\r\n            <\/li>\r\n            <li>\r\n              <b>Unlock the ones worth a conversation<\/b>\r\n              <span>One credit opens their contact details and a direct message. Browsing and reading profiles costs nothing.<\/span>\r\n            <\/li>\r\n          <\/ol>\r\n\r\n          <a class=\"btn btn--line\" href=\"\/plans\/?for=company\">See hiring plans<\/a>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ================= Looking quietly ================= -->\r\n  <section class=\"quiet\" id=\"quiet\">\r\n    <div class=\"shell quiet__grid\">\r\n\r\n      <div class=\"rise\">\r\n        <p class=\"eyebrow\"><span class=\"notch\" aria-hidden=\"true\"><\/span>For the employed<\/p>\r\n        <h2 style=\"color:white!important\">Look for the next job without announcing it.<\/h2>\r\n        <p>\r\n          Most people who should be moving already have a job, and cannot be seen\r\n          looking. Turn on anonymous mode and employers still find you on your skills\r\n          and your experience \u2014 your name, your photo and your current employer stay\r\n          hidden until you're unlocked, and search engines never see them at all.\r\n        <\/p>\r\n        <div class=\"quiet__cta\">\r\n          <a class=\"btn btn--onink\" href=\"\/sign-in\/?tab=up&amp;for=candidate\">Start privately<\/a>\r\n          <a class=\"btn btn--ghostink\" href=\"#plans\">What it costs<\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- What an employer sees of a hidden candidate, before unlocking. -->\r\n      <div class=\"masked rise\" aria-label=\"What an employer sees before unlocking an anonymous candidate\">\r\n        <div class=\"masked__head\">\r\n          <span class=\"masked__av\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M12 12a5 5 0 1 0-5-5 5 5 0 0 0 5 5Zm0 2c-4 0-8 2-8 5v1h16v-1c0-3-4-5-8-5Z\"><\/path><\/svg>\r\n          <\/span>\r\n          <span class=\"masked__id\">\r\n            <b>Candidate #418<\/b>\r\n            <span>Senior Accountant \u00b7 9 yrs<\/span>\r\n          <\/span>\r\n        <\/div>\r\n        <ul class=\"masked__list\">\r\n          <li><span>Skills<\/span> <b>IFRS, Odoo, audit<\/b><\/li>\r\n          <li><span>Education<\/span> <b>Bachelor, Accounting<\/b><\/li>\r\n          <li><span>Based in<\/span> <b>Amman<\/b><\/li>\r\n          <li><span>Available<\/span> <b>Within a month<\/b><\/li>\r\n          <li><span>Name<\/span> <span class=\"hid\">hidden until unlocked<\/span><\/li>\r\n          <li><span>Current employer<\/span> <span class=\"hid\">hidden until unlocked<\/span><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ================= Plans ================= -->\r\n  <section class=\"plans\" id=\"plans\">\r\n    <div class=\"shell\">\r\n      <div class=\"plans__head rise\">\r\n        <p class=\"eyebrow\"><span class=\"notch\" aria-hidden=\"true\"><\/span>What it costs<\/p>\r\n        <h2>Free to be found. Paid when it's doing real work.<\/h2>\r\n        <p>Two sides, two kinds of plan. Nothing is charged before you have an account, and nothing renews without you.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"plans__grid rise\">\r\n\r\n        <div class=\"plan\">\r\n          <h3>Job seekers<\/h3>\r\n          <p class=\"plan__who\">Starter \u2014 free<\/p>\r\n          <p class=\"plan__free\">Build the whole profile and be searchable by every employer on the platform, at no cost.<\/p>\r\n          <ul>\r\n            <li>Full profile: experience, education, skills, certificates, languages<\/li>\r\n            <li>Listed in employer searches with your match score<\/li>\r\n            <li>Messages from employers who unlocked you<\/li>\r\n            <li class=\"is-paid\">Designed CV export, six templates <em>paid<\/em><\/li>\r\n            <li class=\"is-paid\">Anonymous mode and who-viewed-you <em>paid<\/em><\/li>\r\n          <\/ul>\r\n          <a class=\"btn\" href=\"\/plans\/?for=candidate\">Compare seeker plans<\/a>\r\n        <\/div>\r\n\r\n        <div class=\"plan plan--hire\">\r\n          <h3>Employers<\/h3>\r\n          <p class=\"plan__who\">Credits, not per-post fees<\/p>\r\n          <p class=\"plan__free\">Search and read the database on any plan. Credits are only spent to open a conversation.<\/p>\r\n          <ul>\r\n            <li>Unlimited filtered search with match scoring<\/li>\r\n            <li>One credit unlocks one candidate: contact details and messaging<\/li>\r\n            <li>Pipelines, saved searches and email alerts for new matches<\/li>\r\n            <li>Job posts, and the people who already fit them<\/li>\r\n            <li>Team seats sharing one credit pool<\/li>\r\n          <\/ul>\r\n          <a class=\"btn btn--teal\" href=\"\/plans\/?for=company\">See hiring plans<\/a>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <!-- ================= Questions ================= -->\r\n  <section class=\"qs\">\r\n    <div class=\"shell\">\r\n      <h2 class=\"rise\">Straight answers<\/h2>\r\n\r\n      <div class=\"rise\">\r\n        <details>\r\n          <summary>Is it really free for job seekers?<\/summary>\r\n          <div class=\"qs__a\">\r\n            <p>Building your profile and being found is free, permanently. Two things sit behind a paid plan: exporting your profile as a designed PDF CV, and the privacy and analytics extras \u2014 anonymous mode, and seeing which employers opened your profile.<\/p>\r\n          <\/div>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>Will my current employer see that I'm looking?<\/summary>\r\n          <div class=\"qs__a\">\r\n            <p>Not if you turn on anonymous mode. Your experience and skills stay searchable, but your name, photo, links and current employer are withheld until you're unlocked. Names are also hidden from anyone who isn't signed in on a plan, so your profile does not turn up in a search engine.<\/p>\r\n          <\/div>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>How is this different from posting a job?<\/summary>\r\n          <div class=\"qs__a\">\r\n            <p>A job post waits for people to find it and rewards whoever applies most. Here you go the other way: filter the whole database yourself, see how well each person fits and where they fall short, and reach only the ones you actually want. You can still post a role \u2014 and we'll show you who already matches it.<\/p>\r\n          <\/div>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>What does a credit buy, exactly?<\/summary>\r\n          <div class=\"qs__a\">\r\n            <p>One credit opens one candidate: their email, phone and links, plus a direct message to them. Searching, reading full profiles and building pipelines cost nothing. An unlock is permanent and shared with everyone on your team's account, so nobody pays twice for the same person.<\/p>\r\n          <\/div>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>Do you write the CV for me?<\/summary>\r\n          <div class=\"qs__a\">\r\n            <p>No \u2014 you write it, once. What we do is lay it out: pick a template, choose which sections appear, and export a clean PDF in Arabic or English. Because it's generated from your profile, updating one keeps the other current.<\/p>\r\n          <\/div>\r\n        <\/details>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n<\/main>\r\n\r\n<footer class=\"foot\">\r\n  <div class=\"shell\">\r\n    <div class=\"foot__grid\">\r\n      <div>\r\n        <img decoding=\"async\" src=\"https:\/\/darkseagreen-llama-386714.hostingersite.com\/wp-content\/uploads\/2026\/08\/KaderJo.png\" alt=\"KaderJo\">\r\n        <p class=\"foot__note\">A talent marketplace for Jordan. Built in Amman by WEBIT.<\/p>\r\n      <\/div>\r\n      <div>\r\n        <h4>Looking<\/h4>\r\n        <ul>\r\n          <li><a href=\"\/sign-in\/?tab=up&amp;for=candidate\">Create a profile<\/a><\/li>\r\n          <li><a href=\"\/plans\/?for=candidate\">Seeker plans<\/a><\/li>\r\n          <li><a href=\"\/jobs\/\">Open roles<\/a><\/li>\r\n          <li><a href=\"\/talent\/\">Browse talent<\/a><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n      <div>\r\n        <h4>Hiring<\/h4>\r\n        <ul>\r\n          <li><a href=\"\/plans\/?for=company\">Hiring plans<\/a><\/li>\r\n          <li><a href=\"\/find-talent\/\">Search candidates<\/a><\/li>\r\n          <li><a href=\"\/employers\/\">Employer directory<\/a><\/li>\r\n          <li><a href=\"\/sign-in\/\">Employer sign in<\/a><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n      \r\n    <\/div>\r\n\r\n    <div class=\"foot__base\">\r\n      <span>\u00a9 <span id=\"yr\">2026<\/span> KaderJo \u00b7  Jordan \u00b7  Powered and Designed by <a style=\"font-weight:bold; color:#0DA99C\r\n\" href=\"https:\/\/Webitjo.com\" target=\"_blank\">WebitJo<\/a><\/span>\r\n      <span class=\"mono\">kaderjo.com<\/span>\r\n    <\/div>\r\n  <\/div>\r\n<\/footer>\r\n\r\n<script>\r\n(function () {\r\n  'use strict';\r\n\r\n  var reduced = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n  document.getElementById('yr').textContent = new Date().getFullYear();\r\n\r\n  \/* The rings draw themselves once, in sequence. One orchestrated moment\r\n     rather than effects scattered down the page. *\/\r\n  function drawRings() {\r\n    var rings = document.querySelectorAll('.ring__bar');\r\n    Array.prototype.forEach.call(rings, function (bar, i) {\r\n      var circumference = 2 * Math.PI * 42;\r\n      var pct = parseInt(bar.getAttribute('data-pct'), 10) || 0;\r\n      var target = circumference * (1 - pct \/ 100);\r\n\r\n      bar.style.strokeDasharray = circumference;\r\n\r\n      if (reduced) {\r\n        bar.style.strokeDashoffset = target;\r\n        return;\r\n      }\r\n\r\n      bar.style.strokeDashoffset = circumference;\r\n      setTimeout(function () { bar.style.strokeDashoffset = target; }, 220 + i * 150);\r\n    });\r\n  }\r\n\r\n  \/* Sections settle in as they arrive. Anything already on screen shows at once,\r\n     so nothing important depends on scrolling. *\/\r\n  function revealOnScroll() {\r\n    var items = document.querySelectorAll('.rise');\r\n\r\n    if (reduced || !('IntersectionObserver' in window)) {\r\n      Array.prototype.forEach.call(items, function (el) { el.classList.add('is-in'); });\r\n      return;\r\n    }\r\n\r\n    var io = new IntersectionObserver(function (entries) {\r\n      entries.forEach(function (entry) {\r\n        if (entry.isIntersecting) {\r\n          entry.target.classList.add('is-in');\r\n          io.unobserve(entry.target);\r\n        }\r\n      });\r\n    }, { rootMargin: '0px 0px -8% 0px', threshold: 0.08 });\r\n\r\n    Array.prototype.forEach.call(items, function (el) { io.observe(el); });\r\n  }\r\n\r\n  function start() {\r\n    revealOnScroll();\r\n    drawRings();\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', start);\r\n  } else {\r\n    start();\r\n  }\r\n}());\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>KaderJo \u2014 get found by employers in Jordan Talent marketplace \u00b7 Jordan You don&#8217;t apply.You get found. Fill in one<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_theme","meta":{"footnotes":""},"class_list":["post-98","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/pages\/98","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/comments?post=98"}],"version-history":[{"count":21,"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/pages\/98\/revisions"}],"predecessor-version":[{"id":126,"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/pages\/98\/revisions\/126"}],"wp:attachment":[{"href":"https:\/\/kaderjo.com\/ar\/wp-json\/wp\/v2\/media?parent=98"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}