/* EngiTools workflow roadmap — a scroll-driven engineering path */
.workflow-road-section{
  position:relative;
  overflow:clip;
  background:var(--brand-paper,#f3f3ef)!important;
  padding:clamp(72px,8vw,118px) 0 clamp(88px,9vw,132px)!important;
}
.workflow-road-section:before{border-top-color:var(--brand-line)!important}
.workflow-road-head{
  width:min(1320px,calc(100% - 48px));
  margin:0 auto clamp(42px,5vw,68px);
}
.workflow-road-head .section-head{margin-bottom:0!important}
.workflow-road-kicker-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:14px;
  color:var(--brand-muted,#6f6f68);
  font-size:10px;
  letter-spacing:.16em;
  direction:ltr;
}
.workflow-road-kicker-row:after{
  content:"";
  height:1px;
  flex:1;
  max-width:180px;
  background:var(--brand-line);
}
.workflow-road-canvas{
  --road-progress:0;
  position:relative;
  width:min(1320px,calc(100% - 48px));
  height:clamp(620px,52vw,760px);
  margin:0 auto;
  isolation:isolate;
}
.workflow-road-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  z-index:0;
}
.workflow-road-svg-mobile{display:none}
.workflow-road-track,
.workflow-road-progress{
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.workflow-road-track{
  stroke:rgba(10,10,10,.11);
  stroke-width:22;
}
.workflow-road-track-center{
  fill:none;
  stroke:rgba(255,255,255,.78);
  stroke-width:1.5;
  stroke-dasharray:9 12;
  stroke-linecap:round;
}
.workflow-road-progress{
  stroke:var(--brand-ink,#0a0a0a);
  stroke-width:22;
  filter:none;
}
.workflow-road-runner{
  fill:var(--brand-paper,#f3f3ef);
  stroke:var(--brand-ink,#0a0a0a);
  stroke-width:6;
}
.workflow-road-runner-core{fill:var(--brand-ink,#0a0a0a)}
.workflow-stop{
  position:absolute;
  z-index:2;
  width:min(250px,22vw);
  opacity:.42;
  transform:translateY(14px) scale(.985);
  transition:opacity .38s var(--brand-ease),transform .48s var(--brand-ease);
}
.workflow-stop.is-active{
  opacity:1;
  transform:translateY(0) scale(1);
}
.workflow-stop.is-passed{opacity:.72}
.workflow-stop-1{right:1.5%;top:3%}
.workflow-stop-2{right:25.5%;top:35%}
.workflow-stop-3{
  left:31%;
  top:9%;
  width:96px;
}
.workflow-stop-3 .workflow-stop-copy{
  position:absolute;
  top:0;
  right:calc(100% + 28px);
  width:330px;
  margin-top:0;
  padding-top:16px;
  text-align:right;
  direction:rtl;
}
.workflow-stop-4{left:1.5%;top:57%}
.workflow-stop-badge{
  width:96px;
  height:96px;
  display:grid;
  place-content:center;
  text-align:center;
  border:1.5px solid var(--brand-ink,#0a0a0a);
  border-radius:50%;
  background:var(--brand-paper,#f3f3ef);
  color:var(--brand-ink,#0a0a0a);
  transition:background .35s var(--brand-ease),color .35s var(--brand-ease),transform .35s var(--brand-ease);
  box-shadow:0 0 0 10px var(--brand-paper,#f3f3ef);
}
.workflow-stop.is-active .workflow-stop-badge,
.workflow-stop.is-passed .workflow-stop-badge{
  background:var(--brand-ink,#0a0a0a);
  color:#fff;
}
.workflow-stop.is-active .workflow-stop-badge{transform:scale(1.08)}
.workflow-stop-badge strong{
  font-size:28px;
  line-height:1;
  font-weight:700;
  letter-spacing:-.04em;
}
.workflow-stop-badge small{
  margin-top:8px;
  font-size:8px;
  letter-spacing:.18em;
  font-weight:600;
}
.workflow-stop-copy{
  margin-top:22px;
  padding-top:16px;
  border-top:1px solid var(--brand-line);
}
.workflow-stop-copy h3{
  margin:0 0 8px;
  font-size:clamp(20px,1.9vw,29px)!important;
  line-height:1.35;
  font-weight:580!important;
}
.workflow-stop-copy p{
  margin:0 0 12px;
  font-size:14px;
  line-height:1.85;
  color:var(--brand-muted,#6f6f68);
}
.workflow-stop-copy em{
  font-style:normal;
  font-size:9px;
  letter-spacing:.15em;
  color:rgba(10,10,10,.42);
  direction:ltr;
  display:inline-block;
}
.workflow-road-caption{
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  font-size:9px;
  letter-spacing:.18em;
  color:rgba(10,10,10,.35);
  direction:ltr;
  white-space:nowrap;
}

@media(max-width:1080px){
  .workflow-road-canvas{height:680px}
  .workflow-stop{width:min(225px,23vw)}
  .workflow-stop-1{right:1%;top:5%}
  .workflow-stop-2{right:24%;top:38%}
  .workflow-stop-3{left:30%;top:11%;width:90px}
  .workflow-stop-3 .workflow-stop-badge{width:90px;height:90px}
  .workflow-stop-3 .workflow-stop-copy{
    right:calc(100% + 22px);
    width:min(270px,25vw);
  }
  .workflow-stop-4{left:1%;top:59%}
}

@media(max-width:760px){
  .workflow-road-section{padding:64px 0 90px!important}
  .workflow-road-head,.workflow-road-canvas{width:calc(100% - 36px)}
  .workflow-road-canvas{height:1080px;max-width:520px}
  .workflow-road-svg-desktop{display:none}
  .workflow-road-svg-mobile{
    display:block;
    inset:0 auto 0 0;
    width:112px;
    overflow:hidden;
  }
  .workflow-road-track,.workflow-road-progress{stroke-width:16}
  .workflow-road-track-center{stroke-width:1.2;stroke-dasharray:7 10}
  .workflow-stop,
  .workflow-stop-3{
    right:0!important;
    left:0!important;
    width:100%;
    min-height:190px;
    text-align:right;
    display:block;
  }
  .workflow-stop-badge,
  .workflow-stop-3 .workflow-stop-badge{
    position:absolute;
    top:0;
    left:8px;
    width:80px;
    height:80px;
    box-shadow:0 0 0 8px var(--brand-paper,#f3f3ef);
  }
  .workflow-stop-badge strong{font-size:24px}
  .workflow-stop-copy,
  .workflow-stop-3 .workflow-stop-copy{
    position:absolute;
    top:0;
    right:0;
    width:calc(100% - 126px);
    margin:0;
    padding:10px 0 8px;
    direction:rtl;
    background:var(--brand-paper,#f3f3ef);
    border-radius:0;
    box-shadow:0 0 0 10px var(--brand-paper,#f3f3ef);
  }
  .workflow-stop-1{top:1%}
  .workflow-stop-2{top:28%}
  .workflow-stop-3{top:54%}
  .workflow-stop-4{top:79%}
  .workflow-road-caption{bottom:-8px}
}

@media(max-width:480px){
  .workflow-road-canvas{height:1040px}
  .workflow-stop,.workflow-stop-3{width:100%}
  .workflow-stop-copy p{font-size:13px}
}

@media(prefers-reduced-motion:reduce){
  .workflow-stop{opacity:1!important;transform:none!important;transition:none!important}
  .workflow-stop-badge{transition:none!important}
  .workflow-road-progress{stroke-dashoffset:0!important}
}
