{"version":3,"file":"ProcessSteps.CZItEWJ_.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/hoPzga5kqxtx4g0GMq6z/Ehx6idQrFYQbNmJoudfc/ProcessSteps.js"],"sourcesContent":["// Process steps: a horizontal (desktop) or vertical (phone) timeline. A sonar line draws through\n// the steps as the section scrolls, each node lights when the line reaches it.\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{useEffect,useRef,useState}from\"react\";// Shared UI kit for Benthra section components. Inlined by build.py at //@@KIT@@ (exports stripped).\nconst KIT_FONTS=`@import url(\"https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400..800&family=Martian+Mono:wdth,wght@75..112.5,300..600&display=swap\");`;const kclamp=(v,a=0,b=1)=>Math.min(b,Math.max(a,v));const keaseOut=x=>1-Math.pow(1-x,3);// Scroll progress of an element through the viewport, written to a CSS variable (--p) and\n// handed to an optional callback. Runs on rAF while near the viewport, with a slow interval\n// fallback for hidden tabs, so it never depends on scroll events alone.\n// mode \"through\": 0 when the top enters the bottom of the viewport, 1 when the bottom leaves the top.\n// mode \"pin\": 0 when the top hits the top of the viewport, 1 when the bottom hits the bottom.\nfunction useScrollProgress(ref,mode,cb,frozen){useEffect(()=>{const el=ref.current;if(!el||typeof window===\"undefined\")return;let raf=0,last=-1,lastT=0;const read=()=>{const r=el.getBoundingClientRect();const vh=window.innerHeight||800;let p;if(frozen!==undefined&&frozen>=0)p=frozen;else if(mode===\"pin\")p=kclamp(-r.top/Math.max(1,r.height-vh));else p=kclamp((vh-r.top)/(vh+r.height));if(Math.abs(p-last)>4e-4){last=p;el.style.setProperty(\"--p\",p.toFixed(4));if(cb)cb(p);}return r.bottom>-200&&r.top<vh+200;};const tick=()=>{raf=requestAnimationFrame(tick);lastT=performance.now();read();};read();raf=requestAnimationFrame(tick);const iv=window.setInterval(()=>{if(performance.now()-lastT>400)read();},250);return()=>{cancelAnimationFrame(raf);window.clearInterval(iv);};},[ref,mode,frozen]);}// True once the element has come into view (rect polling; IntersectionObserver is unreliable in Framer previews).\nfunction useSeen(ref,threshold=.2,force=false){const[seen,setSeen]=useState(force);useEffect(()=>{if(seen)return;const el=ref.current;if(!el||typeof window===\"undefined\")return;const check=()=>{const r=el.getBoundingClientRect();const vh=window.innerHeight||800;if(r.top<vh*(1-threshold)&&r.bottom>0){setSeen(true);return true;}return false;};if(check())return;const onS=()=>check();window.addEventListener(\"scroll\",onS,{passive:true});const iv=window.setInterval(check,250);// never leave content hidden: reveal after 2.5 s regardless\nconst to=window.setTimeout(()=>setSeen(true),2500);return()=>{window.removeEventListener(\"scroll\",onS);window.clearInterval(iv);window.clearTimeout(to);};},[ref,seen,threshold]);return seen;}function useReducedMotion(){const[r,setR]=useState(false);useEffect(()=>{if(typeof window===\"undefined\"||!window.matchMedia)return;const m=window.matchMedia(\"(prefers-reduced-motion: reduce)\");setR(m.matches);},[]);return r;}const DEFAULT_STEPS=[{title:\"Scope call\",body:\"Send the site, the asset list and what you need to see. A survey planner replies with a lane plan.\",meta:\"DAY 0\"},{title:\"Mission plan\",body:\"We model currents and seabed, pick the payload and agree deliverables and a fixed price.\",meta:\"DAY 1–3\"},{title:\"Launch\",body:\"K6 launches from the quay or your dock and flies to site. You watch it live in Tidewire.\",meta:\"DAY 5\"},{title:\"Survey\",body:\"The vehicle flies the lanes, re-flies anything it is unsure of and surfaces to report.\",meta:\"DAY 5–8\"},{title:\"Report\",body:\"Grids, mosaics and the event list land in your inbox, compared with your last survey.\",meta:\"DAY 9\"}];/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight auto\n * @framerIntrinsicWidth 1440\n */export default function ProcessSteps(props){const{kicker=\"HOW IT WORKS\",title=\"From first call to first report in nine days.\",steps=DEFAULT_STEPS,ink=\"#EAF3F1\",muted=\"#8AA3A6\",signal=\"#FF5B1F\",sonar=\"#5FF2D6\"}=props;const isStatic=useIsStaticRenderer();const root=useRef(null);const[lit,setLit]=useState(isStatic?99:-1);const list=steps&&steps.length?steps:DEFAULT_STEPS;useScrollProgress(root,\"through\",p=>{const k=kclamp((p-.22)/.4);setLit(Math.floor(k*list.length+.001)-(k>=1?1:0));},isStatic?1:undefined);return /*#__PURE__*/_jsx(\"div\",{style:{...props.style,width:\"100%\",containerType:\"inline-size\"},children:/*#__PURE__*/_jsxs(\"section\",{ref:root,className:\"ps\",style:{width:\"100%\",[\"--ink\"]:ink,[\"--muted\"]:muted,[\"--sig\"]:signal,[\"--son\"]:sonar,[\"--n\"]:list.length},children:[/*#__PURE__*/_jsx(\"style\",{children:CSS}),/*#__PURE__*/_jsxs(\"p\",{className:\"ps-kick\",children:[/*#__PURE__*/_jsx(\"i\",{}),kicker]}),/*#__PURE__*/_jsx(\"h2\",{children:title}),/*#__PURE__*/_jsxs(\"div\",{className:\"ps-track\",children:[/*#__PURE__*/_jsx(\"span\",{className:\"ps-rail\"}),/*#__PURE__*/_jsx(\"span\",{className:\"ps-fill\"}),/*#__PURE__*/_jsx(\"ol\",{children:list.map((s,i)=>/*#__PURE__*/_jsxs(\"li\",{className:i<=lit?\"on\":\"\",children:[/*#__PURE__*/_jsx(\"span\",{className:\"ps-node\",children:/*#__PURE__*/_jsx(\"i\",{})}),/*#__PURE__*/_jsx(\"em\",{children:s.meta}),/*#__PURE__*/_jsxs(\"b\",{children:[/*#__PURE__*/_jsx(\"small\",{children:String(i+1).padStart(2,\"0\")}),s.title]}),/*#__PURE__*/_jsx(\"p\",{children:s.body})]},i))})]})]})});}const CSS=`\n${KIT_FONTS}\n.ps{ box-sizing:border-box; padding:140px 32px; color:var(--ink); font-family:\"Schibsted Grotesk\",system-ui,sans-serif; container-type:inline-size; }\n.ps *{ box-sizing:border-box; }\n.ps-kick{ display:flex; align-items:center; gap:10px; margin:0 0 20px; font:500 11px/1 \"Martian Mono\",monospace; letter-spacing:.08em; color:var(--son); }\n.ps-kick i{ width:18px; height:1px; background:var(--son); }\n.ps h2{ margin:0 0 72px; max-width:760px; font-weight:600; font-size:clamp(30px,3.4cqw,52px); line-height:1.02; letter-spacing:-.035em; text-wrap:balance; }\n.ps-track{ position:relative; }\n.ps-rail, .ps-fill{ position:absolute; left:0; right:0; top:11px; height:1px; background:rgba(234,243,241,.14); }\n.ps-fill{ background:var(--son); box-shadow:0 0 12px var(--son); transform-origin:left; transform:scaleX(calc(min(1, max(0, (var(--p, 0) - .22) / .4)))); }\n.ps ol{ position:relative; display:grid; grid-template-columns:repeat(var(--n), 1fr); gap:24px; list-style:none; margin:0; padding:0; }\n.ps li{ padding-top:44px; position:relative; opacity:.45; transition:opacity .6s; }\n.ps li.on{ opacity:1; }\n.ps-node{ position:absolute; left:0; top:0; width:23px; height:23px; border-radius:50%; border:1px solid rgba(234,243,241,.25); background:#02090C; display:grid; place-items:center; transition:border-color .5s; }\n.ps-node i{ width:7px; height:7px; border-radius:50%; background:rgba(234,243,241,.3); transition:background .5s, box-shadow .5s, transform .6s cubic-bezier(.16,1,.3,1); }\n.ps li.on .ps-node{ border-color:var(--son); }\n.ps li.on .ps-node i{ background:var(--son); box-shadow:0 0 12px var(--son); transform:scale(1.25); }\n.ps li:last-child.on .ps-node i{ background:var(--sig); box-shadow:0 0 12px var(--sig); }\n.ps em{ display:block; margin-bottom:10px; font:400 10.5px/1 \"Martian Mono\",monospace; font-style:normal; letter-spacing:.08em; color:var(--muted); }\n.ps b{ display:flex; gap:10px; align-items:baseline; margin-bottom:10px; font-size:21px; font-weight:600; letter-spacing:-.02em; }\n.ps b small{ font:400 11px/1 \"Martian Mono\",monospace; color:var(--sig); }\n.ps li p{ margin:0; font-size:15px; line-height:1.5; color:var(--muted); font-weight:500; }\n@container (max-width: 900px){\n  .ps{ padding:96px 20px; }\n  .ps h2{ margin-bottom:44px; }\n  .ps-rail, .ps-fill{ left:11px; right:auto; top:0; bottom:0; width:1px; height:auto; }\n  .ps-fill{ transform-origin:top; transform:scaleY(calc(min(1, max(0, (var(--p, 0) - .22) / .4)))); }\n  .ps ol{ grid-template-columns:1fr; gap:36px; }\n  .ps li{ padding:0 0 0 48px; }\n}\n@media (prefers-reduced-motion: reduce){ .ps li{ opacity:1; } .ps-fill{ transform:none; } }\n`;addPropertyControls(ProcessSteps,{kicker:{type:ControlType.String,title:\"Kicker\",defaultValue:\"HOW IT WORKS\"},title:{type:ControlType.String,title:\"Title\",defaultValue:\"From first call to first report in nine days.\"},steps:{type:ControlType.Array,title:\"Steps\",maxCount:6,control:{type:ControlType.Object,controls:{title:{type:ControlType.String,title:\"Title\",defaultValue:\"Step\"},body:{type:ControlType.String,title:\"Body\",displayTextArea:true,defaultValue:\"What happens.\"},meta:{type:ControlType.String,title:\"Meta\",defaultValue:\"DAY 1\"}}},defaultValue:DEFAULT_STEPS},ink:{type:ControlType.Color,title:\"Ink\",defaultValue:\"#EAF3F1\"},muted:{type:ControlType.Color,title:\"Muted\",defaultValue:\"#8AA3A6\"},signal:{type:ControlType.Color,title:\"Signal\",defaultValue:\"#FF5B1F\"},sonar:{type:ControlType.Color,title:\"Sonar\",defaultValue:\"#5FF2D6\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ProcessSteps\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"auto\",\"framerIntrinsicWidth\":\"1440\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ProcessSteps.map"],"mappings":"qNAQA,SAAS,EAAkB,EAAI,EAAK,EAAG,EAAO,CAAC,MAAc,CAAC,IAAM,EAAG,EAAI,QAAQ,GAAG,CAAC,GAAW,IAAS,OAAY,OAAO,IAAI,EAAI,EAAE,EAAK,GAAG,EAAM,EAAQ,MAAS,CAAC,IAAM,EAAE,EAAG,sBAAsB,EAAQ,EAAG,EAAO,aAAa,IAAQ,EAAyO,MAAvO,CAA6G,EAA1G,IAAS,IAAA,IAAW,GAAQ,EAAI,EAA8B,EAAf,IAAO,MAAe,CAAC,EAAE,IAAI,KAAK,IAAI,EAAE,EAAE,OAAO,CAAE,GAAkB,EAAG,EAAE,MAAM,EAAG,EAAE,OAAO,EAAK,KAAK,IAAI,EAAE,CAAI,EAAE,OAAM,EAAK,EAAE,EAAG,MAAM,YAAY,MAAM,EAAE,QAAQ,CAAC,CAAC,EAAK,GAAG,EAAG,CAAC,GAAU,EAAE,OAAO,MAAM,EAAE,IAAI,EAAG,GAAI,EAAQ,MAAS,CAAC,EAAI,sBAAsB,CAAI,EAAE,EAAM,YAAY,IAAI,EAAE,EAAK,CAAE,EAAE,EAAK,EAAE,EAAI,sBAAsB,CAAI,EAAE,IAAM,EAAG,EAAO,gBAAgB,CAAI,YAAY,IAAI,EAAE,EAAM,KAAI,EAAK,CAAE,EAAE,GAAG,EAAE,UAAU,CAAC,qBAAqB,CAAG,EAAE,EAAO,cAAc,CAAE,CAAE,CAAE,EAAE,CAAC,EAAI,EAAK,CAAM,CAAC,CAAE,CAMtxB,SAAwB,EAAa,EAAM,CAAC,GAAK,CAAC,SAAO,eAAe,QAAM,gDAAgD,QAAM,EAAc,MAAI,UAAU,QAAM,UAAU,SAAO,UAAU,QAAM,WAAW,EAAY,EAAS,EAAoB,EAAQ,EAAKA,EAAO,IAAI,EAAO,CAAC,EAAI,GAAQC,EAAS,EAAS,GAAG,EAAE,EAAQ,EAAK,GAAO,EAAM,OAAO,EAAM,EAAwJ,OAA1I,EAAkB,EAAK,UAAU,GAAG,CAAC,IAAM,EAAE,GAAQ,EAAE,KAAK,EAAE,EAAE,EAAO,KAAK,MAAM,EAAE,EAAK,OAAO,IAAI,EAAG,KAAG,EAAM,CAAE,EAAE,EAAS,EAAE,IAAA,EAAS,EAAsB,EAAK,MAAM,CAAC,MAAM,CAAC,GAAG,EAAM,MAAM,MAAM,OAAO,cAAc,aAAa,EAAE,SAAsB,EAAM,UAAU,CAAC,IAAI,EAAK,UAAU,KAAK,MAAM,CAAC,MAAM,OAAQ,QAAS,EAAK,UAAW,EAAO,QAAS,EAAQ,QAAS,EAAO,MAAO,EAAK,MAAM,EAAE,SAAS,CAAc,EAAK,QAAQ,CAAC,SAAS,CAAG,CAAC,EAAe,EAAM,IAAI,CAAC,UAAU,UAAU,SAAS,CAAc,EAAK,IAAI,CAAC,CAAC,EAAE,CAAM,CAAC,CAAC,EAAe,EAAK,KAAK,CAAC,SAAS,CAAK,CAAC,EAAe,EAAM,MAAM,CAAC,UAAU,WAAW,SAAS,CAAc,EAAK,OAAO,CAAC,UAAU,SAAS,CAAC,EAAe,EAAK,OAAO,CAAC,UAAU,SAAS,CAAC,EAAe,EAAK,KAAK,CAAC,SAAS,EAAK,KAAK,EAAE,IAAiB,EAAM,KAAK,CAAC,UAAU,GAAG,EAAI,KAAK,GAAG,SAAS,CAAc,EAAK,OAAO,CAAC,UAAU,UAAU,SAAsB,EAAK,IAAI,CAAC,CAAC,CAAC,CAAC,EAAe,EAAK,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC,EAAe,EAAM,IAAI,CAAC,SAAS,CAAc,EAAK,QAAQ,CAAC,SAAS,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC,EAAe,EAAK,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAE,6BAZn7C,IAAwE,IAA6C,EACvK,EAAU,yJAA+J,GAAQ,EAAE,EAAE,EAAE,EAAE,IAAI,KAAK,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC,EAO2M,EAAc,CAAC,CAAC,MAAM,aAAa,KAAK,qGAAqG,KAAK,OAAO,EAAE,CAAC,MAAM,eAAe,KAAK,2FAA2F,KAAK,SAAS,EAAE,CAAC,MAAM,SAAS,KAAK,2FAA2F,KAAK,OAAO,EAAE,CAAC,MAAM,SAAS,KAAK,yFAAyF,KAAK,SAAS,EAAE,CAAC,MAAM,SAAS,KAAK,wFAAwF,KAAK,OAAO,CAAC,EAIqb,EAAI;EACp/C,EAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8BV,EAAoB,EAAa,CAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,cAAc,EAAE,MAAM,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,+CAA+C,EAAE,MAAM,CAAC,KAAK,EAAY,MAAM,MAAM,QAAQ,SAAS,EAAE,QAAQ,CAAC,KAAK,EAAY,OAAO,SAAS,CAAC,MAAM,CAAC,KAAK,EAAY,OAAO,MAAM,QAAQ,aAAa,MAAM,EAAE,KAAK,CAAC,KAAK,EAAY,OAAO,MAAM,OAAO,gBAAgB,GAAK,aAAa,eAAe,EAAE,KAAK,CAAC,KAAK,EAAY,OAAO,MAAM,OAAO,aAAa,OAAO,CAAC,CAAC,EAAE,aAAa,CAAa,EAAE,IAAI,CAAC,KAAK,EAAY,MAAM,MAAM,MAAM,aAAa,SAAS,EAAE,MAAM,CAAC,KAAK,EAAY,MAAM,MAAM,QAAQ,aAAa,SAAS,EAAE,OAAO,CAAC,KAAK,EAAY,MAAM,MAAM,SAAS,aAAa,SAAS,EAAE,MAAM,CAAC,KAAK,EAAY,MAAM,MAAM,QAAQ,aAAa,SAAS,CAAC,CAAC"}