/* Zenostacks — Our process page: centre timeline that fills on scroll and lights each stage */
.process-page .page-shutter{background:var(--ab-bg);overflow:clip}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* hero */
.pr-hero{position:relative;padding-top:150px;padding-bottom:70px;text-align:center;isolation:isolate;background:radial-gradient(ellipse 55% 50% at 50% 30%,#2c1a6a77,transparent 70%),var(--ab-bg)}
.pr-hero .ab-label{justify-content:center}
.pr-hero h1{max-width:960px;margin:0 auto;font-size:clamp(46px,6vw,98px);line-height:1.02;letter-spacing:-.035em;color:#fff}
.pr-lead{max-width:640px;margin:26px auto 0!important}
.pr-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:880px;margin:54px auto 0;border:1px solid #ffffff14;border-radius:24px;background:linear-gradient(160deg,#ffffff0a,#ffffff03);backdrop-filter:blur(14px)}
.pr-stats div{padding:24px 18px;border-left:1px solid #ffffff10}.pr-stats div:first-child{border-left:0}
.pr-stats b{display:block;font-size:30px;font-weight:600;letter-spacing:-.03em;background:linear-gradient(120deg,#fff,#cdb8ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pr-stats span{font-size:13px;color:#8d84a0}
.pr-scroll{display:inline-flex;align-items:center;gap:12px;margin-top:44px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#a79dba}
.pr-scroll i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid #ffffff22;font-style:normal;color:#fff;animation:pr-bob 2.4s ease-in-out infinite}
@keyframes pr-bob{50%{transform:translateY(5px)}}

/* timeline */
.pr-timeline{padding-top:60px;padding-bottom:140px}
.pr-tl{position:relative;max-width:1200px;margin:0 auto}
.pr-line{position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;border-radius:2px;background:#ffffff10}
.pr-line i{position:absolute;left:0;top:0;width:100%;height:calc(var(--fill,0) * 100%);border-radius:2px;background:linear-gradient(180deg,#6b4dff,#b56cf0 55%,#ff8fd8);box-shadow:0 0 14px #9b7bffcc,0 0 40px #8f5bff66}
.pr-spark{position:absolute;left:50%;top:calc(var(--fill,0) * 100%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px #ff8fd833,0 0 22px 6px #ff8fd8aa,0 0 60px 14px #9b7bff66;opacity:calc(min(var(--fill,0) * 40, 1))}
.pr-steps{list-style:none;margin:0;padding:0;display:grid;gap:70px}
.pr-step{position:relative;display:grid;grid-template-columns:1fr 110px 1fr;align-items:center}
.pr-node{display:grid;place-items:center;height:100%}
.pr-node i{position:relative;z-index:2;width:22px;height:22px;border-radius:50%;background:#0b0810;border:2px solid #ffffff26;transition:border-color .5s,box-shadow .5s,transform .5s var(--ease)}
.pr-node i:after{content:"";position:absolute;inset:4px;border-radius:50%;background:#ffffff22;transition:background .5s}
.pr-step.is-lit .pr-node i{border-color:#e9dcff;transform:scale(1.15);box-shadow:0 0 0 7px #9b7bff22,0 0 26px #b79bffcc}
.pr-step.is-lit .pr-node i:after{background:linear-gradient(135deg,#b79bff,#ff8fd8)}
.pr-a{display:flex;justify-content:flex-end}.pr-b{display:flex;justify-content:flex-start}

/* meta on the opposite side */
.pr-meta{display:grid;gap:6px;padding:0 10px}
.pr-l .pr-meta{text-align:left}.pr-r .pr-meta{text-align:right}
.pr-meta b{font-size:clamp(70px,8vw,128px);font-weight:600;line-height:.9;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px #ffffff26;transition:color .8s,-webkit-text-stroke-color .8s,text-shadow .8s}
.pr-meta span{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#6d6579;transition:color .6s}
.pr-step.is-lit .pr-meta b{color:#ffffff0d;-webkit-text-stroke-color:#cdb8ffaa;text-shadow:0 0 40px #9b7bff33}
.pr-step.is-lit .pr-meta span{color:#cdb8ff}

/* card */
.pr-card{position:relative;width:100%;max-width:480px;padding:32px 32px 28px;border-radius:26px;overflow:hidden;isolation:isolate;border:1px solid #ffffff12;background:linear-gradient(160deg,#16111dcc,#0c0a11cc);box-shadow:0 20px 50px #0007;opacity:.45;transform:translateY(30px) scale(.97);transition:opacity .7s ease,transform .8s var(--ease),border-color .7s,box-shadow .7s,background .7s;-webkit-box-reflect:below 10px linear-gradient(transparent 72%,#ffffff00)}
.pr-card:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(520px circle at var(--rx,0%) 0%,#9b7bff33,transparent 60%);opacity:0;transition:opacity .8s}
.pr-shine{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,#ffffff26 48%,#ffffff08 54%,transparent 64%);transform:translateX(-120%)}
.pr-step.is-lit .pr-card{opacity:1;transform:none;border-color:#b79bff55;background:linear-gradient(160deg,#1f1629f2,#0f0b16f2);box-shadow:0 30px 80px #8f5bff26,0 0 0 1px #ffffff08,inset 0 1px 0 #ffffff1f;-webkit-box-reflect:below 10px linear-gradient(transparent 70%,#ffffff1a)}
.pr-step.is-lit .pr-card:before{opacity:1}
.pr-step.is-lit .pr-shine{animation:pr-shine 1.3s .15s var(--ease) both}
@keyframes pr-shine{to{transform:translateX(120%)}}
.pr-l .pr-card{--rx:100%}.pr-r .pr-card{--rx:0%}
.pr-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}
.pr-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(140deg,#2c2138,#16111d);border:1px solid #ffffff17;transition:background .6s,box-shadow .6s,border-color .6s}
.pr-ic svg{width:24px;height:24px;fill:none;stroke:#cdb8ff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:stroke .6s}
.pr-step.is-lit .pr-ic{background:linear-gradient(140deg,#8f5bff,#c86ce8);border-color:transparent;box-shadow:0 10px 30px #8f5bff66}
.pr-step.is-lit .pr-ic svg{stroke:#fff}
.pr-when{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#b9a8dc;padding:7px 12px;border-radius:99px;border:1px solid #b79bff33}
.pr-card h3{font-size:28px;letter-spacing:-.03em;color:#fff}
.pr-card p{font-size:15px;line-height:1.75;color:#a39bb2;margin-top:10px}
.pr-card ul{list-style:none;margin:20px 0 0;padding:18px 0 0;border-top:1px solid #ffffff10;display:grid;gap:9px}
.pr-card li{display:flex;gap:10px;font-size:14px;color:#d9d1e6}
.pr-card li:before{content:"";flex:none;width:6px;height:6px;margin-top:8px;border-radius:50%;background:#b79bff;box-shadow:0 0 8px #b79bff}
.pr-promise h3{text-transform:none}

.motion-paused .pr-card,.motion-paused .pr-meta b{transition:none}
.motion-paused .pr-shine,.motion-paused .pr-scroll i{animation:none}
@media(prefers-reduced-motion:reduce){.pr-card{transition:none;transform:none}.pr-shine,.pr-scroll i{animation:none!important}}

@media(max-width:1100px){.pr-step{grid-template-columns:1fr 80px 1fr}.pr-card{padding:26px}}
@media(max-width:850px){
  .pr-stats{grid-template-columns:1fr 1fr}.pr-stats div:nth-child(3){border-left:0}.pr-stats div:nth-child(n+3){border-top:1px solid #ffffff10}
  .pr-line{left:22px}
  .pr-step{grid-template-columns:44px 1fr;grid-template-areas:"node card" "node meta";row-gap:0}
  .pr-node{grid-area:node;align-self:start;padding-top:36px}
  .pr-l .pr-a,.pr-r .pr-b{grid-area:card;justify-content:flex-start}
  .pr-l .pr-b,.pr-r .pr-a{display:none}
  .pr-card{max-width:none;-webkit-box-reflect:none!important}
  .pr-steps{gap:34px}
}
@media(max-width:600px){.pr-hero{padding-top:120px}.pr-card h3{font-size:24px}.pr-card{padding:22px 20px}}
