.workflow{padding:76px 0;border-block:1px solid var(--line);background:color-mix(in srgb,var(--blue) 5%,var(--paper));scroll-margin-top:90px}.workflow-layout{display:grid;grid-template-columns:.9fr 1.55fr;gap:70px;align-items:start}.workflow-intro h2{font-size:clamp(36px,4vw,56px);line-height:1.35;margin:18px 0 20px;letter-spacing:-.035em}.workflow-intro>p{font-size:15px;line-height:1.85;color:var(--muted);margin:0 0 28px}.workflow-intro .button{font-size:13px;gap:34px}.workflow-trail{display:flex;align-items:center;width:180px;margin-top:38px}.workflow-trail i{width:9px;height:9px;border:1.5px solid var(--blue);background:var(--paper);rotate:45deg}.workflow-trail i:first-child{background:var(--blue)}.workflow-trail span{flex:1;height:1px;background:var(--blue);opacity:.3}.workflow-steps{list-style:none;padding:0;margin:0;display:grid;gap:14px}.workflow-step{position:relative;display:grid;grid-template-columns:48px 1fr 24px;gap:22px;padding:25px 24px;border:1px solid var(--line);border-radius:4px 4px 20px 4px;background:color-mix(in srgb,var(--paper) 94%,var(--blue));transition:transform .25s,border-color .25s}.workflow-step:hover{border-color:var(--blue);transform:translateX(4px)}.workflow-number{display:grid;place-items:center;align-self:start;width:48px;height:48px;border:1px solid var(--blue);border-radius:3px;font-size:20px;font-weight:500;color:var(--blue);font-variant-numeric:tabular-nums}.workflow-step:last-child .workflow-number{background:var(--blue);color:var(--paper)}.workflow-label{display:block;color:var(--blue);font-size:9px;font-weight:600;letter-spacing:.15em;margin-bottom:6px}.workflow-step h3{font-size:21px;line-height:1.5;margin:0 0 8px;font-weight:600;letter-spacing:-.02em}.workflow-step p{color:var(--muted);font-size:14px;line-height:1.9;margin:0}.workflow-arrow{font-size:23px;color:var(--blue);align-self:start;font-weight:400}
@media(max-width:900px){.workflow-layout{grid-template-columns:1fr;gap:35px}.workflow-intro h2 br{display:none}.workflow-intro h2{margin-top:12px}.workflow-trail{display:none}.workflow-intro>p br{display:none}}
@media(max-width:600px){.workflow{padding:50px 0}.workflow-layout{gap:28px}.workflow-step{grid-template-columns:38px 1fr;gap:15px;padding:22px 18px}.workflow-number{width:38px;height:38px;font-size:17px}.workflow-step h3{font-size:19px}.workflow-step p{font-size:13px}.workflow-arrow{display:none}.workflow-intro h2{font-size:34px}.workflow-intro>p{font-size:14px;margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.workflow-step{transition:none}.workflow-step:hover{transform:none}}
