.flow-shell{border:1px solid #39534b;border-radius:26px;background:#132521;overflow:hidden;isolation:isolate}
.flow-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:23px 30px;border-bottom:1px solid #2d453d;font-size:12px}
.flow-toolbar>span:first-child{display:flex;align-items:center;gap:11px}.flow-demo-label{font-size:10px;letter-spacing:.12em;color:#a2bab0}
.flow-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:28px 30px 0;position:relative}
.flow-tabs:before{content:"";position:absolute;top:64px;left:8%;right:8%;height:1px;background:#567265;z-index:-1}
.flow-tab{appearance:none;text-align:left;padding:18px;border:1px solid #3d584d;border-radius:14px;background:#1b3028;color:#eff8f1;min-width:0;cursor:pointer;position:relative;transition:background .25s,transform .25s,border-color .25s}
.flow-tab:hover{background:#29453a;border-color:#8dbfa7;transform:translateY(-3px)}
.flow-tab[aria-selected=true]{background:#adf0db;color:#143d31;border-color:#adf0db;box-shadow:0 9px 30px #0002}
.flow-tab-top{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:24px}.flow-tab-number{font-size:11px;opacity:.75}
.flow-tab svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.flow-tab strong{font-size:17px;display:block;font-weight:600;letter-spacing:-.04em}.flow-tab-caption{display:block;font-size:10px;margin-top:7px;opacity:.8;line-height:1.5}
.flow-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center;padding:44px 54px;min-height:470px;background:radial-gradient(ellipse at 85% 100%,#85c9990b,transparent 65%)}
.flow-kicker{font-size:10px;letter-spacing:.12em;color:#b9de97;display:block;margin-bottom:22px}
.flow-copy h3{font-size:clamp(27px,2.9vw,43px);line-height:1.12;letter-spacing:-.055em;max-width:500px;margin-bottom:20px}
.flow-copy>p{font-size:14px;line-height:1.8;color:#b6c9c0;max-width:420px}.flow-outcome{border-left:2px solid #a4e9d1;padding-left:16px;margin-top:29px}
.flow-outcome span{display:block;color:#9bb6a8;font-size:10px;margin-bottom:8px}.flow-outcome strong{font-size:13px;font-weight:500;color:#e1f4ea}
.flow-stage{position:relative;padding:8px 6px 22px;min-width:0;background-image:radial-gradient(#70958055 .7px,transparent .7px);background-size:18px 18px}
.flow-window{background:#e7f2ea;color:#143b30;border:1px solid #93b5a3;border-radius:13px;box-shadow:0 18px 42px #0003;transform:rotate(-1deg);min-height:308px}
.flow-window-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 19px;border-bottom:1px solid #bbd1c0;font-size:10px;color:#456552}.flow-dots{font-size:7px;letter-spacing:2px;color:#789b89}
.flow-window-body{padding:25px}.flow-small{display:block;font-size:9px;letter-spacing:.1em;color:#57725e}.flow-window h4{font-size:23px;letter-spacing:-.04em;line-height:1.25;margin:10px 0 20px}
.flow-field{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:12px 0;border-top:1px solid #bfd4c5;font-size:11px;line-height:1.5}.flow-field>span{color:#54715f}.flow-field b{font-weight:600;text-align:right}
.flow-fake-button{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#214e3b;color:#e7f7ee;border-radius:6px;padding:13px 16px;margin-top:15px;font-size:11px}
.flow-window-note{font-size:10px!important;color:#41624f!important;margin-top:14px!important}.flow-window-note>span{color:#276b4c;margin-right:5px}
.flow-float-tag{position:absolute;bottom:2px;right:-10px;border:1px solid #dcf5b9;background:#d2efa7;color:#25452d;box-shadow:0 8px 16px #0002;padding:11px 16px;border-radius:9px;font-size:11px;transform:rotate(3deg)}
.flow-status-row{display:flex;gap:7px;margin:18px 0}.flow-status-row span{height:5px;background:#bad0bc;flex:1;border-radius:6px}.flow-status-row span.done{background:#2d7454}.flow-quote{padding:15px;border-left:2px solid #639675;background:#dbeadd;font-size:12px;line-height:1.7;margin-top:16px}.flow-approval{display:inline-flex;border:1px solid #94b49b;background:#d7eaca;padding:7px 10px;border-radius:5px;font-size:10px}
.flow-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #30493f;padding:20px 30px;background:#10211b}
[data-flow-count]{color:#b9de97;font-size:12px;font-variant-numeric:tabular-nums}[data-flow-count]>span{color:#abbeb3;font-size:11px;margin-left:18px}
.flow-controls{display:flex;gap:8px}.flow-controls button{border:1px solid #456254;background:#1e382c;color:#e9f6ee;min-height:44px;border-radius:8px;padding:11px 15px;font-size:11px;cursor:pointer}.flow-controls button:last-child{display:flex;gap:22px;align-items:center}.flow-controls button:hover:enabled{background:#2f4e3e;border-color:#86b296}.flow-controls button:disabled{opacity:.35;cursor:default}
body[data-motion=on] .flow-panel.flow-changing .flow-copy,body[data-motion=on] .flow-panel.flow-changing .flow-stage{animation:flow-enter .38s ease both}body[data-motion=on] .flow-panel.flow-changing .flow-stage{animation-delay:.06s}
@keyframes flow-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.project-card{display:block;background:#162922;border-radius:20px}.project-cover{position:relative;padding:40px 34px 0;background:radial-gradient(ellipse at 60% 20%,#3c6e5d,#1d3b2d 85%);overflow:hidden;aspect-ratio:1.55}.group-project .project-cover{background:radial-gradient(ellipse at 60% 20%,#796444,#30291e 85%)}
.project-browser{border:1px solid #73988480;border-radius:9px 9px 0 0;overflow:hidden;transform:rotate(-3deg);box-shadow:0 18px 35px #0005;transition:transform .5s}.group-project .project-browser{transform:rotate(3deg);border-color:#d5b78980}.project-card:hover .project-browser{transform:translateY(-7px) rotate(0)}
.project-browser-bar{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 13px;background:#17392d;color:#cadbce;font-size:8px;letter-spacing:.08em}.group-project .project-browser-bar{background:#332b20;color:#e2d4b9}.project-browser-bar>span:first-child{font-size:6px;letter-spacing:2px}.project-browser img{display:block;width:100%;height:auto}
.project-stamp{position:absolute;right:17px;bottom:17px;background:#bfe99f;color:#29432d;border:1px solid #d8f0bf;padding:9px 12px;border-radius:7px;font-size:9px;letter-spacing:.06em;transform:rotate(3deg);box-shadow:0 5px 20px #0002}.group-project .project-stamp{background:#ebd1a0;color:#51412b;border-color:#eedbb7;transform:rotate(-3deg)}
.project-card .case-body{padding:30px}.project-label{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:22px}.project-label .eyebrow{margin:0;line-height:1.7}.project-label .badge{font-size:9px;color:#b4cbbd;padding:3px 7px}.project-card .case-company{font-size:12px;letter-spacing:.1em;margin-bottom:15px}.project-card h3{min-height:0;font-size:clamp(27px,2.5vw,36px);line-height:1.15}.project-card .case-summary{min-height:95px;font-size:14px;line-height:1.8;margin-top:22px}.project-tags{padding:0;margin:26px 0 19px;list-style:none;display:flex;gap:7px;flex-wrap:wrap}.project-tags li{border:1px solid #3d5b49;border-radius:5px;padding:6px 9px;font-size:10px;color:#c8ddd0}.project-card .case-details{border-top:1px solid #3d5b49}.project-card .case-details summary{font-size:13px}.project-card .case-detail-body p{max-width:54ch}
.market-heading{display:grid;grid-template-columns:1fr 1fr;gap:16px 35px;margin-top:85px;margin-bottom:30px;align-items:end}.market-heading>.eyebrow{grid-column:1/-1;margin:0;color:#b6d0bf}.market-heading h3{font-size:clamp(26px,3vw,42px);line-height:1.15;letter-spacing:-.04em}.market-heading p{font-size:14px;line-height:1.8;color:#b6c9be;max-width:440px}.market-cases .case-attribution{border-top:1px solid #3a5042;padding-top:16px}
@media(max-width:1050px){.flow-panel{gap:32px;padding:32px;min-height:445px}.flow-tab{padding:15px 12px}.flow-tab strong{font-size:15px}.flow-tab-caption{font-size:9px}.project-card .case-body{padding:24px}.project-card .case-summary{min-height:0}.project-cover{padding:28px 24px 0}.flow-copy h3{font-size:31px}.flow-window-body{padding:20px}}
@media(max-width:750px){.flow-tabs{padding:20px 18px 0;gap:7px}.flow-tab{padding:12px 7px;text-align:center}.flow-tab-top{justify-content:center;margin-bottom:14px}.flow-tab-number,.flow-tab-caption{display:none}.flow-tab strong{font-size:11px;letter-spacing:-.04em}.flow-tab svg{width:23px;height:23px}.flow-tabs:before{top:52px}.flow-panel{grid-template-columns:1fr;gap:28px;padding:28px 25px;min-height:0}.flow-copy h3{font-size:30px}.flow-copy>p{font-size:13px;max-width:none}.flow-outcome{margin-top:20px}.flow-kicker{margin-bottom:15px}.flow-stage{max-width:460px;width:100%;justify-self:center}.flow-window{min-height:290px}.flow-copy h3 br{display:none}.flow-footer{padding:18px;flex-wrap:wrap;gap:15px}.flow-toolbar{padding:20px}.flow-controls{margin-left:auto}.flow-footer [data-flow-count]>span{margin-left:8px;font-size:10px}.project-grid{grid-template-columns:1fr}.project-card{display:block}.project-cover{aspect-ratio:1.65;padding:36px 32px 0}.project-card .case-summary{max-width:none}.market-heading{grid-template-columns:1fr;margin-top:65px;gap:15px}.flow-demo-label{font-size:9px}}
@media(max-width:420px){.flow-tabs{padding:18px 10px 0;gap:5px}.flow-tab{padding:11px 3px}.flow-tab strong{font-size:10px}.flow-panel{padding:26px 20px}.flow-copy h3{font-size:27px}.flow-window-body{padding:18px}.flow-window h4{font-size:21px}.flow-field{gap:10px;font-size:10px}.flow-float-tag{right:-6px}.flow-footer{display:block}.flow-controls{margin-top:16px;justify-content:flex-end}.flow-toolbar{padding:18px 15px}.project-card .case-body{padding:24px 21px}.project-cover{padding:26px 20px 0}.project-stamp{font-size:8px}.project-browser-bar{font-size:6px}.project-label .eyebrow{font-size:9px}}
.case-grid .case-cover{display:flex;align-items:center}.case-grid .case-cover img{aspect-ratio:32/19;height:auto;object-fit:contain}
@media(max-width:750px){.flow-copy h3 br{display:initial}}
@media(prefers-reduced-motion:reduce){.flow-panel *,.flow-tab,.project-browser{animation:none!important;transition:none!important}}
