.roadmap {padding-block:72px 64px;scroll-margin-top:28px}
.roadmap-stages {
  position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px 30px;list-style:none;margin:0;padding:0;
}
.roadmap-stage {
  position:relative;min-width:0;display:flex;flex-direction:column;
  padding:24px;background:var(--paper-light);border:1px solid var(--line);border-radius:3px;
}
.roadmap-stage.is-current {background:#e9ecdf;border-color:#b4bea3}
.roadmap-stage-top {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:28px}
.roadmap-number {
  display:grid;place-items:center;width:42px;height:42px;flex:none;
  border:1px solid #bba982;border-radius:50%;color:var(--accent);font:italic 21px/1 var(--serif);
}
.roadmap-status {font-size:10px;letter-spacing:.04em;color:var(--muted)}
.is-current .roadmap-status {color:var(--ink)}
.is-current .roadmap-status::before {content:'';display:inline-block;width:6px;height:6px;background:var(--moss);border-radius:50%;margin-right:7px}
.roadmap-kicker {font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.roadmap-stage h3 {font:normal 27px/1.12 var(--serif);letter-spacing:-.03em;margin:0 0 18px;text-wrap:balance}
.roadmap-stage h3+p {font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 24px}
.roadmap-outcome {margin:auto 0 0;padding-top:16px;border-top:1px solid var(--line);font:italic 14px/1.5 var(--serif);color:var(--ink)}
.roadmap-note {max-width:750px;font-size:12px;line-height:1.7;color:var(--muted);margin:26px 0 0}
.roadmap-controls {display:flex;align-items:center;gap:12px;margin-top:14px;color:var(--muted);font-size:11px}
.roadmap-controls[hidden] {display:none}
.roadmap-controls button {display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:1px solid var(--line);border-radius:3px;background:var(--paper-light);color:var(--ink);font:22px/1 var(--serif);cursor:pointer}
.roadmap-controls button:disabled {opacity:.3;cursor:default}
.roadmap-position {margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.roadmap :is(button,.roadmap-stages):focus-visible {outline:2px solid var(--accent);outline-offset:4px}
@media (min-width:1101px) {.navigation{gap:24px}}
@media (min-width:761px) and (max-width:1100px) {
  .navigation{flex-wrap:wrap;column-gap:16px;row-gap:8px;justify-content:center}
  .navigation a{white-space:nowrap}
}
@media (min-width:761px) and (max-width:1000px) {.roadmap-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px) {
  .roadmap{padding-block:42px}
  .roadmap .section-heading{margin-bottom:24px;gap:18px}
  .roadmap-stages {
    display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc(100% - 22px);
    gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;
    overscroll-behavior-x:contain;padding-bottom:10px;scrollbar-width:thin;scrollbar-color:#b4bea3 transparent;
  }
  .roadmap-stage{padding:20px;scroll-snap-align:start}
  .roadmap-stage-top{margin-bottom:20px}
  .roadmap-stage h3{font-size:27px;margin-bottom:14px}
  .roadmap-stage h3+p{font-size:12px;margin-bottom:18px}
  .roadmap-note{font-size:11px;margin-top:18px}
}
