.process-page main { overflow: clip; }
.process-page .button { border-radius: 4px; }

.process-hero { min-height: 740px; }
.process-hero__grid { min-height: 740px; display: grid; grid-template-columns: minmax(440px,.76fr) minmax(650px,1.24fr); align-items: center; gap: clamp(2.5rem,5vw,6rem); padding-block: clamp(4rem,6vw,6.5rem); }
.process-hero__copy { position: relative; z-index: 3; }
.process-hero__copy h1 { max-width: 660px; margin-bottom: 1.7rem; font-size: clamp(4rem,5.3vw,5.8rem); line-height: .94; letter-spacing: -.07em; text-wrap: balance; }
.process-hero__copy > p { max-width: 610px; margin-bottom: 2rem; font-size: clamp(1rem,1.3vw,1.2rem); line-height: 1.75; }
.process-hero__copy .hero__actions { display: flex; flex-wrap: wrap; gap: .85rem; }

.process-route { position: relative; min-height: 580px; color: var(--color-text); }
.process-route::before { content: ""; position: absolute; inset: 4% 0 7% 4%; background: color-mix(in srgb,var(--color-primary) 3%,transparent); clip-path: polygon(0 82%,82% 0,100% 0,17% 100%); pointer-events: none; }
.process-route__grid { position: absolute; inset: 0; width: 100%; height: 100%; }
.process-route__grid > path:first-child { fill: none; stroke: color-mix(in srgb,var(--color-primary) 13%,var(--color-border)); stroke-width: 1; }
.process-route__line { fill: none; stroke: var(--color-primary); stroke-width: 2.1; stroke-linecap: round; stroke-dasharray: 8 7; animation: process-route-flow 15s linear infinite; }
.process-route__start,.process-route__end { position: absolute; color: color-mix(in srgb,var(--color-primary) 72%,var(--color-muted)); font-size: .59rem; font-weight: 750; line-height: 1.45; letter-spacing: .16em; text-transform: uppercase; }
.process-route__start { left: 1%; bottom: 15%; max-width: 110px; }.process-route__end { top: 2%; right: 0; max-width: 130px; text-align: right; }
.process-route__station { position: absolute; width: 104px; min-height: 78px; display: grid; align-content: end; gap: .15rem; padding: 0 0 17px; color: var(--color-text); background: transparent; border: 0; text-align: left; cursor: pointer; }
.process-route__station span { color: var(--color-primary); font-size: .66rem; font-weight: 800; }
.process-route__station strong { max-width: 104px; font-size: .7rem; line-height: 1.25; }
.process-route__station i { position: absolute; left: 0; bottom: 0; width: 14px; height: 14px; background: var(--color-bg); border: 2px solid var(--color-primary); border-radius: 50%; box-shadow: 0 0 0 0 color-mix(in srgb,var(--color-primary) 22%,transparent); transition: background 180ms ease,box-shadow 180ms ease,transform 180ms ease; }
.process-route__station::after { content: ""; position: absolute; left: 6px; bottom: 13px; width: 1px; height: 26px; border-left: 1px dashed color-mix(in srgb,var(--color-primary) 58%,transparent); }
.process-route__station:hover i,.process-route__station:focus-visible i,.process-route__station[aria-pressed="true"] i { background: var(--color-primary); box-shadow: 0 0 0 9px color-mix(in srgb,var(--color-primary) 15%,transparent); transform: scale(1.08); }
.process-route__station:focus-visible { outline: 2px solid #a8aaff; outline-offset: 5px; }
.process-route__station--1 { left: 7%; bottom: 19%; }.process-route__station--2 { left: 23%; bottom: 27%; }.process-route__station--3 { left: 39%; bottom: 37%; }.process-route__station--4 { left: 55%; bottom: 49%; }.process-route__station--5 { left: 70%; bottom: 61%; }.process-route__station--6 { right: 3%; top: 6%; }
.process-route__detail { position: absolute; right: 0; bottom: 1%; width: min(48%,390px); min-height: 132px; display: grid; grid-template-columns: 48px minmax(0,1fr); align-content: start; gap: .5rem 1rem; padding: 1rem 0 0 1.25rem; border-top: 1px solid var(--color-border-strong); border-left: 1px solid var(--color-border); }
.process-route__detail small { grid-column: 1/-1; color: var(--color-muted-deep); font-size: .58rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.process-route__detail > span { color: var(--color-primary); font-size: 1.7rem; font-weight: 800; line-height: 1; letter-spacing: -.06em; }
.process-route__detail strong { display: block; margin-bottom: .25rem; font-size: .8rem; }
.process-route__detail p { margin: 0; font-size: .66rem; line-height: 1.55; }

.process-journey { padding-block: clamp(6rem,8vw,9rem); }
.process-journey__heading { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(340px,.9fr); align-items: end; gap: 3rem; margin-bottom: 4rem; }
.process-journey__heading h2 { max-width: 850px; margin: 0; font-size: clamp(3.5rem,5vw,5.6rem); line-height: .95; letter-spacing: -.065em; }
.process-journey__heading p { max-width: 560px; justify-self: end; margin: 0; font-size: .95rem; line-height: 1.75; }
.process-journey__steps { position: relative; display: grid; grid-template-columns: repeat(3,1fr); padding-block: 2rem; border-top: 1px solid var(--color-border-strong); border-bottom: 1px solid var(--color-border-strong); }
.process-journey__steps::before { content: ""; position: absolute; top: 50%; right: 0; left: 0; height: 1px; background: var(--color-border-strong); }
.process-journey__steps li { position: relative; min-height: 310px; display: grid; grid-template-columns: 72px 52px minmax(0,1fr); align-content: start; gap: 1rem; padding: 2.25rem clamp(1.2rem,2.4vw,2.4rem); border-right: 1px solid var(--color-border-strong); }
.process-journey__steps li:nth-child(3n) { border-right: 0; }.process-journey__steps li:nth-child(3n+1) { padding-left: 0; }
.process-journey__number { color: color-mix(in srgb,var(--color-primary) 14%,var(--color-bg)); font-size: clamp(3.3rem,4.5vw,5rem); font-weight: 800; line-height: .8; letter-spacing: -.09em; }
.process-journey__icon { width: 48px; height: 48px; display: grid; place-items: center; color: var(--color-primary); border: 1px solid color-mix(in srgb,var(--color-primary) 55%,var(--color-border)); border-radius: 3px; }
.process-journey__icon svg,.process-handover__rail svg,.process-collaboration__lane svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.process-journey__steps h3 { margin: .2rem 0 .7rem; font-size: clamp(1.05rem,1.35vw,1.3rem); }
.process-journey__steps p { max-width: 320px; margin: 0; font-size: .78rem; line-height: 1.7; }
.process-journey__node { position: absolute; left: -7px; bottom: -7px; width: 14px; height: 14px; background: var(--color-bg); border: 2px solid var(--color-primary); border-radius: 50%; }
.process-journey__steps li:nth-child(-n+3) .process-journey__node { bottom: auto; top: -7px; }
.process-checkpoints { display: grid; grid-template-columns: 190px minmax(0,1fr); align-items: center; gap: 2rem; padding-top: 3.2rem; }
.process-checkpoints > strong { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.process-checkpoints ol { position: relative; display: grid; grid-template-columns: repeat(7,1fr); margin: 0; padding: 0; list-style: none; }
.process-checkpoints ol::before { content: ""; position: absolute; top: 7px; right: 4%; left: 4%; height: 1px; background: var(--color-primary); }
.process-checkpoints li { position: relative; display: grid; justify-items: center; gap: .65rem; color: var(--color-muted); font-size: .6rem; text-align: center; }
.process-checkpoints li i { position: relative; z-index: 1; width: 14px; height: 14px; background: var(--color-bg); border: 2px solid var(--color-primary); border-radius: 50%; }
.process-checkpoints li:nth-child(even) i { background: var(--color-primary); }

.process-handover { padding-block: clamp(6rem,8vw,8.5rem); background: var(--color-bg-elevated); }
.process-handover__heading { max-width: 900px; margin-bottom: 4.5rem; }
.process-handover__heading h2 { margin-bottom: 1rem; font-size: clamp(3.3rem,4.8vw,5.2rem); line-height: .96; letter-spacing: -.06em; }
.process-handover__heading p { max-width: 760px; margin: 0; font-size: .96rem; line-height: 1.75; }
.process-handover__rail { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--color-border-strong); }
.process-handover__rail li { min-height: 330px; display: grid; grid-template-columns: 62px 1fr; grid-template-rows: auto auto auto 1fr; align-content: start; gap: 1rem; padding: 2.2rem clamp(1.3rem,2.2vw,2.2rem); border-right: 1px solid var(--color-border-strong); }
.process-handover__rail li:first-child { padding-left: 0; }.process-handover__rail li:last-child { padding-right: 0; border-right: 0; }
.process-handover__rail li > span { color: color-mix(in srgb,var(--color-primary) 17%,var(--color-bg-elevated)); font-size: 3rem; font-weight: 800; line-height: 1; letter-spacing: -.08em; }
.process-handover__rail li > i { width: 52px; height: 52px; display: grid; place-items: center; color: var(--color-primary); font-style: normal; }
.process-handover__rail h3,.process-handover__rail p { grid-column: 1/-1; }
.process-handover__rail h3 { margin: .4rem 0 0; font-size: 1.12rem; }
.process-handover__rail p { margin: 0; font-size: .79rem; line-height: 1.72; }

.process-collaboration { padding-block: clamp(5.5rem,7vw,7.5rem); }
.process-collaboration__grid { display: grid; grid-template-columns: minmax(350px,.7fr) minmax(600px,1.3fr); align-items: center; gap: clamp(4rem,7vw,8rem); }
.process-collaboration__grid h2 { max-width: 620px; margin-bottom: 1.25rem; font-size: clamp(3.1rem,4.3vw,4.8rem); line-height: .98; letter-spacing: -.06em; }
.process-collaboration__grid p { max-width: 600px; margin: 0; font-size: .92rem; line-height: 1.8; }
.process-collaboration__map { position: relative; display: grid; grid-template-rows: 1fr auto 1fr; gap: 1.25rem; padding-block: 1.5rem; }
.process-collaboration__lane { display: grid; grid-template-columns: 135px minmax(0,1fr); align-items: center; gap: 1rem; }
.process-collaboration__lane strong { display: flex; align-items: center; gap: .65rem; font-size: .76rem; }
.process-collaboration__lane svg { width: 26px; height: 26px; color: var(--color-primary); }
.process-collaboration__lane > span { height: 1px; background: var(--color-border-strong); }
.process-collaboration__map ol { position: absolute; inset: 0 0 0 151px; display: grid; grid-template-columns: repeat(5,1fr); margin: 0; padding: 0; list-style: none; }
.process-collaboration__map li { position: relative; display: grid; grid-template-rows: 1fr auto 1fr; justify-items: center; color: var(--color-muted); font-size: .62rem; }
.process-collaboration__map li span { align-self: center; }
.process-collaboration__map li i { width: 13px; height: 13px; align-self: center; background: var(--color-bg); border: 2px solid var(--color-primary); border-radius: 50%; }
.process-collaboration__map li i:last-child { background: var(--color-primary); }
.process-collaboration__map li::before { content: ""; position: absolute; top: 18%; bottom: 18%; left: 50%; border-left: 1px dashed color-mix(in srgb,var(--color-primary) 55%,transparent); }

.process-cta { position: relative; isolation: isolate; color: #fff; background: var(--color-primary); overflow: hidden; }
.process-cta::before { content: ""; position: absolute; z-index: -1; top: -180px; left: 38%; width: 520px; height: 520px; background: rgba(255,255,255,.09); border-radius: 50%; filter: blur(90px); pointer-events: none; }
.process-cta::after { content: ""; position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size: 96px 96px; mask-image: linear-gradient(90deg,transparent,black 22%,black 78%,transparent); pointer-events: none; }
.process-cta__grid { min-height: 430px; display: grid; grid-template-columns: minmax(480px,.92fr) minmax(560px,1.08fr); align-items: center; gap: clamp(4rem,7vw,8.5rem); padding-block: clamp(4.5rem,6vw,6.25rem); }
.process-cta__copy { position: relative; z-index: 1; }
.process-cta h2 { max-width: 720px; margin: 0 0 1rem; color: #fff; font-size: clamp(3rem,3.7vw,4.35rem); line-height: .96; letter-spacing: -.055em; text-wrap: balance; }
.process-cta p { max-width: 620px; margin: 0 0 1.8rem; color: #eeeefe; font-size: .94rem; line-height: 1.7; }
.process-cta .button { min-width: 220px; justify-content: space-between; color: #171938; background: #fff; border-color: #fff; box-shadow: 0 18px 45px rgba(29,31,94,.2); transition: transform 180ms ease,box-shadow 180ms ease; }
.process-cta .button:hover { transform: translateY(-3px); box-shadow: 0 22px 55px rgba(29,31,94,.3); }
.process-cta__route { position: relative; min-height: 210px; display: grid; grid-template-columns: repeat(5,1fr); align-items: start; gap: 1rem; padding-top: 132px; }
.process-cta__route span { position: absolute; top: 66px; right: 8px; left: 0; height: 58px; border-top: 2px solid rgba(255,255,255,.88); border-radius: 0 52px 0 0; }
.process-cta__route span::after { content: ""; position: absolute; top: -8px; right: -1px; width: 13px; height: 13px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); }
.process-cta__route i { position: relative; color: #fff; font-size: .59rem; font-style: normal; font-weight: 750; letter-spacing: .15em; text-align: center; text-transform: uppercase; }
.process-cta__route i::before { content: ""; position: absolute; top: -72px; left: 50%; width: 11px; height: 11px; background: var(--color-primary); border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 6px rgba(255,255,255,.1); transform: translateX(-50%); }
.process-cta__route i::after { content: ""; position: absolute; top: -55px; left: 50%; height: 38px; border-left: 1px dashed rgba(255,255,255,.48); }

html[data-theme="light"] .process-page .process-hero,html[data-theme="light"] .process-page .process-journey,html[data-theme="light"] .process-page .process-collaboration { background: #fff; }
html[data-theme="light"] .process-page .process-route__station i,html[data-theme="light"] .process-page .process-journey__node,html[data-theme="light"] .process-page .process-checkpoints li i,html[data-theme="light"] .process-page .process-collaboration__map li i { background: #fff; }
html[data-theme="light"] .process-page .process-route__station:hover i,html[data-theme="light"] .process-page .process-route__station:focus-visible i,html[data-theme="light"] .process-page .process-route__station[aria-pressed="true"] i,html[data-theme="light"] .process-page .process-checkpoints li:nth-child(even) i,html[data-theme="light"] .process-page .process-collaboration__map li i:last-child { background: var(--color-primary); }
html[data-theme="light"] .process-page .process-journey__number { color: #e5e7f5; }
html[data-theme="light"] .process-page .process-handover { background: #f6f7fb; }
html[data-theme="light"] .process-page .process-handover__rail li > span { color: #dfe2f1; }

@keyframes process-route-flow { to { stroke-dashoffset: -180; } }
@media (max-width: 1240px) {
    .process-hero__grid { grid-template-columns: minmax(370px,.72fr) minmax(540px,1.28fr); gap: 2rem; }.process-route { min-height: 530px; }.process-route__detail { width: 52%; }.process-journey__steps li { grid-template-columns: 58px 45px minmax(0,1fr); }.process-collaboration__grid { grid-template-columns: minmax(320px,.7fr) minmax(520px,1.3fr); gap: 3rem; }
}
@media (max-width: 980px) {
    .process-hero__grid { grid-template-columns: 1fr; }.process-hero__copy h1 { max-width: 800px; }.process-route { width: min(100%,820px); margin-inline: auto; }.process-journey__heading { grid-template-columns: 1fr; }.process-journey__heading p { justify-self: start; }.process-journey__steps { grid-template-columns: repeat(2,1fr); }.process-journey__steps::before { display: none; }.process-journey__steps li,.process-journey__steps li:nth-child(3n) { min-height: 280px; border-right: 1px solid var(--color-border-strong); border-bottom: 1px solid var(--color-border-strong); }.process-journey__steps li:nth-child(2n) { border-right: 0; }.process-journey__steps li:nth-last-child(-n+2) { border-bottom: 0; }.process-journey__steps li:nth-child(3n+1) { padding-left: clamp(1.2rem,2.4vw,2.4rem); }.process-journey__node { display: none; }.process-checkpoints { grid-template-columns: 1fr; }.process-handover__rail { grid-template-columns: repeat(2,1fr); }.process-handover__rail li { border-bottom: 1px solid var(--color-border-strong); }.process-handover__rail li:nth-child(2n) { border-right: 0; }.process-handover__rail li:first-child { padding-left: clamp(1.3rem,2.2vw,2.2rem); }.process-handover__rail li:nth-last-child(-n+2) { border-bottom: 0; }.process-collaboration__grid { grid-template-columns: 1fr; }.process-cta__grid { grid-template-columns: 1fr; gap: 2.5rem; padding-block: 4.5rem; }.process-cta__copy { max-width: 720px; }.process-cta__route { width: min(100%,760px); min-height: 165px; }
}
@media (max-width: 680px) {
    .process-hero__grid { min-height: 0; padding-block: 4.5rem 5.5rem; }.process-hero__copy h1 { font-size: clamp(3.2rem,14vw,4.2rem); }.process-hero__copy .hero__actions { display: grid; }.process-hero__copy .button { width: 100%; }.process-route { min-height: 620px; margin-top: 1rem; }.process-route::before,.process-route__grid { display: none; }.process-route__start,.process-route__end { left: 0; right: auto; }.process-route__start { top: 0; bottom: auto; }.process-route__end { top: auto; bottom: 154px; text-align: left; }.process-route__stations { position: absolute; inset: 40px 0 185px; display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }.process-route__station,.process-route__station--1,.process-route__station--2,.process-route__station--3,.process-route__station--4,.process-route__station--5,.process-route__station--6 { position: relative; inset: auto; width: auto; min-height: 102px; align-content: center; padding: .9rem .9rem .9rem 2.4rem; background: var(--color-bg-elevated); border: 1px solid var(--color-border); }.process-route__station span { font-size: .72rem; }.process-route__station strong { max-width: none; font-size: .72rem; }.process-route__station i { left: .9rem; bottom: 50%; transform: translateY(50%); }.process-route__station::after { display: none; }.process-route__station:hover i,.process-route__station:focus-visible i,.process-route__station[aria-pressed="true"] i { transform: translateY(50%) scale(1.08); }.process-route__detail { right: auto; bottom: 0; left: 0; width: 100%; min-height: 135px; }.process-journey__heading h2,.process-handover__heading h2,.process-collaboration__grid h2 { font-size: clamp(2.8rem,12vw,3.8rem); }.process-journey__steps { grid-template-columns: 1fr; padding-block: 0; }.process-journey__steps li,.process-journey__steps li:nth-child(2n),.process-journey__steps li:nth-child(3n),.process-journey__steps li:nth-child(3n+1) { min-height: 0; grid-template-columns: 54px 46px minmax(0,1fr); padding: 2rem 0; border-right: 0; border-bottom: 1px solid var(--color-border-strong); }.process-journey__steps li:last-child { border-bottom: 0; }.process-journey__number { font-size: 3.25rem; }.process-checkpoints { overflow: visible; }.process-checkpoints ol { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem 1.25rem; }.process-checkpoints ol::before { display: none; }.process-checkpoints li { grid-template-columns: 14px minmax(0,1fr); align-items: center; justify-items: start; gap: .55rem; padding: .65rem 0; text-align: left; }.process-handover__rail { grid-template-columns: 1fr; }.process-handover__rail li,.process-handover__rail li:first-child,.process-handover__rail li:nth-child(2n) { min-height: 0; padding: 2rem 0; border-right: 0; border-bottom: 1px solid var(--color-border-strong); }.process-handover__rail li:last-child { border-bottom: 0; }.process-collaboration__map { overflow: visible; }.process-collaboration__lane { grid-template-columns: 104px minmax(0,1fr); gap: .5rem; }.process-collaboration__lane strong { gap: .4rem; font-size: .68rem; }.process-collaboration__lane svg { width: 22px; height: 22px; }.process-collaboration__map ol { inset: 0 0 0 112px; }.process-collaboration__map li { font-size: .48rem; }.process-cta__grid { grid-template-columns: 1fr; gap: 2rem; padding-block: 4rem 4.5rem; }.process-cta h2 { font-size: clamp(2.8rem,12.5vw,3.6rem); }.process-cta p { margin-bottom: 1.5rem; }.process-cta .button { width: 100%; }.process-cta__route { min-height: 130px; grid-template-columns: repeat(5,minmax(0,1fr)); gap: .3rem; padding-top: 86px; }.process-cta__route span { top: 34px; height: 44px; }.process-cta__route i { font-size: .48rem; letter-spacing: .08em; }.process-cta__route i::before { top: -53px; width: 9px; height: 9px; }.process-cta__route i::after { top: -38px; height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .process-route__line { animation: none; }.process-route__station i { transition: none; }
}

/* Narrow screens keep process maps within the viewport without clipped rails. */
