/* Selected studies: raster signals and automation sequence. */
.hero-motion{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:.9;mask-image:linear-gradient(90deg,transparent 5%,#0003 40%,#000 65%);background-image:linear-gradient(#73ad8218 1px,transparent 1px),linear-gradient(90deg,#73ad8218 1px,transparent 1px);background-size:64px 64px}
.hero-motion canvas{display:block;width:100%;height:100%}
.hero{min-height:650px}.hero-inner{max-width:68%;z-index:2}
.hero::before,.hero::after{display:none}
.hero .reveal,.hero .w>span{opacity:1!important;filter:none!important;transform:none!important}
.motion-toggle{border:0;border-bottom:1px solid #58735e;background:transparent;color:var(--muted);font:10px 'JetBrains Mono',monospace;padding:12px 0;cursor:pointer;margin-top:12px;min-height:44px}
.motion-toggle:hover{color:var(--paper)}.motion-toggle:focus-visible{outline:2px solid var(--paper);outline-offset:4px}
html:not(.qs-motion-ready) .motion-toggle{display:none}
.flow-study{position:relative;margin:34px 0 38px;min-height:245px;border-top:1px solid #415345;border-bottom:1px solid #415345;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#324a3426,transparent 70%)}
.flow-topline{display:flex;justify-content:space-between;gap:16px;font:10px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#a6b9ac;padding:21px 0}
.flow-track{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:center;padding:21px 0 38px}
.flow-track svg{position:absolute;left:16.66%;top:42px;width:66.66%;height:4px;overflow:visible;pointer-events:none}
.flow-track .wire{stroke:#56715c;stroke-width:1;fill:none}.flow-track .pulse{stroke:#d0ffda;stroke-width:3;fill:none;stroke-dasharray:50 950;animation:flow-travel 6s linear infinite;filter:drop-shadow(0 0 5px #a7efb7)}
.flow-step{position:relative;z-index:1;display:grid;justify-items:center;gap:12px}.flow-symbol{position:relative;display:grid;place-items:center;width:48px;height:48px;border:1px solid #68836c;border-radius:50%;background:#1c211d;color:#b7debf;font:18px 'JetBrains Mono',monospace}.flow-symbol:before{content:"";position:absolute;inset:-6px;border:1px solid #a7efb7;border-radius:50%;opacity:0;animation:flow-node 6s ease-in-out infinite;animation-delay:var(--delay)}.flow-step h3{font-size:clamp(17px,1.6vw,25px);font-weight:500;margin:0}.flow-step p{color:#aeb7af;font-size:13px;max-width:240px;margin:0}.flow-step small{font:10px 'JetBrains Mono',monospace;color:#769c7e;letter-spacing:.1em}
@keyframes flow-travel{from{stroke-dashoffset:100}to{stroke-dashoffset:-900}}@keyframes flow-node{0%,18%,100%{opacity:0;transform:scale(.9)}5%,12%{opacity:.8;transform:scale(1.08)}}

.flow-study>.motion-toggle{display:block;margin:0 0 18px auto}
body.motion-paused .flow-study *,body.motion-background .flow-study *{animation-play-state:paused!important}
#automatisierung-demos{scroll-margin-top:130px}
@media(min-width:1800px){.hero{min-height:720px}.hero-inner{max-width:1080px}}
@media(max-width:1050px){.hero-inner{max-width:77%}}
@media(max-width:700px){.hero{min-height:0}.hero-inner{max-width:100%}.hero-motion{mask-image:linear-gradient(transparent 20%,#0005 65%,#000)}.flow-topline{font-size:8px}.flow-track{grid-template-columns:1fr;text-align:left;gap:34px;padding:20px 0 32px}.flow-step{grid-template-columns:48px 1fr;justify-items:start;column-gap:20px;row-gap:5px}.flow-step .flow-symbol{grid-row:1/4}.flow-step h3{font-size:20px}.flow-step p{max-width:none}.flow-track svg{left:24px;top:40px;width:3px;height:calc(100% - 125px)}.flow-study{padding:0 8px}.flow-step small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.flow-study *{animation:none!important}.flow-track .pulse{display:none}.hero-motion canvas{display:none}}

.flow-offscreen *{animation-play-state:paused!important}
