https://portfolio.gateaux-09suntan.workers.dev/bella-duke-paw.js?v=18

1(function(){const g=document.querySelector("[data-paw-demo]");if(!g)return;const $=globalThis.Motion;if(!$||!$.animate)return;const{animate:y}=$,T=g.querySelector(".paw-demo__stage"),m=g.querySelector("[data-paw]"),R=g.querySelector("[data-paw-rig]"),F=g.querySelector("[data-paw-arm]"),v=g.querySelector("[data-paw-hand]"),ct=g.querySelector("[data-paw-seam]"),w=g.querySelector("[data-paw-pill]"),p=Array.from(g.querySelectorAll("[data-paw-link]"));if(!T||!m||!R||!F||!v||!p.length)return;const L=F.querySelector("path"),Q=L?L.getAttribute("d"):"",A=matchMedia("(prefers-reduced-motion: reduce)").matches,Pt=matchMedia("(hover: none)").matches,M={type:"spring",stiffness:240,damping:22},It={type:"spring",stiffness:420,damping:26},Ot=72,E=()=>m.offsetWidth/Ot||1,J=0,tt=.62,lt=.8,et=.99,ut=16,ft=7.82,Ft=33.3,Bt=1.4,a={liveliness:1.5,reachRot:8,reachCock:12,curveLead:-.6,curveLeadInteractive:-1,flarePerPawS:1.048,curveDur:.42,reachStiffness:170,reachDamping:19,interactiveSpeed:2.1,interactiveVariation:.4,dwellMin:650,dwellMax:1150,tapDepth:1,vigourSpread:.15,tempoSpread:.12,tapSpread:.1,landSpread:10,drift

1Spread:6,indecisionChance:.25,followFloor:.28,followRange:200,iconCover:.07},qt=130;function _(t,e){return(Math.random()*2-1)*t*a.liveliness*(e??1)}function Dt(t){return Math.max(.4,1+_(a.vigourSpread,t))}function Xt(){const t=(a.dwellMin+a.dwellMax)/2;return a.liveliness<=0?t:a.dwellMin+Math.random()*(a.dwellMax-a.dwellMin)}function kt(t){return{dx:_(a.landSpread,t),dy:_(a.landSpread,t)}}const Y={REST:{rig:0,lift:0,armMul:1,paw:0,pawS:1},HOVER:{rig:0,lift:-2,armMul:1,paw:0,pawS:1.12},LIFT:{rig:0,lift:-3,armMul:1,paw:0,pawS:1.24},PRESS:{rig:0,lift:3,armMul:1.08,paw:0,pawS:.94}},G=t=>Math.max(0,a.flarePerPawS*t-1);function dt(){const t=T.getBoundingClientRect();return p[0].querySelector("[data-paw-icon]").getBoundingClientRect().left-t.left-ut*E()-et*m.offsetWidth}function V(t){const e=T.getBoundingClientRect(),o=t.querySelector("[data-paw-icon]").getBoundingClientRect(),n=t.getBoundingClientRect(),i=m.offsetWidth,r=m.offsetHeight,s=o.left-e.left+o.width*a.iconCover,c=n.top-e.top+n.height/2,f=dt(),l=(tt-J)*i,h=1+(s-f-lt*i)/l;return{x:f,y:c-r*.5,armX:h}}function pt(t,e){if(!e||!e.dx&&!e.dy)return t;const o=(tt-J)*m.offsetWidth;return{...t,y:t.y+e.dy,armX:t.armX+(o?e.dx/o:0)}}let k=0;function B(){const t=p[k]||p[0],e=T.getBoundingClientRect(),o=t.querySelector("[data-paw-icon]").getBoundingClientRect(),n=t.getBoundingClientRect(),i=m.offsetWidth,r=m.offsetHeight,s=o.left-e.left,c=n.top-e.top+n.height/2;return{x:s-ut*E()-et*i,y:c-r*.5,armX:1}}function nt(t){return(tt-J)*m.offsetWidth*(t-1)}function b(t){if(!t||!Q)return Q;const e=Q.match(/[MCZ]|-?[\d.]+/gi)||[],o=r=>1+t*Math.pow(Math.min(1,Math.max(0,r/Ft)),Bt),n=[];let i=0;for(;i<e.length;){const r=e[i++];n.push(r);const s=r==="M"?1:r==="C"?3:0;for(let c=0;c<s;c++){const f=parseFloat(e[i++]),l=parseFloat(e[i++]);n.push(f.toFixed(3),(ft+(l-ft)*o(f)).toFixed(3))}}return n.join(" ")}let H=[],q=null,K={x:0,y:0},Z={dx:0,dy:0};function ot(){if(H.forEach(t=>{try{t.stop()}catch{}}),H=[],q){try{q.stop()}catch{}q=null}}const Ht=27;function Kt(){const t=Ht*E();if(m.style.setProperty("--paw-seam",t+"px"),!ct)return;const e=g.getBoundingClientRect();if(!e.height)return;const n=T.getBoundingClientRect().left-e.left+dt()+t;ct.style.width=n+1+"px"}let D=!1;function Nt(){!w||!p[0]||(w.style.width=p[0].offsetWidth+"px",w.style.height=p[0].offsetHeight+"px")}function rt(t,e){if(!w||!t)return;w.classList.toggle("is-pressed",!!e);const o=t.offsetLeft,n=t.offsetTop;D?y(w,{x:o,y:n},M):(y(w,{x:o,y:n},{duration:0}),D=!0),y(w,{opacity:1},M)}function Wt(t,e,o){if(!w||!t)return;const n=p[k]||p[0];w.classList.remove("is-pressed"),D||(y(w,{x:n.offsetLeft,y:n.offsetTop},{duration:0}),D=!0);const i=n.offsetTop+(t.offsetTop-n.offsetTop)*e;y(w,{x:t.offsetLeft,y:i},o),y(w,{opacity:1},o)}function N(){!w||!D||(y(w,{opacity:0},M),w.classList.remove("is-pressed"),D=!1)}function ht(t){p.forEach(e=>e.classList.toggle("is-active",e===t))}function Yt(t){rt(t,!1)}function P(t,e,o){ot();const n=Y[t],r=(e&&e.armX!=null?e.armX:1)*n.armMul,s=[[R,{rotate:n.rig,y:n.lift*E()}],[F,{scaleX:r,scaleY:1}],[L,{d:b(G(n.pawS))}],[v,{x:nt(r),rotate:n.paw,scale:n.pawS}]];e&&(s.push([m,{x:e.x,y:e.y}]),K={x:e.x,y:e.y});const c=s.map(([f,l])=>{const h=y(f,l,o);return H.push(h),h.finished});return Promise.allSettled(c)}function it(t,e){const o=e?a.interactiveVariation:1;Z=kt(o);const n=pt(V(t),Z),i=Y.LIFT;if(Yt(t),A)return P("LIFT",n,M);ot();const r=n.y-K.y;K={x:n.x,y:n.y};const s=Math.min(1,Math.abs(r)/(qt*E())),c=r>=0?1:-1,f=e?a.interactiveSpeed:1,l=Dt(o),h=e?a.curveLeadInteractive:a.curveLead,C=c*a.reachRot*s*l*h,X=c*a.reachCock*s*l*h,u=n.armX*i.armMul,d=i.lift*E()*l,S=1+_(a.tempoSpread,o),x={type:"spring",stiffness:a.reachStiffness*f,damping:a.reachDamping*Math.sqrt(f)},O={duration:a.curveDur/f*S,ease:e?"easeOut":"easeInOut",times:[0,.35,1]},ae=[[R,{rotate:[null,C,i.rig]},O],[v,{rotate:[null,X,i.paw]},O],[m,{x:n.x,y:n.y},x],[R,{y:d},x],[F,{scaleX:u,scaleY:1},x],[L,{d:b(G(i.pawS))},x],[v,{x:nt(u),scale:i.pawS},x]].map(([se,ce,le])=>{const _t=y(se,ce,le);return H.push(_t),_t.finished});return Promise.allSettled(ae)}let at=0;const mt=t=>new Promise(e=>{clearTimeout(at),at=setTimeout(e,t)});function wt(){const t=B();m.style.transform=`translate(${t.x}px, ${t.y}px)`,R.style.transform="translateY(0px) rotate(0deg)",F.style.transform="scaleX(1) scaleY(1)",L&&L.setAttribute("d",b(G(Y.REST.pawS))),v.style.transform="translate(0px, 0px) rotate(0deg) scale(1)",K={x:t.x,y:t.y},Kt(),Nt(),N(),ht(p[k]||p[0])}wt();let gt=0;addEventListener("resize",()=>{cancelAnimationFrame(gt),gt=requestAnimationFrame(wt)},{passive:!0});const Gt=["M9.66504 2C10.8786 2 11.901 2.65821 12.5859 3.57129C13.2707 4.48427 13.665 5.69998 13.665 7C13.665 8.30002 13.2707 9.51574 12.5859 10.4287C11.901 11.3418 10.8786 12 9.66504 12C8.45145 12 7.4291 11.3418 6.74414 10.4287C6.05941 9.51574 5.66504 8.30002 5.66504 7C5.66504 5.69998 6.05941 4.48427 6.74414 3.57129C7.4291 2.65821 8.45145 2 9.66504 2Z","M5 8.99902C5.93742 8.99902 6.70986 9.5079 7.21387 10.1797C7.71763 10.8514 8 11.7342 8 12.666C7.99993 13.5977 7.71758 14.4798 7.21387 15.1514C6.70987 15.8233 5.93752 16.332 5 16.332C4.06248 16.332 3.29013 15.8233 2.78613 15.1514C2.28242 14.4798 2.00007 13.5977 2 12.666C2 11.7342 2.28237 10.8514 2.78613 10.1797C3.29014 9.5079 4.06258 8.99902 5 8.99902Z","M17.001 2C18.2146 2 19.2369 2.65821 19.9219 3.57129C20.6066 4.48426 21.001 5.69998 21.001 7C21.001 8.30002 20.6066 9.51574 19.9219 10.4287C19.2369 11.3418 18.2146 12 17.001 12C15.7874 12 14.765 11.3418 14.0801 10.4287C13.3953 9.51574 13.001 8.30002 13.001 7C13.001 5.69998 13.3953 4.48426 14.0801 3.57129C14.765 2.65821 15.7874 2 17.001 2Z","M21.667 8.99902C22.6044 8.99902 23.3769 9.50789 23.8809 10.1797C24.3846 10.8514 24.667 11.7342 24.667 12.666C24.6669 13.5977 24.3846 14.4798 23.8809 15.1514C23.3769 15.8233 22.6045 16.332 21.667 16.332C20.7295 16.332 19.9571 15.8233 19.4531 15.1514C18.9494 14.4798 18.6671 13.5977 18.667 12.666C18.667 11.7342 18.9494 10.8514 19.4531 10.1797C19.9571 9.50789 20.7296 8.99902 21.667 8.99902Z","M13.332 10.666C15.2659 10.6662 17.1824 11.9168 18.5576 13.4639C19.9469 15.027 20.998 17.1283 20.998 19.166C20.998 20.2459 20.5485 21.2775 19.7783 22.04L19.6201 22.1895C18.7863 22.933 17.7 23.3329 16.5703 23.333C15.1965 23.333 14.3937 22.8399 13.8984 22.5342C13.7044 22.4143 13.6477 22.3839 13.5947 22.3643C13.5657 22.3535 13.5031 22.333 13.332 22.333C13.1605 22.333 13.0973 22.3535 13.0684 22.3643C13.0154 22.3839 12.9586 22.4144 12.7646 22.5342C12.2695 22.8399 11.4674 23.3329 10.

10938 23.333C8.96425 23.333 7.87763 22.9338 7.04492 22.1914L7.04395 22.1904C6.17653 21.4154 5.66504 20.3181 5.66504 19.166C5.66504 17.1282 6.71701 15.027 8.10645 13.4639C9.48171 11.9167 11.3981 10.666 13.332 10.666Z"],yt=26.667,St=25.3327,Vt=.78,st=1,bt=.12,Zt=.8,jt=.85,zt=.26,Ct=4,Tt=1,Ut=-Ct,$t=.86;let Qt=0;const j=new WeakMap,Jt=t=>t*t;function Mt(t,e,o,n,i,r){let s=null,c=0,f=!1;const l=h=>{if(f)return;s==null&&(s=h);const C=o>0?Math.min(1,(h-s)/(o*1e3)):1;i(t+(e-t)*n(C)),C<1?c=requestAnimationFrame(l):r&&r()};return c=requestAnimationFrame(l),{cancel(){f=!0,cancelAnimationFrame(c)}}}function te(){const t=++Qt,e="pm-grain-"+t,o="pm-erode-"+t,n="pm-fa-"+t,i=Gt.map(s=>'<path d="'+s+'" fill="#C0AA8D" stroke="#F1EEE6" stroke-width="2"/>').join(""),r=document.createElement("span");return r.className="paw-demo__mark",r.setAttribute("aria-hidden","true"),r.innerHTML='<svg viewBox="0 0 '+yt+" "+St+'" fill="none" xmlns="http://www.w3.org/2000/svg"><defs><filter id="'+e+'" x="-20%" y="-20%" width="140%" height="140%" color-interpolation-filters="sRGB"><feTurbulence type="fractalNoise" baseFrequency="0.3333 0.3333" numOctaves="3" seed="2916" result="grainNoise"/><feDisplacementMap in="SourceGraphic" in2="grainNoise" scale="2" xChannelSelector="R" yChannelSelector="G"/></filter><filter id="'+o+'" x="-20%" y="-20%" width="140%" height="140%" color-interpolation-filters="sRGB"><feTurbulence type="fractalNoise" baseFrequency="0.15 0.15" numOctaves="2" seed="'+t*37%9973+'" result="erodeNoise"/><feColorMatrix in="erodeNoise" type="luminanceToAlpha" result="erodeLum"/><feComponentTransfer in="erodeLum" result="erodeCut"><feFuncA id="'+n+'" type="linear" slope="'+Ct+'" intercept="'+Tt+'"/></feComponentTransfer><feGaussianBlur in="erodeCut" stdDeviation="0.25" result="erodeCutSoft"/><feComposite in="SourceGraphic" in2="erodeCutSoft" operator="in"/></filter></defs><g filter="url(#'+o+')"><g filter="url(#'+e+')">'+i+"</g></g></svg>",{wrap:r,funcA:r.querySelector("#"+n),curI:Tt,dissolveTween:null,holdTimer:0,removed:!1}}function xt(t){t.removed||(t.removed=!0,t.dissolveTween&&(t.dissolveTween.cancel(),t.dissolveTween=null),t.landTween&&(t.landTween.cancel(),t.landTween=null),clearTimeout(t.holdTimer),t.wrap.remove(),t.link&&j.get(t.link)===t&&j.delete(t.link))}function Rt(t,e){if(!t.removed){if(clearTimeout(t.holdTimer),A||!t.funcA){y(t.wrap,{opacity:0},{duration:e?.2:.4,ease:"easeOut"}).finished.then(()=>xt(t),()=>{});return}t.dissolveTween&&t.dissolveTween.cancel(),t.dissolveTween=Mt(t.curI,Ut,e?zt:jt,Jt,o=>{t.curI=o,t.funcA.setAttribute("intercept",o.toFixed(3))},()=>xt(t))}}function ee(t,e){const o=v.getScreenCTM&&v.getScreenCTM();if(o){const n=new DOMPoint(lt*48,7.800000000000001).matrixTransform(o),i=new DOMPoint(et*48,.52*15).matrixTransform(o),r=new DOMPoint($t*48,.52*15).matrixTransform(o),s=Math.atan2(i.y-n.y,i.x-n.x);return{x:r.x-e.left,y:r.y-e.top,R:s*180/Math.PI+90}}return{x:t.left-e.left+t.width/2,y:t.top-e.top+t.height/2,R:90}}function ne(t){if(!T)return;const e=t.querySelector("[data-paw-icon]");if(!e)return;const o=j.get(t);o&&Rt(o,!0);const n=T.getBoundingClientRect(),i=e.getBoundingClientRect();if(!i.width)return;const r=te(),s=i.width*Vt,c=s*(St/yt),f=ee(i,n);r.wrap.style.width=s+"px",r.wrap.style.height=c+"px",r.wrap.style.left=f.x-s/2+"px",r.wrap.style.top=f.y-c/2+"px";const l=new DOMMatrix().rotateSelf(f.R);r.rest=l,r.link=t,T.insertBefore(r.wrap,m),j.set(t,r),A?(r.wrap.style.transform=l.toString(),r.wrap.style.opacity=String(st)):r.landTween=Mt(0,1,bt,h=>1-(1-h)*(1-h),h=>{const C=new DOMMatrix().scaleSelf(.9+.1*h,.9+.1*h).multiplySelf(l);r.wrap.style.transform=C.toString(),r.wrap.style.opacity=String(st*h)},()=>{r.wrap.style.transform=l.toString(),r.wrap.style.opacity=String(st)}),r.holdTimer=setTimeout(()=>{r.holdTimer=0,Rt(r,!1)},Zt*1e3)}async function vt(t,e,o){const n=o?a.interactiveVariation:1,i={dx:Z.dx+_(a.driftSpread,n),dy:Z.dy+_(a.driftSpread,n)};e=pt(e,i);const r=t.querySelector("[data-paw-icon]");rt(t,!0),ht(t);const c=1-.1*Math.max(0,a.tapDepth*(1+_(a.tapSpread)));await P("PRESS",e,{duration:.13,ease:"easeOut"}),ne(t),await y(r,{scale:c},{duration:.1,ease:"easeOut"}).finished,rt(t,!1),y(r,{scale:1},{duration:.24,ease:"easeOut"}),await P("LIFT",e,It)}function oe(t,e,o){const n=V(t),i=B().y,r=i+(n.y-i)*e,s=1+(n.armX-1)*e,c=Y.HOVER,f=n.y-i>=0?1:-1;K={x:n.x,y:r};const l={duration:o,ease:"easeInOut"};Wt(t,e,l);const C=[[m,{x:n.x,y:r},l],[R,{y:c.lift*E()},l],[R,{rotate:f*a.reachRot*.5*e},l],[F,{scaleX:s,scaleY:1},l],[L,{d:b(G(1+(c.pawS-1)*e))},l],[v,{x:nt(s),scale:1+(c.pawS-1)*e},l]].map(([X,u,d])=>{const S=y(X,u,d);return H.push(S),S.finished});return Promise.allSettled(C)}async function re(t){const e=p.indexOf(t),o=Math.random()<.65?1:2,n=new Set([e]);for(let i=0;i<o;i++){let r=e,s=0;do r=Math.floor(Math.random()*p.length);while(n.has(r)&&++s<12);n.add(r);const c=.45+Math.random()*.25,f=.3+Math.random()*.12;await oe(p[r],c,f),await mt(110+Math.random()*140)}return it(t)}let I=0,z=!1;function ie(t){if(p.length<2)return 0;let e;do e=Math.floor(Math.random()*p.length);while(e===t);return e}

1async function At(){if(A||z)return;const t=++I;z=!0;let e=-1;try{for(;t===I;){const o=ie(e);if(e=o,await(a.liveliness>0&&Math.random()<a.indecisionChance?re(p[o]):it(p[o])),t!==I||(await vt(p[o],V(p[o])),t!==I)||(k=o,N(),await P("REST",B(),M),t!==I))break;await mt(Xt())}}catch{}t===I&&(z=!1)}function Et(){I++,z=!1,clearTimeout(at),ot(),N()}if(new IntersectionObserver(t=>{for(const e of t)e.isIntersecting?At():Et()},{threshold:.4}).observe(g),!Pt){let f=function(u){const d=s.getBoundingClientRect();let S=d.left-d.width*c;const x=d.right+d.width*c,W=d.top-d.height*c,U=d.bottom+d.height*c,O=m.getBoundingClientRect();return O.left<S&&(S=O.left),u.clientX>=S&&u.clientX<=x&&u.clientY>=W&&u.clientY<=U},l=function(){t=!0,clearTimeout(e),Et()},h=function(u){if(A||!t||n!==-1)return;const d=T.getBoundingClientRect(),S=(u.clientY-d.top)/d.height,x=Math.max(-5,Math.min(13,(S-.5)*18)),W=m.getBoundingClientRect(),U=Math.abs(u.clientX-(W.left+W.width/2)),O=Math.max(0,1-U/(a.followRange*E())),Lt=a.followFloor+(1-a.followFloor)*O;q&&q.stop(),q=y(R,{rotate:x*Lt},M)},C=function(){n=-1,t=!1,N(),clearTimeout(o),clearTimeout(e),e=setTimeout(()=>{t||At()},700)},X=function(u){r=u,!i&&(i=requestAnimationFrame(()=>{i=0;const d=r;d&&(f(d)?(t||(l(),A||P("HOVER",B(),M)),h(d)):t&&C())}))};var fe=f,de=l,pe=h,he=C,me=X;let t=!1,e=0,o=0,n=-1,i=0,r=null;const s=g.querySelector(".paw-demo__links"),c=.25;g.addEventListener("pointerenter",u=>{u.pointerType!=="touch"&&f(u)&&(l(),A||P("HOVER",B(),M))}),g.addEventListener("pointermove",u=>{u.pointerType!=="touch"&&X(u)},{passive:!0}),p.forEach((u,d)=>{u.addEventListener("pointerenter",S=>{S.pointerType!=="touch"&&(l(),clearTimeout(o),n=d,it(u,!0))}),u.addEventListener("pointerleave",S=>{S.pointerType!=="touch"&&(n=-1,clearTimeout(o),o=setTimeout(()=>{t&&n===-1&&!A&&(N(),P("HOVER",B(),M))},140))}),u.addEventListener("click",()=>{l(),clearTimeout(o),n=d,k=d,vt(u,V(u),!0)})}),g.addEventListener("pointerleave",u=>{u.pointerType!=="touch"&&C()})}})();