/* Used only by FlowAlarm and Hey Go Slow. */
.hero.has-motion{isolation:isolate}
.hero.has-motion>.wrap{position:relative;z-index:1}
.motion-backdrop{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:url('motion-poster.jpg') center/cover no-repeat}
.motion-backdrop video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.82)}
.motion-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(237,243,239,.96) 0%,rgba(237,243,239,.91) 43%,rgba(237,243,239,.58) 100%),linear-gradient(0deg,rgba(237,243,239,.9),transparent 25%)}
.slow .motion-backdrop:after{background:linear-gradient(90deg,rgba(245,239,218,.96) 0%,rgba(245,239,218,.9) 43%,rgba(245,239,218,.55) 100%),linear-gradient(0deg,rgba(245,239,218,.9),transparent 25%)}
.motion-toggle{position:absolute;top:18px;right:max(48px,calc((100% - 1200px)/2));z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:10px 15px;border:1px solid var(--accent);border-radius:6px;background:var(--bg);color:var(--ink);font-size:.73rem;line-height:1.3;cursor:pointer}
.motion-toggle:hover{background:var(--soft)}
.motion-toggle svg{width:14px;height:14px;flex-shrink:0}
.motion-toggle[data-state=paused] .pause-icon,.motion-toggle[data-state=playing] .play-icon{display:none}
@media(max-width:850px){.hero.has-motion{padding-top:84px}.motion-toggle{right:32px;top:16px}.motion-backdrop:after{background:linear-gradient(180deg,rgba(237,243,239,.95) 0%,rgba(237,243,239,.94) 48%,rgba(237,243,239,.64) 82%,rgba(237,243,239,.9) 100%)}.slow .motion-backdrop:after{background:linear-gradient(180deg,rgba(245,239,218,.95) 0%,rgba(245,239,218,.94) 48%,rgba(245,239,218,.6) 82%,rgba(245,239,218,.9) 100%)}}
@media(max-width:550px){.motion-toggle{right:20px}}
