.workflow-section{padding:85px 0 75px;background:#e9edf2;border-bottom:1px solid var(--line);border-top:1px solid var(--line)}.workflow-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:40px}.workflow-intro{font-size:12px;color:var(--muted);max-width:300px;margin:0}.workflow-player{display:grid;grid-template-columns:320px 1fr;border:1px solid #c8cfd8;background:#f5f8fb;border-radius:12px;overflow:hidden;box-shadow:0 20px 60px #202c3c06}.workflow-story{padding:26px 24px 20px;display:flex;flex-direction:column;border-right:1px solid var(--line);background:#eff2f7}.workflow-label{display:flex;align-items:center;gap:9px;font-size:8px;letter-spacing:1.1px;font-weight:600;margin-bottom:22px;color:#5c6a7c}.workflow-label .live-dot{width:5px;height:5px}.workflow-steps{display:grid;gap:6px;flex:1}.workflow-step{border:0;display:grid;grid-template-columns:30px 1fr;align-items:center;gap:12px;text-align:left;background:transparent;color:#5b697b;padding:12px 10px;border-radius:6px;position:relative;font-size:12px;min-height:49px;transition:color .25s,background .25s}.workflow-step>span:first-child{border:1px solid #cdd4dc;border-radius:50%;width:28px;height:28px;display:grid;place-items:center;font-size:9px}.workflow-step[aria-pressed=true]{color:var(--ink);background:#dae2ed;font-weight:650}.workflow-step[aria-pressed=true]>span:first-child{background:var(--green);color:white;border-color:var(--green)}.workflow-step:hover{background:#dfe6ef}.workflow-controls{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);margin-top:25px;padding-top:18px}.workflow-controls button{min-height:36px;min-width:36px;border:1px solid #cbd3dd;border-radius:5px;background:#fcfdff;color:var(--ink);font-size:16px}.workflow-controls #workflow-play{display:flex;align-items:center;gap:8px;font-size:11px;padding:0 11px}.workflow-counter{font-size:9px;font-variant-numeric:tabular-nums;color:#606e81;margin-left:auto;margin-right:4px}.workflow-stage{min-width:0;position:relative;display:flex;flex-direction:column}.workflow-app-bar{display:flex;align-items:center;gap:12px;height:63px;padding:0 28px;border-bottom:1px solid #d9dfe6;background:#fcfdff}.workflow-app-brand{font-family:Manrope,Arial,sans-serif;font-size:18px;font-weight:800;letter-spacing:-.8px}.workflow-app-brand>span{color:#607da2}.workflow-role{font-size:9px;margin-left:auto;color:#5d6b7e}.workflow-avatar{font-size:9px;background:#dce4ee;width:25px;height:25px;display:grid;place-items:center;border-radius:50%}.workflow-screen{padding:28px 32px;min-height:317px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 90% 20%,#dae3ef70,transparent 65%);overflow:hidden}.wf-scene{width:100%;animation:wf-enter .5s both}.wf-mini-label{font-size:8px;letter-spacing:1.2px;text-transform:uppercase;color:#606f83;font-weight:600;margin:0 0 8px}.wf-scene h4{font:600 21px/1.4 Manrope,Arial,sans-serif;letter-spacing:-.6px;margin:0 0 20px}.wf-preview-note{font-size:8px;color:#637387}.wf-form{background:#fcfdff;border:1px solid #d2d9e3;padding:21px;border-radius:8px;max-width:370px;margin:auto;box-shadow:0 10px 22px #202c3c05}.wf-form-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.wf-form-top .wf-check{margin:0}.wf-form h4{font-size:17px;margin-bottom:17px}.wf-field{background:#eff3f8;border:1px solid #d9dfe6;font-size:10px;padding:11px 12px;border-radius:4px;margin-bottom:9px;color:#546171}.wf-field small{display:block;font-size:8px;color:#6d7d93;margin-bottom:4px}.wf-approval{display:flex;align-items:center;gap:10px;font-size:11px;margin-top:17px;padding-top:14px;border-top:1px solid #dae0e8;animation:wf-enter .5s .9s both}.wf-check{width:27px;height:27px;border-radius:50%;display:inline-grid;place-items:center;background:#d9e3f0;color:#2d4666;font-size:14px;flex-shrink:0}.wf-approval small{display:block;font-size:8px;color:#637387;margin-top:3px}.wf-building-summary{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:16px;margin-bottom:18px}.wf-building-icon{width:54px;height:66px;border:1px solid #91a2b8;border-radius:4px;background:linear-gradient(90deg,#d9e1ec 70%,#c3cfdf 70%);display:grid;grid-template-columns:repeat(3,7px);grid-template-rows:repeat(3,8px);gap:6px;justify-content:center;align-content:center;position:relative}.wf-building-icon i{background:#798aa1;border-radius:1px}.wf-building-summary h4{margin:0 0 5px}.wf-building-summary p{font-size:10px;color:#5f6e81;margin:0}.wf-person{display:flex;align-items:center;gap:9px;padding:10px 12px;border:1px solid #d6dde6;background:#fcfdff;border-radius:5px;margin:7px 0;font-size:10px;animation:wf-enter .4s both}.wf-person:nth-of-type(2){animation-delay:.2s}.wf-person:nth-of-type(3){animation-delay:.4s}.wf-person:nth-of-type(4){animation-delay:.6s}.wf-person>span:last-child{margin-left:auto;font-size:8px;color:#4c6380}.wf-person-avatar{background:#dce2eb;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;font-size:8px;flex-shrink:0}.wf-table{border:1px solid #d0d8e3;border-radius:7px;overflow:hidden;background:#fcfdff}.wf-row{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:12px 15px;gap:10px;border-bottom:1px solid #dfe5ec;font-size:10px;animation:wf-enter .4s both}.wf-row:last-child{border:0}.wf-row:first-child{font-size:8px;background:#e4eaf2;color:#627184}.wf-row:nth-child(3){animation-delay:.2s}.wf-row:nth-child(4){animation-delay:.4s}.wf-pill{padding:5px 7px;border-radius:3px;background:#dfe7f1;color:#415774;font-size:8px;display:inline-block;justify-self:start}.wf-event{display:flex;align-items:center;gap:9px;font-size:10px;color:#3c516d;margin-top:14px;animation:wf-enter .5s .8s both}.wf-event .wf-check{width:22px;height:22px;font-size:11px}.wf-payment{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wf-payment-card{border:1px solid #d0d9e4;border-radius:7px;background:#fcfdff;padding:18px}.wf-payment-card span{font-size:9px;color:#637286}.wf-payment-card strong{font-family:Manrope,Arial,sans-serif;font-size:24px;font-weight:500;display:block;margin:9px 0}.wf-payment-card small{font-size:8px;color:#637286}.wf-payment-card:last-child{animation:wf-enter .6s .7s both;background:#dfe7f1}.wf-callout{font-size:9px;background:#e8edf3;color:#566374;padding:10px 12px;border-radius:4px;margin-top:12px;line-height:1.7}.wf-issue{background:#fcfdff;border:1px solid #d0d8e3;border-radius:7px;padding:18px}.wf-issue-header{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;margin-bottom:19px}.wf-issue small{font-size:8px;color:#6b7b90;display:block;margin-top:5px}.wf-issue-track{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;position:relative}.wf-issue-track:before{content:'';height:1px;background:#b5c3d5;position:absolute;top:14px;left:15%;width:70%}.wf-issue-step{text-align:center;position:relative;font-size:9px;color:#5a697c;animation:wf-enter .5s both}.wf-issue-step:nth-child(2){animation-delay:.65s}.wf-issue-step:nth-child(3){animation-delay:1.3s}.wf-issue-step .wf-check{margin-bottom:9px}.wf-issue-step span:last-child{display:block}.wf-community{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wf-message{border:1px solid #d1d9e4;border-radius:7px;padding:17px;background:#fcfdff;animation:wf-enter .5s both}.wf-message:nth-child(2){animation-delay:.5s}.wf-message-icon{font-size:19px;color:#586e8a;margin-bottom:10px}.wf-message h5{font:600 12px/1.5 Manrope,Arial,sans-serif;margin:0 0 8px}.wf-message p{font-size:10px;color:#606f82;margin:0;line-height:1.8}.workflow-caption{display:flex;gap:14px;margin-top:auto;padding:22px 30px 26px;border-top:1px solid #d9dfe6;background:#fcfdff;min-height:130px}.workflow-caption>span{font-size:10px;color:#6b7b90;letter-spacing:1px;padding-top:3px}.workflow-caption h3{font-size:17px;line-height:1.4;font-weight:600;letter-spacing:-.4px;margin:0 0 8px}.workflow-caption p{font-size:11px;color:#5e6d80;margin:0;line-height:1.8}.workflow-timeline{height:3px;background:#dfe6ee;position:absolute;bottom:0;left:0;right:0}.workflow-timeline>span{display:block;height:100%;width:0;background:#4f6c92;transition:width .15s linear}.workflow-disclaimer{font-size:9px;color:#67778c;text-align:right;margin:17px 0 0}.workflow-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.workflow-player.is-paused .wf-scene,.workflow-player.is-paused .wf-scene *{animation:none!important}@keyframes wf-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1100px){.workflow-player{grid-template-columns:265px 1fr}.workflow-story{padding:22px 16px 18px}.workflow-screen{padding:25px 20px}.workflow-role{font-size:8px}.workflow-app-bar{padding:0 20px}.workflow-heading h2{font-size:33px}}@media(max-width:900px){.workflow-section{padding:62px 0 53px}.workflow-heading{display:block;margin-bottom:28px}.workflow-intro{margin-top:20px;font-size:11px}.workflow-player{grid-template-columns:1fr}.workflow-story{border-right:0;border-bottom:1px solid var(--line);padding:20px}.workflow-label{margin-bottom:16px}.workflow-steps{grid-template-columns:repeat(3,1fr);gap:5px}.workflow-step{display:flex;align-items:center;flex-direction:column;gap:8px;padding:11px 7px;font-size:9px;text-align:center;min-height:80px;justify-content:flex-start}.workflow-step>span:first-child{width:25px;height:25px;flex-shrink:0;font-size:8px}.workflow-controls{margin-top:17px;padding-top:15px}.workflow-controls button{min-height:40px;min-width:40px}.workflow-stage{min-height:475px}.workflow-screen{min-height:280px;padding:24px}.workflow-app-bar{height:55px;padding:0 20px}.workflow-caption{padding:20px;min-height:132px}.workflow-caption h3{font-size:16px}.workflow-caption p{font-size:10px}.wf-scene h4{font-size:19px}.wf-form h4{font-size:15px}.workflow-disclaimer{text-align:left;line-height:1.8}}@media(max-width:420px){.workflow-section .wrap{padding-left:18px;padding-right:18px}.workflow-heading h2{font-size:30px}.workflow-story{padding:18px 13px}.workflow-screen{padding:22px 16px;min-height:294px}.workflow-role{max-width:140px;text-align:right;font-size:7px}.wf-community{gap:9px}.wf-message{padding:13px}.wf-payment-card{padding:14px}.wf-row{padding:11px;gap:7px;font-size:9px}.wf-form{padding:17px}.workflow-label{font-size:7px}.workflow-step{font-size:8px}.workflow-caption{padding:20px 17px}.wf-callout{font-size:8px}.wf-payment-card strong{font-size:21px}}
