{"id":7,"date":"2026-06-08T22:13:58","date_gmt":"2026-06-08T22:13:58","guid":{"rendered":"https:\/\/calai.com.pk\/?page_id=7"},"modified":"2026-06-09T20:43:11","modified_gmt":"2026-06-09T20:43:11","slug":"home","status":"publish","type":"page","link":"https:\/\/calai.com.pk\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"7\" class=\"elementor elementor-7\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-29052d7 e-con-full e-flex e-con e-parent\" data-id=\"29052d7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e512ec4 elementor-widget elementor-widget-html\" data-id=\"e512ec4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================= -->\n<!--  CALAI \u00b7 IMMERSIVE LEARNING UNIVERSE  \u00b7  embeddable fragment   -->\n<!--  Drop into any HTML widget (Elementor, etc). Fully scoped.     -->\n<!-- ============================================================= -->\n\n<style>\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Orbitron:wght@500;700;900&family=Chakra+Petch:wght@400;500;600;700&family=Rajdhani:wght@400;500;600;700&display=swap');\n\n#calaiUniverse{\n  \/* ---- brand tokens pulled from the CALAI banner ---- *\/\n  --cx-bg:#04060e;\n  --cx-bg2:#0a1024;\n  --cx-orange:#ff6a1f;\n  --cx-amber:#ffc23d;\n  --cx-blue:#2b7bff;\n  --cx-cyan:#3ad2ff;\n  --cx-ink:#eaf2ff;\n  --cx-dim:#c4d3ef;\n  --cx-glass:rgba(14,22,46,.42);\n  --cx-line:rgba(120,170,255,.18);\n  --cx-shadow:0 30px 80px -30px rgba(0,0,0,.85);\n\n  position:relative;\n  height:100vh;\n  min-height:640px;\n  overflow-x:hidden;\n  overflow-y:auto;\n  background:var(--cx-bg);\n  color:var(--cx-ink);\n  font-family:'Rajdhani',sans-serif;\n  -webkit-font-smoothing:antialiased;\n  scroll-behavior:smooth;\n  isolation:isolate;\n}\n#calaiUniverse *,#calaiUniverse *::before,#calaiUniverse *::after{box-sizing:border-box;margin:0;padding:0}\n#calaiUniverse::-webkit-scrollbar{width:9px}\n#calaiUniverse::-webkit-scrollbar-track{background:#05070f}\n#calaiUniverse::-webkit-scrollbar-thumb{background:linear-gradient(var(--cx-blue),var(--cx-cyan));border-radius:20px}\n\n\/* ============ STAGE (pinned background layer) ============ *\/\n#calaiUniverse .cx-stage{\n  position:sticky;top:0;left:0;\n  height:100vh;width:100%;\n  overflow:hidden;\n  background:\n    radial-gradient(1300px 880px at 6% 112%, rgba(255,116,26,.62), transparent 58%),\n    radial-gradient(950px 760px at 24% 92%,  rgba(255,184,44,.40), transparent 55%),\n    radial-gradient(1200px 940px at 96% -10%, rgba(38,108,255,.66), transparent 60%),\n    radial-gradient(820px 820px at 72% 26%,  rgba(58,168,255,.26), transparent 65%),\n    linear-gradient(122deg,#23100a 0%,#2a1216 26%,#0e1638 60%,#0a1f54 100%);\n}\n#calaiUniverse .cx-webgl{position:absolute;inset:0;width:100%;height:100%;display:block}\n\n\/* film grain + vignette *\/\n#calaiUniverse .cx-grain{\n  position:absolute;inset:-50%;pointer-events:none;opacity:.06;mix-blend-mode:overlay;\n  background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'\/%3E%3C\/svg%3E\");\n  animation:cx-grain 1.1s steps(3) infinite;\n}\n@keyframes cx-grain{0%{transform:translate(0,0)}50%{transform:translate(-3%,2%)}100%{transform:translate(2%,-2%)}}\n#calaiUniverse .cx-vignette{\n  position:absolute;inset:0;pointer-events:none;\n  background:radial-gradient(125% 125% at 50% 42%,transparent 60%,rgba(5,9,26,.62) 100%);\n}\n#calaiUniverse .cx-scan{\n  position:absolute;inset:0;pointer-events:none;opacity:.4;\n  background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(0,0,0,.10) 2px 4px);\n  mix-blend-mode:multiply;\n}\n\n\/* HUD corner brackets *\/\n#calaiUniverse .cx-bracket{position:absolute;width:54px;height:54px;border:1px solid rgba(58,210,255,.4);pointer-events:none;z-index:5;opacity:.55}\n#calaiUniverse .cx-bracket.tl{top:22px;left:22px;border-right:0;border-bottom:0}\n#calaiUniverse .cx-bracket.tr{top:22px;right:22px;border-left:0;border-bottom:0}\n#calaiUniverse .cx-bracket.bl{bottom:22px;left:22px;border-right:0;border-top:0}\n#calaiUniverse .cx-bracket.br{bottom:22px;right:22px;border-left:0;border-top:0}\n\n\/* ============ CUSTOM CURSOR ============ *\/\n#calaiUniverse .cx-cursor,#calaiUniverse .cx-ring{position:fixed;top:0;left:0;border-radius:50%;pointer-events:none;z-index:9999;opacity:0;transition:opacity .3s}\n#calaiUniverse .cx-cursor{width:7px;height:7px;background:var(--cx-cyan);box-shadow:0 0 12px var(--cx-cyan),0 0 4px #fff;transform:translate(-50%,-50%)}\n#calaiUniverse .cx-ring{width:34px;height:34px;border:1px solid rgba(58,210,255,.55);transform:translate(-50%,-50%)}\n#calaiUniverse.cx-cursor-on .cx-cursor,#calaiUniverse.cx-cursor-on .cx-ring{opacity:1}\n\n\/* ============ CONTENT (overlays the stage) ============ *\/\n#calaiUniverse .cx-content{position:relative;z-index:3;margin-top:-100vh}\n#calaiUniverse section{position:relative}\n\n\/* ---- top announcement bar ---- *\/\n#calaiUniverse .cx-topbar{\n  position:fixed;top:0;left:0;right:0;z-index:40;\n  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;\n  background:linear-gradient(90deg,#ff8a1e,#ff5e0f);\n  color:#fff;font-family:'Chakra Petch';font-weight:600;\n  font-size:13px;letter-spacing:.12em;text-transform:uppercase;text-align:center;\n  padding:9px 18px;box-shadow:0 8px 22px -10px rgba(255,90,15,.7);\n}\n#calaiUniverse .cx-topbar b{font-weight:700}\n#calaiUniverse .cx-topbar .ping{width:8px;height:8px;border-radius:50%;background:#fff;animation:cx-tping 1.6s infinite}\n@keyframes cx-tping{0%{box-shadow:0 0 0 0 rgba(255,255,255,.65)}70%{box-shadow:0 0 0 8px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}\n@media(max-width:560px){#calaiUniverse .cx-topbar{font-size:11px;letter-spacing:.06em;padding:8px 12px}}\n\n\/* ---- top screen wrapper (nav + hero fill one viewport) ---- *\/\n#calaiUniverse .cx-top{min-height:100vh;display:flex;flex-direction:column}\n\n\/* ---- top HUD nav ---- *\/\n#calaiUniverse .cx-nav{\n  position:relative;z-index:20;flex:none;\n  display:flex;align-items:center;justify-content:space-between;\n  padding:44px clamp(22px,5vw,64px) 0;\n}\n#calaiUniverse .cx-brand{\n  display:inline-flex;align-items:center;justify-content:center;\n  padding:8px 16px;\n}\n#calaiUniverse .cx-brand img{display:block;width:150px;height:auto;max-width:150px;object-fit:contain}\n#calaiUniverse .cx-mark{\n  width:34px;height:34px;display:grid;place-items:center;border-radius:9px;\n  font-family:'Orbitron';font-weight:900;font-size:13px;color:#05070f;\n  background:linear-gradient(135deg,var(--cx-amber),var(--cx-orange));\n  box-shadow:0 0 22px rgba(255,160,50,.55);\n}\n#calaiUniverse .cx-brand b{font-family:'Orbitron';font-weight:700;font-size:18px}\n#calaiUniverse .cx-brand span{font-size:11px;color:var(--cx-dim);letter-spacing:.3em}\n#calaiUniverse .cx-links{display:flex;gap:30px;font-family:'Chakra Petch';font-size:13px;letter-spacing:.16em;text-transform:uppercase}\n#calaiUniverse .cx-links a{color:#f3f7ff;text-decoration:none;position:relative;transition:color .3s;text-shadow:0 1px 8px rgba(0,0,0,.45)}\n#calaiUniverse .cx-links a::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--cx-cyan);transition:width .35s}\n#calaiUniverse .cx-links a:hover{color:var(--cx-ink)}#calaiUniverse .cx-links a:hover::after{width:100%}\n#calaiUniverse .cx-status{display:flex;align-items:center;gap:8px;font-family:'Chakra Petch';font-size:11px;letter-spacing:.2em;color:var(--cx-cyan)}\n#calaiUniverse .cx-dot{width:8px;height:8px;border-radius:50%;background:var(--cx-cyan);box-shadow:0 0 10px var(--cx-cyan);animation:cx-pulse 1.6s infinite}\n@keyframes cx-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}\n@media(max-width:820px){#calaiUniverse .cx-links,#calaiUniverse .cx-status{display:none}}\n\n\/* ---- HERO ---- *\/\n#calaiUniverse .cx-hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,5vh,60px) clamp(22px,7vw,110px) clamp(60px,8vh,110px)}\n#calaiUniverse .cx-eyebrow{\n  display:inline-flex;align-items:center;gap:10px;align-self:flex-start;\n  font-family:'Chakra Petch';font-size:12px;letter-spacing:.32em;text-transform:uppercase;\n  color:var(--cx-amber);padding:7px 16px;border:1px solid var(--cx-line);border-radius:40px;\n  background:var(--cx-glass);backdrop-filter:blur(8px);margin-bottom:26px;\n}\n#calaiUniverse .cx-eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--cx-amber);box-shadow:0 0 10px var(--cx-amber)}\n#calaiUniverse .cx-h1{\n  font-family:'Orbitron';font-weight:900;line-height:.98;letter-spacing:-.01em;\n  text-transform:uppercase;display:flex;flex-direction:column;gap:6px;\n}\n#calaiUniverse .cx-h1 .cx-pre{font-family:'Chakra Petch';font-weight:700;font-size:clamp(15px,2.3vw,30px);letter-spacing:.24em;color:#fff}\n#calaiUniverse .cx-h1 .grad{\n  font-size:clamp(40px,8.2vw,112px);line-height:.94;\n  background:linear-gradient(96deg,#ff8a1e 0%,#ffc23d 23%,#ffe9b0 39%,#8fe9ff 55%,#3ad2ff 72%,#2b7bff 100%);\n  background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;\n  filter:drop-shadow(0 0 22px rgba(255,150,40,.4)) drop-shadow(0 0 34px rgba(58,180,255,.45));animation:cx-flow 9s ease-in-out infinite;\n}\n#calaiUniverse .cx-h1 .cx-ai{font-size:clamp(20px,3.7vw,52px);color:var(--cx-ink);line-height:1}\n#calaiUniverse .cx-calai{display:inline-flex;align-items:center;gap:16px;align-self:flex-start;margin-top:16px}\n#calaiUniverse .cx-calai .bar{width:46px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--cx-amber),var(--cx-orange));box-shadow:0 0 14px rgba(255,150,40,.55)}\n#calaiUniverse .cx-calai span{font-family:'Orbitron';font-weight:900;font-size:clamp(28px,4.4vw,60px);letter-spacing:.22em;background:linear-gradient(120deg,var(--cx-amber),#ff9b2e 55%,var(--cx-orange));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(255,150,40,.38))}\n@keyframes cx-flow{0%,100%{background-position:0 0}50%{background-position:100% 0}}\n#calaiUniverse .cx-sub{max-width:620px;margin-top:26px;font-size:clamp(16px,1.7vw,20px);line-height:1.55;color:var(--cx-dim);font-weight:500}\n#calaiUniverse .cx-sub b{color:var(--cx-ink);font-weight:600}\n#calaiUniverse .cx-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:38px}\n#calaiUniverse .cx-btn{\n  font-family:'Chakra Petch';font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;\n  padding:15px 30px;border-radius:12px;cursor:pointer;border:1px solid transparent;\n  display:inline-flex;align-items:center;gap:10px;transition:transform .25s,box-shadow .35s;text-decoration:none;\n}\n#calaiUniverse .cx-btn.primary{color:#070a14;background:linear-gradient(120deg,var(--cx-amber),var(--cx-orange));box-shadow:0 0 0 rgba(255,150,40,0)}\n#calaiUniverse .cx-btn.primary:hover{transform:translateY(-3px);box-shadow:0 14px 40px -10px rgba(255,140,40,.75)}\n#calaiUniverse .cx-btn.ghost{color:var(--cx-ink);border-color:var(--cx-line);background:var(--cx-glass);backdrop-filter:blur(8px)}\n#calaiUniverse .cx-btn.ghost:hover{transform:translateY(-3px);border-color:var(--cx-cyan);box-shadow:0 0 30px -6px rgba(58,210,255,.5)}\n#calaiUniverse .cx-chips{display:flex;flex-wrap:wrap;gap:14px;margin-top:48px}\n#calaiUniverse .cx-chip{\n  font-family:'Chakra Petch';padding:12px 18px;border-radius:12px;border:1px solid var(--cx-line);\n  background:var(--cx-glass);backdrop-filter:blur(10px);min-width:120px;will-change:transform;\n}\n#calaiUniverse .cx-chip b{display:block;font-family:'Orbitron';font-size:22px;color:var(--cx-ink)}\n#calaiUniverse .cx-chip span{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--cx-dim)}\n#calaiUniverse .cx-scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--cx-dim);font-family:'Chakra Petch';font-size:10px;letter-spacing:.3em}\n#calaiUniverse .cx-scroll-hint i{width:1px;height:38px;background:linear-gradient(var(--cx-cyan),transparent);animation:cx-fall 1.8s infinite}\n@keyframes cx-fall{0%{transform:scaleY(0);transform-origin:top}40%{transform:scaleY(1);transform-origin:top}60%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}\n\n\/* ---- section heading ---- *\/\n#calaiUniverse .cx-shell{padding:clamp(80px,12vh,140px) clamp(22px,7vw,110px)}\n#calaiUniverse .cx-tag{font-family:'Chakra Petch';font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:var(--cx-cyan)}\n#calaiUniverse .cx-htitle{font-family:'Orbitron';font-weight:700;font-size:clamp(30px,4.4vw,56px);text-transform:uppercase;margin-top:14px;line-height:1.04}\n#calaiUniverse .cx-htitle em{font-style:normal;color:var(--cx-amber)}\n#calaiUniverse .cx-hdesc{color:var(--cx-dim);max-width:560px;margin-top:16px;font-size:17px}\n\n\/* ---- program cards ---- *\/\n#calaiUniverse .cx-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:22px;margin-top:54px}\n#calaiUniverse .cx-card{\n  position:relative;padding:30px 28px 28px;border-radius:20px;\n  background:linear-gradient(160deg,rgba(20,30,60,.55),rgba(8,12,28,.5));\n  border:1px solid var(--cx-line);backdrop-filter:blur(16px);\n  transform-style:preserve-3d;transition:box-shadow .4s,border-color .4s;\n  box-shadow:var(--cx-shadow);overflow:hidden;will-change:transform;\n}\n#calaiUniverse .cx-card::before{\n  content:'';position:absolute;inset:0;border-radius:20px;padding:1px;pointer-events:none;\n  background:linear-gradient(140deg,rgba(58,210,255,.55),transparent 40%,transparent 70%,rgba(255,150,40,.5));\n  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;\n  opacity:0;transition:opacity .4s;\n}\n#calaiUniverse .cx-card:hover::before{opacity:1}\n#calaiUniverse .cx-card:hover{border-color:transparent;box-shadow:0 40px 80px -30px rgba(58,140,255,.6)}\n#calaiUniverse .cx-card .glow{position:absolute;width:200px;height:200px;border-radius:50%;filter:blur(60px);opacity:0;transition:opacity .5s;top:-60px;right:-40px;background:var(--cx-blue)}\n#calaiUniverse .cx-card:hover .glow{opacity:.5}\n#calaiUniverse .cx-pid{font-family:'Orbitron';font-size:12px;letter-spacing:.2em;color:var(--cx-dim)}\n#calaiUniverse .cx-ico{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;margin:18px 0 20px;border:1px solid var(--cx-line);background:rgba(58,210,255,.06);color:var(--cx-cyan)}\n#calaiUniverse .cx-ico svg{width:26px;height:26px}\n#calaiUniverse .cx-ctitle{font-family:'Chakra Petch';font-weight:700;font-size:21px;letter-spacing:.02em}\n#calaiUniverse .cx-dur{display:inline-block;margin-top:10px;font-family:'Chakra Petch';font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cx-amber);padding:4px 11px;border:1px solid rgba(255,194,61,.3);border-radius:30px}\n#calaiUniverse .cx-cdesc{margin-top:14px;color:var(--cx-dim);font-size:15px;line-height:1.55}\n#calaiUniverse .cx-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}\n#calaiUniverse .cx-tags span{font-family:'Chakra Petch';font-size:11px;letter-spacing:.06em;color:var(--cx-ink);padding:4px 10px;border-radius:7px;background:rgba(120,170,255,.1);border:1px solid var(--cx-line)}\n#calaiUniverse .cx-cbtn{margin-top:22px;font-family:'Chakra Petch';font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cx-cyan);display:inline-flex;align-items:center;gap:8px;transition:gap .3s}\n#calaiUniverse .cx-card:hover .cx-cbtn{gap:14px}\n\n\/* ---- connect ---- *\/\n#calaiUniverse .cx-connect-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:50px}\n#calaiUniverse .cx-node{\n  padding:30px 26px;border-radius:18px;border:1px solid var(--cx-line);\n  background:var(--cx-glass);backdrop-filter:blur(14px);transition:transform .35s,box-shadow .35s,border-color .35s;\n}\n#calaiUniverse .cx-node:hover{transform:translateY(-6px);border-color:var(--cx-cyan);box-shadow:0 30px 60px -28px rgba(58,210,255,.55)}\n#calaiUniverse .cx-node .k{font-family:'Chakra Petch';font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cx-dim)}\n#calaiUniverse .cx-node .v{font-family:'Orbitron';font-size:19px;margin-top:10px;color:var(--cx-ink);word-break:break-word}\n#calaiUniverse .cx-node .x{margin-top:8px;color:var(--cx-dim);font-size:14px;line-height:1.5}\n#calaiUniverse .cx-footer{margin-top:70px;padding-top:26px;border-top:1px solid var(--cx-line);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;color:var(--cx-dim);font-family:'Chakra Petch';font-size:12px;letter-spacing:.1em}\n\n\/* ---- reveal animation ---- *\/\n#calaiUniverse .cx-rv{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}\n#calaiUniverse .cx-rv.cx-in{opacity:1;transform:none}\n\n\/* ---- sticky admissions box ---- *\/\n#calaiUniverse .cx-admit{\n  position:fixed;right:20px;top:50%;transform:translateY(-50%);\n  width:236px;z-index:55;font-family:'Rajdhani',sans-serif;\n  padding:20px 20px 22px;border-radius:18px;\n  background:linear-gradient(140deg,#ff9b2e 0%,#ff6a1f 52%,#f1500a 100%);\n  box-shadow:0 22px 55px -16px rgba(255,90,15,.7),0 0 0 1px rgba(255,210,140,.45) inset;\n  animation:cx-afloat 5s ease-in-out infinite;\n}\n#calaiUniverse .cx-admit::after{content:'';position:absolute;inset:0;border-radius:18px;pointer-events:none;box-shadow:0 0 38px rgba(255,140,40,.55);opacity:.6;animation:cx-aglow 2.6s ease-in-out infinite}\n@keyframes cx-afloat{0%,100%{transform:translateY(-50%)}50%{transform:translateY(calc(-50% - 9px))}}\n@keyframes cx-aglow{0%,100%{opacity:.35}50%{opacity:.8}}\n#calaiUniverse .cx-admit .tick{position:absolute;width:14px;height:14px;border:1.5px solid rgba(58,20,4,.5);pointer-events:none}\n#calaiUniverse .cx-admit .t1{top:8px;left:8px;border-right:0;border-bottom:0}\n#calaiUniverse .cx-admit .t2{top:8px;right:8px;border-left:0;border-bottom:0}\n#calaiUniverse .cx-admit .t3{bottom:8px;left:8px;border-right:0;border-top:0}\n#calaiUniverse .cx-admit .t4{bottom:8px;right:8px;border-left:0;border-top:0}\n#calaiUniverse .cx-admit .live{display:inline-flex;align-items:center;gap:7px;font-family:'Chakra Petch';font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#3a1404;background:rgba(255,234,190,.55);padding:5px 11px;border-radius:30px}\n#calaiUniverse .cx-admit .live b{width:7px;height:7px;border-radius:50%;background:#3a1404;animation:cx-blip 1.5s infinite}\n@keyframes cx-blip{0%{box-shadow:0 0 0 0 rgba(58,20,4,.55)}70%{box-shadow:0 0 0 7px rgba(58,20,4,0)}100%{box-shadow:0 0 0 0 rgba(58,20,4,0)}}\n#calaiUniverse .cx-admit h4{font-family:'Orbitron';font-weight:900;font-size:21px;line-height:1.05;color:#2a0f02;margin-top:14px;text-transform:uppercase}\n#calaiUniverse .cx-admit .sub{font-family:'Chakra Petch';font-weight:600;font-size:12.5px;letter-spacing:.04em;color:#5a2a08;margin-top:6px}\n#calaiUniverse .cx-admit .num{display:flex;align-items:center;gap:9px;margin-top:15px;padding-top:14px;border-top:1px dashed rgba(58,20,4,.35)}\n#calaiUniverse .cx-admit .num svg{width:18px;height:18px;color:#2a0f02;flex:none}\n#calaiUniverse .cx-admit .num span{font-family:'Orbitron';font-weight:700;font-size:19px;color:#fff;text-shadow:0 1px 6px rgba(120,40,0,.5)}\n#calaiUniverse .cx-admit .cx-wa{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:16px;text-decoration:none;font-family:'Chakra Petch';font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:linear-gradient(120deg,#25d366,#128c7e);padding:13px 14px;border-radius:12px;box-shadow:0 8px 22px -8px rgba(18,140,90,.85);transition:transform .25s,box-shadow .3s}\n#calaiUniverse .cx-admit .cx-wa:hover{transform:translateY(-2px);box-shadow:0 12px 28px -8px rgba(37,211,102,.8)}\n#calaiUniverse .cx-admit .cx-wa svg{width:17px;height:17px}\n#calaiUniverse .cx-admit .seats{margin-top:11px;text-align:center;font-family:'Chakra Petch';font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#5a2a08}\n@media(max-width:560px){#calaiUniverse .cx-admit{width:240px;right:10px;padding:15px}}\n\n\/* ---- boot loader ---- *\/\n#calaiUniverse .cx-boot{position:absolute;inset:0;z-index:60;display:grid;place-items:center;background:#04060e;transition:opacity .8s;will-change:opacity}\n#calaiUniverse .cx-boot.done{opacity:0;pointer-events:none}\n#calaiUniverse .cx-boot .core{text-align:center}\n#calaiUniverse .cx-boot .ring{width:120px;height:120px;border-radius:50%;border:2px solid rgba(58,210,255,.15);border-top-color:var(--cx-cyan);border-right-color:var(--cx-amber);margin:0 auto 26px;animation:cx-spin 1s linear infinite}\n@keyframes cx-spin{to{transform:rotate(360deg)}}\n#calaiUniverse .cx-boot .pct{font-family:'Orbitron';font-weight:900;font-size:38px;background:linear-gradient(120deg,var(--cx-amber),var(--cx-cyan));-webkit-background-clip:text;background-clip:text;color:transparent}\n#calaiUniverse .cx-boot .lbl{font-family:'Chakra Petch';font-size:11px;letter-spacing:.4em;color:var(--cx-dim);margin-top:8px;text-transform:uppercase}\n\n@media (prefers-reduced-motion:reduce){#calaiUniverse *{animation-duration:.001s!important;transition-duration:.2s!important}}\n\n#calaiUniverse .cx-admit{\n  position:fixed;\n  right:20px;\n  top:70%\n}\n<\/style>\n\n\n<div id=\"calaiUniverse\">\n\n  <!-- ===== top announcement bar ===== -->\n  <div class=\"cx-topbar\">\n    <span class=\"ping\"><\/span>\n    <span>Fresh Batch Starting <b>1st July<\/b> \u2014 Enroll Now<\/span>\n  <\/div>\n\n  <!-- ===== pinned background stage ===== -->\n  <div class=\"cx-stage\">\n    <canvas class=\"cx-webgl\"><\/canvas>\n    <div class=\"cx-scan\"><\/div>\n    <div class=\"cx-grain\"><\/div>\n    <div class=\"cx-vignette\"><\/div>\n    <div class=\"cx-bracket tl\"><\/div><div class=\"cx-bracket tr\"><\/div>\n    <div class=\"cx-bracket bl\"><\/div><div class=\"cx-bracket br\"><\/div>\n  <\/div>\n\n  <!-- cursor -->\n  <div class=\"cx-ring\"><\/div>\n  <div class=\"cx-cursor\"><\/div>\n\n  <!-- ===== content overlay ===== -->\n  <div class=\"cx-content\">\n\n   <div class=\"cx-top\">\n    <!-- HUD nav -->\n    <nav class=\"cx-nav\">\n      <div class=\"cx-brand\">\n        <img decoding=\"async\" src=\"https:\/\/calai.com.pk\/wp-content\/uploads\/2026\/06\/Cal-Logo-Transparent.png\" alt=\"CAL AI Logo\">\n      <\/div>\n      <div class=\"cx-links\">\n        <a href=\"#cx-programs\">Programs<\/a>\n        <a href=\"#cx-protocol\">Protocol<\/a>\n        <a href=\"#cx-connect\">Connect<\/a>\n      <\/div>\n    <\/nav>\n\n    <!-- HERO -->\n    <section class=\"cx-hero\">\n      <span class=\"cx-eyebrow\">Step into the Learning Universe<\/span>\n      <h1 class=\"cx-h1\">\n        <span class=\"cx-pre\">Center for<\/span>\n        <span class=\"grad\">Advanced Learning<\/span>\n        <span class=\"cx-ai\">&amp; Artificial Intelligence<\/span>\n      <\/h1>\n      <div class=\"cx-calai\"><i class=\"bar\"><\/i><span>CALAI<\/span><\/div>\n      <p class=\"cx-sub\">Four immersive programs engineered to launch you from <b>absolute beginner<\/b> into the worlds of computing, design and <b>artificial intelligence<\/b> \u2014 hands-on, future-ready, built in Lahore.<\/p>\n      <div class=\"cx-cta\">\n        <a href=\"#cx-connect\" class=\"cx-btn primary\">Initialize Enrollment \u2192<\/a>\n        <a href=\"#cx-programs\" class=\"cx-btn ghost\">Explore Programs<\/a>\n      <\/div>\n      <div class=\"cx-chips\">\n        <div class=\"cx-chip\" data-depth=\"22\"><b>04<\/b><span>Programs<\/span><\/div>\n        <div class=\"cx-chip\" data-depth=\"34\"><b>08<\/b><span>Weeks Each<\/span><\/div>\n        <div class=\"cx-chip\" data-depth=\"46\"><b>100%<\/b><span>Hands-On<\/span><\/div>\n      <\/div>\n      <div class=\"cx-scroll-hint\">SCROLL<i><\/i><\/div>\n    <\/section>\n   <\/div><!-- \/cx-top -->\n\n    <!-- PROGRAMS -->\n    <section class=\"cx-shell\" id=\"cx-programs\">\n      <div class=\"cx-rv\"><div class=\"cx-tag\">\/\/ PROGRAM MATRIX<\/div>\n      <h2 class=\"cx-htitle\">Choose your <em>trajectory<\/em><\/h2>\n      <p class=\"cx-hdesc\">Each track runs two months. Modular, project-driven, and designed to stack \u2014 start anywhere, level up everywhere.<\/p><\/div>\n\n      <div class=\"cx-grid\">\n        <article class=\"cx-card cx-rv\" data-tilt>\n          <div class=\"glow\"><\/div>\n          <div class=\"cx-pid\">P-01<\/div>\n          <div class=\"cx-ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"12\" rx=\"2\"\/><path d=\"M8 20h8M12 16v4\"\/><\/svg><\/div>\n          <h3 class=\"cx-ctitle\">Computer for Beginners<\/h3>\n          <span class=\"cx-dur\">2 Months<\/span>\n          <p class=\"cx-cdesc\">Boot up from zero. Master hardware, OS navigation, files and the digital fundamentals every modern path demands.<\/p>\n          <div class=\"cx-tags\"><span>Hardware<\/span><span>Windows<\/span><span>Internet<\/span><\/div>\n          <div class=\"cx-cbtn\">Initialize \u2192<\/div>\n        <\/article>\n\n        <article class=\"cx-card cx-rv\" data-tilt>\n          <div class=\"glow\" style=\"background:var(--cx-amber)\"><\/div>\n          <div class=\"cx-pid\">P-02<\/div>\n          <div class=\"cx-ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><rect x=\"4\" y=\"3\" width=\"16\" height=\"18\" rx=\"2\"\/><path d=\"M8 8h8M8 12h8M8 16h5\"\/><\/svg><\/div>\n          <h3 class=\"cx-ctitle\">Microsoft Office<\/h3>\n          <span class=\"cx-dur\">2 Months<\/span>\n          <p class=\"cx-cdesc\">Command Word, Excel &amp; PowerPoint to produce pro-grade documents, data sheets and presentations with confidence.<\/p>\n          <div class=\"cx-tags\"><span>Word<\/span><span>Excel<\/span><span>PowerPoint<\/span><\/div>\n          <div class=\"cx-cbtn\">Initialize \u2192<\/div>\n        <\/article>\n\n        <article class=\"cx-card cx-rv\" data-tilt>\n          <div class=\"glow\" style=\"background:var(--cx-cyan)\"><\/div>\n          <div class=\"cx-pid\">P-03<\/div>\n          <div class=\"cx-ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M8 8l-4 4 4 4M16 8l4 4-4 4M14 5l-4 14\"\/><\/svg><\/div>\n          <h3 class=\"cx-ctitle\">Web Development<\/h3>\n          <span class=\"cx-dur\">2 Months<\/span>\n          <p class=\"cx-cdesc\">Build living interfaces with HTML, CSS &amp; JavaScript. Ship responsive websites from first concept to deployment.<\/p>\n          <div class=\"cx-tags\"><span>HTML<\/span><span>CSS<\/span><span>JavaScript<\/span><\/div>\n          <div class=\"cx-cbtn\">Initialize \u2192<\/div>\n        <\/article>\n\n        <article class=\"cx-card cx-rv\" data-tilt>\n          <div class=\"glow\" style=\"background:var(--cx-orange)\"><\/div>\n          <div class=\"cx-pid\">P-04<\/div>\n          <div class=\"cx-ico\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\"><path d=\"M12 3a4 4 0 0 0-4 4 3 3 0 0 0-1 5 3 3 0 0 0 2 5 3 3 0 0 0 6 0 3 3 0 0 0 2-5 3 3 0 0 0-1-5 4 4 0 0 0-4-4Z\"\/><path d=\"M12 7v10\"\/><\/svg><\/div>\n          <h3 class=\"cx-ctitle\">Introduction to AI<\/h3>\n          <span class=\"cx-dur\">2 Months<\/span>\n          <p class=\"cx-cdesc\">Decode machine intelligence \u2014 prompts, models and real tools shaping tomorrow's workflows and careers.<\/p>\n          <div class=\"cx-tags\"><span>AI<\/span><span>Prompts<\/span><span>Tools<\/span><\/div>\n          <div class=\"cx-cbtn\">Initialize \u2192<\/div>\n        <\/article>\n      <\/div>\n    <\/section>\n\n    <!-- PROTOCOL \/ why -->\n    <section class=\"cx-shell\" id=\"cx-protocol\" style=\"padding-top:0\">\n      <div class=\"cx-rv\"><div class=\"cx-tag\">\/\/ THE CALAI PROTOCOL<\/div>\n      <h2 class=\"cx-htitle\">Learning, <em>re-engineered<\/em><\/h2><\/div>\n      <div class=\"cx-grid\" style=\"margin-top:40px\">\n        <div class=\"cx-node cx-rv\"><div class=\"k\">01 \u00b7 Practical Core<\/div><div class=\"x\" style=\"margin-top:14px\">Every session is built around real projects, not theory dumps \u2014 you leave with work you can show.<\/div><\/div>\n        <div class=\"cx-node cx-rv\"><div class=\"k\">02 \u00b7 Future Stack<\/div><div class=\"x\" style=\"margin-top:14px\">Curriculum tuned to where the industry is heading, with AI literacy woven through every track.<\/div><\/div>\n        <div class=\"cx-node cx-rv\"><div class=\"k\">03 \u00b7 Small Squads<\/div><div class=\"x\" style=\"margin-top:14px\">Focused class sizes mean real attention, real feedback, and real momentum from day one.<\/div><\/div>\n      <\/div>\n    <\/section>\n\n    <!-- CONNECT -->\n    <section class=\"cx-shell\" id=\"cx-connect\" style=\"padding-top:0\">\n      <div class=\"cx-rv\"><div class=\"cx-tag\">\/\/ ESTABLISH CONNECTION<\/div>\n      <h2 class=\"cx-htitle\">Begin your <em>uplink<\/em><\/h2>\n      <p class=\"cx-hdesc\">Reach the CALAI control center \u2014 enrollment is open now.<\/p><\/div>\n\n      <div class=\"cx-connect-grid\">\n        <a class=\"cx-node cx-rv\" href=\"tel:03314579715\" style=\"text-decoration:none;display:block\">\n          <div class=\"k\">Call \u00b7 Direct Line<\/div><div class=\"v\">0331 4579715<\/div><div class=\"x\">Speak with our enrollment team.<\/div>\n        <\/a>\n        <a class=\"cx-node cx-rv\" href=\"https:\/\/calai.com.pk\" target=\"_blank\" rel=\"noopener\" style=\"text-decoration:none;display:block\">\n          <div class=\"k\">Web \u00b7 Portal<\/div><div class=\"v\">calai.com.pk<\/div><div class=\"x\">Programs, schedules &amp; sign-up.<\/div>\n        <\/a>\n        <div class=\"cx-node cx-rv\">\n          <div class=\"k\">Locate \u00b7 Campus<\/div><div class=\"v\" style=\"font-size:16px;line-height:1.4\">Eden Boulevard<\/div><div class=\"x\">Building #10\/1, First Floor,<br>College Road, Lahore.<\/div>\n        <\/div>\n      <\/div>\n\n      <div class=\"cx-footer\">\n        <span>\u00a9 CALAI \u00b7 Center for Advanced Learning &amp; Artificial Intelligence<\/span>\n        <span>All Rights Reserved<\/span>\n      <\/div>\n    <\/section>\n\n  <\/div>\n\n  <!-- sticky admissions box -->\n  <aside class=\"cx-admit\">\n    <span class=\"tick t1\"><\/span><span class=\"tick t2\"><\/span><span class=\"tick t3\"><\/span><span class=\"tick t4\"><\/span>\n    <span class=\"live\"><b><\/b> Admissions Open<\/span>\n    <h4>New Batch<br>Enrolling<\/h4>\n    <div class=\"sub\">Limited seats \u00b7 Starts soon<\/div>\n    <div class=\"num\">\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 5c0 9 7 16 16 16l2-3-4-2-2 2a14 14 0 0 1-6-6l2-2-2-4-3 2Z\"\/><\/svg>\n      <span>0331 4579715<\/span>\n    <\/div>\n    <a class=\"cx-wa\" href=\"https:\/\/wa.me\/923314579715?text=Assalam%20o%20Alaikum%2C%20I'm%20interested%20in%20CALAI%20admissions%20for%20the%20new%20batch.\" target=\"_blank\" rel=\"noopener\">\n      <svg viewBox=\"0 0 32 32\" fill=\"currentColor\"><path d=\"M16 .4C7.4.4.5 7.3.5 15.9c0 2.8.7 5.4 2 7.7L.4 31.6l8.2-2.1c2.2 1.2 4.8 1.9 7.4 1.9 8.6 0 15.5-6.9 15.5-15.5S24.6.4 16 .4zm0 28.3c-2.4 0-4.6-.6-6.5-1.8l-.5-.3-4.8 1.3 1.3-4.7-.3-.5c-1.3-2-2-4.4-2-6.9C3.4 8.9 9 3.3 16 3.3S28.6 8.9 28.6 15.9 23 28.7 16 28.7zm8.6-9.4c-.5-.2-2.8-1.4-3.2-1.5-.4-.2-.7-.2-1 .2-.3.5-1.1 1.5-1.4 1.7-.3.2-.5.3-1 .1-.5-.2-2-.7-3.8-2.3-1.4-1.3-2.4-2.8-2.6-3.3-.3-.5 0-.7.2-1 .2-.2.5-.5.7-.8.2-.3.3-.5.5-.8.2-.3.1-.6 0-.8-.1-.2-1-2.5-1.4-3.4-.4-.9-.7-.8-1-.8h-.8c-.3 0-.8.1-1.2.6-.4.5-1.6 1.5-1.6 3.8s1.6 4.4 1.9 4.7c.2.3 3.2 4.9 7.7 6.8 1.1.5 1.9.7 2.6.9 1.1.3 2 .3 2.8.2.9-.1 2.8-1.1 3.2-2.2.4-1.1.4-2 .3-2.2-.1-.2-.4-.3-.9-.5z\"\/><\/svg>\n      WhatsApp Now\n    <\/a>\n    <div class=\"seats\">\u2014 Reserve your spot \u2014<\/div>\n  <\/aside>\n\n  <!-- boot loader -->\n  <div class=\"cx-boot\">\n    <div class=\"core\">\n      <div class=\"ring\"><\/div>\n      <div class=\"pct\">0%<\/div>\n      <div class=\"lbl\">Initializing CALAI Universe<\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n\n<script>\n(function(){\n  var root = document.getElementById('calaiUniverse');\n  if(!root || root.dataset.cxInit) return;\n  root.dataset.cxInit = '1';\n\n  var reduce = window.matchMedia && matchMedia('(prefers-reduced-motion: reduce)').matches;\n  var pointer = {x:0, y:0, tx:0, ty:0};\n\n  \/* ---------- boot loader ---------- *\/\n  var boot = root.querySelector('.cx-boot'),\n      pctEl = boot.querySelector('.pct'),\n      pct = 0;\n  var bootTimer = setInterval(function(){\n    pct += Math.random()*16 + 6;\n    if(pct >= 100){ pct = 100; clearInterval(bootTimer);\n      setTimeout(function(){ boot.classList.add('done'); }, 350);\n    }\n    pctEl.textContent = Math.floor(pct) + '%';\n  }, 130);\n\n  \/* ---------- custom cursor ---------- *\/\n  var cur = root.querySelector('.cx-cursor'),\n      ring = root.querySelector('.cx-ring'),\n      cx = 0, cy = 0, rx = 0, ry = 0,\n      touch = matchMedia('(hover:none)').matches;\n  if(!touch){\n    root.addEventListener('pointerenter', function(){ root.classList.add('cx-cursor-on'); });\n    root.addEventListener('pointerleave', function(){ root.classList.remove('cx-cursor-on'); });\n    root.addEventListener('pointermove', function(e){\n      cx = e.clientX; cy = e.clientY;\n      cur.style.transform = 'translate('+cx+'px,'+cy+'px) translate(-50%,-50%)';\n      var r = root.getBoundingClientRect();\n      pointer.tx = ((e.clientX - r.left)\/r.width  - .5) * 2;\n      pointer.ty = ((e.clientY - r.top )\/r.height - .5) * 2;\n    });\n    (function ringLoop(){\n      rx += (cx - rx)*0.18; ry += (cy - ry)*0.18;\n      ring.style.transform = 'translate('+rx+'px,'+ry+'px) translate(-50%,-50%)';\n      requestAnimationFrame(ringLoop);\n    })();\n  }\n\n  \/* ---------- floating chip parallax ---------- *\/\n  var chips = [].slice.call(root.querySelectorAll('.cx-chip'));\n\n  \/* ---------- card 3D tilt ---------- *\/\n  [].slice.call(root.querySelectorAll('[data-tilt]')).forEach(function(card){\n    card.addEventListener('pointermove', function(e){\n      var r = card.getBoundingClientRect();\n      var px = (e.clientX - r.left)\/r.width - .5;\n      var py = (e.clientY - r.top )\/r.height - .5;\n      card.style.transform = 'perspective(900px) rotateX('+(-py*9)+'deg) rotateY('+(px*11)+'deg) translateZ(8px)';\n    });\n    card.addEventListener('pointerleave', function(){\n      card.style.transform = 'perspective(900px) rotateX(0) rotateY(0)';\n    });\n  });\n\n  \/* ---------- reveal on scroll (root is the scroll container) ---------- *\/\n  var io = new IntersectionObserver(function(entries){\n    entries.forEach(function(en){ if(en.isIntersecting){ en.target.classList.add('cx-in'); io.unobserve(en.target); } });\n  }, {root: root, threshold:.14});\n  [].slice.call(root.querySelectorAll('.cx-rv')).forEach(function(el){ io.observe(el); });\n\n  \/* ---------- WebGL particle universe (Three.js, gracefully optional) ---------- *\/\n  function initThree(){\n    if(!window.THREE) return;\n    var canvas = root.querySelector('.cx-webgl');\n    var stage  = root.querySelector('.cx-stage');\n    var W = stage.clientWidth, H = stage.clientHeight;\n\n    var renderer = new THREE.WebGLRenderer({canvas:canvas, antialias:true, alpha:true});\n    renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));\n    renderer.setSize(W, H, false);\n\n    var scene = new THREE.Scene();\n    scene.fog = new THREE.FogExp2(0x04060e, 0.0014);\n    var camera = new THREE.PerspectiveCamera(62, W\/H, 1, 3000);\n    camera.position.set(0, 0, 420);\n\n    var group = new THREE.Group(); scene.add(group);\n\n    \/* soft round sprite *\/\n    var sc = document.createElement('canvas'); sc.width = sc.height = 64;\n    var g = sc.getContext('2d');\n    var grd = g.createRadialGradient(32,32,0,32,32,32);\n    grd.addColorStop(0,'rgba(255,255,255,1)');\n    grd.addColorStop(.25,'rgba(255,255,255,.85)');\n    grd.addColorStop(1,'rgba(255,255,255,0)');\n    g.fillStyle = grd; g.fillRect(0,0,64,64);\n    var sprite = new THREE.CanvasTexture(sc);\n\n    \/* particle nebula *\/\n    var palette = [\n      [0.23,0.48,1.0],[0.23,0.82,1.0],[0.23,0.48,1.0],\n      [1.0,0.42,0.12],[1.0,0.76,0.24],[0.6,0.85,1.0]\n    ];\n    var COUNT = W < 700 ? 1700 : 3200;\n    var pos = new Float32Array(COUNT*3), col = new Float32Array(COUNT*3);\n    for(var i=0;i<COUNT;i++){\n      var r = 120 + Math.pow(Math.random(),0.6)*700;\n      var th = Math.random()*Math.PI*2, ph = Math.acos(2*Math.random()-1);\n      pos[i*3]   = r*Math.sin(ph)*Math.cos(th);\n      pos[i*3+1] = r*Math.sin(ph)*Math.sin(th)*0.7;\n      pos[i*3+2] = r*Math.cos(ph) - 120;\n      var c = palette[(Math.random()*palette.length)|0];\n      col[i*3]=c[0]; col[i*3+1]=c[1]; col[i*3+2]=c[2];\n    }\n    var pg = new THREE.BufferGeometry();\n    pg.setAttribute('position', new THREE.BufferAttribute(pos,3));\n    pg.setAttribute('color', new THREE.BufferAttribute(col,3));\n    var pm = new THREE.PointsMaterial({\n      size:4.4, map:sprite, vertexColors:true, transparent:true,\n      depthWrite:false, blending:THREE.AdditiveBlending, opacity:.92, sizeAttenuation:true\n    });\n    group.add(new THREE.Points(pg, pm));\n\n    \/* abstract wireframe cores *\/\n    function core(radius, color, op){\n      var geo = new THREE.IcosahedronGeometry(radius, 1);\n      var wire = new THREE.WireframeGeometry(geo);\n      var line = new THREE.LineSegments(wire, new THREE.LineBasicMaterial({\n        color:color, transparent:true, opacity:op, blending:THREE.AdditiveBlending, depthWrite:false\n      }));\n      group.add(line); return line;\n    }\n    var coreA = core(150, 0x5ad8ff, .30);\n    var coreB = core(95,  0xff8a3a, .36);\n    var coreC = core(220, 0x3a8cff, .16);\n\n    function resize(){\n      W = stage.clientWidth; H = stage.clientHeight;\n      renderer.setSize(W, H, false);\n      camera.aspect = W\/H; camera.updateProjectionMatrix();\n    }\n    window.addEventListener('resize', resize);\n\n    var t = 0;\n    (function loop(){\n      requestAnimationFrame(loop);\n      t += 0.0035;\n      pointer.x += (pointer.tx - pointer.x)*0.05;\n      pointer.y += (pointer.ty - pointer.y)*0.05;\n\n      if(!reduce){\n        group.rotation.y = t*0.4 + pointer.x*0.35;\n        group.rotation.x = Math.sin(t*0.5)*0.06 + pointer.y*0.22;\n        coreA.rotation.y += 0.0018; coreA.rotation.x += 0.0009;\n        coreB.rotation.y -= 0.0026; coreB.rotation.z += 0.0012;\n        coreC.rotation.x += 0.0006; coreC.rotation.y -= 0.0008;\n      }\n      camera.position.x += (pointer.x*60 - camera.position.x)*0.04;\n      camera.position.y += (-pointer.y*40 - camera.position.y)*0.04;\n\n      \/* parallax depth on hero chips driven by pointer + scroll *\/\n      var sTop = root.scrollTop;\n      for(var k=0;k<chips.length;k++){\n        var d = parseFloat(chips[k].getAttribute('data-depth'))||20;\n        chips[k].style.transform = 'translate('+(pointer.x*d*-0.6)+'px,'+((pointer.y*d*-0.6)-(sTop*0.02))+'px)';\n      }\n      camera.lookAt(0,0,0);\n      renderer.render(scene, camera);\n    })();\n  }\n\n  \/* load Three.js from CDN, then init; CSS gradient mesh stays as fallback if it fails *\/\n  var s = document.createElement('script');\n  s.src = 'https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js';\n  s.onload = initThree;\n  s.onerror = function(){ \/* fallback: animated CSS background already present *\/ };\n  document.head.appendChild(s);\n\n})();\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>Fresh Batch Starting 1st July \u2014 Enroll Now Programs Protocol Connect Step into the Learning Universe Center for Advanced Learning &amp; Artificial Intelligence CALAI Four immersive programs engineered to launch you from absolute beginner into the worlds of computing, design and artificial intelligence \u2014 hands-on, future-ready, built in Lahore. Initialize Enrollment \u2192 Explore Programs 04Programs [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/calai.com.pk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":67,"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":88,"href":"https:\/\/calai.com.pk\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/88"}],"wp:attachment":[{"href":"https:\/\/calai.com.pk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}