/* A single route joins five readable stages; no concealed process copy. */
.tide-process { position:relative; margin-top:42px; }
.tide-route { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.tide-route-track { fill:none; stroke:#59778f; stroke-width:1.5; stroke-dasharray:4 7; }
.tide-route-progress { fill:none; stroke:#bdd8eb; stroke-width:2; stroke-linecap:round; transition:stroke-dashoffset .6s ease; }
#how .tide-process .steps { position:relative; gap:28px; }
#how .tide-process .step {
  position:relative; display:grid; grid-template-columns:52px minmax(0,1fr); gap:24px;
  border:0; border-radius:0; padding:0; background:none; opacity:1; translate:none;
}
#how .tide-process .step:hover { background:none; translate:none; }
#how .tide-process .step-num {
  position:relative; inset:auto; width:52px; height:52px; margin:0;
  background:#19354c; border:1px solid #59778f; color:#a8c0d2;
  transition:background .6s ease,border-color .6s ease,color .6s ease;
}
#how .tide-process .step.tide-reached .step-num { background:#315b7a; border-color:#bdd8eb; color:#fff; }
#how .tide-process .step h3 { display:block; padding:0; min-height:0; margin:9px 0 10px; }
#how .tide-process .step p { padding-bottom:24px; }
@media(min-width:1200px) {
  #how .tide-process .steps { grid-template-columns:repeat(5,minmax(0,1fr)); gap:28px; }
  #how .tide-process .step { display:flex; flex-direction:column; align-items:stretch; gap:24px; }
  #how .tide-process .step-num { align-self:flex-start; }
  #how .tide-process .step > div { max-width:100%; }
  #how .tide-process .step h3 { font-size:19px; line-height:1.4; min-height:54px; margin:0 0 12px; }
  #how .tide-process .step p { font-size:16px; padding:0; }
}
@media(max-width:720px) {
  .tide-process { margin-top:34px; }
  #how .tide-process .steps { gap:28px; }
  #how .tide-process .step { grid-template-columns:40px minmax(0,1fr); gap:18px; }
  #how .tide-process .step-num { width:40px; height:40px; font-size:16px; }
  #how .tide-process .step h3 { margin:6px 0 12px; font-size:18px; }
  #how .tide-process .step p { font-size:15px; padding-bottom:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .tide-route-progress,#how .tide-process .step-num { transition:none; }
}
