/* ============================================================
   OSW Process — verbatim from source .process-sec / .pstep.
   NOTE: source .pstep does NOT carry the .gb class (unlike most other
   cards) — it independently redeclares the same panel look with no
   hover state. We match that exactly rather than reusing .ovs-gb,
   which would add a hover-border-color effect not in the source.
   ============================================================ */

.ovs-process{overflow:clip}
.ovs-process-head{text-align:center;max-width:600px;margin:0 auto 3rem}
.ovs-process-track{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.ovs-pstep{background:var(--ovs-panel);border:1px solid var(--ovs-line);border-radius:var(--ovs-r);padding:1.9rem 1.6rem;position:relative;overflow:hidden}
.ovs-pstep::before{content:"";position:absolute;top:0;left:0;height:2px;width:100%;background:linear-gradient(90deg,var(--ovs-champ),transparent);opacity:.35;transition:opacity .4s}
.ovs-pstep.ovs-active::before{opacity:1}
.ovs-pstep-num{font-family:var(--ovs-display);font-weight:400;font-size:2.6rem;letter-spacing:.03em;color:rgba(227,201,143,.22);margin-bottom:.7rem;transition:color .4s}
.ovs-pstep.ovs-active .ovs-pstep-num{color:var(--ovs-champ)}
.ovs-pstep h4{font-size:1.05rem;font-weight:700;margin-bottom:.55rem}
.ovs-pstep p{font-size:.87rem;color:var(--ovs-muted);line-height:1.6}
.ovs-process-bar{height:2px;background:var(--ovs-line);border-radius:99px;margin:0 auto 2.6rem;max-width:520px;overflow:hidden;position:relative}
.ovs-process-bar i{position:absolute;inset:0;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--ovs-copper),var(--ovs-champ))}

/* Pinned mode — added by JS only when GSAP loads on desktop */
.ovs-process.ovs-pinned .ovs-process-track{display:flex;flex-wrap:nowrap;gap:1.4rem;width:max-content}
.ovs-process.ovs-pinned .ovs-pstep{width:min(430px,72vw);flex:none}
.ovs-process.ovs-pinned .ovs-process-viewport{overflow:visible}

/* Source breakpoints — verbatim (static-grid fallback only; pinned mode is
   gated to min-width:900px in JS so these apply below that anyway) */
@media(max-width:880px){
  .ovs-process-track{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .ovs-process-track{grid-template-columns:1fr}
}
