/* The five existing previews form one sequence; copy and controls stay still. */
.home-page .onboarding-step { transition: border-color 350ms ease, background-color 350ms ease; }
.home-page .request-preview strong { background: #2265df; }
.home-page .request-preview .request-cursor { width: 24px; height: 30px; font-size: 0; transform: none; transform-origin: 3px 2px; transition: none; pointer-events: none; }
.home-page .request-cursor svg { display: block; width: 100%; height: 100%; }
.home-page .request-cursor::after { content: ''; position: absolute; left: -10px; top: -11px; width: 26px; height: 26px; box-sizing: border-box; border: 2px solid #d8ecff; border-radius: 50%; opacity: 0; pointer-events: none; }
.home-page .onboarding-step.is-motion-current { border-color: #609cdf; background: #10253e; }
.home-page .onboarding-step.is-motion-current::after { color: #fff; border-color: #6caffe; background: #215fa5; }
.home-page .onboarding-step > :first-child { position: relative; overflow: hidden; }
.home-page .onboarding-step > :first-child::after { content: ''; position: absolute; z-index: 3; bottom: 0; left: 0; right: 0; height: 2px; background: #72b9ff; transform: scaleX(0); transform-origin: left; pointer-events: none; }
.home-page .is-motion-current > :first-child::after { animation: hm-step-progress 3.2s linear infinite; }
.home-page .is-motion-current .request-lines i { transform-origin: left; animation: hm-write 3.2s ease-in-out infinite; }
.home-page .is-motion-current .request-lines i:nth-child(2) { animation-delay: 120ms; }
.home-page .is-motion-current .request-lines i:nth-child(3) { animation-delay: 240ms; }
.home-page .is-motion-current .request-cursor { animation: hm-cursor 3.2s ease-in-out infinite; }
.home-page .is-motion-current .request-cursor::after { animation: hm-click-ring 3.2s ease-out infinite; }
.home-page .is-motion-current .request-preview strong { animation: hm-button-press 3.2s ease-in-out infinite; }
.home-page .is-motion-current .agent-orbit { animation: hm-orbit 3.2s ease-in-out infinite; }
.home-page .is-motion-current .agent-orbit-api { animation-delay: 180ms; }
.home-page .is-motion-current .agent-orbit-hook { animation-delay: 360ms; }
.home-page .is-motion-current .test-preview > div { animation: hm-message 3.2s ease-in-out infinite; }
.home-page .is-motion-current .test-preview > span { animation: hm-message 3.2s 200ms ease-in-out infinite; }
.home-page .is-motion-current .services-preview img { animation: hm-connect 3.2s ease-in-out infinite; }
.home-page .is-motion-current .services-preview img:nth-child(2) { animation-delay: 120ms; }
.home-page .is-motion-current .services-preview img:nth-child(3) { animation-delay: 240ms; }
.home-page .is-motion-current .services-preview img:nth-child(4) { animation-delay: 360ms; }
.home-page .is-motion-current .services-preview img:nth-child(5) { animation-delay: 480ms; }
.home-page .is-motion-current .services-preview img:nth-child(6) { animation-delay: 600ms; }
.home-page .is-motion-current .ready-preview span { animation: hm-ready 3.2s ease-in-out infinite; }
@keyframes hm-step-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes hm-write { 0% { transform: scaleX(.2); opacity: .4; } 35%, 100% { transform: scaleX(1); opacity: 1; } }
@keyframes hm-cursor { 0%, 12%, 100% { translate: 0 0; scale: 1; } 38%, 44%, 58%, 76% { translate: -14px -10px; scale: 1; } 48%, 52% { translate: -14px -8px; scale: .9; } }
@keyframes hm-click-ring { 0%, 45% { opacity: 0; transform: scale(.25); } 48% { opacity: .9; transform: scale(.35); } 66%, 100% { opacity: 0; transform: scale(1.5); } }
@keyframes hm-button-press { 0%, 44%, 58%, 100% { transform: scale(1); background-color: #2265df; } 48%, 52% { transform: scale(.95); background-color: #3881f5; } }
@keyframes hm-orbit { 0%, 100% { translate: 0 0; opacity: .55; } 45%, 65% { translate: 0 -7px; opacity: 1; } }
@keyframes hm-message { 0% { translate: 0 10px; opacity: .35; } 28%, 100% { translate: 0 0; opacity: 1; } }
@keyframes hm-connect { 0%, 100% { scale: 1; } 35% { scale: .86; } 58% { scale: 1.08; } 76% { scale: 1; } }
@keyframes hm-ready { 0% { scale: .82; opacity: .5; } 35% { scale: 1.08; opacity: 1; } 55%, 100% { scale: 1; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .home-page .hero-stage *, .home-page .hero-stage *::after, .home-page .onboarding-step *, .home-page .onboarding-step *::after { animation: none !important; }
  .home-page .onboarding-step { transition: none; }
}