/* One loop duration controls all five service scenes. */
:root{--service-cycle:3s}
/* All scenes share a softly lit studio, and every part stays in its own stage. */
.service-scene{position:relative;isolation:isolate;overflow:hidden;overflow:clip;contain:layout paint;width:100%;height:100%;min-width:0;border-radius:inherit;background:radial-gradient(ellipse at 38% 18%,#fffcf5 0,#f6f0e6 62%,#ece3d5 100%)}
.service-scene>svg{display:block;width:100%;height:100%;overflow:hidden;object-fit:contain}
.service-motion-toggle{position:absolute;right:13px;bottom:12px;z-index:2;display:flex;align-items:center;gap:6px;border:1px solid #d6cdbf9c;border-radius:100px;background:#fffaf1d9;color:#867c6c;backdrop-filter:blur(10px);padding:5px 9px;font-size:9px;line-height:1.5;letter-spacing:.02em;white-space:nowrap;cursor:pointer}
.service-motion-toggle[hidden]{display:none}.service-motion-toggle:hover{color:var(--red,#d7211b);background:#fffdf7}.service-motion-toggle:focus-visible{outline:2px solid var(--red,#d7211b);outline-offset:3px}
.service-scene svg g{transform-box:view-box;transform-origin:center}
.service-scene .focus-lens,.service-scene .focus-iris{animation:none;transform:none}
.service-scene .focus-blade{animation:none;transform:none}
/* Training and staircase motion use analytic curves, driven by independent scene clocks. */
.service-scene .training-page,.service-scene .training-bead,.service-scene .training-bead-shadow,.service-scene .growth-bead{transform-origin:0 0;animation:none;will-change:transform}
.service-scene .training-bead,.service-scene .training-bead-shadow,.service-scene .growth-bead{display:none}
.service-scene.is-ready .training-bead,.service-scene.is-ready .training-bead-shadow,.service-scene.is-ready .growth-bead{display:block}
.service-scene .activation-bead{transform-origin:0 0;opacity:0;animation-duration:var(--service-cycle);animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:reverse;animation-play-state:paused}.service-scene .activation-back{animation-name:service-arch-back}.service-scene .activation-front{animation-name:service-arch-front}.service-scene .activation-bead-2{animation-delay:calc(var(--service-cycle) / -3)}.service-scene .activation-bead-3{animation-delay:calc(var(--service-cycle) * -2 / 3)}
.service-scene .hub-tier{animation-duration:var(--service-cycle);animation-timing-function:cubic-bezier(.22,1,.36,1);animation-iteration-count:infinite;animation-play-state:paused}.service-scene .hub-tier-1{animation-name:service-build-1}.service-scene .hub-tier-2{animation-name:service-build-2}.service-scene .hub-tier-3{animation-name:service-build-3}
.service-scene.is-ready .training-static,.service-scene.is-ready .growth-static,.service-scene.is-ready .activation-static{display:none}
.service-scene.is-playing .focus-blade,.service-scene.is-playing .activation-bead,.service-scene.is-playing .hub-tier{animation-play-state:running}
.service-scene:not(.is-ready) .hub-tier,.service-scene.is-reduced .hub-tier{animation:none;opacity:1;transform:none}
.service-scene.is-reduced .focus-blade,.service-scene.is-reduced .training-page{animation:none;transform:none!important}
.service-scene.is-reduced .training-bead,.service-scene.is-reduced .training-bead-shadow,.service-scene.is-reduced .growth-bead,.service-scene.is-reduced .activation-bead{display:none}.service-scene.is-reduced .training-static,.service-scene.is-reduced .growth-static,.service-scene.is-reduced .activation-static{display:block}
@keyframes service-arch-back{0%{transform:translate(374px,229px) scale(.88);opacity:0}7%{opacity:1}48%{opacity:1}49%,100%{opacity:0}100%{transform:translate(265px,309px) scale(1.05)}}
@keyframes service-arch-front{0%{transform:translate(374px,229px) scale(.88);opacity:0}48%{opacity:0}49%,88%{opacity:1}97%,100%{opacity:0}100%{transform:translate(265px,309px) scale(1.05)}}
@keyframes service-build-1{0%,4%{opacity:0;transform:translateY(-35px)}16%,75%{opacity:1;transform:translateY(0)}89%,100%{opacity:0;transform:translateY(-35px)}}
@keyframes service-build-2{0%,17%{opacity:0;transform:translateY(-35px)}30%,67%{opacity:1;transform:translateY(0)}81%,100%{opacity:0;transform:translateY(-35px)}}
@keyframes service-build-3{0%,31%{opacity:0;transform:translateY(-35px)}44%,59%{opacity:1;transform:translateY(0)}73%,100%{opacity:0;transform:translateY(-35px)}}
@media(max-width:600px){.service-motion-toggle{right:11px;bottom:10px;font-size:8px;padding:4px 8px}}
@media(prefers-reduced-motion:reduce){.service-scene .focus-blade,.service-scene .training-page,.service-scene .hub-tier{animation:none!important;opacity:1;transform:none!important}.service-scene .training-bead,.service-scene .training-bead-shadow,.service-scene .growth-bead,.service-scene .activation-bead{display:none!important}.service-scene .training-static,.service-scene .growth-static,.service-scene .activation-static{display:block!important}.service-motion-toggle{display:none}}
