/* Original illustrative workflows in the DotConn visual system. */
.ai-workflow{padding:0;overflow:hidden;background:transparent;border:0;--workflow-duration:5s}
.ai-workflow-steps{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}
.ai-workflow-steps button{display:flex;align-items:center;gap:10px;padding:11px 16px;border:1px solid var(--line);border-radius:30px;color:var(--muted);background:#ffffff03;font-size:13px;line-height:24px}
.ai-workflow-steps button[aria-pressed="true"]{color:var(--ink);border-color:#f8b41460;background:#ffffff08}
.ai-workflow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ai-workflow-card{position:relative;min-width:0;border:1px solid var(--line);border-radius:16px;padding:26px 22px;background:var(--surface);overflow:hidden;transition:border-color .25s ease,box-shadow .25s ease}
.ai-workflow-card.is-active{border-color:#f8b41465;box-shadow:inset 0 1px #f8b41424,0 0 30px #f8b41406}
.ai-workflow-card:after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--yellow);transform:scaleX(0);transform-origin:left}
.ai-workflow-card.is-active:after{animation:workflow-progress var(--workflow-duration) linear forwards}
.ai-workflow.is-paused .ai-workflow-card:after,.ai-workflow:hover .ai-workflow-card:after,.ai-workflow:focus-within .ai-workflow-card:after{animation-play-state:paused}
.workflow-label{font-size:11px;color:var(--yellow);margin:0 0 15px}
.ai-workflow-card h3{font-size:23px;line-height:1.25;letter-spacing:-.6px;min-height:58px;margin:0 0 24px}
.knowledge-map{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;min-height:155px;align-items:start;padding:12px 0 45px;background:radial-gradient(ellipse at 50% 90%,#f8b4140a,transparent 70%)}
.knowledge-map>span{display:grid;justify-items:center;gap:10px;position:relative}
.knowledge-map>span:after{content:"";position:absolute;top:60px;height:28px;width:1px;background:linear-gradient(#ffffff45,transparent)}
.knowledge-map small{font-size:10px;color:var(--muted)}
.knowledge-map>strong{position:absolute;bottom:6px;left:calc(50% - 23px);display:grid;place-items:center;width:46px;height:46px;border:1px solid #f8b41435;border-radius:13px;background:#ffffff07}
.ai-workflow .ai-source{margin:18px 0 0;padding:16px 0 0;display:grid;grid-template-columns:24px 1fr;column-gap:10px;background:transparent;border:0}
.ai-workflow .ai-source>span{font-size:12px}.ai-workflow .ai-source>small{grid-column:2;font-size:10px}
.ai-workflow .ai-queries{display:flex;flex-wrap:wrap;padding:0;margin:0 0 24px;gap:8px}
.ai-workflow .ai-queries button{font-size:11px;padding:7px 10px;background:transparent;border:1px solid var(--line);border-radius:20px;color:var(--muted)}
.ai-workflow .ai-queries button[aria-pressed="true"]{color:var(--yellow);border-color:#f8b41450}
.workflow-question{display:flex;align-items:flex-start;gap:12px;padding:18px 15px;background:#ffffff04;border:1px solid var(--line);border-radius:12px;min-height:90px}
.workflow-question-copy{font-size:14px;line-height:1.6;color:var(--ink);margin:0}
.question-indicator{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--yellow);margin-top:8px}
.workflow-explainer{font-size:12px;line-height:1.7;margin:20px 0 0}
.ai-workflow .ai-response{margin:0;padding:0;border:0;min-height:180px}
.ai-workflow .query-text{display:none}.ai-workflow .status{font-size:13px;line-height:1.5;display:block;margin-bottom:16px}
.ai-workflow .response-text{font-size:13px;line-height:1.75;margin-bottom:16px}
.ai-workflow .response-source{font-size:10px;line-height:1.6;display:block;color:var(--soft)}
.workflow-checks{display:grid;gap:12px;margin-top:20px}.workflow-checks>span{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted)}
.workflow-playback{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px}.workflow-playback .caption{margin:0}
.workflow-pause{background:transparent;border:1px solid var(--line);border-radius:20px;color:var(--muted);font-size:11px;padding:8px 14px;white-space:nowrap}
.ops-demo{scroll-margin-top:112px}.ops-visual{padding:20px 28px 32px}.ops-hub{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:14px;width:120px;height:120px;font-size:12px;line-height:18px;color:var(--ink);margin:0 auto 40px;border:1px solid #ffffff24;border-radius:26px;background:linear-gradient(145deg,#222,#141414);box-shadow:inset 0 1px #ffffff12,0 0 25px #f8b4140d;position:relative;z-index:3}.ops-hub>span{max-width:90px;text-align:center}
.ops-network{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ops-node{display:grid;justify-items:center;text-align:center;gap:12px;padding:24px 12px;border:1px solid var(--line);border-radius:12px;background:#ffffff02;position:relative}
.ops-node:before{content:"";position:absolute;top:-18px;height:18px;width:1px;background:#ffffff35}
.ops-node strong{font-size:13px;font-weight:500}.ops-node small{font-size:10px;color:var(--soft)}
.ops-node[hidden]{display:none}.ops-node.is-reviewing{border-color:#f8b41460;background:#ffffff06}
.ops-motion{font:500 11px/20px Helvetica,Arial,sans-serif;min-height:36px;padding:7px 13px;border:1px solid #ffffff24;border-radius:999px;color:var(--ink);background:#ffffff06;margin:0 28px 24px;cursor:pointer}.ops-motion:hover,.ops-motion:focus-visible{border-color:#ffffff60;background:#ffffff0d}.ops-motion:disabled{color:var(--muted);cursor:default}
.release-stages{gap:8px}.release-stages button{position:relative;flex-direction:column;padding:18px 8px;gap:12px;border-radius:12px;min-width:0;transition:border-color .2s ease,background .2s ease}
.release-stages button[aria-pressed="true"]{background:#ffffff08;border-color:#f8b41465;box-shadow:0 0 20px #f8b41408}
.release-evidence{min-height:270px}
@keyframes workflow-progress{to{transform:scaleX(1)}}
@media(max-width:950px){.ai-workflow-grid{grid-template-columns:1fr}.ai-workflow-card h3{min-height:0}.knowledge-map{max-width:360px;margin:auto}.ai-workflow .ai-response{min-height:0}.ops-network{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-playback{align-items:flex-start}}
@media(max-width:560px){.ai-workflow-steps{gap:8px}.ai-workflow-steps button{font-size:11px;padding:8px 11px}.ai-workflow-card{padding:24px 20px}.workflow-playback{flex-direction:column;gap:12px}.ops-visual{padding:8px 18px 24px}.ops-network{gap:12px}.ops-node{padding:20px 10px}.release-stages button{font-size:10px;gap:8px}.release-evidence{min-height:300px}}
@media(prefers-reduced-motion:reduce){.ai-workflow-card,.release-stages button{transition:none}.ai-workflow-card:after{animation:none!important}.ai-workflow-card.is-active:after{transform:scaleX(1)}}
/* Flowing signals connect the existing illustrations without changing content. */
.ai-workflow-grid,.ops-visual,.release-stages{position:relative;isolation:isolate}
.flow-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2;fill:none}
.flow-route{stroke:#f8b41422;stroke-width:1;vector-effect:non-scaling-stroke}
.flow-pulse{stroke:#f8b414;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:5 22;opacity:.6;vector-effect:non-scaling-stroke;animation:connection-flow 3s linear infinite;animation-play-state:paused;filter:drop-shadow(0 0 3px #f8b41480)}
.flow-visible>.flow-connections .flow-pulse{animation-play-state:running}
.ai-workflow:hover .flow-pulse,.ai-workflow:focus-within .flow-pulse,.ai-workflow.is-paused .flow-pulse,.ops-demo:hover .flow-pulse,.ops-demo:focus-within .flow-pulse,.release-demo:hover .flow-pulse,.release-demo:focus-within .flow-pulse{animation-play-state:paused}
.knowledge-map>span:after,.ops-node:before{display:none}
/* A signal travels down each source into the AI core. */
.knowledge-map>span{--source-time:2.6s}
.knowledge-map>span:after{display:block;top:58px;height:35px;width:1px;background:linear-gradient(transparent,#ffffffa0,transparent);background-size:100% 55%;background-repeat:no-repeat;animation:source-flow 2.6s linear infinite}
.knowledge-map>span:nth-child(2):after{animation-delay:-.85s}.knowledge-map>span:nth-child(3):after{animation-delay:-1.7s}
.ai-workflow.is-paused .knowledge-map>span:after{animation-play-state:paused}
@keyframes connection-flow{to{stroke-dashoffset:-108}}
@keyframes source-flow{from{background-position:0 -40px}to{background-position:0 45px}}
@media(prefers-reduced-motion:reduce){.flow-pulse,.knowledge-map>span:after{animation:none!important}.flow-pulse{stroke-dasharray:none;opacity:.25}}
/* Keep routes clear of captions and stop unsupported-source signals. */
.knowledge-map{position:relative;isolation:isolate}
.knowledge-map>span:after{display:none}
.flow-no-source .flow-pulse{animation:none!important;opacity:.12}
.knowledge-map .flow-connections{z-index:0}
.knowledge-map>span,.knowledge-map>strong{z-index:1}