/* A compact vertical workflow. Flat Pixelarticons share the site's icon family. */
.pm-home .kickoff-pathway { padding-block: var(--home-section-space); background: var(--pm-snow); scroll-margin-top: 96px; }
.kickoff-shell { max-width: 1200px; margin-inline: auto; padding-inline: 40px; }
.kickoff-heading { margin-bottom: 40px; }
.kickoff-heading h2 { margin: 0 0 16px; }
.kickoff-heading > p { font: 400 var(--pm-type-body)/1.6 var(--font-body); color: var(--pm-slate); margin: 0; }
.kickoff-system { max-width: 780px; }
.kickoff-stages { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; list-style: none; padding: 0; margin: 0; }
.kickoff-stages > li { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 20px; align-items: start; min-width: 0; }
.kickoff-node { position: relative; z-index: 1; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #cbd7e3; border-radius: 3px; background: var(--pm-snow); color: var(--pm-slate); }
.kickoff-stages .is-current .kickoff-node { color: var(--pm-glacier-blue); border-color: var(--pm-glacier-blue); background: var(--pm-frost-light); }
.kickoff-stages .is-done .kickoff-node { color: var(--pm-glacier-blue); border-color: var(--pm-glacier-blue); }
.kickoff-connector { position: absolute; left: 16px; top: 16px; width: 1px; height: calc(100% + 28px); background: #cbd7e3; }
.kickoff-connector.is-connected { background: var(--pm-glacier-blue); }
.kickoff-transfer { position: absolute; inset: 0; }
.kickoff-transfer i { display: none; position: absolute; left: -3px; top: -3px; width: 6px; height: 6px; background: var(--pm-glacier-blue); }
.pm-home #root .kickoff-stage-copy h3 { font: 400 20px/1.35 var(--font-display); letter-spacing: -.015em; margin: 0 0 8px; }
.kickoff-stage-copy > p { font: 400 var(--pm-type-body)/1.6 var(--font-body); color: var(--pm-slate); max-width: 62ch; margin: 0; }
@media (prefers-reduced-motion: no-preference) {
  .kickoff-node { transition: background 200ms ease, border-color 200ms ease, color 200ms ease; }
  .kickoff-pathway[data-running="true"] .is-transferring .kickoff-transfer { animation: kickoff-transfer-y 900ms cubic-bezier(.4, 0, .2, 1) both; }
  .kickoff-pathway[data-running="true"] .is-transferring .kickoff-transfer i { display: block; }
  @keyframes kickoff-transfer-y { from { transform: translateY(0); opacity: 1; } to { transform: translateY(100%); opacity: 0; } }
}
@media (max-width: 900px) { .kickoff-shell { padding-inline: 24px; } }
@media (max-width: 760px) {
  .kickoff-shell { padding-inline: 20px; }
  .kickoff-heading { margin-bottom: 32px; }
  .kickoff-stages > li { gap: 16px; }
  .pm-home #root .kickoff-stage-copy h3 { font-size: 20px; }
}