' + '

' + '' + '

' + '

'; document.body.appendChild(panel); var q=function(s){return panel.querySelector(s)}; var mark=q('.fmc-mark'), sweep=q('.fmc-sweep'), lock=q('.fmc-lock'); function A(el,kf,dur,delay,ease){ if(!el) return null; return el.animate(kf,{duration:dur,delay:delay,easing:ease||EO,fill:'both'}); } // 120–820ms · the mark rises through a soft feathered mask. The gradient edge // is what makes it develop into view rather than being wiped by a hard line. A(mark,[{maskPosition:'50% 0%',webkitMaskPosition:'50% 0%'}, {maskPosition:'50% 100%',webkitMaskPosition:'50% 100%'}],700,120,MASK); // 140–860ms · rose-gold hairline travelling ahead of the reveal edge. This is // what makes the reveal read as deliberate rather than as a loading artefact. A(sweep,[{top:'104%',opacity:0},{top:'96%',opacity:1,offset:.12}, {top:'8%',opacity:1,offset:.82},{top:'-4%',opacity:0}],720,140,MASK); // 120–940ms · scale settles. A(mark,[{transform:'translateY(14px) scale(.955)'},{transform:'none'}],820,120,EO); // 880–1320ms · wordmark clip-wipe, rule draws from centre, tagline lifts. A(q('#fmc-wordrect'),[{width:0},{width:372}],320,880,EO); A(q('#fmc-rule'),[{x:200,width:0},{x:130,width:140}],300,1000,EO); A(q('#fmc-tag'),[{opacity:0,transform:'translateY(5px)'},{opacity:1,transform:'none'}],280,1060,EO); var exited=false; function exit(){ if(exited) return; exited=true; try{ sessionStorage.setItem('fmc_loaded','1'); }catch(e){} // Paper lifting off paper is invisible without an edge, hence the // rose-gold trailing rule revealed by the ::after opacity flip. A(panel,[{opacity:0},{opacity:1}],1,0); A(lock,[{transform:'none',opacity:1},{transform:'translateY(-22px)',opacity:0}],260,0,EIO); var lift=A(panel,[{transform:'translateY(0)'},{transform:'translateY(-101%)'}],320,0,'cubic-bezier(.76,0,.24,1)'); if(lift){ lift.onfinish=function(){ panel.remove(); }; } else { panel.remove(); } } // Hard cap. Resolves regardless of asset state — the loader never blocks // content, and if the hero paints sooner we leave sooner. var cap=setTimeout(exit,1360); window.addEventListener('pageshow',function(e){ if(e.persisted){ clearTimeout(cap); exit(); } }); })();

Resources

In the meantime