https://saasmaster.net/_next/static/chunks/2918-fa9be66611068461.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2918],{33538:(e,t,s)=>{s.d(t,{ScrollStory:()=>T});var l=s(95155),a=s(12115),r=s(98500),n=s.n(r),i=s(18310),o=s(14210),d=s(46004),c=s(28245),x=s(55809),m=s(67192),p=s(20232),u=s(21628),h=s(85352);let f=[{key:"complex",label:"Complex",color:"#8b5cf6"},{key:"analyze",label:"Analyze",color:"#a855f7"},{key:"script",label:"Script",color:"#d946ef"},{key:"produce",label:"Produce",color:"#f97316"},{key:"clarity",label:"Clarity",color:"#2dd4bf"}],b=["A product that does too much to explain in a sentence.","Find what customers actually need to understand.","Turn that into a story people can follow.","Record the real product. Cut every wasted second.","Now they understand it — and act."],g=["SaaS","AI agents","WordPress","MCP","API","Chrome extensions","Automations","LLMs","Webhooks","No-code"],j=["Audience","Core problem","Key workflow","Differentiator","Desired action"],v=[{n:"01",title:"The problem",line:"The job they're stuck on today"},{n:"02",title:"How it works",line:"The shortest path to value"},{n:"03",title:"Why it matters",line:"What changes once it clicks"}],y=["Now I get it.","That's exactly our workflow.","Starting a trial."],N="SaaS and AI video production",w="that makes complex products easy to understand.",k="I find the story inside your software and turn it into videos buyers can understand, remember, and act on.",S="Plan My Video",P="/contact",G="Watch the Work",A="/portfolio",C="800+ software videos \xb7 200+ brands \xb7 English + Spanish",z=e=>Math.min(1,Math.max(0,e));function T({videos:e=[]}){var t;let s=(0,i.I)(),r=(0,a.useRef)(null),[n,x]=(0,a.useState)(0),[m,p]=(0,a.useState)(!1),{scrollYProgress:u}=(0,o.L)({target:r,offset:["start start","end end"]}),f=(0,d.z)(u,{stiffness:220,damping:34,restDelta:5e-4});t=e=>{x(Math.min(4,Math.max(0,Math.floor(5*e)))),p(e>.02&&e<.99)},(0,a.useInsertionEffect)(()=>u.on("change",t),[u,"change",t]);let b=(0,c.d)(.5),g=(0,c.d)(.5),j=(0,d.z)(b,{stiffness:70,damping:18}),v=(0,d.z)(g,{stiffness:70,damping:18});return(0,a.useEffect)(()=>{let e=e=>{b.set(e.clientX/window.innerWidth),g.set(e.clientY/window.innerHeight)};return window.addEventListener("pointermove",e,{passive:!0}),()=>window.removeEventListener("pointermove",e)},[b,g]),(0,l.jsxs)("section",{className:"relative",children:[(0,l.jsx)(h.FilmHeader,{storyStage:n,storyActive:m,videos:e}),(0,l.jsx)("div",{ref:r,className:s?"relative":"relative h-[420vh]",children:s?(0,l.jsx)(ea,{}):(0,l.jsxs)("div",{className:"sticky top-0 h-[100dvh] overflow-hidden",children:[(0,l.jsx)(M,{}),(0,l.jsx)("div",{className:"relative mx-auto h-full w-full max-w-7xl px-5 pb-8 pt-24 sm:px-8",children:(0,l.jsxs)("div",{className:"relative h-full",children:[(0,l.jsx)("div",{"aria-hidden":!0,className:"pointer-events-none absolute inset-0 [perspective:1400px]",children:(0,l.jsx)(E,{progress:f,mx:j,my:v})}),(0,l.jsx)(Q,{progress:f}),(0,l.jsx)(Y,{progress:f}),(0,l.jsx)(ee,{progress:f}),(0,l.jsx)(es,{progress:f}),(0,l.jsx)(el,{progress:f})]})})]})})]})}function M(){return(0,l.jsxs)("div",{"aria-hidden":!0,className:"absolute inset-0",children:[(0,l.jsx)("div",{className:"absolute inset-0",style:{background:"radial-gradient(52rem 36rem at 22% 16%, color-mix(in srgb, var(--color-vio-500) 16%, transparent), transparent 62%), radial-gradient(46rem 32rem at 80% 72%, color-mix(in srgb, var(--color-cop-500) 13%, transparent), transparent 60%)"}}),(0,l.jsx)("div",{className:"bg-grid absolute inset-0 opacity-40 [mask-image:linear-gradient(180deg,black,transparent)]"}),(0,l.jsx)("div",{className:"absolute inset-0",style:{background:"radial-gradient(120% 90% at 50% 45%, transparent 55%, color-mix(in srgb, var(--bg) 88%, transparent) 100%)"}})]})}function E({progress:e,mx:t,my:s}){let a=(0,x.G)(e,[0,1],[6,0]),r=(0,x.G)(e,[0,1],[1.04,1]),n=(0,x.G)(e,[0,1],[10,-4]),i=(0,x.G)(t,[0,1],[-10,10]),o=(0,x.G)(s,[0,1],[-6,6]);return(0,l.jsx)(m.P.div,{className:"relative h-full w-full",style:{rotateX:a,scale:r,y:n},children:(0,l.jsxs)(m.P.div,{className:"absolute inset-0",style:{x:i,y:o},children:[(0,l.jsx)(L,{progress:e}),(0,l.jsx)(I,{progress:e}),(0,l.jsx)(_,{progress:e}),(0,l.jsx)(D,{progress:e}),(0,l.jsx)(Z,{progress:e}),(0,l.jsx)(X,{progress:e})]})})}function L({progress:e}

