/* A single event, read from left to right. The existing type and colour tokens
   keep the flow in the same visual system as the Griffin-based hero. */
.network-flow{max-width:1400px;margin-inline:auto;border:1px solid var(--line);border-top:0;scroll-margin-top:24px}
.flow-heading{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-top:56px;padding-bottom:44px;align-items:end}
.flow-heading .section-label{margin-bottom:28px}
.flow-heading .section-heading{margin-bottom:0;font-size:48px;letter-spacing:-.045em}
.flow-intro{max-width:460px;justify-self:end}
.flow-intro .section-lede{font-size:18px;line-height:1.45}
.flow-controls{display:flex;gap:20px;margin-top:22px}
.flow-controls button{display:inline-flex;gap:7px;align-items:center;min-height:32px;padding:6px 0;border:0;background:none;font:400 11px/1.5 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--secondary)}
.flow-controls button:hover{color:var(--accent)}
.flow-controls svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.2}
.flow-canvas{padding:38px 40px 0;background-color:#f2f1ec;border-block:1px solid var(--line);background-image:radial-gradient(#d0cec4 .8px,transparent .8px);background-size:20px 20px;overflow:hidden}
.flow-track{position:relative;display:grid;grid-template-columns:.92fr 1.06fr 1.09fr 1.07fr 1.1fr;gap:24px;isolation:isolate}
.flow-rail{position:absolute;top:15px;left:14px;right:14px;height:1px;background:#ccc9c0;z-index:-1}
.flow-rail>span{display:block;width:100%;height:1px;background:var(--accent);transform-origin:left;transform:scaleX(var(--flow-progress,1))}
.flow-rail>i{position:absolute;left:calc(var(--flow-progress,1) * 100%);top:-2px;width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px #0000ff0a}
.flow-tag{display:inline-flex;align-items:center;gap:8px;max-width:100%;border:1px solid #d3d0c6;border-radius:99px;padding:7px 10px;background:#f2f1ec;font:400 10px/14px var(--mono);text-transform:uppercase;letter-spacing:.015em;white-space:nowrap;color:#716d66;transition:background .3s,color .3s,border-color .3s}
.flow-step-number{font-size:9px;opacity:.65}
.flow-stage.is-active .flow-tag{color:var(--accent);border-color:#0000ff59;background:#eeedff}
.flow-stage.is-complete .flow-tag{color:var(--foreground)}
.flow-tag:hover{border-color:var(--accent);color:var(--accent)}
.flow-stage{min-width:0}
.flow-stage-body{margin-top:30px;min-width:0}
.flow-card,.flow-destination{background:#faf9f6;border:1px solid #d4d1c8;border-radius:10px;padding:18px 16px;transition:border-color .4s,box-shadow .4s}
.flow-stage.is-active .flow-card{border-color:#a6a1e9;box-shadow:0 5px 24px #28231a05}
.flow-card{min-height:342px}
.flow-card-eyebrow{display:flex;align-items:center;gap:6px;font:400 9px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.015em;color:var(--secondary);min-height:19px;margin-bottom:23px}
.flow-card-eyebrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.2;flex-shrink:0}
.flow-card-eyebrow .flow-f-mark{width:12px;height:16px;fill:var(--accent);stroke:none}
.flow-card h3,.flow-destination h3{font:300 24px/1.1 var(--serif);letter-spacing:-.04em;margin:0 0 13px}
.flow-card p,.flow-destination p{font:300 13px/1.5 var(--sans);color:var(--secondary);margin:0}
.flow-capture-image{position:relative;margin:0 -6px 21px;overflow:hidden;border-radius:3px;background:#e4e1d7}
.flow-capture-image img{display:block;width:100%;aspect-ratio:1.6;object-fit:cover;filter:grayscale(1);opacity:.9}
.capture-scan{position:absolute;left:0;right:0;top:calc(var(--stage-progress,1) * 100%);height:1px;background:var(--accent);box-shadow:0 -7px 18px #0000ff33;opacity:0}
.flow-stage.is-active .capture-scan{opacity:1}
.capture-corners{position:absolute;inset:8px;background:linear-gradient(var(--background),var(--background)) left top/12px 1px,linear-gradient(var(--background),var(--background)) left top/1px 12px,linear-gradient(var(--background),var(--background)) right bottom/12px 1px,linear-gradient(var(--background),var(--background)) right bottom/1px 12px;background-repeat:no-repeat}
.flow-card-rule{display:flex;align-items:center;gap:7px;border-top:1px solid var(--line);padding-top:13px;margin-top:20px;font:300 11px/1.5 var(--sans)}
.mini-check{color:var(--accent);font:400 11px var(--mono)}
.flow-stage-note{font:300 12px/1.5 var(--sans);margin:16px 3px 0;color:var(--secondary)}
.flow-signal{font:300 12px/1.5 var(--sans);margin-top:14px;display:flex;flex-direction:column;gap:7px}
.signal-track{height:3px;width:100%;background:#e6e3db;overflow:hidden;border-radius:3px}
.signal-track i{display:block;height:100%;width:100%;background:#9692ba;transform:scaleX(var(--signal-progress,1));transform-origin:left}
.flow-stage.is-active .signal-track i{background:var(--accent)}
.model-observation{border-top:1px solid var(--line);margin-top:22px;padding-top:14px}
.flow-micro{display:block;font:400 9px/1.5 var(--mono);letter-spacing:.035em;text-transform:uppercase;color:var(--secondary)}
.model-observation>p{font-size:14px;color:var(--foreground);margin:7px 0}
.observation-detail{font-size:8px}
.review-people{display:flex;justify-content:space-between;gap:12px;margin:27px 0 24px}
.review-people>span{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid #d8d4cb;background:#eeece6}
.review-people svg{width:29px;height:29px;stroke:#97918a;stroke-width:1;fill:none}
.review-people i{position:absolute;right:-5px;bottom:-2px;display:grid;place-items:center;border-radius:50%;height:16px;width:16px;background:#e8e6ff;color:var(--accent);font:400 9px var(--mono);opacity:var(--check-reveal,1);transform:scale(var(--check-reveal,1))}
.review-card .flow-card-rule{margin-top:23px;align-items:flex-start}
.record-fields{margin:21px 0 20px;border-top:1px solid var(--line);font:300 12px/1.4 var(--sans)}
.record-fields>div{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:11px 0;border-bottom:1px solid var(--line)}
.record-fields dd{margin:0;color:var(--accent);opacity:var(--field-reveal,1)}
.record-stamp{display:flex;align-items:center;gap:7px;font:400 8px/1.4 var(--mono);letter-spacing:.01em;text-transform:uppercase;color:var(--accent);margin-top:22px;opacity:var(--stamp-reveal,1)}
.record-stamp svg{width:17px;height:20px;stroke:currentColor;fill:none;stroke-width:1.1}
.flow-destinations{display:flex;flex-direction:column;gap:10px}
.flow-destination{display:block;padding:15px 16px;position:relative}
.flow-destination:hover{border-color:var(--accent);background:#f6f5ff}
.destination-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px}
.destination-top>span:last-child{font:400 13px var(--mono);color:var(--accent)}
.flow-destination h3{font-size:21px;line-height:1.12;margin-bottom:7px}
.flow-destination p{font-size:12px}
.flow-stage.is-active .flow-destination{border-color:#a6a1e9}
.flow-ready [data-flow-reveal]{opacity:var(--reveal,1);transform:translateY(calc((1 - var(--reveal,1)) * 20px))}
.flow-return{height:69px;position:relative;margin:6px 0 0;color:var(--secondary)}
.flow-return svg{display:block;width:100%;height:40px;overflow:visible;fill:none;stroke-width:1;stroke:#bbb7aa}
.return-pulse{stroke:var(--accent);stroke-dasharray:28 390;stroke-dashoffset:var(--return-offset,0);opacity:var(--return-opacity,0)}
.return-arrow{stroke:var(--accent)}
.flow-return>span{position:absolute;top:35px;left:23.2%;width:36.8%;text-align:center;font:400 9px/1.5 var(--mono);letter-spacing:.01em;text-transform:uppercase}
.flow-bottom{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid #d4d1c8;min-height:74px;background:#f2f1eceb}
.flow-bottom>p{display:flex;align-items:baseline;gap:10px;font:300 13px/1.5 var(--sans);margin:0;color:var(--secondary)}
.flow-bottom>.flow-micro{white-space:nowrap;font-size:8px}
.flow-state-dot{display:block;flex-shrink:0;width:5px;height:5px;background:var(--accent)}
.flow-footnote{display:flex;justify-content:space-between;align-items:center;gap:28px;min-height:80px;padding-block:18px}
.flow-footnote>p{display:flex;align-items:center;gap:9px;margin:0;font:300 12px/1.5 var(--sans);color:var(--secondary)}
.flow-footnote svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1;flex-shrink:0}
.flow-footnote .text-link{font-size:10px;white-space:nowrap}
@media(min-width:1024px) and (max-width:1279px){
 .flow-canvas{padding-inline:24px}.flow-track{gap:14px;grid-template-columns:.92fr 1.06fr 1.09fr 1.07fr 1.1fr}
 .flow-tag{font-size:9px;padding-inline:8px;gap:5px}.flow-card,.flow-destination{padding-inline:12px}
 .flow-card h3{font-size:22px}.flow-card-eyebrow{font-size:8px;gap:4px}.flow-card-eyebrow svg{width:13px}
 .flow-destination h3{font-size:20px}.review-people{gap:6px}.review-people>span{width:36px;height:36px}
 .flow-card{min-height:370px}.record-stamp{font-size:7px}.flow-stage-note{font-size:11px}
}
@media(max-width:1023px){
 .flow-heading{gap:36px;padding-top:40px;padding-bottom:36px}.flow-heading .section-heading{font-size:40px}.flow-intro .section-lede{font-size:16px}
 .flow-canvas{padding:32px 28px 0}
 .flow-track{display:flex;flex-direction:column;gap:30px}
 .flow-rail{left:14px;right:auto;top:16px;bottom:12px;width:1px;height:auto}
 .flow-rail>span{height:100%;width:1px;transform-origin:top;transform:scaleY(var(--flow-progress,1))}
 .flow-rail>i{left:-2px;top:calc(var(--flow-progress,1) * 100%)}
 .flow-stage{display:grid;grid-template-columns:170px minmax(0,1fr);gap:24px;align-items:start}
 .flow-tag{justify-self:start;margin-top:16px;font-size:10px}
 .flow-stage-body{margin-top:0}.flow-card{min-height:0;padding:22px}
 .flow-card-eyebrow{margin-bottom:20px;font-size:10px}.flow-card h3{font-size:28px}
 .capture-card .flow-capture-image{max-width:320px;margin-inline:0;float:right;width:44%;margin-left:22px;margin-bottom:0}
 .capture-card .flow-card-rule{clear:both}.flow-card p{font-size:14px}
 .review-people{max-width:230px}.flow-stage-note{margin-top:12px}
 .flow-destination{padding:20px 22px}.flow-destination h3{font-size:26px}.flow-destination p{font-size:14px}.flow-destination p br{display:none}
 .flow-return{height:auto;margin:32px 0 24px;padding-left:194px}
 .flow-return svg{display:none}.flow-return>span{position:static;display:block;width:auto;text-align:left;font-size:10px}
 .flow-return>span::before{content:'↶';color:var(--accent);margin-right:9px}
 .flow-bottom{padding-block:20px;min-height:86px}
}
@media(max-width:599px){
 .flow-heading{grid-template-columns:1fr;gap:22px;padding-top:36px;padding-bottom:32px}
 .flow-heading .section-label{margin-bottom:22px}.flow-heading .section-heading{font-size:36px}
 .flow-intro{justify-self:start}.flow-intro .section-lede{font-size:17px}.flow-controls{margin-top:20px}
 .flow-canvas{padding:24px 20px 0}.flow-stage{display:block;padding-left:22px}
 .flow-tag{margin:0 0 18px -22px;font-size:10px}.flow-card{padding:20px}
 .flow-rail{left:-8px;top:14px;bottom:0}.flow-stage-body{margin-top:0}
 .capture-card .flow-capture-image{float:none;width:100%;max-width:none;margin:0 0 20px}
 .flow-card h3{font-size:27px}.flow-stage-note{font-size:12px}
 .flow-return{padding-left:22px;margin-top:28px}.flow-return>span{font-size:9px}
 .flow-bottom{align-items:flex-start;flex-direction:column;gap:14px;padding-block:22px;min-height:132px}
 .flow-footnote{flex-direction:column;align-items:flex-start;gap:16px;padding-block:24px}
}
@media(min-width:1024px){
 .flow-stage{display:flex;flex-direction:column}
 .flow-stage-body{flex:1;display:flex;flex-direction:column}
 .flow-card{flex:1;display:flex;flex-direction:column}
 .flow-card>*{order:2}
 .flow-card>.flow-card-eyebrow{order:0;white-space:nowrap;height:19px}
 .flow-card>h3{order:1;min-height:2.2em;display:flex;align-items:flex-start}
 .capture-card .flow-capture-image{margin-top:0}
 .flow-card>.flow-card-rule,.flow-card>.record-stamp,.flow-card>.model-observation{order:3;margin-top:auto}
 .review-card .review-people{margin-top:0}
 .record-card .record-fields{margin-top:0}
 .model-card .flow-signal:first-of-type{margin-top:0}
 .flow-destinations{flex:1}
 .flow-destination{flex:1;display:flex;flex-direction:column}
 .flow-destination p{margin-top:auto}
}
@media(prefers-reduced-motion:reduce){.flow-ready [data-flow-reveal]{opacity:1;transform:none}.capture-scan{display:none}}
