/* Explain the two internal projects without replacing their evidence or controls. */
.case-journey, .case-application {
  --journey-ink: #edf2fc;
  --journey-muted: #c3d3e9;
  --journey-line: #6885ad80;
  --journey-accent: #b1ccfa;
}
.case-journey {
  list-style: none;
  margin: 23px 0 24px;
  padding: 0;
}
.case-journey > li {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 0 0 17px;
}
.case-journey > li:last-child { padding-bottom: 0; }
.case-journey > li:not(:last-child)::before {
  content: "";
  position: absolute;
  width: 1px;
  left: 13px;
  top: 32px;
  bottom: 5px;
  background: var(--journey-line);
}
.case-step-number {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--journey-line);
  border-radius: 50%;
  color: var(--journey-accent);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.case-journey strong {
  display: block;
  color: var(--journey-ink);
  font-size: 14px;
  font-weight: 650;
  line-height: 1.55;
  margin-bottom: 3px;
}
.case-step-copy {
  display: block;
  color: var(--journey-muted);
  font-size: 13px;
  line-height: 1.7;
}
.art-directed .w-case-copy > .case-application {
  border-top: 1px solid var(--journey-line);
  padding-top: 17px;
  margin: 0 0 22px;
  color: var(--journey-muted);
  font-size: 14px;
  line-height: 1.8;
}
.case-application > strong {
  display: block;
  color: var(--journey-ink);
  font-size: 13px;
  font-weight: 650;
  margin-bottom: 5px;
}
.projects-showcase .case-journey { margin: 18px 0 25px; }
.projects-showcase #panel .case-journey {
  --journey-ink: #1b3554;
  --journey-muted: #3c5270;
  --journey-line: #8199ba;
  --journey-accent: #2d5184;
}
.projects-showcase .case-journey strong { font-size: 15px; }
.projects-showcase .case-step-copy { font-size: 14px; }
.projects-showcase .case-fit { padding-top: 20px; border-top: 1px solid #99abc3; }
.projects-showcase #crm .case-fit { border-top-color: #6b88b0; }
.projects-showcase .case-fit .text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #2d5184;
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.projects-showcase #crm .case-fit .text-link { color: #c2d7ff; }
@media (max-width: 640px) {
  .case-journey { margin-top: 21px; }
  .case-journey > li { gap: 11px; }
  .case-step-copy { font-size: 14px; }
}