{"id":518,"date":"2026-10-12T17:05:40","date_gmt":"2026-10-12T17:05:40","guid":{"rendered":"https:\/\/knwbholdings.co.za\/?page_id=518"},"modified":"2026-10-12T18:24:51","modified_gmt":"2026-10-12T18:24:51","slug":"phoenix-intelligence","status":"publish","type":"page","link":"https:\/\/knwbholdings.co.za\/?page_id=518","title":{"rendered":"Phoenix Intelligence"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"518\" class=\"elementor elementor-518\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b429720 e-con-full e-flex e-con e-parent\" data-id=\"b429720\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ad222aa elementor-widget elementor-widget-html\" data-id=\"ad222aa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n#phoenix-site{\r\n  --gold:#d8b974;\r\n  --muted:#a7a7a2;\r\n  --ink:#08090a;\r\n  --line:rgba(215,186,117,.2);\r\n  width:100%;\r\n  max-width:none;\r\n  margin:0;\r\n  overflow:hidden;\r\n  background:var(--ink);\r\n  color:#eeede8;\r\n  font-family:Arial,Helvetica,sans-serif;\r\n  -webkit-font-smoothing:antialiased;\r\n}\r\n#phoenix-site *,\r\n#phoenix-site *::before,\r\n#phoenix-site *::after{box-sizing:border-box}\r\n#phoenix-site [hidden]{display:none!important}\r\n#phoenix-site a{color:inherit;text-decoration:none}\r\n#phoenix-site button{\r\n  font:inherit;\r\n  color:inherit;\r\n  background:none;\r\n  border:0;\r\n  border-radius:0;\r\n  box-shadow:none;\r\n  text-transform:none;\r\n  cursor:pointer;\r\n}\r\n#phoenix-site button:focus-visible,\r\n#phoenix-site a:focus-visible,\r\n#phoenix-site select:focus-visible{\r\n  outline:2px solid var(--gold);\r\n  outline-offset:5px;\r\n}\r\n#phoenix-site h1,\r\n#phoenix-site h2,\r\n#phoenix-site h3,\r\n#phoenix-site p{margin:0}\r\n#phoenix-site h1,\r\n#phoenix-site h2,\r\n#phoenix-site h3{\r\n  color:#eeede8;\r\n  font-family:Arial,Helvetica,sans-serif;\r\n  font-weight:400;\r\n  text-transform:none;\r\n}\r\n#phoenix-site h1,\r\n#phoenix-site h2{letter-spacing:-.055em}\r\n#phoenix-site h1{font-size:clamp(52px,6.3vw,99px);line-height:1.04}\r\n#phoenix-site h2{font-size:clamp(39px,4.7vw,70px);line-height:1.1}\r\n#phoenix-site h3{font-size:28px;line-height:1.2;letter-spacing:-.035em}\r\n#phoenix-site em{font-family:Georgia,serif;font-weight:400;color:var(--gold)}\r\n#phoenix-site p{color:var(--muted);line-height:1.8}\r\n#phoenix-site img{max-width:100%;height:auto}\r\n#phoenix-site ::selection{background:var(--gold);color:var(--ink)}\r\n#phoenix-site section[id]{scroll-margin-top:35px}\r\n#phoenix-site .wrap{width:min(1280px,88%);margin:auto}\r\n#phoenix-site .eyebrow{\r\n  font-size:10px;\r\n  letter-spacing:2.7px;\r\n  font-weight:600;\r\n  line-height:1.6;\r\n  color:var(--gold);\r\n}\r\n#phoenix-site .eyebrow i,\r\n#phoenix-site .console-top i{\r\n  display:inline-block;\r\n  width:5px;\r\n  height:5px;\r\n  background:var(--gold);\r\n  border-radius:50%;\r\n  margin-right:9px;\r\n  box-shadow:0 0 15px var(--gold);\r\n}\r\n\r\n\/* KNWB showcase bar *\/\r\n#phoenix-site .showcase{\r\n  min-height:38px;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:space-between;\r\n  gap:12px;\r\n  padding:8px 4%;\r\n  font-size:9px;\r\n  letter-spacing:1.5px;\r\n  background:#151617;\r\n  color:#b7b8b9;\r\n}\r\n#phoenix-site .showcase>a{font-weight:700;color:#fff}\r\n#phoenix-site .showcase>a span{font-weight:400;margin-left:10px;color:#999}\r\n#phoenix-site .showcase button{font-size:10px;color:#bbb;padding:4px}\r\n\r\n\/* Navigation *\/\r\n#phoenix-site header{\r\n  min-height:93px;\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:space-between;\r\n  gap:22px;\r\n  padding:16px 6%;\r\n  position:relative;\r\n  z-index:4;\r\n  border-bottom:1px solid var(--line);\r\n  background:rgba(8,9,10,.94);\r\n}\r\n#phoenix-site .wordmark{\r\n  font-size:21px;\r\n  letter-spacing:3px;\r\n  display:flex;\r\n  align-items:center;\r\n  gap:13px;\r\n}\r\n#phoenix-site .wordmark small{\r\n  font-size:8px;\r\n  display:block;\r\n  letter-spacing:3.7px;\r\n  margin-top:5px;\r\n}\r\n#phoenix-site .mini-flame{color:var(--gold);font-size:37px}\r\n#phoenix-site nav{display:flex;gap:32px;font-size:12px;color:#b3b3ad}\r\n#phoenix-site nav a:hover{color:var(--gold)}\r\n#phoenix-site .outline{\r\n  font-size:12px;\r\n  border:1px solid #6d5b36;\r\n  padding:15px 20px;\r\n  display:inline-flex;\r\n  gap:24px;\r\n  align-items:center;\r\n  transition:background .3s;\r\n}\r\n#phoenix-site .outline:hover{background:#242116}\r\n#phoenix-site .gold{\r\n  display:inline-flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  gap:30px;\r\n  padding:20px 25px;\r\n  background:linear-gradient(115deg,#e2c884,#b59555);\r\n  color:#111;\r\n  font-size:12px;\r\n  font-weight:600;\r\n  transition:transform .3s,box-shadow .3s;\r\n}\r\n#phoenix-site .gold:hover{\r\n  transform:translateY(-3px);\r\n  box-shadow:0 9px 35px #c7aa5330;\r\n}\r\n#phoenix-site .gold span{font-size:19px}\r\n#phoenix-site .textlink{\r\n  display:inline-flex;\r\n  gap:14px;\r\n  align-items:center;\r\n  font-size:12px;\r\n  color:#ddd;\r\n  padding:12px 0;\r\n}\r\n#phoenix-site .textlink:hover{color:var(--gold)}\r\n#phoenix-site #px-menu{display:none}\r\n\r\n\/* Hero *\/\r\n#phoenix-site .hero{\r\n  min-height:690px;\r\n  height:min(820px,calc(100svh - 100px));\r\n  display:grid;\r\n  grid-template-columns:1.2fr 1fr;\r\n  align-items:center;\r\n  position:relative;\r\n  padding:60px 6% 90px;\r\n  overflow:hidden;\r\n  background:radial-gradient(ellipse at 79% 44%,#29221777,transparent 55%);\r\n}\r\n#phoenix-site #px-particles{\r\n  position:absolute;\r\n  inset:0;\r\n  width:100%;\r\n  height:100%;\r\n  pointer-events:none;\r\n  opacity:.55;\r\n}\r\n#phoenix-site .hero-copy{position:relative;z-index:2;min-width:0}\r\n#phoenix-site .hero-copy .eyebrow{margin-bottom:28px}\r\n#phoenix-site .hero-copy>p{\r\n  max-width:450px;\r\n  margin:25px 0 32px;\r\n  font-size:15px;\r\n}\r\n#phoenix-site .actions{display:flex;gap:27px;align-items:center}\r\n#phoenix-site .hero-note{\r\n  margin-top:55px;\r\n  padding-left:16px;\r\n  border-left:1px solid #6e5932;\r\n  display:flex;\r\n  flex-direction:column;\r\n  gap:9px;\r\n}\r\n#phoenix-site .hero-note span{font-size:9px;letter-spacing:2px;color:#888}\r\n#phoenix-site .hero-note b{font-size:12px;font-weight:400;color:#c9c4b7}\r\n#phoenix-site .emblem{\r\n  position:relative;\r\n  width:100%;\r\n  max-width:560px;\r\n  aspect-ratio:1;\r\n  display:grid;\r\n  place-items:center;\r\n  perspective:1000px;\r\n  transition:transform .5s ease;\r\n}\r\n#phoenix-site .emblem img{\r\n  position:relative;\r\n  display:block;\r\n  width:94%;\r\n  mix-blend-mode:screen;\r\n  filter:drop-shadow(0 0 24px #b68e3920);\r\n  z-index:1;\r\n}\r\n#phoenix-site .orbit{\r\n  border:1px solid #b1924624;\r\n  position:absolute;\r\n  inset:1%;\r\n  border-radius:50%;\r\n  pointer-events:none;\r\n}\r\n#phoenix-site .orbit.a{\r\n  border-top-color:#d2b66d;\r\n  animation:pxRotate 35s linear infinite;\r\n}\r\n#phoenix-site .orbit.b{\r\n  inset:-4%;\r\n  border-style:dashed;\r\n  opacity:.4;\r\n  animation:pxRotate 65s linear infinite reverse;\r\n}\r\n#phoenix-site .orb-label{\r\n  position:absolute;\r\n  bottom:-28px;\r\n  font-size:8px;\r\n  letter-spacing:3px;\r\n  color:#9c895f;\r\n  text-align:center;\r\n}\r\n#phoenix-site .cross{position:absolute;color:#a68949;font-size:20px}\r\n#phoenix-site .cross.top{top:2%;left:12%}\r\n#phoenix-site .cross.bottom{bottom:5%;right:7%}\r\n#phoenix-site .scrollnote{\r\n  position:absolute;\r\n  bottom:24px;\r\n  left:6%;\r\n  right:6%;\r\n  display:flex;\r\n  justify-content:space-between;\r\n  color:#686b6c;\r\n  font-size:8px;\r\n  letter-spacing:3px;\r\n}\r\n#phoenix-site .scrollnote span{font-size:24px;color:var(--gold)}\r\n\r\n\/* Moving text *\/\r\n#phoenix-site .ticker{\r\n  border-block:1px solid var(--line);\r\n  overflow:hidden;\r\n  padding:20px 0;\r\n  background:#0d0f0f;\r\n}\r\n#phoenix-site .ticker>div{\r\n  white-space:nowrap;\r\n  font-size:11px;\r\n  letter-spacing:3px;\r\n  color:#a8a28f;\r\n  animation:pxMarquee 35s linear infinite;\r\n  width:max-content;\r\n}\r\n#phoenix-site .ticker b{font-size:15px;color:var(--gold);padding:0 44px}\r\n\r\n\/* Perspective *\/\r\n#phoenix-site .intro{\r\n  display:grid;\r\n  grid-template-columns:1fr 2fr;\r\n  gap:50px;\r\n  padding-block:125px;\r\n}\r\n#phoenix-site .intro>div>p{max-width:660px;margin-top:28px;font-size:16px}\r\n#phoenix-site .principles{\r\n  display:flex;\r\n  gap:30px;\r\n  margin-top:36px;\r\n  font-size:11px;\r\n  color:#c5c1b7;\r\n}\r\n#phoenix-site .principles b{color:var(--gold);font-weight:400;margin-right:10px}\r\n#phoenix-site .expertise{padding-block:30px 110px}\r\n#phoenix-site .sectionhead{\r\n  display:flex;\r\n  justify-content:space-between;\r\n  align-items:flex-end;\r\n  gap:30px;\r\n  margin-bottom:50px;\r\n}\r\n#phoenix-site .sectionhead .eyebrow{margin-bottom:24px}\r\n#phoenix-site .sectionhead>p{font-size:13px;max-width:300px;padding-bottom:6px}\r\n\r\n\/* Service explorer *\/\r\n#phoenix-site .service-layout{\r\n  display:grid;\r\n  grid-template-columns:1fr 1.1fr;\r\n  gap:65px;\r\n}\r\n#phoenix-site .tabs{display:flex;flex-direction:column;min-width:0}\r\n#phoenix-site .tabs button{\r\n  padding:27px 4px;\r\n  border-bottom:1px solid #ffffff16;\r\n  display:flex;\r\n  align-items:center;\r\n  gap:20px;\r\n  text-align:left;\r\n  font-size:19px;\r\n  font-weight:400;\r\n  color:#888b87;\r\n  transition:color .3s,padding .3s;\r\n}\r\n#phoenix-site .tabs button:first-child{border-top:1px solid #ffffff16}\r\n#phoenix-site .tabs button span{font-size:10px;color:#737163;letter-spacing:1px}\r\n#phoenix-site .tabs button b{margin-left:auto;font-size:20px;font-weight:400}\r\n#phoenix-site .tabs button[aria-selected=true]{color:var(--gold);padding-left:12px}\r\n#phoenix-site .service-panel{\r\n  position:relative;\r\n  overflow:hidden;\r\n  min-width:0;\r\n  background:radial-gradient(ellipse at top right,#302919,#121415 65%);\r\n  border:1px solid #bca26125;\r\n  padding:40px;\r\n  min-height:430px;\r\n}\r\n#phoenix-site .service-panel>.eyebrow{margin-bottom:35px}\r\n#phoenix-site .service-panel h3{max-width:330px;font-size:34px;position:relative}\r\n#phoenix-site .service-panel p{\r\n  font-size:13px;\r\n  margin:18px 0;\r\n  max-width:350px;\r\n  position:relative;\r\n}\r\n#phoenix-site .service-panel ul{\r\n  list-style:none;\r\n  padding:0;\r\n  display:grid;\r\n  grid-template-columns:1fr 1fr;\r\n  gap:10px;\r\n  color:#c4bead;\r\n  font-size:11px;\r\n  line-height:1.6;\r\n  margin:24px 0;\r\n}\r\n#phoenix-site .service-panel li{margin:0}\r\n#phoenix-site .service-panel li:before{content:\"\u2014\";color:var(--gold);margin-right:8px}\r\n#phoenix-site .service-panel .textlink{color:var(--gold);margin-top:13px}\r\n#phoenix-site .radar{\r\n  width:180px;\r\n  height:180px;\r\n  position:absolute;\r\n  right:-50px;\r\n  top:-50px;\r\n  border:1px solid #cbb36a38;\r\n  border-radius:50%;\r\n  opacity:.5;\r\n  pointer-events:none;\r\n}\r\n#phoenix-site .radar:before,\r\n#phoenix-site .radar:after{\r\n  content:\"\";\r\n  position:absolute;\r\n  inset:25px;\r\n  border:1px solid #cbb36a38;\r\n  border-radius:50%;\r\n}\r\n#phoenix-site .radar:after{inset:55px}\r\n#phoenix-site .radar div{\r\n  position:absolute;\r\n  inset:0;\r\n  background:conic-gradient(transparent 240deg,#d2ac4b33,transparent);\r\n  border-radius:50%;\r\n  animation:pxRotate 8s linear infinite;\r\n}\r\n#phoenix-site .caption{font-size:10px;line-height:1.7;color:#858982}\r\n#phoenix-site .expertise>.caption{margin-top:24px;max-width:800px}\r\n\r\n\/* Investigation demonstration *\/\r\n#phoenix-site .experience{\r\n  padding:105px 0;\r\n  background:#101213;\r\n  border-block:1px solid #ffffff0a;\r\n}\r\n#phoenix-site .console{border:1px solid #8d793735;background:#090b0c}\r\n#phoenix-site .console-top{\r\n  padding:18px 24px;\r\n  border-bottom:1px solid #8d793735;\r\n  display:flex;\r\n  justify-content:space-between;\r\n  gap:12px;\r\n  font-family:monospace;\r\n  font-size:9px;\r\n  letter-spacing:1px;\r\n  color:#a6a492;\r\n}\r\n#phoenix-site .console-body{\r\n  display:grid;\r\n  grid-template-columns:1.2fr 1fr;\r\n  align-items:center;\r\n}\r\n#phoenix-site .network{padding:22px;position:relative;min-width:0}\r\n#phoenix-site .network svg{width:100%;height:auto;display:block}\r\n#phoenix-site .network-bottom{\r\n  text-align:center;\r\n  font:8px monospace;\r\n  color:#73766d;\r\n  letter-spacing:2px;\r\n  margin-bottom:15px;\r\n}\r\n#phoenix-site .stage-detail{padding:40px;border-left:1px solid #8d793725}\r\n#phoenix-site .stage-detail h3{margin:18px 0;font-size:31px}\r\n#phoenix-site .stage-detail>p{font-size:13px;min-height:70px}\r\n#phoenix-site .finding{\r\n  margin:25px 0;\r\n  border-left:1px solid var(--gold);\r\n  padding:4px 0 4px 16px;\r\n}\r\n#phoenix-site .finding>span{font:8px monospace;color:var(--gold);letter-spacing:2px}\r\n#phoenix-site .finding p{font-size:12px;margin-top:9px;color:#bfbdaf}\r\n#phoenix-site .steps{\r\n  display:grid;\r\n  grid-template-columns:repeat(4,1fr);\r\n  border-top:1px solid #8d793725;\r\n}\r\n#phoenix-site .steps button{\r\n  padding:22px;\r\n  text-align:left;\r\n  color:#91968e;\r\n  font:10px monospace;\r\n  border-right:1px solid #8d793725;\r\n}\r\n#phoenix-site .steps button span{margin-left:15px;font:12px Arial}\r\n#phoenix-site .steps button.active{\r\n  color:var(--gold);\r\n  background:#c4a35112;\r\n  box-shadow:inset 0 2px var(--gold);\r\n}\r\n#phoenix-site #px-signal{\r\n  transition:cx .7s,cy .7s;\r\n  filter:drop-shadow(0 0 7px #bd9e57);\r\n}\r\n\r\n\/* Approach and call to action *\/\r\n#phoenix-site .method{padding-block:115px}\r\n#phoenix-site .method>h2{margin-top:24px}\r\n#phoenix-site .method-grid{\r\n  display:grid;\r\n  grid-template-columns:repeat(3,1fr);\r\n  gap:55px;\r\n  margin-top:65px;\r\n}\r\n#phoenix-site .method-grid article{padding-top:25px;border-top:1px solid #c9ab5638}\r\n#phoenix-site .method-grid article>span{font:9px monospace;color:var(--gold);letter-spacing:2px}\r\n#phoenix-site .method-grid h3{font-size:22px;max-width:230px;margin:22px 0 17px}\r\n#phoenix-site .method-grid p{font-size:13px}\r\n#phoenix-site .cta{\r\n  padding:100px 0 110px;\r\n  text-align:center;\r\n  border-top:1px solid var(--line);\r\n  background:radial-gradient(ellipse at center,#9d772810,transparent 60%);\r\n}\r\n#phoenix-site .cta h2{margin:22px 0;font-size:clamp(60px,7vw,105px)}\r\n#phoenix-site .cta p{font-size:14px}\r\n#phoenix-site .cta .gold{margin:32px auto 18px}\r\n#phoenix-site .cta>.caption{display:block;letter-spacing:1px}\r\n#phoenix-site footer{\r\n  padding:40px 0 35px;\r\n  border-top:1px solid #ffffff14;\r\n  display:flex;\r\n  justify-content:space-between;\r\n  align-items:center;\r\n  gap:30px;\r\n}\r\n#phoenix-site footer>.wordmark{display:block;font-size:17px}\r\n#phoenix-site footer>p{font-family:Georgia,serif;font-size:16px;color:#9c895f}\r\n#phoenix-site footer>div{font-size:10px;color:#999}\r\n#phoenix-site footer button{font-size:10px;color:var(--gold);padding:0}\r\n#phoenix-site footer small{\r\n  display:block;\r\n  font-size:9px;\r\n  max-width:280px;\r\n  line-height:1.6;\r\n  margin-top:10px;\r\n  color:#858982;\r\n}\r\n\r\n\/* Dialogs *\/\r\n#phoenix-site dialog{\r\n  position:fixed;\r\n  inset:0;\r\n  margin:auto;\r\n  background:#101314;\r\n  color:#edece5;\r\n  border:1px solid #bea46080;\r\n  padding:48px;\r\n  width:min(550px,92vw);\r\n  max-height:90svh;\r\n  overflow:auto;\r\n}\r\n#phoenix-site dialog:not([open]){display:none}\r\n#phoenix-site dialog::backdrop{background:#000b;backdrop-filter:blur(10px)}\r\n#phoenix-site dialog h2{font-size:47px;margin:18px 0}\r\n#phoenix-site dialog>p{font-size:13px;margin:20px 0}\r\n#phoenix-site .close{\r\n  position:absolute;\r\n  right:18px;\r\n  top:12px;\r\n  padding:0 8px;\r\n  font-size:28px;\r\n  color:#c3b488;\r\n}\r\n#phoenix-site dialog label{\r\n  display:block;\r\n  font-size:11px;\r\n  color:#b8b3a6;\r\n  margin:18px 0 9px;\r\n}\r\n#phoenix-site dialog select{\r\n  font:13px Arial,Helvetica,sans-serif;\r\n  background:#080a0b;\r\n  color:#ddd;\r\n  width:100%;\r\n  padding:15px;\r\n  border:1px solid #6f634b;\r\n  border-radius:0;\r\n}\r\n#phoenix-site dialog form>.gold{margin-top:24px;width:100%}\r\n#phoenix-site #px-brief-result h3{margin:25px 0 16px}\r\n#phoenix-site #px-brief-result p{font-size:13px;margin-bottom:22px}\r\n#phoenix-site #px-edit-brief{display:block;margin-top:15px}\r\n\r\n\/* Animation and accessibility *\/\r\n#phoenix-site .reveal{transition:opacity .8s,transform .8s}\r\n#phoenix-site.js-motion .reveal:not(.seen){opacity:0;transform:translateY(25px)}\r\n#phoenix-site.no-motion *,\r\n#phoenix-site.no-motion *::before,\r\n#phoenix-site.no-motion *::after{\r\n  animation:none!important;\r\n  transition:none!important;\r\n  scroll-behavior:auto!important;\r\n}\r\n#phoenix-site.no-motion .reveal{opacity:1!important;transform:none!important}\r\n#phoenix-site .skip{\r\n  position:fixed;\r\n  top:-80px;\r\n  left:20px;\r\n  background:var(--gold);\r\n  color:#111;\r\n  padding:15px;\r\n  z-index:9999;\r\n}\r\n#phoenix-site .skip:focus{top:10px}\r\n@keyframes pxRotate{to{transform:rotate(360deg)}}\r\n@keyframes pxMarquee{to{transform:translateX(-40%)}}\r\n@media(prefers-reduced-motion:reduce){\r\n  #phoenix-site *,\r\n  #phoenix-site *::before,\r\n  #phoenix-site *::after{animation:none!important;transition:none!important}\r\n  #phoenix-site .reveal{opacity:1!important;transform:none!important}\r\n}\r\n\r\n\/* Tablet *\/\r\n@media(max-width:1050px){\r\n  #phoenix-site header nav{gap:20px}\r\n  #phoenix-site .hero{min-height:630px}\r\n  #phoenix-site .hero h1{font-size:65px}\r\n  #phoenix-site .hero .actions{flex-direction:column;align-items:flex-start;gap:10px}\r\n  #phoenix-site .hero-note{margin-top:28px}\r\n  #phoenix-site .service-layout{gap:30px}\r\n  #phoenix-site .intro{grid-template-columns:1fr;gap:25px}\r\n  #phoenix-site .principles{flex-wrap:wrap}\r\n  #phoenix-site .method-grid{gap:25px}\r\n  #phoenix-site .emblem{max-width:400px}\r\n}\r\n\r\n\/* Mobile *\/\r\n@media(max-width:760px){\r\n  #phoenix-site .showcase>span,\r\n  #phoenix-site .showcase>a span{display:none}\r\n  #phoenix-site header{min-height:80px;padding:12px 6%}\r\n  #phoenix-site header>.outline{display:none}\r\n  #phoenix-site #px-menu{display:block;font-size:23px;color:var(--gold)}\r\n  #phoenix-site header nav{\r\n    display:none;\r\n    position:absolute;\r\n    top:100%;\r\n    left:0;\r\n    right:0;\r\n    background:#141617;\r\n    padding:30px;\r\n    z-index:10;\r\n  }\r\n  #phoenix-site header nav.open{display:flex;flex-direction:column}\r\n  #phoenix-site .hero{\r\n    height:auto;\r\n    min-height:0;\r\n    grid-template-columns:1fr;\r\n    padding:55px 6% 65px;\r\n    gap:24px;\r\n  }\r\n  #phoenix-site .hero h1{font-size:clamp(48px,10vw,76px)}\r\n  #phoenix-site .hero-copy .eyebrow{font-size:8px;letter-spacing:1.8px}\r\n  #phoenix-site .hero-copy>p{font-size:14px;max-width:480px}\r\n  #phoenix-site .hero .actions{\r\n    flex-direction:row;\r\n    flex-wrap:wrap;\r\n    align-items:center;\r\n    gap:20px;\r\n  }\r\n  #phoenix-site .hero .gold{padding:17px 18px;font-size:11px;gap:15px}\r\n  #phoenix-site .hero-note{display:none}\r\n  #phoenix-site .emblem{width:83%;max-width:380px;margin:8px auto 20px}\r\n  #phoenix-site .orb-label{font-size:6px;letter-spacing:2px;bottom:-10px}\r\n  #phoenix-site .intro{padding-block:75px}\r\n  #phoenix-site .intro>div>p{font-size:14px}\r\n  #phoenix-site .principles{gap:20px;font-size:10px}\r\n  #phoenix-site .sectionhead{\r\n    flex-direction:column;\r\n    align-items:flex-start;\r\n    gap:25px;\r\n    margin-bottom:30px;\r\n  }\r\n  #phoenix-site .sectionhead p{font-size:12px}\r\n  #phoenix-site .service-layout{grid-template-columns:1fr;gap:25px}\r\n  #phoenix-site .tabs button{font-size:16px;padding:20px 4px}\r\n  #phoenix-site .service-panel{padding:28px;min-height:405px}\r\n  #phoenix-site .expertise{padding-bottom:65px}\r\n  #phoenix-site .experience{padding-block:65px}\r\n  #phoenix-site .console-top{padding:16px;font-size:7px}\r\n  #phoenix-site .console-top>span:last-child{display:none}\r\n  #phoenix-site .console-body{grid-template-columns:1fr}\r\n  #phoenix-site .network{padding:8px}\r\n  #phoenix-site .network svg{max-height:260px}\r\n  #phoenix-site .stage-detail{\r\n    padding:25px;\r\n    border-left:0;\r\n    border-top:1px solid #8d793725;\r\n  }\r\n  #phoenix-site .stage-detail>p{min-height:0}\r\n  #phoenix-site .stage-detail h3{font-size:28px}\r\n  #phoenix-site .steps button{padding:17px 10px}\r\n  #phoenix-site .steps button span{display:block;margin:6px 0 0;font-size:10px}\r\n  #phoenix-site .method{padding-block:75px}\r\n  #phoenix-site .method-grid{grid-template-columns:1fr;gap:30px;margin-top:36px}\r\n  #phoenix-site .method-grid h3{max-width:none;font-size:24px;margin:13px 0}\r\n  #phoenix-site .method-grid article{padding-top:20px}\r\n  #phoenix-site .cta{padding-block:70px}\r\n  #phoenix-site footer{flex-direction:column;align-items:flex-start;gap:20px}\r\n  #phoenix-site dialog{padding:35px 25px}\r\n  #phoenix-site dialog h2{font-size:42px}\r\n  #phoenix-site .caption{font-size:9px}\r\n}\r\n<\/style>\r\n\r\n<div id=\"phoenix-site\">\r\n\r\n  <a class=\"skip\" href=\"#px-main\">Skip to content<\/a>\r\n\r\n  <div class=\"showcase\">\r\n    <a href=\"https:\/\/knwbholdings.co.za\/\" target=\"_blank\" rel=\"noopener\">\r\n      KNWB <span>STUDIO \/ DEMO COLLECTION<\/span>\r\n    <\/a>\r\n    <span>01 \u2014 PHOENIX INTELLIGENCE<\/span>\r\n    <button type=\"button\" id=\"px-motion\" aria-pressed=\"false\">Motion: on<\/button>\r\n  <\/div>\r\n\r\n  <header>\r\n    <a class=\"wordmark\" href=\"#px-home\" aria-label=\"Phoenix Intelligence home\">\r\n      <span class=\"mini-flame\" aria-hidden=\"true\">\u25c8<\/span>\r\n      <span>PHOENIX<small>INTELLIGENCE<\/small><\/span>\r\n    <\/a>\r\n\r\n    <nav id=\"px-navigation\" aria-label=\"Main navigation\">\r\n      <a href=\"#px-expertise\">Expertise<\/a>\r\n      <a href=\"#px-perspective\">The approach<\/a>\r\n      <a href=\"#px-experience\">Inside the process<\/a>\r\n    <\/nav>\r\n\r\n    <button type=\"button\" class=\"outline\" data-px-brief>\r\n      Start a conversation <span>\u2197<\/span>\r\n    <\/button>\r\n\r\n    <button type=\"button\" id=\"px-menu\" aria-label=\"Toggle navigation\"\r\n            aria-controls=\"px-navigation\" aria-expanded=\"false\">\u2630<\/button>\r\n  <\/header>\r\n\r\n  <main id=\"px-main\">\r\n\r\n    <section class=\"hero\" id=\"px-home\">\r\n      <canvas id=\"px-particles\" aria-hidden=\"true\"><\/canvas>\r\n\r\n      <div class=\"hero-copy\">\r\n        <div class=\"eyebrow\">\r\n          <i><\/i> INTELLIGENCE &amp; INVESTIGATIONS\r\n        <\/div>\r\n\r\n        <h1>Beyond the noise.<br>Closer to <em>truth.<\/em><\/h1>\r\n\r\n        <p>\r\n          Premium intelligence and investigations for complex business and\r\n          personal matters. Discreet enquiries. Clearer context. Informed decisions.\r\n        <\/p>\r\n\r\n        <div class=\"actions\">\r\n          <a class=\"gold\" href=\"#px-expertise\">\r\n            Explore the possibilities <span>\u2197<\/span>\r\n          <\/a>\r\n          <a class=\"textlink\" href=\"#px-experience\">\r\n            Enter the experience <span>\u2193<\/span>\r\n          <\/a>\r\n        <\/div>\r\n\r\n        <div class=\"hero-note\">\r\n          <span>PHOENIX INTELLIGENCE<\/span>\r\n          <b>Rising above deception.<\/b>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"emblem\" id=\"px-emblem\">\r\n        <div class=\"orbit a\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"orbit b\" aria-hidden=\"true\"><\/div>\r\n        <div class=\"cross top\" aria-hidden=\"true\">+<\/div>\r\n        <div class=\"cross bottom\" aria-hidden=\"true\">+<\/div>\r\n\r\n        <img\r\n          src=\"https:\/\/knwbholdings.co.za\/wp-content\/uploads\/2026\/10\/logo.jpg\"\r\n          alt=\"Phoenix Intelligence \u2014 Rising Above Deception\"\r\n          fetchpriority=\"high\"\r\n          decoding=\"async\"\r\n        >\r\n\r\n        <div class=\"orb-label\">PERSPECTIVE \/ PRECISION \/ PURPOSE<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"scrollnote\" aria-hidden=\"true\">\r\n        SCROLL TO REVEAL <span>\u2193<\/span>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <div class=\"ticker\" aria-hidden=\"true\">\r\n      <div>\r\n        DIGITAL INTELLIGENCE <b>\u2726<\/b>\r\n        STRATEGIC INSIGHT <b>\u2726<\/b>\r\n        EVIDENCE &amp; CONTEXT <b>\u2726<\/b>\r\n        RISK AWARENESS <b>\u2726<\/b>\r\n        DIGITAL INTELLIGENCE <b>\u2726<\/b>\r\n        STRATEGIC INSIGHT <b>\u2726<\/b>\r\n        EVIDENCE &amp; CONTEXT <b>\u2726<\/b>\r\n        RISK AWARENESS <b>\u2726<\/b>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <section class=\"intro wrap reveal\" id=\"px-perspective\">\r\n      <div class=\"eyebrow\">01 \/ THE PHOENIX PERSPECTIVE<\/div>\r\n\r\n      <div>\r\n        <h2>\r\n          Complexity hides the story.<br>\r\n          <em>Perspective reveals it.<\/em>\r\n        <\/h2>\r\n\r\n        <p>\r\n          One signal rarely tells the whole story. Understand the source.\r\n          Connect the context. Separate what is known from what is assumed.\r\n          Then decide what deserves your attention.\r\n        <\/p>\r\n\r\n        <div class=\"principles\">\r\n          <span><b>01<\/b> Question the signal<\/span>\r\n          <span><b>02<\/b> Establish context<\/span>\r\n          <span><b>03<\/b> Inform the decision<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"expertise wrap reveal\" id=\"px-expertise\">\r\n      <div class=\"sectionhead\">\r\n        <div>\r\n          <div class=\"eyebrow\">02 \/ EXPLORE THE EXPERTISE<\/div>\r\n          <h2>A sharper view.<br><em>From every angle.<\/em><\/h2>\r\n        <\/div>\r\n        <p>Explore our areas of focus.<br>Select a discipline to look closer.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"service-layout\">\r\n        <div class=\"tabs\" role=\"tablist\" aria-label=\"Service areas\"\r\n             aria-orientation=\"vertical\">\r\n\r\n          <button type=\"button\" role=\"tab\" id=\"px-tab-0\"\r\n                  aria-selected=\"true\" aria-controls=\"px-service-panel\"\r\n                  data-px-tab=\"0\">\r\n            <span>01<\/span> Corporate investigations <b>\u2197<\/b>\r\n          <\/button>\r\n\r\n          <button type=\"button\" role=\"tab\" id=\"px-tab-1\"\r\n                  aria-selected=\"false\" aria-controls=\"px-service-panel\"\r\n                  tabindex=\"-1\" data-px-tab=\"1\">\r\n            <span>02<\/span> Private investigations <b>\u2197<\/b>\r\n          <\/button>\r\n\r\n          <button type=\"button\" role=\"tab\" id=\"px-tab-2\"\r\n                  aria-selected=\"false\" aria-controls=\"px-service-panel\"\r\n                  tabindex=\"-1\" data-px-tab=\"2\">\r\n            <span>03<\/span> Intelligence <b>\u2197<\/b>\r\n          <\/button>\r\n\r\n          <button type=\"button\" role=\"tab\" id=\"px-tab-3\"\r\n                  aria-selected=\"false\" aria-controls=\"px-service-panel\"\r\n                  tabindex=\"-1\" data-px-tab=\"3\">\r\n            <span>04<\/span> Technical services <b>\u2197<\/b>\r\n          <\/button>\r\n\r\n          <button type=\"button\" role=\"tab\" id=\"px-tab-4\"\r\n                  aria-selected=\"false\" aria-controls=\"px-service-panel\"\r\n                  tabindex=\"-1\" data-px-tab=\"4\">\r\n            <span>05<\/span> Specialist investigations <b>\u2197<\/b>\r\n          <\/button>\r\n        <\/div>\r\n\r\n        <div class=\"service-panel\" id=\"px-service-panel\" role=\"tabpanel\"\r\n             aria-labelledby=\"px-tab-0\" tabindex=\"0\">\r\n          <div class=\"radar\" aria-hidden=\"true\"><div><\/div><\/div>\r\n\r\n          <div class=\"eyebrow\" id=\"px-service-kicker\">\r\n            DISCIPLINE 01 \/ PHOENIX INTELLIGENCE\r\n          <\/div>\r\n\r\n          <h3 id=\"px-service-title\">Protect the business. Understand the facts.<\/h3>\r\n\r\n          <p id=\"px-service-copy\">\r\n            Focused enquiries into the issues that affect organisations,\r\n            assets and trust. Scope each assignment around the business\r\n            decision it needs to inform.\r\n          <\/p>\r\n\r\n          <ul id=\"px-service-items\">\r\n            <li>Corporate fraud investigations<\/li>\r\n            <li>Procurement fraud<\/li>\r\n            <li>Internal theft<\/li>\r\n            <li>Employee misconduct<\/li>\r\n            <li>Due diligence<\/li>\r\n            <li>Business intelligence<\/li>\r\n            <li>Asset investigations<\/li>\r\n            <li>Financial crime investigations<\/li>\r\n            <li>Risk assessments<\/li>\r\n          <\/ul>\r\n\r\n          <button type=\"button\" class=\"textlink\" id=\"px-service-brief\">\r\n            Explore this brief \u2197\r\n          <\/button>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <p class=\"caption\">\r\n        PHOENIX BRAND DEMO \u2014 service areas supplied for the client concept.\r\n        Final service scope and credentials to be confirmed before public launch.\r\n      <\/p>\r\n    <\/section>\r\n\r\n    <section class=\"experience\" id=\"px-experience\">\r\n      <div class=\"wrap\">\r\n        <div class=\"sectionhead reveal\">\r\n          <div>\r\n            <div class=\"eyebrow\">03 \/ AN INTERACTIVE PERSPECTIVE<\/div>\r\n            <h2>Follow the signal.<br><em>Find the context.<\/em><\/h2>\r\n          <\/div>\r\n          <p>A fictional supplier review.<br>Four stages. One clearer picture.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"console\">\r\n          <div class=\"console-top\">\r\n            <span><i><\/i> PHOENIX \/ INTELLIGENCE WORKSPACE<\/span>\r\n            <span>ILLUSTRATIVE SCENARIO<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"console-body\">\r\n            <div class=\"network\" aria-hidden=\"true\">\r\n\r\n              <svg viewBox=\"0 0 560 380\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                <defs>\r\n                  <radialGradient id=\"px-network-glow\">\r\n                    <stop offset=\"0\" stop-color=\"#c6a45b\" stop-opacity=\".22\"\/>\r\n                    <stop offset=\"1\" stop-color=\"#c6a45b\" stop-opacity=\"0\"\/>\r\n                  <\/radialGradient>\r\n                <\/defs>\r\n\r\n                <circle cx=\"280\" cy=\"190\" r=\"180\" fill=\"url(#px-network-glow)\"\/>\r\n\r\n                <g stroke=\"#c7a760\" stroke-opacity=\".25\" fill=\"none\">\r\n                  <circle cx=\"280\" cy=\"190\" r=\"136\"\/>\r\n                  <circle cx=\"280\" cy=\"190\" r=\"85\"\/>\r\n                  <path d=\"M280 190L118 103M280 190L430 75M280 190L448 266M280 190L135 296M118 103L430 75L448 266L135 296Z\"\/>\r\n                <\/g>\r\n\r\n                <g fill=\"#111417\" stroke=\"#c7a760\">\r\n                  <circle cx=\"280\" cy=\"190\" r=\"41\"\/>\r\n                  <circle cx=\"118\" cy=\"103\" r=\"12\"\/>\r\n                  <circle cx=\"430\" cy=\"75\" r=\"12\"\/>\r\n                  <circle cx=\"448\" cy=\"266\" r=\"12\"\/>\r\n                  <circle cx=\"135\" cy=\"296\" r=\"12\"\/>\r\n                <\/g>\r\n\r\n                <g fill=\"#d9c99c\" font-size=\"10\" font-family=\"Arial\"\r\n                   text-anchor=\"middle\">\r\n                  <text x=\"280\" y=\"186\">SUBJECT<\/text>\r\n                  <text x=\"280\" y=\"202\">PROFILE<\/text>\r\n                  <text x=\"118\" y=\"77\">IDENTITY<\/text>\r\n                  <text x=\"430\" y=\"49\">PUBLIC RECORDS<\/text>\r\n                  <text x=\"448\" y=\"299\">DIGITAL PRESENCE<\/text>\r\n                  <text x=\"135\" y=\"329\">SOURCE CONTEXT<\/text>\r\n                <\/g>\r\n\r\n                <circle id=\"px-signal\" cx=\"118\" cy=\"103\" r=\"22\"\r\n                        fill=\"none\" stroke=\"#f6d68b\" stroke-width=\"2\"\/>\r\n              <\/svg>\r\n\r\n              <div class=\"network-bottom\">NO LIVE SEARCH \u2022 NO PERSONAL DATA<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"stage-detail\" aria-live=\"polite\">\r\n              <div class=\"eyebrow\" id=\"px-stage-index\">01 \/ DEFINE THE QUESTION<\/div>\r\n              <h3 id=\"px-stage-title\">Start with the decision.<\/h3>\r\n              <p id=\"px-stage-copy\">\r\n                A fictional company is considering a new supplier.\r\n                The enquiry begins by defining the subject, purpose and\r\n                information needed before a commercial commitment.\r\n              <\/p>\r\n\r\n              <div class=\"finding\">\r\n                <span>ANALYST NOTE<\/span>\r\n                <p id=\"px-stage-finding\">\r\n                  A clear brief limits assumptions and keeps the review focused.\r\n                <\/p>\r\n              <\/div>\r\n\r\n              <button type=\"button\" class=\"outline\" id=\"px-next-stage\">\r\n                Next stage \u2192\r\n              <\/button>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"steps\" aria-label=\"Scenario stages\">\r\n            <button type=\"button\" data-px-stage=\"0\" class=\"active\"\r\n                    aria-pressed=\"true\">01 <span>Define<\/span><\/button>\r\n            <button type=\"button\" data-px-stage=\"1\"\r\n                    aria-pressed=\"false\">02 <span>Connect<\/span><\/button>\r\n            <button type=\"button\" data-px-stage=\"2\"\r\n                    aria-pressed=\"false\">03 <span>Evaluate<\/span><\/button>\r\n            <button type=\"button\" data-px-stage=\"3\"\r\n                    aria-pressed=\"false\">04 <span>Decide<\/span><\/button>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"method wrap reveal\">\r\n      <div class=\"eyebrow\">04 \/ THE WAY FORWARD<\/div>\r\n      <h2>Good intelligence begins<br>with <em>better questions.<\/em><\/h2>\r\n\r\n      <div class=\"method-grid\">\r\n        <article>\r\n          <span>01 \/ PURPOSE<\/span>\r\n          <h3>What do you need to know?<\/h3>\r\n          <p>Start with the decision, the concern and the boundaries of the enquiry.<\/p>\r\n        <\/article>\r\n\r\n        <article>\r\n          <span>02 \/ PERSPECTIVE<\/span>\r\n          <h3>What does the evidence say?<\/h3>\r\n          <p>Consider provenance, relevance and gaps. Keep facts distinct from interpretation.<\/p>\r\n        <\/article>\r\n\r\n        <article>\r\n          <span>03 \/ DIRECTION<\/span>\r\n          <h3>What happens next?<\/h3>\r\n          <p>Translate the findings into practical next steps, with limitations made clear.<\/p>\r\n        <\/article>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"cta wrap reveal\">\r\n      <div class=\"eyebrow\">YOUR NEXT CHAPTER<\/div>\r\n      <h2>Clarity changes<br><em>everything.<\/em><\/h2>\r\n      <p>Explore what a focused intelligence brief could look like.<\/p>\r\n\r\n      <button type=\"button\" class=\"gold\" data-px-brief>\r\n        Build a sample brief <span>\u2197<\/span>\r\n      <\/button>\r\n\r\n      <span class=\"caption\">DEMO ONLY \u2022 NOTHING IS SUBMITTED<\/span>\r\n    <\/section>\r\n\r\n  <\/main>\r\n\r\n  <footer class=\"wrap\">\r\n    <a class=\"wordmark\" href=\"#px-home\">PHOENIX<small>INTELLIGENCE<\/small><\/a>\r\n    <p>Rising above deception.<\/p>\r\n    <div>\r\n      A digital experience by\r\n      <button type=\"button\" id=\"px-studio-open\">KNWB HOLDINGS \u2197<\/button>\r\n      <small>Concept demonstration. Not an operational investigation or legal service.<\/small>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n  <dialog id=\"px-brief-dialog\" aria-labelledby=\"px-brief-heading\">\r\n    <button type=\"button\" class=\"close\" data-px-close aria-label=\"Close brief\">\u00d7<\/button>\r\n    <div class=\"eyebrow\">PHOENIX \/ SAMPLE BRIEF<\/div>\r\n    <h2 id=\"px-brief-heading\">A clearer<br><em>starting point.<\/em><\/h2>\r\n    <p>\r\n      Select a focus and objective to generate a sample brief.\r\n      This demo does not send or store information.\r\n    <\/p>\r\n\r\n    <form id=\"px-brief-form\">\r\n      <label for=\"px-focus\">Area of focus<\/label>\r\n      <select id=\"px-focus\">\r\n        <option>Corporate investigations<\/option>\r\n        <option>Private investigations<\/option>\r\n        <option>Intelligence<\/option>\r\n        <option>Technical services<\/option>\r\n        <option>Specialist investigations<\/option>\r\n      <\/select>\r\n\r\n      <label for=\"px-objective\">Primary objective<\/label>\r\n      <select id=\"px-objective\">\r\n        <option>Understand a concern<\/option>\r\n        <option>Evaluate a business decision<\/option>\r\n        <option>Prepare for specialist advice<\/option>\r\n        <option>Clarify next steps<\/option>\r\n      <\/select>\r\n\r\n      <button class=\"gold\" type=\"submit\">Generate sample brief \u2197<\/button>\r\n    <\/form>\r\n\r\n    <div id=\"px-brief-result\" hidden aria-live=\"polite\">\r\n      <h3>Your sample brief is ready.<\/h3>\r\n      <p id=\"px-brief-summary\"><\/p>\r\n      <button type=\"button\" id=\"px-download\" class=\"gold\">Download sample brief \u2193<\/button>\r\n      <button type=\"button\" id=\"px-edit-brief\" class=\"textlink\">Change selections<\/button>\r\n    <\/div>\r\n  <\/dialog>\r\n\r\n  <dialog id=\"px-studio-dialog\" aria-labelledby=\"px-studio-heading\">\r\n    <button type=\"button\" class=\"close\" data-px-close aria-label=\"Close studio information\">\u00d7<\/button>\r\n    <div class=\"eyebrow\">THE KNWB DEMO COLLECTION<\/div>\r\n    <h2 id=\"px-studio-heading\">Built to make<br><em>an impression.<\/em><\/h2>\r\n    <p>\r\n      This Phoenix Intelligence concept demonstrates a premium\r\n      Intelligence &amp; Investigations identity, purposeful animation\r\n      and interactive storytelling.\r\n    <\/p>\r\n    <p class=\"caption\">Website concept designed by KNWB Holdings.<\/p>\r\n    <a class=\"gold\" href=\"https:\/\/knwbholdings.co.za\/\" target=\"_blank\" rel=\"noopener\">\r\n      Explore KNWB Holdings \u2197\r\n    <\/a>\r\n  <\/dialog>\r\n\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  function initPhoenix(){\r\n    const root = document.getElementById('phoenix-site');\r\n    if(!root || root.dataset.pxReady === 'true') return;\r\n    root.dataset.pxReady = 'true';\r\n\r\n    const $ = selector => root.querySelector(selector);\r\n    const $$ = selector => Array.from(root.querySelectorAll(selector));\r\n\r\n    \/* Service content *\/\r\n    const services = [\r\n      {\r\n        headline:'Protect the business. Understand the facts.',\r\n        copy:'Focused enquiries into the issues that affect organisations, assets and trust. Scope each assignment around the business decision it needs to inform.',\r\n        items:[\r\n          'Corporate fraud investigations',\r\n          'Procurement fraud',\r\n          'Internal theft',\r\n          'Employee misconduct',\r\n          'Due diligence',\r\n          'Business intelligence',\r\n          'Asset investigations',\r\n          'Financial crime investigations',\r\n          'Risk assessments'\r\n        ]\r\n      },\r\n      {\r\n        headline:'Sensitive matters. A considered approach.',\r\n        copy:'Personal concerns deserve careful handling, a clear scope and respectful communication. Each enquiry starts with understanding the circumstances.',\r\n        items:[\r\n          'Marital infidelity',\r\n          'Missing persons',\r\n          'Surveillance',\r\n          'Background investigations',\r\n          'Lifestyle investigations'\r\n        ]\r\n      },\r\n      {\r\n        headline:'Turn information into perspective.',\r\n        copy:'Bring relevant sources into context to support strategic and commercial decisions. Identify what is known, what remains uncertain and what requires further enquiry.',\r\n        items:[\r\n          'Strategic intelligence',\r\n          'Asset tracing',\r\n          'OSINT',\r\n          'Due diligence',\r\n          'Corporate intelligence',\r\n          'Risk intelligence'\r\n        ]\r\n      },\r\n      {\r\n        headline:'See the detail. Preserve the context.',\r\n        copy:'Technical investigation and counter-surveillance capabilities, scoped to the assignment and subject to appropriate authorisation and applicable requirements.',\r\n        items:[\r\n          'Covert surveillance',\r\n          'Video evidence',\r\n          'Employee monitoring',\r\n          'TSCM (bug sweeping)',\r\n          'Technical counter-surveillance',\r\n          'Covert camera investigations',\r\n          'Digital evidence gathering'\r\n        ]\r\n      },\r\n      {\r\n        headline:'Complex matters. Focused attention.',\r\n        copy:'Specialist enquiries into serious and complex concerns. An initial assessment establishes the appropriate scope, expertise and next steps.',\r\n        items:[\r\n          'Serious crimes',\r\n          'Corruption',\r\n          'Kidnap & Extortion (KRE)',\r\n          'Insurance fraud',\r\n          'Financial fraud',\r\n          'Identity theft',\r\n          'Workplace investigations'\r\n        ]\r\n      }\r\n    ];\r\n\r\n    let selectedService = 0;\r\n\r\n    function selectService(index){\r\n      selectedService = index;\r\n\r\n      $$('[data-px-tab]').forEach((button,i)=>{\r\n        button.setAttribute('aria-selected',String(i === index));\r\n        button.tabIndex = i === index ? 0 : -1;\r\n      });\r\n\r\n      $('#px-service-panel').setAttribute('aria-labelledby','px-tab-' + index);\r\n      $('#px-service-kicker').textContent =\r\n        'DISCIPLINE 0' + (index + 1) + ' \/ PHOENIX INTELLIGENCE';\r\n\r\n      $('#px-service-title').textContent = services[index].headline;\r\n      $('#px-service-copy').textContent = services[index].copy;\r\n\r\n      const list = $('#px-service-items');\r\n      list.replaceChildren();\r\n\r\n      services[index].items.forEach(item=>{\r\n        const li = document.createElement('li');\r\n        li.textContent = item;\r\n        list.appendChild(li);\r\n      });\r\n    }\r\n\r\n    $$('[data-px-tab]').forEach(button=>{\r\n      button.addEventListener('click',()=>{\r\n        selectService(Number(button.dataset.pxTab));\r\n      });\r\n\r\n      button.addEventListener('keydown',event=>{\r\n        if(!['ArrowDown','ArrowUp','Home','End'].includes(event.key)) return;\r\n        event.preventDefault();\r\n\r\n        let index;\r\n        if(event.key === 'Home') index = 0;\r\n        else if(event.key === 'End') index = services.length - 1;\r\n        else index = (\r\n          selectedService + (event.key === 'ArrowDown' ? 1 : services.length - 1)\r\n        ) % services.length;\r\n\r\n        selectService(index);\r\n        $('#px-tab-' + index).focus();\r\n      });\r\n    });\r\n\r\n    selectService(0);\r\n\r\n    \/* Fictional investigation sequence *\/\r\n    const stages = [\r\n      [\r\n        'DEFINE THE QUESTION',\r\n        'Start with the decision.',\r\n        'A fictional company is considering a new supplier. The enquiry begins by defining the subject, purpose and information needed before a commercial commitment.',\r\n        'A clear brief limits assumptions and keeps the review focused.'\r\n      ],\r\n      [\r\n        'CONNECT THE CONTEXT',\r\n        'One signal is not a conclusion.',\r\n        'The example links identity details, public records and a digital presence. An apparent mismatch is recorded as a question for verification.',\r\n        'A discrepancy can have an ordinary explanation. Corroboration matters.'\r\n      ],\r\n      [\r\n        'EVALUATE THE FINDINGS',\r\n        'Separate fact from inference.',\r\n        'The fictional review distinguishes verified details, unresolved questions and unsupported claims. The strength and limitations of each source are considered.',\r\n        'Unknown does not mean fraudulent. Record uncertainty explicitly.'\r\n      ],\r\n      [\r\n        'INFORM THE DECISION',\r\n        'Give the next step a clear basis.',\r\n        'The example concludes with a focused recommendation: obtain the missing documentation before proceeding, then reassess the open questions.',\r\n        'This is an illustrative workflow, not a real investigation or risk score.'\r\n      ]\r\n    ];\r\n\r\n    let currentStage = 0;\r\n\r\n    function selectStage(index){\r\n      currentStage = index;\r\n      $('#px-stage-index').textContent = '0' + (index + 1) + ' \/ ' + stages[index][0];\r\n      $('#px-stage-title').textContent = stages[index][1];\r\n      $('#px-stage-copy').textContent = stages[index][2];\r\n      $('#px-stage-finding').textContent = stages[index][3];\r\n\r\n      $$('[data-px-stage]').forEach((button,i)=>{\r\n        button.classList.toggle('active',i === index);\r\n        button.setAttribute('aria-pressed',String(i === index));\r\n      });\r\n\r\n      const position = [[118,103],[430,75],[448,266],[135,296]][index];\r\n      $('#px-signal').setAttribute('cx',position[0]);\r\n      $('#px-signal').setAttribute('cy',position[1]);\r\n\r\n      $('#px-next-stage').textContent =\r\n        index === 3 ? 'Restart the example \u21ba' : 'Next stage \u2192';\r\n    }\r\n\r\n    $$('[data-px-stage]').forEach(button=>{\r\n      button.addEventListener('click',()=>{\r\n        selectStage(Number(button.dataset.pxStage));\r\n      });\r\n    });\r\n\r\n    $('#px-next-stage').addEventListener('click',()=>{\r\n      selectStage((currentStage + 1) % stages.length);\r\n    });\r\n\r\n    selectStage(0);\r\n\r\n    \/* Dialogs *\/\r\n    function openBrief(index){\r\n      if(Number.isInteger(index)) $('#px-focus').selectedIndex = index;\r\n      $('#px-brief-form').hidden = false;\r\n      $('#px-brief-result').hidden = true;\r\n      $('#px-brief-dialog').showModal();\r\n    }\r\n\r\n    $$('[data-px-brief]').forEach(button=>{\r\n      button.addEventListener('click',()=>openBrief());\r\n    });\r\n\r\n    $('#px-service-brief').addEventListener('click',()=>{\r\n      openBrief(selectedService);\r\n    });\r\n\r\n    $('#px-studio-open').addEventListener('click',()=>{\r\n      $('#px-studio-dialog').showModal();\r\n    });\r\n\r\n    $$('[data-px-close]').forEach(button=>{\r\n      button.addEventListener('click',()=>{\r\n        button.closest('dialog').close();\r\n      });\r\n    });\r\n\r\n    $$('dialog').forEach(dialog=>{\r\n      dialog.addEventListener('click',event=>{\r\n        if(event.target !== dialog) return;\r\n        const bounds = dialog.getBoundingClientRect();\r\n\r\n        if(\r\n          event.clientX < bounds.left ||\r\n          event.clientX > bounds.right ||\r\n          event.clientY < bounds.top ||\r\n          event.clientY > bounds.bottom\r\n        ){\r\n          dialog.close();\r\n        }\r\n      });\r\n    });\r\n\r\n    \/* Local sample brief \u2014 no submission or personal data *\/\r\n    let sampleBrief = '';\r\n\r\n    $('#px-brief-form').addEventListener('submit',event=>{\r\n      event.preventDefault();\r\n\r\n      const area = $('#px-focus').value;\r\n      const objective = $('#px-objective').value;\r\n\r\n      sampleBrief = [\r\n        'PHOENIX INTELLIGENCE | SAMPLE BRIEF',\r\n        'KNWB website demonstration',\r\n        '',\r\n        'Focus: ' + area,\r\n        'Objective: ' + objective,\r\n        '',\r\n        'Proposed first step:',\r\n        'Clarify the purpose, permitted scope and available information',\r\n        'with an appropriately authorised professional.',\r\n        '',\r\n        'Suggested discussion points:',\r\n        '1. What decision must this enquiry support?',\r\n        '2. What is known and what requires verification?',\r\n        '3. What authorisations and access are necessary?',\r\n        '4. What outcome and reporting format would be useful?',\r\n        '',\r\n        'DEMO ONLY. This brief has not been submitted.',\r\n        'It is not a service engagement, investigation, legal opinion',\r\n        'or assessment. No personal information has been collected.'\r\n      ].join('\\n');\r\n\r\n      $('#px-brief-summary').textContent =\r\n        'Focus: ' + area + '. Objective: ' + objective +\r\n        '. Download your sample discussion brief below. Nothing has been sent.';\r\n\r\n      $('#px-brief-form').hidden = true;\r\n      $('#px-brief-result').hidden = false;\r\n      $('#px-download').focus();\r\n    });\r\n\r\n    $('#px-edit-brief').addEventListener('click',()=>{\r\n      $('#px-brief-form').hidden = false;\r\n      $('#px-brief-result').hidden = true;\r\n      $('#px-focus').focus();\r\n    });\r\n\r\n    $('#px-download').addEventListener('click',()=>{\r\n      const file = new Blob([sampleBrief],{type:'text\/plain;charset=utf-8'});\r\n      const url = URL.createObjectURL(file);\r\n      const link = document.createElement('a');\r\n\r\n      link.href = url;\r\n      link.download = 'Phoenix-Sample-Brief.txt';\r\n      document.body.appendChild(link);\r\n      link.click();\r\n      link.remove();\r\n\r\n      setTimeout(()=>URL.revokeObjectURL(url),1000);\r\n    });\r\n\r\n    \/* Mobile navigation *\/\r\n    $('#px-menu').addEventListener('click',()=>{\r\n      const open = $('#px-navigation').classList.toggle('open');\r\n      $('#px-menu').setAttribute('aria-expanded',String(open));\r\n    });\r\n\r\n    \/* Motion preference *\/\r\n    const motionQuery = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n    let motion = !motionQuery.matches;\r\n    let frame = 0;\r\n\r\n    \/* Smooth internal navigation *\/\r\n    $$('a[href^=\"#\"]').forEach(link=>{\r\n      link.addEventListener('click',event=>{\r\n        const target = $(link.getAttribute('href'));\r\n        if(!target) return;\r\n\r\n        event.preventDefault();\r\n        $('#px-navigation').classList.remove('open');\r\n        $('#px-menu').setAttribute('aria-expanded','false');\r\n\r\n        target.scrollIntoView({\r\n          behavior:motion ? 'smooth' : 'auto',\r\n          block:'start'\r\n        });\r\n      });\r\n    });\r\n\r\n    \/* Interactive gold particle field *\/\r\n    const canvas = $('#px-particles');\r\n    const context = canvas.getContext('2d');\r\n    const hero = $('.hero');\r\n    const emblem = $('#px-emblem');\r\n\r\n    let width = 1;\r\n    let height = 1;\r\n    let points = [];\r\n    let lastTime = 0;\r\n    const pointer = {x:-1000,y:-1000};\r\n\r\n    function resizeCanvas(){\r\n      if(!context) return;\r\n\r\n      const bounds = hero.getBoundingClientRect();\r\n      width = Math.max(1,bounds.width);\r\n      height = Math.max(1,bounds.height);\r\n      const ratio = Math.min(window.devicePixelRatio || 1,2);\r\n\r\n      canvas.width = Math.round(width * ratio);\r\n      canvas.height = Math.round(height * ratio);\r\n      context.setTransform(ratio,0,0,ratio,0,0);\r\n\r\n      points = Array.from({length:width < 700 ? 35 : 70},()=>({\r\n        x:Math.random() * width,\r\n        y:Math.random() * height,\r\n        vx:(Math.random() - .5) * .17,\r\n        vy:(Math.random() - .5) * .17,\r\n        radius:Math.random() * 1.1 + .25\r\n      }));\r\n    }\r\n\r\n    function draw(time){\r\n      if(!context || !root.isConnected) return;\r\n\r\n      const speed = lastTime ? Math.min((time - lastTime) \/ 16.67,2) : 1;\r\n      lastTime = time;\r\n      context.clearRect(0,0,width,height);\r\n\r\n      for(let i=0;i<points.length;i++){\r\n        const point = points[i];\r\n\r\n        if(motion){\r\n          point.x = (point.x + point.vx * speed + width) % width;\r\n          point.y = (point.y + point.vy * speed + height) % height;\r\n        }\r\n\r\n        context.beginPath();\r\n        context.fillStyle = 'rgba(214,183,110,.6)';\r\n        context.arc(point.x,point.y,point.radius,0,Math.PI * 2);\r\n        context.fill();\r\n\r\n        for(let j=i+1;j<points.length;j++){\r\n          const other = points[j];\r\n          const distance = Math.hypot(point.x-other.x,point.y-other.y);\r\n\r\n          if(distance < 120){\r\n            context.strokeStyle =\r\n              'rgba(204,172,95,' + ((1-distance\/120) * .12) + ')';\r\n            context.beginPath();\r\n            context.moveTo(point.x,point.y);\r\n            context.lineTo(other.x,other.y);\r\n            context.stroke();\r\n          }\r\n        }\r\n\r\n        if(Math.hypot(point.x-pointer.x,point.y-pointer.y) < 170){\r\n          context.strokeStyle = 'rgba(210,182,109,.15)';\r\n          context.beginPath();\r\n          context.moveTo(point.x,point.y);\r\n          context.lineTo(pointer.x,pointer.y);\r\n          context.stroke();\r\n        }\r\n      }\r\n\r\n      if(motion && !document.hidden){\r\n        frame = requestAnimationFrame(draw);\r\n      }\r\n    }\r\n\r\n    function applyMotion(){\r\n      cancelAnimationFrame(frame);\r\n      lastTime = 0;\r\n      root.classList.toggle('no-motion',!motion);\r\n      $('#px-motion').textContent = 'Motion: ' + (motion ? 'on' : 'off');\r\n      $('#px-motion').setAttribute('aria-pressed',String(!motion));\r\n\r\n      if(!motion){\r\n        emblem.style.transform = 'none';\r\n        pointer.x = -1000;\r\n        pointer.y = -1000;\r\n      }\r\n\r\n      draw(performance.now());\r\n    }\r\n\r\n    $('#px-motion').addEventListener('click',()=>{\r\n      motion = !motion;\r\n      applyMotion();\r\n    });\r\n\r\n    if(motionQuery.addEventListener){\r\n      motionQuery.addEventListener('change',event=>{\r\n        motion = !event.matches;\r\n        applyMotion();\r\n      });\r\n    }\r\n\r\n    hero.addEventListener('pointermove',event=>{\r\n      const bounds = canvas.getBoundingClientRect();\r\n      pointer.x = event.clientX-bounds.left;\r\n      pointer.y = event.clientY-bounds.top;\r\n\r\n      if(motion && width > 760){\r\n        const x = (pointer.x\/width-.5) * 5;\r\n        const y = (pointer.y\/height-.5) * 4;\r\n        emblem.style.transform = 'rotateY(' + x + 'deg) rotateX(' + (-y) + 'deg)';\r\n      }\r\n    });\r\n\r\n    hero.addEventListener('pointerleave',()=>{\r\n      pointer.x = -1000;\r\n      pointer.y = -1000;\r\n      emblem.style.transform = 'none';\r\n    });\r\n\r\n    document.addEventListener('visibilitychange',applyMotion);\r\n\r\n    if('ResizeObserver' in window){\r\n      const observer = new ResizeObserver(()=>{\r\n        resizeCanvas();\r\n        if(!motion) draw(performance.now());\r\n      });\r\n      observer.observe(hero);\r\n    }else{\r\n      window.addEventListener('resize',resizeCanvas);\r\n    }\r\n\r\n    resizeCanvas();\r\n    applyMotion();\r\n\r\n    \/* Scroll reveals *\/\r\n    if('IntersectionObserver' in window){\r\n      const revealObserver = new IntersectionObserver(entries=>{\r\n        entries.forEach(entry=>{\r\n          if(entry.isIntersecting){\r\n            entry.target.classList.add('seen');\r\n            revealObserver.unobserve(entry.target);\r\n          }\r\n        });\r\n      },{threshold:.07});\r\n\r\n      root.classList.add('js-motion');\r\n      $$('.reveal').forEach(element=>revealObserver.observe(element));\r\n    }\r\n  }\r\n\r\n  if(document.readyState === 'loading'){\r\n    document.addEventListener('DOMContentLoaded',initPhoenix,{once:true});\r\n  }else{\r\n    initPhoenix();\r\n  }\r\n})();\r\n<\/script>\r\n<style>\r\n\/* Expand only the containers holding the Phoenix demo. *\/\r\n.elementor .e-con:has(#phoenix-site),\r\n.elementor .e-con-inner:has(#phoenix-site),\r\n.elementor .elementor-section:has(#phoenix-site),\r\n.elementor .elementor-container:has(#phoenix-site),\r\n.elementor .elementor-column:has(#phoenix-site),\r\n.elementor .elementor-widget-wrap:has(#phoenix-site),\r\n.elementor .elementor-widget-html:has(#phoenix-site),\r\n.elementor .elementor-widget-container:has(#phoenix-site) {\r\n  width: 100% !important;\r\n  max-width: none !important;\r\n  min-width: 0 !important;\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  --container-max-width: 100%;\r\n  --content-width: 100%;\r\n}\r\n\r\n#phoenix-site {\r\n  width: 100% !important;\r\n  max-width: none !important;\r\n  min-height: 100vh;\r\n  margin: 0 !important;\r\n}\r\n<\/style>\r\n<style>\r\n\/* ========================================\r\n   PHOENIX \u2014 CINEMATIC VISUAL UPGRADE\r\n   ======================================== *\/\r\n\r\n#phoenix-site {\r\n  --gold: #efd08a;\r\n  --muted: #c4c3bd;\r\n  isolation: isolate;\r\n}\r\n\r\n\/* Larger, more readable typography *\/\r\n#phoenix-site .wrap {\r\n  width: min(1440px, 88%);\r\n}\r\n\r\n#phoenix-site .hero {\r\n  height: auto;\r\n  min-height: max(780px, calc(100svh - 140px));\r\n  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);\r\n  gap: 36px;\r\n  padding-block: 90px 100px;\r\n  isolation: isolate;\r\n}\r\n\r\n#phoenix-site .hero-copy,\r\n#phoenix-site .emblem {\r\n  min-width: 0;\r\n}\r\n\r\n#phoenix-site .hero h1 {\r\n  font-size: clamp(64px, 6.7vw, 116px);\r\n  line-height: 1.03;\r\n  letter-spacing: -.055em;\r\n  text-wrap: balance;\r\n}\r\n\r\n#phoenix-site h2 {\r\n  font-size: clamp(46px, 5vw, 84px);\r\n  line-height: 1.08;\r\n  text-wrap: balance;\r\n}\r\n\r\n#phoenix-site .hero-copy > p {\r\n  font-size: clamp(19px, 1.4vw, 23px);\r\n  line-height: 1.75;\r\n  max-width: 600px;\r\n  margin-block: 30px 38px;\r\n}\r\n\r\n#phoenix-site .intro > div > p {\r\n  font-size: 21px;\r\n  max-width: 820px;\r\n}\r\n\r\n#phoenix-site .sectionhead > p {\r\n  font-size: 18px;\r\n  max-width: 390px;\r\n}\r\n\r\n#phoenix-site .eyebrow,\r\n#phoenix-site .hero-copy .eyebrow {\r\n  font-size: 13px;\r\n  letter-spacing: 2.5px;\r\n}\r\n\r\n#phoenix-site nav {\r\n  font-size: 16px;\r\n  gap: 28px;\r\n}\r\n\r\n#phoenix-site .wordmark {\r\n  font-size: 25px;\r\n}\r\n\r\n#phoenix-site .wordmark small {\r\n  font-size: 10px;\r\n}\r\n\r\n#phoenix-site .showcase {\r\n  min-height: 44px;\r\n  height: auto;\r\n  padding-block: 10px;\r\n  font-size: 11px;\r\n}\r\n\r\n#phoenix-site .showcase button {\r\n  font-size: 12px;\r\n}\r\n\r\n#phoenix-site .gold,\r\n#phoenix-site .outline,\r\n#phoenix-site .textlink {\r\n  font-size: 16px;\r\n}\r\n\r\n#phoenix-site .gold {\r\n  padding: 22px 30px;\r\n}\r\n\r\n#phoenix-site .actions {\r\n  flex-wrap: wrap;\r\n  gap: 24px;\r\n}\r\n\r\n#phoenix-site .hero-note span {\r\n  font-size: 12px;\r\n}\r\n\r\n#phoenix-site .hero-note b,\r\n#phoenix-site .principles {\r\n  font-size: 15px;\r\n}\r\n\r\n#phoenix-site .ticker > div {\r\n  font-size: 14px;\r\n}\r\n\r\n#phoenix-site .tabs button {\r\n  font-size: clamp(21px, 1.7vw, 28px);\r\n  padding-block: 30px;\r\n}\r\n\r\n#phoenix-site .tabs button span {\r\n  font-size: 13px;\r\n}\r\n\r\n#phoenix-site .service-panel {\r\n  padding: 46px;\r\n  min-height: 520px;\r\n}\r\n\r\n#phoenix-site .service-panel h3,\r\n#phoenix-site .stage-detail h3 {\r\n  font-size: clamp(32px, 3vw, 44px);\r\n  max-width: none;\r\n}\r\n\r\n#phoenix-site .service-panel p,\r\n#phoenix-site .stage-detail > p,\r\n#phoenix-site .method-grid p {\r\n  font-size: 18px;\r\n  line-height: 1.8;\r\n  max-width: none;\r\n}\r\n\r\n#phoenix-site .service-panel ul {\r\n  font-size: 16px;\r\n  line-height: 1.65;\r\n  gap: 14px;\r\n}\r\n\r\n#phoenix-site .finding p {\r\n  font-size: 17px;\r\n}\r\n\r\n#phoenix-site .finding > span,\r\n#phoenix-site .console-top,\r\n#phoenix-site .network-bottom {\r\n  font-size: 12px;\r\n}\r\n\r\n#phoenix-site .steps button,\r\n#phoenix-site .steps button span {\r\n  font-size: 15px;\r\n}\r\n\r\n#phoenix-site .method-grid h3 {\r\n  font-size: 30px;\r\n  max-width: none;\r\n}\r\n\r\n#phoenix-site .method-grid article > span {\r\n  font-size: 13px;\r\n}\r\n\r\n#phoenix-site .caption {\r\n  font-size: 13px;\r\n}\r\n\r\n#phoenix-site .cta h2 {\r\n  font-size: clamp(58px, 7.5vw, 124px);\r\n}\r\n\r\n#phoenix-site .cta p {\r\n  font-size: 20px;\r\n}\r\n\r\n#phoenix-site footer > div,\r\n#phoenix-site footer button,\r\n#phoenix-site footer small {\r\n  font-size: 13px;\r\n}\r\n\r\n#phoenix-site dialog > p,\r\n#phoenix-site dialog label,\r\n#phoenix-site dialog select {\r\n  font-size: 16px;\r\n}\r\n\r\n\/* Cinematic moving gold illumination *\/\r\n#phoenix-site .hero::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: -20%;\r\n  z-index: -1;\r\n  pointer-events: none;\r\n  background:\r\n    radial-gradient(\r\n      ellipse at 78% 40%,\r\n      rgba(218, 163, 55, .26),\r\n      transparent 40%\r\n    ),\r\n    radial-gradient(\r\n      ellipse at 20% 78%,\r\n      rgba(154, 106, 26, .14),\r\n      transparent 45%\r\n    ),\r\n    conic-gradient(\r\n      from 210deg at 76% 48%,\r\n      transparent 0deg,\r\n      rgba(239, 208, 138, .12) 25deg,\r\n      transparent 55deg,\r\n      transparent 360deg\r\n    );\r\n  animation: px-wow-atmosphere 14s ease-in-out infinite alternate;\r\n}\r\n\r\n#phoenix-site .hero::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: -1;\r\n  pointer-events: none;\r\n  opacity: .38;\r\n  background-image:\r\n    linear-gradient(rgba(239,208,138,.09) 1px, transparent 1px),\r\n    linear-gradient(90deg, rgba(239,208,138,.09) 1px, transparent 1px);\r\n  background-size: 80px 80px;\r\n  -webkit-mask-image: radial-gradient(\r\n    ellipse at 75% 50%, #000, transparent 72%\r\n  );\r\n  mask-image: radial-gradient(\r\n    ellipse at 75% 50%, #000, transparent 72%\r\n  );\r\n}\r\n\r\n#phoenix-site .hero canvas {\r\n  opacity: .95;\r\n}\r\n\r\n\/* Metallic light moving across the gold headline *\/\r\n#phoenix-site .hero h1 em {\r\n  color: #efd08a;\r\n  text-shadow: 0 0 38px rgba(224, 175, 70, .2);\r\n}\r\n\r\n@supports (-webkit-background-clip: text) or (background-clip: text) {\r\n  #phoenix-site .hero h1 em {\r\n    background: linear-gradient(\r\n      110deg,\r\n      #b68b39 0%,\r\n      #efd08a 25%,\r\n      #fff7d9 43%,\r\n      #d6ac52 58%,\r\n      #efd08a 80%,\r\n      #b68b39 100%\r\n    );\r\n    background-size: 250% 100%;\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n    color: transparent;\r\n    animation: px-wow-metal 8s ease-in-out infinite;\r\n  }\r\n}\r\n\r\n\/* Phoenix halo and orbital light trails *\/\r\n#phoenix-site .emblem {\r\n  z-index: 1;\r\n  max-width: 640px;\r\n  margin-inline: auto;\r\n}\r\n\r\n#phoenix-site .emblem::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 7%;\r\n  border-radius: 50%;\r\n  pointer-events: none;\r\n  background: radial-gradient(\r\n    circle,\r\n    rgba(239, 186, 69, .25),\r\n    rgba(169, 115, 24, .09) 48%,\r\n    transparent 70%\r\n  );\r\n  box-shadow: 0 0 100px rgba(197, 143, 39, .14);\r\n  animation: px-wow-halo 6s ease-in-out infinite alternate;\r\n}\r\n\r\n#phoenix-site .emblem img {\r\n  filter:\r\n    drop-shadow(0 0 24px rgba(224,175,70,.3))\r\n    drop-shadow(0 15px 35px rgba(0,0,0,.65));\r\n}\r\n\r\n#phoenix-site .orbit.a {\r\n  inset: -1%;\r\n  border: 2px solid rgba(239,208,138,.14);\r\n  border-top-color: #ffe7a8;\r\n  border-right-color: rgba(239,208,138,.6);\r\n  box-shadow:\r\n    0 0 22px rgba(224,175,70,.12),\r\n    inset 0 0 22px rgba(224,175,70,.08);\r\n  animation: px-wow-orbit 18s linear infinite;\r\n}\r\n\r\n#phoenix-site .orbit.a::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  top: 14%;\r\n  right: 14%;\r\n  width: 9px;\r\n  height: 9px;\r\n  border-radius: 50%;\r\n  background: #fff4cf;\r\n  box-shadow:\r\n    0 0 12px #fff0b9,\r\n    0 0 30px #edbd58,\r\n    0 0 60px #c48b29;\r\n}\r\n\r\n#phoenix-site .orbit.b {\r\n  inset: -7%;\r\n  opacity: .7;\r\n  border-color: rgba(239,208,138,.35);\r\n  animation: px-wow-orbit 40s linear infinite reverse;\r\n}\r\n\r\n#phoenix-site .orb-label {\r\n  font-size: 11px;\r\n  letter-spacing: 2.5px;\r\n  color: #d7bd81;\r\n  bottom: -38px;\r\n  text-align: center;\r\n}\r\n\r\n#phoenix-site .cross {\r\n  color: #ffe4a0;\r\n  text-shadow: 0 0 15px #d6a340;\r\n}\r\n\r\n\/* Richer service cards and interactive surfaces *\/\r\n#phoenix-site .service-panel,\r\n#phoenix-site .console {\r\n  border-color: rgba(239,208,138,.38);\r\n  box-shadow:\r\n    0 25px 70px rgba(0,0,0,.35),\r\n    inset 0 1px rgba(255,236,180,.08);\r\n}\r\n\r\n#phoenix-site .radar {\r\n  opacity: .9;\r\n  width: 230px;\r\n  height: 230px;\r\n}\r\n\r\n#phoenix-site .radar div {\r\n  background: conic-gradient(\r\n    transparent 200deg,\r\n    rgba(239,208,138,.06) 260deg,\r\n    rgba(239,208,138,.45) 355deg,\r\n    transparent 360deg\r\n  );\r\n}\r\n\r\n#phoenix-site .tabs button {\r\n  transition:\r\n    background .3s ease,\r\n    color .3s ease,\r\n    padding .3s ease;\r\n}\r\n\r\n#phoenix-site .tabs button[aria-selected=\"true\"] {\r\n  background: linear-gradient(\r\n    90deg, rgba(239,208,138,.14), transparent\r\n  );\r\n  box-shadow: inset 3px 0 #efd08a;\r\n  padding-left: 20px;\r\n}\r\n\r\n#phoenix-site .method-grid article {\r\n  padding: 30px 24px;\r\n  background: linear-gradient(\r\n    145deg, rgba(239,208,138,.055), transparent\r\n  );\r\n  transition: transform .35s ease, background .35s ease;\r\n}\r\n\r\n#phoenix-site .gold {\r\n  position: relative;\r\n  overflow: hidden;\r\n  box-shadow: 0 8px 30px rgba(211,166,67,.2);\r\n}\r\n\r\n#phoenix-site .gold::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: -60% auto -60% -90%;\r\n  width: 45%;\r\n  pointer-events: none;\r\n  background: linear-gradient(\r\n    90deg, transparent, rgba(255,255,255,.55), transparent\r\n  );\r\n  transform: skewX(-22deg);\r\n  animation: px-wow-button-light 7s ease-in-out infinite;\r\n}\r\n\r\n#phoenix-site .cta {\r\n  background:\r\n    radial-gradient(\r\n      ellipse at 50% 70%,\r\n      rgba(209,159,54,.18),\r\n      transparent 65%\r\n    ),\r\n    #090a0b;\r\n}\r\n\r\n@media (hover: hover) {\r\n  #phoenix-site .gold:hover {\r\n    transform: translateY(-5px);\r\n    box-shadow: 0 16px 46px rgba(221,174,73,.35);\r\n  }\r\n\r\n  #phoenix-site .outline:hover {\r\n    background: rgba(239,208,138,.12);\r\n    box-shadow: 0 0 28px rgba(239,208,138,.12);\r\n  }\r\n\r\n  #phoenix-site .tabs button:hover {\r\n    color: #ffe7ae;\r\n    background: rgba(239,208,138,.06);\r\n    padding-left: 20px;\r\n  }\r\n\r\n  #phoenix-site .method-grid article:hover {\r\n    transform: translateY(-8px);\r\n    background: rgba(239,208,138,.09);\r\n  }\r\n}\r\n\r\n\/* Motion *\/\r\n@keyframes px-wow-atmosphere {\r\n  from { transform: translate3d(-2%, -1%, 0) rotate(-4deg); }\r\n  to   { transform: translate3d(2%, 2%, 0) rotate(5deg); }\r\n}\r\n\r\n@keyframes px-wow-metal {\r\n  0%, 100% { background-position: 0% 50%; }\r\n  50%      { background-position: 100% 50%; }\r\n}\r\n\r\n@keyframes px-wow-halo {\r\n  from { transform: scale(.94); opacity: .6; }\r\n  to   { transform: scale(1.06); opacity: 1; }\r\n}\r\n\r\n@keyframes px-wow-orbit {\r\n  to { transform: rotate(360deg); }\r\n}\r\n\r\n@keyframes px-wow-button-light {\r\n  0%, 65% { left: -90%; }\r\n  90%, 100% { left: 160%; }\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width: 1100px) {\r\n  #phoenix-site header {\r\n    flex-wrap: wrap;\r\n    height: auto;\r\n    min-height: 100px;\r\n    gap: 20px;\r\n    padding-block: 20px;\r\n  }\r\n\r\n  #phoenix-site header nav {\r\n    gap: 18px;\r\n    font-size: 14px;\r\n  }\r\n\r\n  #phoenix-site .hero {\r\n    gap: 28px;\r\n    padding-block: 70px 90px;\r\n  }\r\n\r\n  #phoenix-site .hero h1 {\r\n    font-size: clamp(58px, 7vw, 80px);\r\n  }\r\n\r\n  #phoenix-site .service-layout {\r\n    gap: 30px;\r\n  }\r\n\r\n  #phoenix-site .service-panel {\r\n    padding: 30px;\r\n  }\r\n\r\n  #phoenix-site .service-panel ul {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  #phoenix-site .principles {\r\n    flex-wrap: wrap;\r\n  }\r\n}\r\n\r\n\/* Mobile: large type without overflow *\/\r\n@media (max-width: 760px) {\r\n  #phoenix-site header {\r\n    height: 80px;\r\n    min-height: 80px;\r\n    flex-wrap: nowrap;\r\n    padding-block: 0;\r\n  }\r\n\r\n  #phoenix-site header nav {\r\n    font-size: 18px;\r\n  }\r\n\r\n  #phoenix-site .wordmark {\r\n    font-size: 21px;\r\n  }\r\n\r\n  #phoenix-site .hero {\r\n    grid-template-columns: minmax(0, 1fr);\r\n    min-height: 0;\r\n    padding: 60px 6% 75px;\r\n    gap: 55px;\r\n  }\r\n\r\n  #phoenix-site .hero h1 {\r\n    font-size: clamp(50px, 11.5vw, 82px);\r\n  }\r\n\r\n  #phoenix-site .hero-copy > p {\r\n    font-size: 18px;\r\n  }\r\n\r\n  #phoenix-site .hero-copy .eyebrow {\r\n    font-size: 11px;\r\n    letter-spacing: 1.7px;\r\n  }\r\n\r\n  #phoenix-site h2 {\r\n    font-size: clamp(40px, 9vw, 60px);\r\n  }\r\n\r\n  #phoenix-site .hero .gold,\r\n  #phoenix-site .gold,\r\n  #phoenix-site .outline,\r\n  #phoenix-site .textlink {\r\n    font-size: 15px;\r\n  }\r\n\r\n  #phoenix-site .hero .gold {\r\n    padding: 19px 22px;\r\n  }\r\n\r\n  #phoenix-site .emblem {\r\n    width: 84%;\r\n    max-width: 430px;\r\n    margin-bottom: 38px;\r\n  }\r\n\r\n  #phoenix-site .orb-label {\r\n    font-size: 9px;\r\n    letter-spacing: 1.5px;\r\n  }\r\n\r\n  #phoenix-site .intro > div > p,\r\n  #phoenix-site .sectionhead > p,\r\n  #phoenix-site .service-panel p,\r\n  #phoenix-site .stage-detail > p,\r\n  #phoenix-site .method-grid p {\r\n    font-size: 17px;\r\n  }\r\n\r\n  #phoenix-site .tabs button {\r\n    font-size: 21px;\r\n  }\r\n\r\n  #phoenix-site .service-panel {\r\n    padding: 28px 24px;\r\n    min-height: 0;\r\n  }\r\n\r\n  #phoenix-site .service-panel ul {\r\n    font-size: 16px;\r\n  }\r\n\r\n  #phoenix-site .method-grid h3 {\r\n    font-size: 28px;\r\n  }\r\n\r\n  #phoenix-site .steps button {\r\n    padding: 18px 8px;\r\n  }\r\n\r\n  #phoenix-site .steps button span {\r\n    font-size: 12px;\r\n    margin-left: 0;\r\n  }\r\n\r\n  #phoenix-site .cta h2 {\r\n    font-size: clamp(50px, 12vw, 78px);\r\n  }\r\n\r\n  #phoenix-site .cta p {\r\n    font-size: 18px;\r\n    padding-inline: 6%;\r\n  }\r\n}\r\n\r\n\/* Respect the existing Motion toggle and device preferences *\/\r\n#phoenix-site.no-motion *,\r\n#phoenix-site.no-motion *::before,\r\n#phoenix-site.no-motion *::after {\r\n  animation: none !important;\r\n  transition: none !important;\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  #phoenix-site *,\r\n  #phoenix-site *::before,\r\n  #phoenix-site *::after {\r\n    animation: none !important;\r\n    transition: none !important;\r\n  }\r\n}\r\n<\/style>\r\n<style>\r\n#phoenix-whatsapp-demo {\r\n  position: fixed;\r\n  right: 26px;\r\n  bottom: 26px;\r\n  z-index: 9999;\r\n  font-family: Arial, Helvetica, sans-serif;\r\n}\r\n\r\n#phoenix-whatsapp-demo button {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  min-height: 62px;\r\n  padding: 12px 20px;\r\n  border: 1px solid rgba(255,255,255,.3);\r\n  border-radius: 50px;\r\n  background: #128c4a;\r\n  color: #fff;\r\n  cursor: pointer;\r\n  box-shadow: 0 8px 32px rgba(18,140,74,.4);\r\n  transition: transform .25s, box-shadow .25s;\r\n}\r\n\r\n#phoenix-whatsapp-demo button:hover {\r\n  transform: translateY(-4px);\r\n  box-shadow: 0 12px 40px rgba(18,140,74,.55);\r\n}\r\n\r\n#phoenix-whatsapp-demo button:focus-visible {\r\n  outline: 3px solid #efd08a;\r\n  outline-offset: 5px;\r\n}\r\n\r\n#phoenix-whatsapp-demo svg {\r\n  width: 32px;\r\n  height: 32px;\r\n  flex-shrink: 0;\r\n  fill: currentColor;\r\n}\r\n\r\n#phoenix-whatsapp-demo .wa-label {\r\n  text-align: left;\r\n  font-size: 16px;\r\n  font-weight: 700;\r\n  line-height: 1.3;\r\n}\r\n\r\n#phoenix-whatsapp-demo .wa-label small {\r\n  display: block;\r\n  margin-top: 3px;\r\n  font-size: 10px;\r\n  font-weight: 400;\r\n  letter-spacing: 1.5px;\r\n}\r\n\r\n#phoenix-wa-notice {\r\n  position: absolute;\r\n  bottom: calc(100% + 16px);\r\n  right: 0;\r\n  width: min(310px, calc(100vw - 40px));\r\n  padding: 20px;\r\n  border: 1px solid #b99a58;\r\n  border-radius: 14px;\r\n  background: #111514;\r\n  color: #eee9db;\r\n  font-size: 15px;\r\n  line-height: 1.65;\r\n  box-shadow: 0 16px 45px #0006;\r\n}\r\n\r\n#phoenix-wa-notice[hidden] {\r\n  display: none !important;\r\n}\r\n\r\n#phoenix-wa-notice strong {\r\n  display: block;\r\n  margin-bottom: 5px;\r\n  color: #efd08a;\r\n}\r\n\r\n@media (max-width: 600px) {\r\n  #phoenix-whatsapp-demo {\r\n    right: 16px;\r\n    bottom: calc(16px + env(safe-area-inset-bottom, 0px));\r\n  }\r\n\r\n  #phoenix-whatsapp-demo button {\r\n    min-height: 56px;\r\n    padding: 10px 16px;\r\n  }\r\n\r\n  #phoenix-whatsapp-demo .wa-label {\r\n    font-size: 14px;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  #phoenix-whatsapp-demo button {\r\n    transition: none;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div id=\"phoenix-whatsapp-demo\">\r\n  <div id=\"phoenix-wa-notice\" role=\"status\" hidden>\r\n    <strong>WhatsApp \u2014 demonstration only<\/strong>\r\n    On the live website, this button would open a WhatsApp\r\n    conversation. No chat is connected to this demo.\r\n  <\/div>\r\n\r\n  <button\r\n    type=\"button\"\r\n    aria-label=\"WhatsApp demonstration \u2014 no live chat connected\"\r\n    aria-expanded=\"false\"\r\n    aria-controls=\"phoenix-wa-notice\"\r\n    onclick=\"\r\n      var notice = document.getElementById('phoenix-wa-notice');\r\n      notice.hidden = !notice.hidden;\r\n      this.setAttribute('aria-expanded', String(!notice.hidden));\r\n    \"\r\n  >\r\n    <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n      <path d=\"M20.52 3.48A11.87 11.87 0 0012.05 0C5.47 0 .11 5.35.1 11.94c0 2.1.55 4.15 1.59 5.96L0 24l6.24-1.64a11.94 11.94 0 005.8 1.48h.01c6.58 0 11.94-5.35 11.95-11.94a11.88 11.88 0 00-3.48-8.42zM12.05 21.82a9.9 9.9 0 01-5.04-1.38l-.36-.21-3.7.97.99-3.61-.24-.37a9.9 9.9 0 01-1.52-5.28c0-5.47 4.45-9.92 9.92-9.92a9.86 9.86 0 017.02 2.91 9.86 9.86 0 012.9 7.03c0 5.47-4.45 9.92-9.97 9.86zm5.44-7.43c-.3-.15-1.77-.87-2.04-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.95 1.17-.17.2-.35.22-.65.07-.3-.15-1.26-.46-2.4-1.48-.89-.79-1.49-1.77-1.67-2.07-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.18.2-.3.3-.5.1-.2.05-.37-.03-.52-.07-.15-.67-1.62-.92-2.22-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.8.37-.27.3-1.04 1.02-1.04 2.49s1.07 2.89 1.22 3.09c.15.2 2.1 3.2 5.09 4.49.71.31 1.27.49 1.71.63.72.23 1.37.2 1.88.12.58-.09 1.77-.72 2.02-1.42.25-.7.25-1.3.17-1.42-.07-.13-.27-.2-.57-.35z\"\/>\r\n    <\/svg>\r\n\r\n    <span class=\"wa-label\">\r\n      WhatsApp us\r\n      <small>DEMO ONLY<\/small>\r\n    <\/span>\r\n  <\/button>\r\n<\/div>\r\n<style>\r\n#phoenix-back-knwb {\r\n  position: fixed;\r\n  left: 20px;\r\n  bottom: calc(24px + env(safe-area-inset-bottom, 0px));\r\n  z-index: 9998;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  min-height: 52px;\r\n  padding: 12px 20px;\r\n  border: 1px solid #d8b974;\r\n  border-radius: 40px;\r\n  background: #101112;\r\n  color: #efd08a;\r\n  font: 700 15px\/1.3 Arial, sans-serif;\r\n  text-decoration: none;\r\n  box-shadow: 0 8px 28px #0007;\r\n  transition: transform .25s ease, background .25s ease;\r\n}\r\n\r\n#phoenix-back-knwb:hover {\r\n  transform: translateY(-3px);\r\n  background: #292317;\r\n  color: #fff0c8;\r\n}\r\n\r\n#phoenix-back-knwb:focus-visible {\r\n  outline: 3px solid #efd08a;\r\n  outline-offset: 4px;\r\n}\r\n\r\n@media (max-width: 600px) {\r\n  #phoenix-back-knwb {\r\n    left: 12px;\r\n    bottom: calc(18px + env(safe-area-inset-bottom, 0px));\r\n    min-height: 48px;\r\n    padding: 10px 13px;\r\n    font-size: 12px;\r\n    gap: 6px;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  #phoenix-back-knwb {\r\n    transition: none;\r\n    transform: none;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<a\r\n  id=\"phoenix-back-knwb\"\r\n  href=\"https:\/\/knwbholdings.co.za\/\"\r\n  aria-label=\"Return to the KNWB Holdings homepage\"\r\n>\r\n  <span aria-hidden=\"true\">\u2190<\/span>\r\n  Back to KNWB\r\n<\/a>\r\n<style>\r\n#phoenix-site .tabs {\r\n  position: relative;\r\n  z-index: 3;\r\n}\r\n\r\n#phoenix-site .tabs button {\r\n  position: relative;\r\n  min-height: 60px;\r\n  touch-action: manipulation;\r\n  cursor: pointer;\r\n}\r\n\r\n#phoenix-site .radar,\r\n#phoenix-site .orbit {\r\n  pointer-events: none;\r\n}\r\n\r\n#phoenix-site .service-panel {\r\n  scroll-margin-top: 100px;\r\n}\r\n\r\n@media (max-width: 760px) {\r\n  #phoenix-site .service-panel {\r\n    scroll-margin-top: 30px;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function installPhoenixServiceFix() {\r\n    const root = document.getElementById(\"phoenix-site\");\r\n    if (!root || root.dataset.mobileServicesFixed) return;\r\n\r\n    const tabs = root.querySelector(\".tabs\");\r\n    const panel = root.querySelector(\".service-panel\");\r\n    if (!tabs || !panel) return;\r\n\r\n    const buttons = Array.from(tabs.querySelectorAll(\"button\"));\r\n    const title = panel.querySelector(\"h3\");\r\n    const copy = panel.querySelector(\"p\");\r\n    const list = panel.querySelector(\"ul\");\r\n    const label = panel.querySelector(\".eyebrow\");\r\n\r\n    if (buttons.length !== 5 || !title || !copy || !list) return;\r\n    root.dataset.mobileServicesFixed = \"true\";\r\n\r\n    const services = [\r\n      {\r\n        name: \"Corporate investigations\",\r\n        title: \"Clarity for critical business decisions.\",\r\n        copy: \"Investigate business concerns, assess risk and bring relevant evidence into context to support informed decisions.\",\r\n        items: [\r\n          \"Corporate fraud investigations\",\r\n          \"Procurement fraud\",\r\n          \"Internal theft\",\r\n          \"Employee misconduct\",\r\n          \"Due diligence\",\r\n          \"Business intelligence\",\r\n          \"Asset investigations\",\r\n          \"Financial crime investigations\",\r\n          \"Risk assessments\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"Private investigations\",\r\n        title: \"Sensitive matters. A considered approach.\",\r\n        copy: \"Personal concerns deserve careful handling, a clear scope and respectful communication. Each enquiry starts with understanding the circumstances.\",\r\n        items: [\r\n          \"Marital infidelity\",\r\n          \"Missing persons\",\r\n          \"Surveillance\",\r\n          \"Background investigations\",\r\n          \"Lifestyle investigations\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"Intelligence\",\r\n        title: \"Turn information into perspective.\",\r\n        copy: \"Bring relevant sources into context to support strategic and commercial decisions. Identify what is known, what remains uncertain and what requires further enquiry.\",\r\n        items: [\r\n          \"Strategic intelligence\",\r\n          \"Asset tracing\",\r\n          \"OSINT\",\r\n          \"Due diligence\",\r\n          \"Corporate intelligence\",\r\n          \"Risk intelligence\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"Technical services\",\r\n        title: \"See the detail. Preserve the context.\",\r\n        copy: \"Technical investigation and counter-surveillance capabilities, scoped to the assignment and subject to appropriate authorisation.\",\r\n        items: [\r\n          \"Covert surveillance\",\r\n          \"Video evidence\",\r\n          \"Employee monitoring\",\r\n          \"TSCM (bug sweeping)\",\r\n          \"Technical counter-surveillance\",\r\n          \"Covert camera investigations\",\r\n          \"Digital evidence gathering\"\r\n        ]\r\n      },\r\n      {\r\n        name: \"Specialist investigations\",\r\n        title: \"Complex matters. Focused attention.\",\r\n        copy: \"Specialist enquiries into serious and complex concerns. An initial assessment establishes the appropriate scope, expertise and next steps.\",\r\n        items: [\r\n          \"Serious crimes\",\r\n          \"Corruption\",\r\n          \"Kidnap & Extortion (KRE)\",\r\n          \"Insurance fraud\",\r\n          \"Financial fraud\",\r\n          \"Identity theft\",\r\n          \"Workplace investigations\"\r\n        ]\r\n      }\r\n    ];\r\n\r\n    function showService(index, scrollToPanel) {\r\n      const service = services[index];\r\n      if (!service) return;\r\n\r\n      buttons.forEach(function (button, position) {\r\n        const active = position === index;\r\n        button.setAttribute(\"aria-selected\", String(active));\r\n        button.tabIndex = active ? 0 : -1;\r\n      });\r\n\r\n      if (label) label.textContent = service.name;\r\n      title.textContent = service.title;\r\n      copy.textContent = service.copy;\r\n\r\n      list.replaceChildren();\r\n      service.items.forEach(function (item) {\r\n        const li = document.createElement(\"li\");\r\n        li.textContent = item;\r\n        list.appendChild(li);\r\n      });\r\n\r\n      if (buttons[index].id) {\r\n        panel.setAttribute(\"aria-labelledby\", buttons[index].id);\r\n      }\r\n\r\n      panel.hidden = false;\r\n      panel.classList.add(\"seen\");\r\n\r\n      if (scrollToPanel && window.matchMedia(\"(max-width: 760px)\").matches) {\r\n        const reducedMotion =\r\n          window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches ||\r\n          root.classList.contains(\"no-motion\");\r\n\r\n        requestAnimationFrame(function () {\r\n          panel.scrollIntoView({\r\n            behavior: reducedMotion ? \"auto\" : \"smooth\",\r\n            block: \"start\"\r\n          });\r\n        });\r\n      }\r\n    }\r\n\r\n    tabs.addEventListener(\"click\", function (event) {\r\n      const button = event.target.closest(\"button\");\r\n      const index = buttons.indexOf(button);\r\n      if (index < 0) return;\r\n\r\n      event.preventDefault();\r\n      showService(index, true);\r\n    });\r\n\r\n    const selected = buttons.findIndex(function (button) {\r\n      return button.getAttribute(\"aria-selected\") === \"true\";\r\n    });\r\n\r\n    showService(selected >= 0 ? selected : 0, false);\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", installPhoenixServiceFix);\r\n  } else {\r\n    installPhoenixServiceFix();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Skip to content KNWB STUDIO \/ DEMO COLLECTION 01 \u2014 PHOENIX INTELLIGENCE Motion: on \u25c8 PHOENIXINTELLIGENCE Expertise The approach Inside the process Start a conversation \u2197 \u2630 INTELLIGENCE &amp; INVESTIGATIONS Beyond the noise.Closer to truth. Premium intelligence and investigations for complex business and personal matters. Discreet enquiries. Clearer context. Informed decisions. Explore the possibilities \u2197 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-518","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/pages\/518","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=518"}],"version-history":[{"count":19,"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/pages\/518\/revisions"}],"predecessor-version":[{"id":544,"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=\/wp\/v2\/pages\/518\/revisions\/544"}],"wp:attachment":[{"href":"https:\/\/knwbholdings.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=518"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}