/* Plan above, implementation below: two rails joined by five stages. */
.home-dark-header main>.growth-strategy{background:#171717;color:#fff;overflow:hidden}
.growth-strategy .strategy-kicker,.growth-strategy .strategy-heading>p,.growth-strategy .strategy-bottom p{color:#a3a3a3}
.growth-strategy .strategy-bottom{border-color:#484848}
.growth-strategy .strategy-heading{align-items:center}
.strategy-timeline{--rail-y:354px;position:relative}
.strategy-rail-label{font-size:14px;line-height:22px;color:#a3a3a3;margin-bottom:32px}
.strategy-rail-label>span{color:#fff;letter-spacing:.1em;text-transform:uppercase;margin-right:12px}
.growth-strategy .strategy-steps{position:relative;gap:24px;grid-template-columns:repeat(5,minmax(0,1fr))}
.strategy-steps::before,.strategy-steps::after{content:'';position:absolute;left:0;right:0;pointer-events:none}
.strategy-steps::before{top:0;height:1px;background:repeating-linear-gradient(to right,#656565 0 5px,transparent 5px 12px)}
.strategy-steps::after{top:var(--rail-y);height:2px;background:#ff5a2b;transform-origin:left;z-index:1}
.growth-strategy .strategy-steps li{display:flex;position:relative;padding:64px 8px 0;border:0;text-align:center;gap:0;min-width:0}
.growth-strategy .strategy-number{color:#ff5a2b;margin:0 0 16px;font-size:16px;line-height:24px}
.growth-strategy .strategy-steps h3{font-size:clamp(22px,1.75vw,28px);line-height:1.3;min-height:72px;margin:0 0 12px}
.growth-strategy .strategy-steps li>p{color:#a3a3a3;font-size:16px;line-height:26px;min-height:104px;margin:0}
.growth-strategy .strategy-output{border:0;padding:0;margin:108px 0 0;color:#a3a3a3;font-size:12px;line-height:20px}
.growth-strategy .strategy-output>span{color:#fff;font-size:14px;margin-top:8px}
.strategy-plan-node{position:absolute;width:12px;height:12px;border:1px solid #a3a3a3;border-radius:50%;left:calc(50% - 6px);top:-6px;background:#171717}
.strategy-plan-node::after{content:'';position:absolute;left:4px;top:12px;width:1px;height:32px;background:#484848}
.strategy-check{position:absolute;top:calc(var(--rail-y) - 14px);left:calc(50% - 14px);width:28px;height:28px;border:2px solid #ff5a2b;border-radius:50%;background:#171717;z-index:2;display:grid;place-items:center}
.strategy-check::before{content:'';position:absolute;bottom:28px;left:11px;width:1px;height:72px;background:#484848}
.strategy-check svg{width:22px;height:22px;stroke:#ff5a2b;stroke-width:1.75}
.strategy-check path{stroke-dasharray:24;stroke-dashoffset:0}
.strategy-rail-result{margin:32px 0 0}.strategy-rail-result>span{color:#ff5a2b}
/* Entry draws the implementation rail, then confirms the stages in order. */
.strategy-motion .strategy-steps::after{transform:scaleX(0);transition:transform 1.8s cubic-bezier(.22,1,.36,1)}
.strategy-motion .strategy-number,.strategy-motion .strategy-steps h3,.strategy-motion .strategy-steps li>p,.strategy-motion .strategy-output{opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .7s ease;transition-delay:calc(var(--stage) * 160ms)}
.strategy-motion .strategy-check{border-color:#656565;transition:border-color .3s;transition-delay:calc(350ms + var(--stage) * 240ms)}
.strategy-motion .strategy-check path{stroke-dashoffset:24;transition:stroke-dashoffset .4s ease;transition-delay:calc(350ms + var(--stage) * 240ms)}
.strategy-motion.is-visible .strategy-steps::after{transform:scaleX(1)}
.strategy-motion.is-visible :is(.strategy-number,.strategy-steps h3,.strategy-steps li>p,.strategy-output){opacity:1;transform:none}
.strategy-motion.is-visible .strategy-check{border-color:#ff5a2b}.strategy-motion.is-visible .strategy-check path{stroke-dashoffset:0}
@media(min-width:768px) and (max-width:1099px){
 .growth-strategy .strategy-steps{gap:16px}.growth-strategy .strategy-steps li{grid-column:auto;padding-left:0;padding-right:0}
 .growth-strategy .strategy-steps h3{font-size:20px;min-height:64px}.growth-strategy .strategy-steps li>p{font-size:14px;line-height:22px;min-height:132px}
 .strategy-timeline{--rail-y:370px}.growth-strategy .strategy-output{margin-top:104px}
}
@media(max-width:767px){
 .growth-strategy .strategy-heading{grid-template-columns:1fr}
 .growth-strategy .strategy-steps{grid-template-columns:1fr;gap:32px;padding-left:40px}
 .strategy-steps::before{top:0;bottom:0;left:5px;right:auto;width:1px;height:auto;background:repeating-linear-gradient(to bottom,#656565 0 5px,transparent 5px 12px)}
 .strategy-steps::after{top:0;bottom:0;left:19px;right:auto;width:2px;height:auto;transform-origin:top}
 .growth-strategy .strategy-steps li{padding:0 0 0 12px;text-align:left;grid-column:auto}
 .growth-strategy .strategy-number{margin:0 0 12px}.growth-strategy .strategy-steps h3{font-size:24px;min-height:0;margin-bottom:16px}
 .growth-strategy .strategy-steps li>p{font-size:16px;line-height:26px;min-height:0}
 .growth-strategy .strategy-output{margin:20px 0 0;padding-top:16px;border-top:1px solid #484848}
 .strategy-plan-node{left:-40px;top:5px;width:10px;height:10px}.strategy-plan-node::after{display:none}
 .strategy-check{left:-34px;top:0;width:28px;height:28px}.strategy-check::before{display:none}
 .strategy-motion .strategy-steps::after{transform:scaleY(0)}.strategy-motion.is-visible .strategy-steps::after{transform:scaleY(1)}
 .strategy-rail-label{font-size:12px}.strategy-rail-label>span{display:block;margin-bottom:4px}
}
@media(prefers-reduced-motion:reduce){
 .strategy-motion .strategy-steps::after,.strategy-motion :is(.strategy-number,.strategy-steps h3,.strategy-steps li>p,.strategy-output){opacity:1;transform:none;transition:none}
 .strategy-motion .strategy-check{border-color:#ff5a2b;transition:none}.strategy-motion .strategy-check path{stroke-dashoffset:0;transition:none}
}

/* Both mobile rails use the same node centre and measured endpoints. */
@media(max-width:767px){
 .growth-strategy .strategy-steps{--plan-axis:5px;--result-axis:20px}
 .strategy-steps::before,.strategy-steps::after{top:14px;bottom:auto;height:var(--strategy-rail-height,calc(100% - 28px))}
 .strategy-steps::before{left:var(--plan-axis);transform:translateX(-50%)}
 .strategy-steps::after{left:var(--result-axis);transform:translateX(-50%);transform-origin:top}
 .strategy-plan-node{left:calc(var(--plan-axis) - 40px);top:14px;transform:translate(-50%,-50%)}
 .strategy-check{left:calc(var(--result-axis) - 40px);top:14px;transform:translate(-50%,-50%)}
 .strategy-motion .strategy-steps::after,.strategy-motion.is-visible .strategy-steps::after{transform:translateX(-50%) scaleY(var(--strategy-scroll,0));transition:none}
 .strategy-motion .strategy-check,.strategy-motion.is-visible .strategy-check{border-color:#656565;transition:border-color .25s;transition-delay:0s}
 .strategy-motion .strategy-check path,.strategy-motion.is-visible .strategy-check path{stroke-dashoffset:24;transition:stroke-dashoffset .3s;transition-delay:0s}
 .strategy-motion .strategy-number{color:#a3a3a3;transition:color .25s,opacity .6s,transform .7s}
 .strategy-motion .is-scroll-reached .strategy-check{border-color:#ff5a2b}
 .strategy-motion .is-scroll-reached .strategy-check path{stroke-dashoffset:0}
 .strategy-motion .is-scroll-reached .strategy-number{color:#ff5a2b}
}
@media(max-width:767px) and (prefers-reduced-motion:reduce){
 .strategy-motion .strategy-steps::after{transform:translateX(-50%);transition:none}
 .strategy-motion .strategy-check{border-color:#ff5a2b}
 .strategy-motion .strategy-check path{stroke-dashoffset:0}
}

/* A single progress rail keeps the mobile stages visually clear. */
@media(max-width:767px){
 .growth-strategy .strategy-steps::before,
 .growth-strategy .strategy-plan-node{display:none}
}
