.interactive-process{--process-accent:#173e81;--process-progress:0;position:relative;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 0}
.interactive-process:before,.interactive-process:after{content:"";position:absolute;left:30px;top:8px;bottom:8px;width:1px;pointer-events:none;z-index:0}
.interactive-process:before{background:#e2e6ed}.interactive-process:after{height:calc((100% - 16px) * var(--process-progress));bottom:auto;background:linear-gradient(var(--process-accent),#6b89b9);transform-origin:top;transition:height .25s ease}
.interactive-process .step{position:relative;z-index:1;display:grid;grid-template-columns:76px minmax(0,1fr) 120px;gap:18px;align-items:center;min-height:94px;padding:18px 0;opacity:.52;cursor:pointer;border-bottom:1px solid var(--line);transition:opacity .35s ease,transform .45s var(--ease),background-color .35s ease;outline:none}
.interactive-process .step:last-child{border-bottom:0}.interactive-process .step:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(238,243,250,.96),rgba(238,243,250,0) 74%);transform:translateX(-101%);opacity:0;transition:transform .7s var(--ease),opacity .35s ease}
.interactive-process .step.active:before{transform:none;opacity:1;animation:processSweep .8s var(--ease)}.interactive-process .step:hover,.interactive-process .step.active,.interactive-process .step:focus-visible{opacity:1;transform:translateX(4px)}.interactive-process .step:focus-visible{box-shadow:inset 0 0 0 1px rgba(23,62,129,.22)}
@keyframes processSweep{from{transform:translateX(-101%)}to{transform:none}}
.interactive-process .step-num{display:flex;align-items:center;gap:10px;color:#8a919d;font-size:10px;letter-spacing:.08em;padding-left:2px;transition:color .35s ease,transform .35s var(--ease),letter-spacing .35s ease}.interactive-process .step.active .step-num{color:var(--process-accent);transform:translateY(-4px);letter-spacing:.13em}
.interactive-process .step-num svg{width:17px;height:17px;opacity:0;transform:scale(.75) rotate(-12deg);transition:opacity .35s ease,transform .45s var(--ease)}.interactive-process .step.active .step-num svg,.interactive-process .step:hover .step-num svg,.interactive-process .step:focus-visible .step-num svg{opacity:1;transform:scale(1) rotate(0)}
.interactive-process .step-copy{min-width:0;transition:transform .35s var(--ease)}.interactive-process .step.active .step-copy{transform:translateX(2px)}.interactive-process .step-copy h3{font-size:19px;font-weight:500;letter-spacing:-.035em;margin:0;opacity:.82;transform:translateY(2px);transition:opacity .35s ease,transform .35s var(--ease),font-weight .35s ease}.interactive-process .step.active .step-copy h3,.interactive-process .step:hover .step-copy h3{font-weight:700;opacity:1;transform:none}
.interactive-process .step-copy p{font-size:12px;line-height:1.5;color:var(--muted);max-width:520px;margin:7px 0 0;opacity:.8;transform:none;transition:opacity .4s ease,transform .45s var(--ease)}.interactive-process .step.active .step-copy p,.interactive-process .step:hover .step-copy p,.interactive-process .step:focus-visible .step-copy p{opacity:1;transform:none}
.interactive-process .step-line{display:block;height:1px;background:#dfe3e9;position:relative;align-self:center;overflow:visible}.interactive-process .step.active .step-line:after{display:none}.interactive-process .step-line:before{content:"";position:absolute;right:-1px;top:-3px;width:7px;height:7px;border:1px solid #aeb6c4;border-radius:50%;background:#fff;transition:border-color .35s ease,background .35s ease,box-shadow .35s ease}.interactive-process .step.active .step-line:before{border-color:var(--process-accent);background:var(--process-accent);box-shadow:0 0 0 5px rgba(23,62,129,.08)}.interactive-process .step-line span{position:absolute;left:0;top:-1px;width:var(--step-progress,0%);height:3px;border-radius:2px;background:var(--process-accent);transition:width .2s linear}.interactive-process .step.active .step-line span{box-shadow:0 0 10px rgba(23,62,129,.18)}
@media(max-width:640px){.interactive-process{padding:8px 0}.interactive-process:before,.interactive-process:after{left:19px;top:8px;bottom:8px}.interactive-process .step{grid-template-columns:40px minmax(0,1fr);gap:12px;min-height:0;padding:19px 4px 19px 0}.interactive-process .step:hover,.interactive-process .step.active,.interactive-process .step:focus-visible{transform:none}.interactive-process .step:before{background:linear-gradient(90deg,rgba(238,243,250,.98),rgba(238,243,250,0) 88%)}.interactive-process .step-num{align-items:flex-start;justify-content:center;padding-left:0;position:relative;z-index:2}.interactive-process .step-num span{background:#fff;padding:2px 0}.interactive-process .step.active .step-num span{background:#eef3fa}.interactive-process .step-num svg{display:none}.interactive-process .step-copy p{opacity:1;transform:none;margin-top:6px}.interactive-process .step-line{grid-column:2;width:100%;margin-top:12px}}
@media(prefers-reduced-motion:reduce){.interactive-process:after,.interactive-process .step,.interactive-process .step:before,.interactive-process .step-num,.interactive-process .step-num svg,.interactive-process .step-copy,.interactive-process .step-copy h3,.interactive-process .step-copy p,.interactive-process .step-line span{transition:none!important;animation:none!important}}
