.principles-flow{--flow-green:#477b60;--flow-line:#dbe1da;max-width:1200px;margin:auto;position:relative}.flow-board{border-block:1px solid var(--flow-line);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.flow-value{min-width:0;padding-bottom:32px;position:relative}.flow-value+.flow-value{border-left:1px solid #e7ebe6}.flow-diagram-wrap{background-image:radial-gradient(#bec9bc80 .65px,#0000 .65px);background-size:16px 16px;padding:18px 0 22px;position:relative}.flow-diagram{width:100%;height:auto;display:block;overflow:visible}.flow-caption{letter-spacing:.02em;color:#56705e;text-align:center;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}.flow-value-copy{padding:28px 24px 0}.flow-value h3{letter-spacing:-.045em;margin:0 0 16px;font-size:clamp(23px,2.25vw,31px);font-weight:500;line-height:1.12}.flow-value-copy>p{color:#646b63;font-size:16px;line-height:1.65}.flow-axis{stroke:#bdcabc;stroke-width:1px}.flow-signal{stroke:var(--flow-green);stroke-width:2px;stroke-dasharray:3 97;animation:3s linear infinite flow-transmit}.flow-guide{stroke:#d6ded4;stroke-width:.7px;stroke-dasharray:2 5}.flow-surface{fill:#fafcf8;stroke:#a3b59f;stroke-width:1px}.flow-grid{stroke:#d8e2d4;stroke-width:.6px}.clarity-point{fill:var(--flow-green);animation:6s cubic-bezier(.45,0,.2,1) infinite flow-align;animation-delay:var(--point-delay)}.clarity-frame{stroke:var(--flow-green);stroke-width:1.2px;opacity:.4;animation:6s infinite flow-frame}.system-wire{stroke:#a0b49a;stroke-width:1.3px}.system-packet{stroke:#315d40;stroke-width:3px;stroke-linecap:round;stroke-dasharray:5 45;animation:4s linear infinite flow-transmit}.system-node{fill:#547e5c;animation:4s infinite flow-node}.system-hub{fill:#263e2e;stroke:#263e2e}.system-hub-mark{stroke:#e4efde;stroke-width:1.5px}.care-align{stroke:#477b60;stroke-width:1.1px;transform-origin:120px 115px;animation:5s ease-in-out infinite flow-refine}.care-scan{stroke:#779f65;stroke-width:1.8px;animation:3.5s ease-in-out infinite alternate flow-scan}.care-centre{fill:#263e2e}.lasting-track{stroke:#b4c3ae;stroke-width:9px}.lasting-current{stroke:#385b41;stroke-width:3px;stroke-dasharray:10 40;stroke-linecap:round;animation:4.5s linear infinite flow-transmit}.lasting-source{fill:#f9fbf6;stroke:#385b41;stroke-width:2px}.lasting-pulse{stroke:#71935e;transform-origin:120px 115px;animation:3s ease-out infinite flow-pulse}.flow-value:hover{--flow-green:#245a39}.flow-value:hover .flow-diagram-wrap{background-color:#f5f8f2}.flow-diagram-wrap{transition:background-color .3s}@keyframes flow-transmit{to{stroke-dashoffset:-100px}}@keyframes flow-align{0%,12%,to{transform:translate(var(--scatter-x),var(--scatter-y));opacity:.5}42%,78%{opacity:1;transform:translate(0)}}@keyframes flow-frame{0%,15%,to{opacity:.1}45%,78%{opacity:.85}}@keyframes flow-node{0%,to{opacity:.6}40%,65%{opacity:1}}@keyframes flow-refine{0%,to{transform:translate(-6px,5px)rotate(-5deg)}45%,80%{transform:translate(0)rotate(0)}}@keyframes flow-scan{0%{opacity:.2;transform:translateY(0)}to{opacity:1;transform:translateY(120px)}}@keyframes flow-pulse{0%{opacity:.65;transform:scale(1)}to{opacity:0;transform:scale(4)}}.flow-motion-control{opacity:0;pointer-events:none;color:#253025;font:inherit;background:#fff;border:1px solid #647760;border-radius:24px;padding:10px 16px;font-size:14px;position:absolute;top:8px;right:12px}.flow-motion-control:focus-visible{opacity:1;pointer-events:auto;outline-offset:4px;outline:2px solid #253025}.principles-flow.is-paused *{animation-play-state:paused!important}@media (max-width:1000px){.flow-board{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-value:nth-child(3){border-left:0}.flow-value:nth-child(n+3){border-top:1px solid var(--flow-line)}.flow-diagram{max-height:265px}.flow-value h3{font-size:29px}.flow-value-copy{padding:24px 24px 0}}@media (max-width:580px){.flow-board{grid-template-columns:1fr}.flow-value+.flow-value{border-left:0;border-top:1px solid var(--flow-line)}.flow-value{padding-bottom:26px}.flow-value-copy{padding:22px 16px 0}.flow-value h3{font-size:29px}.flow-diagram-wrap{padding-top:4px;padding-bottom:18px}.flow-diagram{max-height:220px}.flow-caption{font-size:13px}}@media (prefers-reduced-motion:reduce){.principles-flow *{transition:none!important;animation:none!important}.clarity-point{transform:none}.lasting-pulse,.flow-motion-control{display:none}.clarity-frame{opacity:.8}}
