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

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

/* Photos fade in while settling from a slightly closer crop. (No sliding panel: on the
   arched and round photos a solid panel reads as a box over the picture.) Opacity does
   not stop a photo from being reported as in view or from loading lazily. */
.so-motion [data-fb="left-image"],
.so-motion [data-fb="right-image"] { opacity: 0; overflow: hidden; transform: none; transition: opacity 1s var(--so-ease); transition-delay: var(--so-delay, 0ms); }
.so-motion [data-fb$="-image"].is-in { opacity: 1; }
.so-motion [data-fb$="-image"] img { transform: scale(1.08); transition: transform 1.6s var(--so-ease); transition-delay: var(--so-delay, 0ms); }
.so-motion [data-fb$="-image"].is-in img { transform: none; }

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

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


/* Slam: cards drop onto the page from slightly too big, with a bounce. */
.so-motion [data-fb="slam"] { transform: scale(1.18) rotate(-4deg); transition: opacity 0.5s var(--so-ease), transform 0.8s var(--so-bounce); transition-delay: var(--so-delay, 0ms); }
/* Hero: words rise, then the rest follows. */
.so-motion .so-hero .so-eyebrow-wrap,
.so-motion .so-hero .so-lead,
.so-motion .so-hero .so-buttons,
.so-motion .so-hero .so-perks { opacity: 0; transform: translateY(24px); transition: opacity 0.8s var(--so-ease), transform 0.9s var(--so-ease); }
.so-motion .so-hero .so-hero__media { opacity: 0; transform: translateX(80px) rotate(40deg) scale(0.8); transition: opacity 0.9s var(--so-ease), transform 1.4s var(--so-ease); }
.so-motion.so-loaded .so-hero .so-eyebrow-wrap { opacity: 1; transform: none; transition-delay: 0.1s; }
.so-motion.so-loaded .so-hero .so-lead { opacity: 1; transform: none; transition-delay: 0.7s; }
.so-motion.so-loaded .so-hero .so-buttons { opacity: 1; transform: none; transition-delay: 0.9s; }
.so-motion.so-loaded .so-hero .so-perks { opacity: 1; transform: none; transition-delay: 1.1s; }
.so-motion.so-loaded .so-hero .so-hero__media { opacity: 1; transform: none; transition-delay: 0.3s; }

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

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

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

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

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

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

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