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

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

/* Curtain reveal: a gold 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. */
.ld-motion [data-ld="left-image"],
.ld-motion [data-ld="right-image"] { opacity: 1; overflow: hidden; }
.ld-motion .wp-block-image[data-ld$="-image"] { position: relative; }
.ld-motion [data-ld="left-image"]::after,
.ld-motion [data-ld="right-image"]::after {
	content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
	background: var(--ld-gold, #c9a96a);
	transition: transform 1.3s var(--ld-ease); transition-delay: var(--ld-delay, 0ms);
}
.ld-motion [data-ld="left-image"]::after { transform-origin: right center; }
.ld-motion [data-ld="right-image"]::after { transform-origin: left center; }
.ld-motion [data-ld$="-image"].is-in::after { transform: scaleX(0); }
.ld-motion [data-ld$="-image"] img { transform: scale(1.12); transition: transform 1.8s var(--ld-ease); transition-delay: var(--ld-delay, 0ms); }
.ld-motion [data-ld$="-image"].is-in img { transform: none; }

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

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

/* Hero: words rise, the rest follows, the photo eases out of a slight zoom. */
.ld-hero__media { overflow: hidden; }
.ld-motion .ld-hero__media img { transform: scale(1.12); transition: transform 2.8s var(--ld-ease); }
.ld-motion.ld-loaded .ld-hero__media img { transform: scale(1); }
.ld-motion .ld-hero .ld-eyebrow,
.ld-motion .ld-hero .ld-lead,
.ld-motion .ld-hero .wp-block-buttons,
.ld-motion .ld-hero .ld-buttons,
.ld-motion .ld-hero .aku-open { opacity: 0; transform: translateY(20px); transition: opacity 0.9s var(--ld-ease), transform 1s var(--ld-ease); }
.ld-motion.ld-loaded .ld-hero .ld-eyebrow { opacity: 1; transform: none; transition-delay: 0.1s; }
.ld-motion.ld-loaded .ld-hero .ld-lead { opacity: 1; transform: none; transition-delay: 0.75s; }
.ld-motion.ld-loaded .ld-hero .wp-block-buttons,
.ld-motion.ld-loaded .ld-hero .ld-buttons { opacity: 1; transform: none; transition-delay: 0.95s; }
.ld-motion.ld-loaded .ld-hero .aku-open { opacity: 1; transform: none; transition-delay: 1.15s; }
.ld-hero h1 em { background: linear-gradient(90deg, var(--ld-gold) 0%, #f0dcae 50%, var(--ld-gold) 100%) 0 0 / 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.ld-motion.ld-loaded .ld-hero h1 em { animation: ld-shimmer 3.2s 1.2s var(--ld-ease) both; }
@keyframes ld-shimmer { from { background-position: 100% 0; } to { background-position: 0 0; } }

/* Intro reveal: the hero photo opens out from a small framed picture. */
.ld-motion .ld-hero__media { clip-path: inset(18% 24% 18% 24%); transition: clip-path 1.7s var(--ld-ease) 0.15s; }
.ld-motion.ld-loaded .ld-hero__media { clip-path: inset(0 0 0 0); }

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

/* Moving words band. */
.ld-marquee { background: var(--ld-ink); overflow: hidden; padding: clamp(28px, 4vw, 56px) 0 !important; }
.ld-marquee__words {
	margin: 0 !important; max-width: none !important; padding: 0 !important;
	font-family: var(--ld-display); font-style: italic; font-weight: 500;
	font-size: clamp(64px, 11vw, 170px); line-height: 1; white-space: nowrap;
	color: transparent; -webkit-text-stroke: 1px var(--ld-gold);
	transform: translateX(var(--ld-marquee, 0));
	will-change: transform;
}

/* A heading filled with a photograph (set by motion.js from the section's first photo). */
.ld-photo-text {
	/* A dark wash keeps every letter readable on cream, whatever the photo. */
	background-image: linear-gradient(rgba(14, 13, 11, 0.45), rgba(14, 13, 11, 0.45)), var(--ld-photo);
	background-size: cover;
	background-position: 50% 50%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	font-size: clamp(56px, 8vw, 120px);
	animation: ld-pan 20s ease-in-out infinite alternate;
}
@keyframes ld-pan { from { background-position: 0% 30%; } to { background-position: 100% 70%; } }

/* Gold rules draw out from the centre. */
.ld-rule { transform-origin: center; transition: transform 1.2s var(--ld-ease); }

/* Carte: the dotted leader draws across as each dish arrives. */
.ld-motion .aku-menu--carte .aku-dish__leader { transform: translateY(-0.3em) scaleX(0); transform-origin: left; transition: transform 1.2s 0.3s var(--ld-ease), border-color 0.3s; }
.ld-motion .aku-menu--carte .aku-dish.is-in .aku-dish__leader { transform: translateY(-0.3em) scaleX(1); }

/* Parallax on two-column photos (offset set by motion.js). */
.ld-split .wp-block-image, .ld-split .elementor-widget-image { overflow: hidden; }
.ld-motion .ld-split .wp-block-image img,
.ld-motion .ld-split .elementor-widget-image img { transform: translateY(var(--ld-parallax, 0)) scale(1.08); }

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

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

/* Menu links: a gold line grows under the hovered link. */
.site-nav a { position: relative; }
.site-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--ld-gold); transform: scaleX(0); transform-origin: right; transition: transform 0.45s var(--ld-ease); }
.site-nav a:hover::after,
.site-nav .current-menu-item > a::after { transform: scaleX(1); transform-origin: left; }

/* Buttons: colour sweeps in from the left. */
.button, .wp-block-button__link, .aku-btn--primary {
	background-image: linear-gradient(var(--ld-ink), var(--ld-ink));
	background-repeat: no-repeat;
	background-size: 0% 100%;
	background-position: left;
	transition: background-size 0.55s var(--ld-ease), color 0.35s, border-color 0.35s;
}
.button:hover, .wp-block-button__link:hover, .aku-btn--primary:hover { background-color: var(--ld-gold); background-size: 100% 100%; color: var(--ld-gold); }
.button--outline, .is-style-outline .wp-block-button__link { background-image: linear-gradient(var(--ld-gold), var(--ld-gold)); }
.button--outline:hover, .is-style-outline .wp-block-button__link:hover { background-color: transparent; color: var(--ld-ink); }
.ld-light .is-style-outline .wp-block-button__link { background-image: linear-gradient(var(--ld-gold-text), var(--ld-gold-text)); }
.ld-light .is-style-outline .wp-block-button__link:hover { color: var(--ld-paper); }

/* WordPress's own button styles are more specific; restate the sweep at their weight. */
.wp-block-button > .wp-block-button__link:not(.has-background) {
	background-color: var(--ld-gold);
	background-image: linear-gradient(var(--ld-ink), var(--ld-ink));
	background-repeat: no-repeat;
	background-size: 0% 100%;
	background-position: left;
}
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background-color: transparent;
	background-image: linear-gradient(var(--ld-gold), var(--ld-gold));
}
.ld-light .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background),
.ld-cream .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background) {
	background-image: linear-gradient(var(--ld-gold-text), var(--ld-gold-text));
	color: var(--ld-gold-text);
	border-color: var(--ld-gold-text);
}
.wp-block-button > .wp-block-button__link:not(.has-background):hover { background-size: 100% 100%; }
.ld-light .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):hover,
.ld-cream .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):hover { color: var(--ld-paper); }

