.how-rail{--rail-x:28px;gap:clamp(28px,3vw,44px);margin:0;padding:0 0 0 clamp(64px,6vw,88px);list-style:none;display:grid;position:relative}.how-rail:before{content:"";top:28px;bottom:28px;left:var(--rail-x);background:linear-gradient(var(--accent), var(--accent)) top / 100% 100% no-repeat var(--line-strong);transform-origin:top;border-radius:2px;width:2px;position:absolute}.how-stop{position:relative}.how-node{top:26px;left:calc(var(--rail-x) - clamp(64px, 6vw, 88px));z-index:1;border:2px solid var(--line-strong);background:var(--surface);width:56px;height:56px;color:var(--ink-3);font-variant-numeric:tabular-nums;letter-spacing:.04em;border-radius:50%;place-items:center;font-size:14px;font-weight:600;transition:background .3s,border-color .3s,color .3s;display:grid;position:absolute;translate:-50%}@supports (animation-timeline:view()){.how-rail:before{background:var(--accent);animation:linear both how-rail-draw;animation-timeline:view();animation-range:entry 20% exit 80%}.how-node{animation:linear both how-node-light;animation-timeline:view();animation-range:entry 35% entry 60%}}@keyframes how-rail-draw{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes how-node-light{0%{background:var(--surface);border-color:var(--line-strong);color:var(--ink-3)}to{background:var(--accent);border-color:var(--accent);color:#fff}}@supports not (animation-timeline:view()){.how-node{background:var(--accent);border-color:var(--accent);color:#fff}}.how-card{grid-template-columns:minmax(0,1fr) minmax(280px,40%);align-items:center;gap:clamp(24px,3vw,44px);display:grid}.how-card>.minimal-card-copy h2{letter-spacing:-.045em;color:var(--ink);text-wrap:balance;font-size:clamp(24px,2.4vw,32px);font-weight:500;line-height:1.15}.how-card>.minimal-card-copy p{max-width:52ch;color:var(--ink-3);margin-top:14px;font-size:15px;line-height:1.75}.how-step-note{color:var(--ink-4);align-items:flex-start;gap:7px;font-size:13px;display:flex}.how-step-note svg{color:var(--green-ink);flex-shrink:0;margin-top:4px}.how-card>.minimal-art{margin:0}.how-ideas{flex-wrap:wrap;gap:6px;margin-top:12px;display:flex}.how-ideas-label{width:100%;color:var(--ink-3);align-items:center;gap:5px;font-size:11px;display:inline-flex}.how-idea{border:1px solid var(--line);background:var(--surface-subtle);color:var(--ink-2);border-radius:999px;padding:6px 10px;font-size:11.5px}@media (max-width:900px){.how-card{grid-template-columns:minmax(0,1fr)}.how-card>.minimal-art{order:-1}}@media (max-width:640px){.how-rail{--rail-x:18px;padding-left:48px}.how-node{width:38px;height:38px;font-size:12px}}