{"id":130,"date":"2026-08-17T18:26:28","date_gmt":"2026-08-17T15:26:28","guid":{"rendered":"https:\/\/resumes.webitjo.com\/?page_id=130"},"modified":"2026-08-17T18:27:41","modified_gmt":"2026-08-17T15:27:41","slug":"guide","status":"publish","type":"page","link":"https:\/\/resumes.webitjo.com\/ar\/guide\/","title":{"rendered":"\u0627\u0644\u062f\u0644\u064a\u0644"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"130\" class=\"elementor elementor-130\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8846e1c e-con-full e-flex e-con e-parent\" data-id=\"8846e1c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0c92148 elementor-widget elementor-widget-html\" data-id=\"0c92148\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"utf-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\r\n<title>Guide \u2014 KaderJo<\/title>\r\n<meta name=\"description\" content=\"Every step of KaderJo, for job seekers and for employers: building a profile, publishing it, exporting a CV, searching candidates, unlocking, credits, pipelines and job posts.\">\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<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Archivo:wdth,wght@100..125,400..800&family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n\/* ==========================================================================\r\n   Same tokens as the home page, so the guide is plainly the same site.\r\n   Every colour comes from the KaderJo logo file.\r\n   ========================================================================== *\/\r\n:root {\r\n  --ink:        #1B1B1B;\r\n  --teal:       #16A89A;\r\n  --teal-bright:#1DCCBB;\r\n  --teal-deep:  #0C7A6F;\r\n  --wash:       #E6F6F4;\r\n  --paper:      #F6F8F7;\r\n  --card:       #FFFFFF;\r\n  --line:       #E3E9E7;\r\n  --slate:      #5E6B69;\r\n  --amber:      #B67A22;\r\n  --amber-wash: #FDF4E6;\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: 1240px;\r\n  --r: 14px;\r\n  --topbar: 74px;\r\n}\r\n\r\n*, *::before, *::after { box-sizing: border-box; }\r\n\r\nhtml { scroll-behavior: smooth; scroll-padding-top: calc(var(--topbar) + 70px); }\r\n\r\nbody {\r\n  margin: 0;\r\n  background: var(--paper);\r\n  color: var(--ink);\r\n  font: 400 16.5px\/1.65 var(--body);\r\n  -webkit-font-smoothing: antialiased;\r\n}\r\n\r\nh1, h2, h3, h4 {\r\n  font-family: var(--display);\r\n  font-variation-settings: 'wdth' 108;\r\n  line-height: 1.12;\r\n  letter-spacing: -0.015em;\r\n  margin: 0;\r\n}\r\n\r\np { margin: 0 0 1em; }\r\na { color: var(--teal-deep); }\r\nul, ol { margin: 0 0 1em; padding-inline-start: 1.15em; }\r\nli { margin-bottom: .4em; }\r\ncode, kbd {\r\n  font: 500 .88em\/1.4 var(--mono);\r\n  background: var(--wash);\r\n  color: var(--teal-deep);\r\n  padding: 2px 6px;\r\n  border-radius: 5px;\r\n}\r\nstrong { font-weight: 600; }\r\n\r\n.shell { width: 100%; max-width: var(--shell); margin-inline: auto; padding-inline: 22px; }\r\n.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }\r\n\r\n.notch {\r\n  width: 9px; height: 13px;\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.eyebrow {\r\n  font: 500 11.5px\/1 var(--mono);\r\n  letter-spacing: .16em; text-transform: uppercase;\r\n  color: var(--teal-deep);\r\n  display: flex; align-items: center; gap: 9px;\r\n  margin: 0 0 16px;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Header\r\n   ========================================================================== *\/\r\n.top {\r\n  position: sticky; top: 0; z-index: 60;\r\n  background: rgba(246,248,247,.92);\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: 20px; height: var(--topbar); }\r\n.top__logo img { height: 32px; width: auto; display: block; }\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 a[aria-current=\"page\"] { background: var(--wash); color: var(--teal-deep); }\r\n.top__nav a.btn { color: #fff; }\r\n.top__nav a.btn:hover { color: #fff; }\r\n\r\n@media (max-width: 900px) { .top__nav a:not(.is-keep) { display: none; } }\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: 12px 20px;\r\n  border: 1.5px solid var(--ink); border-radius: 10px;\r\n  background: var(--ink); color: #fff;\r\n  font: 600 15px\/1 var(--body); text-decoration: none; cursor: pointer;\r\n  transition: background .14s ease, border-color .14s ease, transform .14s ease;\r\n}\r\n.btn:hover { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; transform: translateY(-1px); }\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); }\r\n.btn--sm { padding: 9px 15px; font-size: 14px; border-radius: 9px; }\r\n\r\na:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible {\r\n  outline: 3px solid var(--teal-bright); outline-offset: 3px; border-radius: 6px;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Page head + the role switch\r\n   ========================================================================== *\/\r\n.head { padding: 52px 0 30px; }\r\n.head h1 { font-size: clamp(33px, 4vw, 48px); font-weight: 800; margin-bottom: 16px; text-wrap: balance; }\r\n.head__lead { font-size: 18.5px; color: var(--slate); max-width: 62ch; }\r\n\r\n\/* Two audiences, one page. The switch is the primary control, so it is large,\r\n   labelled with who it is for, and it survives a reload via the URL. *\/\r\n.switch { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; max-width: 720px; margin-top: 28px; }\r\n\r\n.switch__btn {\r\n  text-align: start;\r\n  padding: 18px 20px;\r\n  border: 1.5px solid var(--line);\r\n  border-radius: var(--r);\r\n  background: var(--card);\r\n  cursor: pointer;\r\n  font-family: var(--body);\r\n  transition: border-color .15s ease, background .15s ease, transform .15s ease;\r\n}\r\n.switch__btn:hover { border-color: var(--teal); transform: translateY(-1px); }\r\n.switch__btn b { display: block; font: 600 17px\/1.3 var(--body); margin-bottom: 3px; }\r\n.switch__btn span { display: block; font-size: 14px; color: var(--slate); line-height: 1.45; }\r\n\r\n.switch__btn[aria-selected=\"true\"] {\r\n  border-color: var(--teal);\r\n  background: var(--wash);\r\n  box-shadow: inset 0 0 0 1px var(--teal);\r\n}\r\n.switch__btn[aria-selected=\"true\"] span { color: var(--teal-deep); }\r\n\r\n@media (max-width: 640px) { .switch { grid-template-columns: 1fr; } }\r\n\r\n\/* ==========================================================================\r\n   Layout: sticky contents beside the steps\r\n   ========================================================================== *\/\r\n.guide { padding: 34px 0 90px; }\r\n.guide__grid { display: grid; grid-template-columns: 258px minmax(0, 1fr); gap: 46px; align-items: start; }\r\n\r\n.toc {\r\n  position: sticky; top: calc(var(--topbar) + 22px);\r\n  max-height: calc(100vh - var(--topbar) - 50px);\r\n  overflow-y: auto;\r\n  padding-inline-end: 6px;\r\n}\r\n.toc__title { font: 500 11.5px\/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--slate); margin: 0 0 14px; }\r\n.toc ol { list-style: none; margin: 0; padding: 0; counter-reset: t; }\r\n.toc li { margin: 0; }\r\n.toc a {\r\n  counter-increment: t;\r\n  display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px;\r\n  padding: 8px 10px 8px 8px;\r\n  border-radius: 8px;\r\n  font-size: 14.5px; line-height: 1.35;\r\n  color: var(--slate); text-decoration: none;\r\n}\r\n.toc a::before {\r\n  content: counter(t);\r\n  font: 500 11px\/1.5 var(--mono);\r\n  color: var(--teal-deep);\r\n  background: var(--wash);\r\n  border-radius: 6px;\r\n  text-align: center;\r\n  padding: 2px 0;\r\n  height: 20px;\r\n}\r\n.toc a:hover { background: var(--card); color: var(--ink); }\r\n.toc a.is-here { background: var(--card); color: var(--ink); font-weight: 600; box-shadow: inset 2px 0 0 var(--teal); }\r\n.toc__extra { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }\r\n.toc__extra a { grid-template-columns: minmax(0,1fr); }\r\n.toc__extra a::before { content: none; }\r\n\r\n@media (max-width: 980px) {\r\n  .guide__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }\r\n  .toc {\r\n    position: static; max-height: none; margin-bottom: 34px;\r\n    background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px;\r\n  }\r\n}\r\n\r\n\/* ==========================================================================\r\n   Steps \u2014 a real sequence, so it is numbered\r\n   ========================================================================== *\/\r\n.step { padding-bottom: 44px; margin-bottom: 44px; border-bottom: 1px solid var(--line); }\r\n.step:last-of-type { border-bottom: 0; }\r\n\r\n.step__head { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; align-items: start; margin-bottom: 18px; }\r\n.step__n {\r\n  font: 500 15px\/44px var(--mono);\r\n  color: #fff; background: var(--ink);\r\n  border-radius: 11px; text-align: center;\r\n  height: 44px;\r\n}\r\n.step__head h3 { font-size: 25px; font-weight: 700; margin-bottom: 5px; }\r\n.step__head p { margin: 0; color: var(--slate); font-size: 15.5px; }\r\n\r\n.step__body { padding-inline-start: 60px; }\r\n@media (max-width: 620px) {\r\n  .step__body { padding-inline-start: 0; }\r\n  .step__head { grid-template-columns: 36px minmax(0,1fr); gap: 12px; }\r\n  .step__n { height: 36px; line-height: 36px; font-size: 13.5px; border-radius: 9px; }\r\n  .step__head h3 { font-size: 21px; }\r\n}\r\n\r\n\/* Where to click. Reads as a path, because that is how people navigate. *\/\r\n.path {\r\n  display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px;\r\n  font: 500 13px\/1.5 var(--mono);\r\n  background: var(--card); border: 1px solid var(--line);\r\n  border-radius: 9px; padding: 7px 12px;\r\n  margin: 0 0 18px;\r\n  color: var(--ink);\r\n}\r\n.path span { color: var(--slate); }\r\n.path b { font-weight: 500; color: var(--teal-deep); }\r\n\r\n\/* ==========================================================================\r\n   Field reference tables \u2014 \"every detail\"\r\n   ========================================================================== *\/\r\n.fields { width: 100%; border-collapse: collapse; margin: 0 0 20px; font-size: 15px; }\r\n.fields caption {\r\n  text-align: start;\r\n  font: 500 11.5px\/1 var(--mono); letter-spacing: .14em; text-transform: uppercase;\r\n  color: var(--slate); padding-bottom: 10px;\r\n}\r\n.fields th, .fields td { text-align: start; vertical-align: top; padding: 11px 14px 11px 0; border-top: 1px solid var(--line); }\r\n.fields th {\r\n  width: 34%;\r\n  font: 600 15px\/1.45 var(--body);\r\n}\r\n.fields td { color: var(--slate); line-height: 1.5; }\r\n.fields tr:first-child th, .fields tr:first-child td { border-top: 1px solid var(--ink); }\r\n.fields .tag {\r\n  display: inline-block; margin-inline-start: 6px;\r\n  font: 500 10.5px\/1.6 var(--mono); letter-spacing: .08em; text-transform: uppercase;\r\n  border-radius: 5px; padding: 0 6px; white-space: nowrap;\r\n}\r\n.tag--paid   { color: var(--amber);     border: 1px solid color-mix(in srgb, var(--amber) 34%, transparent); }\r\n.tag--filter { color: var(--teal-deep); border: 1px solid color-mix(in srgb, var(--teal) 34%, transparent); }\r\n.tag--private{ color: var(--slate);     border: 1px solid var(--line); }\r\n\r\n@media (max-width: 620px) {\r\n  .fields th, .fields td { display: block; width: auto; padding: 0; border-top: 0; }\r\n  .fields th { padding-top: 14px; border-top: 1px solid var(--line); }\r\n  .fields td { padding-bottom: 14px; }\r\n  .fields tr:first-child th { border-top: 1px solid var(--ink); }\r\n}\r\n\r\n\/* Legend for the tags above *\/\r\n.legend { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 26px; font-size: 13.5px; color: var(--slate); }\r\n.legend > span { display: inline-flex; align-items: baseline; gap: 8px; }\r\n.legend .tag { margin-inline-start: 0; }\r\n\r\n\/* ==========================================================================\r\n   Callouts \u2014 three kinds, each meaning something different\r\n   ========================================================================== *\/\r\n.note {\r\n  border: 1px solid var(--line);\r\n  border-inline-start: 3px solid var(--teal);\r\n  border-radius: 10px;\r\n  background: var(--card);\r\n  padding: 15px 18px;\r\n  margin: 0 0 20px;\r\n  font-size: 15.5px;\r\n}\r\n.note--watch { border-inline-start-color: var(--amber); background: var(--amber-wash); border-color: color-mix(in srgb, var(--amber) 20%, var(--line)); }\r\n.note--paid  { border-inline-start-color: var(--amber); }\r\n.note p:last-child { margin-bottom: 0; }\r\n.note b { font-weight: 600; }\r\n.note__k { display: block; font: 500 11px\/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--teal-deep); margin-bottom: 7px; }\r\n.note--watch .note__k, .note--paid .note__k { color: var(--amber); }\r\n\r\n\/* ==========================================================================\r\n   Checklists\r\n   ========================================================================== *\/\r\n.check { list-style: none; margin: 0 0 20px; padding: 0; }\r\n.check li { position: relative; padding-inline-start: 28px; margin-bottom: 9px; }\r\n.check li::before {\r\n  content: \"\\2713\";\r\n  position: absolute; inset-inline-start: 0; top: .2em;\r\n  width: 17px; height: 17px;\r\n  font: 400 11px\/15px var(--body);\r\n  text-align: center;\r\n  color: var(--teal-deep);\r\n  background: var(--wash);\r\n  border: 1.5px solid color-mix(in srgb, var(--teal) 45%, transparent);\r\n  border-radius: 5px;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Small cards used for templates, stages, plan compare\r\n   ========================================================================== *\/\r\n.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin: 0 0 22px; }\r\n.tile {\r\n  background: var(--card); border: 1px solid var(--line); border-radius: 11px; padding: 14px 16px;\r\n}\r\n.tile b { display: block; font: 600 15px\/1.3 var(--body); margin-bottom: 3px; }\r\n.tile span { font-size: 13.5px; color: var(--slate); line-height: 1.45; }\r\n\r\n.compare { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0 0 22px; }\r\n.compare th, .compare td { padding: 11px 12px; border-top: 1px solid var(--line); text-align: start; }\r\n.compare thead th {\r\n  border-top: 0; border-bottom: 1px solid var(--ink);\r\n  font: 500 11.5px\/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--slate);\r\n}\r\n.compare tbody th { font-weight: 500; }\r\n.compare td { color: var(--slate); }\r\n.compare .yes { color: var(--teal-deep); font-weight: 600; }\r\n.compare .no  { color: var(--slate); }\r\n\r\n@media (max-width: 620px) { .compare { font-size: 14px; } .compare th, .compare td { padding: 9px 8px; } }\r\n\r\n\/* ==========================================================================\r\n   FAQ\r\n   ========================================================================== *\/\r\ndetails {\r\n  background: var(--card); border: 1px solid var(--line);\r\n  border-radius: 11px; margin-bottom: 9px; overflow: hidden;\r\n}\r\nsummary {\r\n  cursor: pointer; list-style: none;\r\n  padding: 15px 18px;\r\n  font: 600 16px\/1.4 var(--body);\r\n  display: flex; align-items: center; justify-content: space-between; gap: 14px;\r\n}\r\nsummary::-webkit-details-marker { display: none; }\r\nsummary::after { content: \"+\"; font: 400 21px\/1 var(--mono); color: var(--teal-deep); flex: none; }\r\ndetails[open] summary { border-bottom: 1px solid var(--line); }\r\ndetails[open] summary::after { content: \"\u2013\"; }\r\n.details__a { padding: 15px 18px 18px; color: var(--slate); font-size: 15.5px; }\r\n.details__a p:last-child { margin-bottom: 0; }\r\n\r\n\/* ==========================================================================\r\n   Section headings inside a role panel\r\n   ========================================================================== *\/\r\n.block { padding-top: 8px; }\r\n.block > h2 {\r\n  font-size: clamp(24px, 2.7vw, 31px); font-weight: 700;\r\n  margin-bottom: 10px; padding-top: 18px;\r\n}\r\n.block > .block__lead { color: var(--slate); max-width: 66ch; margin-bottom: 30px; }\r\n\r\n.panel[hidden] { display: none; }\r\n\r\n\/* ==========================================================================\r\n   Footer\r\n   ========================================================================== *\/\r\n.foot { background: var(--ink); color: rgba(255,255,255,.66); padding: 52px 0 30px; font-size: 14.5px; }\r\n.foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 38px; }\r\n.foot img { height: 28px; width: auto; opacity: .92; filter: brightness(0) invert(1); }\r\n.foot h4 { font: 500 11.5px\/1 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #fff; margin: 0 0 14px; }\r\n.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }\r\n.foot li { margin: 0; }\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: 16px; max-width: 36ch; line-height: 1.55; }\r\n.foot__base { margin-top: 40px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.13); font-size: 13.5px; }\r\n\r\n@media (max-width: 760px) { .foot__grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }\r\n@media (max-width: 480px) { .foot__grid { grid-template-columns: minmax(0,1fr); } }\r\n\r\n\/* ==========================================================================\r\n   Print \u2014 a guide gets printed and handed to people\r\n   ========================================================================== *\/\r\n@media print {\r\n  .top, .toc, .switch, .foot { display: none !important; }\r\n  body { background: #fff; font-size: 11pt; }\r\n  .panel[hidden] { display: block !important; }   \/* both roles on paper *\/\r\n  .guide__grid { display: block; }\r\n  .step { break-inside: avoid; border-bottom: 1px solid #ccc; }\r\n  details { break-inside: avoid; }\r\n  details > .details__a { display: block !important; }\r\n  a { color: inherit; text-decoration: underline; }\r\n  a[href^=\"\/\"]::after { content: \" (\" attr(href) \")\"; font-size: 9pt; color: #666; }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  html { scroll-behavior: auto; }\r\n  .btn:hover, .switch__btn:hover { transform: none; }\r\n  * { transition: none !important; }\r\n}\r\n<\/style>\r\n\r\n\r\n<main>\r\n\r\n  <!-- ===================== Page head + role switch ===================== -->\r\n  <section class=\"head\">\r\n    <div class=\"shell\">\r\n      <p class=\"eyebrow\"><span class=\"notch\" aria-hidden=\"true\"><\/span>Guide<\/p>\r\n      <h1>Everything on KaderJo, one step at a time.<\/h1>\r\n      <p class=\"head__lead\">\r\n        Two different jobs, so two different guides. Pick yours \u2014 every field, every\r\n        button, what it costs and what it does not.\r\n      <\/p>\r\n\r\n      <div class=\"switch\" role=\"tablist\" aria-label=\"Choose your guide\">\r\n        <button class=\"switch__btn\" role=\"tab\" id=\"tab-applicant\"\r\n                aria-controls=\"panel-applicant\" aria-selected=\"true\" data-role=\"applicant\">\r\n          <b>I'm looking for work<\/b>\r\n          <span>Build a profile, get found, export a CV, reply to employers<\/span>\r\n        <\/button>\r\n        <button class=\"switch__btn\" role=\"tab\" id=\"tab-recruiter\"\r\n                aria-controls=\"panel-recruiter\" aria-selected=\"false\" data-role=\"recruiter\">\r\n          <b>I'm hiring<\/b>\r\n          <span>Search, read match scores, unlock people, run a pipeline<\/span>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <section class=\"guide\">\r\n    <div class=\"shell\">\r\n\r\n      <!-- =================================================================\r\n           APPLICANT\r\n           ================================================================= -->\r\n      <div class=\"panel\" id=\"panel-applicant\" role=\"tabpanel\" aria-labelledby=\"tab-applicant\" tabindex=\"0\">\r\n        <div class=\"guide__grid\">\r\n\r\n          <nav class=\"toc\" aria-label=\"Steps for job seekers\">\r\n            <p class=\"toc__title\">For job seekers<\/p>\r\n            <ol>\r\n              <li><a href=\"#a1\">Create your account<\/a><\/li>\r\n              <li><a href=\"#a2\">Find your way around<\/a><\/li>\r\n              <li><a href=\"#a3\">Fill in About you<\/a><\/li>\r\n              <li><a href=\"#a4\">Add your experience<\/a><\/li>\r\n              <li><a href=\"#a5\">Add education<\/a><\/li>\r\n              <li><a href=\"#a6\">Add skills<\/a><\/li>\r\n              <li><a href=\"#a7\">The extra sections<\/a><\/li>\r\n              <li><a href=\"#a8\">Decide who can see you<\/a><\/li>\r\n              <li><a href=\"#a9\">Publish your profile<\/a><\/li>\r\n              <li><a href=\"#a10\">Export a CV<\/a><\/li>\r\n              <li><a href=\"#a11\">Your QR code<\/a><\/li>\r\n              <li><a href=\"#a12\">Messages and jobs<\/a><\/li>\r\n            <\/ol>\r\n            <div class=\"toc__extra\">\r\n              <ol>\r\n                <li><a href=\"#a-cost\">What it costs<\/a><\/li>\r\n                <li><a href=\"#a-privacy\">Your privacy<\/a><\/li>\r\n                <li><a href=\"#a-faq\">If something goes wrong<\/a><\/li>\r\n              <\/ol>\r\n            <\/div>\r\n          <\/nav>\r\n\r\n          <div class=\"block\">\r\n\r\n            <h2>For job seekers<\/h2>\r\n            <p class=\"block__lead\">\r\n              The whole point is that you fill this in once and it keeps working. Employers\r\n              search it; you do not chase adverts. Building the profile and being found is\r\n              free \u2014 exporting a designed CV and hiding your identity are on the paid plan.\r\n            <\/p>\r\n\r\n            <!-- ---------------- Step 1 ---------------- -->\r\n            <article class=\"step\" id=\"a1\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">1<\/span>\r\n                <div>\r\n                  <h3>Create your account<\/h3>\r\n                  <p>Two minutes. You are on the free plan the moment you finish.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Create an account<\/b> <span>\u2192<\/span> <b>I am looking for a job<\/b><\/p>\r\n\r\n                <p>\r\n                  You need a name, an email and a password of at least eight characters.\r\n                  Choosing <em>I am looking for a job<\/em> matters: it decides which dashboard\r\n                  you get and which plans you are shown. Pick wrong and you will be looking at\r\n                  recruiter screens.\r\n                <\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>Use an email you will still have after you change jobs \u2014 not your work address.<\/li>\r\n                  <li>Your name becomes your public display name; you can change it later.<\/li>\r\n                  <li>The free <strong>Starter<\/strong> plan is applied automatically. No card, no trial clock.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Already have an account<\/span>\r\n                  <p>\r\n                    Sign in instead. If you have a plan you land on your profile; if you do not,\r\n                    you land on the plans page for your side. Forgotten password links come from\r\n                    WordPress itself, so check spam if one is slow.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 2 ---------------- -->\r\n            <article class=\"step\" id=\"a2\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">2<\/span>\r\n                <div>\r\n                  <h3>Find your way around<\/h3>\r\n                  <p>One page, a row of tabs, and a strength ring that tells you what is left.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>The tabs, and what each is for<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Overview<\/th><td>Your profile strength, what is still missing and what each missing piece is worth, plus your view and download counts.<\/td><\/tr>\r\n                    <tr><th>About you<\/th><td>Name, headline, summary, contact details, location, availability, salary expectation, links, photo.<\/td><\/tr>\r\n                    <tr><th>Experience<\/th><td>Every role you have held. This is what employers filter on first.<\/td><\/tr>\r\n                    <tr><th>Education<\/th><td>Degrees, diplomas and certificates, with field of study.<\/td><\/tr>\r\n                    <tr><th>Skills<\/th><td>The single most-used filter on the employer side.<\/td><\/tr>\r\n                    <tr><th>More sections<\/th><td>Certifications, languages, projects, awards, volunteering, references.<\/td><\/tr>\r\n                    <tr><th>Resumes<\/th><td>Your CV versions and the PDF download. <span class=\"tag tag--paid\">paid<\/span><\/td><\/tr>\r\n                    <tr><th>Visibility<\/th><td>Public, anonymous or hidden; publishing; your profile address; who unlocked you.<\/td><\/tr>\r\n                    <tr><th>Messages<\/th><td>Conversations with employers who unlocked you.<\/td><\/tr>\r\n                    <tr><th>Who looked<\/th><td>Views over the last month and how rare each of your skills is here. <span class=\"tag tag--paid\">paid<\/span><\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">The ring on the right<\/span>\r\n                  <p>\r\n                    That number is your profile strength, and the list under it is ordered by\r\n                    how many points each gap is worth. It is not decoration: the same things\r\n                    that raise it are the things that make you findable.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 3 ---------------- -->\r\n            <article class=\"step\" id=\"a3\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">3<\/span>\r\n                <div>\r\n                  <h3>Fill in About you<\/h3>\r\n                  <p>The part employers read first, and the part they filter on.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>About you<\/b><\/p>\r\n\r\n                <div class=\"legend\">\r\n                  <span><span class=\"tag tag--filter\">filter<\/span> employers can search on it<\/span>\r\n                  <span><span class=\"tag tag--private\">private<\/span> never shown publicly<\/span>\r\n                  <span><span class=\"tag tag--paid\">paid<\/span> needs a paid plan<\/span>\r\n                <\/div>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Every field on this tab<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Photo<\/th><td>Up to 5 MB, JPG, PNG, WebP or GIF. A square headshot works best. Optional \u2014 but profiles with one get opened more.<\/td><\/tr>\r\n                    <tr><th>Full name<\/th><td>Required. Also updates the name shown on the site.<\/td><\/tr>\r\n                    <tr><th>Headline <span class=\"tag tag--filter\">filter<\/span><\/th><td>One line, up to 120 characters, and the first thing shown in a search result. Say what you do and for whom, not \"hard-working professional\".<\/td><\/tr>\r\n                    <tr><th>Summary <span class=\"tag tag--filter\">filter<\/span><\/th><td>A short paragraph in your own words. Every word here is searchable, so write the terms your industry actually uses.<\/td><\/tr>\r\n                    <tr><th>Contact email<\/th><td>Shown only to employers who have spent a credit to unlock you. Never public.<\/td><\/tr>\r\n                    <tr><th>Phone<\/th><td>Same rule as the email.<\/td><\/tr>\r\n                    <tr><th>Country and city <span class=\"tag tag--filter\">filter<\/span><\/th><td>Employers filter by city constantly. Leaving it blank means you miss those searches.<\/td><\/tr>\r\n                    <tr><th>Preferred way of working <span class=\"tag tag--filter\">filter<\/span><\/th><td>On site, hybrid or remote.<\/td><\/tr>\r\n                    <tr><th>Availability <span class=\"tag tag--filter\">filter<\/span><\/th><td>Immediately, within a month, and so on. Keep it honest \u2014 it sets expectations before the first call.<\/td><\/tr>\r\n                    <tr><th>Salary expectation <span class=\"tag tag--private\">private<\/span> <span class=\"tag tag--filter\">filter<\/span><\/th><td>From, to and currency. Never appears on your public page. Employers can filter by their budget ceiling \u2014 and a blank expectation is included in those results, so leaving it empty does not cost you.<\/td><\/tr>\r\n                    <tr><th>Year of birth, nationality<\/th><td>Optional. Only reaches a CV if you switch that section on.<\/td><\/tr>\r\n                    <tr><th>Open to relocating <span class=\"tag tag--filter\">filter<\/span><\/th><td>Worth ticking if true: when an employer searches another city, you still appear with partial credit instead of dropping out.<\/td><\/tr>\r\n                    <tr><th>Driving licence<\/th><td>Optional, matters in some roles.<\/td><\/tr>\r\n                    <tr><th>Links<\/th><td>LinkedIn, GitHub, website, portfolio. Shown only after an unlock.<\/td><\/tr>\r\n                    <tr><th>Video introduction<\/th><td>A YouTube or Vimeo link. Thirty seconds is plenty.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note note--watch\">\r\n                  <span class=\"note__k\">Worth knowing<\/span>\r\n                  <p>\r\n                    Your headline and summary are read by the search as plain text, and Arabic is\r\n                    normalised before matching \u2014 so <span class=\"mono\">\u0623\u062d\u0645\u062f<\/span> and\r\n                    <span class=\"mono\">\u0627\u062d\u0645\u062f<\/span> find each other, and spelling variants do not\r\n                    lose you results. Write naturally.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 4 ---------------- -->\r\n            <article class=\"step\" id=\"a4\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">4<\/span>\r\n                <div>\r\n                  <h3>Add your experience<\/h3>\r\n                  <p>Start with the current or most recent role and work backwards.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Experience<\/b> <span>\u2192<\/span> <b>Add a role<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Fields on a role<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Job title <span class=\"tag tag--filter\">filter<\/span><\/th><td>Required. Use the title the industry recognises, not an internal grade.<\/td><\/tr>\r\n                    <tr><th>Company<\/th><td>Required. Hidden from employers while you are in anonymous mode.<\/td><\/tr>\r\n                    <tr><th>Type and mode <span class=\"tag tag--filter\">filter<\/span><\/th><td>Full time, part time, contract, freelance, internship; on site, hybrid, remote.<\/td><\/tr>\r\n                    <tr><th>Industry <span class=\"tag tag--filter\">filter<\/span><\/th><td>Searchable. One or two words.<\/td><\/tr>\r\n                    <tr><th>City and country<\/th><td>Where the role was based.<\/td><\/tr>\r\n                    <tr><th>Started, ended <span class=\"tag tag--filter\">filter<\/span><\/th><td>Month and year. Tick <em>I still work here<\/em> and the end date is ignored.<\/td><\/tr>\r\n                    <tr><th>What the role involved<\/th><td>A few plain sentences. Searchable.<\/td><\/tr>\r\n                    <tr><th>Things you shipped<\/th><td>One per line. Each line becomes a bullet point on your CV, so keep them concrete: what changed, and by how much.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">How years are counted<\/span>\r\n                  <p>\r\n                    Total experience is worked out from your dates, and overlapping roles are\r\n                    counted once \u2014 so two jobs held at the same time do not double your years.\r\n                    Employers filter on that total, which is why the dates matter more than they look.\r\n                  <\/p>\r\n                <\/div>\r\n\r\n                <p>Edit or remove any role from the list; changes are saved as you go and your totals recalculate immediately.<\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 5 ---------------- -->\r\n            <article class=\"step\" id=\"a5\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">5<\/span>\r\n                <div>\r\n                  <h3>Add education<\/h3>\r\n                  <p>Degree, diploma or certificate \u2014 whichever you have.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Education<\/b> <span>\u2192<\/span> <b>Add a qualification<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Fields on a qualification<\/caption>\r\n                  <tbody>\r\n                    <tr><th>School or university <span class=\"tag tag--filter\">filter<\/span><\/th><td>Required. Employers do search by university name.<\/td><\/tr>\r\n                    <tr><th>Level <span class=\"tag tag--filter\">filter<\/span><\/th><td>From secondary school through to doctorate. This is the one employers set a floor on.<\/td><\/tr>\r\n                    <tr><th>Field of study <span class=\"tag tag--filter\">filter<\/span><\/th><td>Heavily filtered. \"Computer Information Systems\" beats \"IT\".<\/td><\/tr>\r\n                    <tr><th>Grade or GPA<\/th><td>Optional.<\/td><\/tr>\r\n                    <tr><th>Dates<\/th><td>Month and year, or tick <em>Still studying<\/em>.<\/td><\/tr>\r\n                    <tr><th>Notes<\/th><td>Thesis, honours, anything relevant.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">You are not filtered out<\/span>\r\n                  <p>\r\n                    If an employer asks for a bachelor's degree and you hold a diploma, you still\r\n                    appear in their results \u2014 lower down, labelled <span class=\"mono\">Diploma, you\r\n                    asked for Bachelor<\/span>. Missing a box costs you position, not visibility.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 6 ---------------- -->\r\n            <article class=\"step\" id=\"a6\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">6<\/span>\r\n                <div>\r\n                  <h3>Add skills<\/h3>\r\n                  <p>The filter employers reach for first. Aim for eight or more.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Skills<\/b><\/p>\r\n\r\n                <p>\r\n                  Type a skill and suggestions appear from what is already on the platform, with\r\n                  a count beside each. Picking an existing spelling puts you in the same bucket as\r\n                  everyone else who has it, which is exactly what you want.\r\n                <\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Per skill<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Skill <span class=\"tag tag--filter\">filter<\/span><\/th><td>Write it the way your industry writes it. <code>WordPress<\/code>, not <code>wordpress cms development<\/code>.<\/td><\/tr>\r\n                    <tr><th>Level<\/th><td>Five steps from beginner to expert. Shown as a small bar on your profile.<\/td><\/tr>\r\n                    <tr><th>Years<\/th><td>Optional, and useful when two candidates list the same skill.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <ul class=\"check\">\r\n                  <li>Every skill an employer asks for and you have listed pushes your match score up. Skills carry the most weight of any filter.<\/li>\r\n                  <li>Do not pad the list with things you cannot discuss. Employers unlock you and then ask.<\/li>\r\n                  <li>On a paid plan the <em>Who looked<\/em> tab shows how rare each of your skills is here. A rare one is worth leading with.<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 7 ---------------- -->\r\n            <article class=\"step\" id=\"a7\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">7<\/span>\r\n                <div>\r\n                  <h3>The extra sections<\/h3>\r\n                  <p>Six more kinds of entry, each with its own fields.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>More sections<\/b><\/p>\r\n\r\n                <div class=\"tiles\">\r\n                  <div class=\"tile\"><b>Certifications<\/b><span>Name, who issued it, credential ID, date, link<\/span><\/div>\r\n                  <div class=\"tile\"><b>Languages<\/b><span>Language and how well you speak it<\/span><\/div>\r\n                  <div class=\"tile\"><b>Projects<\/b><span>Name, your role or client, date, link, details<\/span><\/div>\r\n                  <div class=\"tile\"><b>Awards<\/b><span>Award, who gave it, date<\/span><\/div>\r\n                  <div class=\"tile\"><b>Volunteering<\/b><span>What you did, the organisation, date<\/span><\/div>\r\n                  <div class=\"tile\"><b>References<\/b><span>Their name, their role and company<\/span><\/div>\r\n                <\/div>\r\n\r\n                <p>\r\n                  The form changes with the kind you are adding \u2014 a language asks how well you\r\n                  speak it, a certification asks for a credential ID, and neither is asked of the\r\n                  other. Languages are filterable, so add them even if they feel obvious.\r\n                <\/p>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">These reach your CV<\/span>\r\n                  <p>\r\n                    Anything you add here can appear on your exported CV, and a new CV switches on\r\n                    every section that has something in it. The count beside each switch in the\r\n                    resume builder tells you how many entries it will print.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 8 ---------------- -->\r\n            <article class=\"step\" id=\"a8\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">8<\/span>\r\n                <div>\r\n                  <h3>Decide who can see you<\/h3>\r\n                  <p>Three modes. The middle one is why most employed people can use this at all.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Visibility<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>The three modes<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Public<\/th><td>Your name and photo are visible to employers on a plan. Your email, phone and links still need an unlock.<\/td><\/tr>\r\n                    <tr><th>Anonymous <span class=\"tag tag--paid\">paid<\/span><\/th><td>Your experience, skills and education stay fully searchable. Your name, photo and the company names in your history are withheld until an employer spends a credit. You appear as <span class=\"mono\">Candidate #418<\/span>.<\/td><\/tr>\r\n                    <tr><th>Hidden<\/th><td>Out of search entirely. Your profile still exists and your CV still exports; nobody finds you.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Also true in every mode<\/span>\r\n                  <p>\r\n                    Names are withheld from anyone who is not signed in on a plan, so your profile\r\n                    does not turn up in a search engine under your name. Your contact details are\r\n                    never public in any mode.\r\n                  <\/p>\r\n                <\/div>\r\n\r\n                <p>\r\n                  This tab also holds your <strong>profile address<\/strong> \u2014 the\r\n                  <span class=\"mono\">\/talent\/your-name<\/span> part of the link you can share.\r\n                  Changing it breaks any link you have already sent, so pick it once.\r\n                <\/p>\r\n\r\n                <p>\r\n                  At the bottom is <strong>who unlocked you<\/strong>: the employers who have spent\r\n                  a credit on your profile, and when. That list is yours to see.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 9 ---------------- -->\r\n            <article class=\"step\" id=\"a9\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">9<\/span>\r\n                <div>\r\n                  <h3>Publish your profile<\/h3>\r\n                  <p>Nothing is searchable until you say so.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Visibility<\/b> <span>\u2192<\/span> <b>Publish my profile<\/b><\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>You need a headline and at least one role \u2014 roughly a quarter of the profile filled in. A near-empty profile helps nobody, so it is refused with a message saying what is short.<\/li>\r\n                  <li>Once published, the status in the sidebar reads <strong>Live in search<\/strong> and a <em>View public page<\/em> link appears.<\/li>\r\n                  <li>Untick it any time. You disappear from search immediately; your data stays.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note note--watch\">\r\n                  <span class=\"note__k\">If publishing is refused<\/span>\r\n                  <p>\r\n                    Two reasons only: the profile is too thin, or your plan does not include being\r\n                    listed. The message tells you which. Add a headline and one role, then try again.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 10 ---------------- -->\r\n            <article class=\"step\" id=\"a10\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">10<\/span>\r\n                <div>\r\n                  <h3>Export a CV<\/h3>\r\n                  <p>Six templates, as many versions as you need. This is the paid part.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Resumes<\/b> <span>\u2192<\/span> <b>New version<\/b><\/p>\r\n\r\n                <div class=\"note note--paid\">\r\n                  <span class=\"note__k\">On the paid plan<\/span>\r\n                  <p>\r\n                    On the free Starter plan this tab explains what upgrading adds and nothing else.\r\n                    Your profile stays searchable either way \u2014 the export is what you are paying for.\r\n                  <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"tiles\">\r\n                  <div class=\"tile\"><b>Sanad<\/b><span>Teal side rail, two columns<\/span><\/div>\r\n                  <div class=\"tile\"><b>Amman<\/b><span>Colour band across the top<\/span><\/div>\r\n                  <div class=\"tile\"><b>Muted<\/b><span>Typographic, conservative<\/span><\/div>\r\n                  <div class=\"tile\"><b>Atlas<\/b><span>Serif, executive<\/span><\/div>\r\n                  <div class=\"tile\"><b>Signal<\/b><span>Dark header, skill bars<\/span><\/div>\r\n                  <div class=\"tile\"><b>Plain<\/b><span>Stripped back, safest for CV scanners<\/span><\/div>\r\n                <\/div>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Setting up a version<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Name this version<\/th><td>Only you see it. \"Backend roles\", \"Gulf applications\" \u2014 whatever keeps them straight.<\/td><\/tr>\r\n                    <tr><th>Target role<\/th><td>Optional note to yourself.<\/td><\/tr>\r\n                    <tr><th>Template<\/th><td>Six above. Anything not on your plan is shown but locked.<\/td><\/tr>\r\n                    <tr><th>Paper<\/th><td>A4 or US Letter.<\/td><\/tr>\r\n                    <tr><th>Accent colour<\/th><td>Defaults to the site's teal.<\/td><\/tr>\r\n                    <tr><th>What goes on the page<\/th><td>A switch per section, each showing how many entries it holds. A section with nothing in it is skipped even when switched on.<\/td><\/tr>\r\n                    <tr><th>Use this one by default<\/th><td>The version an employer downloads when they open your profile.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  Save, then <strong>PDF<\/strong> to download or <strong>Preview<\/strong> to see it\r\n                  in a tab first. Every generated CV carries the site logo small in one corner.\r\n                <\/p>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Keep versions, not copies<\/span>\r\n                  <p>\r\n                    Make one version per kind of job you are going after and change which sections\r\n                    show, rather than rewriting your history. Because every version is generated\r\n                    from the same profile, updating a role updates all of them at once.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 11 ---------------- -->\r\n            <article class=\"step\" id=\"a11\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">11<\/span>\r\n                <div>\r\n                  <h3>Your QR code<\/h3>\r\n                  <p>On your public page, for a printed CV or a business card.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Visibility<\/b> <span>\u2192<\/span> <b>View public page<\/b><\/p>\r\n\r\n                <p>\r\n                  Your public profile carries a QR code that opens it when scanned, with the\r\n                  KaderJo mark in the middle. <strong>Download PNG<\/strong> for anything on screen,\r\n                  <strong>Download SVG<\/strong> for print \u2014 SVG stays sharp at any size, so use it\r\n                  on a printed CV or a card. <strong>Copy link<\/strong> gives you the plain address.\r\n                <\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>The code points at your profile address, so it keeps working as long as you do not change your slug.<\/li>\r\n                  <li>Hidden and unpublished profiles get no code \u2014 there would be nothing to open.<\/li>\r\n                  <li>Print it at 2 cm or larger. Smaller than that and phone cameras struggle.<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 12 ---------------- -->\r\n            <article class=\"step\" id=\"a12\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">12<\/span>\r\n                <div>\r\n                  <h3>Messages and jobs<\/h3>\r\n                  <p>Employers reach you here once they have unlocked you.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>My profile<\/b> <span>\u2192<\/span> <b>Messages<\/b><\/p>\r\n\r\n                <p>\r\n                  Conversations arrive without a page reload and the unread count appears in your\r\n                  menu and in the bar at the top of your dashboard. <kbd>Enter<\/kbd> sends,\r\n                  <kbd>Shift<\/kbd> + <kbd>Enter<\/kbd> starts a new line.\r\n                <\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Attachments<\/caption>\r\n                  <tbody>\r\n                    <tr><th>How many<\/th><td>Up to five files per message.<\/td><\/tr>\r\n                    <tr><th>How big<\/th><td>10 MB each.<\/td><\/tr>\r\n                    <tr><th>What kinds<\/th><td>PDF, Word, RTF, text, spreadsheets, images and ZIP. Scripts and programs are refused.<\/td><\/tr>\r\n                    <tr><th>Who can open them<\/th><td>Only the two of you. Files are served through the site after checking you are in the conversation, never as a public link.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  <strong>Applying to a posted job<\/strong> \u2014 open a role from the jobs page and use\r\n                  the apply box at the bottom. You can attach one of your CV versions or send your\r\n                  profile as it is, plus a short note. Your match score against that role is worked\r\n                  out automatically, and you can see the status of your application on the job page.\r\n                <\/p>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">You cannot start a conversation<\/span>\r\n                  <p>\r\n                    Only employers can open one, and only after paying to unlock you. That is\r\n                    deliberate: it keeps your inbox from filling with pitches, and it means anyone\r\n                    writing to you has already spent something to do it.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Cost ---------------- -->\r\n            <article class=\"step\" id=\"a-cost\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">\u00a3<\/span>\r\n                <div>\r\n                  <h3>What it costs<\/h3>\r\n                  <p>Free to be found. Paid for the export and the privacy extras.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <table class=\"compare\">\r\n                  <thead>\r\n                    <tr><th scope=\"col\">&nbsp;<\/th><th scope=\"col\">Starter \u2014 free<\/th><th scope=\"col\">Paid plan<\/th><\/tr>\r\n                  <\/thead>\r\n                  <tbody>\r\n                    <tr><th scope=\"row\">Full profile, every section<\/th><td class=\"yes\">Yes<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Listed in employer searches<\/th><td class=\"yes\">Yes<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Messages from employers<\/th><td class=\"yes\">Yes<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Apply to posted jobs<\/th><td class=\"yes\">Yes<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Export a designed CV<\/th><td class=\"no\">No<\/td><td class=\"yes\">Six templates<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Multiple CV versions<\/th><td class=\"no\">No<\/td><td class=\"yes\">As many as you want<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Anonymous mode<\/th><td class=\"no\">No<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                    <tr><th scope=\"row\">Who looked at you<\/th><td class=\"no\">No<\/td><td class=\"yes\">Yes<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  Upgrading takes you through the shop, and nothing is charged before you have an\r\n                  account. If your payment is waiting for approval \u2014 a bank transfer, say \u2014 your\r\n                  dashboard says so, with the order number, instead of asking you to buy again.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Privacy ---------------- -->\r\n            <article class=\"step\" id=\"a-privacy\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">\u25c6<\/span>\r\n                <div>\r\n                  <h3>Your privacy, in plain terms<\/h3>\r\n                  <p>What is visible, to whom, and when.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <ul class=\"check\">\r\n                  <li><strong>Your email and phone are never public.<\/strong> They appear only to an employer who has spent a credit on you.<\/li>\r\n                  <li><strong>Nobody without a plan sees your name.<\/strong> Not visitors, not search engines.<\/li>\r\n                  <li><strong>Anonymous mode hides your employers too<\/strong>, not just your name \u2014 the company names in your history are withheld until you are unlocked.<\/li>\r\n                  <li><strong>Your salary expectation is never displayed<\/strong> to anyone. It is only used to decide whether you fit a budget filter.<\/li>\r\n                  <li><strong>You can see who unlocked you<\/strong>, on the Visibility tab.<\/li>\r\n                  <li><strong>Hidden means hidden.<\/strong> Switch to hidden and you are out of every search immediately.<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- FAQ ---------------- -->\r\n            <article class=\"step\" id=\"a-faq\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">?<\/span>\r\n                <div>\r\n                  <h3>If something goes wrong<\/h3>\r\n                  <p>The handful of things people actually hit.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <details>\r\n                  <summary>I filled in a section but it is not on my CV<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Open the CV version and check the switch for that section under <em>What goes on the page<\/em>. The number beside each switch tells you how many entries it holds \u2014 if it reads zero, the entry is saved under a different section than you think.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>Nobody has viewed my profile<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Check three things, in order: is the profile published, is your city filled in, and do you have eight or more skills. Employers filter on skills and city first, so a profile missing either is invisible to most searches even when it is live.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>An employer messaged me and I do not want to reply<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Then do not. There is no obligation and no read-receipt pressure. If you would rather not be approached at all for a while, switch your visibility to hidden \u2014 you can switch back whenever.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>My PDF has no logo on it<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>That is a site setting rather than something on your profile. Tell us and we will check it \u2014 it does not affect your content, only the small mark in the corner.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>I signed up as the wrong side<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Get in touch and we will switch it. Your account and anything you have filled in stays; only which dashboard you land on changes.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n              <\/div>\r\n            <\/article>\r\n\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- =================================================================\r\n           RECRUITER\r\n           ================================================================= -->\r\n      <div class=\"panel\" id=\"panel-recruiter\" role=\"tabpanel\" aria-labelledby=\"tab-recruiter\" tabindex=\"0\" hidden>\r\n        <div class=\"guide__grid\">\r\n\r\n          <nav class=\"toc\" aria-label=\"Steps for employers\">\r\n            <p class=\"toc__title\">For employers<\/p>\r\n            <ol>\r\n              <li><a href=\"#r1\">Create your account<\/a><\/li>\r\n              <li><a href=\"#r2\">Choose a plan<\/a><\/li>\r\n              <li><a href=\"#r3\">Find your way around<\/a><\/li>\r\n              <li><a href=\"#r4\">Set up your company page<\/a><\/li>\r\n              <li><a href=\"#r5\">Run your first search<\/a><\/li>\r\n              <li><a href=\"#r6\">Read a match score<\/a><\/li>\r\n              <li><a href=\"#r7\">Unlock a candidate<\/a><\/li>\r\n              <li><a href=\"#r8\">Credits and top-ups<\/a><\/li>\r\n              <li><a href=\"#r9\">Pipelines<\/a><\/li>\r\n              <li><a href=\"#r10\">Saved searches and alerts<\/a><\/li>\r\n              <li><a href=\"#r11\">Post a job<\/a><\/li>\r\n              <li><a href=\"#r12\">Messages<\/a><\/li>\r\n              <li><a href=\"#r13\">Add your team<\/a><\/li>\r\n            <\/ol>\r\n            <div class=\"toc__extra\">\r\n              <ol>\r\n                <li><a href=\"#r-filters\">Every filter<\/a><\/li>\r\n                <li><a href=\"#r-privacy\">What you will not see<\/a><\/li>\r\n                <li><a href=\"#r-faq\">If something goes wrong<\/a><\/li>\r\n              <\/ol>\r\n            <\/div>\r\n          <\/nav>\r\n\r\n          <div class=\"block\">\r\n\r\n            <h2>For employers<\/h2>\r\n            <p class=\"block__lead\">\r\n              You are not posting an advert and waiting. You filter the whole database yourself,\r\n              read how well each person fits and where they fall short, and spend a credit only\r\n              on the ones worth a conversation. Searching and reading profiles costs nothing.\r\n            <\/p>\r\n\r\n            <!-- ---------------- Step 1 ---------------- -->\r\n            <article class=\"step\" id=\"r1\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">1<\/span>\r\n                <div>\r\n                  <h3>Create your account<\/h3>\r\n                  <p>Sign up as an employer. It decides everything you see next.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Create an account<\/b> <span>\u2192<\/span> <b>I am hiring<\/b><\/p>\r\n\r\n                <p>\r\n                  Name, work email, password of at least eight characters. Choosing\r\n                  <em>I am hiring<\/em> is what puts you on the employer side \u2014 the candidate\r\n                  screens and the CV builder are hidden from you, and the plans you are shown are\r\n                  the hiring ones.\r\n                <\/p>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Use a work email<\/span>\r\n                  <p>\r\n                    Candidates see your company when you message them, and a company page with a\r\n                    real domain behind it gets more replies than one without.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 2 ---------------- -->\r\n            <article class=\"step\" id=\"r2\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">2<\/span>\r\n                <div>\r\n                  <h3>Choose a plan<\/h3>\r\n                  <p>There is no free employer tier. Search opens when a plan is active.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Plans<\/b> <span>\u2192<\/span> <b>For people hiring<\/b><\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>Plans come with a bundle of credits and a length in days.<\/li>\r\n                  <li>You cannot buy before you have an account \u2014 the plan has to attach to someone. Follow a buy link while signed out and you are asked to register first, then taken straight to checkout.<\/li>\r\n                  <li>Credits from a new plan are added to whatever you already have. They do not reset.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note note--watch\">\r\n                  <span class=\"note__k\">If your payment needs approval<\/span>\r\n                  <p>\r\n                    Paying by bank transfer, or any method that has to be checked, leaves the order\r\n                    waiting. Your dashboard says <em>Waiting for your payment to be approved<\/em>\r\n                    with the order number and its status, rather than showing you the plans again.\r\n                    Access opens by itself once the order is approved \u2014 reload the page then.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 3 ---------------- -->\r\n            <article class=\"step\" id=\"r3\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">3<\/span>\r\n                <div>\r\n                  <h3>Find your way around<\/h3>\r\n                  <p>One dashboard, a row of tabs, your credit balance always in view.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>The tabs<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Overview<\/th><td>Credits left, plan and dates, how many people you have unlocked, and who has been active recently.<\/td><\/tr>\r\n                    <tr><th>Search<\/th><td>The filters and the results. Where you will spend your time.<\/td><\/tr>\r\n                    <tr><th>Pipelines<\/th><td>Shortlists with stages, so a search turns into a process.<\/td><\/tr>\r\n                    <tr><th>Saved searches<\/th><td>A search you can re-run, optionally emailing you when new people match.<\/td><\/tr>\r\n                    <tr><th>Job posts<\/th><td>Roles you have posted, their applicants, and people who already fit them.<\/td><\/tr>\r\n                    <tr><th>Unlocked<\/th><td>Everyone you have spent a credit on, with their contact details.<\/td><\/tr>\r\n                    <tr><th>Messages<\/th><td>Your conversations.<\/td><\/tr>\r\n                    <tr><th>Company profile<\/th><td>Your logo, details and public page.<\/td><\/tr>\r\n                    <tr><th>Team<\/th><td>Colleagues sharing your account. Appears when your plan includes more than one seat.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 4 ---------------- -->\r\n            <article class=\"step\" id=\"r4\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">4<\/span>\r\n                <div>\r\n                  <h3>Set up your company page<\/h3>\r\n                  <p>Do this before you message anyone. It is what candidates check.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Company profile<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Fields<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Company logo<\/th><td>Shown on your public page, in the employer directory and on your job posts. A square or wide PNG works best.<\/td><\/tr>\r\n                    <tr><th>Company name<\/th><td>Required. Also the name candidates see in their inbox.<\/td><\/tr>\r\n                    <tr><th>Website, industry<\/th><td>Both help a candidate decide whether to reply.<\/td><\/tr>\r\n                    <tr><th>Size, country, city<\/th><td>Straightforward, and shown on your page.<\/td><\/tr>\r\n                    <tr><th>About the company<\/th><td>A few honest sentences. This is the part that earns replies.<\/td><\/tr>\r\n                    <tr><th>Who candidates will talk to<\/th><td>A name and phone number, so a message does not come from a faceless account.<\/td><\/tr>\r\n                    <tr><th>List us in the directory<\/th><td>Puts you on the public employer list at <span class=\"mono\">\/company\/your-name<\/span>, with your open roles. Untick to stay unlisted.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  Your public page carries its own QR code with the KaderJo mark in the middle,\r\n                  downloadable as PNG or SVG \u2014 useful on a stand at a careers fair.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 5 ---------------- -->\r\n            <article class=\"step\" id=\"r5\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">5<\/span>\r\n                <div>\r\n                  <h3>Run your first search<\/h3>\r\n                  <p>Start wide. Two or three filters is usually the sweet spot.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Search<\/b><\/p>\r\n\r\n                <p>\r\n                  Add a skill or two, set a minimum number of years, and stop. Every filter you add\r\n                  narrows the ranking, and the most common mistake is stacking eight of them and\r\n                  concluding the database is empty.\r\n                <\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li><strong>Skills<\/strong> \u2014 type and pick from the suggestions, which show how many people have each. The buttons underneath are the most common skills on the platform, with counts.<\/li>\r\n                  <li><strong>Sort<\/strong> \u2014 best match, recently active, most experience, most complete, or by name.<\/li>\r\n                  <li><strong>Facets<\/strong> \u2014 the city and job title fields suggest values that actually exist here, so you are not guessing.<\/li>\r\n                  <li><strong>Clear<\/strong> \u2014 resets everything. The chips above the results show what is currently applied; click one to drop it.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Nobody is hidden by default<\/span>\r\n                  <p>\r\n                    Filters rank rather than exclude. Ask for a bachelor's degree and a strong\r\n                    diploma holder still appears, lower down, labelled with what is short. If you\r\n                    genuinely need a hard cut, tick <em>Hide anyone who misses a filter<\/em> \u2014 but\r\n                    try it without first.\r\n                  <\/p>\r\n                <\/div>\r\n\r\n                <p>\r\n                  The count above the results reads something like\r\n                  <span class=\"mono\">12 match your filters, ranked first \u2014 of 340 in the database<\/span>.\r\n                  That is telling you both how many fit and how much you are looking at.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 6 ---------------- -->\r\n            <article class=\"step\" id=\"r6\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">6<\/span>\r\n                <div>\r\n                  <h3>Read a match score<\/h3>\r\n                  <p>The number, the reason, and the shortfall \u2014 all on the card.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p>\r\n                  Every result carries a ring with a percentage. It only counts the filters you\r\n                  actually used, so it is a score against <em>your<\/em> requirements rather than a\r\n                  general rating of the person.\r\n                <\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>What moves the number<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Skills<\/th><td>The heaviest factor. Every skill you asked for that they have listed counts.<\/td><\/tr>\r\n                    <tr><th>Job title and keywords<\/th><td>Matched against their title, headline and the whole text of their profile.<\/td><\/tr>\r\n                    <tr><th>Years of experience<\/th><td>Inside your range scores full. Short of it costs steadily. Well over it costs a little, never below a floor \u2014 an overqualified candidate is still a candidate.<\/td><\/tr>\r\n                    <tr><th>Education<\/th><td>At or above your level scores full; below it costs, in proportion to the gap.<\/td><\/tr>\r\n                    <tr><th>Location<\/th><td>Same city scores full, same country nearly full, and someone open to relocating gets partial credit rather than nothing.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  Under the ring, in teal, is what matched \u2014 <span class=\"mono\">2 of 2 skills \u00b7\r\n                  title matches<\/span>. Under that, in amber, is what is short \u2014\r\n                  <span class=\"mono\">Diploma, you asked for Bachelor<\/span> or\r\n                  <span class=\"mono\">1 year short<\/span>. Read the amber line before you dismiss\r\n                  anyone; it is often something you do not care about.\r\n                <\/p>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Quick look<\/span>\r\n                  <p>\r\n                    <em>Quick look<\/em> opens the full profile in a panel without spending anything:\r\n                    all their experience, education, skills and extras. Only the contact block is\r\n                    held back. Read properly before you unlock.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 7 ---------------- -->\r\n            <article class=\"step\" id=\"r7\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">7<\/span>\r\n                <div>\r\n                  <h3>Unlock a candidate<\/h3>\r\n                  <p>One credit, permanently, shared with your whole team.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\">Any result card <span>\u2192<\/span> <b>Unlock \u00b7 1 credit<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>What a credit buys<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Their contact details<\/th><td>Email, phone and any links they have added.<\/td><\/tr>\r\n                    <tr><th>A direct message<\/th><td>Messaging opens for that person. You cannot write to someone you have not unlocked.<\/td><\/tr>\r\n                    <tr><th>Their real identity<\/th><td>If they were in anonymous mode, their name, photo and employers become visible to you.<\/td><\/tr>\r\n                    <tr><th>Their CV<\/th><td>Download the version they set as default, if they have one.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <ul class=\"check\">\r\n                  <li>An unlock is <strong>permanent<\/strong>. Come back in six months and they are still open.<\/li>\r\n                  <li>It belongs to the <strong>account, not the person<\/strong> \u2014 everyone on your team sees it, so nobody pays twice for the same candidate.<\/li>\r\n                  <li>The candidate is told, and can see that your company unlocked them.<\/li>\r\n                  <li>Run out of credits and the unlock button explains it and points you at a top-up rather than failing silently.<\/li>\r\n                <\/ul>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 8 ---------------- -->\r\n            <article class=\"step\" id=\"r8\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">8<\/span>\r\n                <div>\r\n                  <h3>Credits and top-ups<\/h3>\r\n                  <p>More credits without changing plan.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Account<\/b> <span>\u2192<\/span> <b>Top up credits<\/b><\/p>\r\n\r\n                <p>\r\n                  Your balance sits in the sidebar of every employer screen. When it runs low, buy a\r\n                  credit pack \u2014 you are not forced to upgrade to a bigger plan just to get another\r\n                  ten unlocks. Packs are added to your balance as soon as the order is approved and\r\n                  do not expire while your plan is active.\r\n                <\/p>\r\n\r\n                <p>\r\n                  The <strong>Account<\/strong> page also shows your credit history: every top-up and\r\n                  every unlock, with a date, so a balance is never a mystery.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 9 ---------------- -->\r\n            <article class=\"step\" id=\"r9\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">9<\/span>\r\n                <div>\r\n                  <h3>Pipelines<\/h3>\r\n                  <p>Turn a search into a shortlist you can actually work through.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Pipelines<\/b><\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>Create one per role \u2014 \"Backend hires Q3\", not \"Candidates\".<\/li>\r\n                  <li>Add people straight from a result card with <em>Add to pipeline<\/em>. You do not have to unlock someone to shortlist them.<\/li>\r\n                  <li>Move each person through the stages, from shortlisted to hired, from a dropdown on the row.<\/li>\r\n                  <li>Everyone on your team sees the same pipelines, so two people do not chase the same candidate.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Shortlist first, unlock later<\/span>\r\n                  <p>\r\n                    The cheapest way to work: search wide, quick-look generously, pipeline anyone\r\n                    plausible, then unlock only the people you have decided to contact. Nothing\r\n                    before that last step costs a credit.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 10 ---------------- -->\r\n            <article class=\"step\" id=\"r10\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">10<\/span>\r\n                <div>\r\n                  <h3>Saved searches and alerts<\/h3>\r\n                  <p>Let the good ones come to you.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Search<\/b> <span>\u2192<\/span> <b>Save this search<\/b><\/p>\r\n\r\n                <p>\r\n                  Get a search you like, save it with a name, and choose whether to be emailed when\r\n                  new people match it. Alerts arrive daily or weekly and list the new matches with\r\n                  their scores. Re-run a saved search any time from the <strong>Saved searches<\/strong> tab.\r\n                <\/p>\r\n\r\n                <p>\r\n                  This is the one to set up if you hire the same kind of person repeatedly. New\r\n                  profiles that fit reach you without anybody remembering to look.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 11 ---------------- -->\r\n            <article class=\"step\" id=\"r11\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">11<\/span>\r\n                <div>\r\n                  <h3>Post a job<\/h3>\r\n                  <p>Optional \u2014 and the interesting part is who already fits it.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Job posts<\/b><\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>Fields on a post<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Job title<\/th><td>Required.<\/td><\/tr>\r\n                    <tr><th>Company, city<\/th><td>Shown on the public job page.<\/td><\/tr>\r\n                    <tr><th>Work mode, type<\/th><td>On site, hybrid, remote; full time, contract and so on.<\/td><\/tr>\r\n                    <tr><th>Minimum years, minimum education<\/th><td>Used to score applicants and to find matches.<\/td><\/tr>\r\n                    <tr><th>Required skills<\/th><td>Comma separated. These drive the matching, so be accurate rather than aspirational.<\/td><\/tr>\r\n                    <tr><th>Description<\/th><td>The role itself.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  Once published, the job page shows your requirements and an apply box. Open the\r\n                  post from your dashboard and you get two lists: the people who\r\n                  <strong>applied<\/strong>, each with a match score against the requirements you\r\n                  set and a status you can move along, and <strong>people who already fit this\r\n                  role<\/strong> \u2014 candidates from the database who never applied. That second list\r\n                  is usually the better one.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 12 ---------------- -->\r\n            <article class=\"step\" id=\"r12\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">12<\/span>\r\n                <div>\r\n                  <h3>Messages<\/h3>\r\n                  <p>Live, with attachments, once you have unlocked someone.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Messages<\/b><\/p>\r\n\r\n                <ul class=\"check\">\r\n                  <li>Replies appear without reloading, and unread counts show in your menu and the bar at the top.<\/li>\r\n                  <li><kbd>Enter<\/kbd> sends; <kbd>Shift<\/kbd> + <kbd>Enter<\/kbd> makes a new line.<\/li>\r\n                  <li>Attach up to five files per message, 10 MB each \u2014 job descriptions, offer letters, test tasks.<\/li>\r\n                  <li>Files are only readable by the two people in the conversation.<\/li>\r\n                  <li>You must unlock a candidate before the first message. After that the thread stays open.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Write like a person<\/span>\r\n                  <p>\r\n                    Say which role, why you thought of them, and what happens next. Candidates on\r\n                    this platform are mostly employed and not desperate; a template gets a template\r\n                    back, or nothing.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Step 13 ---------------- -->\r\n            <article class=\"step\" id=\"r13\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">13<\/span>\r\n                <div>\r\n                  <h3>Add your team<\/h3>\r\n                  <p>Colleagues on one account, one pool of credits.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <p class=\"path\"><b>Employer dashboard<\/b> <span>\u2192<\/span> <b>Team<\/b><\/p>\r\n\r\n                <p>\r\n                  The Team tab appears when your plan includes more than one seat. Invite a\r\n                  colleague by name and work email; they get a link to set their own password. The\r\n                  tab shows seats used against seats included.\r\n                <\/p>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>What a seat shares<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Credits<\/th><td>One pool. Anyone can spend, everyone sees the balance and the history.<\/td><\/tr>\r\n                    <tr><th>Unlocked candidates<\/th><td>Shared, so nobody pays twice for the same person.<\/td><\/tr>\r\n                    <tr><th>Pipelines and saved searches<\/th><td>Shared.<\/td><\/tr>\r\n                    <tr><th>Their own login<\/th><td>Each person signs in as themselves. No shared password.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Only the owner manages seats<\/span>\r\n                  <p>\r\n                    The account owner adds and removes colleagues. Removing someone frees the seat\r\n                    and revokes their access to the account; their own login still exists.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Every filter ---------------- -->\r\n            <article class=\"step\" id=\"r-filters\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">\u2261<\/span>\r\n                <div>\r\n                  <h3>Every filter, and what it does<\/h3>\r\n                  <p>Some rank, some genuinely exclude. Worth knowing which.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <div class=\"legend\">\r\n                  <span><span class=\"tag tag--filter\">ranks<\/span> lowers the score, keeps the person<\/span>\r\n                  <span><span class=\"tag tag--paid\">excludes<\/span> removes them from results<\/span>\r\n                <\/div>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>The ranking filters<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Anything <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Free text across the whole profile \u2014 summary, roles, skills, education, extras.<\/td><\/tr>\r\n                    <tr><th>Job title <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Matched against their current title and every past one.<\/td><\/tr>\r\n                    <tr><th>Skills <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Add several; each one they have raises the score. Two or three is the sweet spot.<\/td><\/tr>\r\n                    <tr><th>Years of experience <span class=\"tag tag--filter\">ranks<\/span><\/th><td>A range. Both ends optional.<\/td><\/tr>\r\n                    <tr><th>Education, at least <span class=\"tag tag--filter\">ranks<\/span><\/th><td>A floor, not a wall \u2014 people below it appear with the gap named.<\/td><\/tr>\r\n                    <tr><th>Field of study <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Matched against every qualification they hold.<\/td><\/tr>\r\n                    <tr><th>University <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Matched against every institution.<\/td><\/tr>\r\n                    <tr><th>Country, city <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Someone open to relocating still scores partially.<\/td><\/tr>\r\n                    <tr><th>Work mode <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Their stated preference.<\/td><\/tr>\r\n                    <tr><th>Availability <span class=\"tag tag--filter\">ranks<\/span><\/th><td>How soon they could start.<\/td><\/tr>\r\n                    <tr><th>Language <span class=\"tag tag--filter\">ranks<\/span><\/th><td>From their languages section.<\/td><\/tr>\r\n                    <tr><th>Budget ceiling <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Shows people whose expectation fits, plus everyone who left it blank.<\/td><\/tr>\r\n                    <tr><th>Open to relocating <span class=\"tag tag--filter\">ranks<\/span><\/th><td>Narrows to people who said yes.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <table class=\"fields\">\r\n                  <caption>The excluding filters \u2014 use deliberately<\/caption>\r\n                  <tbody>\r\n                    <tr><th>Has a photo <span class=\"tag tag--paid\">excludes<\/span><\/th><td>Removes everyone without one.<\/td><\/tr>\r\n                    <tr><th>Verified only <span class=\"tag tag--paid\">excludes<\/span><\/th><td>Only profiles checked by the site.<\/td><\/tr>\r\n                    <tr><th>Only people I unlocked <span class=\"tag tag--paid\">excludes<\/span><\/th><td>Your existing unlocks, for going back over them.<\/td><\/tr>\r\n                    <tr><th>Active within <span class=\"tag tag--paid\">excludes<\/span><\/th><td>A week, a month, three months. Useful, and the quickest way to shrink a result set too far.<\/td><\/tr>\r\n                    <tr><th>Hide anyone who misses a filter <span class=\"tag tag--paid\">excludes<\/span><\/th><td>Turns every ranking filter above into a hard requirement.<\/td><\/tr>\r\n                  <\/tbody>\r\n                <\/table>\r\n\r\n                <p>\r\n                  On a plan that includes it, <strong>Export CSV<\/strong> gives you the current\r\n                  result set as a spreadsheet. Contact details are blank for anyone you have not\r\n                  unlocked, and the file opens correctly in Excel with Arabic names intact.\r\n                <\/p>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- Privacy ---------------- -->\r\n            <article class=\"step\" id=\"r-privacy\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">\u25c6<\/span>\r\n                <div>\r\n                  <h3>What you will not see, and why<\/h3>\r\n                  <p>The limits are deliberate. They are why people put real profiles here.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <ul class=\"check\">\r\n                  <li><strong>Contact details need an unlock.<\/strong> Everything else on a profile you can read for free.<\/li>\r\n                  <li><strong>Anonymous candidates stay anonymous<\/strong> until you unlock them \u2014 including the names of their current and past employers. You can still see everything about what they can do.<\/li>\r\n                  <li><strong>Hidden profiles are not in your results at all.<\/strong> There is no way to see them, and no count telling you they exist.<\/li>\r\n                  <li><strong>Salary expectations are not displayed.<\/strong> You can filter by your budget; you cannot read someone's number off their profile.<\/li>\r\n                  <li><strong>Candidates see who unlocked them.<\/strong> Your company name is on that list.<\/li>\r\n                  <li><strong>You cannot message someone you have not unlocked.<\/strong> No exceptions, no bulk approaches.<\/li>\r\n                <\/ul>\r\n\r\n                <div class=\"note\">\r\n                  <span class=\"note__k\">Why this is good for you<\/span>\r\n                  <p>\r\n                    These rules are the reason employed people \u2014 the ones you most want \u2014 are\r\n                    willing to have a profile here at all. A database anyone could scrape would\r\n                    only contain people with nothing to lose.\r\n                  <\/p>\r\n                <\/div>\r\n              <\/div>\r\n            <\/article>\r\n\r\n            <!-- ---------------- FAQ ---------------- -->\r\n            <article class=\"step\" id=\"r-faq\">\r\n              <div class=\"step__head\">\r\n                <span class=\"step__n\" aria-hidden=\"true\">?<\/span>\r\n                <div>\r\n                  <h3>If something goes wrong<\/h3>\r\n                  <p>The things that actually come up.<\/p>\r\n                <\/div>\r\n              <\/div>\r\n              <div class=\"step__body\">\r\n                <details>\r\n                  <summary>My search returns nothing<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>You have almost certainly ticked <em>Hide anyone who misses a filter<\/em>, or set <em>Active within<\/em> to a week. Untick both and look again. Without them, filters rank rather than exclude and you should always see results \u2014 with low percentages at the bottom.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>I paid but search is still locked<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Check your dashboard: if it says the payment is waiting for approval, the order has not been marked paid yet and access opens by itself when it is. If it shows the plans instead, the order did not attach to your account \u2014 send us the order number.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>A candidate has not replied<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Give it a week. Most people here are employed and check in the evening. Then look at your own message: a named role, a reason you picked them, and a next step get replies. A generic approach does not, no matter how many you send.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>Can I get a refund on a credit?<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>An unlock is permanent and the credit is spent at that moment, so no. That is why <em>Quick look<\/em> shows you the whole profile first \u2014 read it before you spend.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>A colleague cannot see our pipelines<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>They are probably signed in on their own separate account rather than occupying a seat on yours. The account owner should invite them from the Team tab; once they accept, the credits, unlocks and pipelines are shared.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n\r\n                <details>\r\n                  <summary>Someone in our results looks wrong for the role<\/summary>\r\n                  <div class=\"details__a\">\r\n                    <p>Read the amber line under their score \u2014 it says exactly what is short. If the mismatch is something you care about, add that filter; if you need a strict cut, use the hide option. Low-scoring people appearing at the bottom is the system working, not a fault.<\/p>\r\n                  <\/div>\r\n                <\/details>\r\n              <\/div>\r\n            <\/article>\r\n\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\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:\/\/resumes.webitjo.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        <\/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=\"\/contact\/\">Talk to us<\/a><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"foot__base\">\u00a9 <span id=\"yr\">2026<\/span> KaderJo \u00b7 Amman, Jordan<\/div>\r\n  <\/div>\r\n<\/footer>\r\n\r\n<script>\r\n(function () {\r\n  'use strict';\r\n\r\n  document.getElementById('yr').textContent = new Date().getFullYear();\r\n\r\n  var tabs = Array.prototype.slice.call(document.querySelectorAll('[role=\"tab\"]'));\r\n  var panels = {\r\n    applicant: document.getElementById('panel-applicant'),\r\n    recruiter: document.getElementById('panel-recruiter')\r\n  };\r\n\r\n  \/* Which guide is showing lives in the URL, so a link to \"the recruiter guide\"\r\n     actually opens it and a reload does not throw you back to the other one. *\/\r\n  function show(role, push) {\r\n    if (!panels[role]) { role = 'applicant'; }\r\n\r\n    tabs.forEach(function (t) {\r\n      var on = (t.getAttribute('data-role') === role);\r\n      t.setAttribute('aria-selected', on ? 'true' : 'false');\r\n    });\r\n\r\n    Object.keys(panels).forEach(function (key) {\r\n      panels[key].hidden = (key !== role);\r\n    });\r\n\r\n    if (push) {\r\n      try {\r\n        history.replaceState(null, '', '?role=' + role + location.hash);\r\n      } catch (e) { \/* file:\/\/ and old browsers: not important *\/ }\r\n    }\r\n\r\n    markCurrent();\r\n  }\r\n\r\n  tabs.forEach(function (t) {\r\n    t.addEventListener('click', function () { show(t.getAttribute('data-role'), true); });\r\n\r\n    \/* Arrow keys move between tabs, which is what a tablist is expected to do. *\/\r\n    t.addEventListener('keydown', function (e) {\r\n      if (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight') { return; }\r\n      e.preventDefault();\r\n      var i = tabs.indexOf(t);\r\n      var next = tabs[(i + (e.key === 'ArrowRight' ? 1 : tabs.length - 1)) % tabs.length];\r\n      next.focus();\r\n      show(next.getAttribute('data-role'), true);\r\n    });\r\n  });\r\n\r\n  \/* Opening a link to a step inside the hidden guide should switch to it. *\/\r\n  function roleForHash(hash) {\r\n    if (!hash) { return null; }\r\n    var el = document.querySelector(hash);\r\n    if (!el) { return null; }\r\n    var panel = el.closest('.panel');\r\n    if (!panel) { return null; }\r\n    return panel.id === 'panel-recruiter' ? 'recruiter' : 'applicant';\r\n  }\r\n\r\n  var params = new URLSearchParams(location.search);\r\n  var initial = params.get('role') || roleForHash(location.hash) || 'applicant';\r\n  show(initial, false);\r\n\r\n  window.addEventListener('hashchange', function () {\r\n    var role = roleForHash(location.hash);\r\n    if (role) { show(role, false); }\r\n    markCurrent();\r\n  });\r\n\r\n  \/* Mark the step you are reading in the contents list. *\/\r\n  var current = null;\r\n\r\n  function markCurrent() {\r\n    var panel = document.querySelector('.panel:not([hidden])');\r\n    if (!panel) { return; }\r\n\r\n    var steps = panel.querySelectorAll('.step[id]');\r\n    var here = null;\r\n\r\n    \/* Measured against the viewport rather than offsetTop: offsetTop is relative\r\n       to whichever ancestor happens to be positioned, which made the highlight\r\n       lag by a couple of steps. *\/\r\n    Array.prototype.forEach.call(steps, function (s) {\r\n      if (s.getBoundingClientRect().top <= 170) { here = s.id; }\r\n    });\r\n\r\n    if (!here && steps.length) { here = steps[0].id; }\r\n\r\n    if (here === current) { return; }\r\n    current = here;\r\n\r\n    panel.querySelectorAll('.toc a').forEach(function (a) {\r\n      a.classList.toggle('is-here', a.getAttribute('href') === '#' + here);\r\n    });\r\n  }\r\n\r\n  var ticking = false;\r\n  window.addEventListener('scroll', function () {\r\n    if (ticking) { return; }\r\n    ticking = true;\r\n    window.requestAnimationFrame(function () { markCurrent(); ticking = false; });\r\n  }, { passive: true });\r\n\r\n  markCurrent();\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>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Guide \u2014 KaderJo Guide Everything on KaderJo, one step at a time. Two different jobs, so two different guides. Pick<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-130","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/pages\/130","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/comments?post=130"}],"version-history":[{"count":4,"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/pages\/130\/revisions"}],"predecessor-version":[{"id":135,"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/pages\/130\/revisions\/135"}],"wp:attachment":[{"href":"https:\/\/resumes.webitjo.com\/ar\/wp-json\/wp\/v2\/media?parent=130"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}