:root { --loader-orange: #f15a24; --loader-cream: #fff6df; --loader-ease: cubic-bezier(.22,1,.36,1); }
body.preloading { overflow: hidden; }
.site-preloader { position:fixed; inset:0; z-index:10000; display:none; place-items:center; overflow:hidden; }
.site-preloader.is-active { display:grid; }
.site-preloader::before,.site-preloader::after { content:""; position:absolute; top:0; bottom:0; width:50.1%; background:var(--loader-orange); transition:transform .8s var(--loader-ease); }
.site-preloader::before { left:0; } .site-preloader::after { right:0; }
.site-preloader.is-exiting { pointer-events:none; }
.site-preloader.is-exiting::before { transform:translateX(-100%); }
.site-preloader.is-exiting::after { transform:translateX(100%); }
.loader-plates { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(5px,1vw,12px); width:min(94vw,76dvh,780px); will-change:transform; }
.loader-dish { display:block; aspect-ratio:1; background-image:url('/assets/preloader/food-cutouts.avif'); background-size:300% 200%; background-repeat:no-repeat; opacity:0; }
.is-playing .loader-dish { animation:dish-assemble .5s var(--loader-ease) both; animation-delay:calc(var(--i) * 55ms); }
.is-playing .loader-plates { animation:mosaic-turn 2.15s cubic-bezier(.65,0,.35,1) both; }
.loader-logo { position:absolute; z-index:2; width:clamp(240px,60vw,430px); aspect-ratio:1; object-fit:contain; clip-path:circle(37.3% at 50% 47.8%); opacity:0; transform:scale(.25) rotate(-100deg); }
.is-playing .loader-logo { animation:loader-brand .65s var(--loader-ease) 1.85s both; }
.site-preloader.is-exiting .loader-logo { animation:none; opacity:0; transform:scale(.4); transition:opacity .25s,transform .5s var(--loader-ease); }
.loader-skip { position:absolute; z-index:3; bottom:max(24px,env(safe-area-inset-bottom)); right:24px; padding:10px 18px; min-height:44px; border:1px solid currentColor; border-radius:999px; color:#242424; background:var(--loader-cream); font:14px system-ui,sans-serif; cursor:pointer; }
.is-exiting .loader-skip,.is-exiting .loader-plates { visibility:hidden; }
.loader-skip:focus-visible { outline:2px solid var(--loader-cream); outline-offset:4px; }
@keyframes dish-assemble { from {opacity:0;transform:translateY(70px) scale(.2) rotate(-30deg);} to {opacity:1;transform:translateY(0) scale(1) rotate(0);} }
@keyframes mosaic-turn { 0%,30% {transform:rotate(0) scale(1);} 53% {transform:rotate(-22deg) scale(1.12);} 72% {transform:rotate(0) scale(1);} 82% {transform:rotate(10deg) scale(1);} 100% {transform:rotate(110deg) scale(0);opacity:0;} }
@keyframes loader-brand { to {opacity:1;transform:scale(1) rotate(0);} }
@media (prefers-reduced-motion:reduce) { .loader-plates {display:none;} .loader-logo {opacity:1;transform:none;} .is-playing .loader-logo {animation:none;} .site-preloader::before,.site-preloader::after {transition:none;} .site-preloader.is-exiting .loader-logo {transition:none;} }