/* The selected slim, lavender route; shares the site's typography and spacing. */
.work-section{padding-inline:var(--content-gutter);background:var(--sp-background);color:var(--sp-cloud);font-family:'Onest',Arial,sans-serif}
#work>h2{font:400 var(--section-title-size)/1.1 var(--display-font);letter-spacing:-.025em;text-align:center}
#work .work-description{margin:0;text-align:center;color:var(--sp-muted);font:400 14px/20px 'Onest',Arial,sans-serif}
.work-route{position:relative;height:430px;margin-top:32px}
.work-road{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.work-road path{fill:none;stroke:var(--sp-lavender);stroke-width:2.5px;stroke-linecap:round;vector-effect:non-scaling-stroke}
.work-steps{list-style:none;margin:0;padding:0}
.work-steps li{position:absolute;top:var(--step-y);left:0;right:0}
.work-node{position:absolute;left:var(--node-x);top:0;transform:translate(-50%,-50%);z-index:1;display:grid;place-items:center;width:40px;height:40px;box-sizing:border-box;border:1px solid var(--sp-lavender);border-radius:50%;background:var(--sp-background);color:var(--sp-accent);font:400 23px/1 var(--display-font)}
.work-step-copy{position:absolute;top:-15px;left:28%;right:0}
.prototype #work .work-step-copy h3{margin:0;text-align:left;font:400 19px/1.1 var(--display-font);letter-spacing:-.025em}
.prototype #work .work-step-copy p{margin:12px 0 0;text-align:left;color:var(--sp-muted);font:400 14px/20px 'Onest',Arial,sans-serif}
@media(max-width:374px){.prototype #work .work-step-copy h3{font-size:18px}}