1){let t=(0,x.G)(e,[0,.1,.26],[.9,.75,0]),s=(0,x.G)(e,[0,.26],[1,.92]);return(0,l.jsx)(m.P.div,{className:"absolute inset-0",style:{opacity:t,scale:s},children:g.map((t,s)=>(0,l.jsx)($,{label:t,index:s,progress:e},t))})}let W=[{left:"10%",top:"24%",size:"text-[19px]",dim:"text-fg"},{left:"70%",top:"18%",size:"text-[15px]",dim:"text-fg-muted"},{left:"24%",top:"64%",size:"text-[22px]",dim:"text-fg"},{left:"64%",top:"70%",size:"text-[14px]",dim:"text-fg-muted"},{left:"45%",top:"15%",size:"text-[17px]",dim:"text-fg-muted"},{left:"15%",top:"43%",size:"text-[13px]",dim:"text-fg-muted"},{left:"78%",top:"45%",size:"text-[18px]",dim:"text-fg-muted"},{left:"38%",top:"78%",size:"text-[15px]",dim:"text-fg-muted"},{left:"56%",top:"40%",size:"text-[13px]",dim:"text-fg-dim"},{left:"30%",top:"33%",size:"text-[14px]",dim:"text-fg-muted"}];function $({label:e,index:t,progress:s}){let a=(0,x.G)(s,[0,.26],[0,t%2==0?16:-16]),r=W[t%W.length];return(0,l.jsx)(m.P.span,{style:{left:r.left,top:r.top,y:a},className:`absolute whitespace-nowrap rounded-lg border border-line-strong bg-surface px-3 py-1.5 font-semibold tracking-tight backdrop-blur-sm ${r.size} ${r.dim}`,children:e})}function I({progress:e}){let t=(0,x.G)(e,[.12,.95],[0,1]),s=(0,x.G)(e,[.1,.2,.9,1],[0,.7,.7,.25]),a=(0,x.G)(s,e=>.18*e),r="M 40 620 C 320 620 260 430 560 430 S 860 300 1000 210 S 1140 130 1200 110";return(0,l.jsxs)("svg",{"aria-hidden":!0,className:"absolute inset-0 h-full w-full",viewBox:"0 0 1240 760",preserveAspectRatio:"none",children:[(0,l.jsx)(m.P.path,{d:r,fill:"none",stroke:"#a855f7",strokeWidth:"12",strokeLinecap:"round",style:{pathLength:t,opacity:a,filter:"blur(12px)"}}),(0,l.jsx)(m.P.path,{d:r,fill:"none",stroke:"#c4a8ff",strokeWidth:"1.6",strokeLinecap:"round",style:{pathLength:t,opacity:s}})]})}function _({progress:e}){let t=(0,x.G)(e,[.16,.26,.4,.48],[0,1,1,0]),s=(0,x.G)(e,[.2,.44],["-6%","100%"]),a=(0,x.G)(e,[.25,.36],[1,.14]),r=(0,x.G)(e,[.29,.38],[0,1]);return(0,l.jsx)(m.P.div,{className:"absolute inset-0 flex items-center justify-center",style:{opacity:t},children:(0,l.jsxs)("div",{className:"relative w-full max-w-2xl",children:[(0,l.jsxs)("div",{className:"relative aspect-[16/10] overflow-hidden rounded-xl border border-line bg-bg-soft",children:[(0,l.jsx)(K,{noise:a,lit:r}),(0,l.jsx)(m.P.span,{className:"pointer-events-none absolute inset-x-0 z-20 h-16",style:{to

1p:s,background:"linear-gradient(180deg, transparent, rgba(168,85,247,0.22), transparent)",borderTop:"1px solid rgba(168,85,247,0.9)"}})]}),(0,l.jsx)("div",{className:"mt-4 flex flex-wrap justify-center gap-1.5",children:j.map((t,s)=>(0,l.jsx)(V,{label:t,index:s,progress:e},t))})]})})}let H=[{left:"40%",top:"30%",width:"27%",height:"26%",label:"Key workflow"},{left:"21%",top:"72%",width:"72%",height:"11%",label:"Core problem"},{left:"2.5%",top:"40%",width:"14%",height:"9%",label:"Audience"}];function K({noise:e,lit:t}){let s=[42,68,35,80,55,74,48,90,62,71];return(0,l.jsxs)("div",{className:"absolute inset-0",children:[(0,l.jsxs)(m.P.div,{style:{opacity:e},className:"absolute inset-0 flex",children:[(0,l.jsxs)("div",{className:"w-[17%] border-r border-line p-2",children:[(0,l.jsx)("span",{className:"mb-2.5 block h-2 w-2 rounded-[3px] bg-vio-500/70"}),[70,55,62,48,58,44].map((e,t)=>(0,l.jsxs)("span",{className:"mb-[7px] flex items-center gap-1",children:[(0,l.jsx)("span",{className:"h-1.5 w-1.5 shrink-0 rounded-[2px] bg-line-strong"}),(0,l.jsx)("span",{className:"h-1 rounded-full bg-line-strong",style:{width:`${e}%`}})]},t))]}),(0,l.jsxs)("div",{className:"flex-1 p-2.5",children:[(0,l.jsxs)("div",{className:"mb-2 flex items-center justify-between",children:[(0,l.jsx)("span",{className:"h-1.5 w-14 rounded-full bg-line-strong"}),(0,l.jsxs)("span",{className:"flex gap-1",children:[(0,l.jsx)("span",{className:"h-3 w-8 rounded-[3px] bg-surface"}),(0,l.jsx)("span",{className:"h-3 w-6 rounded-[3px] bg-vio-600/40"})]})]}),(0,l.jsx)("div",{className:"mb-2 grid grid-cols-3 gap-1.5",children:[0,1,2].map(e=>(0,l.jsxs)("span",{className:"rounded-md border border-line bg-surface p-1.5",children:[(0,l.jsx)("span",{className:"mb-1 block h-1 w-8 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"mb-1.5 block h-2 w-10 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"flex h-4 items-end gap-[1.5px]",children:s.slice(3*e,3*e+7).map((e,t)=>(0,l.jsx)("span",{className:"flex-1 rounded-sm bg-line-strong",style:{height:`${e}%`}},t))})]},e))}),(0,l.jsxs)("div",{className:"rounded-md border border-line",children:[(0,l.jsxs)("span",{className:"flex items-center gap-2 border-b border-line px-1.5 py-1",children:[(0,l.jsx)("span",{className:"h-1 w-6 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"h-1 w-10 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"ml-auto h-1 w-5 rounded-full bg-line-strong"})]}),[0,1,2,3].map(e=>(0,l.jsxs)("span",{className:"flex items-center gap-2 border-b border-line px-1.5 py-[5px] last:border-0",children:[(0,l.jsx)("span",{className:"h-2 w-2 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"h-1 rounded-full bg-line-strong",style:{width:`${34+9*e}%`}}),(0,l.jsx)("span",{className:"ml-auto h-2.5 w-8 rounded-full bg-surface"})]},e))]})]})]}),(0,l.jsx)(m.P.div,{style:{opacity:t},className:"absolute inset-0 z-10",children:H.map(e=>(0,l.jsx)("span",{className:"absolute rounded-md border-2",style:{left:e.left,top:e.top,width:e.width,height:e.height,borderColor:"rgba(168,85,247,0.85)",background:"rgba(168,85,247,0.10)",boxShadow:"0 0 22px -4px rgba(168,85,247,0.9)"},children:(0,l.jsx)("span",{className:"absolute -top-[7px] left-1.5 rounded-sm bg-bg-soft px-1 text-[7.5px] font-bold text-vio-500",children:e.label})},e.label))})]})}function V({label:e,index:t,progress:s}){let a=z(.24+.03*t),r=(0,x.G)(s,[a,z(a+.04)],[0,1]),n=(0,x.G)(s,[a,z(a+.04)],[8,0]);return(0,l.jsx)(m.P.span,{style:{opacity:r,y:n},className:"rounded-full border border-vio-500/45 bg-vio-600/10 px-2.5 py-1 text-[11px] font-semibold text-vio-500",children:e})}function D({progress:e}){let t=(0,x.G)(e,[.4,.48,.6,.68],[0,1,1,0]);return(0,l.jsx)(m.P.div,{className:"absolute inset-0 flex items-center justify-center",style:{opacity:t},children:(0,l.jsx)("div",{className:"grid w-full max-w-2xl gap-2 sm:grid-cols-3",children:v.map((t,s)=>(0,l.jsx)(F,{card:t,index:s,progress:e},t.n))})})}function F({card:e,index:t,progress:s}){let a=z(.44+.035*t),r=(0,x.G)(s,[a,z(a+.05)],[0,1]),n=(0,x.G)(s,[a,z(a+.05)],[18,0]);return(0,l.jsxs)(m.P.div,{style:{opacity:r,y:n},className:"rounded-xl border border-line bg-surface p-4 backdrop-blur-sm",children:[(0,l.jsx)("span",{className:"font-mono text-[10px] text-fuchsia-500",children:e.n}),(0,l.jsx)("p",{className:"mt-1.5 text-[14px] font-semibold text-fg",children:e.title}),(0,l.jsx)("p",{className:"mt-1 text-[11.5px] leading-snug text-fg-dim",children:e.line}),(0,l.jsx)("span",{className:"mt-3 block h-1 w-8 rounded-full bg-fuchsia-500/60"})]})}let O=[{label:"Hook",w:17},{label:"Problem",w:23},{label:"Workflow",w:31},{label:"Benefit",w:17},{label:"CTA",w:12}],R=[{label:"Title",left:2,w:13},{label:"Zoom",left:44,w:16},{label:"Callout",left:66,w:14}];function Z({progress:e}){let t=(0,x.G)(e,[.6,.68,.78,.86],[0,1,1,0]),s=(0,x.G)(e,[.66,.84],["4%","93%"]);return(0,l.jsx)(m.P.div,{className:"absolute inset-0 flex items-center justify-center",style:{opacity:t},children:(0,l.jsxs)("div",{className:"w-full max-w-2xl rounded-xl border border-line bg-bg-soft p-3",children:[(0,l.jsxs)("div",{className:"mb-2 flex items-center justify-between",children:[(0,l.jsxs)("span",{className:"flex items-center gap-2",children:[(0,l.jsx)("span",{className:"h-2 w-2 animate-pulse rounded-full bg-orange-500"}),(0,l.jsx)("span",{className:"font-mono text-[10px] uppercase tracking-wider text-fg-dim",children:"Assembling scenes"})]}),(0,l.jsx)("span",{className:"font-mono text-[10px] tabular-nums text-fg-dim",children:"00:42 / 01:24"})]}),(0,l.jsxs)("div",{className:"relative pl-8",children:[(0,l.jsx)("div",{"aria-hidden":!0,

1className:"relative mb-1 h-3 border-b border-line",children:Array.from({length:13}).map((e,t)=>(0,l.jsx)("span",{className:"absolute top-0 w-px bg-line-strong",style:{left:`${t/12*100}%`,height:t%3==0?"10px":"5px"}},t))}),(0,l.jsx)(B,{label:"V1",children:(0,l.jsx)("span",{className:"flex h-full w-full gap-[2px]",children:O.map(e=>(0,l.jsx)("span",{className:"relative overflow-hidden rounded-[3px] border-t-2 border-orange-400/80 bg-orange-500/15",style:{width:`${e.w}%`},children:(0,l.jsx)("span",{className:"absolute inset-x-1 top-[3px] truncate text-[7.5px] font-semibold text-fg-muted",children:e.label})},e.label))})}),(0,l.jsx)(B,{label:"V2",children:R.map(e=>(0,l.jsx)("span",{className:"absolute inset-y-0 overflow-hidden rounded-[3px] border-t-2 border-vio-400/70 bg-vio-500/15",style:{left:`${e.left}%`,width:`${e.w}%`},children:(0,l.jsx)("span",{className:"absolute inset-x-1 top-[3px] truncate text-[7.5px] font-semibold text-fg-muted",children:e.label})},e.label))}),(0,l.jsx)(B,{label:"A1",children:(0,l.jsx)("span",{className:"flex h-full w-full items-center gap-[1.5px] rounded-[3px] border-t-2 border-teal-300/50 bg-teal-400/10 px-1",children:Array.from({length:64}).map((e,t)=>(0,l.jsx)("span",{className:"flex-1 rounded-full bg-teal-200/45",style:{height:`${16+62*Math.abs(Math.sin(.8*t))}%`}},t))})}),(0,l.jsx)(m.P.span,{"aria-hidden":!0,className:"pointer-events-none absolute bottom-0 top-0 w-[1.5px] rounded-full bg-orange-400",style:{left:s,boxShadow:"0 0 10px 1px rgba(249,115,22,0.9)"},children:(0,l.jsx)("span",{className:"absolute -top-[3px] left-1/2 h-2 w-2 -translate-x-1/2 rotate-45 rounded-[1px] bg-orange-400"})})]}),(0,l.jsx)("div",{className:"mt-2.5 flex flex-wrap gap-1.5",children:["Pauses removed","Captions added","Zoom on detail","Audio cleaned"].map(e=>(0,l.jsx)("span",{className:"rounded-full border border-line bg-surface px-2 py-0.5 text-[10px] text-fg-muted",children:e},e))})]})})}function B({label:e,children:t}){return(0,l.jsxs)("div",{className:"relative mb-[3px] h-7 last:mb-0",children:[(0,l.jsx)("span",{className:"absolute -left-8 top-1/2 w-6 -translate-y-1/2 rounded-[2px] bg-surface py-[3px] text-center font-mono text-[8px] font-bold text-fg-dim",children:e}),(0,l.jsx)("div",{className:"relative h-full rounded-[4px] border border-line bg-surface",children:t})]})}function X({progress:e}){let t=(0,x.G)(e,[.78,.87],[0,1]),s=(0,x.G)(e,[.78,.87],[.96,1]);return(0,l.jsx)(m.P.div,{className:"absolute inset-0 flex items-center justify-center",style:{opacity:t,scale:s},children:(0,l.jsxs)("div",{className:"relative w-full max-w-xl",children:[(0,l.jsxs)("div",{className:"overflow-hidden rounded-xl border border-teal-400/25 bg-bg-soft shadow-[0_40px_120px_-50px_rgba(45,212,191,0.8)]",children:[(0,l.jsxs)("div",{className:"flex items-center gap-2 border-b border-line px-3 py-2",children:[(0,l.jsx)("span",{className:"h-2 w-2 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"h-2 w-2 rounded-full bg-line-strong"}),(0,l.jsx)("span",{className:"rounded bg-surface px-2 py-0.5 font-mono text-[9px] text-fg-dim",children:"yourproduct.com / demo"})]}),(0,l.jsxs)("div",{className:"relative aspect-video bg-[#08070c]",children:[(0,l.jsx)("div",{className:"absolute inset-0 flex items-center justify-center",children:(0,l.jsx)("span",{className:"flex h-12 w-12 items-center justify-center rounded-full bg-teal-400",children:(0,l.jsx)(p.A,{className:"h-5 w-5 translate-x-[1px] text-[#08070c]",fill:"currentColor","aria-hidden":!0})})}),(0,l.jsxs)("div",{className:"absolute inset-x-3 bottom-3 flex items-center gap-2",children:[(0,l.jsx)("span",{className:"h-1 flex-1 rounded-full bg-line-strong",children:(0,l.jsx)("span",{className:"block h-1 w-2/3 rounded-full bg-teal-400"})}),(0,l.jsx)("span",{className:"font-mono text-[9px] text-fg-dim",children:"1:24"})]})]})]}),y.map((t,s)=>(0,l.jsx)(J,{text:t,index:s,progress:e},t))]})})}let q=[{left:"-14%",top:"12%"},{right:"-12%",top:"42%"},{left:"-6%",bottom:"6%"}];function J({text:e,index:t,progress:s}){let a=z(.86+.025*t),r=(0,x.G)(s,[a,z(a+.04)],[0,1]),n=(0,x.G)(s,[a,z(a+.04)],[10,0]);return(0,l.jsx)(m.P.span,{style:{opacity:r,y:n,...q[t]},className:"absolute hidden rounded-full border border-teal-400/30 bg-teal-400/10 px-3 py-1.5 text-[11px] font-medium text-fg backdrop-blur lg:block",children:e})}function Y({progress:e}){let t=(0,x.G)(e,[.04,.14],[1,0]),s=(0,x.G)(e,[.04,.14],[0,-70]),a=(0,x.G)(e,e=>e>.13?"none":"auto");return(0,l.jsx)(m.P.div,{className:"absolute inset-x-0 top-[6%] z-40 sm:top-[9%]",style:{opacity:t,y:s,pointerEvents:a},children:(0,l.jsxs)("div",{className:"flex flex-col items-center px-2 text-center",children:[(0,l.jsxs)("h1",{className:"max-w-4xl text-4xl font-semibold leading-[1.06] tracking-[-0.035em] sm:text-5xl xl:text-6xl",children:[(0,l.jsx)("span",{className:"block",children:N}),(0,l.jsx)("span",{className:"text-gradient block",children:w})]}),(0,l.jsx)("p",{className:"mt-5 max-w-xl text-[15px] leading-relaxed text-fg-muted sm:text-[16.5px]",children:k}),(0,l.jsxs)("div",{className:"mt-7 flex flex-wrap items-center justify-center gap-3",children:[(0,l.jsxs)(n(),{href:P,className:"btn-glossy inline-flex cursor-pointer items-center gap-2 rounded-full px-7 py-3.5 text-sm font-bold text-white",children:[S,(0,l.jsx)(u.A,{className:"h-4 w-4","aria-hidden":!0})]}),(0,l.jsxs)(n(),{href:A,className:"btn-ghost inline-flex items-center gap-2 rounded-full px-6 py-3.5 text-sm font-semibold",children:[(0,l.jsx)(p.A,{className:"h-4 w-4","aria-hidden":!0}),G]})]}),(0,l.jsxs)("p",{className:"mt-6 flex items-center gap-2 text-[11px] font-medium text-fg-dim",children:[(0,l.jsx)("span",{className:"h-1 w-1 rounded-full bg-vio-400"}),C]})]})})}function Q({progress:e}){let t=(0,x.G)(e,[.05,.15],[1,0]);

1return(0,l.jsx)(m.P.div,{"aria-hidden":!0,className:"pointer-events-none absolute left-1/2 top-1/2 z-30 h-[140%] w-screen -translate-x-1/2 -translate-y-1/2",style:{opacity:t,background:"radial-gradient(58% 42% at 50% 34%, color-mix(in srgb, var(--bg) 90%, transparent) 0%, color-mix(in srgb, var(--bg) 74%, transparent) 38%, color-mix(in srgb, var(--bg) 40%, transparent) 62%, transparent 80%)"}})}let U=[[0,.2],[.2,.4],[.4,.6],[.6,.8],[.8,1]];function ee({progress:e}){return(0,l.jsx)("div",{className:"absolute bottom-0 left-0 z-30 w-60 sm:w-96",children:(0,l.jsx)("div",{className:"relative h-14",children:b.map((t,s)=>(0,l.jsx)(et,{index:s,text:t,progress:e},s))})})}function et({index:e,text:t,progress:s}){let[a,r]=U[e],n=(0,x.G)(s,[z(a-.03),z(a+.04),z(r-.04),z(r+.02)],[0,1,1,0]),i=(0,x.G)(s,[z(a-.03),z(a+.04)],[10,0]);return(0,l.jsxs)(m.P.p,{style:{opacity:n,y:i},className:"absolute inset-x-0 top-0 text-[12.5px] font-medium leading-snug text-fg-muted",children:[(0,l.jsx)("span",{className:"mr-2 font-mono text-[10px]",style:{color:f[e].color},children:String(e+1).padStart(2,"0")}),t]})}function es({progress:e}){let t=(0,x.G)(e,[.9,.97],[0,1]),s=(0,x.G)(e,[.9,.97],[16,0]);return(0,l.jsxs)(m.P.div,{style:{opacity:t,y:s},className:"absolute inset-x-0 bottom-16 z-40 flex flex-col items-center gap-3 px-4 text-center",children:[(0,l.jsx)("p",{className:"text-lg font-semibold tracking-[-0.02em] text-fg sm:text-2xl",children:"Complex software, made obvious."}),(0,l.jsxs)(n(),{href:P,className:"inline-flex items-center gap-2 rounded-full bg-teal-400 px-6 py-3 text-sm font-bold text-[#08070c] transition-transform hover:-translate-y-0.5",children:["Make My Product Click",(0,l.jsx)(u.A,{className:"h-4 w-4","aria-hidden":!0})]})]})}function el({progress:e}){return(0,l.jsx)("div",{"aria-hidden":!0,className:"absolute bottom-0 right-0 z-30 hidden w-40 sm:block",children:(0,l.jsx)("div",{className:"h-[2px] w-full overflow-hidden rounded-full bg-line-strong",children:(0,l.jsx)(m.P.div,{className:"h-full origin-left rounded-full bg-gradient-to-r from-vio-500 to-teal-400",style:{scaleX:e}})})})}function ea(){return(0,l.jsxs)("div",{className:"mx-auto max-w-3xl px-5 py-28 text-center sm:px-8",children:[(0,l.jsxs)("h1",{className:"text-4xl font-semibold leading-[1.06] tracking-[-0.035em] sm:text-5xl",children:[(0,l.jsx)("span",{className:"block",children:N}),(0,l.jsx)("span",{className:"text-gradient block",children:w})]}),(0,l.jsx)("p",{className:"mx-auto mt-5 max-w-xl text-[16px] leading-relaxed text-fg-muted",children:k}),(0,l.jsxs)("div",{className:"mt-8 flex flex-wrap justify-center gap-3",children:[(0,l.jsxs)(n(),{href:P,className:"btn-glossy inline-flex items-center gap-2 rounded-full px-7 py-3.5 text-sm font-bold text-white",children:[S,(0,l.jsx)(u.A,{className:"h-4 w-4","aria-hidden":!0})]}),(0,l.jsx)(n(),{href:A,className:"btn-ghost inline-flex items-center gap-2 rounded-full px-6 py-3.5 text-sm font-semibold",children:G})]}),(0,l.jsx)("p",{className:"mt-6 text-[12px] text-fg-dim",children:C}),(0,l.jsx)("ol",{className:"mt-12 space-y-3 text-left",children:b.map((e,t)=>(0,l.jsxs)("li",{className:"flex gap-3 rounded-xl border border-line bg-surface p-4",children:[(0,l.jsx)("span",{className:"font-mono text-[11px]",style:{color:f[t].color},children:String(t+1).padStart(2,"0")}),(0,l.jsx)("p",{className:"text-[14.5px] text-fg",children:e})]},t))})]})}},36999:(e,t,s)=>{s.d(t,{A:()=>l});let l=(0,s(78340).A)("moon",[["path",{d:"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z",key:"a7tn18"}]])},51900:(e,t,s)=>{s.d(t,{A:()=>l});let l=(0,s(78340).A)("sun",[["circle",{cx:"12",cy:"12",r:"4",key:"4exip2"}],["path",{d:"M12 2v2",key:"tus03m"}],["path",{d:"M12 20v2",key:"1lh1kg"}],["path",{d:"m4.93 4.93 1.41 1.41",key:"149t6j"}],["path",{d:"m17.66 17.66 1.41 1.41",key:"ptbguv"}],["path",{d:"M2 12h2",key:"1t8f8n"}],["path",{d:"M20 12h2",key:"1q8mjw"}],["path",{d:"m6.34 17.66-1.41 1.41",key:"1m8zz5"}],["path",{d:"m19.07 4.93-1.41 1.41",key:"1shlcs"}]])},70460:(e,t,s)=>{s.d(t,{D:()=>d,ThemeProvider:()=>c});var l=s(12115),a=(e,t,s,l,a,r,n,i)=>{let o=document.documentElement,d=["light","dark"];function c(t){var s;

1(Array.isArray(e)?e:[e]).forEach(e=>{let s="class"===e,l=s&&r?a.map(e=>r[e]||e):a;s?(o.classList.remove(...l),o.classList.add(r&&r[t]?r[t]:t)):o.setAttribute(e,t)}),s=t,i&&d.includes(s)&&(o.style.colorScheme=s)}if(l)c(l);else try{let e=localStorage.getItem(t)||s,l=n&&"system"===e?window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":e;c(l)}catch(e){}},r=["light","dark"],n="(prefers-color-scheme: dark)",i=l.createContext(void 0),o={setTheme:e=>{},themes:[]},d=()=>{var e;return null!=(e=l.useContext(i))?e:o},c=e=>l.useContext(i)?l.createElement(l.Fragment,null,e.children):l.createElement(m,{...e}),x=["light","dark"],m=({forcedTheme:e,disableTransitionOnChange:t=!1,enableSystem:s=!0,enableColorScheme:a=!0,storageKey:o="theme",themes:d=x,defaultTheme:c=s?"system":"light",attribute:m="data-theme",value:b,children:g,nonce:j,scriptProps:v})=>{let[y,N]=l.useState(()=>u(o,c)),[w,k]=l.useState(()=>"system"===y?f():y),S=b?Object.values(b):d,P=l.useCallback(e=>{let l=e;if(!l)return;"system"===e&&s&&(l=f());let n=b?b[l]:l,i=t?h(j):null,o=document.documentElement,d=e=>{"class"===e?(o.classList.remove(...S),n&&o.classList.add(n)):e.startsWith("data-")&&(n?o.setAttribute(e,n):o.removeAttribute(e))};if(Array.isArray(m)?m.forEach(d):d(m),a){let e=r.includes(c)?c:null,t=r.includes(l)?l:e;o.style.colorScheme=t}null==i||i()},[j]),G=l.useCallback(e=>{let t="function"==typeof e?e(y):e;N(t);try{localStorage.setItem(o,t)}catch(e){}},[y]),A=l.useCallback(t=>{k(f(t)),"system"===y&&s&&!e&&P("system")},[y,e]);l.useEffect(()=>{let e=window.matchMedia(n);return e.addListener(A),A(e),()=>e.removeListener(A)},[A]),l.useEffect(()=>{let e=e=>{e.key===o&&(e.newValue?N(e.newValue):G(c))};return window.addEventListener("storage",e),()=>window.removeEventListener("storage",e)},[G]),l.useEffect(()=>{P(null!=e?e:y)},[e,y]);let C=l.useMemo(()=>({theme:y,setTheme:G,forcedTheme:e,resolvedTheme:"system"===y?w:y,themes:s?[...d,"system"]:d,systemTheme:s?w:void 0}),[y,G,e,w,s,d]);return l.createElement(i.Provider,{value:C},l.createElement(p,{forcedTheme:e,storageKey:o,attribute:m,enableSystem:s,enableColorScheme:a,defaultTheme:c,value:b,themes:d,nonce:j,scriptProps:v}),g)},p=l.memo(({forcedTheme:e,storageKey:t,attribute:s,enableSystem:r,enableColorScheme:n,defaultTheme:i,value:o,themes:d,nonce:c,scriptProps:x})=>{let m=JSON.stringify([s,t,i,e,d,o,r,n]).slice(1,-1);return l.createElement("script",{...x,suppressHydrationWarning:!0,nonce:"",dangerouslySetInnerHTML:{__html:`(${a.toString()})(${m})`}})}),u=(e,t)=>{let s;try{s=localStorage.getItem(e)||void 0}catch(e){}return s||t},h=e=>{let t=document.createElement("style");return e&&t.setAttribute("nonce",e),t.appendChild(document.createTextNode("*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}")),document.head.appendChild(t),()=>{window.getComputedStyle(document.body),setTimeout(()=>{document.head.removeChild(t)},1)}},f=e=>(e||(e=window.matchMedia(n)),e.matches?"dark":"light")}}]);