/*
 * FreshBowl — motion and hover.
 * Hidden states apply only once motion.js has run (html.fb-motion), so content is
 * always visible without JavaScript, and nothing moves for reduced-motion visitors.
 */
:root { --fb-ease: cubic-bezier(0.16, 1, 0.3, 1); }

/* ---------- Entrances ---------- */
.fb-motion [data-fb] {
	opacity: 0;
	transition: opacity 0.9s var(--fb-ease), transform 1.1s var(--fb-ease), clip-path 1.3s var(--fb-ease);
	transition-delay: var(--fb-delay, 0ms);
}
.fb-motion [data-fb="rise"] { transform: translateY(36px); }
.fb-motion [data-fb="left"] { transform: translateX(-64px); }
.fb-motion [data-fb="right"] { transform: translateX(64px); }
.fb-motion [data-fb="zoom-in"] { transform: scale(0.86); }
.fb-motion [data-fb="zoom-out"] { transform: scale(1.12); }
.fb-motion [data-fb="draw"] { opacity: 1; transform: scaleX(0); }
.fb-motion [data-fb].is-in { opacity: 1; transform: none; }

/* Curtain reveal: a coral panel slides off the photo while the photo settles from a
   closer crop. The photo itself is never hidden — browsers neither report a fully
   clipped element as in view nor load a lazy image they cannot see. */
.fb-motion [data-fb="left-image"],
.fb-motion [data-fb="right-image"] { opacity: 1; overflow: hidden; }
.fb-motion .wp-block-image[data-fb$="-image"] { position: relative; }
.fb-motion [data-fb="left-image"]::after,
.fb-motion [data-fb="right-image"]::after {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
	background: var(--fb-gold, #c9a96a);
	transition: transform 1.3s var(--fb-ease); transition-delay: var(--fb-delay, 0ms);
}
.fb-motion [data-fb="left-image"]::after { transform-origin: right center; }
.fb-motion [data-fb="right-image"]::after { transform-origin: left center; }
.fb-motion [data-fb$="-image"].is-in::after { transform: scaleX(0); }
.fb-motion [data-fb$="-image"] img { transform: scale(1.12); transition: transform 1.8s var(--fb-ease); transition-delay: var(--fb-delay, 0ms); }
.fb-motion [data-fb$="-image"].is-in img { transform: none; }

/* Gallery: zoom-out photos settle from a closer crop inside their frame. */
.fb-gallery .wp-block-image { overflow: hidden; }
.fb-motion .fb-gallery [data-fb="zoom-out"] { transform: none; }
.fb-motion .fb-gallery [data-fb="zoom-out"] img { transform: scale(1.3); transition: transform 1.8s var(--fb-ease); transition-delay: var(--fb-delay, 0ms); }
.fb-motion .fb-gallery [data-fb="zoom-out"].is-in img { transform: scale(1); }

/* Headings stay put while their words rise one by one. */
.fb-motion [data-fb][data-fb-split] { opacity: 1; transform: none; }
.fb-word { display: inline-block; }
.fb-motion .fb-word {
	opacity: 0;
	transform: translateY(0.55em) rotate(2deg);
	transform-origin: left bottom;
	transition: opacity 0.8s var(--fb-ease), transform 1s var(--fb-ease);
	transition-delay: calc(var(--fb-delay, 0ms) + var(--fb-w, 0) * 70ms);
}
.fb-motion .fb-word.is-in,
.fb-motion.fb-loaded .fb-hero .fb-word { opacity: 1; transform: none; }


/* Slam: cards drop onto the page from slightly too big, with a bounce. */
.fb-motion [data-fb="slam"] { transform: scale(1.18) rotate(-4deg); transition: opacity 0.5s var(--fb-ease), transform 0.8s var(--fb-bounce); transition-delay: var(--fb-delay, 0ms); }
/* Price stamps spin on once their card has landed. */
.fb-motion .aku-menu--cards [data-fb] .aku-dish__price { transform: rotate(-200deg) scale(0); transition: transform 0.7s var(--fb-bounce); transition-delay: calc(var(--fb-delay, 0ms) + 0.35s); }
.fb-motion .aku-menu--cards [data-fb].is-in .aku-dish__price { transform: rotate(-12deg) scale(1); }
.fb-motion .aku-menu--cards [data-fb].is-in:hover .aku-dish__price { transform: rotate(8deg) scale(1.08); transition-delay: 0s; }

/* Hero: words rise, the rest follows, then the bowl rolls in. */
.fb-motion .fb-hero .fb-eyebrow-wrap,
.fb-motion .fb-hero .fb-lead,
.fb-motion .fb-hero .fb-buttons,
.fb-motion .fb-hero .fb-perks { opacity: 0; transform: translateY(24px); transition: opacity 0.8s var(--fb-ease), transform 0.9s var(--fb-ease); }
.fb-motion .fb-hero .fb-hero__media { opacity: 0; transform: translateX(80px) rotate(40deg) scale(0.8); transition: opacity 0.9s var(--fb-ease), transform 1.4s var(--fb-ease); }
.fb-motion.fb-loaded .fb-hero .fb-eyebrow-wrap { opacity: 1; transform: none; transition-delay: 0.1s; }
.fb-motion.fb-loaded .fb-hero .fb-lead { opacity: 1; transform: none; transition-delay: 0.7s; }
.fb-motion.fb-loaded .fb-hero .fb-buttons { opacity: 1; transform: none; transition-delay: 0.9s; }
.fb-motion.fb-loaded .fb-hero .fb-perks { opacity: 1; transform: none; transition-delay: 1.1s; }
.fb-motion.fb-loaded .fb-hero .fb-hero__media { opacity: 1; transform: none; transition-delay: 0.3s; }

/* Reviews: stacked like a deck, then fanned out into place. */
.fb-motion [data-fb="deck"] { transform: translateX(var(--fb-deck-x, 0)) rotate(var(--fb-deck-r, 0deg)) scale(0.9); }

/* Offer bands: words slide sideways as the page scrolls (offset set by motion.js). */
.fb-marquee__words {
	margin: 0 !important; max-width: none !important; padding: 0 !important;
	white-space: nowrap; transform: translateX(var(--fb-marquee, 0)); will-change: transform;
}

/* Rules grow from the left. */
.fb-rule { transform-origin: left; transition: transform 1.2s var(--fb-ease); }

/* Parallax on two-column photos (offset set by motion.js). */
.fb-motion .fb-photo .elementor-widget-image img { transform: translateY(var(--fb-parallax, 0)) scale(1.06); }

/* ---------- Hover ---------- */

/* Text roll: the label slides up to a copy of itself. */
.fb-roll { display: inline-block; overflow: hidden; vertical-align: top; line-height: 1.3; height: 1.3em; }
.fb-roll__inner { display: inline-block; position: relative; transition: transform 0.4s var(--fb-ease); }
.fb-roll__inner::after { content: attr(data-text); position: absolute; left: 0; top: 100%; white-space: nowrap; }
a:hover .fb-roll .fb-roll__inner,
a:focus-visible .fb-roll .fb-roll__inner,
button:hover .fb-roll .fb-roll__inner { transform: translateY(-100%); }

@media (prefers-reduced-motion: reduce) {
	.fb-roll__inner, .aku-menu--cards .aku-dish { transition: none; }
}
