/* Motion is progressive: every section is readable before JavaScript runs. */
.page-progress{position:fixed;inset:0 0 auto;height:2px;z-index:100;pointer-events:none}
.page-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#9bc2e9,#b7dac8);transform:scaleX(0);transform-origin:left center;will-change:transform}
.title-line{display:block}
.hero-copy.reveal.visible,.hero-stage.reveal.visible{animation:none}
.hero-stage::before{content:"";position:absolute;z-index:-1;inset:13% 10% 4%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(133,178,215,.19),transparent 67%);filter:blur(30px);pointer-events:none}

body.motion-ready .site-header{animation:nav-arrive .5s cubic-bezier(.22,1,.36,1) both}
body.motion-ready .hero-copy .eyebrow{animation:rise-soft .55s cubic-bezier(.22,1,.36,1) .08s both}
body.motion-ready .hero-copy .title-line:first-child{animation:title-arrive .75s cubic-bezier(.22,1,.36,1) .16s both}
body.motion-ready .hero-copy .title-line:last-child{animation:title-arrive .75s cubic-bezier(.22,1,.36,1) .28s both}
body.motion-ready .hero-copy>p:not(.hero-meta){animation:rise-soft .65s cubic-bezier(.22,1,.36,1) .43s both}
body.motion-ready .hero-actions{animation:rise-soft .65s cubic-bezier(.22,1,.36,1) .52s both}
body.motion-ready .hero-meta{animation:rise-soft .6s cubic-bezier(.22,1,.36,1) .61s both}
body.motion-ready .hero-stage.visible .stage-topline{animation:rise-soft .5s cubic-bezier(.22,1,.36,1) both}
body.motion-ready .hero-stage.visible .laptop{animation:device-arrive .9s cubic-bezier(.22,1,.36,1) .08s both}
body.motion-ready .hero-stage.visible .demo-prompter{animation:panel-arrive .65s cubic-bezier(.22,1,.36,1) .45s both}
body.motion-ready .hero-stage.visible .call-tile{animation:tile-arrive .55s cubic-bezier(.22,1,.36,1) both}
body.motion-ready .hero-stage.visible .call-main{animation-delay:.28s}
body.motion-ready .hero-stage.visible .call-side{animation-delay:.37s}
body.motion-ready .hero-stage.visible .tile-three{animation-delay:.44s}
body.motion-ready .hero-stage.visible .stage-caption{animation:rise-soft .6s cubic-bezier(.22,1,.36,1) .7s both}
body.motion-ready .hero-stage.visible::before{animation:breath 7s ease-in-out 1s infinite alternate}
.speed-label.bump{animation:speed-bump .3s cubic-bezier(.22,1,.36,1)}
.play-button:active,.icon-button:active{transform:scale(.92)}
.button:focus-visible,.nav-download:focus-visible,.icon-button:focus-visible,.play-button:focus-visible{outline:2px solid #b9d8ed;outline-offset:4px}

@keyframes nav-arrive{from{opacity:.7;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes rise-soft{from{opacity:.7;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes title-arrive{from{opacity:.72;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes device-arrive{from{opacity:.7;transform:translateY(22px) scale(.98)}to{opacity:1;transform:none}}
@keyframes panel-arrive{from{opacity:.7;transform:translate(-50%,-14px) scale(.94)}to{opacity:1;transform:translateX(-50%)}}
@keyframes tile-arrive{from{opacity:.7;transform:scale(.98)}to{opacity:1;transform:none}}
@keyframes breath{from{opacity:.55;transform:scale(.96)}to{opacity:1;transform:scale(1.04)}}
@keyframes speed-bump{from{color:#fff;transform:translateY(-3px)}to{color:#a4b0bc;transform:none}}

@media(max-width:640px){
  body.motion-ready .hero-stage.visible .laptop{animation-duration:.65s}
  body.motion-ready .hero-stage.visible .demo-prompter{animation-delay:.29s}
  .hero-stage::before{inset:14% 0 6%}
}
@media(prefers-reduced-motion:reduce){
  .page-progress span{transition:none}
  body.motion-ready .site-header,
  body.motion-ready .hero-copy .eyebrow,
  body.motion-ready .hero-copy .title-line,
  body.motion-ready .hero-copy>p,
  body.motion-ready .hero-actions,
  body.motion-ready .hero-stage.visible .stage-topline,
  body.motion-ready .hero-stage.visible .laptop,
  body.motion-ready .hero-stage.visible .demo-prompter,
  body.motion-ready .hero-stage.visible .call-tile,
  body.motion-ready .hero-stage.visible .stage-caption,
  body.motion-ready .hero-stage.visible::before,
  .speed-label.bump{animation:none!important}
}