/* Keep the original image's position, dimensions and intrinsic aspect ratio. */
.home-page .hero-motion{position:relative;order:1;display:block;width:100%;flex-shrink:0;margin-top:clamp(24px,3vw,40px);overflow:hidden;isolation:isolate;scroll-margin-top:110px;background:#fcfcfb}
.home-page .hero-motion>.hero-art{position:static;display:block;width:100%;height:auto;margin:0;pointer-events:none}
.hero-motion .motion-canvas{position:absolute;inset:0;display:none;width:100%;height:100%;pointer-events:none}
.hero-motion[data-running=true] .motion-canvas{display:block}
.hero-motion[data-motion-enabled=true]{cursor:pointer;touch-action:pan-y pinch-zoom}
/* Keep the controls outside the artwork so the canvas retains its exact aspect ratio. */
.home-page .motion-controls{order:1;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;width:100%;padding:12px 24px 0}
.motion-controls .button{width:44px;height:44px;min-height:44px;margin:0;padding:11px;color:#254357;background:linear-gradient(#fff,#f7f8f6);border-color:#dfe4e4;box-shadow:0 2px 5px #142f4010}
.motion-controls svg{width:20px;height:20px;flex:none}
.motion-toggle[aria-checked=true] .motion-slash{display:none}
.motion-controls .button:enabled:hover{background:#edf4f7;border-color:#aabfc9}
.motion-controls .button:focus-visible{outline:3px solid #417e9f;outline-offset:3px}
.motion-controls .button:disabled{opacity:.5;cursor:default;transform:none}
.motion-controls .motion-status{flex-basis:100%;margin:0;text-align:right;font-size:13px;line-height:1.5;color:#53554f}
.motion-controls .motion-status[hidden]{display:none}
@media(max-width:599px){.home-page .motion-controls{justify-content:center;gap:8px;padding:12px 8px 0}.motion-controls .motion-status{text-align:center}}
@media(prefers-reduced-motion:reduce){.hero-motion .motion-canvas{display:none!important}}
