{svc.tagline}

{svc.supLabel &&

{svc.supLabel}

}

{svc.intro}

{svc.blocks.map((b,bi)=>(

{b.type==='text' && (

{b.h}

{b.p}

)} {b.type==='list' && (

{b.h}

5?'1fr 1fr':'1fr', gap:'7px 20px', listStyle:'none' }}>{b.items.map(li)}

)} {b.type==='steps' && (

{b.h}

{b.steps.map((s,i)=>( {i+1}{s} ))}

)} {b.type==='agents' && (

{b.h}

{b.agents.map((a,i)=>(

{a.name}

{a.items.map(li)}

))}

)} {b.type==='compare' && (

{[b.a,b.b].map((x,i)=>(

{x.h}

{x.q}

))}

)} {b.type==='featured' && (

{b.name}{b.sub}

{b.desc}

)} {b.type==='note' && (

{b.p}

)}

))} {svc.secondary &&

{svc.secondary}

}

); } /* ── title-bar buttons ── */ function WinBtns({ onMin, onMax, onClose, maxed }){ const b={ width:22, height:19, marginLeft:4, border:'1px solid rgba(255,255,255,.55)', borderRadius:4, background:'linear-gradient(180deg,#7ea9e4,#4d7fc9)', color:'#fff', fontSize:11, lineHeight:'15px', cursor:'pointer', fontFamily:SYS, display:'flex', alignItems:'center', justifyContent:'center', padding:0 }; return (

{onMin && } {onMax && }

); } /* ── one service window ── */ function ServiceWindow({ svc, win, isMobile, onFocus, onMin, onMax, onClose, onDragStart, closing }){ const maxed=win.max; const shell={ position:isMobile?'relative':'absolute', display:'flex', flexDirection:'column', background:'#f3f5f9', border:'1px solid #2b5aa5', borderRadius:isMobile?10:8, boxShadow:'0 22px 60px rgba(20,40,80,.42), 0 2px 0 rgba(255,255,255,.6) inset', overflow:'hidden', zIndex:win.z, animation:(closing?'dtWinOut':'dtPop')+' .24s ease' }; const geo=isMobile ? { width:'100%', maxWidth:520, margin:'0 auto 18px', maxHeight:'none' } : maxed ? { left:14, top:14, right:14, width:'auto', height:'calc(100% - 72px)' } : { left:win.x, top:win.y, width:win.w, maxHeight:'80vh' }; return ( ); } /* ── main ── */ function AIDesktopFull(){ const isMobile=useIsMobile(); const [wins,setWins]=useState([]); // {id,state:'open'|'min',x,y,w,z,max} const [closing,setClosing]=useState(null); const zRef=useRef(30); const openCountRef=useRef(0); const [sys,setSys]=useState('open'); // system notification: open|min|closed const [consult,setConsult]=useState('closed'); // free consult dialog const [clock,setClock]=useState(''); const [reduced,setReduced]=useState(false); const dragRef=useRef(null); useEffect(()=>{ const t=()=>setClock(new Date().toLocaleTimeString([],{hour:'2-digit',minute:'2-digit'})); t(); const i=setInterval(t,15000); return ()=>clearInterval(i); },[]); useEffect(()=>{ const m=window.matchMedia('(prefers-reduced-motion: reduce)'); setReduced(m.matches); const on=()=>setReduced(m.matches); m.addEventListener('change',on); return ()=>m.removeEventListener('change',on); },[]); const focus=useCallback((id)=>{ setWins(ws=>ws.map(w=>w.id===id?{...w,z:++zRef.current}:w)); },[]); const openService=useCallback((id)=>{ setWins(ws=>{ const ex=ws.find(w=>w.id===id); if(ex) return ws.map(w=>w.id===id?{...w,state:'open',z:++zRef.current}:w); const n=openCountRef.current++; const w=Math.min(840, window.innerWidth-40); const x=Math.max(20, (window.innerWidth-w)/2 + (n%4)*26 - 40); const y=Math.max(84, 96 + (n%4)*24); return [...ws,{ id, state:'open', x, y, w, z:++zRef.current, max:false }]; }); },[]); const closeWin=useCallback((id)=>{ setClosing(id); setTimeout(()=>{ setWins(ws=>ws.filter(w=>w.id!==id)); setClosing(null); }, reduced?0:220); },[reduced]); const minWin=useCallback((id)=>{ setWins(ws=>ws.map(w=>w.id===id?{...w,state:'min'}:w)); },[]); const restoreWin=useCallback((id)=>{ setWins(ws=>ws.map(w=>w.id===id?{...w,state:'open',z:++zRef.current}:w)); },[]); const maxWin=useCallback((id)=>{ setWins(ws=>ws.map(w=>w.id===id?{...w,max:!w.max,z:++zRef.current}:w)); },[]); /* drag */ const onDragStart=useCallback((e,id)=>{ focus(id); const win=wins.find(w=>w.id===id); if(!win) return; dragRef.current={ id, dx:e.clientX-win.x, dy:e.clientY-win.y }; const move=(ev)=>{ const d=dragRef.current; if(!d) return; let nx=ev.clientX-d.dx, ny=ev.clientY-d.dy; nx=Math.max(6, Math.min(nx, window.innerWidth-120)); ny=Math.max(70, Math.min(ny, window.innerHeight-80)); setWins(ws=>ws.map(w=>w.id===d.id?{...w,x:nx,y:ny}:w)); }; const up=()=>{ dragRef.current=null; window.removeEventListener('mousemove',move); window.removeEventListener('mouseup',up); }; window.addEventListener('mousemove',move); window.addEventListener('mouseup',up); },[wins,focus]); /* escape closes top-most open window/dialog */ useEffect(()=>{ const onKey=(e)=>{ if(e.key!=='Escape') return; if(consult==='open'){ setConsult('closed'); return; } const open=wins.filter(w=>w.state==='open'); if(open.length){ const top=open.reduce((a,b)=>b.z>a.z?b:a); closeWin(top.id); return; } if(sys==='open'){ setSys('min'); } }; window.addEventListener('keydown',onKey); return ()=>window.removeEventListener('keydown',onKey); },[wins,consult,sys,closeWin]); const [sel,setSel]=useState(null); const [launch,setLaunch]=useState(null); const activate=(id)=>{ setLaunch(id); setTimeout(()=>{ setLaunch(null); openService(id); }, reduced?0:260); }; const winShell={ background:'#f3f5f9', border:'1px solid #2b5aa5', borderRadius:8, boxShadow:'0 18px 50px rgba(20,40,80,.4), 0 2px 0 rgba(255,255,255,.6) inset', overflow:'hidden' }; const btnPrimary={ background:'linear-gradient(180deg,'+TEAL+','+TEAL_D+')', color:'#fff', border:'1px solid rgb(48,110,118)', borderRadius:6, padding:'9px 18px', fontFamily:SYS, fontSize:13, fontWeight:700, cursor:'pointer', boxShadow:'0 1px 0 rgba(255,255,255,.4) inset' }; const btnNeutral={ background:'linear-gradient(180deg,#fdfdfd,#dfe3ea)', color:'#22324a', border:'1px solid #9aa6b8', borderRadius:6, padding:'9px 18px', fontFamily:SYS, fontSize:13, fontWeight:700, cursor:'pointer' }; const taskItem=(active)=>({ display:'flex', alignItems:'center', gap:7, maxWidth:190, padding:'7px 13px', borderRadius:6, border:'1px solid rgba(255,255,255,.25)', background:active?'linear-gradient(180deg,#2c5aa0,#254e8c)':'linear-gradient(180deg,#5a8bd0,#3f74c4)', color:'#fff', fontFamily:SYS, fontSize:12.5, fontWeight:600, cursor:'pointer', boxShadow:active?'inset 0 2px 4px rgba(0,0,0,.3)':'inset 0 1px 0 rgba(255,255,255,.3)', whiteSpace:'nowrap', overflow:'hidden', textOverflow:'ellipsis' }); const sysNote=(pos)=>(

System Notification setSys('min')} onClose={()=>setSys('min')} />

