
/* Shared SORO reading and interaction layer. */
.portfolio-flow{--flow-purple:#5b2c70;--flow-soft:#f0e8f6;--flow-line:#ded2e8}
.portfolio-flow main p{line-height:1.7}.portfolio-flow h1{line-height:1.1!important;letter-spacing:-.035em!important}.portfolio-flow h2,.portfolio-flow h3{line-height:1.2!important}.portfolio-flow section[id],.portfolio-flow [id$="-title"]{scroll-margin-top:24px}
.flow-navigation{display:flex!important;flex-wrap:wrap;gap:9px!important;padding:18px 0!important;border-top:1px solid var(--flow-line);border-bottom:1px solid var(--flow-line);margin:22px 0 32px!important;align-items:center}
.flow-navigation>span{font:700 12px/1.5 Arial,sans-serif;color:var(--flow-purple);margin-right:10px}.flow-navigation a{display:inline-flex;min-height:44px;padding:9px 14px;border:1px solid var(--flow-line);border-radius:30px;background:white;text-decoration:none;font:600 14px/1.5 Arial,sans-serif;color:var(--flow-purple)}
.flow-navigation a[aria-current="location"]{background:var(--flow-purple);color:white}.flow-primary{display:inline-flex;min-height:48px;align-items:center;padding:12px 19px;border-radius:9px;background:var(--flow-purple);color:white!important;font:700 16px/1.5 Arial,sans-serif;text-decoration:none}.flow-secondary{background:transparent!important;color:var(--flow-purple)!important;border-color:var(--flow-line)!important}
.flow-lab{padding:25px!important;margin:24px 0 34px;border:1px solid var(--flow-line);border-radius:18px;background:#faf7fc;max-width:100%}.flow-lab h2{font-size:clamp(25px,3vw,34px)!important;margin:0 0 12px!important}.flow-lab p{max-width:65ch}.flow-choice-list{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.flow-choice{min-height:46px;padding:11px 16px;border:1px solid #bda7cf;border-radius:12px;background:white;color:#48225f;font:600 15px/1.45 Arial,sans-serif;text-align:left;cursor:pointer}.flow-choice[aria-pressed="true"]{background:var(--flow-purple);color:white}.flow-response{background:white;border-left:4px solid var(--flow-purple);padding:18px;border-radius:0 12px 12px 0;min-height:100px}.flow-response h3{font-size:21px!important;margin:0 0 8px!important}.flow-response p{margin:0!important}
.flow-filter{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 12px}.flow-filter button{min-height:44px;border:1px solid #d8c7e2;background:white;color:#51286a;border-radius:30px;padding:9px 17px;font:600 14px/1.5 Arial,sans-serif;cursor:pointer}.flow-filter button[aria-pressed="true"]{background:#5b2c70;color:white}.flow-filter-status{font-size:14px;color:#5c5264;margin:0 0 22px}.tile[hidden]{display:none!important}
.portfolio-flow .project-decisions{gap:20px}.portfolio-flow .project-decisions article{background:#fff;border:1px solid var(--flow-line);border-radius:16px;padding:22px}.portfolio-flow .project-decisions details summary{cursor:pointer;min-height:44px;font-weight:600;color:var(--flow-purple)}.portfolio-flow .project-decisions details p{margin-top:12px}
.portfolio-flow .project-next h2{font-size:clamp(23px,3vw,34px)!important}.portfolio-flow .project-stage{min-width:0}.portfolio-flow iframe{max-width:100%}.portfolio-flow a:focus-visible,.portfolio-flow button:focus-visible,.portfolio-flow summary:focus-visible{outline:3px solid #327f71;outline-offset:4px}.portfolio-flow .case-mark{display:none}.portfolio-flow .case-content{min-width:0}.portfolio-flow .case-visual{background:#eee5f4!important;color:#422053!important}.portfolio-flow .step{min-width:0}.portfolio-flow .process{gap:18px}.portfolio-flow .step .num{display:none}.portfolio-flow .stage-link{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:680px){.portfolio-flow .shell{width:calc(100% - 36px)!important}.flow-navigation>span{flex-basis:100%}.flow-lab{padding:18px!important}.flow-choice{width:100%}.portfolio-flow .project-hero{gap:24px}.portfolio-flow .project-decisions{grid-template-columns:1fr}.portfolio-flow .project-story{gap:14px}.portfolio-flow .nav{height:auto;flex-wrap:wrap;padding:18px 0}.portfolio-flow .nav nav{gap:12px}.portfolio-flow .section-head{display:block}.portfolio-flow .case{min-height:0}.portfolio-flow .project-actions{gap:10px}.portfolio-flow .project-actions a{width:100%}}
@media(prefers-reduced-motion:reduce){.portfolio-flow html{scroll-behavior:auto}.portfolio-flow *{animation:none!important;transition:none!important}}
