https://callion.ai/assets/Demo-DUoE5S80.js

1import{r as a,j as e}from"./radix-ui-CJp6g9Fc.js";import{c as oe,S as ce,b as de,B as te,A as $,t as K}from"./index-43MKHkix.js";import{s as A}from"./client-MneIANOB.js";import{c as ue,N as se,L as me}from"./react-vendor-CNUW4Hq5.js";import{C as fe,L as xe}from"./loader-circle-xTJXGZRd.js";import{C as he}from"./check-BFiwdCjK.js";/**
2 * @license lucide-react v0.462.0 - ISC
3 *
4 * This source code is licensed under the ISC license.
5 * See the LICENSE file in the root directory of this source tree.
6 */const pe=oe("Lock",[["rect",{width:"18",height:"11",x:"3",y:"11",rx:"2",ry:"2",key:"1w4ew1"}],["path",{d:"M7 11V7a5 5 0 0 1 10 0v4",key:"fwvmzm"}]]);function be(r,s){const u=a.useRef(()=>{});return a.useEffect(()=>{var k,E;if(!r)return;const c=new URLSearchParams(window.location.search),l={id:crypto.randomUUID(),slug:r,session_id:s(),active_seconds:0,interactions:0,cta_clicks:0,call_requests:0,scroll_percent:0,referrer:document.referrer,device:/iPad|Tablet/i.test(navigator.userAgent)?"tablet":/Mobi/i.test(navigator.userAgent)?"mobile":"desktop",source:(k=c.get("utm_source"))==null?void 0:k.slice(0,160),campaign:(E=c.get("utm_campaign"))==null?void 0:E.slice(0,160)};let f=0,v=performance.now(),x=v,g=document.visibilityState==="visible",w=!1,i=-1/0;const p=()=>{const o=performance.now();g&&(f+=Math.max(0,Math.min(o,x+3e4)-v)),v=o,l.active_seconds=Math.min(14400,Math.floor(f/1e3))},b=()=>{p(),fetch("/api/supabase-proxy?path=%2Ffunctions%2Fv1%2Ftrack-demo-visit",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(l),keepalive:!0}).catch(()=>{})},y=o=>{if(o.isTrusted&&(p(),x=performance.now(),x-i>=1e3&&(l.interactions++,i=x),o.type==="click"&&o.target instanceof Element&&o.target.closest("button, a")&&(l.cta_clicks++,b()),o.type==="scroll")){const R=document.documentElement.scrollHeight-window.innerHeight;l.scroll_percent=Math.max(l.scroll_percent,R>0?Math.min(100,Math.round(window.scrollY/R*100)):100)}},_=()=>{p(),g=document.visibilityState==="visible",g&&(x=performance.now()),w&&b()},S=()=>{w&&b()};u.current=()=>{l.call_requests++,b()};const C=window.setTimeout(()=>{w=!0,b()},0),I=window.setInterval(()=>{g&&b()},15e3),L=["click","keydown","scroll","pointerdown"];return L.forEach(o=>window.addEventListener(o,y,{passive:!0})),document.addEventListener("visibilitychange",_),window.addEventListener("pagehide",S),()=>{window.clearTimeout(C),window.clearInterval(I),L.forEach(o=>window.removeEventListener(o,y)),document.removeEventListener("visibilitychange",_),window.removeEventListener("pagehide",S),w&&b(),u.current=()=>{}}},[r,s]),()=>u.current()}const ne="callion_demo_session";let re=null;const B=()=>{try{let r=localStorage.getItem(ne);return r||(r=crypto.randomUUID(),localStorage.setItem(ne,r)),r}catch{return re??(re=crypto.randomUUID()),re}},ge=r=>{if(!r)return"";const s=r.replace(/[^A-Za-z0-9 &]/g," ").split(/\s+/).filter(Boolean);return s.length?s.length===1?s[0].slice(0,2).toUpperCase():(s[0][0]+s[1][0]).toUpperCase():""},D=({className:r=""})=>e.jsx("div",{className:`bg-white/5 animate-[shimmer_1.4s_infinite] bg-gradient-to-r from-white/5 via-white/10 to-white/5 bg-[length:200%_100%] ${r}`});function we(r){if(!/^[A-Za-z0-9+/_=-]+$/.test(r)||r.length<8||/^[a-z0-9-]+$/.test(r))return null;try{const s=r.replace(/-/g,"+").replace(/_/g,"/"),u=s+"=".repeat((4-s.length%4)%4),c=atob(u);return/^[a-z0-9-]+$/.test(c)&&c.length>=3?c:null}catch{return null}}const Ee=()=>{var ee;const{slug:r}=ue(),[s,u]=a.useState(null),c=be((s==null?void 0:s.slug)===r?s.slug:void 0,B),[l,f]=a.useState(!0),[v,x]=a.useState(!1),[g,w]=a.useState(null),[i,p]=a.useState("idle"),[b,y]=a.useState(""),[_,S]=a.useState(""),[C,I]=a.useState(null),[L,k]=a.useState(null),[E,o]=a.useState(10),[R,ae]=a.useState(!1),[F,z]=a.useState(!1),[j,le]=a.useState(null),[Y,M]=a.use

6State(null),[V,O]=a.useState(null),d=a.useRef(null),Z=a.useRef(null),T=a.useRef(null),P=a.useRef(null);a.useEffect(()=>{let n=!1;return(async()=>{try{const{data:t,error:m}=await A.functions.invoke("turnstile-config");if(m)throw m;!n&&typeof(t==null?void 0:t.siteKey)=="string"&&t.siteKey&&le(t.siteKey)}catch{n||O("Human verification could not load. Please refresh and try again.")}})(),()=>{n=!0}},[]),a.useEffect(()=>{if(!j||document.querySelector('script[data-turnstile-loader="true"]'))return;const t=document.createElement("script");t.src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit",t.async=!0,t.defer=!0,t.dataset.turnstileLoader="true",document.head.appendChild(t)},[j]);const W=a.useCallback(()=>{!j||!T.current||!window.turnstile||P.current||(T.current.innerHTML="",P.current=window.turnstile.render(T.current,{sitekey:j,theme:"dark",appearance:"always",action:"personalized_demo_call",callback:n=>{M(n),O(null)},"expired-callback":()=>M(null),"error-callback":()=>{M(null),O("Human verification failed. Please refresh and try again.")}}))},[j]);a.useEffect(()=>{if(i!=="idle"&&i!=="error"||!j)return;let n=0;const t=()=>{window.turnstile&&T.current?W():n=window.setTimeout(t,150)};return t(),()=>window.clearTimeout(n)},[W,i,j]);const G=a.useCallback(()=>{M(null);const n=P.current;if(P.current=null,n&&window.turnstile)try{window.turnstile.remove(n)}catch{}},[]);a.useEffect(()=>{if(!r){x(!0),f(!1);return}(async()=>{try{const{data:n,error:t}=await A.from("demo_agents_public").select("slug, first_name, business_name, city, state, review_count, sales_last_year, website_url, agent_summary, market_summary, pain_points, headline, subheadline, fit_score").eq("slug",r).maybeSingle();if(n)u(n);else if(t)console.error("[demo] fetch error, rendering fallback",t),u({slug:r,first_name:"there",business_name:null,city:null,state:null,review_count:null,sales_last_year:null,website_url:null,agent_summary:null,market_summary:null,pain_points:null,headline:"Hear Callion call a lead in under 60 seconds.",subheadline:"Enter your mobile and we'll ring it right now, you play the lead.",fit_score:null});else{const m=we(r);if(m&&m!==r){const{data:h}=await A.from("demo_agents_public").select("slug").eq("slug",m).maybeSingle();if(h!=null&&h.slug){w(h.slug);return}}x(!0)}}catch(n){console.error("[demo] unexpected error, rendering fallback",n),u({slug:r,first_name:"there",business_name:null,city:null,state:null,review_count:null,sales_last_year:null,website_url:null,agent_summary:null,market_summary:null,pain_points:null,headline:"Hear Callion call a lead in under 60 seconds.",subheadline:"Enter your mobile and we'll ring it right now, you play the lead.",fit_score:null})}finally{f(!1)}})()},[r]),a.useEffect(()=>{const n=Z.current;if(!n)return;const t=new IntersectionObserver(([m])=>ae(!m.isIntersecting),{threshold:0,rootMargin:"-80px 0px 0px 0px"});return t.observe(n),()=>t.disconnect()},[l]),a.useEffect(()=>{if(!C)return;let n=!1;const t=async()=>{try{const{data:h}=await A.functions.invoke("vapi-call-status",{body:{callId:C,sessionId:B()}});!n&&h&&!h.error&&(k({status:h.status??null,endedReason:h.endedReason??null,messages:Array.isArray(h.messages)?h.messages:[]}),h.status==="ended"&&(z(!0),d.current&&(window.clearTimeout(d.current),d.current=null)))}catch{}};t();const m=setInterval(t,2500);return()=>{n=!0,clearInterval(m)}},[C]),a.useEffect(()=>{if(i!=="countdown")return;o(10);const n=setInterval(()=>{o(t=>t>0?t-1:0)},1e3);return()=>clearInterval(n)},[i]);const J=n=>{const t=n.replace(/\D/g,"").slice(0,10);return t.length<=3?t:t.length<=6?`(${t.slice(0,3)}) ${t.slice(3)}`:`(${t.slice(0,3)}) ${t.slice(3,6)}-${t.slice(6)}`},Q=async()=>{if(!(s!=null&&s.first_name))return;if(!Y){p("error"),y("Please complete the human verification before we call.");return}const n=_.replace(/\D/g,"");if(!n||n.length<10){p("error"),y("Enter a valid 10-digit US mobile number.");return}p("countdown"),y("Calling you now, pick up!"),c(),K("demo_call_started",{location:"demo_slug_page"}),I(null),k(null),z(!1),d.current&&window.clearTimeout(d.current),d.current=window.setTimeout(()=>z(!0),4e4);try{const{data:t,error:m}=await A.functions.invoke("vapi-demo-call",{body:{name:s.first_name.split(" ")[0],phone:n,voice:"male",slug:r,

6session_id:B(),turnstile_token:Y}});if(m)throw new Error(m.message||"Could not place the call.");if(t!=null&&t.error)throw new Error(t.error);p("success"),t!=null&&t.callId&&I(t.callId)}catch(t){G(),p("error"),y(t instanceof Error?t.message:"Something went wrong."),d.current&&(window.clearTimeout(d.current),d.current=null)}},ie=()=>{G(),p("idle"),y(""),I(null),k(null),z(!1),d.current&&(window.clearTimeout(d.current),d.current=null)};if(a.useEffect(()=>()=>{d.current&&window.clearTimeout(d.current)},[]),v)return e.jsx(se,{to:"/404",replace:!0});if(g)return e.jsx(se,{to:`/demo/${g}`,replace:!0});const N=((ee=s==null?void 0:s.first_name)==null?void 0:ee.split(" ")[0])||"",q=(s==null?void 0:s.business_name)||"",H=(s==null?void 0:s.city)||"",U=(s==null?void 0:s.state)||"",X=[H,U].filter(Boolean).join(", ");return ge(q||N),e.jsxs("div",{className:"min-h-screen overflow-x-hidden bg-obsidian text-white",children:[e.jsx(ce,{title:s?`${N}, Personalized Callion Demo`:"Callion Personalized Demo",description:(s==null?void 0:s.subheadline)||"A personalized look at how Callion AI calls every new real estate lead in under 60 seconds.",noindex:!0}),e.jsx("header",{className:"absolute top-0 inset-x-0 z-30 px-4 md:px-8 py-5 flex justify-center md:justify-start pointer-events-none",children:e.jsx(me,{to:"/","aria-label":"Callion home",className:"group pointer-events-auto opacity-90 transition-opacity hover:opacity-100",children:e.jsx(de,{markClassName:"size-7",wordmarkClassName:"text-lg"})})}),e.jsx("main",{children:e.jsxs("section",{ref:Z,className:"relative min-h-[100svh] flex items-center justify-center px-4 py-20 md:py-24 overflow-hidden",children:[e.jsx("div",{className:"absolute inset-0 bg-grid opacity-25 pointer-events-none"}),e.jsx("div",{className:"absolute -top-32 left-1/2 -translate-x-1/2 size-[700px] rounded-full bg-blade/10 blur-[140px] pointer-events-none"}),e.jsx("div",{className:"relative z-10 w-full max-w-xl md:max-w-2xl mx-auto",children:F?e.jsx(je,{business:q||N,city:H||U||"your market"}):e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"mb-8",children:[e.jsx("div",{className:"text-[10px] font-mono text-blade tracking-[0.25em] uppercase mb-1.5",children:"Built for you"}),e.jsx("h3",{className:"font-display text-base md:text-lg font-bold text-white truncate",children:l?e.jsx(D,{className:"h-5 w-56"}):e.jsxs(e.Fragment,{children:[q||N,X&&e.jsxs("span",{className:"text-white/50 font-normal",children:[" · ",X]})]})})]}),e.jsx("h1",{className:"font-display text-3xl sm:text-4xl md:text-5xl font-extrabold leading-[1.05] tracking-tighter text-white mb-5",children:l?e.jsxs(e.Fragment,{children:[e.jsx(D,{className:"h-10 md:h-12 w-full mb-2"}),e.jsx(D,{className:"h-10 md:h-12 w-4/5"})]}):e.jsxs(e.Fragment,{children:[N||"there",", be the first agent to call back every"," ",H||U||"local"," lead, not the fifth."]})}),e.jsx("p",{className:"text-base md:text-lg text-white/70 leading-relaxed mb-10",children:l?e.jsx(D,{className:"h-5 w-full"}):e.jsx(e.Fragment,{children:"Drop your number below to test your AI that calls back every Zillow lead before your competition finishes their coffee."})}),i==="idle"||i==="error"?e.jsxs("form",{onSubmit:n=>{n.preventDefault(),Q()},className:"space-y-4","aria-label":"Get a live call from Callion",children:[e.jsx("label",{htmlFor:"phone-hero",className:"block text-[10px] font-mono text-white/50 tracking-[0.2em] uppercase mb-1",children:"Your mobile · we call you in seconds"}),e.jsx("div",{className:"relative",children:e.jsx("input",{id:"phone-hero",type:"tel",inputMode:"tel",autoComplete:"tel",value:_,onChange:n=>S(J(n.target.value)),placeholder:"(555) 123-4567",className:"w-full h-14 md:h-16 px-4 bg-obsidian border-2 border-white/20 focus:border-blade focus:outline-none focus:ring-2 focus:ring-blade/40 text-white text-lg md:text-xl placeholder:text-white/25 font-body tabular-nums transition-colors","aria-label":"Your mobile phone number"})}),i==="error"&&e.jsxs("div",{className:"flex items-start gap-2 p-3 border border-red-500/40 bg-red-500/5 text-red-300 text-sm",children:[e.jsx(fe,{className:"size-4 mt-0.5 flex-shrink-0"}),e.jsx("span",{children:b})]}),e.jsx("div",{ref:T,className:"flex min-h-[65px] justify-center","aria-label":"Human verification"}),V&&e.jsx("p",{className:"text-center text-sm text-red-300",role:"alert",children:V}),e.jsxs(te,{type:"submit",variant:"cta",disabled:l||!Y,className:"w-full h-14 md:h-16 text-sm md:text-base",children:["Call my phone now",e.jsx($,{className:"size-5"})]}),e.jsx("p",{className:"text-center text-xs text-white/50 leading-relaxed",children:"By entering your number you agree to re

6ceive a one-time automated AI demo call."}),e.jsxs("p",{className:"text-center text-sm text-white/60",children:["Your phone rings in ",e.jsx("span",{className:"text-blade font-semibold",children:"~10 seconds"}),"."]}),e.jsxs("p",{className:"flex items-center justify-center gap-2 text-[11px] text-white/40",children:[e.jsx(pe,{className:"size-3"}),"One call. No spam. We never share your number."]})]}):i==="countdown"?e.jsx(ye,{seconds:E,firstName:N}):i==="dialing"?e.jsxs("div",{className:"py-8 text-center",children:[e.jsxs("div",{className:"relative inline-flex mb-4",children:[e.jsx("div",{className:"absolute inset-0 rounded-full bg-blade/30 blur-xl animate-pulse"}),e.jsx("div",{className:"relative size-20 rounded-full bg-blade/10 border border-blade/40 flex items-center justify-center",children:e.jsx(xe,{className:"size-8 text-blade animate-spin"})})]}),e.jsx("h3",{className:"font-display text-2xl font-bold text-white mb-2",children:"Connecting…"}),e.jsx("p",{className:"text-white/60",children:b})]}):e.jsx(ve,{agentName:N,callData:L,onAgain:ie,countdown:E,onShowOffer:()=>z(!0)})]})})]})}),!F&&(i==="idle"||i==="error")&&e.jsxs("div",{className:"fixed bottom-0 inset-x-0 z-40 bg-obsidian/95 backdrop-blur-md border-t border-blade/30 p-3 transition-transform duration-300 ease-out",style:{transform:R?"translateY(0)":"translateY(110%)"},children:[e.jsxs("form",{onSubmit:n=>{n.preventDefault(),Q(),window.scrollTo({top:0,behavior:"smooth"})},className:"max-w-2xl mx-auto flex gap-2",children:[e.jsx("div",{className:"relative flex-1",children:e.jsx("input",{type:"tel",inputMode:"tel",autoComplete:"tel",value:_,onChange:n=>S(J(n.target.value)),placeholder:"Your mobile",className:"w-full h-12 px-3 bg-obsidian border border-white/20 focus:border-blade focus:outline-none text-white placeholder:text-white/30 text-sm tabular-nums","aria-label":"Your mobile phone number"})}),e.jsxs(te,{type:"submit",variant:"cta",className:"h-12 px-4",children:["Call me ",e.jsx($,{className:"size-4"})]})]}),e.jsx("p",{className:"max-w-2xl mx-auto mt-1.5 text-center text-[10px] text-white/40 leading-snug",children:"By entering your number you agree to receive a one-time automated AI demo call."})]}),F&&e.jsx("div",{className:"fixed bottom-0 inset-x-0 z-40 md:hidden bg-obsidian/95 backdrop-blur-md border-t border-blade/30 p-3 animate-fade-in",children:e.jsxs("a",{href:"https://app.callion.ai/sign-up",onClick:()=>K("free_signup_clicked",{location:"demo_slug_sticky"}),className:"flex items-center justify-center gap-2 w-full h-14 bg-blade text-obsidian font-display font-bold uppercase tracking-wider text-sm hover:bg-white transition-colors",children:["Start my 14-day trial ",e.jsx($,{className:"size-5"})]})})]})},ye=({seconds:r,firstName:s})=>{const c={background:`conic-gradient(hsl(var(--blade)) ${Math.max(0,Math.min(1,r/10))*360}deg, hsl(var(--blade) / 0.12) 0deg)`};return e.jsxs("div",{className:"py-6 text-center",children:[e.jsxs("div",{className:"relative inline-flex items-center justify-center mb-5",children:[e.jsx("div",{className:"absolute inset-0 rounded-full bg-blade/40 blur-2xl animate-pulse"}),e.jsx("div",{className:"relative size-28 rounded-full flex items-center justify-center transition-all duration-1000",style:c,children:e.jsx("div",{className:"size-[88%] rounded-full bg-obsidian flex items-center justify-center",children:e.jsx("span",{className:"size-4 rounded-full bg-blade shadow-[0_0_24px_hsl(var(--blade)/0.75)] animate-pulse"})})})]}),e.jsx("h3",{className:"font-display text-2xl md:text-3xl font-extrabold text-white mb-2 tracking-tight",children:"Calling you now, pick up!"}),e.jsxs("p",{className:"text-white/60 text-sm",children:[s?`${s}'s `:"","Callion AI is dialing your phone. Ringing in"," ",e.jsxs("span",{className:"font-mono text-blade tabular-nums",children:[r,"s"]}),"."]})]})},ve=({agentName:r,callData:s,onAgain:u,countdown:c,onShowOffer:l})=>{const f=s==null?void 0:s.status,v=f==="ended",x=f==="in-progress",w=v?"Call ended":x?"In call":!f||f==="queued"||f==="ringing"?"Ringing your phone":f||"Connecting";return e.jsxs("div",{className:"py-10 md:py-12 text-center animate-fade-in",children:[e.jsxs("div",{className:"relative inline-flex items-center justify-center mb-7",children:[e.jsx("span",{className:"absolute inset-0 rounded-full bg-blade/40 blur-2xl animate-pulse"}),e.jsx("span",{className:"absolute inset-[-18px] rounded-full border border-blade/30 animate-ping"}),e.jsx("div",{className:"relative size-24 md:size-28 rounded-full border border-blade/40 bg-blade/[0.08] flex items-center justify-center",children:e.jsx("span",{className:"size-4 rounded-full bg-blade shadow-[0_0_24px_hsl(var(--blade)/0.75)] animate-pulse"})})]}),e.jsxs("div",{className:"flex items-center justify-center gap-2 text-[10px] font-mono text-blade tracking-[0.3em] uppercase mb-3",children:[e.jsx("span",{className:"block size-1.5 rounded-full bg-blade animate-pulse"}),w]}),e.jsx("h3",{className:"font-display text-3xl md:text-4xl font-extrabold tracking-tight text-white mb-3",children:x?"You're on the call.":"Pick up your phone."}),e.jsx("p",{className:"text-white/60 text-sm md:text-base max-w-sm mx-auto leading-relaxed",children:x?`Stay on the line${r?`, ${r}`:""}, your offer unlocks the moment you hang up.`:"Callion AI is dialing now. Answer to hear it qualify a lead in real time."}),e.jsx("button",{type:"button",onClick:l,className:"mt-10 text-[11px] font-mono text-white/40 hover:text-blade tracking-[0.25em] uppercase transition-colors",children:"Skip ahead →"})]})},je=({business:r,city:s})=>{const u=["Your AI ISA live on every Zillow & Facebook lead within 24 hours","Answers in under 60 seconds, qualifies, and books showings, 24/7","Done-for-you setup, trained on your business","Hot leads routed straight to you"];return e.jsxs("div",{className:"animate-fade-in",children:[e.jsx("div",{className:"text-[10px] font-mono text-blade tracking-[0.25em] uppercase mb-4",children:"You just heard it answer in 10 seconds."}),e.jsxs("h2",{className:"font-display text-3xl sm:text-4xl md:text-5xl font-extrabold leading-[1.06] tracking-tighter text-white mb-8",children:["Turn it on for ",e.jsx("span",{className:"text-blade",children:r}),", and never lose another ",s," lead to a faster agent."]}),e.jsx("ul",{className:"space-y-5 mb-8",children:u.map(c=>e.jsxs("li",{className:"flex items-start gap-4",children:[e.jsx("span",{className:"mt-1 flex size-6 shrink-0 items-center justify-center rounded-full border border-blade/40 bg-blade/10",children:e.jsx(he,{className:"size-3.5 text-blade"})}),e.jsx("span",{className:"text-white/85 text-[15px] md:text-base leading-[1.6]",children:c})]},c))}),e.jsx("div",{className:"border-2 border-blade/40 bg-blade/[0.04] p-5 md:p-6 mb-4",children:e.jsx("p",{className:"font-display font-bold text-white text-base md:text-lg leading-snug",children:"Try it free for 14 days. If it doesn't book you a showing, you don't pay a cent."})}),e.jsx("p",{className:"text-[11px] font-mono text-white/50 tracking-wider up

6percase mb-8",children:"We onboard a limited number of new agents each month."}),e.jsxs("a",{href:"https://app.callion.ai/sign-up",onClick:()=>K("free_signup_clicked",{location:"demo_slug_offer"}),className:"group flex items-center justify-center gap-2 w-full h-14 md:h-16 bg-blade text-obsidian font-display font-bold uppercase tracking-wider text-sm md:text-base hover:bg-white transition-colors shadow-[0_0_40px_hsl(var(--blade)/0.4)]",children:["Start my 14-day free trial",e.jsx($,{className:"size-5 group-hover:translate-x-1 transition-transform"})]}),e.jsx("p",{className:"text-center text-xs text-white/50 mt-4",children:"No card tricks. Cancel anytime."})]})};export{Ee as default};