/* How it works journey */
.journey {
  display:grid;
  gap:var(--space-4);
}
.jstep {
  display:grid;
  gap:var(--space-4);
  padding:22px var(--space-5);
  background:var(--color-white);
  border:1px solid var(--color-border);
  border-radius:var(--radius-xl);
}
.jn {
  display:flex;
  align-items:center;
  gap:var(--space-3);
}
.jn b {
  font-family:var(--font-heading);
  font-size:var(--fs-56);
  line-height:.9;
  font-weight:600;
  color:var(--color-primary);
}
.jtag {
  display:inline-block;
  padding:var(--space-1) 10px;
  border-radius:var(--radius-sm);
  font-size:var(--fs-12_5);
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  background:var(--color-success-tint);
  color:var(--color-secondary-dark);
}
.jstep h3 {
  font-family:var(--font-heading);
  font-size:var(--fs-28);
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--color-text);
}
.jstep p {
  font-size:var(--font-size-md);
  color:var(--color-text-mid);
  margin-top:var(--space-2);
}
.jstep .jd {
  font-size:var(--font-size-sm);
  color:var(--color-muted);
}
.jvis {
  padding:var(--space-5);
  border-radius:var(--radius-lg);
  background:var(--color-surface-alt);
}
.mk-card {
  display:grid;
  gap:10px;
  max-width:300px;
  margin:0 auto;
  padding:var(--space-4);
  background:var(--color-white);
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
}
.mk-lbl {
  display:block;
  height:8px;
  width:42%;
  border-radius:var(--radius-xs);
  background:var(--color-line);
}
.mk-lbl.s {
  width:28%;
}
.mk-inp {
  display:block;
  height:32px;
  border:1.5px solid var(--color-input-border);
  border-radius:var(--radius-md);
  background:var(--color-white);
}
.mk-btn {
  display:block;
  height:34px;
  width:58%;
  border-radius:var(--radius-md);
  background:var(--color-accent);
  margin-top:2px;
}
.mk-drop {
  display:block;
  height:64px;
  border:1.5px dashed var(--color-input-border);
  border-radius:var(--radius-lg);
  background:var(--color-surface-warm);
}
.mk-file {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:var(--fs-13_5);
  font-weight:600;
  color:var(--color-text);
}
.mk-row {
  display:flex;
  align-items:center;
  gap:10px;
}
.mk-bar {
  display:block;
  height:8px;
  border-radius:var(--radius-xs);
  background:var(--color-line);
  flex:1;
}
.mk-wait {
  flex:none;
  width:22px;
  height:22px;
  border-radius:var(--radius-round);
  border:2px solid var(--color-warn-dot);
  background:var(--color-warn-wash);
}
.mk-flow {
  display:flex;
  align-items:center;
  gap:6px;
  max-width:320px;
  margin:0 auto;
}
.mk-node {
  flex:1;
  padding:14px 6px;
  border-radius:var(--radius-md);
  background:var(--color-white);
  border:1px solid var(--color-border);
  font-size:var(--font-size-xs);
  font-weight:700;
  text-align:center;
  color:var(--color-text);
}
.mk-arr {
  flex:none;
  color:var(--color-input-border);
  font-size:var(--fs-16);
}
.mk-docs {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-width:320px;
  margin:0 auto;
}
.mk-doc {
  display:flex;
  align-items:center;
  gap:var(--space-2);
  padding:10px;
  background:var(--color-white);
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  font-size:var(--fs-12_5);
  font-weight:600;
  line-height:1.2;
  color:var(--color-text);
}
.mk-doc i {
  flex:none;
  display:grid;
  place-items:center;
  width:28px;
  height:34px;
  border-radius:var(--radius-xs);
  border:1.5px solid var(--color-primary);
  font-style:normal;
  font-size:var(--fs-9);
  font-weight:700;
  color:var(--color-primary);
}
@media (min-width:860px){
  .journey {
    gap:var(--space-5);
  }
  .jvis {
    padding:var(--space-8) 28px;
  }
  .jstep {
    grid-template-columns:150px minmax(0,1fr) minmax(0,.85fr);
    align-items:center;
    gap:var(--space-12);
    padding:var(--space-10) var(--space-12);
  }
  .jn {
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
  }
  .jn b {
    font-size:var(--fs-104);
  }
  .jstep h3 {
    font-size:var(--fs-36);
  }
  .jstep p {
    font-size:var(--fs-18_5);
  }
}