{"version":3,"file":"PlainwareMotion.BxK6T5Re.mjs","names":["React.forwardRef","useRef"],"sources":["https:/framerusercontent.com/modules/hI8timTlk8Fd762eIxi0/slkoCsyKxQigbCO9Bbjr/ae1wERNQB.js","https:/framerusercontent.com/modules/4JU48QpN7a6ecfBZfOjQ/ky2IEh5pTFLA5cO3x4Rl/PlainwareMotion.js"],"sourcesContent":["// Generated by Framer (6ca5d98)\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,cx,motion,useSVGTemplate,withCSS}from\"framer\";import*as React from\"react\";import{forwardRef}from\"react\";const mask=\"var(--framer-icon-mask)\";const Base=/*#__PURE__*/forwardRef(function(props,ref){return /*#__PURE__*/_jsx(\"svg\",{...props,ref:ref,children:props.children});});const MotionSVG=motion.create(Base);const SVG=/*#__PURE__*/forwardRef((props,ref)=>{const{animated,layoutId,children,...rest}=props;return animated?/*#__PURE__*/_jsx(MotionSVG,{...rest,layoutId:layoutId,ref:ref,children:children}):/*#__PURE__*/_jsx(\"svg\",{...rest,ref:ref,children:children});});const svg='';const getProps=({alpha,color,height,id,width,width1,...props})=>{return{...props,ezTt3ayMo:color??props.ezTt3ayMo??\"rgb(0, 0, 0)\",lschgej4H:width1??props.lschgej4H??1.5,qxTvv_EBh:alpha??props.qxTvv_EBh};};const Component=/*#__PURE__*/React.forwardRef(function(props,ref){const{style,className,layoutId,variant,ezTt3ayMo,lschgej4H,qxTvv_EBh,...restProps}=getProps(props);const href=useSVGTemplate(\"388653749\",svg);return /*#__PURE__*/_jsx(SVG,{...restProps,className:cx(\"framer-XkIxc\",className),layoutId:layoutId,ref:ref,role:\"presentation\",style:{\"--1m6trwb\":qxTvv_EBh,\"--21h8s6\":ezTt3ayMo,\"--pgex8v\":lschgej4H,...style},viewBox:\"0 0 24 24\",children:/*#__PURE__*/_jsx(\"use\",{href:href})});});const css=[`.framer-XkIxc { -webkit-mask: ${mask}; aspect-ratio: 1; display: block; mask: ${mask}; width: 24px; }`];/**\n * This is a generated Framer component.\n * @framerIntrinsicWidth 24\n * @framerIntrinsicHeight 24\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n * @framerVariables {\"ezTt3ayMo\":\"color\",\"lschgej4H\":\"width1\",\"qxTvv_EBh\":\"alpha\"}\n * @framerImmutableVariables true\n * @framerVector {\"name\":\"Arrow Right\",\"color\":{\"type\":\"variable\",\"value\":\"21h8s6\"},\"set\":{\"localId\":\"vectorSet/NGVKdicsm\",\"id\":\"NGVKdicsm\",\"moduleId\":\"omX0gWFPqDwhaiWwf6ab\"}}\n * @framerDisableUnlink true\n */const Icon=withCSS(Component,css,\"framer-XkIxc\");Icon.displayName=\"Arrow Right\";export default Icon;addPropertyControls(Icon,{ezTt3ayMo:{defaultValue:\"rgb(0, 0, 0)\",hidden:false,title:\"Color\",type:ControlType.Color},lschgej4H:{defaultValue:1.5,displayStepper:true,hidden:false,max:6,min:0,step:.5,title:\"Width\",type:ControlType.Number},qxTvv_EBh:{defaultValue:0,displayStepper:true,hidden:false,max:1,min:0,step:.1,title:\"Alpha\",type:ControlType.Number}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"Icon\",\"slots\":[],\"annotations\":{\"framerVector\":\"{\\\"name\\\":\\\"Arrow Right\\\",\\\"color\\\":{\\\"type\\\":\\\"variable\\\",\\\"value\\\":\\\"21h8s6\\\"},\\\"set\\\":{\\\"localId\\\":\\\"vectorSet/NGVKdicsm\\\",\\\"id\\\":\\\"NGVKdicsm\\\",\\\"moduleId\\\":\\\"omX0gWFPqDwhaiWwf6ab\\\"}}\",\"framerIntrinsicHeight\":\"24\",\"framerVariables\":\"{\\\"ezTt3ayMo\\\":\\\"color\\\",\\\"lschgej4H\\\":\\\"width1\\\",\\\"qxTvv_EBh\\\":\\\"alpha\\\"}\",\"framerIntrinsicWidth\":\"24\",\"framerContractVersion\":\"1\",\"framerDisableUnlink\":\"true\",\"framerImmutableVariables\":\"true\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}","// Plainware motion overrides.\n// Attach to existing canvas layers (text stays editable on the canvas):\n// withScramble section labels: letters resolve left to right out of random glyphs when the label enters view\n// withRollButton button labels: each letter rolls up to a copy of itself on hover (wave, 80 % stagger)\n// withRollNav navigation links: same roll, tighter wave (35 % stagger)\n// withCountUp stat figures: count from 0 to the figure when it enters view\n// withArrowSwap arrow icons in buttons: on hover the arrow leaves right and a new one slides in from the left\n// withSlideSwap footer links: on hover the text slides out right while a copy slides in from the left\n// withBlurIn auto-fit headings (Framer renders them as SVG, so letters cannot be split): whole block un-blurs\n// Timings follow measurements of the reference site. Everything is skipped for prefers-reduced-motion.\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{forwardRef,useEffect,useRef}from\"react\";import{animate}from\"framer-motion\";const GLYPHS=\"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()_+[]{}|;:,.<>?~\";const ZEN=[.12,.23,.17,.99];function reducedMotion(){return typeof window!==\"undefined\"&&window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;}function setRef(ref,value){if(typeof ref===\"function\")ref(value);else if(ref)ref.current=value;}// Every non-empty text node rendered inside a Framer text layer.\nfunction textNodes(root){const walker=document.createTreeWalker(root,NodeFilter.SHOW_TEXT);const out=[];let n;while(n=walker.nextNode()){if((n.nodeValue||\"\").trim()&&!(n.parentElement&&n.parentElement.closest(\"[data-zx-copy]\")))out.push(n);}return out;}function lineHeightPx(el){const cs=getComputedStyle(el);const lh=parseFloat(cs.lineHeight);return isNaN(lh)?parseFloat(cs.fontSize)*1.2:lh;}// Run once when the element first shows a pixel on screen.\nfunction onFirstView(el,run){const io=new IntersectionObserver(entries=>{if(entries.some(e=>e.isIntersecting)){io.disconnect();run();}},{threshold:0});io.observe(el);return()=>io.disconnect();}// The element a visitor actually hovers: the link or button around the layer, else the nearest clickable ancestor.\nfunction hoverTarget(el){const link=el.closest(\"a, button\");if(link)return link;for(let p=el.parentElement;p&&p!==document.body;p=p.parentElement){if(getComputedStyle(p).cursor===\"pointer\")return p;}return el;}// persistent = hover effects that must survive re-renders: Framer re-renders some layers after hydration\n// (navigation variants, for example) and React then puts the original text back, dropping our structure.\nfunction withRef(Component,name,effect,persistent=false){return /*#__PURE__*/forwardRef((props,ref)=>{const local=useRef(null);useEffect(()=>{const el=local.current;if(!el)return;el.setAttribute(\"data-zx\",name);if(reducedMotion())return;let cleanup=effect(el)||undefined;if(!persistent)return cleanup;let busy=false;const mo=new MutationObserver(()=>{if(busy||el.querySelector(\"[data-zx-built], [data-zx-copy]\"))return;busy=true;try{cleanup&&cleanup();cleanup=effect(el)||undefined;}finally{busy=false;}});mo.observe(el,{childList:true,subtree:true,characterData:true});return()=>{mo.disconnect();cleanup&&cleanup();};},[]);return /*#__PURE__*/_jsx(Component,{...props,ref:v=>{local.current=v;setRef(ref,v);}});});}// ---------------------------------------------------------------- scramble\nconst STEP_MS=52// speed 75 on the reference component\n;const TRAIL=10// random glyphs ahead of the resolved text\n;function scramble(el){const nodes=textNodes(el);if(!nodes.length)return;const parts=[];for(const node of nodes){const text=node.nodeValue||\"\";const wrap=document.createElement(\"span\");wrap.setAttribute(\"aria-label\",text);const cells=[];for(const word of text.split(/(\\s+)/)){if(!word)continue;if(/^\\s+$/.test(word)){wrap.appendChild(document.createTextNode(word));continue;}const w=document.createElement(\"span\");w.style.whiteSpace=\"nowrap\";for(const ch of word){const s=document.createElement(\"span\");s.textContent=ch;s.style.display=\"inline-block\";s.style.textAlign=\"center\";w.appendChild(s);cells.push({span:s,ch});}wrap.appendChild(w);}node.parentNode.replaceChild(wrap,node);// lock every cell to the width of its final letter so random glyphs cannot shift the line\nfor(const c of cells)c.span.style.width=c.span.getBoundingClientRect().width+\"px\";for(const c of cells)c.span.style.opacity=\"0\";parts.push({node,wrap,cells});}const all=parts.flatMap(p=>p.cells);const restore=()=>parts.forEach(p=>p.wrap.parentNode&&p.wrap.parentNode.replaceChild(p.node,p.wrap));let timer=0;const stop=onFirstView(el,()=>{let k=0;const total=all.length+TRAIL;timer=window.setInterval(()=>{k++;all.forEach((c,i)=>{if(i=total){window.clearInterval(timer);restore()// hand the original text node back to React\n;}},STEP_MS);});return()=>{stop();window.clearInterval(timer);restore();};}export function withScramble(Component){return withRef(Component,\"scramble\",scramble);}// ---------------------------------------------------------------- rolling label\nfunction roll(stagger){return el=>{const nodes=textNodes(el);if(!nodes.length)return;if(stagger<.5&&!el.querySelector(\"a\")&&!el.closest(\"a, button\"))return;// nav: links only\nconst inners=[];const built=[];for(const node of nodes){const text=node.nodeValue||\"\";const host=node.parentElement;const lh=lineHeightPx(host);const wrap=document.createElement(\"span\");wrap.setAttribute(\"data-zx-built\",\"\");const visual=document.createElement(\"span\");visual.setAttribute(\"aria-hidden\",\"true\");visual.style.userSelect=\"none\";for(const word of text.split(/(\\s+)/)){if(!word)continue;if(/^\\s+$/.test(word)){visual.appendChild(document.createTextNode(word));continue;}const w=document.createElement(\"span\");w.style.whiteSpace=\"nowrap\";for(const ch of word){const col=document.createElement(\"span\");col.style.cssText=`display:inline-block;overflow:hidden;vertical-align:top;height:${lh}px`;const inner=document.createElement(\"span\");inner.style.cssText=\"display:block\";for(let i=0;i<2;i++){const c=document.createElement(\"span\");c.textContent=ch;c.style.cssText=`display:block;height:${lh}px`;inner.appendChild(c);}col.appendChild(inner);w.appendChild(col);inners.push(inner);}visual.appendChild(w);}// keep React's own text node in the DOM for screen readers and later updates\nconst holder=document.createElement(\"span\");holder.style.cssText=\"position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap\";node.parentNode.replaceChild(wrap,node);holder.appendChild(node);wrap.appendChild(holder);wrap.appendChild(visual);built.push({node,wrap,holder});}const target=hoverTarget(el);const n=inners.length;// letters get their own compositor layer only while they roll: permanent will-change on every letter\n// made each scrolled frame re-layer hundreds of layers\nlet rollId=0;const run=to=>{const id=++rollId;const lh=inners[0]?inners[0].firstChild.getBoundingClientRect().height:0;inners.forEach((inner,i)=>{inner.style.willChange=\"transform\";const controls=animate(inner,{y:to*-lh},{type:\"spring\",duration:.4,bounce:0,delay:.4/n*i*stagger});if(to===0&&i===n-1)controls.then(()=>{if(id===rollId)inners.forEach(x=>x.style.willChange=\"\");});});};const enter=()=>run(1);const leave=()=>run(0);target.addEventListener(\"mouseenter\",enter);target.addEventListener(\"mouseleave\",leave);return()=>{target.removeEventListener(\"mouseenter\",enter);target.removeEventListener(\"mouseleave\",leave);built.forEach(b=>b.wrap.parentNode&&b.wrap.parentNode.replaceChild(b.node,b.wrap));};};}export function withRollButton(Component){return withRef(Component,\"rollButton\",roll(.8),true);}export function withRollNav(Component){return withRef(Component,\"rollNav\",roll(.35),true);}// ---------------------------------------------------------------- count up\nconst FIGURE=RegExp(\"^(\\\\D*?)(\\\\d[\\\\d,]*(?:\\\\.\\\\d+)?)(.*)$\",\"s\");function countUp(el){const node=textNodes(el).find(t=>FIGURE.test((t.nodeValue||\"\").trim()));if(!node)return;const original=node.nodeValue||\"\";const lead=original.match(/^\\s*/)[0];const m=original.trim().match(FIGURE);const[,prefix,num,suffix]=m;const target=parseFloat(num.replace(/,/g,\"\"));if(!isFinite(target)||target===0)return;const decimals=(num.split(\".\")[1]||\"\").length;const grouped=num.includes(\",\");const fmt=v=>{let s=v.toFixed(decimals);if(grouped){const[i,d]=s.split(\".\");s=i.replace(/\\B(?=(\\d{3})+(?!\\d))/g,\",\")+(d?\".\"+d:\"\");}return lead+prefix+s+suffix;};const host=node.parentElement;const width=host.getBoundingClientRect().width;let controls=null;const r=el.getBoundingClientRect();const visibleNow=r.bottom>0&&r.top{host.style.minWidth=width+\"px\";controls=animate(0,target,{duration:2,ease:[0,0,.58,1],onUpdate:v=>node.nodeValue=fmt(v),onComplete:()=>{node.nodeValue=original;host.style.minWidth=\"\";}});});return()=>{stop();controls&&controls.stop();node.nodeValue=original;};}export function withCountUp(Component){return withRef(Component,\"countUp\",countUp);}// ---------------------------------------------------------------- swaps (arrow icon, footer link)\nfunction swap(distance,transition){return el=>{if(!el.querySelector(\"a\")&&!el.closest(\"a, button\"))return;// only text that is a link\nconst first=textNodes(el)[0];const source=first?first.parentElement:null;if(!source)return;if(source.getBoundingClientRect().height>lineHeightPx(source)*1.6)return;// multi-line links would re-wrap\nconst prevDisplay=source.style.display;if(getComputedStyle(source).display===\"inline\")source.style.display=\"inline-block\";const box=source.parentElement;// the clip has to be exactly as wide as the text, otherwise the copy shows next to the original;\n// shrinking the paragraph only keeps the text in place when it is start-aligned\nconst align=getComputedStyle(box).textAlign;if(!/^(start|left|-webkit-left)$/.test(align)){source.style.display=prevDisplay;return;}const prevWidth=box.style.width;box.style.width=\"fit-content\";const prevOverflow=box.style.overflow;const prevPosition=box.style.position;box.style.overflow=\"hidden\";if(getComputedStyle(box).position===\"static\")box.style.position=\"relative\";const copy=source.cloneNode(true);copy.setAttribute(\"data-zx-copy\",\"\");copy.setAttribute(\"aria-hidden\",\"true\");const sr=source.getBoundingClientRect();const br=box.getBoundingClientRect();copy.style.position=\"absolute\";copy.style.left=sr.left-br.left+\"px\";copy.style.top=sr.top-br.top+\"px\";copy.style.width=sr.width+\"px\";copy.style.margin=\"0\";box.appendChild(copy);animate(copy,{x:\"-\"+distance},{duration:0});const target=hoverTarget(el);const enter=()=>{animate(source,{x:distance},transition);animate(copy,{x:\"0%\"},transition);};const leave=()=>{animate(source,{x:\"0%\"},transition);animate(copy,{x:\"-\"+distance},transition);};target.addEventListener(\"mouseenter\",enter);target.addEventListener(\"mouseleave\",leave);return()=>{target.removeEventListener(\"mouseenter\",enter);target.removeEventListener(\"mouseleave\",leave);copy.remove();source.style.display=prevDisplay;box.style.width=prevWidth;box.style.overflow=prevOverflow;box.style.position=prevPosition;};};}// Icons render as the