/* Prespri Steps (Work Process) */
.phsp-wrap{position:relative;font-family:'Outfit',sans-serif;box-sizing:border-box;
  --phsp-cs:100px;--phsp-gap:30px;--phsp-ac1:#4951FE;--phsp-ac2:#C93DB4;--phsp-aw:2px;--phsp-ad:6 5;--phsp-hs:14px;--phsp-ap:18px;--phsp-ao:0px}
.phsp-wrap *{box-sizing:border-box}

/* heading */
.phsp-head{text-align:center;margin-bottom:60px}
.phsp-sub{display:inline-block;margin-bottom:14px;font-family:'Vollkorn',serif;font-weight:700;font-size:14px;line-height:1.2;text-transform:uppercase;letter-spacing:5px;color:#4951FE}
.phsp-sub.is-grad{background:linear-gradient(90deg,var(--phs-g1,#4951FE),var(--phs-g2,#C93DB4));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.phsp-title{margin:0 0 16px;font-family:'Vollkorn',serif;font-weight:800;font-size:48px;line-height:1.2;color:#111}
.phsp-hdesc{margin:0;font-size:18px;line-height:1.5;color:#4d515f}

/* grid */
.phsp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:30px;row-gap:40px}
.phsp-item{position:relative;text-align:center}

/* circle */
.phsp-ring{position:relative;width:var(--phsp-cs);height:var(--phsp-cs);margin:0 auto 26px;padding:3px;border-radius:50%;background:linear-gradient(135deg,#4951FE,#C93DB4);transition:transform .5s cubic-bezier(.22,1,.36,1)}
.phsp-gap{width:100%;height:100%;padding:6px;border-radius:50%;background:#fff}
.phsp-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;overflow:hidden;font-size:40px;color:#4951FE;background:linear-gradient(135deg,#eef0ff,#fde9f6)}
.phsp-inner i{line-height:1}
.phsp-inner svg{width:1em;height:1em;fill:currentColor}
.phsp-inner img{display:block;width:55%;height:auto}
.phsp-ih-float .phsp-item:hover .phsp-ring{transform:translateY(-8px)}
.phsp-ih-zoom .phsp-item:hover .phsp-ring{transform:scale(1.08)}

/* number badge */
.phsp-num{position:absolute;top:0;right:-4px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;font-size:13px;font-weight:600;line-height:1;color:#fff;background:linear-gradient(135deg,#4951FE,#C93DB4);box-shadow:0 4px 12px rgba(73,81,254,.3)}

/* text */
.phsp-ititle{margin:0 0 12px;font-family:'Vollkorn',serif;font-weight:700;font-size:24px;line-height:1.25;color:#111;transition:color .3s}
.phsp-ititle a,.phsp-ititle a:hover{color:inherit;text-decoration:none}
.phsp-idesc{margin:0 auto;font-size:16px;line-height:26px;color:#666}

/* arrows between steps */
.phsp-arrow{position:absolute;z-index:1;display:block;height:32px;pointer-events:none;
  top:calc(var(--phsp-cs) / 2 - 16px + var(--phsp-ao));
  left:calc(50% + var(--phsp-cs) / 2 + var(--phsp-ap));
  width:calc(100% + var(--phsp-gap) - var(--phsp-cs) - var(--phsp-ap) * 2)}
.phsp-arrow .phsp-line{display:block;width:calc(100% - var(--phsp-hs) * .6);height:100%;overflow:visible}
.phsp-arrow .phsp-line path{stroke-width:var(--phsp-aw);stroke-dasharray:var(--phsp-ad)}
.phsp-arrow .phsp-head{position:absolute;right:0;top:50%;width:var(--phsp-hs);height:var(--phsp-hs);margin-top:calc(var(--phsp-hs) / -2);fill:var(--phsp-ac2);stroke:var(--phsp-ac2)}
.phsp-arrow .phsp-head.is-curved{transform:rotate(14deg)}

/* scroll animation (enabled by JS adding .phs-js) */
.phs-js.phsp-anim [data-phs-item]:not(.is-in){opacity:0;transform:translateY(40px)}
.phs-js.phsp-anim [data-phs-item].is-in{animation:phspIn 1s cubic-bezier(.22,1,.36,1) calc(var(--i,0)*.14s) both}
@keyframes phspIn{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
.phs-js.phsp-anim [data-phs-item].is-done{animation:none;opacity:1;transform:none}

/* responsive (fallbacks; Elementor controls override these) */
@media (max-width:1024px){
  .phsp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .phsp-arrow{display:none}
  .phsp-title{font-size:38px}
  .phsp-ititle{font-size:22px}
}
@media (max-width:767px){
  .phsp-grid{grid-template-columns:minmax(0,1fr)}
  .phsp-title{font-size:30px}
  .phsp-head{margin-bottom:35px}
}
@media (prefers-reduced-motion:reduce){
  .phs-js.phsp-anim [data-phs-item]{opacity:1!important;transform:none!important;animation:none!important}
  .phsp-ring{transition:none}
}
