/* Same paper, ink, type and process linework as the approved native figures. */
figure.process-diagram[data-native-diagram]{--pilot-paper:var(--book-paper,#f3eee6);--pilot-muted:var(--book-muted,#625965);--project-accent:var(--book-accent,#593caf);container:process-proof/inline-size;min-width:0;margin:0;padding:20px 0;background:transparent;color:var(--book-ink,#211e29)}
figure.process-diagram[data-native-diagram] > img[hidden]{display:none!important}
figure.process-diagram[data-native-diagram="access"]{--project-accent:#086974}
figure.process-diagram[data-native-diagram="climate"]{--project-accent:#266b59}
figure.process-diagram[data-native-diagram]{aspect-ratio:auto;height:auto;max-height:none;display:block;align-self:start}
figure.process-diagram[data-native-diagram] .process-flow{display:grid;grid-template-columns:repeat(var(--process-stages,3),minmax(0,1fr));gap:32px;list-style:none;margin:0;padding:0}
figure.process-diagram[data-native-diagram] .process-stage{position:relative;display:block;min-width:0;margin:0;padding:0;text-align:center}
figure.process-diagram[data-native-diagram] .process-glyph{height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
figure.process-diagram[data-native-diagram] .process-glyph svg{display:block;width:132px;height:100px;max-width:100%;flex:0 0 auto;stroke:#625965;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
figure.process-diagram[data-native-diagram] .process-glyph svg rect{fill:#fffaf3}
figure.process-diagram[data-native-diagram] .process-glyph .process-accent{stroke:var(--project-accent)}
figure.process-diagram[data-native-diagram] .process-glyph span{max-width:100%;overflow-wrap:anywhere;font-size:.78rem;line-height:1.4;color:var(--pilot-muted)}
figure.process-diagram[data-native-diagram] .diagram-title{display:block;font-size:1rem;font-weight:650;line-height:1.35;margin:18px 0 8px;text-wrap:balance}
figure.process-diagram[data-native-diagram] .process-stage > p{font-size:.9rem;line-height:1.55;margin:0;max-width:28ch;color:var(--pilot-muted);text-wrap:pretty}
figure.process-diagram[data-native-diagram] .process-stage:not(:last-child)::after{content:"";position:absolute;width:22px;right:-27px;top:54px;border-top:1.5px solid var(--project-accent)}
figure.process-diagram[data-native-diagram] .process-stage:not(:last-child)::before{content:"";position:absolute;width:7px;height:7px;right:-27px;top:51px;border-top:1.5px solid var(--project-accent);border-right:1.5px solid var(--project-accent);transform:rotate(45deg)}
figure.process-diagram[data-native-diagram] > .process-outcome{margin:28px 0 0;padding:15px 0 0;border-top:1px solid #cfc2b3;font-size:.88rem;line-height:1.55;color:var(--pilot-muted)}
figure.process-diagram[data-native-diagram] > .process-example{margin:0 0 28px;font-size:.9rem;line-height:1.5;color:var(--project-accent)}
.case-book-page .case-book-opening > figure.process-diagram{grid-column:1;grid-row:1 / span 2;align-self:start;padding:20px 0;background:transparent}
.case-book-page .case-book-opening > figure.process-diagram img[hidden]{display:none!important}
.case-book-page #main-content figure.process-diagram .process-stage > p{font-size:.94rem;line-height:1.55;margin:0}
.case-book-page #main-content figure.process-diagram .process-glyph span{color:var(--book-muted)}
.case-book-page #main-content figure.process-diagram .diagram-title{font-weight:650}
.has-native-proofs :is(.proof-panel--bedrijf,.proof-panel--help):has(>.process-diagram){grid-template-columns:minmax(0,2.4fr) minmax(270px,1fr);grid-template-areas:"diagram copy";gap:42px;align-items:center}
.has-native-proofs :is(.proof-panel--bedrijf,.proof-panel--help)>.proof-panel__copy{grid-area:copy}
@media(max-width:920px){.has-native-proofs :is(.proof-panel--bedrijf,.proof-panel--help):has(>.process-diagram){grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "diagram";gap:24px}}
@container process-proof (max-width:700px){
 figure.process-diagram[data-native-diagram] .process-flow{grid-template-columns:1fr;gap:32px}
 figure.process-diagram[data-native-diagram] .process-stage{display:grid;grid-template-columns:minmax(88px,.75fr) minmax(0,1.4fr);grid-template-areas:"glyph title" "glyph copy";gap:6px 24px;text-align:left;align-items:center}
 figure.process-diagram[data-native-diagram] .process-glyph{grid-area:glyph;height:auto;min-height:98px}
 figure.process-diagram[data-native-diagram] .process-glyph svg{width:112px;height:84px}
 figure.process-diagram[data-native-diagram] .process-glyph span{text-align:center;font-size:.78rem}
 figure.process-diagram[data-native-diagram] .diagram-title{grid-area:title;align-self:end;margin:0;font-size:1rem}
 figure.process-diagram[data-native-diagram] .process-stage > p{grid-area:copy;align-self:start;font-size:.94rem;max-width:none}
 figure.process-diagram[data-native-diagram] .process-stage:not(:last-child)::after{top:auto;bottom:-25px;left:23%;right:auto;width:0;height:17px;border:0;border-left:1.5px solid var(--project-accent)}
 figure.process-diagram[data-native-diagram] .process-stage:not(:last-child)::before{top:auto;bottom:-25px;left:calc(23% - 2.5px);right:auto;width:6px;height:6px;border:0;border-right:1.5px solid var(--project-accent);border-bottom:1.5px solid var(--project-accent);transform:rotate(45deg)}
}
@container process-proof (max-width:350px){
 figure.process-diagram[data-native-diagram] .process-stage{grid-template-columns:minmax(76px,.7fr) minmax(0,1.3fr);column-gap:16px}
 figure.process-diagram[data-native-diagram] .process-glyph svg{width:88px;height:70px}
 figure.process-diagram[data-native-diagram] .process-glyph span{font-size:.75rem}
}
@media(max-width:760px){.case-book-page .case-book-opening > figure.process-diagram{grid-column:1;grid-row:auto}}

figure.process-diagram .process-flow[data-process-stages="5"]{--process-stages:5}

/* Local control uses a return path; attic cooling has a spatial section. */
figure.process-diagram:is([data-native-diagram="gree"],[data-native-diagram="attic"]){--project-accent:#266b59}
figure.process-diagram[data-native-diagram="gree"] .process-stage:not(:last-child) .process-back{position:absolute;right:-12px;top:51px;width:7px;height:7px;border-left:1.5px solid var(--project-accent);border-bottom:1.5px solid var(--project-accent);transform:rotate(45deg)}
figure.process-diagram .attic-section{margin:0 0 36px}
figure.process-diagram .attic-section>svg{display:block;width:100%;height:auto;stroke:#625965;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
figure.process-diagram .attic-section .process-accent{stroke:var(--project-accent)}
figure.process-diagram .attic-key{display:flex;justify-content:space-around;gap:24px;margin:12px 0 0;font-size:.8rem;line-height:1.45;text-align:center}
figure.process-diagram .attic-key dt{font-weight:650}
figure.process-diagram .attic-key dd{margin:4px 0 0;color:var(--pilot-muted)}
@container process-proof (max-width:700px){figure.process-diagram[data-native-diagram="gree"] .process-stage:not(:last-child) .process-back{top:auto;right:auto;bottom:-13px;left:calc(23% - 2.5px);width:6px;height:6px;border:0;border-top:1.5px solid var(--project-accent);border-left:1.5px solid var(--project-accent)}}

figure.process-diagram[data-native-diagram="event"],figure.process-diagram[data-native-diagram="product"]{--project-accent:#166982}
figure.process-diagram[data-native-diagram="tomos"]{--project-accent:#086974}
.tomos-interface-evidence{margin:28px 0}
.tomos-interface-evidence img{display:block;width:100%;height:auto}
.tomos-interface-evidence figcaption{margin-top:12px;font-size:.88rem;color:var(--book-muted,#625965);line-height:1.5}
