/* Motion stays in the editorial copy, outside the screenshots. */
.detail-motion .motion-scene{--enter:0;--travel:0;--lift:0px;--drift:0px;--turn:0deg;--paper-scale:1;position:relative}
.detail-motion [data-animate] .copy-token{transition-duration:.7s,1s;transition-delay:calc(var(--i)*85ms);transform:translateY(32px) rotate(2deg)}
.detail-motion [data-animate].in-view .copy-token{transform:translateY(0) rotate(0)}
.detail-motion [data-animate] em{background:linear-gradient(transparent 52%,#66884eb8 52%,#66884eb8 94%,transparent 94%) left center/0% 100% no-repeat;transition:background-size 1.1s cubic-bezier(.22,1,.36,1) .38s;font-weight:800;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.detail-motion [data-animate].in-view em{background-size:100% 100%}
.detail-motion .page-title em{background:none;font-weight:700}
.detail-motion .brief-spread h2 em{background-image:linear-gradient(transparent 52%,#c9d998 52%,#c9d998 94%,transparent 94%)}
.detail-motion .motion-copy:not([data-animate]){opacity:0;translate:0 22px;transition:opacity .8s,translate 1s cubic-bezier(.16,1,.3,1) .12s}
.detail-motion .motion-copy.motion-visible{opacity:1;translate:0 0}
.detail-motion .page-lead{transition-delay:.35s!important}
.detail-motion .page-intro>.text-link{transition-delay:.5s!important}
.detail-motion .page-art .detail-device{translate:0 var(--lift);rotate:var(--turn);transition:translate .1s linear,rotate .1s linear}
.detail-motion .page-art .art-caption{translate:var(--drift) calc(var(--lift)*-.8);transition:opacity .9s,translate .18s linear;box-shadow:0 24px 60px #0005}
.detail-motion .page-art .art-caption:not(.motion-visible){opacity:0;translate:35px 50px}
.detail-motion .motion-item{opacity:0;translate:0 36px;transition:opacity .8s,translate .95s cubic-bezier(.16,1,.3,1);transition-delay:var(--delay,0ms)}
.detail-motion .motion-item.motion-visible{opacity:1;translate:0 0}
.detail-motion :is(.editorial,.language-demo,.faq,.closing-cta){border-top-color:transparent}
.detail-motion :is(.editorial,.language-demo,.faq,.closing-cta):before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,#b8ceb4aa,#b8ceb420);transform:scaleX(var(--enter));transform-origin:left;pointer-events:none}
.detail-motion .brief-spread{transform:translateY(var(--lift)) scale(var(--paper-scale));transform-origin:center top;box-shadow:0 35px 70px #0004;isolation:isolate}
.detail-motion .brief-spread:before,.detail-motion .brief-spread:after{content:'';position:absolute;inset:0;background:#8b9d87;border:1px solid #c4d4b855;border-radius:inherit;z-index:-1;transform:translateY(calc(12px*var(--enter))) scale(.975);transform-origin:center bottom;pointer-events:none}
.detail-motion .brief-spread:after{background:#52654f;z-index:-2;transform:translateY(calc(24px*var(--enter))) scale(.95)}
.detail-motion .reading-order>div{position:relative;transition:opacity .8s,translate 1s cubic-bezier(.16,1,.3,1),background .3s;transition-delay:var(--delay);padding:22px 15px 18px;border-radius:0 0 12px 12px;background:#b8ceb405}
.detail-motion .reading-order>div:before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:#cfdf9f;scale:0 1;transform-origin:left;transition:scale .8s .25s}
.detail-motion .reading-order>div.motion-visible:before{scale:1 1}
.detail-motion .reading-order>div:hover{background:#b8ceb410}
.detail-motion .feature-explorer{transform:translateY(var(--lift));box-shadow:0 26px 65px #0003}
.detail-motion .panel-image{translate:0 calc(var(--lift)*-.7);rotate:calc(var(--turn)*-.6);transition:translate .15s linear,rotate .15s linear}
.detail-motion .feature-tabs button{transition:color .3s,background .3s}
.detail-motion .feature-tabs button:after{display:block;content:'';height:3px;background:var(--sage);position:absolute;bottom:-2px;left:0;right:0;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.detail-motion .feature-tabs button[aria-selected=true]:after{transform:scaleX(1)}
.detail-motion .check-list li:before{display:inline-block;scale:0;transition:scale .6s;transition-delay:var(--delay)}
.detail-motion .check-list li.motion-visible:before{scale:1}
.detail-motion .language-art>span{translate:calc(var(--drift)*var(--direction,1)) 0;transition:opacity .9s,translate 1.1s cubic-bezier(.16,1,.3,1);transition-delay:var(--delay)}
.detail-motion .language-art>span:nth-child(2){--direction:-1}
.detail-motion .language-art>span:not(.motion-visible){translate:65px 20px}
.detail-motion .language-paper{transform:translateY(var(--lift)) rotate(calc(var(--turn)*.4));isolation:isolate}
.detail-motion .language-paper:before{content:'';position:absolute;inset:0;background:#8c9f83;border-radius:inherit;z-index:-1;transform:translate(10px,12px) rotate(-2deg);opacity:.35;pointer-events:none}
.detail-motion .language-switch button{transition:background .3s,color .3s,translate .3s}
.detail-motion .language-switch button:hover{translate:0 -3px}
.detail-motion .api-connection{transform:scaleY(var(--enter));transform-origin:top;position:relative}
.detail-motion .api-connection:after{content:'';position:absolute;bottom:-4px;left:-3px;width:7px;height:7px;border-radius:50%;background:#d1e6ba}
.detail-motion .api-source{translate:0 calc(var(--lift)*.4)}
.detail-motion .api-destinations{translate:0 calc(var(--lift)*-.4)}
.detail-motion .service-steps{position:relative}
.detail-motion .service-steps:before{content:'';position:absolute;left:10px;top:22px;bottom:36px;width:1px;background:#a7be8550;transform:scaleY(var(--enter));transform-origin:top}
.detail-motion .service-steps li{position:relative;padding-left:0;transition:opacity .8s,translate 1s,color .4s;transition-delay:var(--delay)}
.detail-motion .service-steps li>span{position:relative;background:#0c151e;align-self:flex-start;padding:6px 0;transition:color .4s,scale .5s}
.detail-motion .service-steps .step-current>span{color:#e0eea9;scale:1.12}
.detail-motion .service-steps h3{transition:color .4s}
.detail-motion .service-steps .step-current h3{color:#e0eea9}
.detail-motion .api-catalog article{border-top-color:#b8ceb430}
.detail-motion .api-planner{transform:translateY(var(--lift));box-shadow:0 25px 65px #0003}
.detail-motion .download-grid article{rotate:calc(var(--turn)*var(--direction,1));transition:opacity .8s,translate .95s cubic-bezier(.16,1,.3,1),rotate .15s linear,border-color .3s;transition-delay:var(--delay,0ms);box-shadow:0 24px 55px #0003}
.detail-motion .download-grid article:nth-child(2){--direction:-1}
.detail-motion .download-grid article:hover{border-color:#c5dca580}
.detail-motion .closing-cta .primary-link{transition:background .3s,transform .4s,box-shadow .4s}
.detail-motion .closing-cta .primary-link:hover{box-shadow:0 8px 30px #bad39825;transform:translateY(-4px)}
@media(min-width:900px){.detail-motion .editorial-title{position:sticky;top:70px;align-self:start}.detail-motion .editorial{min-height:400px}.detail-motion .reading-order>div:nth-child(2){margin-top:22px}.detail-motion .reading-order>div:nth-child(3){margin-top:44px}}
@media(max-width:760px){.detail-motion .reading-order{gap:9px}.detail-motion .reading-order>div{padding:18px 6px 12px}.detail-motion .page-art .detail-device{translate:0 calc(var(--lift)*.5)}.detail-motion .page-art .art-caption{translate:calc(var(--drift)*.5) calc(var(--lift)*-.4)}.detail-motion .brief-spread{transform:translateY(calc(var(--lift)*.35)) scale(var(--paper-scale))}.detail-motion .language-paper{transform:translateY(calc(var(--lift)*.35))}.detail-motion .download-grid article{rotate:0deg}.detail-motion .language-art>span{translate:calc(var(--drift)*var(--direction,1)*.5) 0}.detail-motion .api-planner,.detail-motion .feature-explorer{transform:translateY(calc(var(--lift)*.35))}}
@media(prefers-reduced-motion:reduce){.detail-page .motion-item,.detail-page .motion-copy{opacity:1!important;translate:none!important;transform:none!important;transition:none!important}.detail-page .motion-scene,.detail-page .panel-image,.detail-page .language-paper,.detail-page .detail-device,.detail-page .download-grid article{transform:none;translate:none;rotate:none}.detail-page [data-animate] em{background-size:100% 100%!important;transition:none!important}}

/* Layer edges sit outside the paper, keeping its reading surface light. */
.detail-motion .brief-spread{box-shadow:0 12px 0 -5px #8b9d87,0 24px 0 -10px #52654f,0 35px 70px #0004}
.detail-motion .brief-spread:before,.detail-motion .brief-spread:after,.detail-motion .language-paper:before{display:none}
.detail-motion .language-paper{box-shadow:10px 12px 0 -3px #8c9f834d,0 20px 50px #0003}