.flow-section{padding:88px 0;background:radial-gradient(ellipse at 50% 60%,#24204466,transparent 68%),#0b0d26}
.flow-intro{text-align:center;max-width:680px;margin:0 auto 34px}.flow-intro h2{font-size:clamp(32px,4vw,48px);line-height:1.12;letter-spacing:-.04em;margin:14px 0 20px}.flow-intro h2 span{color:var(--purple)}.flow-intro>p:last-child{color:var(--muted);line-height:1.7}
.flow-demo{font:12px/1.5 Arial,Helvetica,sans-serif;max-width:920px;margin-inline:auto;border:1px solid #434653;border-radius:12px;overflow:hidden;background:#0e1624;color:#e5eaf5;box-shadow:0 28px 80px #0005,0 0 0 1px #ffffff06;text-align:left;isolation:isolate}.flow-demo *{box-sizing:border-box}.flow-demo p,.flow-demo button,.flow-demo small{font-family:inherit}.flow-demo svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;flex-shrink:0}
.flow-browser{position:relative;height:36px;display:flex;align-items:center;justify-content:center;padding-inline:16px;background:linear-gradient(#343740,#292c34);border-bottom:1px solid #080b13;box-shadow:inset 0 1px #ffffff12}.flow-traffic{position:absolute;left:15px;display:flex;gap:6px}.flow-traffic i{width:10px;height:10px;border-radius:50%;background:#ff5e57;box-shadow:inset 0 0 0 1px #0002}.flow-traffic i:nth-child(2){background:#febc2e}.flow-traffic i:nth-child(3){background:#28c840}.flow-address{width:46%;max-width:410px;height:23px;display:flex;align-items:center;justify-content:center;gap:6px;background:#1c1f27;border:1px solid #ffffff07;border-radius:5px;color:#bfc2cc;font-size:10px}.flow-address svg{width:10px;height:10px}
.flow-appbar{height:42px;padding:0 25px;display:flex;align-items:center;gap:20px;background:#192438;border-bottom:1px solid #344157;font-size:10px;color:#aab8d0}.flow-brand{display:flex;gap:6px;align-items:center;color:#e5eaf5}.flow-brand strong{font-size:16px;letter-spacing:-.5px}.flow-appbar>[data-flow-location]{border-left:1px solid #415068;padding-left:18px}.flow-avatar{margin-left:auto;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#37304f;color:#d5cbff;font-size:8px}
.flow-stage{position:relative;height:400px;overflow:hidden}.flow-scene{position:absolute;inset:0;padding:25px 30px;overflow:auto;scrollbar-width:thin;scrollbar-color:#42506a transparent}.flow-scene[hidden]{display:none}.flow-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px}.flow-heading h3{font-size:20px;letter-spacing:-.5px;line-height:1.3;margin:0 0 5px}.flow-heading p{font-size:11px;line-height:1.6;color:#98a9c2;margin:0}.flow-tag{font-size:9px;color:#c7bbff;background:#a698ff13;padding:5px 8px;border:1px solid #a698ff24;border-radius:5px;white-space:nowrap}.flow-tag-green{color:#7dd3b9;background:#4fbe9d12;border-color:#4fbe9d25}
.flow-profile-card{border:1px solid #35445e;background:#192438;padding:13px 16px;border-radius:8px;display:flex;align-items:center;gap:13px;margin-bottom:20px}.flow-profile-icon{height:37px;width:37px;display:grid;place-items:center;border-radius:9px;background:#a698ff19;color:#c8bdff;font-size:13px}.flow-profile-card>div:nth-child(2){display:grid;gap:3px}.flow-profile-card small{font-size:8px;letter-spacing:1px;color:#8d9fbd}.flow-profile-card strong{font-size:13px;font-weight:500}.flow-profile-card div>span{font-size:10px;color:#99abc5}.flow-profile-check{margin-left:auto;width:20px;height:20px;border-radius:50%;background:#6f5dc3;color:white;display:grid;place-items:center;font-size:10px}.flow-field-label{font-size:10px;color:#afbed5;margin-bottom:7px}.flow-search{display:flex;align-items:center;padding:13px 14px;border:1px solid #7665bd;background:#121d2e;border-radius:7px;gap:10px;height:44px;font-size:13px}.flow-search svg{color:#91a3c0}.flow-caret{width:1px;height:14px;background:#ad9cff;display:none}.flow-filters{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 20px}.flow-filters span{font-size:9px;padding:5px 8px;border:1px solid #35425c;background:#172236;border-radius:5px;color:#b4c2d9}.flow-search-footer{display:flex;align-items:center;justify-content:space-between;gap:14px}.flow-search-footer>span:first-child{font-size:10px;color:#8c9fba}.flow-action{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:14px;padding:10px 14px;background:#7561d9;border:1px solid #9b83f033;border-radius:6px;font-size:10px;color:white;font-weight:500;white-space:nowrap}.flow-action svg:not(.flow-pointer){width:13px;height:13px}.flow-search-hint{margin-top:14px;display:flex;align-items:center;gap:8px;font-size:10px;color:#c0b3ff;opacity:0}.flow-mini-spinner{display:inline-block;width:12px;height:12px;border:1px solid #bba7ff33;border-top-color:#bba7ff;border-radius:50%}
.flow-result{border:1px solid #34415a;background:#192437;border-radius:8px;padding:18px 20px}.flow-result-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;color:#96a9c6}.flow-badges{display:flex;gap:6px}.flow-badges>span{padding:3px 6px;font-size:8px;background:#6086d71c;color:#b4c8ff;border-radius:4px}.flow-badges>span:first-child{background:#43bfa219;color:#84d8c0}.flow-label{display:block;font-size:8px;letter-spacing:.7px;color:#9caeca;margin:16px 0 5px}.flow-result h4{font-size:16px;margin:0 0 7px;line-height:1.4}.flow-result>p{color:#9eafc7;font-size:10px;margin:0;line-height:1.65}.flow-facts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:16px 0;padding:14px 0;border-block:1px solid #ffffff12}.flow-facts small{display:block;font-size:8px;letter-spacing:.5px;color:#8fa1bc;margin-bottom:6px}.flow-facts strong{font-size:17px;color:#e4eaf6;letter-spacing:-.3px}.flow-result-actions{display:flex;align-items:center;gap:20px}.flow-result-actions>span:last-child{font-size:10px;color:#bbabff}.flow-demo .flow-pointer{position:absolute;width:21px;height:25px;stroke:#0d1320;stroke-width:1.2;fill:#fafbff;filter:drop-shadow(0 2px 2px #0004);right:4px;bottom:-14px;opacity:0}.flow-toast{position:absolute;bottom:17px;right:30px;display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid #4aab8b44;border-radius:7px;background:#17352f;color:#b7edd9;font-size:10px;opacity:0;transform:translateY(6px)}.flow-toast>span{color:#79d8b0}
.flow-board{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;height:262px}.flow-column{min-width:0;background:#19263a;border:1px solid #34445e;padding:12px;border-radius:8px}.flow-column>h4{font-size:10px;display:flex;align-items:center;gap:7px;margin:0 0 13px;white-space:nowrap}.flow-column h4 i{width:5px;height:5px;border-radius:50%;background:#a8a9b9}.flow-column:nth-child(2) h4 i{background:#83abe8}.flow-column:nth-child(3) h4 i{background:#c1a4e8}.flow-column h4 small{margin-left:auto;padding:1px 5px;background:#ffffff0d;color:#bac7dd;border-radius:3px;font-size:8px}.flow-drop-slot{height:191px;border:1px dashed #40506a;border-radius:6px;opacity:.25}.flow-board-card{position:absolute;left:9px;top:42px;width:calc((100% - 24px)/3 - 18px);padding:13px;background:#152033;border:1px solid #4b5d7a;border-radius:7px;box-shadow:0 5px 16px #0002;z-index:2;transition:transform 1.2s cubic-bezier(.22,.8,.25,1),box-shadow .3s,border-color .3s}.flow-card-top{display:flex;justify-content:space-between;align-items:center;font-size:8px;color:#c1b9ec}.flow-card-top svg{height:14px;width:12px;stroke-width:3px;stroke-linecap:round;color:#899bb9}.flow-board-card h4{font-size:12px;line-height:1.5;margin:11px 0}.flow-board-card>strong{font-size:14px}.flow-board-card>p{font-size:9px;color:#a4b5cf;margin:6px 0 12px}.flow-card-task{font-size:9px;border-left:2px solid #9577ef;padding-left:7px;color:#c1cde0;margin-bottom:12px}.flow-card-footer{display:flex;gap:6px;align-items:center;padding-top:9px;border-top:1px solid #ffffff12}.flow-card-footer>span{display:grid;place-items:center;width:18px;height:18px;background:#393051;border-radius:50%;font-size:6px;color:#dbd0ff}.flow-card-footer small{font-size:8px;color:#a1b1c9}.flow-demo .flow-drag-pointer{top:20px;right:9px;bottom:auto}.flow-board-confirm{font-size:10px;margin-top:14px;color:#8cd8bc;opacity:0}
.flow-analysis{position:relative;padding:18px 20px;border:1px solid #3b4564;border-radius:8px;background:#192437;min-height:285px}.flow-analysis-top{display:flex;justify-content:space-between;align-items:center;color:#c7b8ff;font-size:12px;font-weight:600;margin-bottom:13px}.flow-analysis-top small{color:#8fa1ba;font-size:8px;font-weight:400}.flow-analysis-body>p{font-size:12px;line-height:1.7;color:#b7c5d9;margin:0}.flow-analysis .flow-facts{padding:12px 0;margin:12px 0}.flow-analysis-points h4{font-size:11px;margin:0 0 8px}.flow-analysis-points p{font-size:10px;color:#b6c3d7;margin:5px 0;line-height:1.6}.flow-analysis-points p>span{color:#9786c9;font-size:8px;margin-right:5px}.flow-analysis-note{display:block;color:#8b9db8;font-size:8px;margin-top:12px}.flow-analysis-loading{display:none;color:#a99dc9;font-size:11px;padding-top:8px}.flow-analysis-loading>.flow-mini-spinner{margin-right:6px}.flow-skeleton{height:9px;background:linear-gradient(90deg,#27334a,#394360,#27334a);background-size:200% 100%;margin-top:17px;border-radius:4px;max-width:95%}.flow-skeleton:nth-last-child(2){max-width:88%}.flow-skeleton:last-child{max-width:64%}
.flow-doc-stats{display:flex;gap:10px;margin-bottom:16px}.flow-doc-stats>div{display:flex;align-items:center;gap:6px;flex:1;min-width:0;border:1px solid #34415a;border-radius:6px;padding:10px 13px;background:#162132;font-size:10px;color:#a8b8ce}.flow-doc-stats i{width:5px;height:5px;background:#67cbaa;border-radius:50%}.flow-doc-stats>div:nth-child(2) i{background:#e5b857}.flow-doc-stats>div:nth-child(3) i{background:#d77782}.flow-doc-stats strong{margin-left:auto;font-size:15px;color:#dbe4f3}.flow-documents{border:1px solid #34415a;border-radius:8px;background:#192437;overflow:hidden}.flow-doc-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid #ffffff0c}.flow-doc-row:last-child{border-bottom:0}.flow-doc-icon{color:#b1a0ed;font-size:19px}.flow-doc-row>div{flex:1;min-width:0}.flow-doc-row strong{display:block;font-size:11px;font-weight:500;margin-bottom:2px}.flow-doc-row small{font-size:9px;color:#8fa3bf}.flow-status{padding:3px 7px;font-size:8px;border-radius:4px;white-space:nowrap}.flow-status-green{background:#51bd9e15;color:#8ad9b8}.flow-status-amber{background:#b88e2e20;color:#e5bf78}.flow-status-red{background:#bc526220;color:#e69aa5}.flow-validity{height:2px;background:#ffffff08;display:block;margin-top:6px;width:70%}.flow-validity i{display:block;width:var(--validity);height:100%;background:#68cba7;transform-origin:left}.flow-doc-row:nth-child(2) .flow-validity i{background:#d3ae64}.flow-doc-row:nth-child(3) .flow-validity i{background:#c87985}.flow-doc-alert{display:flex;gap:9px;align-items:center;border:1px solid #b88e2e30;border-radius:6px;background:#b88e2e0a;color:#d3b67d;padding:11px 13px;margin-top:14px;opacity:0;transform:translateY(5px)}.flow-doc-alert>span:first-child{font-size:20px}.flow-doc-alert strong{font-weight:500;font-size:10px}.flow-doc-alert p{font-size:9px;color:#ae9c81;margin:2px 0 0}.flow-doc-alert .flow-tag{margin-left:auto;color:#d6b783;background:#bb96311a;border-color:#bb963130}
.flow-controls{height:55px;position:relative;border-top:1px solid #ffffff0b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:#0c1421}.flow-controls>div{display:flex;align-items:center;justify-content:center}.flow-controls button{font:inherit;border:0;background:transparent;color:#9ba8bd;cursor:pointer;padding:0}.flow-controls [data-flow-step]{width:25px;height:23px;display:grid;place-items:center;border-radius:6px}.flow-controls [data-flow-step]>span{width:5px;height:5px;border-radius:50%;background:#46546d;transition:background .25s,transform .25s}.flow-controls [aria-pressed=true]>span{background:#b39bff;transform:scale(1.4)}.flow-caption{font-size:9px;color:#95a3ba}.flow-controls [data-flow-pause]{position:absolute;right:18px;top:17px;width:23px;height:23px;display:grid;place-items:center;border-radius:5px}.flow-controls [data-flow-pause][hidden]{display:none}.flow-controls button:focus-visible{outline:2px solid #b49aff;outline-offset:2px}.flow-controls svg{height:12px;width:12px}
/* Ações dentro de cada tela; somente a moldura permanece imóvel. */
.flow-demo.is-animated .flow-scene{animation:flow-scene-in .32s ease both}.flow-demo.is-animated .flow-caret{display:block;animation:flow-caret .8s steps(1) infinite}.flow-demo.is-animated .flow-mini-spinner{animation:flow-spin .8s linear infinite}.flow-demo.is-animated .flow-skeleton{animation:flow-shimmer 1.6s linear infinite}.flow-demo:not(.is-playing) *{animation-play-state:paused!important}.flow-demo.is-animated .flow-search-hint,.flow-demo.is-animated .flow-toast,.flow-demo.is-animated .flow-board-confirm,.flow-demo.is-animated .flow-doc-alert{transition:opacity .4s,transform .4s}.flow-demo[data-phase="2"] .flow-search-submit{background:#9280ed;transform:scale(.98)}.flow-demo[data-phase="3"] .flow-search-hint{opacity:1}.flow-demo[data-phase="1"] .flow-add-action .flow-pointer{opacity:1;transform:translate(8px,6px)}.flow-demo[data-phase="2"] .flow-add-action,.flow-demo[data-phase="3"] .flow-add-action{background:#267760;border-color:#5db99533}.flow-demo[data-phase="2"] .flow-toast,.flow-demo[data-phase="3"] .flow-toast{opacity:1;transform:none}.flow-demo[data-phase="1"] .flow-drag-pointer,.flow-demo[data-phase="2"] .flow-drag-pointer{opacity:1}.flow-demo[data-phase="1"] .flow-board-card{box-shadow:0 10px 22px #0004;border-color:#b39bff}.flow-demo[data-phase="2"] .flow-board-card,.flow-demo[data-phase="3"] .flow-board-card{transform:translateX(calc(100% + 30px))}.flow-demo[data-phase="2"] .flow-target-slot,.flow-demo[data-phase="3"] .flow-target-slot{border-color:#b39bff;opacity:.7;background:#a698ff08}.flow-demo[data-phase="3"] .flow-board-confirm{opacity:1}.flow-demo[data-phase="0"] [data-flow-scene="3"] .flow-analysis-loading{display:block}.flow-demo[data-phase="0"] [data-flow-scene="3"] .flow-analysis-body{display:none}.flow-demo[data-phase="1"] .flow-analysis-points,.flow-demo[data-phase="1"] .flow-analysis-note{opacity:0}.flow-demo[data-phase="1"] .flow-doc-warning,.flow-demo[data-phase="2"] .flow-doc-warning,.flow-demo[data-phase="3"] .flow-doc-warning{background:#c79a3810}.flow-demo[data-phase="2"] .flow-doc-alert,.flow-demo[data-phase="3"] .flow-doc-alert{opacity:1;transform:none}.flow-demo.is-animated .flow-analysis-points{transition:opacity .5s}.flow-demo.is-animated .flow-pointer{transition:opacity .4s,transform .8s}.flow-demo.is-animated .flow-validity i{animation:flow-bar .8s ease both}.flow-demo:not(.is-animated) .flow-board-card{transition:none}
@keyframes flow-scene-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes flow-spin{to{transform:rotate(360deg)}}@keyframes flow-caret{50%{opacity:0}}@keyframes flow-shimmer{to{background-position:-200% 0}}@keyframes flow-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:680px){.flow-section{padding:64px 0}.flow-browser{height:33px}.flow-traffic{left:12px;gap:5px}.flow-traffic i{height:8px;width:8px}.flow-address{width:61%;font-size:9px;height:22px;margin-left:20px}.flow-appbar{height:38px;padding-inline:17px;gap:14px}.flow-brand strong{font-size:14px}.flow-appbar>[data-flow-location]{font-size:9px;padding-left:12px}.flow-stage{height:460px}.flow-scene{padding:22px 17px}.flow-heading{align-items:flex-start;gap:7px;margin-bottom:18px}.flow-heading h3{font-size:18px}.flow-heading p{font-size:10px}.flow-heading>.flow-tag{font-size:8px;padding:4px 5px}.flow-profile-card{padding:13px 12px;gap:10px;margin-bottom:24px}.flow-profile-card strong{font-size:12px}.flow-profile-card div>span{font-size:9px}.flow-profile-icon{width:31px;height:34px;font-size:11px}.flow-profile-check{width:17px;height:17px}.flow-search{font-size:12px;padding:12px 10px;gap:7px}.flow-filters{margin-bottom:20px;gap:5px}.flow-filters span{font-size:8px;padding:5px 6px}.flow-search-footer{align-items:flex-end;gap:12px}.flow-search-footer>span:first-child{font-size:9px;max-width:110px}.flow-action{font-size:9px;padding:10px 11px;gap:6px}.flow-result{padding:16px 13px}.flow-result-top{font-size:8px}.flow-result h4{font-size:15px}.flow-result>p{font-size:10px}.flow-facts strong{font-size:15px}.flow-facts{gap:12px;padding:15px 0;margin:16px 0}.flow-facts small{font-size:7px}.flow-label{font-size:7px;margin-top:20px}.flow-toast{bottom:20px;right:17px;left:17px;justify-content:center;font-size:9px}.flow-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;height:300px}.flow-column{padding:10px 8px}.flow-column:nth-child(3){display:none}.flow-column>h4{font-size:9px;gap:5px}.flow-drop-slot{height:215px}.flow-board-card{left:6px;top:41px;width:calc((100% - 10px)/2 - 12px);padding:12px 10px}.flow-board-card h4{font-size:11px}.flow-board-card>strong{font-size:12px}.flow-board-card>p,.flow-card-task{font-size:8px}.flow-card-footer small{font-size:7px}.flow-demo[data-phase="2"] .flow-board-card,.flow-demo[data-phase="3"] .flow-board-card{transform:translateX(calc(100% + 22px))}.flow-board-confirm{font-size:9px;margin-top:16px}.flow-analysis{padding:16px 13px;min-height:320px}.flow-analysis-top{font-size:11px}.flow-analysis-top small{font-size:7px}.flow-analysis-body>p{font-size:11px}.flow-analysis-points p{font-size:9px;line-height:1.75}.flow-analysis-points h4{font-size:10px}.flow-analysis-note{font-size:8px}.flow-analysis .flow-facts{padding:14px 0;margin:14px 0}.flow-analysis .flow-facts strong{font-size:14px}.flow-analysis-loading{font-size:10px;line-height:1.8}.flow-doc-stats{gap:6px;margin-bottom:17px}.flow-doc-stats>div{padding:9px 8px;gap:4px;font-size:9px}.flow-doc-stats strong{font-size:13px}.flow-doc-row{padding:14px 10px;gap:8px}.flow-doc-row strong{font-size:10px}.flow-doc-row small{font-size:8px}.flow-status{font-size:7px;padding:3px 5px}.flow-doc-icon{font-size:16px}.flow-doc-alert{padding:10px;font-size:9px;gap:6px}.flow-doc-alert strong{font-size:9px}.flow-doc-alert p{font-size:8px}.flow-doc-alert>.flow-tag{font-size:8px}.flow-controls{height:52px}.flow-caption{font-size:8px}.flow-controls [data-flow-pause]{right:12px;top:15px}}
@media(max-width:370px){.flow-heading>.flow-tag{display:none}.flow-heading h3{font-size:17px}.flow-profile-card div>span{max-width:175px}.flow-profile-check{display:none}.flow-search{font-size:11px}.flow-badges>span{font-size:7px}.flow-result-top{gap:5px}.flow-doc-stats>div{font-size:8px;padding:9px 6px}.flow-doc-alert .flow-tag{display:none}.flow-analysis-note{font-size:7px}}
@media(prefers-reduced-motion:reduce){.flow-demo *, .flow-demo *:before,.flow-demo *:after{animation:none!important;transition:none!important}}
@media(max-width:680px){.flow-stage{height:490px}}
@media(max-width:370px){.flow-stage{height:510px}}
@media(min-width:681px){.flow-stage{height:440px}}
@media(min-width:681px){.flow-doc-row{padding-block:9px}.flow-doc-alert{margin-top:10px}}

.flow-demo.is-resetting *{transition:none!important;animation:none!important}

/* Destaque da moldura e entrada única durante a rolagem. */
.flow-demo{box-shadow:0 32px 75px -15px #0009,0 0 70px 6px #8d76ec22,0 0 0 1px #b29bff12;border-color:#77708c}
.flow-demo.flow-entry-ready{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .75s ease,transform .9s cubic-bezier(.2,.75,.25,1)}
.flow-demo.flow-entry-ready.is-revealed{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.flow-demo.flow-entry-ready{opacity:1;transform:none;transition:none}}