/* Adapts the original site's journey rail to the situation-led layout.
   The rail runs between marker centres, with understated active rings. */
.v1b-method-layout {
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr);
  gap: clamp(48px, 7vw, 112px);
}
.v1b-method-intro h2 { font-size: clamp(40px, 4.3vw, 62px); }
.v1b-method-list[data-approach-journey] {
  --method-progress: 0;
  --rail-top: 46px;
  --rail-height: 0px;
  --rail-left: 15px;
  isolation: isolate;
}
.v1b-method-list::before,
.v1b-method-list::after {
  left: var(--rail-left);
  top: var(--rail-top);
  bottom: auto;
  width: 1px;
  height: var(--rail-height);
  pointer-events: none;
}
.v1b-method-list::before { background: rgba(123, 200, 255, .16); }
.v1b-method-list::after {
  background: linear-gradient(180deg, #4b97ff, #9ed4ff);
  box-shadow: 0 0 8px rgba(75, 151, 255, .2);
  transform: scaleY(var(--method-progress));
  transition: transform 180ms linear;
}
.v1b-method-list li {
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 26px;
  min-height: 146px;
  padding: 30px 0;
  border: 0;
}
.v1b-method-list li + li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 56px;
  right: 0;
  height: 1px;
  background: rgba(255, 255, 255, .075);
}
.v1b-method-list h3 {
  max-width: 640px;
  font-size: clamp(25px, 2.4vw, 34px);
  line-height: 1.12;
  letter-spacing: -.035em;
}
.v1b-method-list p { max-width: 600px; line-height: 1.65; }
.v1b-method-list .v1b-method-index {
  position: relative;
  width: 30px;
  height: 30px;
  margin-top: 3px;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  color: #8998af;
  background: #0b0c11;
  border-color: rgba(123, 200, 255, .26);
  box-shadow: none;
  transition: border-color 240ms ease, color 240ms ease, box-shadow 240ms ease;
}
.v1b-method-list li.is-complete .v1b-method-index {
  color: #b3d8ff;
  border-color: #4b97ff;
}
.v1b-method-list li.is-current .v1b-method-index {
  color: #e8f4ff;
  background: #10213a;
  border-color: #80bbff;
  box-shadow: 0 0 0 5px rgba(106, 166, 255, .07), 0 0 16px rgba(75, 151, 255, .16);
}
@media (max-width: 980px) {
  .v1b-method-layout { grid-template-columns: 1fr; gap: 34px; }
  .v1b-method-intro h2, .v1b-method-intro > p { max-width: 680px; }
}
@media (max-width: 680px) {
  .v1b-method-layout { gap: 24px; }
  .v1b-method-list li { gap: 18px; padding: 26px 0; min-height: 0; }
  .v1b-method-list li + li::before { left: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .v1b-method-list::after,
  .v1b-method-list .v1b-method-index { transition: none; }
}