Your business is ready for an AI upgrade.

Would you like to update your system?

); return (

The AI Desktop

Click a shortcut to open a service.

{isMobile && sys==='open' && sysNote({ position:'relative', margin:'0 auto 20px', width:'min(92vw,360px)' })} {/* icon grid */}

setSel(null)} style={{ position:'relative', display:'grid', gridTemplateColumns:isMobile?'repeat(3,1fr)':'repeat(3,118px)', gap:isMobile?16:'22px 40px', justifyContent:'center', maxWidth:640, margin:'0 auto', padding:isMobile?'8px 18px 130px':'26px 48px 150px' }}> {SERVICES.map((sc,i)=>(

{ e.stopPropagation(); setSel(sc.id); activate(sc.id); }} onDoubleClick={(e)=>{ e.stopPropagation(); if(!isMobile) activate(sc.id); }} onKeyDown={(e)=>{ if(e.key==='Enter'||e.key===' '){ e.preventDefault(); activate(sc.id); } }} style={{ display:'flex', flexDirection:'column', alignItems:'center', gap:8, padding:'12px 6px', borderRadius:8, cursor:'pointer', background:sel===sc.id?'rgba(60,110,180,.28)':'transparent', outline:sel===sc.id?'1px dotted rgba(255,255,255,.85)':'none', animation:reduced?'none':`dtIconIn .45s ease ${i*0.06}s both` }}>

{sc.label}

))}

{!isMobile && sys==='open' && sysNote({ position:'absolute', top:96, right:40, width:322, zIndex:20 })} {/* service windows */}

{wins.filter(w=>w.state==='open').map(w=>( ))}

{/* free consultation dialog */} {consult==='open' && (

Free AI Consultation setConsult('min')} onClose={()=>setConsult('closed')} />

)} {/* taskbar */}

{sys==='min' && } {consult==='min' && } {wins.map(w=>{ const s=SVC_MAP[w.id]; const active=w.state==='open'; return ; })}

AI SYSTEM: ONLINE

{clock}

); } window.AIDesktopFull = AIDesktopFull; window.DTGlyphShared = Glyph; })();

{children}

{svc.title}

The AI Desktop