{"id":2513,"date":"2026-09-24T14:40:54","date_gmt":"2026-09-24T11:10:54","guid":{"rendered":"https:\/\/webvibe.digital\/home\/"},"modified":"2026-10-14T16:18:57","modified_gmt":"2026-10-14T12:48:57","slug":"home","status":"publish","type":"page","link":"http:\/\/webvibe.digital\/en\/","title":{"rendered":"Ilmora Studio-EN"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2513\" class=\"elementor elementor-2513 elementor-27\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b29b1d1 e-con e-atomic-element e-flexbox-base e-default-div e-8aa2361 \" data-id=\"b29b1d1\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b29b1d1\">\n    \t\t<div class=\"elementor-element elementor-element-153044b elementor-widget elementor-widget-html\" data-id=\"153044b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ilmora home page (English). Paste the whole file into one HTML widget. Use a full-width page without padding. -->\r\n\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Estedad:wght@300..800&display=swap\">\r\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Quicksand:wght@400;500;600;700&display=swap\">\r\n\r\n<style>\r\n\/* ===== glue the widget to the screen edges: remove Elementor \/ theme spacing around it ===== *\/\r\nhtml:has(#ilmh),body:has(#ilmh){margin:0!important;padding:0!important;background:#111825!important}\r\nbody:has(#ilmh) .elementor:has(#ilmh),\r\nbody:has(#ilmh) .e-con:has(#ilmh),\r\nbody:has(#ilmh) .e-con-inner:has(#ilmh),\r\nbody:has(#ilmh) .elementor-section:has(#ilmh),\r\nbody:has(#ilmh) .elementor-container:has(#ilmh),\r\nbody:has(#ilmh) .elementor-column:has(#ilmh),\r\nbody:has(#ilmh) .elementor-widget-wrap:has(#ilmh),\r\nbody:has(#ilmh) .elementor-widget:has(#ilmh),\r\nbody:has(#ilmh) .elementor-widget-container:has(#ilmh){margin:0!important;padding:0!important;gap:0!important;min-height:0!important;max-width:none!important;width:100%!important;border:0!important}\r\nbody:has(#ilmh) .elementor-widget:has(#ilmh){--kit-widget-spacing:0px;margin-block:0!important}\r\n#ilmh{display:block;margin:0!important}\r\n#ilmh{position:relative;direction:rtl;font-family:\"Estedad\",\"Vazirmatn\",Tahoma,sans-serif;color:#fff;background:#111825}\r\n#ilmh .h-neb{position:absolute;inset:0;background:#111825;overflow:hidden}\r\n#ilmh .h-neb i{position:absolute;border-radius:50%;filter:blur(64px) saturate(1.55) brightness(1.18);opacity:1;animation:hNeb 18s ease-in-out infinite alternate}\r\n#ilmh .h-neb .n1{width:52vw;height:52vw;left:-18vw;bottom:-24vw;background:radial-gradient(circle,#3a83ba 0%,rgba(58,131,186,0) 68%)}\r\n#ilmh .h-neb .n2{width:38vw;height:38vw;left:4vw;bottom:-26vw;background:radial-gradient(circle,#5e327c 0%,rgba(94,50,124,0) 68%);animation-delay:-6s}\r\n#ilmh .h-neb .n3{width:48vw;height:48vw;right:-19vw;top:-18vw;background:radial-gradient(circle,#782e65 0%,rgba(120,46,101,0) 68%);animation-delay:-3s}\r\n#ilmh .h-neb .n4{width:34vw;height:34vw;right:-14vw;top:30vh;background:radial-gradient(circle,#ffad8c 0%,rgba(255,173,140,0) 68%);opacity:.9;animation-delay:-9s}\r\n#ilmh .h-neb .n5{width:30vw;height:30vw;right:6vw;bottom:-20vw;background:radial-gradient(circle,#5e327c 0%,rgba(94,50,124,0) 68%);opacity:.85;animation-delay:-12s}\r\n@keyframes hNeb{to{transform:translate(3vw,-2vw) scale(1.12)}}\r\n#ilmh *{box-sizing:border-box}\r\n#ilmh button{font-family:inherit;background:none;border:0;padding:0;margin:0;color:inherit;cursor:pointer;box-shadow:none;border-radius:0;text-transform:none;letter-spacing:normal}\r\n#ilmh button:hover,#ilmh button:focus{background-color:transparent;color:inherit}\r\n#ilmh :focus-visible{outline:2px solid #fff;outline-offset:4px}\r\n#ilmh .h-track{position:relative;height:520vh}\r\n#ilmh .h-stick{-webkit-user-select:none;user-select:none;position:sticky;top:0;height:100vh;height:100svh;width:100%;overflow:hidden}\r\n#ilmh canvas{position:absolute;inset:0;width:100%;height:100%;display:block}\r\n#ilmh .h-vig{display:none;position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(40,48,70,.28) 100%)}\r\n#ilmh .h-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,#ffffff 0%,rgba(190,236,255,.85) 30%,rgba(160,130,240,.35) 55%,rgba(17,21,38,0) 80%);opacity:0}\r\n#ilmh .h-grain{position:absolute;inset:-50%;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'\/><\/filter><rect width='100%' height='100%' filter='url(%23n)'\/><\/svg>\");animation:hGrain 1s steps(4) infinite}\r\n@keyframes hGrain{25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-2%)}}\r\n\r\n\/* HUD *\/\r\n#ilmh .h-ui{position:absolute;inset:0;pointer-events:none}\r\n#ilmh .h-logo{position:absolute;top:40px;right:56px;display:flex;flex-direction:column;align-items:center;gap:10px;direction:ltr;text-decoration:none;pointer-events:auto}\r\n#ilmh .h-word{position:relative;font-family:\"Quicksand\",sans-serif;font-weight:600;font-size:52px;line-height:1;background-image:linear-gradient(110deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.95) 50%,rgba(255,255,255,0) 58%),linear-gradient(90deg,#5ed6f5 0%,#6cc3ff 22%,#9fb8ff 40%,#d9d2f0 55%,#f4b7c6 72%,#ff8a95 88%,#ff6f8a 100%);background-size:260% 100%,100% 100%;background-position:160% 0,0 0;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(120,180,255,.35));animation:hShine 5s ease-in-out infinite 1.2s}\r\n@keyframes hShine{0%{background-position:160% 0,0 0}38%,100%{background-position:-60% 0,0 0}}\r\n#ilmh .h-i{position:relative;display:inline-block}\r\n#ilmh .h-spark{position:absolute;width:.34em;height:.34em;left:50%;top:-.3em;transform:translateX(-50%);filter:drop-shadow(0 0 8px rgba(94,214,245,.85));animation:hTw 5s ease-in-out infinite 1.2s}\r\n@keyframes hTw{0%,20%,100%{transform:translateX(-50%) scale(1) rotate(0)}8%{transform:translateX(-50%) scale(1.3) rotate(45deg);filter:drop-shadow(0 0 14px #fff)}}\r\n#ilmh .h-logo img{display:block;width:220px;max-width:none;height:auto;filter:drop-shadow(0 0 18px rgba(120,170,255,.22))}\r\n#ilmh .h-tag{font-family:\"Quicksand\",sans-serif;font-weight:600;font-size:10.5px;letter-spacing:.34em;color:rgba(255,255,255,.88);white-space:nowrap;padding-left:.34em}\r\n\/* numbered menu *\/\r\n#ilmh .h-menu{position:absolute;top:150px;right:68px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;pointer-events:auto;margin:0;padding:0;list-style:none}\r\n#ilmh .h-mi{position:relative;display:flex;align-items:baseline;gap:12px;padding:5px 0;text-decoration:none;color:rgba(255,255,255,.82);font-size:15px;font-weight:400;line-height:1.5;text-shadow:0 1px 12px rgba(17,24,37,.7);transform-origin:right center;transition:color .3s,transform .3s cubic-bezier(.2,.8,.2,1)}\r\n#ilmh .h-mi .n{min-width:12px;font-size:11.5px;font-weight:400;color:rgba(255,255,255,.65);transition:color .3s}\r\n#ilmh .h-mi .l{position:relative;white-space:nowrap}\r\n#ilmh .h-mi:hover,#ilmh .h-mi:focus-visible{color:#fff;transform:scale(1.04)}\r\n#ilmh .h-mi:hover .n{color:#5ed6f5}\r\n#ilmh .h-mi.is-on{color:#fff;font-weight:700}\r\n#ilmh .h-mi.is-on .n{color:#5ed6f5;font-weight:700}\r\n\/* before entering the portal only the first item shows, as \"enter the portal\" *\/\r\n#ilmh .h-mi .l-pre{display:none}\r\n#ilmh .h-top.pre .h-mi .l-pre{display:inline}\r\n#ilmh .h-top.pre .h-mi .l-main{display:none}\r\n#ilmh .h-menu li{transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1),visibility .5s}\r\n#ilmh .h-top.pre .h-menu li:not(:first-child){opacity:0;visibility:hidden;transform:translateX(16px)}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(2){transition-delay:.05s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(3){transition-delay:.10s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(4){transition-delay:.15s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(5){transition-delay:.20s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(6){transition-delay:.25s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(7){transition-delay:.30s}\r\n#ilmh .h-top:not(.pre) .h-menu li:nth-child(8){transition-delay:.35s}\r\n#ilmh .h-top.pre .h-mpanel li:not(:first-child){display:none}\r\n@property --ilm-ang{syntax:'<angle>';inherits:false;initial-value:0deg}\r\n#ilmh .h-mi.is-on::before{content:\"\";position:absolute;inset:0 -12px;border-radius:999px;padding:1.5px;background:conic-gradient(from var(--ilm-ang),#5ed6f5,#6cc3ff,#9fb8ff,#d9d2f0,#f4b7c6,#ff6f8a,#5ed6f5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ilmRing 3s linear infinite;filter:drop-shadow(0 0 5px rgba(108,195,255,.45));pointer-events:none}\r\n@keyframes ilmRing{to{--ilm-ang:360deg}}\r\n#ilmh .h-menu li:first-child{margin-bottom:4px}\r\n#ilmh .h-mbtn{display:none}\r\n#ilmh .h-mpanel{position:fixed;inset:0;z-index:40;pointer-events:auto;background:rgba(17,24,37,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:flex;flex-direction:column;justify-content:center;padding:0 32px;opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}\r\n#ilmh .h-mpanel.open{opacity:1;visibility:visible}\r\n#ilmh .h-mpanel .h-mi .l{white-space:normal}\r\n#ilmh .h-mpanel .h-mi{font-size:14px;font-weight:400;padding:10px 0;opacity:0;transform:translateY(18px);transition:opacity .5s,transform .5s,color .3s}\r\n#ilmh .h-mpanel .h-mi .n{font-size:12px}\r\n#ilmh .h-mpanel .h-mi.is-on{font-weight:700}\r\n#ilmh .h-mpanel.open .h-mi{opacity:1;transform:none}\r\n#ilmh .h-mclose{position:absolute;top:26px;right:22px;font-size:14px;font-weight:600;color:#fff;padding:10px 4px}\r\n#ilmh .h-pct{position:absolute;bottom:44px;left:56px;font-size:14px;font-weight:500;color:rgba(255,255,255,.9);display:flex;align-items:center;gap:12px;text-shadow:0 0 10px rgba(80,100,140,.4)}\r\n#ilmh .h-pct i{width:64px;height:1px;background:rgba(255,255,255,.35);position:relative;overflow:hidden}\r\n#ilmh .h-pct i b{position:absolute;inset:0;background:#fff;transform-origin:right;transform:scaleX(0)}\r\n\r\n#ilmh .h-intro{position:absolute;inset:auto 0 12vh 0;display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center;text-shadow:0 2px 24px rgba(60,72,100,.35)}\r\n#ilmh .h-intro h1{margin:0;font-size:clamp(26px,3.4vw,46px);font-weight:750;line-height:1.4;color:#fff}\r\n#ilmh .h-scroll{display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:auto;padding:6px 14px}\r\n#ilmh .h-scroll-t{font-size:15px;font-weight:500;color:rgba(255,255,255,.88)}\r\n#ilmh .h-mouse{position:relative;width:24px;height:38px;border:2px solid rgba(255,255,255,.92);border-radius:14px;box-shadow:0 0 16px rgba(94,214,245,.28),inset 0 0 8px rgba(94,214,245,.15);transition:transform .3s,border-color .3s}\r\n#ilmh .h-wheel{position:absolute;left:50%;top:7px;width:3px;height:8px;margin-left:-1.5px;border-radius:3px;background:#5ed6f5;box-shadow:0 0 6px #5ed6f5;animation:hWheel 1.6s cubic-bezier(.6,0,.4,1) infinite}\r\n@keyframes hWheel{0%{opacity:0;transform:translateY(-2px)}25%{opacity:1}100%{opacity:0;transform:translateY(13px)}}\r\n#ilmh .h-chev{display:flex;flex-direction:column;align-items:center;margin-top:-2px}\r\n#ilmh .h-chev b{display:block;width:10px;height:10px;border-right:2px solid;border-bottom:2px solid;transform:rotate(45deg);margin-top:-2px;opacity:0;animation:hChev 1.6s ease-in-out infinite}\r\n#ilmh .h-chev b:nth-child(1){color:#5ed6f5}\r\n#ilmh .h-chev b:nth-child(2){color:#c8b6f0;animation-delay:.18s}\r\n#ilmh .h-chev b:nth-child(3){color:#ff8a95;animation-delay:.36s}\r\n@keyframes hChev{0%,100%{opacity:0;transform:rotate(45deg) translate(-3px,-3px)}50%{opacity:1;transform:rotate(45deg) translate(0,0)}}\r\n#ilmh .h-scroll:hover .h-mouse{transform:translateY(3px);border-color:#fff}\r\n@media (hover:none),(pointer:coarse){#ilmh .h-mouse{display:none}}\r\n\r\n#ilmh .h-stage{position:absolute;inset:0;opacity:0;transition:opacity .2s}\r\n#ilmh .h-hint{position:absolute;top:48px;left:50%;transform:translateX(-50%);font-size:14px;font-weight:500;color:rgba(255,255,255,.9);white-space:nowrap;text-shadow:0 0 12px rgba(60,72,100,.4)}\r\n#ilmh .h-arrow{position:absolute;top:50%;width:84px;height:44px;margin-top:-22px;display:flex;align-items:center;justify-content:center;pointer-events:auto;opacity:.85;transition:opacity .3s,transform .3s}\r\n#ilmh .h-arrow:hover{opacity:1}\r\n#ilmh .h-arrow svg{width:72px;height:14px}\r\n#ilmh .h-prev{right:24%}#ilmh .h-prev:hover{transform:translateX(6px)}\r\n#ilmh .h-next{left:24%}#ilmh .h-next:hover{transform:translateX(-6px)}\r\n#ilmh .h-title{position:absolute;bottom:138px;left:50%;transform:translateX(-50%);font-size:clamp(18px,1.9vw,26px);font-weight:750;color:#fff;white-space:nowrap;text-shadow:0 2px 24px rgba(17,24,37,.8),0 0 18px rgba(94,214,245,.25)}\r\n#ilmh .h-sel{position:absolute;bottom:62px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:56px;pointer-events:auto}\r\n#ilmh .h-side{font-size:15px;font-weight:500;color:rgba(255,255,255,.4);min-width:110px;text-align:center;transition:color .3s}\r\n#ilmh .h-side:hover{color:rgba(255,255,255,.8)}\r\n#ilmh .h-cur{position:relative;min-width:200px;padding:16px 26px;text-align:center;font-size:17px;font-weight:700;color:#fff;text-shadow:0 0 14px rgba(255,255,255,.6)}\r\n#ilmh .h-cur::before,#ilmh .h-cur::after{content:\"\";position:absolute;top:0;bottom:0;width:14px;border:1.5px solid #fff;opacity:.95}\r\n#ilmh .h-cur::before{right:0;border-left:0}\r\n#ilmh .h-cur::after{left:0;border-right:0}\r\n\r\n\r\n\/* custom cursor *\/\r\n#ilmh .h-cursor{position:fixed;left:0;top:0;z-index:60;pointer-events:none;opacity:0;transition:opacity .25s;will-change:transform}\r\n#ilmh .h-cursor.on{opacity:1}\r\n#ilmh .h-cursor svg{position:absolute;overflow:visible;opacity:0;transform:scale(.5);transition:opacity .22s,transform .3s cubic-bezier(.2,.9,.3,1.4);filter:drop-shadow(0 0 6px rgba(94,214,245,.9)) drop-shadow(0 0 16px rgba(108,195,255,.45))}\r\n#ilmh .c-star{width:22px;height:22px;left:-11px;top:-11px}\r\n#ilmh .h-cursor .c-hand,#ilmh .h-cursor .c-point{filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}\r\n#ilmh .c-star path{transform-origin:12px 12px;animation:cSpin 6s linear infinite}\r\n@keyframes cSpin{to{transform:rotate(360deg)}}\r\n#ilmh .c-hand{width:46px;height:46px;left:-23px;top:-25px}\r\n#ilmh .c-point{width:46px;height:46px;left:-19px;top:-3px}\r\n#ilmh .h-cursor[data-m=\"star\"] .c-star,#ilmh .h-cursor[data-m=\"hand\"] .c-hand,#ilmh .h-cursor[data-m=\"point\"] .c-point{opacity:1;transform:scale(1)}\r\n#ilmh .h-cursor.grab .c-hand{transform:scale(.86) rotate(-6deg)}\r\n#ilmh .h-cursor.press .c-point{transform:scale(.88) translateY(2px)}\r\n#ilmh .c-burst{position:absolute;left:0;top:0}\r\n#ilmh .c-burst i{position:absolute;left:-1.25px;top:-6px;width:2.5px;height:12px;border-radius:2px;background:#FF6F8A;opacity:0;transform:rotate(var(--a)) translateY(-10px) scaleY(.3)}\r\n#ilmh .c-burst.go i{animation:cBurst .55s cubic-bezier(.2,.8,.3,1) forwards}\r\n@keyframes cBurst{0%{opacity:1;transform:rotate(var(--a)) translateY(-9px) scaleY(.3)}45%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(-26px) scaleY(1)}}\r\n@media (hover:hover) and (pointer:fine){#ilmh,#ilmh *{cursor:none!important}}\r\n@media (hover:none),(pointer:coarse){#ilmh .h-cursor{display:none}}\r\n#ilmh .h-load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#111825;transition:opacity .9s;z-index:5;font-size:14px;color:#fff}\r\n#ilmh .h-load.gone{opacity:0;pointer-events:none}\r\n#ilmh .h-fallback{display:none;position:absolute;inset:0;align-items:center;justify-content:center;text-align:center;padding:24px;background:radial-gradient(circle at 20% 90%,rgba(58,131,186,.55),transparent 50%),radial-gradient(circle at 85% 15%,rgba(120,46,101,.55),transparent 50%),#111825}\r\n\r\n@media (max-width:1100px){\r\n  #ilmh .h-menu{display:none}\r\n  #ilmh .h-logo{right:auto;left:28px}\r\n  #ilmh .h-logo img{width:180px}\r\n  #ilmh .h-mbtn{display:flex;position:absolute;top:26px;right:22px;align-items:center;gap:10px;padding:10px 4px;font-size:14px;font-weight:600;color:#fff;pointer-events:auto}\r\n  #ilmh .h-mbtn i{display:flex;flex-direction:column;gap:5px}\r\n  #ilmh .h-mbtn i b{display:block;width:22px;height:1.5px;background:#fff}\r\n  #ilmh .h-mbtn i b:last-child{width:14px;background:#5ed6f5}\r\n}\r\n@media (max-width:760px){\r\n  #ilmh .h-logo{top:22px;left:22px;right:auto;gap:7px}\r\n  #ilmh .h-logo img{width:140px}\r\n  #ilmh .h-word{font-size:38px}\r\n  #ilmh .h-tag{font-size:8.5px}\r\n  #ilmh .h-pct{left:22px;bottom:26px}\r\n  #ilmh .h-sel{gap:14px;bottom:44px}\r\n  #ilmh .h-title{bottom:108px;font-size:16px;white-space:normal;width:90%;text-align:center}\r\n  #ilmh .h-side{min-width:0;font-size:13px}\r\n  #ilmh .h-cur{min-width:140px;padding:12px 18px;font-size:15px}\r\n  #ilmh .h-prev{right:4%}#ilmh .h-next{left:4%}\r\n  #ilmh .h-arrow{width:56px}\r\n  #ilmh .h-arrow svg{width:48px}\r\n}\r\n@media (prefers-reduced-motion:reduce){#ilmh .h-word,#ilmh .h-spark,#ilmh .h-grain,#ilmh .h-wheel,#ilmh .h-chev b{animation:none;opacity:1}}\r\n\/* ===== fixed header layer ===== *\/\r\n#ilmh .h-top{position:fixed;inset:0;z-index:50;pointer-events:none;transition:opacity .4s,visibility .4s}\r\n#ilmh .h-top.gone{opacity:0;visibility:hidden}\r\n\r\n\/* ===== scene 2: the problem (inside the hero) ===== *\/\r\n#ilmh .p-glass{position:absolute;top:50%;right:var(--menuR,360px);width:min(704px,44vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden;border-radius:26px;padding:0;color:#fff;pointer-events:auto;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.035) 55%,rgba(255,255,255,.06));backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:0 40px 90px -40px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.14);opacity:0;visibility:hidden;transform:translate(40px,-50%);transition:opacity .6s ease,transform .8s cubic-bezier(.2,.8,.2,1),visibility .6s}\r\n#ilmh .p-glass.show{opacity:1;visibility:visible;transform:translate(0,-50%)}\r\n#ilmh .p-ring{position:absolute;inset:0;border-radius:26px;padding:1.5px;background:conic-gradient(from var(--ilm-ang),#5ed6f5,#6cc3ff,#9fb8ff,#d9d2f0,#f4b7c6,#ff6f8a,#5ed6f5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ilmRing 6s linear infinite;pointer-events:none;opacity:.9}\r\n#ilmh .p-glass h3{margin:0;font-size:16px;font-weight:750;color:#fff}\r\n#ilmh .p-glass h3 b{font-weight:800;color:#5ed6f5}\r\n#ilmh .p-glass h4{margin:8px 0 16px;font-size:15px;line-height:1.8;font-weight:750;color:#ffb9c4}\r\n#ilmh .p-glass p{margin:0 0 10px;font-size:13px;line-height:2;color:rgba(255,255,255,.84)}\r\n#ilmh .p-turn{font-weight:750;color:#fff!important;margin:14px 0 8px!important}\r\n#ilmh .p-list{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:4px}\r\n#ilmh .p-list li{position:relative;padding-right:18px;font-size:13px;line-height:1.95;color:rgba(255,255,255,.85)}\r\n#ilmh .p-list li::before{content:\"\";position:absolute;right:1px;top:.98em;width:9px;height:1.5px;background:#ff8a95;border-radius:2px}\r\n#ilmh .p-fade{list-style:none;margin:0 0 18px;padding:0 16px 0 0;border-right:1.5px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:6px}\r\n#ilmh .p-fade li{position:relative;font-size:13px;line-height:1.95}\r\n#ilmh .p-fade li::before{content:\"\";position:absolute;right:-20.5px;top:.72em;width:7px;height:7px;border-radius:50%;background:#5ed6f5}\r\n#ilmh .p-fade li:nth-child(1){color:rgba(255,255,255,.92)}\r\n#ilmh .p-fade li:nth-child(2){color:rgba(255,255,255,.72)}#ilmh .p-fade li:nth-child(2)::before{opacity:.65}\r\n#ilmh .p-fade li:nth-child(3){color:rgba(255,255,255,.55)}#ilmh .p-fade li:nth-child(3)::before{opacity:.35}\r\n#ilmh .p-fade li:nth-child(4){color:#fff;font-weight:650}#ilmh .p-fade li:nth-child(4)::before{background:transparent;border:1.5px solid #ff6f8a}\r\n#ilmh .p-fade em{font-style:normal;color:#ff8a95}\r\n#ilmh .p-call{padding:16px 18px;border-radius:14px;background:rgba(17,24,37,.45);border:1px solid rgba(255,255,255,.08)}\r\n#ilmh .p-call strong{display:block;font-size:14px;font-weight:800;margin-bottom:6px;color:#fff}\r\n#ilmh .p-call p{margin:0!important}\r\n#ilmh .p-call mark{background:linear-gradient(transparent 60%,rgba(255,111,138,.38) 60%);color:#fff;padding:0 2px}\r\n#ilmh .p-next-link{display:inline-flex;align-items:center;gap:10px;margin-top:18px;min-height:44px;padding:0 20px;border-radius:10px;border:1.5px solid rgba(255,255,255,.35);color:#fff;text-decoration:none;font-weight:700;font-size:13px}\r\n#ilmh .p-rv{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}\r\n#ilmh .p-glass.show .p-rv{opacity:1;transform:none}\r\n\/* follow button (desktop) \u2014 rectangular *\/\r\n#ilmh .p-follow{position:absolute;left:0;top:0;width:148px;height:46px;margin:-23px 0 0 -74px;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:750;color:#fff;background:rgba(17,24,37,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none;opacity:0;z-index:5;will-change:transform;box-shadow:0 12px 30px -10px rgba(0,0,0,.6)}\r\n#ilmh .p-follow::before{content:\"\";position:absolute;inset:0;border-radius:10px;padding:1.5px;background:conic-gradient(from var(--ilm-ang),#5ed6f5,#6cc3ff,#9fb8ff,#d9d2f0,#f4b7c6,#ff6f8a,#5ed6f5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ilmRing 2.4s linear infinite}\r\n#ilmh .p-follow svg{width:22px;height:12px}\r\n@media (hover:hover) and (pointer:fine){\r\n  #ilmh .p-next-link{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}\r\n  #ilmh .p-next-link:focus{position:static;width:auto;height:auto;clip:auto;overflow:visible}\r\n}\r\n@media (max-width:1100px){\r\n  #ilmh .p-glass{top:auto;bottom:16px;right:16px;left:16px;width:auto;max-height:50vh;transform:translateY(40px)}\r\n  #ilmh .p-glass.show{transform:none}\r\n}\r\n#ilmh .p-glass strong.c{color:#8fe6f8;font-weight:700}\r\n#ilmh .p-checks{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:6px}\r\n#ilmh .p-checks li{position:relative;padding-right:24px;font-size:13px;line-height:1.95;color:rgba(255,255,255,.88)}\r\n#ilmh .p-checks li::before{content:\"\";position:absolute;right:0;top:.5em;width:14px;height:14px;border-radius:4px;background:rgba(94,214,245,.16);border:1px solid rgba(94,214,245,.55)}\r\n#ilmh .p-checks li::after{content:\"\";position:absolute;right:4.5px;top:.72em;width:4px;height:7px;border:solid #5ed6f5;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}\r\n#ilmh .p-from{color:rgba(255,255,255,.5);text-decoration:line-through;text-decoration-color:rgba(255,138,149,.8)}\r\n#ilmh .p-to{color:#8fe6f8;font-weight:700}\r\n#ilmh .p-result{margin:6px 0 16px;padding:0 16px 0 0;border-right:2px solid #5ed6f5}\r\n#ilmh .p-result p{margin:0 0 2px!important}\r\n#ilmh .p-result strong{color:#fff;font-weight:750}\r\n#ilmh .p-call-c mark{background:linear-gradient(transparent 60%,rgba(94,214,245,.32) 60%)}\r\n@media (max-width:760px),(max-width:1100px) and (orientation:portrait){#ilmh .h-hint{display:none}}\r\n\/* ===== scene 4: process cards ===== *\/\r\n#ilmh .pc-head{margin-bottom:18px;text-shadow:0 2px 18px rgba(17,24,37,.8)}\r\n#ilmh .pc-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}\r\n#ilmh .pc-card{position:relative;padding:20px 20px 18px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.035));backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 50px -30px rgba(0,0,0,.7);opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.8,.2,1),border-color .3s,background-color .3s}\r\n#ilmh .p-glass.show .pc-card{opacity:1;transform:none}\r\n#ilmh .p-glass.show .pc-card:nth-child(1){transition-delay:.10s}\r\n#ilmh .p-glass.show .pc-card:nth-child(2){transition-delay:.18s}\r\n#ilmh .p-glass.show .pc-card:nth-child(3){transition-delay:.26s}\r\n#ilmh .p-glass.show .pc-card:nth-child(4){transition-delay:.34s}\r\n#ilmh .p-glass.show .pc-card:nth-child(5){transition-delay:.42s}\r\n#ilmh .p-glass.show .pc-card:nth-child(6){transition-delay:.50s}\r\n#ilmh .pc-card:hover{border-color:rgba(94,214,245,.45)}\r\n#ilmh .pc-card.pc-opt{border:1px dashed rgba(255,173,140,.55);background:linear-gradient(160deg,rgba(255,173,140,.08),rgba(255,255,255,.03))}\r\n#ilmh .pc-top{display:flex;align-items:center;gap:12px;margin-bottom:12px}\r\n#ilmh .pc-n{font-size:22px;font-weight:800;line-height:1;background:linear-gradient(90deg,#5ed6f5,#9fb8ff,#ff8a95);-webkit-background-clip:text;background-clip:text;color:transparent}\r\n#ilmh .pc-bar{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden;display:flex;justify-content:flex-start}\r\n#ilmh .pc-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(270deg,#5ed6f5,#9fb8ff,#ff8a95)}\r\n#ilmh .pc-card h5{margin:0 0 8px;font-size:14px;font-weight:750;color:#fff}\r\n#ilmh .pc-card p{margin:0;font-size:13px;line-height:1.95;color:rgba(255,255,255,.8)}\r\n#ilmh .pc-foot{margin-top:16px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}\r\n#ilmh .pc-quote{position:relative;margin:0;padding:14px 22px;border-radius:14px;background:rgba(17,24,37,.55);border:1px solid rgba(255,255,255,.1);flex:0 1 auto}\r\n#ilmh .pc-quote::before{content:\"\u00ab\";position:absolute;right:8px;top:-4px;font-size:30px;line-height:1;color:#5ed6f5;opacity:.8}\r\n#ilmh .pc-quote p{margin:0!important;padding-right:10px;font-size:13.5px;color:#fff}\r\n#ilmh .pc-note{flex:1 1 280px;margin:0!important;font-size:13px;color:rgba(255,255,255,.78);text-shadow:0 2px 14px rgba(17,24,37,.8)}\r\n@media (max-width:640px){#ilmh .pc-grid{grid-template-columns:minmax(0,1fr)}}\r\n\/* panel body: the only scrolling part, kept inside the rounded border *\/\r\n#ilmh .p-body{position:relative;overflow-y:auto;overscroll-behavior:contain;padding:40px 44px 42px;max-height:inherit;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}\r\n#ilmh .p-body::-webkit-scrollbar{width:6px}\r\n#ilmh .p-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28);border-radius:6px}\r\n#ilmh .p-body::-webkit-scrollbar-track{background:transparent;margin:24px 0}\r\n#ilmh .p-glass > .p-ring{z-index:3}\r\n\/* card scenes: centred on screen *\/\r\n#ilmh .p-glass.p-proc{left:50%;right:auto;width:clamp(620px,calc(100vw - 2 * var(--menuR,360px)),1120px);max-height:90vh;margin:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible;transform:translate(calc(-50% + 40px),-50%)}\r\n#ilmh .p-glass.p-proc.show{transform:translate(-50%,-50%)}\r\n#ilmh .p-proc .p-body{padding:6px 8px 12px}\r\n#ilmh .pc-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}\r\n#ilmh .pc-foot{margin-top:16px;display:block}\r\n#ilmh .pc-quote{display:block;padding:16px 26px 16px 22px}\r\n#ilmh .pc-quote p{margin:0!important;padding-right:10px;font-size:13px;line-height:1.95;color:rgba(255,255,255,.82)}\r\n#ilmh .pc-quote p strong{font-size:13.5px;color:#fff;font-weight:750}\r\n#ilmh .pc-quote p + p{margin-top:4px!important}\r\n\/* scene 5: project paths *\/\r\n#ilmh .pj-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;align-items:stretch}\r\n#ilmh .pj-card{display:flex;flex-direction:column;padding:24px 22px 22px}\r\n#ilmh .pj-card > p{margin:0 0 14px!important}\r\n#ilmh .pj-card .p-checks{margin-bottom:18px}\r\n#ilmh .pj-tag{align-self:flex-start;font-size:12px;font-weight:700;color:#5ed6f5;padding:3px 10px;border-radius:999px;background:rgba(94,214,245,.12);border:1px solid rgba(94,214,245,.3);margin-bottom:10px}\r\n#ilmh .pj-card h5{font-size:16px;margin-bottom:8px}\r\n#ilmh .pj-top > .p-ring{border-radius:18px;opacity:.85}\r\n#ilmh .pj-foot{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:12px}\r\n#ilmh .pj-price{font-size:12px;color:rgba(255,255,255,.62)}\r\n#ilmh .pj-btn{position:relative;align-self:flex-start;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 20px;border-radius:10px;font-size:13px;font-weight:750;color:#fff;text-decoration:none;background:rgba(17,24,37,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background-color .3s,transform .3s}\r\n#ilmh .pj-btn::before{content:\"\";position:absolute;inset:0;border-radius:10px;padding:1.5px;background:conic-gradient(from var(--ilm-ang),#5ed6f5,#6cc3ff,#9fb8ff,#d9d2f0,#f4b7c6,#ff6f8a,#5ed6f5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ilmRing 2.4s linear infinite;pointer-events:none}\r\n#ilmh .pj-btn:hover{background:rgba(40,52,84,.75);color:#fff;transform:translateY(-2px)}\r\n#ilmh .pj-btn svg{width:20px;height:11px}\r\n@media (max-width:1100px){\r\n  #ilmh .p-glass.p-proc{left:12px;right:12px;width:auto;max-height:72vh;overflow:hidden;background:rgba(17,24,37,.55);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:22px;transform:translateY(40px)}\r\n  #ilmh .p-glass.p-proc.show{transform:none}\r\n  #ilmh .p-proc .p-body{padding:16px 12px}\r\n  #ilmh .p-body{padding:26px 22px 28px}\r\n}\r\n#ilmh .p-no{list-style:none;margin:0 0 18px;padding:14px 16px;border-radius:14px;background:rgba(255,111,138,.06);border:1px solid rgba(255,111,138,.18);display:flex;flex-direction:column;gap:6px}\r\n#ilmh .p-no li {\r\n    position: relative;\r\n    padding-right: 24px;\r\n    font-size: 13px;\r\n    line-height: 1.95;\r\n    color: rgb(255 255 255);\r\n    text-decoration: line-through;\r\n    text-decoration-color: rgb(255 111 138);\r\n    text-decoration-thickness: 0.6px;\r\n}\r\n#ilmh .p-no li::before,#ilmh .p-no li::after{content:\"\";position:absolute;right:3px;top:.95em;width:11px;height:1.8px;border-radius:2px;background:#ff6f8a}\r\n#ilmh .p-no li::before{transform:rotate(45deg)}\r\n#ilmh .p-no li::after{transform:rotate(-45deg)}\r\n\/* ===== scene 7: FAQ accordion ===== *\/\r\n#ilmh .fq-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}\r\n#ilmh .fq-item{border-radius:14px;background:rgba(17,24,37,.35);border:1px solid rgba(255,255,255,.08);transition:background-color .3s,border-color .3s}\r\n#ilmh .fq-item.open{background:rgba(17,24,37,.6);border-color:rgba(94,214,245,.35)}\r\n#ilmh .fq-q{width:100%;display:flex;align-items:center;gap:12px;padding:13px 16px;text-align:right;font-size:13.5px;font-weight:600;line-height:1.8;color:#fff}\r\n#ilmh .fq-q .fq-n{flex-shrink:0;min-width:22px;font-size:11.5px;font-weight:700;color:#5ed6f5}\r\n#ilmh .fq-q .fq-t{flex:1}\r\n#ilmh .fq-q i{position:relative;flex-shrink:0;width:18px;height:18px;transition:transform .35s cubic-bezier(.2,.8,.2,1)}\r\n#ilmh .fq-q i::before,#ilmh .fq-q i::after{content:\"\";position:absolute;top:50%;left:50%;width:10px;height:1.5px;border-radius:2px;background:#fff;transform:translate(-50%,-50%)}\r\n#ilmh .fq-q i::after{transform:translate(-50%,-50%) rotate(90deg)}\r\n#ilmh .fq-item.open .fq-q i{transform:rotate(45deg)}\r\n#ilmh .fq-item.open .fq-q i::before,#ilmh .fq-item.open .fq-q i::after{background:#5ed6f5}\r\n#ilmh .fq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.8,.2,1)}\r\n#ilmh .fq-item.open .fq-a{grid-template-rows:1fr}\r\n#ilmh .fq-a > div{overflow:hidden}\r\n#ilmh .fq-a p{margin:0!important;padding:0 50px 16px 16px;font-size:13px;line-height:2;color:rgba(255,255,255,.8)}\r\n\/* ===== menu extras: social buttons, note, copyright ===== *\/\r\n#ilmh .h-exli{margin-top:6px;align-self:stretch;width:0;min-width:100%}\r\n#ilmh .h-mpanel .h-exli{width:auto;min-width:0}\r\n#ilmh .h-extra{max-width:none;margin-top:10px;padding-top:14px;border-top:1px solid rgba(255,255,255,.16);white-space:normal}\r\n#ilmh .h-soc{display:grid;grid-template-columns:1fr 1fr;gap:10px}\r\n#ilmh .h-sbtn{display:flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;border-radius:10px;background:rgba(17,24,37,.45);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:13px;text-decoration:none;transition:border-color .3s,background-color .3s,transform .3s}\r\n#ilmh .h-sbtn svg{width:16px;height:16px;color:#5ed6f5}\r\n#ilmh .h-sbtn:hover{color:#fff;border-color:rgba(94,214,245,.6);background:rgba(94,214,245,.12);transform:translateY(-1px)}\r\n#ilmh .h-note{margin:12px 0 0;font-size:12px;line-height:1.9;color:rgba(255,255,255,.72);text-shadow:0 1px 10px rgba(17,24,37,.7)}\r\n#ilmh .h-copy{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.16);font-size:11.5px;line-height:1.9;color:rgba(255,255,255,.6)}\r\n#ilmh .h-copy-link{display:inline;padding:0;font-size:11.5px;color:#5ed6f5;text-decoration:underline;text-underline-offset:3px}\r\n#ilmh .h-copy-link:hover{color:#8fe6f8}\r\n#ilmh .h-top.pre .h-menu li.h-exli{opacity:0;visibility:hidden}\r\n#ilmh .h-top:not(.pre) .h-menu li.h-exli{transition-delay:.4s}\r\n#ilmh .h-mpanel .h-extra{max-width:none;margin-top:18px}\r\n\/* ===== copyright modal ===== *\/\r\n#ilmh .h-modal{position:fixed;inset:0;z-index:55;display:flex;align-items:center;justify-content:center;padding:20px}\r\n#ilmh .h-modal[hidden]{display:none!important}\r\n#ilmh .h-modal-bg{position:absolute;inset:0;background:rgba(10,14,24,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:hFade .35s ease}\r\n#ilmh .h-modal-box{position:relative;width:min(640px,100%);max-height:84vh;display:flex;flex-direction:column;border-radius:24px;overflow:hidden;color:#fff;background:linear-gradient(160deg,rgba(40,48,78,.92),rgba(20,26,44,.95));box-shadow:0 40px 90px -30px rgba(0,0,0,.8);animation:hPop .45s cubic-bezier(.2,.8,.2,1)}\r\n#ilmh .h-modal-box > .p-ring{z-index:2;border-radius:24px}\r\n#ilmh .h-modal-body{overflow-y:auto;padding:36px 38px 34px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}\r\n#ilmh .h-modal-body h2{margin:0 0 16px;font-size:16px;font-weight:800;color:#fff}\r\n#ilmh .h-modal-body p{margin:0 0 12px;font-size:13px;line-height:2.05;color:rgba(255,255,255,.84)}\r\n#ilmh .h-modal-body p:last-child{margin:0}\r\n#ilmh .h-modal-x{position:absolute;top:12px;left:14px;z-index:3;width:36px;height:36px;border-radius:10px;font-size:22px;line-height:1;color:#fff;background:rgba(255,255,255,.08)}\r\n#ilmh .h-modal-x:hover{background:rgba(255,255,255,.16);color:#fff}\r\n@keyframes hFade{from{opacity:0}}\r\n@keyframes hPop{from{opacity:0;transform:translateY(20px) scale(.97)}}\r\n\/* ===== scene 8: contact ===== *\/\r\n#ilmh .ct-box{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;padding:40px 44px;border-radius:26px;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.035) 55%,rgba(255,255,255,.06));backdrop-filter:blur(22px) saturate(1.35);-webkit-backdrop-filter:blur(22px) saturate(1.35);box-shadow:0 40px 90px -40px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.14)}\r\n#ilmh .ct-box > .p-ring{border-radius:26px}\r\n#ilmh .ct-info h3{margin:0 0 12px;font-size:16px;font-weight:800;color:#fff}\r\n#ilmh .ct-info h3 b{color:#5ed6f5}\r\n#ilmh .ct-lead{margin:0 0 18px!important;font-size:13px;line-height:2;color:rgba(255,255,255,.82)}\r\n#ilmh .ct-points{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:12px}\r\n#ilmh .ct-points li{position:relative;padding-right:22px;font-size:13px;line-height:2;color:rgba(255,255,255,.72)}\r\n#ilmh .ct-points li::before{content:\"\";position:absolute;right:2px;top:.72em;width:8px;height:8px;border-radius:50%;background:#5ed6f5;box-shadow:0 0 10px #5ed6f5}\r\n#ilmh .ct-points li:nth-child(2)::before{background:#c8b6f0;box-shadow:0 0 10px #c8b6f0}\r\n#ilmh .ct-points li:nth-child(3)::before{background:#ff8a95;box-shadow:0 0 10px #ff8a95}\r\n#ilmh .ct-points strong{color:#fff;font-weight:750}\r\n#ilmh .ct-mail{margin:0!important;font-size:12.5px;line-height:2;color:rgba(255,255,255,.65)}\r\n#ilmh .ct-mail a{color:#8fe6f8;text-underline-offset:3px}\r\n#ilmh .ct-form{display:flex;flex-direction:column;gap:12px}\r\n#ilmh .ct-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}\r\n#ilmh .ct-form label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.9)}\r\n#ilmh .ct-form input[type=text],#ilmh .ct-form input[type=email],#ilmh .ct-form input[type=tel],#ilmh .ct-form textarea{width:100%;padding:11px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(17,24,37,.55);color:#fff;font:inherit;font-size:13px;font-weight:400;outline:none;transition:border-color .25s,box-shadow .25s}\r\n#ilmh .ct-form textarea{resize:vertical;min-height:110px;line-height:1.9}\r\n#ilmh .ct-form input::placeholder,#ilmh .ct-form textarea::placeholder{color:rgba(255,255,255,.38)}\r\n#ilmh .ct-form input:focus,#ilmh .ct-form textarea:focus{border-color:rgba(94,214,245,.7);box-shadow:0 0 0 3px rgba(94,214,245,.15)}\r\n#ilmh .ct-form .bad{border-color:rgba(255,111,138,.8)!important}\r\n#ilmh .ct-check{flex-direction:row!important;align-items:flex-start;gap:10px!important;font-weight:400!important;font-size:12px!important;line-height:1.9;color:rgba(255,255,255,.75)!important}\r\n#ilmh .ct-check input{margin-top:4px;width:16px;height:16px;accent-color:#5ed6f5;flex-shrink:0}\r\n#ilmh .ct-send{margin-top:4px}\r\n#ilmh .ct-form .ct-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}\r\n#ilmh .ct-status{margin:0!important;min-height:22px;font-size:12.5px;color:#8fe6f8}\r\n#ilmh .ct-status.err{color:#ff8a95}\r\n#ilmh input,#ilmh textarea{cursor:text!important}\r\n#ilmh input[type=checkbox]{cursor:pointer!important}\r\n@media (max-width:900px){#ilmh .ct-box{grid-template-columns:minmax(0,1fr);padding:26px 22px;gap:26px}}\r\n@media (max-width:520px){#ilmh .ct-row{grid-template-columns:1fr}}\r\n@media (prefers-reduced-motion:reduce){#ilmh .p-rv{opacity:1;transform:none;transition:none}}\r\n#ilmh .h-stage .h-arrow,#ilmh .h-stage .h-title,#ilmh .h-stage .h-sel{transition:opacity .5s,visibility .5s}\r\n#ilmh .h-stage.prob .h-arrow,#ilmh .h-stage.prob .h-title,#ilmh .h-stage.prob .h-sel{opacity:0;visibility:hidden}\r\n\r\n\/* ===== language button (replaces the default footer language switcher) ===== *\/\r\nbody:has(#ilmh) .wpml-ls-statics-footer,body:has(#ilmh) .wpml-ls-footer,body:has(#ilmh) [class*=\"wpml-ls-statics-footer\"]{display:none!important}\r\n#ilmh .h-lang{position:fixed;left:16px;top:50%;margin-top:-22px;z-index:45;display:flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 13px;border-radius:999px;direction:ltr;text-decoration:none;color:#fff;font:700 13px\/1 \"Quicksand\",\"Estedad\",system-ui,sans-serif;letter-spacing:.06em;background:rgba(17,24,37,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:auto;transition:background-color .3s,transform .3s,opacity .4s,visibility .4s}\r\n#ilmh .h-lang::before{content:\"\";position:absolute;inset:0;border-radius:999px;padding:1.5px;background:conic-gradient(from var(--ilm-ang),#5ed6f5,#6cc3ff,#9fb8ff,#d9d2f0,#f4b7c6,#ff6f8a,#5ed6f5);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ilmRing 3.2s linear infinite;pointer-events:none}\r\n#ilmh .h-lang svg{width:18px;height:18px;color:#5ed6f5;flex-shrink:0}\r\n#ilmh .h-lang:hover,#ilmh .h-lang:focus-visible{background:rgba(40,52,84,.8);color:#fff;transform:translateX(3px)}\r\n#ilmh .h-lang.gone{opacity:0;visibility:hidden;pointer-events:none}\r\n@media (max-width:1100px){#ilmh .h-lang{left:auto;right:18px;top:74px;margin-top:0;height:40px}}\r\n\r\n\/* ===== English version: same layout, left-to-right text ===== *\/\r\n#ilmh.en{font-family:\"Quicksand\",\"Estedad\",system-ui,-apple-system,\"Segoe UI\",Roboto,sans-serif}\r\n#ilmh.en .h-menu,#ilmh.en .h-mpanel,#ilmh.en .p-body,#ilmh.en .h-modal-body,#ilmh.en .h-modal-box{direction:ltr;text-align:left}\r\n#ilmh.en .h-mi{transform-origin:left center}\r\n#ilmh.en .p-glass h3,#ilmh.en .p-glass h4,#ilmh.en .p-glass h5{line-height:1.45}\r\n#ilmh.en .p-glass p,#ilmh.en .p-list li,#ilmh.en .p-fade li,#ilmh.en .p-checks li,#ilmh.en .p-no li,#ilmh.en .ct-points li,#ilmh.en .pc-card p,#ilmh.en .fq-a p,#ilmh.en .pc-quote p,#ilmh.en .h-modal-body p,#ilmh.en .ct-lead,#ilmh.en .ct-mail{line-height:1.7}\r\n#ilmh.en .p-list li{padding:0 0 0 18px}\r\n#ilmh.en .p-list li::before{right:auto;left:1px}\r\n#ilmh.en .p-fade{padding:0 0 0 16px;border-right:0;border-left:1.5px solid rgba(255,255,255,.12)}\r\n#ilmh.en .p-fade li::before{right:auto;left:-20.5px}\r\n#ilmh.en .p-checks li{padding:0 0 0 24px}\r\n#ilmh.en .p-checks li::before{right:auto;left:0}\r\n#ilmh.en .p-checks li::after{right:auto;left:4.5px}\r\n#ilmh.en .p-result{padding:0 0 0 16px;border-right:0;border-left:2px solid #5ed6f5}\r\n#ilmh.en .pc-quote{padding:16px 22px 16px 28px}\r\n#ilmh.en .pc-quote::before{content:\"\\201C\";right:auto;left:8px}\r\n#ilmh.en .pc-quote p{padding-right:0;padding-left:10px}\r\n#ilmh.en .p-no li{padding:0 0 0 24px}\r\n#ilmh.en .p-no li::before,#ilmh.en .p-no li::after{right:auto;left:3px}\r\n#ilmh.en .fq-q{text-align:left}\r\n#ilmh.en .fq-a p{padding:0 16px 16px 50px}\r\n#ilmh.en .ct-points li{padding:0 0 0 22px}\r\n#ilmh.en .ct-points li::before{right:auto;left:2px}\r\n#ilmh.en .h-modal-x{left:auto;right:14px}\r\n#ilmh.en .pj-btn svg,#ilmh.en .p-next-link svg,#ilmh.en .p-follow svg{transform:scaleX(-1)}\r\n#ilmh.en .h-fallback{direction:ltr}\r\n@media (min-width:1101px){\r\n#ilmh.en .h-logo{right:auto;left:56px}\r\n#ilmh.en .h-menu{right:auto;left:68px}\r\n#ilmh.en .h-top.pre .h-menu li:not(:first-child){transform:translateX(-16px)}\r\n#ilmh.en .p-glass{right:auto;left:var(--menuR,360px)}\r\n#ilmh.en .p-glass{transform:translate(-40px,-50%)}\r\n#ilmh.en .p-glass.show{transform:translate(0,-50%)}\r\n#ilmh.en .p-glass.p-proc{left:50%;right:auto;transform:translate(calc(-50% - 40px),-50%)}\r\n#ilmh.en .p-glass.p-proc.show{transform:translate(-50%,-50%)}\r\n#ilmh.en .h-pct{left:auto;right:56px}\r\n#ilmh.en .h-lang{left:auto;right:16px}\r\n#ilmh.en .h-lang:hover,#ilmh.en .h-lang:focus-visible{transform:translateX(-3px)}\r\n}\r\n<\/style>\r\n\r\n<div id=\"ilmh\" class=\"en\" lang=\"en\">\r\n  <a class=\"h-lang\" href=\"\/\" hreflang=\"fa\" lang=\"fa\" title=\"\u0641\u0627\u0631\u0633\u06cc\" aria-label=\"\u0646\u0633\u062e\u0647 \u0641\u0627\u0631\u0633\u06cc\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M3 12h18M12 3c3.2 3.4 3.2 14.6 0 18M12 3c-3.2 3.4-3.2 14.6 0 18\"\/><\/svg><span>FA<\/span><\/a>\r\n  <div class=\"h-top pre\">\r\n        <a class=\"h-logo\" href=\"#ilmh\" aria-label=\"ilmora \u2014 go to the top of the page\"><img src=\"https:\/\/webvibe.digital\/wp-content\/uploads\/2026\/09\/ilmora-logo-header.png\" alt=\"ilmora \u2014 Learn \u00b7 Practice \u00b7 Grow\" width=\"220\" decoding=\"async\"><\/a>\r\n\r\n        <nav aria-label=\"Main menu\"><ul class=\"h-menu\">\r\n          <li><a class=\"h-mi is-on\" href=\"#ilmh\" aria-current=\"page\"><span class=\"n\">1<\/span><span class=\"l\"><span class=\"l-pre\">Enter the portal<\/span><span class=\"l-main\">ilmora<\/span><\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-problem\"><span class=\"n\">2<\/span><span class=\"l\" data-t=\"What is the main problem?\">What is the main problem?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-solution\"><span class=\"n\">3<\/span><span class=\"l\" data-t=\"How do we solve this problem?\">How do we solve this problem?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-process\"><span class=\"n\">4<\/span><span class=\"l\" data-t=\"What is the work process?\">What is the work process?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-projects\"><span class=\"n\">5<\/span><span class=\"l\" data-t=\"Which project do you need?\">Which project do you need?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-notfor\"><span class=\"n\">6<\/span><span class=\"l\" data-t=\"Who do we not work for?\">Who do we not work for?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-faq\"><span class=\"n\">7<\/span><span class=\"l\" data-t=\"Frequently asked questions\">Frequently asked questions<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-contact\"><span class=\"n\">8<\/span><span class=\"l\" data-t=\"Let us talk about your project!\">Let us talk about your project!<\/span><\/a><\/li>\r\n          <li class=\"h-exli\"><div class=\"h-extra\">\r\n            <div class=\"h-soc\">\r\n              <a class=\"h-sbtn\" href=\"https:\/\/t.me\/bdvista\" target=\"_blank\" rel=\"noopener\">\r\n                <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M21.5 3.6 2.9 10.8c-1 .4-1 1.6 0 1.9l4.6 1.5 1.8 5.5c.2.7 1.1.9 1.6.4l2.6-2.4 4.7 3.5c.6.4 1.4.1 1.6-.6L22.9 5c.2-1-.6-1.8-1.4-1.4ZM9.9 14.3l-.5 3.5-1.2-3.9 9.6-6.2-7.9 6.6Z\" fill=\"currentColor\"\/><\/svg>\r\n                <span>Telegram<\/span><\/a>\r\n              <a class=\"h-sbtn\" href=\"https:\/\/wa.me\/989351284467\" target=\"_blank\" rel=\"noopener\">\r\n                <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 2.5a9.4 9.4 0 0 0-8.1 14.2L2.6 21.5l4.9-1.3A9.4 9.4 0 1 0 12 2.5Zm0 17.1c-1.4 0-2.8-.4-4-1.1l-.3-.2-2.9.8.8-2.8-.2-.3A7.7 7.7 0 1 1 12 19.6Zm4.2-5.8c-.2-.1-1.4-.7-1.6-.8-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.5.1-.7-.3-2.1-1-3-2.7-.2-.3 0-.4.1-.6l.4-.5.2-.4v-.4l-.7-1.8c-.2-.5-.4-.4-.5-.4h-.5c-.2 0-.5.1-.7.3-.2.3-.9.9-.9 2.2s.9 2.5 1 2.7c.1.2 1.8 2.8 4.4 3.9 1.6.7 2.2.7 3 .6.5-.1 1.4-.6 1.6-1.1.2-.6.2-1 .1-1.1l-.3-.2Z\" fill=\"currentColor\"\/><\/svg>\r\n                <span>WhatsApp<\/span><\/a>\r\n            <\/div>\r\n            <p class=\"h-note\">Use these for short questions. We reply in writing within one working day. To get a scope and a price, use the form in the section \u201cLet us talk about your project!\u201d.<\/p>\r\n            <p class=\"h-copy\">\u00a9 2026 ilmora. All rights reserved. <button type=\"button\" class=\"h-copy-link\" data-open-copy>Copyright terms<\/button><\/p>\r\n          <\/div><\/li>\r\n        <\/ul><\/nav>\r\n        <button class=\"h-mbtn\" type=\"button\" aria-expanded=\"false\" aria-controls=\"h-mpanel\">Menu<i><b><\/b><b><\/b><\/i><\/button>\r\n        <div class=\"h-mpanel\" id=\"h-mpanel\" role=\"dialog\" aria-label=\"Menu\">\r\n          <button class=\"h-mclose\" type=\"button\">Close<\/button>\r\n          <ul style=\"list-style:none;margin:0;padding:0\">\r\n          <li><a class=\"h-mi is-on\" href=\"#ilmh\" aria-current=\"page\"><span class=\"n\">1<\/span><span class=\"l\"><span class=\"l-pre\">Enter the portal<\/span><span class=\"l-main\">ilmora<\/span><\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-problem\"><span class=\"n\">2<\/span><span class=\"l\" data-t=\"What is the main problem?\">What is the main problem?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-solution\"><span class=\"n\">3<\/span><span class=\"l\" data-t=\"How do we solve this problem?\">How do we solve this problem?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-process\"><span class=\"n\">4<\/span><span class=\"l\" data-t=\"What is the work process?\">What is the work process?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-projects\"><span class=\"n\">5<\/span><span class=\"l\" data-t=\"Which project do you need?\">Which project do you need?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-notfor\"><span class=\"n\">6<\/span><span class=\"l\" data-t=\"Who do we not work for?\">Who do we not work for?<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-faq\"><span class=\"n\">7<\/span><span class=\"l\" data-t=\"Frequently asked questions\">Frequently asked questions<\/span><\/a><\/li>\r\n          <li><a class=\"h-mi\" href=\"#ilm-contact\"><span class=\"n\">8<\/span><span class=\"l\" data-t=\"Let us talk about your project!\">Let us talk about your project!<\/span><\/a><\/li>\r\n          <li class=\"h-exli\"><div class=\"h-extra\">\r\n            <div class=\"h-soc\">\r\n              <a class=\"h-sbtn\" href=\"https:\/\/t.me\/bdvista\" target=\"_blank\" rel=\"noopener\">\r\n                <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M21.5 3.6 2.9 10.8c-1 .4-1 1.6 0 1.9l4.6 1.5 1.8 5.5c.2.7 1.1.9 1.6.4l2.6-2.4 4.7 3.5c.6.4 1.4.1 1.6-.6L22.9 5c.2-1-.6-1.8-1.4-1.4ZM9.9 14.3l-.5 3.5-1.2-3.9 9.6-6.2-7.9 6.6Z\" fill=\"currentColor\"\/><\/svg>\r\n                <span>Telegram<\/span><\/a>\r\n              <a class=\"h-sbtn\" href=\"https:\/\/wa.me\/989351284467\" target=\"_blank\" rel=\"noopener\">\r\n                <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M12 2.5a9.4 9.4 0 0 0-8.1 14.2L2.6 21.5l4.9-1.3A9.4 9.4 0 1 0 12 2.5Zm0 17.1c-1.4 0-2.8-.4-4-1.1l-.3-.2-2.9.8.8-2.8-.2-.3A7.7 7.7 0 1 1 12 19.6Zm4.2-5.8c-.2-.1-1.4-.7-1.6-.8-.2-.1-.4-.1-.5.1l-.7.9c-.1.2-.3.2-.5.1-.7-.3-2.1-1-3-2.7-.2-.3 0-.4.1-.6l.4-.5.2-.4v-.4l-.7-1.8c-.2-.5-.4-.4-.5-.4h-.5c-.2 0-.5.1-.7.3-.2.3-.9.9-.9 2.2s.9 2.5 1 2.7c.1.2 1.8 2.8 4.4 3.9 1.6.7 2.2.7 3 .6.5-.1 1.4-.6 1.6-1.1.2-.6.2-1 .1-1.1l-.3-.2Z\" fill=\"currentColor\"\/><\/svg>\r\n                <span>WhatsApp<\/span><\/a>\r\n            <\/div>\r\n            <p class=\"h-note\">Use these for short questions. We reply in writing within one working day. To get a scope and a price, use the form in the section \u201cLet us talk about your project!\u201d.<\/p>\r\n            <p class=\"h-copy\">\u00a9 2026 ilmora. All rights reserved. <button type=\"button\" class=\"h-copy-link\" data-open-copy>Copyright terms<\/button><\/p>\r\n          <\/div><\/li>\r\n          <\/ul>\r\n        <\/div>\r\n\r\n  <\/div>\r\n  <div class=\"h-modal\" id=\"h-copy-modal\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"h-copy-t\" hidden>\r\n    <div class=\"h-modal-bg\" data-close-copy><\/div>\r\n    <div class=\"h-modal-box\">\r\n      <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n      <button type=\"button\" class=\"h-modal-x\" data-close-copy aria-label=\"Close\">\u00d7<\/button>\r\n      <div class=\"h-modal-body\">\r\n        <h2 id=\"h-copy-t\">Intellectual property notice<\/h2>\r\n        <p>All text, graphics, images, videos, design structure and ideas, interface and user experience, portfolio work, learning material and other creative parts of this website belong to the owner of the \u201cilmora\u201d website. The law protects them under intellectual property rights and authors\u2019 rights.<\/p>\r\n        <p>You must not copy, republish, reproduce, adapt, change, distort, use commercially, offer or publish all or part of this content or work without written permission from the rights owner. You must also not use the special ideas and designs of this website without that permission. These rights are reserved for the authors and the rights owners, including under the Iranian Law on the Protection of the Rights of Authors, Composers and Artists (1969), in particular Articles 17, 19, 21, 23 and 29.<\/p>\r\n        <p>If we find use without written permission, the rights owner can take the matter to the legal authorities. The owner can also ask for the use and publication to stop, claim damages and take other legal action as needed.<\/p>\r\n        <p><strong>Use of the content of this website does not give any permission to copy, reproduce, adapt or use it commercially.<\/strong><\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n      <div class=\"h-cursor\" data-m=\"star\" aria-hidden=\"true\">\r\n        <svg class=\"c-star\" viewBox=\"0 0 24 24\"><path d=\"M12 0C13 7 17 11 24 12C17 13 13 17 12 24C11 17 7 13 0 12C7 11 11 7 12 0Z\" fill=\"#5ED6F5\"\/><\/svg>\r\n        <svg class=\"c-hand\" viewBox=\"0 0 64 64\"><g fill=\"#FF6F8A\" stroke=\"#FF6F8A\" stroke-linecap=\"round\"><path d=\"M16 36c0-6 4-9 9-9h17c6 0 10 4 10 9v6c0 10-7 17-17 17h-3c-9 0-16-7-16-16z\" stroke=\"none\"\/><path d=\"M20 42 9 30\" stroke-width=\"9\" fill=\"none\"\/><path d=\"M24 32 21.5 12\" stroke-width=\"9\" fill=\"none\"\/><path d=\"M32.5 31V7\" stroke-width=\"9.5\" fill=\"none\"\/><path d=\"M41 32 43 11\" stroke-width=\"9\" fill=\"none\"\/><path d=\"M48 36 52 19\" stroke-width=\"8.5\" fill=\"none\"\/><\/g><\/svg>\r\n        <svg class=\"c-point\" viewBox=\"0 0 64 64\"><g fill=\"#FF6F8A\" stroke=\"#FF6F8A\" stroke-linecap=\"round\"><path d=\"M27 29V8\" stroke-width=\"10\" fill=\"none\"\/><path d=\"M21 31c0-3 2-5 5-5h16c4 0 7 3 7 7v6c0 6-5 10-11 10h-6c-6 0-11-5-11-11z\" stroke=\"none\"\/><circle cx=\"35.5\" cy=\"27.5\" r=\"5\" stroke=\"none\"\/><circle cx=\"42.5\" cy=\"29\" r=\"4.6\" stroke=\"none\"\/><path d=\"M23 41 14.5 31.5\" stroke-width=\"8.5\" fill=\"none\"\/><rect x=\"22.5\" y=\"51\" width=\"24\" height=\"7.5\" rx=\"3.5\" stroke=\"none\"\/><\/g><\/svg>\r\n        <div class=\"c-burst\"><i style=\"--a:-90deg\"><\/i><i style=\"--a:-54deg\"><\/i><i style=\"--a:-18deg\"><\/i><i style=\"--a:18deg\"><\/i><i style=\"--a:54deg\"><\/i><i style=\"--a:90deg\"><\/i><\/div>\r\n      <\/div>\r\n\r\n  <div class=\"h-track\">\r\n    <div class=\"h-stick\">\r\n      <div class=\"h-neb\" aria-hidden=\"true\"><i class=\"n1\"><\/i><i class=\"n2\"><\/i><i class=\"n3\"><\/i><i class=\"n4\"><\/i><i class=\"n5\"><\/i><\/div>\r\n      <canvas aria-hidden=\"true\"><\/canvas>\r\n      <div class=\"h-vig\"><\/div>\r\n      <div class=\"h-grain\"><\/div>\r\n      <div class=\"h-flash\"><\/div>\r\n\r\n      <div class=\"h-ui\">\r\n        <div class=\"h-intro\">\r\n          <h1>Learning starts on the other side of this gate<\/h1>\r\n          <button class=\"h-scroll\" type=\"button\" aria-label=\"Enter the gate\">\r\n            <span class=\"h-scroll-t\">Scroll to enter<\/span>\r\n            <span class=\"h-mouse\" aria-hidden=\"true\"><span class=\"h-wheel\"><\/span><\/span>\r\n            <span class=\"h-chev\" aria-hidden=\"true\"><b><\/b><b><\/b><b><\/b><\/span>\r\n          <\/button>\r\n        <\/div>\r\n\r\n        <div class=\"h-stage\">\r\n          <button class=\"h-arrow h-prev\" type=\"button\" aria-label=\"Previous model\">\r\n            <svg viewBox=\"0 0 72 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.4\"><path d=\"M0 13H70L58 3\"\/><\/svg>\r\n          <\/button>\r\n          <button class=\"h-arrow h-next\" type=\"button\" aria-label=\"Next model\">\r\n            <svg viewBox=\"0 0 72 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.4\"><path d=\"M72 13H2L14 3\"\/><\/svg>\r\n          <\/button>\r\n          <div class=\"h-title\" aria-live=\"polite\"><\/div>\r\n          <div class=\"h-sel\">\r\n            <button class=\"h-side\" type=\"button\" data-go=\"1\"><\/button>\r\n            <div class=\"h-cur\"><\/div>\r\n            <button class=\"h-side\" type=\"button\" data-go=\"-1\"><\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <article class=\"p-glass\" data-scene=\"problem\" data-next=\"#ilm-solution\" aria-labelledby=\"p-h\" aria-hidden=\"true\">\r\n          <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n\r\n          <div class=\"p-body\">\r\n          <h3 id=\"p-h\" class=\"p-rv\"><b>2-<\/b> What is the main problem?<\/h3>\r\n          <h4 class=\"p-rv\">Most students do not finish the course!<\/h4>\r\n          <p class=\"p-rv\">A student signs up, enters the course and goes through the first sessions with energy.<\/p>\r\n          <p class=\"p-turn p-rv\">But what happens next?<\/p>\r\n          <ul class=\"p-list p-rv\">\r\n            <li>The learning content becomes repetitive.<\/li>\r\n            <li>The videos become long and dull.<\/li>\r\n            <li>The screen is full of text and slides.<\/li>\r\n            <li>Slowly, the student loses the link with the content.<\/li>\r\n          <\/ul>\r\n          <ol class=\"p-fade p-rv\">\r\n            <li>The student gets tired.<\/li>\r\n            <li>The student moves one session to tomorrow.<\/li>\r\n            <li>Then a week passes.<\/li>\r\n            <li>In the end, the course that started with energy is <em>left unfinished.<\/em><\/li>\r\n          <\/ol>\r\n          <div class=\"p-call p-rv\">\r\n            <strong>This is not only a learning problem.<\/strong>\r\n            <p>For a university or an academy, each student who leaves a course means a <mark>lower completion rate<\/mark>, <mark>less participation<\/mark> and <mark>a lost chance of new enrolment<\/mark> in the next courses!<\/p>\r\n          <\/div>\r\n          <a class=\"p-next-link\" href=\"#ilm-solution\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-sol\" data-scene=\"solution\" data-next=\"#ilm-process\" aria-labelledby=\"s-h\" aria-hidden=\"true\">\r\n          <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n\r\n          <div class=\"p-body\">\r\n          <h3 id=\"s-h\" class=\"p-rv\"><b>3-<\/b> How do we solve this problem?<\/h3>\r\n          <h4 class=\"p-rv\">We design learning content for the way people really learn.<\/h4>\r\n          <p class=\"p-rv\">Good learning content does more than pass on information. The way you show the content also changes the focus, the understanding and the memory of the student.<\/p>\r\n          <p class=\"p-rv\">We redesign the learning content of universities and academies. We use <strong class=\"c\">animation<\/strong>, <strong class=\"c\">visual storytelling<\/strong> and <strong class=\"c\">interaction<\/strong> to change complex ideas into a structure that is easy for the student to follow and understand.<\/p>\r\n          <p class=\"p-turn p-rv\">We do not show one long line of text, slides and videos. We organise the information by the nature of each topic:<\/p>\r\n          <ul class=\"p-checks p-rv\">\r\n            <li>Concepts appear in a visual form,<\/li>\r\n            <li>Processes are explained step by step<\/li>\r\n            <li>and interactive elements join the lesson where they help.<\/li>\r\n          <\/ul>\r\n          <p class=\"p-rv\">This approach changes your learning content from <span class=\"p-from\">a fixed set of videos<\/span> into <span class=\"p-to\">a structured and living learning system<\/span>.<\/p>\r\n          <div class=\"p-result p-rv\">\r\n            <p>As a result, the student does not only get more information.<\/p>\r\n            <p><strong>The learning path becomes clearer, easier to follow and easier to understand.<\/strong><\/p>\r\n          <\/div>\r\n          <div class=\"p-call p-call-c p-rv\">\r\n            <p>For the university or the academy, this means content that can <mark>keep the student on the course path<\/mark> and <mark>improve the completion rate.<\/mark><\/p>\r\n          <\/div>\r\n          <a class=\"p-next-link\" href=\"#ilm-process\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-proc\" data-scene=\"process\" data-next=\"#ilm-projects\" aria-labelledby=\"w-h\" aria-hidden=\"true\">\r\n          <div class=\"p-body\">\r\n\r\n          <header class=\"pc-head p-rv\">\r\n            <h3 id=\"w-h\"><b>4-<\/b> What is the work process?<\/h3>\r\n            <h4>We do not start a project by building. We start by understanding your need.<\/h4>\r\n          <\/header>\r\n          <ol class=\"pc-grid\">\r\n            <li class=\"pc-card\"><div class=\"pc-top\"><span class=\"pc-n\">01<\/span><span class=\"pc-bar\"><i style=\"width:16.67%\"><\/i><\/span><\/div>\r\n              <h5>Talk and project discovery<\/h5>\r\n              <p>First, we talk about your academy, your audience, your learning goals, your existing content and your technical needs. In this step, we define the general structure of the project and the features you need.<\/p><\/li>\r\n            <li class=\"pc-card\"><div class=\"pc-top\"><span class=\"pc-n\">02<\/span><span class=\"pc-bar\"><i style=\"width:33.33%\"><\/i><\/span><\/div>\r\n              <h5>Design and agreement<\/h5>\r\n              <p>We design the platform structure and the user experience from the defined needs. After you review and approve the design, we state the project scope, the features, the schedule and the cost clearly.<\/p><\/li>\r\n            <li class=\"pc-card\"><div class=\"pc-top\"><span class=\"pc-n\">03<\/span><span class=\"pc-bar\"><i style=\"width:50%\"><\/i><\/span><\/div>\r\n              <h5>Contract and project start<\/h5>\r\n              <p>After the final agreement and the signed contract, the project starts officially. We build the system on the approved structure.<\/p><\/li>\r\n            <li class=\"pc-card\"><div class=\"pc-top\"><span class=\"pc-n\">04<\/span><span class=\"pc-bar\"><i style=\"width:66.67%\"><\/i><\/span><\/div>\r\n              <h5>Build, review and handover<\/h5>\r\n              <p>We build the system and prepare it for launch. During the project, we check the main parts, so that the result matches the first agreement. After the final approval, we hand the project over to you.<\/p><\/li>\r\n            <li class=\"pc-card\"><div class=\"pc-top\"><span class=\"pc-n\">05<\/span><span class=\"pc-bar\"><i style=\"width:83.33%\"><\/i><\/span><\/div>\r\n              <h5>Final payment and full transfer<\/h5>\r\n              <p>After the final payment, you get the access rights, the files, the technical information and the assets of the project. You keep the ownership of the system and its data.<\/p><\/li>\r\n            <li class=\"pc-card pc-opt\"><div class=\"pc-top\"><span class=\"pc-n\">06<\/span><span class=\"pc-bar\"><i style=\"width:100%\"><\/i><\/span><\/div>\r\n              <h5>Maintenance and support (optional)<\/h5>\r\n              <p>For three months from the handover day, you get free support from us. After this time, you can choose a yearly \u201cmaintenance and support\u201d contract. This service can include technical updates, backups, fixes and small changes.<\/p><\/li>\r\n          <\/ol>\r\n          <div class=\"pc-foot p-rv\">\r\n            <blockquote class=\"pc-quote\"><p><strong>Support is a continued partnership. It is not a condition of ownership, and the system does not need it to keep running.<\/strong><\/p>\r\n              <p>You can continue the project without us. Or, if you are happy, you can give us the maintenance and the development.<\/p><\/blockquote>\r\n          <\/div>\r\n          <a class=\"p-next-link\" href=\"#ilm-projects\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-proc p-proj\" data-scene=\"projects\" data-next=\"#ilm-notfor\" aria-labelledby=\"j-h\" aria-hidden=\"true\">\r\n          <div class=\"p-body\">\r\n          <header class=\"pc-head p-rv\">\r\n            <h3 id=\"j-h\"><b>5-<\/b> Which project do you need?<\/h3>\r\n          <\/header>\r\n          <ol class=\"pj-grid\">\r\n            <li class=\"pc-card pj-card\">\r\n              <span class=\"pj-tag\">Path 1<\/span>\r\n              <h5>Course sales<\/h5>\r\n              <p>Use this path when your learning content is ready. You only need a professional system to sell and deliver it.<\/p>\r\n              <ul class=\"p-checks\">\r\n                <li>Course catalogue and categories<\/li>\r\n                <li>Sign-up and online payment<\/li>\r\n                <li>Student account<\/li>\r\n                <li>Certificate after course completion<\/li>\r\n                <li>Course pre-sale, if you need it<\/li>\r\n                <li>E-Namad trust badge and payment gateway setup<\/li>\r\n              <\/ul>\r\n              <div class=\"pj-foot\"><span class=\"pj-price\">Price is set after we review the project needs<\/span>\r\n                <a class=\"pj-btn\" href=\"\/en\/store-platform\/\">Request a course store<svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg><\/a><\/div>\r\n            <\/li>\r\n            <li class=\"pc-card pj-card\">\r\n              <span class=\"pj-tag\">Path 2<\/span>\r\n              <h5>Learning platform<\/h5>\r\n              <p>For academies that need a complete learning system to manage their courses and students.<\/p>\r\n              <ul class=\"p-checks\">\r\n                <li>Learning structure and modular courses<\/li>\r\n                <li>Student sign-up and management<\/li>\r\n                <li>Progress and completion tracking<\/li>\r\n                <li>Learning records and student performance<\/li>\r\n                <li>Exams and assessment<\/li>\r\n                <li>Certificates and course renewal reminders<\/li>\r\n              <\/ul>\r\n              <div class=\"pj-foot\"><span class=\"pj-price\">Price is set after we review the project needs<\/span>\r\n                <a class=\"pj-btn\" href=\"\/en\/academy-platform\/\">Request a learning platform<svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg><\/a><\/div>\r\n            <\/li>\r\n            <li class=\"pc-card pj-card pj-top\">\r\n              <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n              <span class=\"pj-tag\">Path 3<\/span>\r\n              <h5>Interactive academy<\/h5>\r\n              <p>For institutes that want to teach beyond video and traditional content.<\/p>\r\n              <ul class=\"p-checks\">\r\n                <li>All features of the learning platform<\/li>\r\n                <li>Interactive and animated lessons<\/li>\r\n                <li>Visual display of complex ideas and processes<\/li>\r\n                <li>Skill and knowledge assessment<\/li>\r\n                <li>Interactive learning paths<\/li>\r\n                <li>Reports and analysis of student performance<\/li>\r\n              <\/ul>\r\n              <div class=\"pj-foot\"><span class=\"pj-price\">Price is set after we review the project needs<\/span>\r\n                <a class=\"pj-btn\" href=\"\/en\/interactive-academy-platform\/\">See the demos<svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg><\/a><\/div>\r\n            <\/li>\r\n          <\/ol>\r\n          <a class=\"p-next-link\" href=\"#ilm-notfor\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-not\" data-scene=\"notfor\" data-next=\"#ilm-faq\" aria-labelledby=\"n-h\" aria-hidden=\"true\">\r\n          <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n          <div class=\"p-body\">\r\n          <h3 id=\"n-h\" class=\"p-rv\"><b>6-<\/b> Who do we not work for?<\/h3>\r\n          <h4 class=\"p-rv\">We do not accept every project. If a project is not right for us, we say so in the first reply, not after a week of meetings.<\/h4>\r\n          <ul class=\"p-no p-rv\">\r\n            <li>General online shops and sites that only take appointment bookings<\/li>\r\n            <li>Company profile sites and one-page portfolios<\/li>\r\n            <li>Ad campaigns, social media management and marketing content<\/li>\r\n            <li>Rescue of a half-built platform that the previous builder left<\/li>\r\n            <li>Projects that must be cheap and ready in a few days<\/li>\r\n          <\/ul>\r\n          <div class=\"p-result p-rv\">\r\n            <p><strong>We do only one thing: we build learning platforms for universities, academies and medical skills training centres.<\/strong><\/p>\r\n          <\/div>\r\n          <p class=\"p-rv\">We say no to other work because we do this one job well. We spend all our time on one question: how can a teacher teach a skill online, and how can a student reach the <strong class=\"c\">last session<\/strong>, not only the fourth?<\/p>\r\n          <p class=\"p-rv\">We already know the patterns, the structures and the mistakes on this path. So your project starts from experience, not from a blank page.<\/p>\r\n          <div class=\"p-call p-rv\">\r\n            <strong>If your project is in the list above:<\/strong>\r\n            <p>A general web design studio can serve you better and charge less. Still, send us a message and we will suggest a good option. A bad fit costs you <mark>months of time<\/mark> and costs us <mark>our reputation<\/mark>.<\/p>\r\n          <\/div>\r\n          <a class=\"p-next-link\" href=\"#ilm-faq\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-faq\" data-scene=\"faq\" data-next=\"#ilm-contact\" aria-labelledby=\"f-h\" aria-hidden=\"true\">\r\n          <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n          <div class=\"p-body\">\r\n          <h3 id=\"f-h\" class=\"p-rv\"><b>7-<\/b> Frequently asked questions<\/h3>\r\n          <ol class=\"fq-list p-rv\">\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">01<\/span><span class=\"fq-t\">Who writes the course content?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>You do. You are the expert in this field, and the teaching belongs to you. We turn your content into lessons and we build the modules. We tell you exactly what we need from you, and when.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">02<\/span><span class=\"fq-t\">How much does the project cost?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>A fixed price. We send it to you within two working days after we get the project information. The price does not change later, unless you ask for a new feature. Even then, you see the extra cost before you agree.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">03<\/span><span class=\"fq-t\">How long does it take to build the platform?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>A course-selling system usually takes a few weeks. A full interactive academy takes more time, because we make the lessons one by one. In the project scope document, you get a step-by-step schedule, not a vague promise.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">04<\/span><span class=\"fq-t\">Do I need to know technical things?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>No. You only need to know your subject and to know where students have problems. For each decision that needs your opinion, we write it in simple words, with our advice.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">05<\/span><span class=\"fq-t\">Can you use the videos I already have?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Yes. Your videos become the main part of the course. We add interactive parts where a normal video cannot show depth, angle or the order of steps. We do not throw away anything that you already paid for.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">06<\/span><span class=\"fq-t\">What if I only have an idea and no content yet?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Then start with the \u201cCourse sales\u201d path and one short course. Publish it and see where students stop. Then build the full academy on real data, not on guesses.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">07<\/span><span class=\"fq-t\">Do you work with academies outside Iran?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Yes. We do most of the work online and in writing. We solve time differences by working in writing, not with many meetings. So the process does not depend on phone calls.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">08<\/span><span class=\"fq-t\">Can the platform have more than one language?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Yes. The platform can run in more than one language. You can also talk to us in the language that is easier for you. The project information, the scope and the feedback all work in writing.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">09<\/span><span class=\"fq-t\">Who owns the platform and the student data?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>You do, from the first day. The hosting account, the domain, the database and the course files are all in your name. At any time, you can export everything without asking us.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">10<\/span><span class=\"fq-t\">Can I move the hosting later?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Yes. The platform does not depend on one company or one region. We also give you a transfer guide at handover. To move the whole academy takes a few hours of work, not a rebuild.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">11<\/span><span class=\"fq-t\">Is the maintenance and support contract required?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>No. The contract covers updates, backups and small changes. It is only for your convenience. If you stop it at any time, the academy continues to work exactly as on the day before.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">12<\/span><span class=\"fq-t\">How do students pay?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>They pay through the payment gateway that your academy already has, or through a gateway that you register in your name. The money goes directly to your account. We never stand between you and your students.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">13<\/span><span class=\"fq-t\">Can students get a certificate?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Yes. The system issues the certificate after the course is complete. It has a code that people can check. The completion records stay in your system, for course renewals and for any accreditation body that asks for them.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">14<\/span><span class=\"fq-t\">What if I want changes after launch?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Small changes are part of the maintenance contract. We price each bigger change like the main project: a written scope and a fixed price, before any work starts.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">15<\/span><span class=\"fq-t\">What happens if we stop working together?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Everything stays with you and no part of the work stops. We give you the accounts, the passwords and the transfer guide, even if you go to another person or team to continue the work.<\/p><\/div><\/div><\/li>\r\n            <li class=\"fq-item\"><button type=\"button\" class=\"fq-q\" aria-expanded=\"false\"><span class=\"fq-n\">16<\/span><span class=\"fq-t\">How do I start?<\/span><i aria-hidden=\"true\"><\/i><\/button>\r\n              <div class=\"fq-a\"><div><p>Fill in the project form in the section \u201cLet us talk about your project!\u201d. It has no obligation and you do not need a phone call. Within two working days, you get the scope and the price.<\/p><\/div><\/div><\/li>\r\n          <\/ol>\r\n          <a class=\"p-next-link\" href=\"#ilm-contact\">Next step\r\n            <svg width=\"22\" height=\"12\" viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/a>\r\n          <\/div>\r\n          <div class=\"p-follow\" aria-hidden=\"true\">\r\n            <span>Next step<\/span>\r\n            <svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"#fff\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg>\r\n          <\/div>\r\n        <\/article>\r\n        <article class=\"p-glass p-proc p-contact\" data-scene=\"contact\" aria-labelledby=\"c-h\" aria-hidden=\"true\">\r\n          <div class=\"p-body\">\r\n          <div class=\"ct-box\">\r\n            <span class=\"p-ring\" aria-hidden=\"true\"><\/span>\r\n            <div class=\"ct-info p-rv\">\r\n              <h3 id=\"c-h\"><b>8-<\/b> Tell us about your academy.<\/h3>\r\n              <p class=\"ct-lead\">Fill in the form. Within two working days, you get the written scope with a fixed price.<\/p>\r\n              <ul class=\"ct-points\">\r\n                <li><strong>No phone calls. No forced meetings.<\/strong> Everything is in writing. So, if it is easier for you, you can reply at 2 a.m.<\/li>\r\n                <li><strong>No obligation.<\/strong> The scope and the price belong to you. If you want a second opinion, take them to another studio.<\/li>\r\n                <li><strong>No sales follow-ups.<\/strong> We reply only one time. If you do not answer, we take that as your answer and we do not bother you again.<\/li>\r\n              <\/ul>\r\n              <p class=\"ct-mail\">Do you prefer email? Write to <a href=\"mailto:info@ilmora.studio\" dir=\"ltr\">info@ilmora.studio<\/a> and tell us what you teach.<\/p>\r\n            <\/div>\r\n            <form class=\"ct-form p-rv\" novalidate>\r\n              <div class=\"ct-row\">\r\n                <label>First name<input name=\"first_name\" type=\"text\" autocomplete=\"given-name\" placeholder=\"First name\" required><\/label>\r\n                <label>Last name<input name=\"last_name\" type=\"text\" autocomplete=\"family-name\" placeholder=\"Last name\" required><\/label>\r\n              <\/div>\r\n              <div class=\"ct-row\">\r\n                <label>Email<input name=\"email\" type=\"email\" dir=\"ltr\" autocomplete=\"email\" placeholder=\"your@mail.com\" required><\/label>\r\n                <label>Phone<input name=\"phone\" type=\"tel\" dir=\"ltr\" inputmode=\"tel\" autocomplete=\"tel\" placeholder=\"0912 000 0000\" required><\/label>\r\n              <\/div>\r\n              <label>Message<textarea name=\"message\" rows=\"5\" placeholder=\"Tell us about your academy, your courses and your needs\" required><\/textarea><\/label>\r\n              <label class=\"ct-check\"><input name=\"consent\" type=\"checkbox\" required><span>I agree that you use this information only to review my project.<\/span><\/label>\r\n              <input class=\"ct-hp\" name=\"website\" type=\"text\" tabindex=\"-1\" autocomplete=\"off\" aria-hidden=\"true\">\r\n              <input name=\"lang\" type=\"hidden\" value=\"en\">\r\n              <button type=\"submit\" class=\"pj-btn ct-send\">Send contact request<svg viewBox=\"0 0 26 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M25 7H2M8 1 2 7l6 6\"\/><\/svg><\/button>\r\n              <p class=\"ct-status\" aria-live=\"polite\"><\/p>\r\n            <\/form>\r\n          <\/div>\r\n          <\/div>\r\n        <\/article>\r\n\r\n        <div class=\"h-pct\" aria-hidden=\"true\"><span>0%<\/span><i><b><\/b><\/i><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"h-load\">Preparing the gate\u2026<\/div>\r\n      <div class=\"h-fallback\"><div><strong style=\"font-size:28px\">ilmora<\/strong><br>Your browser cannot show this animation.<\/div><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  var root=document.getElementById('ilmh'); if(!root) return;\r\n  function fitLogo(){\r\n    var w=root.querySelector('.h-word'), g=root.querySelector('.h-tag'); if(!w||!g) return;\r\n    w.style.fontSize='';\r\n    var gs=parseFloat(getComputedStyle(g).fontSize), ls=parseFloat(getComputedStyle(g).letterSpacing)||gs*.34;\r\n    var tw=g.getBoundingClientRect().width-ls-parseFloat(getComputedStyle(g).paddingLeft);\r\n    var fs=parseFloat(getComputedStyle(w).fontSize), ww=w.getBoundingClientRect().width;\r\n    if(ww>0&&tw>0) w.style.fontSize=(fs*tw\/ww).toFixed(2)+'px';\r\n  }\r\n  fitLogo(); if(document.fonts&&document.fonts.ready) document.fonts.ready.then(fitLogo);\r\n  \/* keep text panels at least 15px clear of the menu *\/\r\n  function measureMenu(){\r\n    var m=root.querySelector('.h-menu'); if(!m||!m.offsetWidth) return;\r\n    var lg=root.querySelector('.h-logo img'); if(lg&&lg.offsetHeight) m.style.top=Math.round(lg.getBoundingClientRect().bottom+22)+'px';\r\n    var r=parseFloat(getComputedStyle(m).left)||68;\r\n    root.style.setProperty('--menuR',Math.ceil(r+m.offsetWidth*1.05+12+15)+'px');\r\n  }\r\n  measureMenu(); window.addEventListener('resize',measureMenu);\r\n  var lgImg=root.querySelector('.h-logo img'); if(lgImg && !lgImg.complete) lgImg.addEventListener('load',measureMenu);\r\n  if(document.fonts&&document.fonts.ready) document.fonts.ready.then(measureMenu);\r\n\r\n  \/* FAQ: one answer open at a time *\/\r\n  root.addEventListener('click',function(e){\r\n    var q=e.target.closest && e.target.closest('.fq-q'); if(!q) return;\r\n    var item=q.closest('.fq-item'), list=q.closest('.fq-list'), open=!item.classList.contains('open');\r\n    list.querySelectorAll('.fq-item.open').forEach(function(it){ it.classList.remove('open'); it.querySelector('.fq-q').setAttribute('aria-expanded','false'); });\r\n    if(open){ item.classList.add('open'); q.setAttribute('aria-expanded','true'); }\r\n  });\r\n  \/* mobile menu panel *\/\r\n  var mbtn=root.querySelector('.h-mbtn'), mpan=root.querySelector('.h-mpanel');\r\n  function setPanel(o){ mpan.classList.toggle('open',o); mbtn.setAttribute('aria-expanded',o?'true':'false');\r\n    mpan.querySelectorAll('.h-mi').forEach(function(a,i){ a.style.transitionDelay=o?(.08+i*.06)+'s':'0s'; }); }\r\n  mbtn.addEventListener('click',function(){ setPanel(true); });\r\n  mpan.querySelector('.h-mclose').addEventListener('click',function(){ setPanel(false); });\r\n  mpan.querySelectorAll('a').forEach(function(a){ a.addEventListener('click',function(){ setPanel(false); }); });\r\n  \/* ---------- settings you can edit ---------- *\/\r\n  var FORM_ENDPOINT='\/wp-json\/ilmora\/v1\/brief';   \/\/ the ilmora-briefs plugin receives the form\r\n  var FORM_ENDPOINT_ALT='\/?rest_route=\/ilmora\/v1\/brief'; \/\/ used only if the first address gives 404\r\n  var CONTACT_EMAIL='info@ilmora.studio';\r\n\r\n  \/* copyright modal *\/\r\n  var cmodal=root.querySelector('#h-copy-modal'), lastFocus=null;\r\n  function openCopy(){ lastFocus=document.activeElement; cmodal.hidden=false; document.documentElement.style.overflow='hidden'; cmodal.querySelector('.h-modal-x').focus(); }\r\n  function closeCopy(){ cmodal.hidden=true; document.documentElement.style.overflow=''; if(lastFocus&&lastFocus.focus) lastFocus.focus(); }\r\n  root.querySelectorAll('[data-open-copy]').forEach(function(b){ b.addEventListener('click',function(e){ e.preventDefault(); if(typeof setPanel==='function') setPanel(false); openCopy(); }); });\r\n  cmodal.querySelectorAll('[data-close-copy]').forEach(function(b){ b.addEventListener('click',closeCopy); });\r\n  document.addEventListener('keydown',function(e){ if(e.key==='Escape' && !cmodal.hidden) closeCopy(); });\r\n\r\n  \/* contact form *\/\r\n  var cform=root.querySelector('.ct-form');\r\n  if(cform){\r\n    var st=cform.querySelector('.ct-status');\r\n    cform.addEventListener('submit',function(e){\r\n      e.preventDefault();\r\n      var ok=true;\r\n      cform.querySelectorAll('[required]').forEach(function(f){\r\n        var bad=f.type==='checkbox'?!f.checked:(!f.value.trim()||(f.type==='email'&&!\/^\\S+@\\S+\\.\\S+$\/.test(f.value.trim())));\r\n        f.classList.toggle('bad',bad); if(bad) ok=false;\r\n      });\r\n      st.classList.remove('err');\r\n      if(!ok){ st.textContent='Fill in all fields correctly and tick the agreement box.'; st.classList.add('err'); return; }\r\n      var d=new FormData(cform), btn=cform.querySelector('.ct-send');\r\n      var tel=(d.get('phone')||'').replace(\/[\u06f0-\u06f9]\/g,function(c){return c.charCodeAt(0)-1776;}).replace(\/[\u0660-\u0669]\/g,function(c){return c.charCodeAt(0)-1632;}).replace(\/\\D\/g,'');\r\n      if(tel.length<7||tel.length>15){ cform.querySelector('[name=phone]').classList.add('bad'); st.textContent='The phone number is not correct. Example: +98 912 000 0000'; st.classList.add('err'); return; }\r\n      st.textContent='Sending\u2026'; btn.disabled=true;\r\n      function send(url,retry){\r\n        return fetch(url,{method:'POST',headers:{'Accept':'application\/json'},body:d}).then(function(r){\r\n          if(r.status===404&&retry) return send(FORM_ENDPOINT_ALT,false);\r\n          return r.json().catch(function(){return {};}).then(function(j){ return {status:r.status,body:j}; });\r\n        });\r\n      }\r\n      send(FORM_ENDPOINT,true).then(function(res){\r\n        btn.disabled=false;\r\n        if(res.status===200&&res.body.ok){ st.textContent='Your information was sent. If the information is correct, we will contact you as soon as we can (one working day at most).'; cform.reset(); }\r\n        else if(res.status===429){ st.textContent='Too many sends. Try again in one hour.'; st.classList.add('err'); }\r\n        else if(res.status===400){ st.textContent='Some information is missing or wrong. Check the fields.'; st.classList.add('err'); }\r\n        else { st.textContent='Sending failed. Please email '+CONTACT_EMAIL+'.'; st.classList.add('err'); }\r\n      }).catch(function(){ btn.disabled=false; st.textContent='Sending failed. Check your internet or email '+CONTACT_EMAIL+'.'; st.classList.add('err'); });\r\n    });\r\n    cform.addEventListener('input',function(e){ e.target.classList.remove('bad'); });\r\n  }\r\n  \/* menu \u2192 scenes inside the hero (sceneNav is set once three.js is ready) *\/\r\n  var sceneNav=null;\r\n  root.querySelectorAll('.h-mi').forEach(function(a){ a.addEventListener('click',function(e){ e.preventDefault(); if(sceneNav) sceneNav(a.getAttribute('href')); }); });\r\n  function markMenu(on){\r\n    root.querySelectorAll('.h-mi').forEach(function(a){ var m=a.getAttribute('href')===on; a.classList.toggle('is-on',m); if(m) a.setAttribute('aria-current','page'); else a.removeAttribute('aria-current'); });\r\n  }\r\n  var topLayer=root.querySelector('.h-top');\r\n  function hideTop(){ var gone=root.getBoundingClientRect().bottom<90; topLayer.classList.toggle('gone',gone); var lb=root.querySelector('.h-lang'); if(lb) lb.classList.toggle('gone',gone); }\r\n  window.addEventListener('scroll',hideTop,{passive:true}); hideTop();\r\n\r\n  \/* text scenes \u2014 follow button on every glass panel *\/\r\n  var fine=window.matchMedia('(hover:hover) and (pointer:fine)').matches;\r\n  root.querySelectorAll('.p-glass').forEach(function(glass){\r\n    var fol=glass.querySelector('.p-follow'), next=glass.getAttribute('data-next');\r\n    if(!fol||!next) return;\r\n    var fx=0,fy=0,tx=0,ty=0,fs=0,ts=0,frun=false;\r\n    function ftick(){\r\n      fx+=(tx-fx)*.18; fy+=(ty-fy)*.18; fs+=(ts-fs)*.16;\r\n      fol.style.transform='translate('+fx.toFixed(1)+'px,'+fy.toFixed(1)+'px) scale('+fs.toFixed(3)+')';\r\n      fol.style.opacity=String(Math.min(1,fs*1.4));\r\n      if(Math.abs(ts-fs)>.002||Math.abs(tx-fx)>.3||Math.abs(ty-fy)>.3) requestAnimationFrame(ftick); else frun=false;\r\n    }\r\n    function kick(){ if(!frun){ frun=true; requestAnimationFrame(ftick); } }\r\n    function gpos(e){ var r=glass.getBoundingClientRect(); return [e.clientX-r.left, e.clientY-r.top]; }\r\n    if(fine){\r\n      glass.addEventListener('pointerenter',function(e){ var q=gpos(e); tx=fx=q[0]; ty=fy=q[1]; ts=1; kick(); });\r\n      glass.addEventListener('pointermove',function(e){ var q=gpos(e); tx=q[0]; ty=q[1]; ts=e.target.closest('a,button')?0:1; kick(); });\r\n      glass.addEventListener('pointerleave',function(){ ts=0; kick(); });\r\n      \r\n      glass.addEventListener('click',function(e){\r\n        if(e.target.closest('a,button')) return;\r\n        ts=.85; kick(); setTimeout(function(){ ts=1; kick(); },140);\r\n        if(sceneNav) sceneNav(next);\r\n      });\r\n    }\r\n    glass.querySelector('.p-next-link').addEventListener('click',function(e){ e.preventDefault(); if(sceneNav) sceneNav(next); });\r\n  });\r\n  window.addEventListener('resize',fitLogo);\r\n  var scrollBtn=root.querySelector('.h-scroll');\r\n  if(scrollBtn) scrollBtn.addEventListener('click',function(){\r\n    var tr=root.querySelector('.h-track').getBoundingClientRect();\r\n    window.scrollTo({top:window.pageYOffset+tr.top+tr.height-window.innerHeight,behavior:'smooth'});\r\n  });\r\n  var THREE_URL='https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js';\r\n  if(window.THREE){ init(); }\r\n  else{\r\n    var s=document.createElement('script'); s.src=THREE_URL; s.onload=init;\r\n    s.onerror=function(){ fail(); }; document.head.appendChild(s);\r\n  }\r\n  function fail(){\r\n    root.querySelector('.h-load').classList.add('gone');\r\n    root.querySelector('.h-fallback').style.display='flex';\r\n  }\r\n\r\n  function init(){\r\n    var T=window.THREE;\r\n    var canvas=root.querySelector('canvas'), stick=root.querySelector('.h-stick'), track=root.querySelector('.h-track');\r\n    var renderer;\r\n    try{ renderer=new T.WebGLRenderer({canvas:canvas,antialias:true,alpha:true,powerPreference:'high-performance'}); renderer.setClearColor(0x000000,0); }\r\n    catch(e){ fail(); return; }\r\n    var mobile=window.matchMedia('(max-width:760px)').matches || \/Mobi|Android\/i.test(navigator.userAgent);\r\n    var reduce=window.matchMedia('(prefers-reduced-motion:reduce)').matches;\r\n    renderer.setPixelRatio(Math.min(window.devicePixelRatio||1, mobile?1.5:1.75));\r\n    renderer.toneMapping=T.ACESFilmicToneMapping; renderer.toneMappingExposure=1.05;\r\n\r\n    var BG_A=new T.Color('#111825'), BG_B=new T.Color('#111825'), bg=BG_A.clone();\r\n    var scene=new T.Scene(); scene.fog=new T.FogExp2(bg,0.042);\r\n    var camera=new T.PerspectiveCamera(45,1,0.1,200);\r\n\r\n    \/* ---------- lights ---------- *\/\r\n    scene.add(new T.HemisphereLight(0x9fb4ff,0x2a1438,0.85));\r\n    var sun=new T.DirectionalLight(0xffffff,1.15); sun.position.set(5,9,8); scene.add(sun);\r\n    var cyan=new T.PointLight(0x3fd2f0,4.2,24,2); cyan.position.set(-4,-2.5,-2.5); scene.add(cyan);\r\n    var rose=new T.PointLight(0xff6f9a,3.4,24,2); rose.position.set(4.5,3,-2.5); scene.add(rose);\r\n    var stageLight=new T.PointLight(0xb9a8ff,3,26,2); stageLight.position.set(0,5,-20); scene.add(stageLight);\r\n    var stageCyan=new T.PointLight(0x3fd2f0,3,18,2); stageCyan.position.set(-5,0,-18); scene.add(stageCyan);\r\n    var stagePeach=new T.PointLight(0xffa07a,2.4,18,2); stagePeach.position.set(5,.5,-19); scene.add(stagePeach);\r\n\r\n    \/* ---------- textures ---------- *\/\r\n    function noiseTex(){\r\n      var c=document.createElement('canvas'); c.width=c.height=256; var g=c.getContext('2d');\r\n      g.fillStyle='#808080'; g.fillRect(0,0,256,256);\r\n      for(var i=0;i<2600;i++){ var v=Math.floor(90+Math.random()*80); g.fillStyle='rgba('+v+','+v+','+v+','+(0.15+Math.random()*0.3)+')';\r\n        var r=Math.random()*6+1; g.beginPath(); g.arc(Math.random()*256,Math.random()*256,r,0,6.283); g.fill(); }\r\n      var t=new T.CanvasTexture(c); t.wrapS=t.wrapT=T.RepeatWrapping; t.repeat.set(0.6,0.6); return t;\r\n    }\r\n    function softTex(){\r\n      var c=document.createElement('canvas'); c.width=c.height=128; var g=c.getContext('2d');\r\n      var gr=g.createRadialGradient(64,64,0,64,64,64); gr.addColorStop(0,'rgba(255,255,255,1)'); gr.addColorStop(.45,'rgba(255,255,255,.35)'); gr.addColorStop(1,'rgba(255,255,255,0)');\r\n      g.fillStyle=gr; g.fillRect(0,0,128,128); return new T.CanvasTexture(c);\r\n    }\r\n    var bump=noiseTex(), soft=softTex();\r\n    var stone=new T.MeshStandardMaterial({color:0x6f7896,roughness:.72,metalness:.12,bumpMap:bump,bumpScale:.035,emissive:0x1a1640,emissiveIntensity:.35});\r\n\r\n    \/* ---------- portal ---------- *\/\r\n    var portal=new T.Group(); scene.add(portal);\r\n    function arcBlock(ri,ro,a0,a1,depth){\r\n      var sh=new T.Shape();\r\n      sh.moveTo(Math.cos(a0)*ro,Math.sin(a0)*ro); sh.absarc(0,0,ro,a0,a1,false);\r\n      sh.lineTo(Math.cos(a1)*ri,Math.sin(a1)*ri); sh.absarc(0,0,ri,a1,a0,true);\r\n      var geo=new T.ExtrudeGeometry(sh,{depth:depth,bevelEnabled:true,bevelThickness:.14,bevelSize:.11,bevelSegments:4,curveSegments:28});\r\n      geo.translate(0,0,-depth\/2); return geo;\r\n    }\r\n    var PAL=[new T.Color('#3a83ba'),new T.Color('#5e327c'),new T.Color('#782e65'),new T.Color('#ffad8c')];\r\n    PAL.forEach(function(c){ c.offsetHSL(0,.2,.05); });\r\n    var portalStone=new T.MeshStandardMaterial({color:0xffffff,vertexColors:true,roughness:.55,metalness:.08,bumpMap:bump,bumpScale:.035,emissive:0x140c24,emissiveIntensity:.4});\r\n    function paint(geo,phase){\r\n      var pos=geo.attributes.position, col=new Float32Array(pos.count*3), c=new T.Color();\r\n      for(var k=0;k<pos.count;k++){\r\n        var a=(Math.atan2(pos.getY(k),pos.getX(k))\/(Math.PI*2)+1+phase)%1, f=a*4, i0=Math.floor(f)%4, i1=(i0+1)%4, w=f-Math.floor(f);\r\n        w=w*w*(3-2*w); c.copy(PAL[i0]).lerp(PAL[i1],w);\r\n        col[k*3]=c.r; col[k*3+1]=c.g; col[k*3+2]=c.b;\r\n      }\r\n      geo.setAttribute('color',new T.BufferAttribute(col,3));\r\n    }\r\n    function ring(ri,ro,n,gap,depth,phase){\r\n      var g=new T.Group(), blocks=[];\r\n      for(var i=0;i<n;i++){\r\n        var a0=i\/n*Math.PI*2+gap, a1=(i+1)\/n*Math.PI*2-gap;\r\n        var bg0=arcBlock(ri,ro,a0,a1,depth); paint(bg0,phase); var m=new T.Mesh(bg0,portalStone);\r\n        var mid=(a0+a1)\/2;\r\n        m.userData={dir:new T.Vector3(Math.cos(mid),Math.sin(mid),0),r1:Math.random(),r2:Math.random()-.5,r3:Math.random()-.5};\r\n        g.add(m); blocks.push(m);\r\n      }\r\n      return {group:g,blocks:blocks};\r\n    }\r\n    var outer=ring(3.35,4.35,9,.035,.8,0), inner=ring(1.35,1.85,5,.09,.55,.5);\r\n    portal.add(outer.group); portal.add(inner.group);\r\n    inner.group.rotation.set(.35,-.5,0);\r\n\r\n    \/* glowing seam behind outer ring *\/\r\n    var seam=new T.Mesh(new T.TorusGeometry(3.85,.62,16,120),new T.MeshBasicMaterial({color:0x8fd9ff,transparent:true,opacity:.22,blending:T.AdditiveBlending,depthWrite:false}));\r\n    seam.position.z=-.55; portal.add(seam);\r\n\r\n    \/* ilmora star at the heart of the portal *\/\r\n    var st=new T.Shape(); st.moveTo(0,1);\r\n    st.bezierCurveTo(.08,.38,.38,.08,1,0); st.bezierCurveTo(.38,-.08,.08,-.38,0,-1);\r\n    st.bezierCurveTo(-.08,-.38,-.38,-.08,-1,0); st.bezierCurveTo(-.38,.08,-.08,.38,0,1);\r\n    var starGeo=new T.ExtrudeGeometry(st,{depth:.18,bevelEnabled:true,bevelThickness:.1,bevelSize:.06,bevelSegments:5,curveSegments:24}); starGeo.center();\r\n    var star=new T.Mesh(starGeo,new T.MeshBasicMaterial({color:0x5ed6f5,toneMapped:false}));\r\n    star.scale.setScalar(.72); star.visible=false; portal.add(star);\r\n    function flareTex(){\r\n      var S=512, c=document.createElement('canvas'); c.width=c.height=S; var g=c.getContext('2d'), h=S\/2;\r\n      g.globalCompositeOperation='lighter';\r\n      var gr=g.createRadialGradient(h,h,0,h,h,h*.55); gr.addColorStop(0,'rgba(255,255,255,.55)'); gr.addColorStop(.25,'rgba(255,255,255,.18)'); gr.addColorStop(1,'rgba(255,255,255,0)');\r\n      g.fillStyle=gr; g.fillRect(0,0,S,S);\r\n      function ray(ang,len,w,a){ g.save(); g.translate(h,h); g.rotate(ang);\r\n        var lg=g.createLinearGradient(-len,0,len,0); lg.addColorStop(0,'rgba(255,255,255,0)'); lg.addColorStop(.5,'rgba(255,255,255,'+a+')'); lg.addColorStop(1,'rgba(255,255,255,0)');\r\n        g.fillStyle=lg; g.beginPath(); g.moveTo(-len,0); g.lineTo(0,-w); g.lineTo(len,0); g.lineTo(0,w); g.closePath(); g.fill(); g.restore(); }\r\n      ray(0,h,5,1); ray(Math.PI\/2,h,5,1); ray(Math.PI\/4,h*.55,3,.6); ray(-Math.PI\/4,h*.55,3,.6);\r\n      return new T.CanvasTexture(c);\r\n    }\r\n    \/* a light pouring out of the portal's heart *\/\r\n    var starHalo=new T.Sprite(new T.SpriteMaterial({map:soft,color:0xd8f4ff,transparent:true,opacity:.55,depthWrite:false,blending:T.AdditiveBlending,toneMapped:false}));\r\n    starHalo.scale.set(5.4,5.4,1); starHalo.position.z=-.6; portal.add(starHalo);\r\n    var starRays=new T.Sprite(new T.SpriteMaterial({map:soft,color:0xffffff,transparent:true,opacity:1,depthWrite:false,blending:T.AdditiveBlending,toneMapped:false}));\r\n    starRays.scale.set(1.9,1.9,1); starRays.position.z=-.5; portal.add(starRays);\r\n    var starWide=new T.Sprite(new T.SpriteMaterial({map:soft,color:0x9fdcff,transparent:true,opacity:.18,depthWrite:false,blending:T.AdditiveBlending,toneMapped:false}));\r\n    starWide.scale.set(11,11,1); starWide.position.z=-.8; portal.add(starWide);\r\n    var starLight=new T.PointLight(0xffffff,3.2,10,2); starLight.position.z=.6; portal.add(starLight);\r\n\r\n    \/* ---------- stage ---------- *\/\r\n    var STAGE_Z=-22, stage=new T.Group(); stage.position.set(0,-1.9,STAGE_Z); scene.add(stage);\r\n    var edgeCols=[0x5ed6f5,0x9fb8ff,0xd9c6f0,0xf4b7c6,0xff7a90];\r\n    [[1.6,.55],[3.1,.4],[4.7,.28],[6.6,.18],[9,.1]].forEach(function(d,di){\r\n      var edgeMat=new T.MeshBasicMaterial({color:edgeCols[di],transparent:true,opacity:.9});\r\n      var cyl=new T.Mesh(new T.CylinderGeometry(d[0],d[0]+.05,d[1],96,1,false),stone);\r\n      cyl.position.y=d[1]\/2-.6; stage.add(cyl);\r\n      var edge=new T.Mesh(new T.TorusGeometry(d[0]+.02,.022,8,160),edgeMat);\r\n      edge.rotation.x=Math.PI\/2; edge.position.y=d[1]-.6; stage.add(edge);\r\n    });\r\n    var floorGlow=new T.Sprite(new T.SpriteMaterial({map:soft,color:0x8a6cff,transparent:true,opacity:.45,depthWrite:false,blending:T.AdditiveBlending}));\r\n    floorGlow.scale.set(9,3,1); floorGlow.position.set(0,.3,0); stage.add(floorGlow);\r\n    var halo=new T.Mesh(new T.TorusGeometry(9,.18,12,200),new T.MeshBasicMaterial({color:0xe9e4ff,transparent:true,opacity:.75}));\r\n    halo.rotation.x=Math.PI\/2; halo.position.set(0,8.2,0); stage.add(halo);\r\n    var haloGlow=new T.Mesh(new T.TorusGeometry(9,1.1,12,200),new T.MeshBasicMaterial({color:0xb49cff,transparent:true,opacity:.2,blending:T.AdditiveBlending,depthWrite:false}));\r\n    haloGlow.rotation.x=Math.PI\/2; haloGlow.position.copy(halo.position); stage.add(haloGlow);\r\n\r\n    \/* ---------- mist & dust ---------- *\/\r\n    var mists=[];\r\n    for(var i=0;i<(mobile?18:30);i++){\r\n      var mc=[0x3a83ba,0x782e65,0xffad8c,0x5e327c][i%4];\r\n      var sp=new T.Sprite(new T.SpriteMaterial({map:soft,color:mc,transparent:true,opacity:.03+Math.random()*.04,depthWrite:false,blending:T.AdditiveBlending,toneMapped:false}));\r\n      var sc=6+Math.random()*10; sp.scale.set(sc*1.6,sc,1);\r\n      sp.position.set((Math.random()-.5)*26,(Math.random()-.5)*12,-32+Math.random()*44);\r\n      sp.userData.v=(Math.random()-.5)*.004; scene.add(sp); mists.push(sp);\r\n    }\r\n    var dustN=mobile?700:1600, dg=new T.BufferGeometry(), dp=new Float32Array(dustN*3);\r\n    for(i=0;i<dustN;i++){ dp[i*3]=(Math.random()-.5)*30; dp[i*3+1]=(Math.random()-.5)*16; dp[i*3+2]=-34+Math.random()*48; }\r\n    dg.setAttribute('position',new T.BufferAttribute(dp,3));\r\n    var dust=new T.Points(dg,new T.PointsMaterial({color:0xffffff,size:.045,transparent:true,opacity:.7,depthWrite:false}));\r\n    scene.add(dust);\r\n\r\n    \/* ---------- particle sculptures ---------- *\/\r\n    var N=mobile?8000:16000, R=Math.random;\r\n    \/* ---------- procedural 3D icon sculptures (points sampled on primitives) ---------- *\/\r\n    function V3(x,y,z){return [x,y,z];}\r\n    function Builder(){ this.p=[]; this.tot=0; }\r\n    Builder.prototype.add=function(w,f){ if(w>0){ this.p.push([w,f]); this.tot+=w; } return this; };\r\n    Builder.prototype.box=function(cx,cy,cz,w,h,d,skip){\r\n      var a=[w*h,w*h,d*h,d*h,w*d,w*d]; if(skip&&skip.indexOf('f')>-1) a[0]=0; if(skip&&skip.indexOf('b')>-1) a[1]=0; var s=a[0]+a[1]+a[2]+a[3]+a[4]+a[5];\r\n      return this.add(s,function(){\r\n        var r=R()*s, k=0; while(k<5 && r>a[k]){ r-=a[k]; k++; }\r\n        var u=R()-.5, v=R()-.5;\r\n        if(k<2) return V3(cx+u*w,cy+v*h,cz+(k?-.5:.5)*d);\r\n        if(k<4) return V3(cx+(k===2?.5:-.5)*w,cy+v*h,cz+u*d);\r\n        return V3(cx+u*w,cy+(k===4?.5:-.5)*h,cz+v*d);\r\n      });\r\n    };\r\n    Builder.prototype.plane=function(cx,cy,cz,w,h,m){ return this.add(w*h*(m||1),function(){ return V3(cx+(R()-.5)*w,cy+(R()-.5)*h,cz); }); };\r\n    \/* a front wall with rectangular openings (windows, doors) left empty *\/\r\n    Builder.prototype.facade=function(cx,cy,cz,w,h,holes,m){\r\n      var open=0; holes.forEach(function(r){ open+=(r[2]-r[0])*(r[3]-r[1]); });\r\n      return this.add((w*h-open)*(m||1),function(){\r\n        for(var n=0;n<40;n++){ var x=cx+(R()-.5)*w, y=cy+(R()-.5)*h, ok=true;\r\n          for(var i=0;i<holes.length;i++){ var r=holes[i]; if(x>r[0]&&x<r[2]&&y>r[1]&&y<r[3]){ ok=false; break; } }\r\n          if(ok) return V3(x,y,cz); }\r\n        return V3(cx-w\/2,cy,cz);\r\n      });\r\n    };\r\n    function win(x,y,w,h){ return [x-w\/2,y-h\/2,x+w\/2,y+h\/2]; }\r\n    Builder.prototype.sphere=function(cx,cy,cz,r,sy){ sy=sy||1;\r\n      return this.add(4*Math.PI*r*r*sy,function(){ var u=R()*2-1, a=R()*6.2832, q=Math.sqrt(1-u*u); return V3(cx+q*Math.cos(a)*r,cy+u*r*sy,cz+q*Math.sin(a)*r); }); };\r\n    Builder.prototype.dome=function(cx,cy,cz,rx,ry,rz){\r\n      return this.add(2*Math.PI*rx*ry,function(){ var u=R(), a=R()*6.2832, q=Math.sqrt(1-u*u); return V3(cx+q*Math.cos(a)*rx,cy+u*ry,cz+q*Math.sin(a)*rz); }); };\r\n    Builder.prototype.tube=function(a,b,r0,r1){\r\n      if(r1===undefined) r1=r0;\r\n      var d=[b[0]-a[0],b[1]-a[1],b[2]-a[2]], L=Math.hypot(d[0],d[1],d[2]); d=[d[0]\/L,d[1]\/L,d[2]\/L];\r\n      var t=Math.abs(d[1])<.9?[0,1,0]:[1,0,0];\r\n      var u=[d[1]*t[2]-d[2]*t[1],d[2]*t[0]-d[0]*t[2],d[0]*t[1]-d[1]*t[0]], ul=Math.hypot(u[0],u[1],u[2]); u=[u[0]\/ul,u[1]\/ul,u[2]\/ul];\r\n      var v=[d[1]*u[2]-d[2]*u[1],d[2]*u[0]-d[0]*u[2],d[0]*u[1]-d[1]*u[0]];\r\n      return this.add(L*(r0+r1)*Math.PI+.02,function(){\r\n        var s=R(), r=r0+(r1-r0)*s, g=R()*6.2832, c=Math.cos(g)*r, n=Math.sin(g)*r;\r\n        return V3(a[0]+d[0]*L*s+u[0]*c+v[0]*n,a[1]+d[1]*L*s+u[1]*c+v[1]*n,a[2]+d[2]*L*s+u[2]*c+v[2]*n);\r\n      });\r\n    };\r\n    Builder.prototype.cyl=function(cx,cy,cz,r,len,axis){ \/* lateral + caps *\/\r\n      var lat=2*Math.PI*r*len, cap=Math.PI*r*r;\r\n      return this.add(lat+2*cap,function(){\r\n        var g=R()*6.2832, a,b,c;\r\n        if(R()*(lat+2*cap)<lat){ a=Math.cos(g)*r; b=Math.sin(g)*r; c=(R()-.5)*len; }\r\n        else { var q=Math.sqrt(R())*r; a=Math.cos(g)*q; b=Math.sin(g)*q; c=(R()<.5?-.5:.5)*len; }\r\n        if(axis==='x') return V3(cx+c,cy+a,cz+b);\r\n        if(axis==='z') return V3(cx+a,cy+b,cz+c);\r\n        return V3(cx+a,cy+c,cz+b);\r\n      });\r\n    };\r\n    Builder.prototype.fn=function(w,f){ return this.add(w,f); };\r\n    Builder.prototype.build=function(opt){\r\n      opt=opt||{}; var n=opt.n||N;\r\n      var out=new Float32Array(n*3), P=this.p, tot=this.tot;\r\n      for(var i=0;i<n;i++){\r\n        var r=R()*tot, k=0; while(k<P.length-1 && r>P[k][0]){ r-=P[k][0]; k++; }\r\n        var q=P[k][1]();\r\n        out[i*3]=q[0]+(R()-.5)*.02; out[i*3+1]=q[1]+(R()-.5)*.02; out[i*3+2]=q[2]+(R()-.5)*.02;\r\n      }\r\n      \/* optional rotations *\/\r\n      function rot(ax,ang){ var c=Math.cos(ang), s=Math.sin(ang);\r\n        for(var i=0;i<n;i++){ var x=out[i*3],y=out[i*3+1],z=out[i*3+2];\r\n          if(ax==='x'){ out[i*3+1]=y*c-z*s; out[i*3+2]=y*s+z*c; }\r\n          else if(ax==='y'){ out[i*3]=x*c+z*s; out[i*3+2]=-x*s+z*c; }\r\n          else { out[i*3]=x*c-y*s; out[i*3+1]=x*s+y*c; } } }\r\n      if(opt.rz) rot('z',opt.rz); if(opt.ry) rot('y',opt.ry); if(opt.rx) rot('x',opt.rx);\r\n      if(opt.nofit) return out;\r\n      \/* fit into the display volume *\/\r\n      var mn=[1e9,1e9,1e9], mx=[-1e9,-1e9,-1e9];\r\n      for(i=0;i<n*3;i+=3) for(var a=0;a<3;a++){ var v=out[i+a]; if(v<mn[a]) mn[a]=v; if(v>mx[a]) mx[a]=v; }\r\n      var sc=1\/Math.max((mx[0]-mn[0])\/3.4,(mx[1]-mn[1])\/3.5,(mx[2]-mn[2])\/3.0);\r\n      var cxx=(mn[0]+mx[0])\/2, cyy=(mn[1]+mx[1])\/2, czz=(mn[2]+mx[2])\/2;\r\n      for(i=0;i<n*3;i+=3){ out[i]=(out[i]-cxx)*sc; out[i+1]=(out[i+1]-cyy)*sc+.1; out[i+2]=(out[i+2]-czz)*sc; }\r\n      return out;\r\n    };\r\n\r\n    \/* 1 \u2014 academy: the classic institution icon (steps, columns, pediment) *\/\r\n    function makeUniversity(){\r\n      var b=new Builder();\r\n      b.box(0,-1.64,0,3.6,.14,1.45); b.box(0,-1.48,0,3.25,.16,1.28);          \/\/ steps\r\n      [-1.3,-.65,0,.65,1.3].forEach(function(x){\r\n        b.cyl(x,-.56,.4,.15,1.62,'y');                                          \/\/ column\r\n        b.box(x,.3,.4,.4,.1,.4); b.box(x,-1.34,.4,.4,.08,.4);                  \/\/ capital + base\r\n      });\r\n      b.plane(0,-.56,-.35,3.0,1.62,.28);                                        \/\/ inner wall\r\n      b.box(0,.5,0,3.35,.26,1.25);                                              \/\/ entablature\r\n      b.fn(1.1,function(){ for(;;){ var u=R()*2-1, v=R(); if(v<=1-Math.abs(u)) return V3(u*1.72,.64+v*.9,.62); } }); \/\/ pediment face\r\n      b.fn(2.2,function(){ var u=R()*2-1; return V3(u*1.72,.64+.9*(1-Math.abs(u)),(R()-.5)*1.25); });                \/\/ roof slopes\r\n      b.tube(V3(-1.8,.64,.64),V3(0,1.58,.64),.055); b.tube(V3(1.8,.64,.64),V3(0,1.58,.64),.055); b.tube(V3(-1.8,.64,.64),V3(1.8,.64,.64),.055);\r\n      return b.build({ry:-.3});\r\n    }\r\n    \/* 2 \u2014 medical skills academy: DNA *\/\r\n    function makeDNA(){\r\n      var b=new Builder(), turns=2.2, H=3.4, Rr=.72;\r\n      function pt(t,ph){ var a=t*Math.PI*2*turns+ph; return V3(Math.cos(a)*Rr,-H\/2+H*t,Math.sin(a)*Rr); }\r\n      b.fn(10,function(){ var t=R(), p=pt(t,R()<.5?0:Math.PI), jr=.11*Math.cbrt(R()), ja=R()*6.28, jb=R()*3.14;\r\n        return V3(p[0]+jr*Math.sin(jb)*Math.cos(ja),p[1]+jr*Math.cos(jb),p[2]+jr*Math.sin(jb)*Math.sin(ja)); });\r\n      for(var k=0;k<16;k++){ var t=(k+.5)\/16, a=pt(t,0), c=pt(t,Math.PI);\r\n        b.tube(a,c,.035); b.sphere(a[0]*.5+c[0]*.5+(a[0]-c[0])*.25,a[1],a[2]*.5+c[2]*.5+(a[2]-c[2])*.25,.07); }\r\n      return b.build({rz:-.5});\r\n    }\r\n    \/* 3 \u2014 video conference & online teaching: presenter at a board *\/\r\n    function makeTeacher(){\r\n      var b=new Builder();\r\n      b.box(.55,1.22,0,2.5,.08,.1); b.box(.55,-.32,0,2.5,.08,.1); b.box(-.66,.45,0,.08,1.6,.1); b.box(1.76,.45,0,.08,1.6,.1);\r\n      b.plane(.55,.45,0,2.42,1.5,.35);                  \/\/ board surface\r\n      b.box(.55,1.3,0,2.7,.1,.14);                      \/\/ top rail\r\n      b.tube(V3(-.2,.95,.07),V3(.9,.95,.07),.05); b.tube(V3(1.05,.95,.07),V3(1.5,.95,.07),.05);\r\n      b.tube(V3(.15,.6,.07),V3(1.2,.6,.07),.05); b.tube(V3(.15,.25,.07),V3(1.45,.25,.07),.05);\r\n      b.tube(V3(-.2,-.05,.07),V3(.7,-.05,.07),.05);\r\n      b.sphere(-1.35,.55,.2,.25);                       \/\/ head\r\n      b.box(-1.35,-.3,.2,.56,1.05,.34);                 \/\/ torso\r\n      b.tube(V3(-1.47,-.82,.2),V3(-1.52,-1.75,.2),.1); b.tube(V3(-1.23,-.82,.2),V3(-1.18,-1.75,.2),.1); \/\/ legs\r\n      b.tube(V3(-1.12,.08,.2),V3(-.55,.42,.2),.075);     \/\/ pointing arm\r\n      b.tube(V3(-.55,.42,.2),V3(-.08,.62,.2),.022,.012); \/\/ pointer\r\n      b.tube(V3(-1.6,.08,.2),V3(-1.68,-.62,.2),.075);    \/\/ other arm\r\n      return b.build({ry:.25});\r\n    }\r\n    \/* 4 \u2014 student communities & knowledge exchange *\/\r\n    function makeCommunity(){\r\n      var b=new Builder();\r\n      b.sphere(0,1.45,0,.4);                            \/\/ head\r\n      b.dome(0,.55,0,.8,.55,.45); b.fn(1.2,function(){ var q=Math.sqrt(R()), a=R()*6.28; return V3(Math.cos(a)*q*.8,.55,Math.sin(a)*q*.45); });\r\n      b.tube(V3(0,.55,0),V3(0,.12,0),.06);\r\n      b.tube(V3(-1.35,.12,0),V3(1.35,.12,0),.06);\r\n      [-1.35,0,1.35].forEach(function(x){ b.tube(V3(x,.12,0),V3(x,-.38,0),.06); b.box(x,-.85,0,.82,.82,.82); b.box(x,-.85,.42,.36,.36,.02); });\r\n      return b.build({ry:-.2});\r\n    }\r\n    \/* 5 \u2014 periodic quizzes & final exams *\/\r\n    function makeQuiz(){\r\n      var b=new Builder(), W=3.0, H=2.1, T=.14, cy=.35;\r\n      b.box(0,cy+H\/2-T\/2,0,W,T,.2); b.box(0,cy-H\/2+T\/2,0,W,T,.2); b.box(-W\/2+T\/2,cy,0,T,H,.2); b.box(W\/2-T\/2,cy,0,T,H,.2);\r\n      b.plane(0,cy,-.09,W-.2,H-.2,.12);                 \/\/ faint screen\r\n      b.plane(-.15,cy-.05,.04,1.7,1.55,.4);             \/\/ paper\r\n      b.box(-.15,cy+.78,.04,1.7,.16,.05);                \/\/ paper header\r\n      [[.35,'v'],[-.05,'x'],[-.45,'v']].forEach(function(r){\r\n        var y=cy+r[0], x0=-.8;\r\n        if(r[1]==='v'){ b.tube(V3(x0-.13,y,.1),V3(x0-.03,y-.1,.1),.05); b.tube(V3(x0-.03,y-.1,.1),V3(x0+.15,y+.12,.1),.05); }\r\n        else { b.tube(V3(x0-.12,y+.1,.1),V3(x0+.1,y-.1,.1),.05); b.tube(V3(x0-.12,y-.1,.1),V3(x0+.1,y+.1,.1),.05); }\r\n        b.tube(V3(-.45,y,.1),V3(.45,y,.1),.045);\r\n      });\r\n      b.box(0,-1.05,-.02,.32,.62,.14); b.box(0,-1.42,0,1.3,.1,.55);  \/\/ stand + base\r\n      b.tube(V3(.55,-.25,.3),V3(1.3,1.1,.3),.11);        \/\/ pencil body\r\n      b.tube(V3(.55,-.25,.3),V3(.42,-.48,.3),.11,.01);   \/\/ tip\r\n      b.tube(V3(1.3,1.1,.3),V3(1.38,1.25,.3),.11);       \/\/ eraser\r\n      return b.build({ry:-.15});\r\n    }\r\n    \/* 6 \u2014 graduation & certificate *\/\r\n    function makeGrad(){\r\n      var b=new Builder(), c=Math.cos(Math.PI\/4), s=Math.sin(Math.PI\/4);\r\n      b.fn(6,function(){ var u=(R()-.5)*2.3, v=(R()-.5)*2.3, y=1.05+(R()<.5?.04:-.04); return V3(u*c-v*s,y,u*s+v*c); }); \/\/ board\r\n      b.cyl(0,.75,0,.68,.55,'y');                        \/\/ skull cap\r\n      b.sphere(0,1.12,0,.08);\r\n      b.tube(V3(0,1.1,0),V3(1.55,1.02,0),.028);          \/\/ tassel cord\r\n      b.tube(V3(1.55,1.02,0),V3(1.6,.45,0),.03);\r\n      b.tube(V3(1.6,.45,0),V3(1.62,.15,0),.09,.12);\r\n      b.cyl(0,-1.0,0,.3,2.4,'x');                        \/\/ diploma scroll\r\n      b.sphere(0,-1.0,.33,.12);\r\n      b.tube(V3(0,-1.0,.32),V3(-.32,-1.75,.32),.06,.08); b.tube(V3(0,-1.0,.32),V3(.32,-1.75,.32),.06,.08);\r\n      return b.build({rx:.28});\r\n    }\r\n    \/* points that spell a word (rendered with the page font on a hidden canvas) *\/\r\n    function textPts(str,cx,cy,cz,w,font,depth){ font=font||'800 {s}px Estedad, Vazirmatn, Tahoma, sans-serif'; depth=depth||.05;\r\n      try{\r\n        var W=640,H=180,c=document.createElement('canvas'); c.width=W; c.height=H; var g=c.getContext('2d');\r\n        var fs=140; g.font=font.replace('{s}',fs);\r\n        var mw=g.measureText(str).width; if(mw>W*.92){ fs=fs*W*.92\/mw; g.font=font.replace('{s}',fs); }\r\n        g.direction='rtl'; g.textAlign='center'; g.textBaseline='middle'; g.fillStyle='#fff'; g.fillText(str,W\/2,H\/2);\r\n        if(depth>.2){ g.lineWidth=fs*.06; g.strokeStyle='#fff'; g.lineJoin='round'; g.strokeText(str,W\/2,H\/2); }\r\n        var d=g.getImageData(0,0,W,H).data, pts=[];\r\n        for(var y=0;y<H;y+=2) for(var x=0;x<W;x+=2) if(d[(y*W+x)*4+3]>140) pts.push(x,y);\r\n        if(!pts.length) return null;\r\n        var h=w*H\/W;\r\n        return function(){ var k=Math.floor(R()*pts.length\/2)*2; return V3(cx+(pts[k]\/W-.5)*w+(R()-.5)*.012,cy-(pts[k+1]\/H-.5)*h,cz+(R()-.5)*depth); };\r\n      }catch(e){ return null; }\r\n    }\r\n    \/* 7 \u2014 course store: storefront with striped awning and a SHOP sign *\/\r\n    function makeShop(){\r\n      var b=new Builder();\r\n      function frame(x0,y0,x1,y1,z,r){ b.tube(V3(x0,y0,z),V3(x1,y0,z),r); b.tube(V3(x0,y1,z),V3(x1,y1,z),r); b.tube(V3(x0,y0,z),V3(x0,y1,z),r); b.tube(V3(x1,y0,z),V3(x1,y1,z),r); }\r\n      b.box(0,-.76,0,2.5,1.72,1.0,'fb'); b.plane(0,-.76,-.5,2.5,1.72,.2);                 \/\/ shop body\r\n      b.facade(0,-.76,.5,2.5,1.72,[[-1.05,-1.45,-.05,-.55],[.25,-1.62,.95,-.5]]);\r\n      frame(-1.05,-1.45,-.05,-.55,.53,.035); b.tube(V3(-.55,-1.45,.53),V3(-.55,-.55,.53),.025);   \/\/ display window\r\n      frame(.25,-1.62,.95,-.5,.53,.035); b.sphere(.36,-1.05,.56,.05);                   \/\/ door + handle\r\n      b.box(0,-1.68,0,2.8,.1,1.25);                                                      \/\/ step\r\n      for(var k=0;k<7;k++){ (function(i){                                                \/\/ striped awning\r\n        var x0=-1.4+i*.4;\r\n        b.fn(i%2?1.7:.15,function(){ var x=x0+R()*.4, t=R(); return V3(x,.12-.34*t,.5+.45*t); });\r\n        b.fn(i%2?.5:.2,function(){ var q=Math.sqrt(R())*.2, a=R()*Math.PI; return V3(x0+.2+Math.cos(a)*q,-.22-Math.sin(a)*q,.95); });\r\n      })(k); }\r\n      b.box(0,.58,.02,2.5,.86,.96,'f'); b.plane(0,.58,.5,2.5,.86,.12);                  \/\/ sign fascia\r\n      frame(-1.2,.2,1.2,.96,.53,.03);\r\n      var tp=textPts('SHOP',0,.58,.56,2.05,'800 {s}px Quicksand, Estedad, sans-serif'); if(tp) b.fn(2.6,tp);\r\n      b.box(0,1.08,0,2.75,.12,1.12);                                                     \/\/ cornice\r\n      return b.build({ry:-.22});\r\n    }\r\n    var shapes=[\r\n      {name:'Interactive academy',title:'An interactive, process-based academy',pos:makeUniversity()},\r\n      {name:'Medical academy',title:'Academy for medical skills training',pos:makeDNA()},\r\n      {name:'Online class',title:'Video conference and online teaching',pos:makeTeacher()},\r\n      {name:'Student forum',title:'Student forums and information exchange',pos:makeCommunity()},\r\n      {name:'Quiz and exam',title:'Periodic quizzes and the final exam',pos:makeQuiz()},\r\n      {name:'Graduation',title:'Graduation and the course certificate',pos:makeGrad()},\r\n      {name:'Course sales',title:'Sale of academic and university courses',pos:makeShop()}\r\n    ];\r\n    var cur=0;\r\n    var A=new Float32Array(shapes[0].pos), B=new Float32Array(shapes[0].pos);\r\n    var P=new Float32Array(shapes[0].pos), V=new Float32Array(N*3), O=new Float32Array(N*3), E=new Float32Array(N);\r\n    var rnd=new Float32Array(N); for(i=0;i<N;i++) rnd[i]=R();\r\n    var pg=new T.BufferGeometry();\r\n    var aP=new T.BufferAttribute(P,3); aP.setUsage(T.DynamicDrawUsage);\r\n    var aE=new T.BufferAttribute(E,1); aE.setUsage(T.DynamicDrawUsage);\r\n    pg.setAttribute('position',aP); pg.setAttribute('aE',aE);\r\n    pg.setAttribute('aR',new T.BufferAttribute(rnd,1));\r\n    pg.boundingSphere=new T.Sphere(new T.Vector3(),6);\r\n\r\n    var uni={uTime:{value:0},uScale:{value:500},uFogColor:{value:bg},uFogDensity:{value:.045}};\r\n    var pmat=new T.ShaderMaterial({\r\n      uniforms:uni,transparent:true,depthWrite:false,\r\n      vertexShader:[\r\n        'attribute float aR; attribute float aE;',\r\n        'uniform float uTime,uScale;',\r\n        'varying float vE; varying float vH; varying float vR; varying float vFog;',\r\n        'void main(){',\r\n        '  vec3 p=position+normalize(position+vec3(.001))*sin(uTime*1.4+aR*25.)*.012*(1.-aE);',\r\n        '  vec4 mv=modelViewMatrix*vec4(p,1.);',\r\n        '  gl_Position=projectionMatrix*mv;',\r\n        '  gl_PointSize=uScale*(.026+.02*aR)*(1.+aE*.45)\/-mv.z;',\r\n        '  vE=aE; vR=aR; vH=clamp((p.y+1.9)\/4.2,0.,1.); vFog=-mv.z;',\r\n        '}'].join('\\n'),\r\n      fragmentShader:[\r\n        'uniform vec3 uFogColor; uniform float uFogDensity;',\r\n        'varying float vE; varying float vH; varying float vR; varying float vFog;',\r\n        'void main(){',\r\n        '  vec2 c=gl_PointCoord*2.-1.; float r2=dot(c,c); if(r2>1.) discard;',\r\n        '  vec3 n=vec3(c.x,-c.y,sqrt(1.-r2));',\r\n        '  float l=clamp(dot(n,normalize(vec3(-.35,.65,.7))),0.,1.);',\r\n        '  vec3 dark=vec3(.24,.28,.48), light=vec3(.9,.93,1.);',\r\n        '  vec3 col=mix(dark,light,l*.75+vH*.25);',\r\n        '  vec3 g1=vec3(.31,.85,.94), g2=vec3(.49,.55,1.), g3=vec3(.78,.71,.94), g4=vec3(1.,.56,.64);',\r\n        '  vec3 tint=vR<.33?mix(g1,g2,vR*3.):(vR<.66?mix(g2,g3,(vR-.33)*3.):mix(g3,g4,(vR-.66)*3.));',\r\n        '  float e=smoothstep(0.,.7,vE);',\r\n        '  col=mix(col,tint*(.55+l*.6),.22+e*.45);',\r\n        '  col=mix(col,vec3(1.),e*.6*(.4+l*.6));',\r\n        '  float f=1.-exp(-uFogDensity*uFogDensity*vFog*vFog);',\r\n        '  col=mix(col,uFogColor,f*.9);',\r\n        '  gl_FragColor=vec4(col,1.-e*.2);',\r\n        '}'].join('\\n')\r\n    });\r\n    var sculpt=new T.Points(pg,pmat); sculpt.position.set(0,.55,STAGE_Z); scene.add(sculpt);\r\n\r\n    \/* ---------- particle physics: the mouse stirs the dots like a fluid ---------- *\/\r\n    var BX=2.5, BYMIN=-2.45, BYMAX=3.0, BZ=2.0, RAD=.6;\r\n    var ro=new T.Vector3(), rd=new T.Vector3(), mLoc=new T.Vector3(), mPrev=new T.Vector3(), mVel=new T.Vector3(), hasPrev=false;\r\n    var splash=null, morphing=false, morphT=0;\r\n    function stag(t,r){ var x=Math.min(1,Math.max(0,t*1.5-r*.5)); return x*x*(3-2*x); }\r\n    function simulate(dt,t,active){\r\n      var damp=Math.exp(-dt*2.3), decay=Math.exp(-dt*.42), R2=RAD*RAD;\r\n      var mvx=mVel.x, mvy=mVel.y, mvz=mVel.z, spd=Math.sqrt(mvx*mvx+mvy*mvy+mvz*mvz);\r\n      var push=active && spd>.08, sp=Math.min(1,spd*.35);\r\n      for(var i=0,j=0;i<N;i++,j+=3){\r\n        var r=rnd[i], hx=A[j], hy=A[j+1], hz=A[j+2];\r\n        if(morphing){ var m=stag(morphT,r); hx+=(B[j]-hx)*m; hy+=(B[j+1]-hy)*m; hz+=(B[j+2]-hz)*m; }\r\n        var ox=O[j], oy=O[j+1], oz=O[j+2], vx=V[j], vy=V[j+1], vz=V[j+2], e=E[i];\r\n        var px=hx+ox, py=hy+oy, pz=hz+oz;\r\n        if(push){\r\n          var dx=px-ro.x, dy=py-ro.y, dz=pz-ro.z, al=dx*rd.x+dy*rd.y+dz*rd.z;\r\n          var d2=dx*dx+dy*dy+dz*dz-al*al;\r\n          if(d2<R2){ var f=1-Math.sqrt(Math.max(0,d2))\/RAD; f*=f;\r\n            vx+=mvx*f*.95; vy+=mvy*f*.95; vz+=mvz*f*.95+(r-.5)*f*spd*.5;\r\n            if(f*sp>e) e=f*sp; }\r\n        }\r\n        if(splash){\r\n          var sx=px-splash.x, sy=py-splash.y, sz=pz-splash.z, sd=Math.sqrt(sx*sx+sy*sy+sz*sz);\r\n          if(sd<1.1){ var sf=1-sd\/1.1, inv=1\/(sd+.001); vx+=sx*inv*sf*4.5; vy+=sy*inv*sf*4.5; vz+=sz*inv*sf*4.5; if(sf>e) e=sf; }\r\n        }\r\n        if(e>.01){\r\n          vx+=Math.sin(py*2.3+t*1.7+r*6.28)*e*dt*3.2;\r\n          vy+=(Math.cos(px*2.1+t*1.3+r*3.1)*2.4+.5)*e*dt;\r\n          vz+=Math.sin(pz*2+t*1.9+r*9.4)*e*dt*3.2;\r\n        }\r\n        var k=1-e, ks=.5+7.5*k*k;\r\n        vx-=ox*ks*dt; vy-=oy*ks*dt; vz-=oz*ks*dt;\r\n        vx*=damp; vy*=damp; vz*=damp;\r\n        px+=vx*dt; py+=vy*dt; pz+=vz*dt;\r\n        if(px>BX){px=BX;vx*=-.2;} else if(px<-BX){px=-BX;vx*=-.2;}\r\n        if(py>BYMAX){py=BYMAX;vy*=-.2;} else if(py<BYMIN){py=BYMIN;vy*=-.2;}\r\n        if(pz>BZ){pz=BZ;vz*=-.2;} else if(pz<-BZ){pz=-BZ;vz*=-.2;}\r\n        O[j]=px-hx; O[j+1]=py-hy; O[j+2]=pz-hz; V[j]=vx; V[j+1]=vy; V[j+2]=vz;\r\n        P[j]=px; P[j+1]=py; P[j+2]=pz; E[i]=e*decay;\r\n      }\r\n      splash=null;\r\n      aP.needsUpdate=true; aE.needsUpdate=true;\r\n    }\r\n\r\n\r\n    \/* ---------- HUD ---------- *\/\r\n    var intro=root.querySelector('.h-intro'), stageUI=root.querySelector('.h-stage'), flash=root.querySelector('.h-flash');\r\n    var pctEl=root.querySelector('.h-pct'), pctTxt=root.querySelector('.h-pct span'), pctBar=root.querySelector('.h-pct b');\r\n    var titleEl=root.querySelector('.h-title'), curEl=root.querySelector('.h-cur'), sides=root.querySelectorAll('.h-side');\r\n    var FA='0123456789'; function fa(n){return String(n).replace(\/\\d\/g,function(d){return FA[d];});}\r\n    function wrap(i){return (i+shapes.length)%shapes.length;}\r\n    function labels(){ titleEl.textContent=shapes[cur].title; curEl.textContent=shapes[cur].name; sides[0].textContent=shapes[wrap(cur+1)].name; sides[1].textContent=shapes[wrap(cur-1)].name; }\r\n    labels();\r\n    function morphTo(arr){\r\n      if(morphing){ for(var i=0,j=0;i<N;i++,j+=3){ var m=stag(morphT,rnd[i]); A[j]+=(B[j]-A[j])*m; A[j+1]+=(B[j+1]-A[j+1])*m; A[j+2]+=(B[j+2]-A[j+2])*m; } }\r\n      B.set(arr); morphT=0; morphing=true;\r\n    }\r\n    function go(dir){ if(mode!=='home') return; cur=wrap(cur+dir); morphTo(shapes[cur].pos); labels(); }\r\n    root.querySelector('.h-next').addEventListener('click',function(){go(1);});\r\n    root.querySelector('.h-prev').addEventListener('click',function(){go(-1);});\r\n    sides.forEach(function(b){b.addEventListener('click',function(){go(+b.getAttribute('data-go'));});});\r\n\r\n    \/* ---------- input ---------- *\/\r\n    var mouse=new T.Vector2(0,0), mouseS=new T.Vector2(0,0), ray=new T.Raycaster();\r\n    var plane=new T.Plane(new T.Vector3(0,0,1),-STAGE_Z), hit=new T.Vector3(), hover=false, touchScatter=false, stageOn=false, inside=false;\r\n    stick.addEventListener('pointermove',function(e){\r\n      var r=stick.getBoundingClientRect();\r\n      mouse.x=(e.clientX-r.left)\/r.width*2-1; mouse.y=-(e.clientY-r.top)\/r.height*2+1;\r\n    });\r\n    stick.addEventListener('pointerleave',function(){ mouse.set(0,0); hover=false; inside=false; hasPrev=false; });\r\n    \/* ---------- custom cursor ---------- *\/\r\n    var cursorEl=root.querySelector('.h-cursor'), burst=cursorEl.querySelector('.c-burst'), curMode='star', overClick=false, overPanel=false, dragging=false, dragTarget='hero', dragX=0, dragVel=0, dragRot=0;\r\n    var probCtl={hover:false,rot:0,vel:0};\r\n    var finePtr=window.matchMedia('(hover:hover) and (pointer:fine)').matches;\r\n    root.addEventListener('pointermove',function(e){\r\n      if(e.pointerType!=='mouse') return;\r\n      cursorEl.style.transform='translate('+e.clientX+'px,'+e.clientY+'px)';\r\n      cursorEl.classList.add('on');\r\n      overClick=!!(e.target.closest && e.target.closest('button,a,input[type=checkbox]'));\r\n      var overField=!!(e.target.closest && e.target.closest('input[type=text],input[type=email],textarea'));\r\n      var pg=e.target.closest && e.target.closest('.p-glass'); overPanel=(!!(pg && pg.querySelector('.p-follow')) && !overClick) || overField;\r\n      var r=stick.getBoundingClientRect(); inside=e.clientY>=r.top && e.clientY<=r.bottom && !!e.target.closest('.h-stick');\r\n      decideCursor();\r\n    });\r\n    root.addEventListener('pointerleave',function(){ cursorEl.classList.remove('on'); overClick=false; overPanel=false; });\r\n    root.addEventListener('pointerdown',function(e){\r\n      if(e.pointerType!=='mouse') return;\r\n      if(curMode==='point'){\r\n        cursorEl.classList.add('press');\r\n        burst.classList.remove('go'); void burst.offsetWidth; burst.classList.add('go');\r\n      } else if(curMode==='hand'){\r\n        dragging=true; dragTarget=probCtl.hover?'prob':'hero'; dragX=e.clientX; dragVel=0; probCtl.vel=0; cursorEl.classList.add('grab');\r\n      }\r\n    });\r\n    window.addEventListener('pointermove',function(e){\r\n      if(!dragging) return;\r\n      var dx=e.clientX-dragX; dragX=e.clientX;\r\n      if(dragTarget==='prob'){ probCtl.vel=dx*.009; probCtl.rot+=probCtl.vel; }\r\n      else { dragVel=dx*.009; dragRot+=dragVel; }\r\n    });\r\n    window.addEventListener('pointerup',function(){ dragging=false; cursorEl.classList.remove('grab'); cursorEl.classList.remove('press'); });\r\n    function setCursor(m){ if(m!==curMode){ curMode=m; cursorEl.setAttribute('data-m',m); } }\r\n    function decideCursor(){\r\n      if(!finePtr) return;\r\n      var heroHand=visible && stageOn && inside && (hover || (dragging&&dragTarget==='hero'));\r\n      setCursor(overPanel?'none':overClick?'point':((heroHand||probCtl.hover||(dragging&&dragTarget==='prob'))?'hand':'star'));\r\n    }\r\n\r\n    stick.addEventListener('pointerdown',function(e){\r\n      if(e.pointerType==='mouse' || !stageOn) return;\r\n      var r=stick.getBoundingClientRect();\r\n      mouse.x=(e.clientX-r.left)\/r.width*2-1; mouse.y=-(e.clientY-r.top)\/r.height*2+1;\r\n      if(nearSculpt()) splash=sculpt.worldToLocal(hit.clone());\r\n    });\r\n    stick.addEventListener('pointerenter',function(){ inside=true; });\r\n    function nearSculpt(){\r\n      ray.setFromCamera(mouse,camera);\r\n      if(!ray.ray.intersectPlane(plane,hit)) return false;\r\n      return Math.hypot(hit.x-sculpt.position.x,(hit.y-sculpt.position.y)*.9)<2.1;\r\n    }\r\n\r\n    \/* ---------- scroll ---------- *\/\r\n    var prog=0, progS=0;\r\n    function readScroll(){\r\n      var r=track.getBoundingClientRect(), max=r.height-window.innerHeight;\r\n      prog=Math.min(1,Math.max(0,-r.top\/Math.max(1,max)));\r\n    }\r\n    window.addEventListener('scroll',readScroll,{passive:true});\r\n\r\n    function resize(){\r\n      var w=stick.clientWidth, h=stick.clientHeight;\r\n      renderer.setSize(w,h,false); camera.aspect=w\/h;\r\n      camera.fov=w\/h<.8?58:45; camera.updateProjectionMatrix();\r\n      uni.uScale.value=h*renderer.getPixelRatio()\/(2*Math.tan(camera.fov*Math.PI\/360));\r\n    }\r\n    window.addEventListener('resize',resize); resize(); readScroll();\r\n\r\n    function ss(a,b,x){ var t=Math.min(1,Math.max(0,(x-a)\/(b-a))); return t*t*(3-2*t); }\r\n    function lerp(a,b,t){return a+(b-a)*t;}\r\n    function ease(t){return t<.5?4*t*t*t:1-Math.pow(-2*t+2,3)\/2;}\r\n\r\n    var tgt=new T.Vector3(), clock=new T.Clock(), visible=true;\r\n    if('IntersectionObserver' in window){ new IntersectionObserver(function(e){visible=e[0].isIntersecting;}).observe(track); }\r\n\r\n    function frame(){\r\n      requestAnimationFrame(frame);\r\n      if(!visible) return;\r\n      var dt=Math.min(clock.getDelta(),.05), t=clock.elapsedTime;\r\n      progS+=(prog-progS)*Math.min(1,dt*6);\r\n      var p=progS;\r\n      mouseS.lerp(mouse,Math.min(1,dt*4));\r\n\r\n      \/* camera path *\/\r\n      var z,y;\r\n      if(p<.58){ z=lerp(13.5,1.2,ease(p\/.58)); y=0; }\r\n      else { var q=ss(.58,1,p); z=lerp(1.2,-13.2,q); y=lerp(0,1.1,q); }\r\n      var look=ss(.42,.82,p);\r\n      camera.position.set(mouseS.x*.45,y+mouseS.y*.28,z);\r\n      tgt.set(0,lerp(0,.35,look),lerp(-4,STAGE_Z,look));\r\n      camera.lookAt(tgt);\r\n      \/* scene layout: slide the stage left (or up on narrow screens) for text scenes *\/\r\n      if(mode!=='home' && p<.8) setMode('home');\r\n      modeK+=((mode==='home'?0:1)-modeK)*Math.min(1,dt*2.4);\r\n      var vw=stick.clientWidth, vh=stick.clientHeight, oxT=0, oyT=0, kk=Math.min(1,dt*2.4);\r\n      if(mode==='problem'||mode==='solution'||mode==='notfor'||mode==='faq'){ if(vw<1100) oyT=vh*.2; else oxT=vw*.27*(root.classList.contains('en')?-1:1); }\r\n      else if(mode==='process'||mode==='projects'||mode==='contact'){ oyT=vw<1100?vh*.2:-vh*.06; }\r\n      offX+=(oxT-offX)*kk; offY+=(oyT-offY)*kk;\r\n      if(Math.abs(offX)>.5||Math.abs(offY)>.5) camera.setViewOffset(vw,vh,offX,offY,vw,vh);\r\n      else if(camera.view && camera.view.enabled) camera.clearViewOffset();\r\n\r\n      \/* portal opening *\/\r\n      var open=ss(.26,.6,p);\r\n      outer.group.rotation.z=t*.05+open*.6;\r\n      outer.blocks.forEach(function(b){ var u=b.userData;\r\n        b.position.copy(u.dir).multiplyScalar(open*(2.2+u.r1*3.2)); b.position.z=open*u.r2*5;\r\n        b.rotation.set(open*u.r2*1.6,open*u.r3*1.6,open*u.r2*.8); });\r\n      inner.group.rotation.z=-t*.18; inner.group.rotation.y=-.5+Math.sin(t*.4)*.2;\r\n      inner.blocks.forEach(function(b){ var u=b.userData;\r\n        b.position.copy(u.dir).multiplyScalar(open*(1.6+u.r1*2)); b.position.z=open*u.r3*4; });\r\n      star.rotation.y=t*.6; star.rotation.z=Math.sin(t*.5)*.15;\r\n      var sk=1-ss(.3,.52,p), pulse=.85+.15*Math.sin(t*2.2); star.scale.setScalar(.72*sk+.0001);\r\n      var tw=.75+.15*Math.sin(t*3.1)+.1*Math.sin(t*7.3);\r\n      starHalo.material.opacity=.55*sk*pulse; starHalo.scale.setScalar(5.4*(.94+.06*Math.sin(t*1.6)));\r\n      starRays.material.opacity=sk*(.85+.15*tw); starRays.scale.setScalar(1.9*(.94+.08*tw));\r\n      starWide.material.opacity=.18*sk*pulse;\r\n      starLight.intensity=3.2*sk*pulse;\r\n      seam.material.opacity=.22*(1-open);\r\n      cyan.intensity=2.4*(1-open*.6);\r\n\r\n      \/* atmosphere *\/\r\n      bg.copy(BG_A).lerp(BG_B,ss(.55,.9,p)); scene.fog.color.copy(bg);\r\n      mists.forEach(function(m){ m.position.x+=m.userData.v; if(m.position.x>14) m.position.x=-14; if(m.position.x<-14) m.position.x=14; });\r\n      dust.rotation.y=t*.01; dust.position.y=Math.sin(t*.2)*.2;\r\n      halo.material.opacity=.75*ss(.6,.9,p);\r\n\r\n      \/* sculpture *\/\r\n      stageOn=p>.84;\r\n      hover=stageOn && ((dragging&&dragTarget==='hero') || nearSculpt());\r\n      var active=false;\r\n      if(stageOn && inside && finePtr){\r\n        ray.setFromCamera(mouse,camera);\r\n        if(ray.ray.intersectPlane(plane,hit)){\r\n          mLoc.copy(hit); sculpt.worldToLocal(mLoc);\r\n          if(hasPrev){ mVel.subVectors(mLoc,mPrev).divideScalar(Math.max(dt,.001)); if(mVel.length()>14) mVel.setLength(14); active=true; }\r\n          mPrev.copy(mLoc); hasPrev=true;\r\n          ro.copy(camera.position); sculpt.worldToLocal(ro);\r\n          rd.copy(camera.position).add(ray.ray.direction); sculpt.worldToLocal(rd); rd.sub(ro).normalize();\r\n        }\r\n      } else { hasPrev=false; }\r\n      uni.uTime.value=t;\r\n      if(!(dragging&&dragTarget==='hero')){ dragRot+=dragVel; dragVel*=.93; dragRot*=Math.exp(-dt*.5); }\r\n      dragRot=Math.max(-.7,Math.min(.7,dragRot));\r\n      var MAXR=.698;   \/\/ 40\u00b0\r\n      sculpt.rotation.y=Math.max(-MAXR,Math.min(MAXR,dragRot+(reduce?0:Math.sin(t*.35)*.42)));\r\n      sculpt.position.y=.55+Math.sin(t*.8)*.08;\r\n      if(morphing){ morphT=Math.min(1,morphT+dt\/1.6); }\r\n      if(p>.45) simulate(dt,t,active);\r\n      if(morphing && morphT>=1){ A.set(B); morphing=false; }\r\n      decideCursor();\r\n\r\n      \/* HUD *\/\r\n      intro.style.opacity=String(1-ss(.03,.16,p));\r\n      intro.style.visibility=p>.17?'hidden':'visible';\r\n      intro.style.transform='translateY('+(-ss(.03,.16,p)*30)+'px)';\r\n      var so=ss(.86,.97,p); topLayer.classList.toggle('pre',!stageOn); pctEl.style.opacity=String(1-so); pctEl.style.visibility=so>.98?'hidden':'visible'; stageUI.style.opacity=String(so); stageUI.classList.toggle('prob',mode!=='home'); stageUI.style.visibility=so<.02?'hidden':'visible';\r\n      flash.style.opacity=String(Math.max(0,1-Math.abs(p-.58)\/.07)*.9);\r\n      pctTxt.textContent=fa(Math.round(p*100))+'%'; pctBar.style.transform='scaleX('+p+')';\r\n\r\n      renderer.render(scene,camera);\r\n    }\r\n    function makeQuestion(n){\r\n      var b=new Builder(), path=[], k;\r\n      for(k=0;k<=44;k++){ var a=(165-k*(220\/44))*Math.PI\/180; path.push(V3(Math.cos(a)*.85,.78+Math.sin(a)*.85,0)); }\r\n      var e=path[path.length-1], q=[.06,-.12], s0=[0,-.42];\r\n      for(k=1;k<=14;k++){ var t=k\/14, u=1-t; path.push(V3(u*u*e[0]+2*u*t*q[0]+t*t*s0[0],u*u*e[1]+2*u*t*q[1]+t*t*s0[1],0)); }\r\n      path.push(V3(0,-.62,0));\r\n      for(k=0;k<path.length-1;k++) b.tube(path[k],path[k+1],.24);\r\n      b.sphere(path[0][0],path[0][1],0,.24);\r\n      b.sphere(0,-1.32,0,.3);\r\n      b.fn(.6,function(){ var r=.3*Math.cbrt(R()), u=R()*2-1, a=R()*6.28, qq=Math.sqrt(1-u*u); return V3(qq*Math.cos(a)*r,-1.32+u*r,qq*Math.sin(a)*r); });\r\n      return b.build({n:n,ry:-.25});\r\n    }\r\n    \/* scene 3 icon: a person with raised arms, a question turning into a key *\/\r\n    function makeSolution(n){\r\n      var b=new Builder(), k;\r\n      function qmark(ox,oy,s){ var path=[];\r\n        for(k=0;k<=30;k++){ var a=(165-k*(220\/30))*Math.PI\/180; path.push(V3(ox+Math.cos(a)*.85*s,oy+(.78+Math.sin(a)*.85)*s,0)); }\r\n        var e=path[path.length-1];\r\n        for(k=1;k<=10;k++){ var t=k\/10, u=1-t; path.push(V3(ox+(u*u*(e[0]-ox)\/s+2*u*t*.06)*s,oy+(u*u*(e[1]-oy)\/s+2*u*t*-.12+t*t*-.42)*s,0)); }\r\n        path.push(V3(ox,oy-.62*s,0));\r\n        for(k=0;k<path.length-1;k++) b.tube(path[k],path[k+1],.24*s);\r\n        b.sphere(ox,oy-1.32*s,0,.3*s);\r\n      }\r\n      qmark(-1.55,1.25,.5);                                    \/\/ question\r\n      b.tube(V3(-.85,1.3,0),V3(.72,1.3,0),.06);               \/\/ arrow\r\n      b.tube(V3(.78,1.3,0),V3(.52,1.52,0),.06); b.tube(V3(.78,1.3,0),V3(.52,1.08,0),.06);\r\n      for(k=0;k<36;k++){ var a0=k\/36*Math.PI*2, a1=(k+1)\/36*Math.PI*2;   \/\/ key ring\r\n        b.tube(V3(1.55+Math.cos(a0)*.3,1.72+Math.sin(a0)*.3,0),V3(1.55+Math.cos(a1)*.3,1.72+Math.sin(a1)*.3,0),.09); }\r\n      b.tube(V3(1.55,1.42,0),V3(1.55,.62,0),.1);              \/\/ key shaft\r\n      b.tube(V3(1.55,.9,0),V3(1.86,.9,0),.09); b.tube(V3(1.55,.68,0),V3(1.8,.68,0),.09);\r\n      b.sphere(0,.05,0,.46);                                   \/\/ head\r\n      b.dome(0,.12,-.04,.52,.56,.5);                           \/\/ hair\r\n      b.box(0,-1.2,0,1.25,1.15,.55);                           \/\/ torso\r\n      b.tube(V3(-.52,-.66,0),V3(.52,-.66,0),.26);              \/\/ shoulders\r\n      b.tube(V3(-.5,-.62,0),V3(-1.55,.05,0),.24); b.sphere(-1.55,.05,0,.24);   \/\/ left arm\r\n      b.tube(V3(.5,-.62,0),V3(1.55,.05,0),.24); b.sphere(1.55,.05,0,.24);      \/\/ right arm\r\n      return b.build({n:n,ry:-.15});\r\n    }\r\n    \/* scene 4: six orbs on an orbit around the platform \u2014 the six steps *\/\r\n    function makeOrbs(n,cnt){ cnt=cnt||6;\r\n      var b=new Builder(), k;\r\n      for(k=0;k<cnt;k++){ var a=k\/cnt*Math.PI*2+Math.PI\/2, x=Math.cos(a)*2.25, z=Math.sin(a)*1.75;\r\n        b.sphere(x,-1.25,z,.3); b.fn(1.1,(function(cx,cz){ return function(){ var r=.3*Math.cbrt(R()), u=R()*2-1, g=R()*6.28, q=Math.sqrt(1-u*u); return V3(cx+q*Math.cos(g)*r,-1.25+u*r,cz+q*Math.sin(g)*r); }; })(x,z)); }\r\n      b.fn(3.2,function(){ var a=R()*Math.PI*2; return V3(Math.cos(a)*2.25+(R()-.5)*.05,-1.25+(R()-.5)*.05,Math.sin(a)*1.75+(R()-.5)*.05); });\r\n      return b.build({n:n,nofit:true});\r\n    }\r\n    \/* scene 6 icon: a \"no\" sign *\/\r\n    function makeNoSign(n){\r\n      var b=new Builder(), k, Rr=1.45;\r\n      for(k=0;k<64;k++){ var a0=k\/64*Math.PI*2, a1=(k+1)\/64*Math.PI*2;\r\n        b.tube(V3(Math.cos(a0)*Rr,Math.sin(a0)*Rr,0),V3(Math.cos(a1)*Rr,Math.sin(a1)*Rr,0),.27); }\r\n      var d=Rr*.72; b.tube(V3(-d,d,0),V3(d,-d,0),.25);\r\n      return b.build({n:n,ry:-.2});\r\n    }\r\n    \/* scene 7 icon: the letters FAQ in dots *\/\r\n    function makeFAQ(n){\r\n      var b=new Builder(), tp=textPts('FAQ',0,0,0,3.4,'700 {s}px Quicksand, Estedad, sans-serif',.4);\r\n      if(!tp) return makeQuestion(n);\r\n      b.fn(1,tp); return b.build({n:n});\r\n    }\r\n    \/* scene 8 icon: an envelope *\/\r\n    function makeEnvelope(n){\r\n      var b=new Builder(), W=1.7, H=1.1, z=.06;\r\n      b.box(0,0,0,W*2,H*2,.16);\r\n      b.tube(V3(-W,H,z+.08),V3(0,-.05,z+.08),.07); b.tube(V3(W,H,z+.08),V3(0,-.05,z+.08),.07);   \/\/ flap\r\n      b.tube(V3(-W,-H,z+.08),V3(-.45,.25,z+.08),.05); b.tube(V3(W,-H,z+.08),V3(.45,.25,z+.08),.05);\r\n      return b.build({n:n,ry:-.2});\r\n    }\r\n    \/* ================= scenes inside the hero ================= *\/\r\n    var SCENE_ICON={problem:makeQuestion(N),solution:makeSolution(N),process:makeOrbs(N),projects:makeOrbs(N,3),notfor:makeNoSign(N),faq:makeFAQ(N),contact:makeEnvelope(N)}, offX=0, offY=0, spinA=0;\r\n    var mode='home', modeK=0, panels=root.querySelectorAll('.p-glass');\r\n    var SCENES={'#ilmh':'home','#ilm-problem':'problem','#ilm-solution':'solution','#ilm-process':'process','#ilm-projects':'projects','#ilm-notfor':'notfor','#ilm-faq':'faq','#ilm-contact':'contact'}, HASH={};\r\n    for(var hk in SCENES) HASH[SCENES[hk]]=hk;\r\n    function setMode(m){\r\n      if(m===mode) return;\r\n      mode=m;\r\n      morphTo(m==='home'?shapes[cur].pos:SCENE_ICON[m]);\r\n      panels.forEach(function(pn){ var on=pn.getAttribute('data-scene')===m; pn.classList.toggle('show',on); pn.setAttribute('aria-hidden',on?'false':'true'); var bd=pn.querySelector('.p-body'); if(on&&bd) bd.scrollTop=0; });\r\n      markMenu(HASH[m]);\r\n    }\r\n    if(document.fonts&&document.fonts.ready) document.fonts.ready.then(function(){ var si=shapes.length-1; shapes[si].pos=makeShop(); if(mode==='home'&&cur===si) morphTo(shapes[si].pos); SCENE_ICON.faq=makeFAQ(N); if(mode==='faq') morphTo(SCENE_ICON.faq); });\r\n    function stageEnd(){ var r=track.getBoundingClientRect(); return window.pageYOffset+r.top+r.height-window.innerHeight; }\r\n    sceneNav=function(hash){\r\n      var m=SCENES[hash]; if(!m) return;          \/\/ scenes not built yet are ignored\r\n      if(prog<.97) window.scrollTo({top:stageEnd(),behavior:'smooth'});\r\n      setMode(m);\r\n    };\r\n    renderer.compile(scene,camera);\r\n    frame();\r\n    setTimeout(function(){ root.querySelector('.h-load').classList.add('gone'); },250);\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>FA 1Enter the portalilmora 2What is the main problem? 3How do we solve this problem? 4What is the work process? 5Which project do you need? 6Who do we not work for? 7Frequently asked questions 8Let us talk about your project! Telegram WhatsApp Use these for short questions. We reply in writing within one working day. [&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-2513","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/pages\/2513","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/comments?post=2513"}],"version-history":[{"count":14,"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/pages\/2513\/revisions"}],"predecessor-version":[{"id":7003,"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/pages\/2513\/revisions\/7003"}],"wp:attachment":[{"href":"http:\/\/webvibe.digital\/en\/wp-json\/wp\/v2\/media?parent=2513"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}