/* =====================================================================
   Motion layer — front end only (html.hi-motion is set in <head> and
   never inside the Elementor editor or for reduced-motion users).
   ===================================================================== */

/* ---------- smooth scroll (Lenis) ---------- */
html.lenis, html.lenis body { height: auto; }
html.lenis { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- keyframes ---------- */
@keyframes hiRise { from { opacity: 0; transform: translateY(34px); } to { opacity: 1; transform: none; } }
@keyframes hiFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes hiZoom { from { scale: 1.16; } to { scale: 1.04; } }
@keyframes hiLine { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- hero entrance (home + inner pages) ---------- */
html.hi-motion .hi-hero .hi-hero-copy > .elementor-element,
html.hi-motion .hi-phero > .hi-wrap > .elementor-element,
html.hi-motion .hi-phero > .hi-wrap > .e-con > .elementor-element { animation: hiRise 1.1s var(--ease) both; animation-delay: .18s; }
html.hi-motion .hi-hero .hi-hero-copy > .elementor-element:nth-child(2), html.hi-motion .hi-phero > .hi-wrap > .elementor-element:nth-child(2), html.hi-motion .hi-phero > .hi-wrap > .e-con > .elementor-element:nth-child(2) { animation-delay: .3s; }
html.hi-motion .hi-hero .hi-hero-copy > .elementor-element:nth-child(3), html.hi-motion .hi-phero > .hi-wrap > .elementor-element:nth-child(3), html.hi-motion .hi-phero > .hi-wrap > .e-con > .elementor-element:nth-child(3) { animation-delay: .42s; }
html.hi-motion .hi-hero .hi-hero-copy > .elementor-element:nth-child(4), html.hi-motion .hi-phero > .hi-wrap > .elementor-element:nth-child(4), html.hi-motion .hi-phero > .hi-wrap > .e-con > .elementor-element:nth-child(4) { animation-delay: .54s; }
html.hi-motion .hi-hero .hi-hero-copy > .elementor-element:nth-child(n+5), html.hi-motion .hi-phero > .hi-wrap > .elementor-element:nth-child(n+5), html.hi-motion .hi-phero > .hi-wrap > .e-con > .elementor-element:nth-child(n+5) { animation-delay: .66s; }
html.hi-motion .hi-hero .hi-meta > .e-con { animation: hiRise 1s var(--ease) both; animation-delay: .8s; }
html.hi-motion .hi-hero .hi-meta > .e-con:nth-child(2) { animation-delay: .9s; }
html.hi-motion .hi-hero .hi-meta > .e-con:nth-child(3) { animation-delay: 1s; }
html.hi-motion .hi-hero .hi-meta > .e-con:nth-child(4) { animation-delay: 1.1s; }
html.hi-motion .hi-hero .hi-meta::before { content: ""; position: absolute; top: -1px; inset-inline: 0; height: 1px; background: var(--yellow); transform-origin: right; animation: hiLine 1.6s .6s var(--ease) both; }
html.hi-motion .hi-hero .hi-meta { position: relative; }
html.hi-motion .site-header { animation: hiFade .9s .05s both; }

/* ---------- parallax background layer (created by motion.js from the container's background image) ---------- */
.e-con.hi-par-on { background-image: none !important; }
.e-con.hi-bg > .hi-par { position: absolute !important; inset: -16% 0 !important; z-index: -1 !important; background-size: cover; background-repeat: no-repeat; will-change: transform; scale: 1.04; pointer-events: none; }
html.hi-motion .hi-phero > .hi-par, html.hi-motion .hi-hero > .hi-par { animation: hiZoom 2.2s var(--ease) both; }
.e-con.hi-hero.has-3d > .hi-par { opacity: 0; transition: opacity 1.2s; }

/* ---------- scroll reveals (classes added by motion.js) ---------- */
html.hi-motion .hi-rv { transition: opacity .95s var(--ease), transform 1.05s var(--ease), clip-path 1.3s var(--ease); transition-delay: var(--rv-d, 0s); }
html.hi-motion .hi-rv:not(.in) { opacity: 0; transform: translateY(38px); }
html.hi-motion .hi-rv.rv-img { transform: none; }
html.hi-motion .hi-rv.rv-img:not(.in) { opacity: 0; clip-path: inset(0 0 22% 0); }
html.hi-motion .hi-rv.rv-img img { transition: transform 1.6s var(--ease); transition-delay: var(--rv-d, 0s); }
html.hi-motion .hi-rv.rv-img:not(.in) img { transform: scale(1.14); }

/* ---------- scroll cue (home hero) ---------- */
.hi-scroll-cue { position: absolute; z-index: 3; inset-inline-start: var(--gutter); bottom: 40px; display: flex; align-items: center; gap: 12px; font-size: .8125rem; color: var(--stone); writing-mode: vertical-rl; pointer-events: none; }
.hi-scroll-cue i { width: 1.5px; height: 56px; background: linear-gradient(var(--yellow), transparent); animation: drip 2.4s var(--ease) infinite; }
@media (max-width: 900px) { .hi-scroll-cue { display: none; } }

/* ---------- small hover refinements ---------- */
.hi-site .hi-img.zoom:hover img, .hi-site .e-con.hi-app:hover .hi-img img, .hi-site .e-con.hi-stages > .e-con:hover .hi-img img { transform: scale(1.04); }
.hi-site .e-con.hi-app .hi-img, .hi-site .e-con.hi-stages .hi-img, .hi-site .e-con.hi-lights .hi-img { overflow: hidden; border-radius: var(--r-xs); }
.hi-site .e-con.hi-app .hi-img img, .hi-site .e-con.hi-stages .hi-img img, .hi-site .e-con.hi-lights .hi-img img { transition: transform 1.1s var(--ease); }

@media (prefers-reduced-motion: reduce) {
  html.hi-motion .hi-rv, html.hi-motion .hi-rv img { opacity: 1 !important; transform: none !important; clip-path: none !important; }
}
