.connected-flow{max-width:490px;justify-self:end;padding:12px 0 12px 20px}
.connected-flow figcaption{margin:0 0 28px 74px;font-size:10px;color:#bed2c6}
.connected-stages{list-style:none;padding:0;margin:0}
.connected-stages>li{position:relative;display:grid;grid-template-columns:50px minmax(0,1fr);gap:24px;min-height:112px;padding:0 0 28px}
.connected-stages>li:last-child{min-height:84px;padding-bottom:0}
.stage-node{width:50px;height:50px;display:grid;place-items:center;border:1px solid #718e7d;background:#1a352a;color:#e0ebe4;border-radius:50%;font-size:14px;font-weight:750;position:relative;z-index:2;animation:node-focus 12s linear infinite;animation-delay:var(--phase)}
.stage-info h3{font-size:20px;line-height:1.3;margin:2px 0 13px;color:#f7faf8;font-weight:650}
.stage-items{display:flex;flex-wrap:wrap;gap:6px 14px;min-height:25px}
.stage-items span{font-size:11px;line-height:1.6;color:#bdd2c4;position:relative;padding-left:10px;opacity:.2;animation:item-enter 12s ease-in-out infinite;animation-delay:calc(var(--phase) + .2s)}
.stage-items span:before{content:'';width:3px;height:3px;background:#f49a55;position:absolute;left:0;top:8px}
.stage-items span:nth-child(2){animation-delay:calc(var(--phase) + .55s)}
.stage-items span:nth-child(3){animation-delay:calc(var(--phase) + .9s)}
.stage-link{position:absolute;left:24px;top:50px;bottom:0;width:2px;background:#4a6757;overflow:hidden}
.stage-link:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent,#ffd0a4 50%,#f47920);transform:translateY(-110%);animation:connection-travel 12s linear infinite;animation-delay:calc(var(--phase) + 1.5s)}
.connected-flow .scene-footer{margin:22px 0 0 74px;border-top:1px solid #526c5d;padding-top:12px}
.connected-flow .scene-footer p{font-size:11px}
@keyframes node-focus{0%,19%{border-color:#f49a55;background:#355b43;color:#fff;box-shadow:0 0 0 5px #f4792010}23%,100%{border-color:#718e7d;background:#1a352a;color:#e0ebe4;box-shadow:0 0 0 0 transparent}}
@keyframes item-enter{0%{opacity:.2;transform:translateY(7px)}5%,76%{opacity:1;transform:translateY(0)}86%,100%{opacity:.2;transform:translateY(0)}}
@keyframes connection-travel{0%{transform:translateY(-110%)}8%{transform:translateY(0)}12%,100%{transform:translateY(110%)}}
@media(max-width:760px){.connected-flow{padding:0;max-width:440px}.connected-stages>li{gap:18px;min-height:104px}.stage-info h3{font-size:19px}.connected-flow figcaption,.connected-flow .scene-footer{margin-left:68px}.stage-items{gap:5px 10px}.stage-items span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.connected-flow:not(.motion-enabled) .stage-items span{animation-name:item-fade}.connected-flow:not(.motion-enabled) .stage-link:after{animation-name:connection-fade;transform:none}}
@keyframes item-fade{0%,86%,100%{opacity:.35}5%,76%{opacity:1}}
@keyframes connection-fade{0%,12%,100%{opacity:0}8%{opacity:1}}
.connected-stages>li{grid-template-columns:14px minmax(0,1fr);gap:22px}
.stage-node{width:12px;height:12px;margin-top:10px;animation-name:point-focus}
.stage-link{left:5px;top:22px;bottom:-10px}
.connected-flow figcaption,.connected-flow .scene-footer{margin-left:36px}
@keyframes point-focus{0%,19%{border-color:#ffc28d;background:#f47920;box-shadow:0 0 0 4px #f479201c}23%,100%{border-color:#8ea99a;background:#476454;box-shadow:0 0 0 0 transparent}}
.governance-note small{font-size:9px;text-transform:uppercase;color:#bdd2c4}.connected-flow .governance-note p{margin:5px 0 0;font-size:12px;line-height:1.8;color:#e4eee7}.governance-note a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:#6e8a78}
.hero-governance{border-left:3px solid #f47920;padding:3px 0 3px 16px;margin:0 0 24px}.hero-governance p{margin:0 0 6px;font-size:21px;font-weight:650;color:#ffd0a6;line-height:1.4}.hero-governance span{font-size:12px;line-height:1.7;color:#d4e3d9;display:block}.hero-governance a{text-decoration:underline;text-underline-offset:3px}.connected-flow .scene-footer{justify-content:flex-end;border-top:0}.hero-governance a:hover{color:white}@media(max-width:540px){.hero-governance p{font-size:18px}.hero-governance span{font-size:11px}}
.hero-governance p{font-size:15px;line-height:1.6;font-weight:550}.hero-governance{margin-top:24px}
