/* Cinematic movement uses the existing images; the frame keeps layout stable. */
.tsb-site .tsb-motion-frame{position:relative;display:block;isolation:isolate;overflow:hidden;min-width:0;width:100%;border-radius:10px;line-height:0}
.tsb-site .tsb-motion-frame.tsb-motion-hero{border-radius:100px 10px 100px 10px}
.tsb-site .tsb-motion-frame.tsb-motion-card{flex:0 0 auto;margin-bottom:24px;border-radius:7px}
.tsb-site .tsb-motion-frame>img{display:block;width:100%;margin:0!important;border-radius:0!important;transform-origin:center;animation:tsb-cinematic-pan 14s ease-in-out infinite alternate;animation-play-state:paused}
.tsb-site .tsb-motion-frame[data-motion-direction=reverse]>img{animation-direction:alternate-reverse;animation-duration:17s}
.tsb-site .tsb-motion-frame.tsb-motion-visible>img{will-change:transform}
html[data-tsb-image-motion=playing] .tsb-site .tsb-motion-visible>img{animation-play-state:running}
.tsb-site .tsb-motion-frame.tsb-motion-arrive{animation:tsb-image-arrive .85s cubic-bezier(.2,.65,.3,1) both}
html:not([data-tsb-image-motion=playing]) .tsb-site .tsb-motion-arrive{animation:none}
html[data-tsb-image-motion=reduced] .tsb-site .tsb-motion-frame>img{animation:none!important;transform:none!important;will-change:auto}
@keyframes tsb-cinematic-pan{from{transform:scale(1.02) translate3d(-.3%,.2%,0)}to{transform:scale(1.10) translate3d(.5%,-.4%,0)}}
@keyframes tsb-image-arrive{from{opacity:.65;transform:translate3d(0,16px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(max-width:900px){.tsb-site .tsb-motion-frame.tsb-motion-hero{border-radius:65px 8px 65px 8px}}
@media(max-width:700px){.tsb-site .tsb-motion-frame>img{animation-duration:18s}.tsb-site .tsb-motion-frame[data-motion-direction=reverse]>img{animation-duration:21s}}
@media(prefers-reduced-motion:reduce){.tsb-site .tsb-motion-frame,.tsb-site .tsb-motion-frame>img{animation:none!important;transform:none!important;will-change:auto!important}}