.studio-hero{flex-direction:column;display:flex}.studio-hero-top{order:0}.data-flow{order:1}.flow-hero-grid{order:2}.studio-hero-bottom{order:3}.data-flow{height:300px;animation:data-flow-in .9s var(--studio-ease)both;margin-top:28px;position:relative}.data-flow-scene{position:absolute;inset:0}.data-flow-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.data-flow-mark{width:148px;height:148px;animation:data-flow-mark .7s var(--studio-spring).15s both;background:linear-gradient(145deg,#fff 0%,#eef3f8 100%);border:1px solid #ffffffe6;border-radius:30px;place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)perspective(700px)rotateY(-14deg)rotateX(4deg);box-shadow:inset 0 1px #ffffffe6,inset 0 -10px 24px #0b5cab0f,0 30px 60px -24px #152a3b59,0 0 0 1px #152a3b0f,0 0 80px #0b5cab1f}.data-flow-mark img{width:84px;height:auto}.data-flow-tag{letter-spacing:.14em;color:var(--studio-muted);font-size:9px;font-weight:500;position:absolute;top:6px}.tag-before{left:0}.tag-after{color:var(--studio-blue);right:0}.data-flow-pause{letter-spacing:.06em;color:var(--studio-muted);cursor:pointer;text-underline-offset:3px;background:0 0;border:0;padding:6px 0;font-size:10px;text-decoration:underline;position:absolute;bottom:0;right:0}.data-flow-pause:focus-visible{outline:2px solid var(--studio-blue);outline-offset:3px}.flow-hero-grid{grid-template-columns:1.15fr 1fr;align-items:end;gap:48px;padding-block:36px 56px;display:grid}.flow-hero-grid .studio-hero-copy{padding-block:0}.flow-hero-side .studio-hero-description{margin-top:0}@keyframes data-flow-in{0%{opacity:0}}@keyframes data-flow-mark{0%{opacity:0;transform:translate(-50%,-50%)perspective(700px)rotateY(-14deg)rotateX(4deg)scale(.92)}}@media (max-width:760px){.flow-hero-grid{order:1}.data-flow{order:2;height:400px;margin:0 0 28px}.data-flow-mark{border-radius:22px;width:104px;height:104px;animation-name:data-flow-mark-sm;transform:translate(-50%,-50%)perspective(600px)rotateX(10deg)}.data-flow-mark img{width:60px}.tag-after{inset:auto auto 6px 0}.flow-hero-grid{grid-template-columns:1fr;gap:22px;padding-block:24px 36px}@keyframes data-flow-mark-sm{0%{opacity:0;transform:translate(-50%,-50%)perspective(600px)rotateX(10deg)scale(.92)}}}@media (prefers-reduced-motion:reduce){.data-flow,.data-flow-mark{animation:none}}