/* Scroll depth composes with the existing card rotations and reveal animations. */
.has-motion .flow-pix-object{translate:0 var(--flow-pix-y,0px)}
.has-motion .flow-card-object{translate:0 var(--flow-card-y,0px)}
.has-motion .public-journey .control-story{translate:0 var(--journey-copy-y,0px)}
.has-motion .public-journey .control-story h2{translate:0 var(--journey-heading-y,0px)}
.has-motion .public-journey .control-device{transform:translate3d(0,var(--journey-card-y,0px),0) rotateY(var(--journey-card-yaw,-3.5deg)) rotateX(var(--journey-card-pitch,1.8deg)) scale(var(--journey-card-scale,1))}
.has-motion .account-opening .opening-heading,.has-motion .account-opening .opening-steps>li,.has-motion .account-opening .opening-art,.has-motion .account-opening .opening-actions{translate:0 var(--section-depth-y,0px)}
@media(max-width:760px){.has-motion .public-journey .control-device{transform:translate3d(0,var(--journey-card-y,0px),0) scale(var(--journey-card-scale,1))}}
@media(max-width:760px){.has-motion .public-journey .control-story,.has-motion .public-journey .control-story h2{translate:none}.has-motion .public-journey .control-device{transform:none}}
@media(max-height:500px) and (orientation:landscape){.has-motion .public-journey .control-story,.has-motion .public-journey .control-story h2{translate:none}.has-motion .public-journey .control-device{transform:none}}
@media(prefers-reduced-motion:reduce){.has-motion .flow-pix-object,.has-motion .flow-card-object,.has-motion .public-journey .control-story,.has-motion .public-journey .control-story h2,.has-motion .account-opening .opening-heading,.has-motion .account-opening .opening-steps>li,.has-motion .account-opening .opening-art,.has-motion .account-opening .opening-actions{translate:none!important}.has-motion .public-journey .control-device{transform:none!important}}