/* Dedicated source-to-market story. Stable copy remains visible while the
   route indicator supplies the short explanatory animation. */
.howwork-hero{position:relative;overflow:hidden;padding-block:clamp(72px,9vw,132px)}
.howwork-hero::after{content:"";position:absolute;right:-9vw;bottom:-22vw;width:min(54vw,760px);aspect-ratio:1;border:1px solid var(--line-on-deep);border-radius:50%;box-shadow:0 0 0 56px rgba(255,255,255,.025),0 0 0 112px rgba(255,255,255,.018);pointer-events:none}
.howwork-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);align-items:end;gap:clamp(48px,8vw,128px)}
.howwork-hero-copy{max-width:780px}
.howwork-hero .eyebrow{color:var(--focus-on-dark)}
.howwork-hero h1{max-width:13ch;margin:0 0 var(--s-4);color:var(--white)}
.howwork-hero .lede{max-width:64ch;margin:0;color:var(--on-deep-2)}
.howwork-hero-actions{margin-top:var(--s-6)}
.howwork-signature{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:var(--s-3);padding:var(--s-4) 0;color:var(--on-deep)}
.howwork-signature-word{font-family:var(--data);font-size:var(--fs-micro);font-weight:var(--fw-micro);letter-spacing:var(--ls-micro);text-transform:uppercase}
.howwork-signature-line{position:relative;height:1px;background:var(--line-on-deep-2)}
.howwork-signature-line::after{content:"";position:absolute;right:0;top:50%;width:8px;height:8px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.howwork-signature-line i{position:absolute;top:50%;left:0;width:10px;height:10px;border-radius:50%;background:var(--focus-on-dark);box-shadow:0 0 0 5px rgba(228,238,218,.14);transform:translate(-50%,-50%);animation:howwork-travel 6s cubic-bezier(.45,0,.2,1) infinite}

.howwork-journey{overflow:hidden}
.howwork-journey-head{display:grid;grid-template-columns:minmax(0,.9fr) minmax(320px,1.1fr);align-items:end;gap:clamp(36px,7vw,100px);margin-bottom:clamp(48px,7vw,88px)}
.howwork-journey-head h2{max-width:18ch;margin:0}
.howwork-journey-head>p{max-width:68ch;margin:0;color:var(--muted);font-size:var(--fs-lede);line-height:var(--lh-lede)}
.howwork-route-wrap{position:relative}
.howwork-route-rail{position:absolute;z-index:0;top:31px;left:6.5%;right:6.5%;height:2px;background:var(--line);overflow:visible}
.howwork-route-rail span{position:absolute;inset:0 auto 0 0;width:100%;transform:scaleX(0);transform-origin:left;background:var(--sage);animation:howwork-draw 6s cubic-bezier(.45,0,.2,1) infinite}
.howwork-route-rail span::after{content:"";position:absolute;right:0;top:50%;width:12px;height:12px;border-radius:50%;background:var(--deep);box-shadow:0 0 0 6px rgba(44,95,45,.14);transform:translate(50%,-50%)}
.howwork-route{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0;padding:0;list-style:none}
.howwork-stage{min-width:0;padding:0 clamp(12px,1.6vw,24px) var(--s-5);text-align:center}
.howwork-stage-marker{display:grid;place-items:center;width:64px;height:64px;margin:0 auto var(--s-5);border:1px solid var(--sage-2);border-radius:50%;background:var(--paper);color:var(--deep);box-shadow:0 0 0 8px var(--paper);animation:howwork-stage 6s ease-in-out infinite;animation-delay:calc(var(--stage-index) * 2s)}
.howwork-stage-marker .en-icon{width:26px;height:26px}
.howwork-stage-number{margin:0 0 var(--s-2);font-family:var(--data);font-size:var(--fs-micro);font-weight:var(--fw-micro);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--sage)}
.howwork-stage h3{margin:0 0 var(--s-2);font-size:clamp(1.08rem,1.35vw,1.35rem)}
.howwork-stage>p:last-child{max-width:36ch;margin:0 auto;color:var(--muted)}
.howwork-accountability{display:flex;align-items:center;justify-content:center;gap:var(--s-3);max-width:760px;margin:clamp(40px,6vw,72px) auto 0;padding:var(--s-4) var(--s-5);border:1px solid var(--line);background:var(--mist);color:var(--deep);text-align:center}
.howwork-accountability .en-icon{width:22px;height:22px}
.howwork-content{max-width:840px}
.howwork-outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--sage-2);border-bottom:1px solid var(--sage-2)}
.howwork-outcome{min-width:0;padding:clamp(28px,3.5vw,52px)}
.howwork-outcome+.howwork-outcome{border-left:1px solid var(--sage-2)}
.howwork-outcome>span{display:grid;place-items:center;width:48px;height:48px;margin-bottom:var(--s-5);border:1px solid var(--sage-2);border-radius:50%;background:var(--paper);color:var(--deep)}
.howwork-outcome .en-icon{width:22px;height:22px}
.howwork-outcome h3{margin-bottom:var(--s-3)}
.howwork-outcome p{margin:0;color:var(--muted)}

@keyframes howwork-travel{0%,8%{left:0}42%{left:50%}76%,100%{left:100%}}
@keyframes howwork-draw{0%,8%{transform:scaleX(0)}76%,100%{transform:scaleX(1)}}
@keyframes howwork-stage{0%,18%,100%{border-color:var(--sage-2);box-shadow:0 0 0 8px var(--paper)}28%,40%{border-color:var(--deep);box-shadow:0 0 0 8px var(--paper),0 0 0 10px rgba(44,95,45,.16)}}

@media(max-width:1100px){
	.howwork-hero-grid,.howwork-journey-head{grid-template-columns:1fr}
	.howwork-signature{max-width:540px}
	.howwork-journey-head{align-items:start}
	.howwork-route-rail{display:none}
	.howwork-route{grid-template-columns:1fr;gap:0}
	.howwork-stage{position:relative;padding:0 0 var(--s-7) 88px;text-align:left}
	.howwork-stage:not(:last-child)::after{content:"";position:absolute;left:31px;top:66px;bottom:2px;width:1px;background:var(--sage-2)}
	.howwork-stage-marker{position:absolute;left:0;top:0;margin:0;box-shadow:0 0 0 6px var(--paper)}
	.howwork-stage>p:last-child{margin:0;max-width:52ch}
	.howwork-accountability{margin-top:0}
	.howwork-outcome-grid{grid-template-columns:1fr}
	.howwork-outcome+.howwork-outcome{border-left:0;border-top:1px solid var(--sage-2)}
}
@media(max-width:520px){
	.howwork-hero{padding-block:var(--s-8)}
	.howwork-signature{grid-template-columns:1fr;gap:var(--s-2)}
	.howwork-signature-line{width:100%}
	.howwork-signature-word:last-child{text-align:right}
	.howwork-stage{padding-left:76px}
	.howwork-stage-marker{width:56px;height:56px}
	.howwork-stage:not(:last-child)::after{left:27px;top:58px}
	.howwork-accountability{align-items:flex-start;text-align:left}
}
@media(prefers-reduced-motion:reduce){
	.howwork-signature-line i,.howwork-route-rail span,.howwork-stage-marker{animation:none}
	.howwork-signature-line i{left:100%}
	.howwork-route-rail span{transform:scaleX(1)}
}
