@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600&display=swap');
/* Agentic Growth OS flow for the homepage (generated by ops/sync-ago.py). */
.a-flow { background: #FBFCFD; color: var(--merlot); border-radius: 20px; padding: 22px 22px 10px; box-shadow: 0 50px 100px -40px rgb(0 0 0 / .6); }
.fl-heads { display: grid; grid-template-columns: 25% 25% 25% 25%; font: 600 11px/1 Archivo, "Archivo Fallback", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: rgb(158 68 51 / .55); padding: 0 6px 8px; }
.fl-heads span:nth-child(2) { text-align: center; } .fl-heads span:nth-child(4) { text-align: right; }
.fl-stage svg { display: block; width: 100%; height: auto; overflow: visible; }
.fl-node > rect { fill: #fff; stroke: rgb(158 68 51 / .1); }
.fl-node text { font: 500 14px Archivo, "Archivo Fallback", sans-serif; fill: var(--merlot); }
.fl-node text.tag { font: 400 11px Archivo, "Archivo Fallback", sans-serif; fill: rgb(158 68 51 / .5); }
.fl-out > rect { stroke: none; }
.fl-out text { font: 500 14px Archivo, "Archivo Fallback", sans-serif; fill: var(--merlot); }
.fl-gate rect { fill: #F6EDD7; stroke: var(--merlot); stroke-width: 1.2; }
.fl-gate text { font: 600 12px Archivo, "Archivo Fallback", sans-serif; fill: var(--merlot); }
.fl-dest > rect { fill: #fff; stroke: rgb(158 68 51 / .1); }
.fl-dest text { font: 500 13px Archivo, "Archivo Fallback", sans-serif; fill: var(--merlot); }
.fl-dest text.tag { font: 400 10.5px Archivo, "Archivo Fallback", sans-serif; fill: rgb(158 68 51 / .5); }
.fl-path { fill: none; stroke: rgb(158 68 51 / .12); stroke-width: 1.5; }
.fl-return { fill: none; stroke: rgb(158 68 51 / .22); stroke-width: 1.5; stroke-dasharray: 4 5; }
.fl-return-lbl { font: 500 11px Archivo, "Archivo Fallback", sans-serif; fill: rgb(158 68 51 / .55); letter-spacing: .06em; text-transform: uppercase; }
.fl-dot { fill: var(--merlot); }
.fl-dot.o { fill: #D8A38F; }
.fl-hub text { font: 400 12px Archivo, "Archivo Fallback", sans-serif; fill: rgb(158 68 51 / .6); }
@media (max-width: 700px) { .fl-heads { display: none; } .a-flow { padding: 14px 10px 6px; } }
.fl-group { font: 600 9px Archivo, "Archivo Fallback", sans-serif; letter-spacing: .1em; }
.fl-node.g-store text { fill: #FDF3E4; }
#mod-flow.a-flow { background: transparent; box-shadow: none; border-radius: 0; padding: 0; }
#mod-flow .fl-heads { color: rgb(253 243 228 / .78); }
#mod-flow .fl-path { stroke: rgb(253 243 228 / .28); }
#mod-flow .fl-dot { fill: #FDF3E4; }
#mod-flow .fl-dot.o { fill: #D8A38F; }
#mod-flow .fl-hub text { fill: rgb(253 243 228 / .8); }
#mod-flow .fl-hub-c { stroke: rgb(253 243 228 / .45); stroke-width: 1.5; }
#mod-flow .fl-node.g-store rect:first-child { stroke: rgb(253 243 228 / .35) !important; stroke-width: 1; }
.fl-hub text.fl-hub-name, #mod-flow .fl-hub text.fl-hub-name { font: 600 12px Archivo, "Archivo Fallback", sans-serif; letter-spacing: .12em; fill: #FDF3E4; }
#mod-flow .fl-heads { display: none; }
.fl-pill rect { fill: rgb(253 243 228 / .1); stroke: rgb(253 243 228 / .38); stroke-width: 1; }
.fl-pill text { font: 600 10.5px Archivo, "Archivo Fallback", sans-serif; letter-spacing: .1em; fill: #FDF3E4; }
.fl-out text.tag { font: 400 12px Archivo, "Archivo Fallback", sans-serif; fill: rgb(158 68 51 / .62); }
.fl-pill text { letter-spacing: .14em; } .fl-cad { font: 600 9.5px "IBM Plex Mono", ui-monospace, monospace; letter-spacing: .08em; fill: rgb(158 68 51 / .5); }
.fl-tpill rect { fill: rgb(255 255 255 / .7); stroke: rgb(158 68 51 / .14); stroke-width: 1; } .fl-tpill text { font: 600 10px "IBM Plex Mono", ui-monospace, monospace; fill: #9E4433; }
.fl-sample { font: 400 11px Archivo, "Archivo Fallback", sans-serif; fill: rgb(253 243 228 / .6); }
.fl-sample-bg { fill: #9E4433; }
.fl-pre .fl-hub, .fl-pre .fl-node, .fl-pre .fl-out, .fl-pre .fl-gate, .fl-pre .fl-dest, .fl-pre .fl-pill, .fl-pre .fl-sample, .fl-pre .fl-sample-bg, .fl-pre .fl-path { opacity: 0; }
.fl-cap { font: 600 9.5px Archivo, "Archivo Fallback", sans-serif; letter-spacing: .12em; fill: rgb(253 243 228 / .72); }
.fl-hub-ring { fill: none; stroke: rgb(253 243 228 / .55); stroke-width: 1.5; opacity: 0; }
.fl-dot { will-change: transform; }
.ago-home .ago-home-sub { max-width: 60ch; margin-inline: auto; }
.ago-home .a-flow { width: 100%; }

/* this flow sits on merlot and its client marks are ice-white artwork, so the cards are dark, not white */
/* solid like the Paid card, so the flow lines do not show through (Aman 2026-10-09) */
#mod-flow .fl-dest > rect { fill: #9E4433; stroke: rgb(253 243 228 / .35); stroke-width: 1; }
#mod-flow .fl-dest text { fill: #FDF3E4; }
#mod-flow .fl-node.g-paid rect:first-child { stroke: rgb(253 243 228 / .35) !important; stroke-width: 1; }
#mod-flow .fl-gate rect { fill: #F6EDD7; stroke: none; }
/* the fourth column ships deliverables, drawn as icons - the marks left with it */
#mod-flow .fl-dest g[transform] { pointer-events: none; }
