.how-it-works-pipe{--how-it-works-node:16px;--how-it-works-pad:clamp(26px, 2.6vw, 40px);--how-it-works-gut:clamp(44px, 4.4vw, 72px);position:relative}.how-it-works-pipe__list{margin:0;padding:0;list-style:none}.how-it-works-stage{--f:clamp(0, calc(var(--p,1) * var(--n) - var(--i)), 1);padding:var(--how-it-works-pad) 0 var(--how-it-works-pad) var(--how-it-works-gut);grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:clamp(20px,3.4vw,64px);display:grid;position:relative}.how-it-works-stage:after{content:"";left:var(--how-it-works-gut);background:var(--line);height:1px;position:absolute;bottom:0;right:0}.how-it-works-stage:first-child:before{content:"";left:var(--how-it-works-gut);background:var(--line);height:1px;position:absolute;top:0;right:0}.how-it-works-stage__node{--node:var(--how-it-works-node);left:0;top:calc(var(--how-it-works-pad) + 1px);z-index:2;position:absolute}.how-it-works-stage__seg{--c:calc(var(--how-it-works-pad) + 1px + var(--how-it-works-node) / 2);left:calc(var(--how-it-works-node) / 2 - .5px);top:var(--c);bottom:calc(-1 * var(--c));background:var(--line-2);width:1px;position:absolute}.how-it-works-stage:last-child .how-it-works-stage__seg{display:none}.how-it-works-stage__seg span{background:linear-gradient(180deg, var(--ink), var(--blue));transform-origin:top;width:2px;transform:scaleY(var(--f));border-radius:2px;position:absolute;top:0;bottom:0;left:-.5px;overflow:hidden}.how-it-works-stage__seg span:after{content:"";background:linear-gradient(180deg, transparent, var(--glow) 40%, #fff 50%, var(--glow) 60%, transparent);height:22%;animation:rail-glint-v 4.8s var(--ease-io) 1.5s infinite;position:absolute;top:0;left:0;right:0;transform:translateY(-100%)}.how-it-works-stage__seg:after{content:"";left:-.5px;top:calc(var(--f) * 100%);background:linear-gradient(180deg, transparent, var(--glow));width:2px;height:120px;opacity:clamp(0, calc(min(var(--f), 1 - var(--f)) * 30), 1);position:absolute;transform:translateY(-100%)}.how-it-works-stage__head{flex-direction:column;align-items:flex-start;gap:10px;display:flex}.how-it-works-stage__index{color:var(--ink-3)}.how-it-works-stage__name{font-size:var(--t-h3);letter-spacing:-.02em;font-weight:500;line-height:1.2}.how-it-works-stage__head .tag{margin-top:4px}.how-it-works-stage__body{flex-direction:column;align-items:flex-start;gap:12px;display:flex}.how-it-works-stage__lead{max-width:34ch;font-family:var(--f-display);letter-spacing:-.025em;color:var(--ink);text-wrap:balance;margin:0;font-size:clamp(1.25rem,1.1rem + .6vw,1.625rem);line-height:1.22}.how-it-works-stage__text{max-width:58ch;color:var(--ink-2);margin:0;line-height:1.6}.how-it-works-stage__body .link{margin-top:4px}@media (width<=860px){.how-it-works-pipe{--how-it-works-gut:36px}.how-it-works-stage{grid-template-columns:minmax(0,1fr);gap:16px}}.how-it-works-roles{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3vw,48px) clamp(20px,2.4vw,40px);margin:0;padding:0;list-style:none;display:grid}.how-it-works-role{flex-direction:column;gap:24px;display:flex}.how-it-works-role__copy{flex-direction:column;flex:1;align-items:flex-start;gap:12px;display:flex}.how-it-works-role .pg-media__frame{background:var(--paper)}.how-it-works-role__label{color:var(--ink-3)}.how-it-works-role__title{font-size:var(--t-h3);letter-spacing:-.02em;text-wrap:balance;font-weight:500;line-height:1.2}.how-it-works-role__title em{font-family:var(--f-serif);letter-spacing:-.01em;font-style:italic;font-weight:400}.how-it-works-role__text{color:var(--ink-2);margin:0;font-size:.9875rem;line-height:1.6}.how-it-works-role .link{margin-top:auto;padding-top:6px}.how-it-works-roles__note{border-block:1px solid var(--line);grid-template-columns:minmax(120px,2fr) minmax(0,7fr) auto;align-items:center;gap:clamp(16px,2.4vw,40px);margin-top:clamp(40px,4vw,72px);padding:clamp(20px,2vw,28px) 0;display:grid}.how-it-works-roles__note .mono{color:var(--ink-3)}.how-it-works-roles__note p{max-width:64ch;color:var(--ink-2);margin:0}@media (width<=860px){.how-it-works-roles{grid-template-columns:minmax(0,1fr)}.how-it-works-roles__note{grid-template-columns:minmax(0,1fr);justify-items:start;gap:10px}}@media (width>=641px) and (width<=860px){.how-it-works-roles{row-gap:36px}.how-it-works-role{grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:center;gap:28px;display:grid}.how-it-works-role .link{margin-top:4px}}
