:root{--brand-blue:#002fa7}
.process-section{position:relative;padding:var(--section-space) 0}
.process-section::before{content:"";position:absolute;top:0;left:calc(50% - 50vw);width:100vw;height:1px;background:#91abb1}
.process-section #process-title{opacity:1;visibility:visible;color:#000;font-size:10px;letter-spacing:.14em;font-weight:400;line-height:15px;margin:0 0 var(--text-gap)}
.process-intro{font-size:clamp(26px,3.5vw,48px);letter-spacing:-.045em;line-height:1.3;color:#000;margin:0 0 32px}
.process-flow{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 28px;padding:0;margin:0}
.process-flow li{position:relative;border:1px solid #91abb1;padding:24px;min-width:0}
.process-flow li::before,.process-flow li::after{content:"";position:absolute;width:6px;height:6px;background:var(--brand-blue);border-radius:50%;left:-3px;top:-3px}
.process-flow li::after{left:auto;top:auto;right:-3px;bottom:-3px}
.process-number{color:var(--brand-blue);font-size:12px}.process-flow h3{font-size:22px;font-weight:400;letter-spacing:-.03em;margin:12px 0}
.process-flow p{font-size:14px;line-height:1.6;color:#496572;margin:0}.process-aside{display:block;margin-top:12px;color:var(--brand-blue);font:20px/1.3 Caveat,cursive}
.process-flow li:not(:nth-child(3n)){border-right-color:#91abb1}.process-flow li:not(:nth-child(3n)) .process-number::after{content:'→';position:absolute;right:-23px;top:50%;color:var(--brand-blue);font-size:18px}
.process-flow li:nth-child(3) .process-number::after{content:'↓';position:absolute;bottom:-29px;left:50%;color:var(--brand-blue);font-size:18px}
.process-loop{font-size:14px;line-height:1.6;color:#496572;margin:24px 0 0}
@media(max-width:700px){.process-flow{grid-template-columns:1fr;gap:24px}.process-flow li{padding:20px}.process-flow li:not(:last-child) .process-number::after{content:'↓';position:absolute;left:50%;right:auto;top:auto;bottom:-24px;font-size:18px;color:var(--brand-blue)}.process-flow li:last-child .process-number::after{display:none}}
@media(min-width:701px){.process-flow li:nth-child(4){grid-column:3;grid-row:2}.process-flow li:nth-child(5){grid-column:2;grid-row:2}.process-flow li:nth-child(6){grid-column:1;grid-row:2}.process-flow li:nth-child(4) .process-number::after,.process-flow li:nth-child(5) .process-number::after{content:"←";left:-23px;right:auto}}
.process-diagram{width:100%;overflow-x:auto;padding:4px 0}
.process-diagram svg{display:block;width:100%;min-width:650px;height:auto}
@media(max-width:600px){.process-diagram{padding-bottom:12px}}
.process-section .process-intro{text-align:center}
.process-step{position:relative;padding-bottom:48px;opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.process-step.is-revealed{opacity:1;transform:none}
.process-step:not(:last-child)::after{content:'↓';position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:22px;line-height:28px;color:#737373}
.process-node{border:1px solid #91abb1;background:#fff;padding:22px 18px}
.process-node h3,.process-decision h3{margin:0;font:400 16px/1.4 'DM Sans',sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#071e33}
.process-node p,.process-branches p,.process-return p{font-size:14px;line-height:1.5;color:#496572;margin:8px 0 0}
.process-decision{width:156px;height:156px;margin:34px auto;border:1px solid #91abb1;background:#fff;transform:rotate(45deg);display:flex;align-items:center;justify-content:center}
.process-decision h3{transform:rotate(-45deg);max-width:110px}
.process-branches{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:34px}
.process-branches>div{border-top:1px solid #91abb1;padding-top:12px}.process-branches span{font-size:12px;color:var(--brand-blue);text-transform:uppercase;letter-spacing:.1em}
.process-return{padding-bottom:0}
.motion-paused .process-step{opacity:1;transform:none;transition:none}
@media(prefers-reduced-motion:reduce){.process-step{opacity:1;transform:none;transition:none}}
.process-step{padding-bottom:30px}
.process-step:not(:last-child)::after{bottom:3px;font-size:16px;line-height:24px;color:#91abb1}
.process-node{position:relative;padding:14px 16px;background:transparent;border:1px solid #91abb1;border-radius:0}
.process-node::before,.process-node::after{content:"";position:absolute;width:5px;height:5px;background:var(--brand-blue);border-radius:50%}
.process-node::before{left:-3px;top:-3px}.process-node::after{right:-3px;bottom:-3px}
.process-node h3,.process-decision h3{font-size:12px;line-height:1.4;letter-spacing:.08em;font-weight:400}
.process-node p,.process-branches p,.process-return p{font-size:12px;line-height:1.5;margin-top:6px}
.process-decision{position:relative;width:102px;height:102px;margin:22px auto;background:transparent}
.process-decision h3{max-width:80px;font-size:11px}
.process-decision::before,.process-decision::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--brand-blue)}
.process-decision::before{top:-3px;left:-3px}.process-decision::after{bottom:-3px;right:-3px}
.process-branches{gap:12px;margin-top:22px}.process-branches>div{padding-top:8px}.process-branches span{font-size:10px}
.process-return{padding-bottom:0}
.process-section .process-intro{font-size:clamp(22px,2.6vw,34px);margin-bottom:24px}
.process-extra-nodes::before,.process-extra-nodes::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--brand-blue)}
.process-extra-nodes::before{right:-3px;top:-3px}.process-extra-nodes::after{left:-3px;bottom:-3px}
.process-step:not(:last-child)::after{content:"";left:50%;bottom:0;width:1px;height:30px;background:#91abb1;transform:translateX(-50%)}
.process-step:not(:last-child)::before{content:"";position:absolute;z-index:2;left:50%;bottom:0;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid #91abb1;transform:translateX(-50%)}
.decision-step .process-decision{margin-top:21px}
.process-step:has(+ .decision-step)::after{height:30px}
.process-node .process-next{color:var(--brand-blue);font-size:10px;letter-spacing:.06em;text-transform:uppercase;margin-top:10px}
.process-map{list-style:none;margin:0 auto;padding:0;width:min(100%,720px);position:relative}
.process-map .map-step{display:grid;grid-template-columns:180px minmax(0,1fr);gap:44px;align-items:center;padding:0 0 36px 48px;text-align:left}
.process-map .map-step::before{content:"";position:absolute;left:21px;top:0;bottom:0;width:1px;height:auto;border:0;background:#91abb1;transform:none}
.process-map .map-step::after{content:"";position:absolute;left:21px;top:70px;width:27px;height:1px;background:#91abb1;transform:none}
.map-card{position:relative;border:1px solid #91abb1;padding:20px 16px 16px;background:rgba(255,255,255,.9);text-align:center}
.map-index{position:absolute;top:9px;left:10px;font-size:10px;color:#496572;letter-spacing:.08em}
.map-card svg{width:52px;height:52px;display:block;margin:0 auto 10px;fill:none;stroke:var(--brand-blue);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.map-card h3{margin:0;font-size:16px;font-weight:400;letter-spacing:-.02em;color:#071e33}
.map-card::before,.map-card::after,.map-corners::before,.map-corners::after{content:"";position:absolute;width:5px;height:5px;background:var(--brand-blue);border-radius:50%}
.map-card::before{top:-3px;left:-3px}.map-card::after{top:-3px;right:-3px}.map-corners::before{bottom:-3px;left:-3px}.map-corners::after{bottom:-3px;right:-3px}
.map-method{width:100%;aspect-ratio:5/1;background:url("assets/process-methods.png") center calc(var(--method)*25%)/100% 500% no-repeat;mix-blend-mode:multiply}
.map-repeat{margin:0 auto;width:min(100%,624px);color:var(--brand-blue);font-size:13px;line-height:1.5}
@media(max-width:600px){.process-map .map-step{padding-left:26px;grid-template-columns:120px minmax(0,1fr);gap:12px;padding-bottom:26px}.process-map .map-step::before{left:8px}.process-map .map-step::after{left:8px;width:18px;top:58px}.map-card{padding:20px 8px 14px}.map-card svg{width:40px;height:40px}.map-card h3{font-size:13px}.map-method{aspect-ratio:3/1;background-size:140% 500%}.map-repeat{padding-left:26px}}
.map-card .process-pixel,.focus-art svg{fill:var(--brand-blue);stroke:none;shape-rendering:crispEdges}
.process-scroll-story{height:430vh;position:relative;margin-top:24px}
.process-sticky{position:sticky;top:10vh;height:80vh;display:grid;place-items:center;overflow:hidden}
.process-sticky .process-map{width:min(100%,650px);transform-origin:30% 10%;will-change:transform,opacity}
.process-sticky .map-step{opacity:1;transform:none;padding-bottom:12px;grid-template-columns:130px 1fr;gap:20px}
.process-sticky .map-card{padding:8px}.process-sticky .map-card svg{width:28px;height:28px;margin-bottom:5px}.process-sticky .map-card h3{font-size:13px}
.process-focus{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;transform:scale(.75)}
.process-focus h3{font-size:clamp(36px,6vw,76px);font-weight:400;letter-spacing:-.045em;color:var(--brand-blue);margin:0 0 16px}
.process-progress{position:absolute;bottom:0;left:15%;width:70%;height:1px;background:#cbd8df}.process-progress span{display:block;width:100%;height:2px;background:var(--brand-blue);transform:scaleX(var(--story-progress,0));transform-origin:left}
@media(prefers-reduced-motion:reduce){.process-scroll-story{height:auto}.process-sticky{position:relative;top:auto;height:auto;overflow:visible}.process-focus,.process-progress{display:none}.process-sticky .process-map{opacity:1!important;transform:none!important}}
.motion-paused .process-scroll-story{height:auto}.motion-paused .process-sticky{position:relative;top:auto;height:auto;overflow:visible}.motion-paused .process-focus,.motion-paused .process-progress{display:none}.motion-paused .process-sticky .process-map{opacity:1!important;transform:none!important}
.process-map{width:min(100%,640px)}
.process-map .map-step{grid-template-columns:132px minmax(0,1fr);gap:28px;padding-bottom:24px}
.process-map .map-card{padding:14px 10px 12px}
.process-map .map-card svg{width:34px;height:34px;margin-bottom:8px}
.process-map .map-card h3{font-size:14px;line-height:1.3}
.process-map .map-index{font-size:9px;top:6px;left:7px}
.process-map .map-step::after{top:48px}
@media(max-width:600px){.process-map .map-step{grid-template-columns:100px minmax(0,1fr);gap:12px;padding-bottom:20px}.process-map .map-card{padding:14px 6px 10px}.process-map .map-card svg{width:30px;height:30px}.process-map .map-card h3{font-size:12px}.process-map .map-step::after{top:43px}}

.process-map .map-step{opacity:1;transform:none}

/* Cognitive design rationale replaces the methods image with readable copy. */
.process-rationale.map-method{aspect-ratio:auto;background:none;mix-blend-mode:normal;min-width:0}
.process-rationale h4{margin:0 0 6px;color:var(--brand-blue);font:400 17px/1.35 'DM Sans',sans-serif;letter-spacing:-.02em}
.process-rationale p{margin:0;color:#071e33;font:400 14px/1.55 'DM Sans',sans-serif}
@media(max-width:600px){.process-rationale h4{font-size:15px}.process-rationale p{font-size:13px}}
