/* how it works: three numbered steps (template "Stats" cells) */
.hw__rails { padding: 120px 0 0; display: flex; flex-direction: column; gap: 56px; }
.hw__grid { display: flex; width: 100%; box-shadow: inset 0 1px var(--line); list-style: none; margin: 0; padding: 0; }
.hw__step { flex: 1 0 0; min-width: 0; display: flex; flex-direction: column; gap: 12px; padding: 40px 40px 56px; }
.hw__step + .hw__step { box-shadow: inset 1px 0 var(--line); }
.hw__step h3 { margin-top: 16px; font: 600 22px/1.25 var(--f-display); letter-spacing: -0.02em; color: var(--text); }
.hw__step p { font: 400 15px/1.5 var(--f-body); color: var(--muted); max-width: 320px; }
@media (max-width: 1199.98px) { .hw__rails { padding-top: 96px; gap: 44px; } .hw__step { padding: 36px 32px 44px; } }
@media (max-width: 809.98px) { .hw__rails { padding-top: 72px; gap: 36px; } .hw__grid { flex-direction: column; } .hw__step { padding: 32px 16px 40px; } .hw__step + .hw__step { box-shadow: inset 0 1px var(--line); } }