/* Five visible stages, with a horizontal route on desktop and a vertical route on smaller screens. */
.roadmap-heading { align-items: center; }
.roadmap-count { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 9px 17px; border: 1px solid #c9d8b7; border-radius: 30px; background: #eaf1df; color: #345e3c; font-size: 14px; line-height: 1.6; font-weight: 600; }
.pilot-roadmap { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; list-style: none; padding: 0; margin: 0; }
.roadmap-step { position: relative; display: flex; flex-direction: column; min-width: 0; }
.roadmap-step:not(:last-child)::after { content: ""; position: absolute; left: 24px; top: 23px; width: calc(100% + 18px); height: 2px; background: #c5d6b4; }
.roadmap-node { position: relative; z-index: 1; display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; margin-bottom: 23px; border-radius: 50%; background: #254f39; color: #f4f8ed; box-shadow: 0 0 0 7px var(--paper); font: 600 16px/1 var(--mono); }
.roadmap-card { position: relative; z-index: 1; display: flex; flex-direction: column; flex: 1; min-width: 0; padding: 21px 20px; border: 1px solid #d3dfc7; border-radius: 14px; background: #fffef9; box-shadow: 0 8px 23px #29462c05; }
.roadmap-work { min-width: 0; flex: 1; }
.roadmap-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 18px; color: #66884b; }
.roadmap-card-top > .icon { width: 24px; height: 24px; }
.roadmap-role { display: inline-block; color: #5d7450; font-size: 12px; font-weight: 500; line-height: 1.7; }
.roadmap-card h3 { min-height: 3em; margin: 0; color: #234b35; font-size: 20px; line-height: 1.5; font-weight: 600; letter-spacing: -.35px; }
.roadmap-card p { margin-top: 12px; color: #596d50; font-size: 16px; line-height: 1.8; }
.roadmap-output { min-height: 96px; margin-top: 24px; padding-top: 17px; border-top: 1px solid #dce5d2; }
.roadmap-output > span { display: block; color: #718363; font-size: 12px; line-height: 1.7; }
.roadmap-output > strong { display: block; margin-top: 6px; color: #345b38; font-size: 15px; font-weight: 600; line-height: 1.7; }
.roadmap-review { display: flex; align-items: flex-start; gap: 16px; margin-top: 27px; padding: 21px 24px; border: 1px solid #dbe4cf; border-radius: 10px; background: #edf3e4; }
.roadmap-review > .icon { width: 22px; height: 22px; margin-top: 3px; color: #6b8c50; }
.roadmap-review strong { display: block; color: #375e3a; font-size: 15px; font-weight: 600; line-height: 1.7; }
.roadmap-review p { margin-top: 4px; color: #5a7050; font-size: 15px; line-height: 1.8; }
.roadmap-inputs { margin-top: 44px; }
.roadmap-inputs > h3 { font-size: 23px; font-weight: 600; line-height: 1.5; color: #254b35; }
.roadmap-inputs .engagement-input-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 35px; }
.roadmap-inputs .engagement-input-list > li:nth-child(2) { padding-top: 0; border-top: 0; }
.roadmap-inputs h4 { font-size: 18px; font-weight: 600; line-height: 1.65; color: #2a4a34; }
.roadmap-inputs p { margin-top: 7px; color: #576b4e; font-size: 16px; line-height: 1.85; }
@media (max-width: 1150px) {
  .pilot-roadmap { display: block; }
  .roadmap-step { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 22px; padding-bottom: 25px; }
  .roadmap-step:last-child { padding-bottom: 0; }
  .roadmap-step:not(:last-child)::after { left: 23px; top: 24px; width: 2px; height: 100%; }
  .roadmap-node { margin-bottom: 0; }
  .roadmap-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .45fr); gap: 28px; padding: 25px; }
  .roadmap-card-top { justify-content: flex-start; gap: 14px; margin-bottom: 12px; }
  .roadmap-card h3 { min-height: 0; }
  .roadmap-output { display: flex; flex-direction: column; justify-content: center; min-height: 0; margin: 0; padding: 0 0 0 24px; border-top: 0; border-left: 1px solid #dce5d2; }
  .roadmap-review { margin-left: 70px; }
}
@media (max-width: 650px) {
  .roadmap-heading { gap: 20px; }
  .roadmap-count { font-size: 13px; padding: 7px 14px; }
  .roadmap-step { grid-template-columns: 38px minmax(0, 1fr); gap: 14px; padding-bottom: 22px; }
  .roadmap-node { width: 38px; height: 38px; font-size: 13px; box-shadow: 0 0 0 5px var(--paper); }
  .roadmap-step:not(:last-child)::after { left: 18px; top: 19px; }
  .roadmap-card { display: flex; gap: 0; padding: 21px; }
  .roadmap-card h3 { font-size: 21px; }
  .roadmap-card p { font-size: 16px; }
  .roadmap-role { font-size: 12px; }
  .roadmap-output { display: block; padding: 15px 0 0; margin-top: 21px; border-left: 0; border-top: 1px solid #dce5d2; }
  .roadmap-output > strong { font-size: 16px; }
  .roadmap-review { margin-left: 0; padding: 19px; gap: 12px; }
  .roadmap-review strong, .roadmap-review p { font-size: 14px; }
  .roadmap-inputs { margin-top: 33px; }
  .roadmap-inputs > h3 { font-size: 22px; }
  .roadmap-inputs .engagement-input-list { grid-template-columns: minmax(0, 1fr); }
  .roadmap-inputs .engagement-input-list > li:nth-child(2) { padding-top: 21px; border-top: 1px solid #d7e1ca; }
}
