.studio-intro{grid-template-columns:1fr 1.2fr;gap:28px}.studio-illustration.biz-flow{display:block;overflow:visible;min-height:0;background:radial-gradient(ellipse at center,#246b8233,transparent 75%);padding:16px;border:1px solid #29475f;border-radius:20px;background-color:#0b1b28}
.flow-caption{display:flex;justify-content:space-between;align-items:center;gap:10px}.flow-caption>span{font-size:9px;font-weight:700;letter-spacing:.14em;color:#7cdbc9}.flow-caption small{font-size:8px;color:#789ab4}
.flow-map{position:relative;height:290px;margin:13px 0}.studio-dashboard svg.flow-wires{position:absolute;width:100%;height:100%;inset:0;overflow:visible;pointer-events:none}.flow-wire-base{stroke:#284b63;stroke-width:2;fill:none}.flow-wire-pulse{stroke:url(#bizWireGradient);stroke-width:3;fill:none;stroke-dasharray:16 84;stroke-linecap:round;animation:biz-current 3s linear infinite;animation-delay:var(--wire-delay);filter:drop-shadow(0 0 4px #55d9d6)}
.flow-node{position:absolute;width:30%;height:110px;display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #3c5f7a;border-radius:13px;background:linear-gradient(140deg,#192e46,#102637);box-shadow:0 8px 20px #0002;text-align:center;padding:8px 4px;z-index:1}.flow-source{top:2%;left:0}.flow-message{bottom:2%;left:0;border-color:#2d6e63;background:linear-gradient(140deg,#183a37,#10282e)}.flow-response{top:2%;right:0;border-color:#386d82;background:linear-gradient(140deg,#19374b,#102a34)}.flow-order{bottom:2%;right:0;border-color:#72634c;background:linear-gradient(140deg,#303338,#172634)}
.flow-node-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:8px;background:#638bce24;color:#9daaff;margin-bottom:7px}.flow-message .flow-node-icon{color:#6be1b9;background:#40b98d20}.flow-response .flow-node-icon{color:#72d9eb;background:#36acc620}.flow-order .flow-node-icon{color:#eac987;background:#c39b5320}.flow-node-icon svg{width:16px;height:16px}.flow-node b{font-size:10px;font-weight:600;line-height:1.6}.flow-node small{font-size:8px;line-height:1.8;color:#8daec7;margin-top:3px}.flow-node>i{font-size:6px;font-style:normal;color:#6687a0;letter-spacing:.08em;margin-top:6px}
.flow-engine{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:25%;height:132px;display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px solid #6994c9;border-radius:20px;background:linear-gradient(140deg,#354c83,#124b53);box-shadow:0 0 35px #5b9cec29;z-index:2;animation:biz-engine-glow 4s ease-in-out infinite}.flow-engine>span svg{width:23px;height:23px;color:#83edd9}.flow-engine>b{font-size:17px;letter-spacing:.02em;margin-top:5px}.flow-engine>small{color:#a5c9dd;font-size:8px;line-height:1.8;text-align:center;margin-top:4px}.flow-engine-dots{display:flex;gap:4px;margin-top:9px}.flow-engine-dots i{width:3px;height:3px;border-radius:50%;background:#91ecdf;animation:biz-flow-dot 1.5s infinite}.flow-engine-dots i:nth-child(2){animation-delay:.2s}.flow-engine-dots i:nth-child(3){animation-delay:.4s}
.flow-details{border-top:1px solid #29465b}.flow-details summary{list-style:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:10px;color:#a2cbd9;padding:12px 0 0}.flow-details summary::-webkit-details-marker{display:none}.flow-details summary span{font-size:16px;color:#75d5c2}.flow-details[open] summary span{transform:rotate(45deg)}.flow-details ol{padding-left:20px;margin:17px 0 12px}.flow-details li{font-size:10px;color:#90adc5;line-height:1.9;padding:0 0 12px 5px}.flow-details li::marker{color:#72cbbb}.flow-details li b{display:block;color:#b6d4e5;font-size:11px;font-weight:550}.flow-details>p{font-size:8px;color:#698da5;line-height:1.8;margin:0}.flow-details summary:focus-visible{outline:2px solid #7ce4d1;outline-offset:3px}
@keyframes biz-current{to{stroke-dashoffset:-100}}@keyframes biz-engine-glow{50%{box-shadow:0 0 45px #58ccc94d;border-color:#8ce9db}}@keyframes biz-flow-dot{50%{opacity:.3;transform:translateY(-2px)}}
.customer-motion-off .flow-wire-pulse,.customer-motion-off .flow-engine,.customer-motion-off .flow-engine-dots i{animation:none}.customer-motion-off .flow-wire-pulse{stroke-dasharray:none;opacity:.7}
@media(max-width:1100px){.studio-intro{grid-template-columns:1fr;gap:24px}.studio-illustration.biz-flow{max-width:650px;width:100%;justify-self:center}.flow-map{height:300px}.flow-node{height:116px}.flow-node b{font-size:12px}.flow-node small{font-size:9px}.flow-engine>b{font-size:20px}}
@media(max-width:580px){.studio-intro{display:flex;gap:16px}.studio-illustration.biz-flow{padding:12px;margin-top:5px}.flow-caption{gap:5px}.flow-caption>span{font-size:8px}.flow-caption small{font-size:7px}.flow-map{height:264px;margin:12px 0}.flow-node{height:100px;border-radius:11px}.flow-node b{font-size:9px}.flow-node small{font-size:7px}.flow-node>i{font-size:5px}.flow-engine{height:116px;border-radius:16px}.flow-engine>b{font-size:14px}.flow-engine>small{font-size:7px}.flow-node-icon{width:25px;height:25px;margin-bottom:5px}.flow-node-icon svg{width:15px;height:15px}}
@media(prefers-reduced-motion:reduce){body:not(.customer-motion-on) .flow-wire-pulse,body:not(.customer-motion-on) .flow-engine,body:not(.customer-motion-on) .flow-engine-dots i{animation:none}}
.studio-illustration.biz-flow>.flow-map,.studio-illustration.biz-flow>.flow-caption,.studio-illustration.biz-flow>.flow-details{width:100%;min-width:0}.studio-illustration.biz-flow{display:block!important}