/* Chef's picks: the card turns from paper to ink, the photo zooms, gold takes over. */
.aku-menu--cards .aku-dish { background: var(--ld-paper); transition: background-color 0.5s var(--ld-ease), color 0.5s, box-shadow 0.5s, transform 0.5s var(--ld-ease), opacity 0.9s var(--ld-ease); }
.aku-menu--cards .aku-dish__media { overflow: hidden; }
.aku-menu--cards .aku-dish__media img { transition: transform 1.2s var(--ld-ease); }
.aku-menu--cards .aku-dish__body { padding: 6px 22px 24px; }
.aku-menu--cards .aku-dish__desc, .aku-menu--cards .aku-tag { transition: color 0.5s, border-color 0.5s; }
.aku-menu--cards .aku-dish:hover { background: var(--ld-ink); color: var(--ld-cream); box-shadow: 0 24px 50px rgba(14, 13, 11, 0.25); transform: translateY(-6px); }
.aku-menu--cards .aku-dish:hover .aku-dish__media img { transform: scale(1.07); }
.aku-menu--cards .aku-dish:hover .aku-dish__price { color: var(--ld-gold); }
.aku-menu--cards .aku-dish:hover .aku-dish__desc { color: rgba(243, 235, 221, 0.72); }
.aku-menu--cards .aku-dish:hover .aku-tag { border-color: var(--ld-line-dark); }

/* Carte: the dish name turns gold and its leader becomes a solid line. */
.aku-menu--carte .aku-dish__name { transition: color 0.35s; }
.aku-menu--carte .aku-dish:hover .aku-dish__name { color: var(--ld-gold-text); }
.ld-dark .aku-menu--carte .aku-dish:hover .aku-dish__name { color: var(--ld-gold); }
.aku-menu--carte .aku-dish:hover .aku-dish__leader { border-bottom-style: solid; opacity: 1; }

/* Courses: a soft gold wash and a small step in. */
.ld-course { transition: background-color 0.45s, padding 0.45s var(--ld-ease), opacity 0.9s var(--ld-ease), transform 1.1s var(--ld-ease); }
.ld-course:hover { background: rgba(201, 169, 106, 0.08); padding-left: 16px !important; padding-right: 16px !important; }

/* Reviews and journal cards change colour on hover. */
.ld-reviews .wp-block-column { padding: 28px 24px 24px; transition: background-color 0.45s, border-color 0.45s, opacity 0.9s var(--ld-ease), transform 0.6s var(--ld-ease); }
.ld-reviews .wp-block-column:hover { background: var(--ld-cream); border-top-color: var(--ld-gold-text); transform: translateY(-4px); }
.post-card { transition: background-color 0.45s, opacity 0.9s var(--ld-ease), transform 1.1s var(--ld-ease); }
.post-card:hover { background: var(--ld-cream); }
.post-card__media { display: block; overflow: hidden; }
.post-card__media img { transition: transform 1.2s var(--ld-ease); }
.post-card:hover .post-card__media img { transform: scale(1.05); }
.post-card:hover .post-card__title a { color: var(--ld-gold-text); }

/* Gallery photos zoom gently on hover. */
.ld-gallery .wp-block-image img { transition: transform 1.2s var(--ld-ease), filter 0.6s; }
.ld-gallery .wp-block-image:hover img { transform: scale(1.06); filter: saturate(1.1); }

@media (prefers-reduced-motion: reduce) {
	.ld-roll__inner, .aku-menu--cards .aku-dish, .ld-reviews .wp-block-column, .ld-course { transition: none; }
	.aku-menu--cards .aku-dish:hover, .ld-reviews .wp-block-column:hover { transform: none; }
}
