/* Entrance choreography uses individual transform properties so existing
   server motion, parallax, card hover and illustration tilts stay independent. */
.hero-line{display:inline-block}
.motion-ready [data-enter]{--enter-x:0px;--enter-y:34px;--enter-scale:1}
.motion-ready [data-enter="down"]{--enter-y:-14px}
.motion-ready [data-enter="left"]{--enter-x:-32px;--enter-y:12px}
.motion-ready [data-enter="right"]{--enter-x:32px;--enter-y:12px}
.motion-ready [data-enter="title"]{--enter-y:42px}
.motion-ready [data-enter="zoom"]{--enter-y:25px;--enter-scale:.92}
.motion-ready [data-enter="depth"]{--enter-y:32px;--enter-scale:.86}
.motion-ready [data-enter="card"]{--enter-y:52px;--enter-scale:.97}
.motion-ready [data-enter="pop"]{--enter-y:12px;--enter-scale:.72}
.motion-ready [data-enter]:not(.is-entered){opacity:0;translate:var(--enter-x) var(--enter-y);scale:var(--enter-scale)}
.motion-ready [data-enter].is-entered:not(.enter-complete){
  opacity:var(--enter-opacity,1);translate:0 0;scale:1;
  transition:opacity var(--enter-duration,800ms) cubic-bezier(.22,1,.36,1) var(--enter-delay,0ms),
    translate var(--enter-duration,800ms) cubic-bezier(.22,1,.36,1) var(--enter-delay,0ms),
    scale var(--enter-duration,800ms) cubic-bezier(.22,1,.36,1) var(--enter-delay,0ms);
}
.motion-ready h1 .accent:after{transform:scaleX(0);transform-origin:left;transition:transform 1.05s cubic-bezier(.22,1,.36,1) 220ms}
.motion-ready .hero-line.is-entered .accent:after{transform:scaleX(1)}
.motion-ready .technology-note .tiny-line{scale:0 1;transform-origin:left;transition:scale 1s cubic-bezier(.22,1,.36,1) 220ms}
.motion-ready .technology-note.is-entered .tiny-line{scale:1 1}
.motion-ready .cta-orbit{--enter-opacity:.7}
@media(max-width:560px){
  .motion-ready [data-enter="left"]{--enter-x:-18px}
  .motion-ready [data-enter="right"]{--enter-x:18px}
  .motion-ready [data-enter="title"]{--enter-y:28px}
  .motion-ready [data-enter="card"]{--enter-y:38px}
}
@media(prefers-reduced-motion:reduce){
  .motion-ready [data-enter]{opacity:1!important;translate:none!important;scale:none!important;transition:none!important}
  .motion-ready h1 .accent:after{transform:none;transition:none}
  .motion-ready .technology-note .tiny-line{scale:none;transition:none}
}