/* Shared landing motion tokens. No scroll interception or action delays. */
:root{--motion-enter:800ms;--motion-hover:260ms;--motion-ease:cubic-bezier(.16,1,.3,1);--motion-distance:20px}
[data-landing-theme="sapphire"]{--motion-enter:950ms;--motion-distance:26px}
/* Motion tokens: the hierarchy enters once. Controls respond immediately. */
.motion-reveal{transition:opacity var(--motion-enter) var(--motion-ease),translate var(--motion-enter) var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.motion-reveal:not(.is-visible){opacity:0;translate:0 var(--motion-distance)}
.motion-reveal.is-visible{opacity:1;translate:0 0}
.product,.pricing-card{transition:transform var(--motion-hover) var(--motion-ease),box-shadow var(--motion-hover) var(--motion-ease),border-color var(--motion-hover) ease}
/* Audience cards keep their opacity fade (selected vs. not) and press with scale (landing-finish.css). */
.audience-card{transition:transform var(--motion-hover) var(--motion-ease),box-shadow var(--motion-hover) var(--motion-ease),border-color var(--motion-hover) ease,opacity var(--motion-hover) ease,scale var(--hr-motion-duration-release,180ms) var(--hr-motion-easing-settle,cubic-bezier(.16,1,.3,1))}
/* 08.10: the hero no longer trails the pointer — a 900 ms follower explains nothing and lags the hand. */
@media(hover:hover) and (pointer:fine){.product:hover{transform:translateY(-5px)}.pricing-card:hover{transform:translateY(-4px)}.cta-dark,.book{transition:transform 200ms var(--motion-ease),box-shadow 200ms ease,scale var(--hr-motion-duration-release,180ms) var(--hr-motion-easing-settle,cubic-bezier(.16,1,.3,1))}.cta-dark:hover,.book:hover{transform:translateY(-2px)}}
[data-landing-theme="sapphire"] .hero:before{content:"";position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(ellipse at 60% 35%,#a5ddff28,transparent 48%);animation:sapphire-light 10s ease-in-out infinite alternate;animation-play-state:var(--light-state,paused)}
@keyframes sapphire-light{from{transform:translate3d(-3%,0,0);opacity:.5}to{transform:translate3d(4%,3%,0);opacity:1}}
.product .explore span,.book span{transition:translate 220ms var(--motion-ease)}
/* The arrow nudges toward where it points: rightward in English, leftward in Hebrew. */
@media(hover:hover){.product:hover .explore span,.book:hover span{translate:calc(3px * var(--hr-dir,1)) 0}}
@media(max-width:760px){[data-landing-theme="sapphire"] #how-it-works,[data-landing-theme="sapphire"] #pricing{padding-inline:16px}.motion-reveal{--motion-distance:12px;--motion-enter:600ms}[data-landing-theme="sapphire"] .hero:before{animation:none}}
/* Reduced motion, Apple-style (owner 08.10.2026): nothing travels, scales or springs, but a state change keeps
   a short opacity/colour cross-fade (≤ 200 ms). Transforms still change — instantly — and the surfaces that swap
   in place drop their offsets, so they fade where they stand. The opening (intro, word flight, slats, rises,
   header, chain under the headline) and the final mark keep the old rule — no transition at all — and behave
   exactly as before. Phone specifics live in /mobile/app.css. */
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition-property:opacity,color,background-color,border-color,box-shadow,fill,stroke!important;transition-duration:var(--hr-motion-duration-normal,180ms)!important;transition-timing-function:ease!important;transition-delay:0s!important;scroll-behavior:auto!important}
 .intro,.intro *,.intro *::before,.intro *::after,.rise,.fly,.slats i,h1 .line,header,.journey-mini span,.mark-wrap,.mark-wrap *,.mark,.mark-note,#mark,#markNote,#m-mark{transition:none!important;animation:none!important}
 .motion-reveal:not(.is-visible){opacity:1;translate:none}
 .journey-screen,.app-view,.audience-card.active,.pricing-grid-companies .pricing-card.featured{transform:none!important}
 .pricing-panel.active{animation:hr-fade var(--hr-motion-duration-normal,180ms) ease!important}
 .product:hover,.pricing-card:hover,.cta-dark:hover,.book:hover,.journey-links a:hover,.demo-action:hover,.more-list button:hover,.quick-grid button:hover{transform:none!important}
 .product:hover .explore span,.book:hover span{translate:none}
}