/* The three stages read as one route. Motion only starts after each stage enters view. */
.services-page .services-journey{
  grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);
  align-items:center;gap:clamp(38px,5.4vw,86px);
  min-height:565px;padding:clamp(44px,5.2vw,76px);
  background:radial-gradient(ellipse at 88% 8%,rgba(32, 38, 48,.24),transparent 40%),radial-gradient(ellipse at 47% 108%,rgba(63, 70, 83,.18),transparent 46%),linear-gradient(122deg,#101319 0%,#15171c 43%,#101317 100%);
  box-shadow:0 30px 60px rgba(18, 20, 23,.17),inset 0 1px 0 rgba(255,255,255,.08);
}
.services-page .services-journey::before{
  z-index:-1;background:repeating-linear-gradient(133deg,transparent 0,transparent 81px,rgba(255,255,255,.025) 82px,transparent 83px),linear-gradient(90deg,rgba(255,255,255,.025),transparent 45%);
}
.services-page .services-journey::after{right:-145px;bottom:-330px;opacity:.75}
.services-page .services-journey-intro{position:relative;z-index:1;max-width:535px}
.services-page .services-journey .services-label{color:#e3e5e8}
.services-page .services-journey h2{max-width:560px;margin:19px 0 19px;font-size:clamp(36px,3.65vw,55px);line-height:1.11}
.services-page .services-journey h2 em{background:linear-gradient(100deg,#ffe7bc,#adebe7 53%,#e4e5e8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.services-page .services-journey-intro>p{max-width:450px;font-size:14px;line-height:1.85;color:#e5e6e8}
.services-page .services-journey-signature{display:flex;align-items:center;gap:13px;max-width:440px;margin-top:37px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2)}
.services-page .services-journey-signature span{color:#e3e5e8;font-size:10px;font-weight:800;letter-spacing:.13em;white-space:nowrap}
.services-page .services-journey-signature i{height:1px;flex:1;min-width:12px;background:linear-gradient(90deg,rgba(255,229,193,.85),rgba(255,255,255,.15))}
.services-page .services-journey-track{display:none}
.services-page .services-journey-steps{--rail-x:15px;--card-inset:36px;position:relative;z-index:1;display:grid;align-content:center;gap:23px;padding-left:var(--card-inset)}
.services-page .services-journey-steps::before,.services-page .services-journey-steps::after{position:absolute;z-index:0;left:var(--rail-x);top:29px;bottom:29px;width:2px;border-radius:3px;content:"";pointer-events:none;transform:translateX(-50%)}
.services-page .services-journey-steps::before{background:rgba(255,255,255,.2)}
.services-page .services-journey-steps::after{background:linear-gradient(#ffe5bc,#8fe3de 54%,#8cb8f0);transform:translateX(-50%) scaleY(0);transform-origin:center top;box-shadow:0 0 12px rgba(227, 229, 232,.7)}
.services-page .services-journey.is-visible .services-journey-steps::after{animation:journey-line 1.85s .18s cubic-bezier(.23,.8,.25,1) forwards}
.services-page .services-journey-step{
  --stage:#e3e5e8;--stage-soft:rgba(173, 235, 231,.14);
  position:relative;z-index:1;isolation:isolate;display:grid;grid-template-columns:56px minmax(0,1fr);
  align-items:start;column-gap:17px;min-height:141px;padding:22px 52px 21px 21px;
  border:1px solid rgba(240, 241, 243,.25);border-radius:19px;
  background:linear-gradient(117deg,rgba(255,255,255,.13),rgba(255,255,255,.045) 67%),rgba(14, 16, 20,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 27px rgba(10, 12, 15,.13);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  transition:border-color .35s,background .35s,box-shadow .35s;
}
.services-page .services-journey-step:hover{border-color:rgba(255,230,202,.65);background:linear-gradient(117deg,rgba(255,255,255,.18),rgba(255,255,255,.065) 67%),rgba(14, 16, 20,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 19px 35px rgba(10, 12, 15,.2)}
.services-page .services-journey-step::before{position:absolute;z-index:10;left:calc(var(--rail-x) - var(--card-inset) - 1px);top:50%;width:20px;height:20px;border:2px solid #181b20;border-radius:50%;background:radial-gradient(circle at 37% 30%,#fff 0 7%,var(--stage) 27%,#2f343e 90%);box-shadow:inset 0 1px 1px rgba(255,255,255,.65),0 0 0 2px rgba(255,255,255,.29),0 0 15px var(--stage-soft);content:"";pointer-events:none;transform:translate(-50%,-50%)}
.services-page .services-journey-step:not(:last-child)::after{position:absolute;left:calc(var(--rail-x) - var(--card-inset) - 6px);bottom:-17px;z-index:10;width:10px;height:10px;border:solid rgba(235, 236, 239,.95);border-width:0 2px 2px 0;border-radius:2px;background:none;content:"";pointer-events:none;transform:rotate(45deg);filter:drop-shadow(0 0 5px var(--stage))}
.services-page .services-journey-build{--stage:#adebe7;--stage-soft:rgba(140, 226, 221,.18)}
.services-page .services-journey-launch{--stage:#abcafa;--stage-soft:rgba(116,168,251,.2)}
.services-page .services-journey-step > .services-journey-number{
  position:absolute;right:19px;top:17px;display:block;width:auto;height:auto;
  border:0;border-radius:0;background:none;color:rgba(235, 236, 238,.69);
  font-size:12px;font-weight:800;letter-spacing:.11em;
}
.services-page .services-journey-step .services-journey-icon{
  grid-row:1;display:grid;place-items:center;width:52px;height:52px;
  border:1px solid rgba(255,255,255,.27);border-radius:15px;
  background:linear-gradient(145deg,var(--stage-soft),rgba(255,255,255,.045));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 9px 20px rgba(11, 12, 15,.1);
  color:var(--stage);transition:transform .4s cubic-bezier(.2,.9,.25,1),box-shadow .4s;
}
.services-page .services-journey-step:hover .services-journey-icon{transform:rotate(-7deg) scale(1.08);box-shadow:0 10px 22px var(--stage-soft),inset 0 1px 0 rgba(255,255,255,.25)}
.services-page .services-journey-icon svg{width:28px;height:28px;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.services-page .services-journey-copy{min-width:0}
.services-page .services-journey-copy small{display:block;margin:1px 0 5px;color:var(--stage);font-size:9px;font-weight:800;letter-spacing:.13em}
.services-page .services-journey-copy h3{margin:0 0 5px;color:#fff;font-size:20px;font-weight:800;letter-spacing:-.035em;line-height:1.2}
.services-page .services-journey-step .services-journey-copy p{margin:0;max-width:420px;color:#e4e5e6;font-size:11px;line-height:1.55}
.services-page .services-journey-step .services-journey-outcome{display:inline-flex;align-items:center;gap:7px;width:auto;height:auto;margin-top:11px;padding:0;border:0;border-radius:0;background:none;color:#ebecee;font-size:10px;font-weight:700}
.services-page .services-journey-outcome i{width:5px;height:5px;border-radius:50%;background:var(--stage);box-shadow:0 0 10px var(--stage)}
html.services-motion-ready .services-page .services-journey-intro:not(.is-revealed),html.services-motion-ready .services-page .services-journey-step:not(.is-revealed){opacity:0}
html.services-motion-ready .services-page .services-journey-intro.is-revealed{animation:journey-intro .82s cubic-bezier(.2,.85,.23,1) both}
html.services-motion-ready .services-page .services-journey-discover.is-revealed{animation:journey-discover .88s var(--step-delay,0ms) cubic-bezier(.18,.85,.22,1) backwards}
html.services-motion-ready .services-page .services-journey-build.is-revealed{animation:journey-build .9s var(--step-delay,0ms) cubic-bezier(.18,.85,.22,1) backwards}
html.services-motion-ready .services-page .services-journey-launch.is-revealed{animation:journey-launch .95s var(--step-delay,0ms) cubic-bezier(.18,.85,.22,1) backwards}
@keyframes journey-line{to{transform:translateX(-50%) scaleY(1)}}
@keyframes journey-intro{from{opacity:0;transform:translateX(-30px);filter:blur(6px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes journey-discover{from{opacity:0;transform:translateX(58px);clip-path:inset(0 0 0 90% round 19px)}to{opacity:1;transform:translateX(0);clip-path:inset(0 0 0 0 round 19px)}}
@keyframes journey-build{from{opacity:0;transform:perspective(800px) rotateY(-14deg) scale(.87);filter:brightness(1.75)}to{opacity:1;transform:perspective(800px) rotateY(0) scale(1);filter:brightness(1)}}
@keyframes journey-launch{from{opacity:0;transform:translateY(44px) scale(.9);filter:blur(8px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@media(max-width:900px){.services-page .services-journey{grid-template-columns:1fr;gap:34px}.services-page .services-journey-intro{max-width:700px}.services-page .services-journey-steps{max-width:740px;width:100%;margin-inline:auto}}
@media(max-width:600px){
  .services-page .services-journey{min-height:0;padding:35px 23px 39px;gap:30px}
  .services-page .services-journey h2{font-size:clamp(34px,7.8vw,45px)}
  .services-page .services-journey-signature{margin-top:24px;gap:8px}
  .services-page .services-journey-signature span{font-size:8px}
  .services-page .services-journey-steps{--rail-x:10px;--card-inset:27px;gap:20px}
  .services-page .services-journey-step{grid-template-columns:43px minmax(0,1fr);gap:10px;min-height:0;padding:18px 31px 18px 15px;border-radius:16px}
  .services-page .services-journey-step:not(:last-child)::after{bottom:-14px}
  .services-page .services-journey-step .services-journey-icon{width:42px;height:42px;border-radius:12px}
  .services-page .services-journey-icon svg{width:24px;height:24px}
  .services-page .services-journey-copy h3{font-size:17px}
  .services-page .services-journey-copy small{font-size:8px;letter-spacing:.08em}
  .services-page .services-journey-step .services-journey-copy p{font-size:10px}
  .services-page .services-journey-step .services-journey-outcome{font-size:9px}
  .services-page .services-journey-step > .services-journey-number{right:11px;top:12px;font-size:10px}
}
@media(max-width:380px){.services-page .services-journey{padding-inline:16px}.services-page .services-journey-step{padding-right:19px}.services-page .services-journey-step > .services-journey-number{position:static;grid-column:2;grid-row:1;justify-self:end;margin-bottom:-8px}.services-page .services-journey-copy{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.services-page .services-journey-steps::after,.services-page .services-journey-intro,.services-page .services-journey-step{animation:none!important;opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}.services-page .services-journey-steps::after{transform:translateX(-50%) scaleY(1)!important}.services-page .services-journey-step .services-journey-icon{transition:none}}

/* The copy and the timeline share the same top and bottom edges. */
@media(min-width:901px){
  .services-page .services-journey{align-items:stretch}
  .services-page .services-journey-intro{display:flex;flex-direction:column;align-self:stretch;padding:5px 0}
  .services-page .services-journey-signature{width:100%;margin-top:auto}
  .services-page .services-journey-steps{align-content:space-between}
}
.services-page .services-journey{box-shadow:0 30px 64px rgba(18, 20, 23,.2),inset 0 1px 0 rgba(255,255,255,.13),0 0 44px rgba(26, 32, 41,.07)}
.services-page .services-journey-track{position:absolute;z-index:0;display:block;inset:0;width:auto;height:auto;background:radial-gradient(ellipse 42% 44% at 78% 14%,rgba(115, 220, 214,.11),transparent 76%),radial-gradient(ellipse 36% 55% at 78% 78%,rgba(91,133,241,.095),transparent 76%);pointer-events:none;overflow:hidden}
.services-page .services-journey-track::before{position:absolute;right:15%;top:4%;width:210px;height:210px;border:1px solid rgba(173, 235, 231,.15);border-radius:50%;box-shadow:0 0 0 42px rgba(136, 225, 220,.025),0 0 42px rgba(32, 38, 48,.08);content:""}
.services-page .services-journey-track::after{position:absolute;top:-60%;left:-45%;right:auto;bottom:auto;width:21%;height:215%;background:linear-gradient(90deg,transparent,rgba(228, 230, 233,.065),transparent);content:"";transform:rotate(22deg)}
.services-page .services-journey.is-visible .services-journey-track::after{animation:journey-ambient-sweep 13s 1s ease-in-out infinite}
.services-page .services-journey h2 em{filter:drop-shadow(0 0 13px rgba(171, 234, 230,.19))}
.services-page .services-journey-signature{border-color:rgba(227, 229, 232,.32)}
.services-page .services-journey-signature i{box-shadow:0 0 10px rgba(173, 235, 231,.26)}
.services-page .services-journey-step{
  background:radial-gradient(circle 220px at var(--shine-x,88%) var(--shine-y,18%),var(--stage-soft),transparent 84%),linear-gradient(117deg,rgba(255,255,255,.14),rgba(255,255,255,.045) 67%),rgba(14, 16, 20,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 12px 27px rgba(10, 12, 15,.16),0 0 20px var(--stage-soft);
}
.services-page .services-journey-step:hover{
  background:radial-gradient(circle 260px at var(--shine-x,72%) var(--shine-y,24%),var(--stage-soft),transparent 83%),linear-gradient(117deg,rgba(255,255,255,.19),rgba(255,255,255,.055) 67%),rgba(14, 16, 20,.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 18px 38px rgba(10, 12, 15,.24),0 0 31px var(--stage-soft);
}
.services-page .services-journey-step::before{animation:journey-beacon 3.8s ease-in-out infinite}
.services-page .services-journey-build::before{animation-delay:1.15s}
.services-page .services-journey-launch::before{animation-delay:2.3s}
.services-page .services-journey-step:not(:last-child)::after{border-color:var(--stage);filter:drop-shadow(0 0 5px var(--stage))}
.services-page .services-journey-step .services-journey-icon{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 19px var(--stage-soft),0 9px 20px rgba(11, 12, 15,.12)}
.services-page .services-journey-step .services-journey-glint{position:absolute;z-index:2;display:block;inset:0;width:auto;height:auto;border:0;border-radius:inherit;background:none;pointer-events:none;overflow:hidden}
.services-page .services-journey-glint::before{position:absolute;top:0;left:-38%;width:37%;height:2px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--stage),#fff,var(--stage),transparent);box-shadow:0 0 13px var(--stage),0 0 25px var(--stage-soft);content:"";animation:journey-edge-scan 8.3s ease-in-out infinite}
.services-page .services-journey-glint::after{position:absolute;right:64px;top:5px;width:13px;height:13px;background:var(--stage);clip-path:polygon(50% 0,57% 42%,100% 50%,57% 58%,50% 100%,43% 58%,0 50%,43% 42%);filter:drop-shadow(0 0 7px var(--stage));content:"";animation:journey-star 4.8s ease-in-out infinite}
.services-page .services-journey-build .services-journey-glint::before{animation-delay:2s}
.services-page .services-journey-build .services-journey-glint::after{animation-delay:1.5s}
.services-page .services-journey-launch .services-journey-glint::before{animation-delay:4s}
.services-page .services-journey-launch .services-journey-glint::after{animation-delay:3s}
@keyframes journey-ambient-sweep{0%,24%{left:-45%;opacity:0}34%{opacity:1}58%,100%{left:130%;opacity:0}}
@keyframes journey-edge-scan{0%,24%{left:-38%;opacity:0}30%{opacity:1}51%,100%{left:105%;opacity:0}}
@keyframes journey-star{0%,60%,100%{opacity:.25;transform:scale(.6)}68%,75%{opacity:1;transform:scale(1.1)}}
@keyframes journey-beacon{0%,100%{box-shadow:inset 0 1px 1px rgba(255,255,255,.65),0 0 0 2px rgba(255,255,255,.29),0 0 14px var(--stage-soft)}50%{box-shadow:inset 0 1px 1px rgba(255,255,255,.65),0 0 0 4px rgba(255,255,255,.13),0 0 19px var(--stage-soft)}}
@media(max-width:900px){.services-page .services-journey-intro{display:block;align-self:auto}.services-page .services-journey-signature{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.services-page .services-journey-track::after,.services-page .services-journey-step::before,.services-page .services-journey-glint::before,.services-page .services-journey-glint::after{animation:none!important}.services-page .services-journey-glint::before{left:32%;opacity:.45}.services-page .services-journey-glint::after{opacity:.55}}
