/* =========================================================
   OUR PROCESS — scroll timeline
   ========================================================= */
.pr-overview{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid var(--line)}
.pr-overview li{display:flex;gap:18px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);font-size:var(--t-body);font-weight:600;color:var(--blue)}
.pr-overview li span{font-size:var(--t-label);font-weight:500;letter-spacing:.18em;color:#c6a75e;min-width:26px}

.pr-steps{padding:40px 0 140px}
.pr-timeline{position:relative}
.pr-line{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:rgba(31,42,68,.12)}
.pr-line i{position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(#c6a75e,var(--blue));transform-origin:top;transform:scaleY(var(--pr-p,0))}

.pr-step{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12vw;align-items:center;padding:70px 0}
.pr-step-text{grid-column:1;grid-row:1;justify-self:end;max-width:470px}
.pr-step-img{grid-column:2;grid-row:1;margin:0;aspect-ratio:4/3;overflow:hidden;background:#f7f2ea;max-width:520px}
.pr-step-img img{width:100%;height:114% !important;position:relative;top:-7%;object-fit:cover}
.pr-step-rev .pr-step-text{grid-column:2;justify-self:start}
.pr-step-rev .pr-step-img{grid-column:1;justify-self:end}

.pr-dot{position:absolute;left:50%;top:50%;width:58px;height:58px;transform:translate(-50%,-50%);border-radius:50%;background:#fbf8f3;border:2px solid rgba(31,42,68,.18);display:grid;place-items:center;z-index:2;transition:border-color .5s,background .5s,box-shadow .5s}
.pr-dot span{width:14px;height:14px;border-radius:50%;background:rgba(31,42,68,.25);transition:background .5s,transform .5s var(--ease)}
.pr-step.is-on .pr-dot{border-color:var(--blue);box-shadow:0 0 0 8px rgba(31,42,68,.07)}
.pr-step.is-on .pr-dot span{background:#c6a75e;transform:scale(1.25)}

.pr-no{display:block;font-size:clamp(64px,6vw,96px);font-weight:700;line-height:.9;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(31,42,68,.35);margin-bottom:18px;transition:color .6s,-webkit-text-stroke-color .6s}
.pr-step.is-on .pr-no{color:rgba(31,42,68,.08);-webkit-text-stroke-color:var(--blue)}
.page-process main .pr-step h3{font-size:clamp(24px,2.1vw,32px) !important;color:var(--blue);margin:0 0 14px}
.page-process main .pr-step p{color:#111111;margin:0 0 20px}
.pr-step ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pr-step li{font-size:12px;font-weight:500;padding:8px 14px;border:1px solid rgba(31,42,68,.22);border-radius:999px;color:var(--blue);background:#fbf8f3}

/* quality */
.pr-quality{padding:130px 0}
.pr-quality-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:center}
.page-process main .pr-quality h2{color:#fff;margin:0 0 24px !important}
.page-process .pr-quality .eyebrow{color:rgba(255,255,255,.62) !important;opacity:1}
.page-process main .pr-quality-grid>div>p:not(.eyebrow){color:rgba(255,255,255,.78) !important;max-width:460px;margin:0 !important}
.pr-q-cards{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.18)}
.pr-q-cards article{position:relative;background:var(--blue);padding:34px 30px;min-height:190px;display:flex;flex-direction:column;justify-content:space-between;transition:background .4s var(--ease)}
.pr-q-cards article:hover{background:#161e31}
.pr-q-ic{width:38px;height:38px;color:#fff}
.pr-q-ic svg{width:100%;height:100%}
.pr-q-no{position:absolute;top:28px;right:28px;font-size:var(--t-label);font-weight:500;letter-spacing:.18em;color:#c6a75e}
.page-process main .pr-q-cards h3{color:#fff;margin:26px 0 0}

@media (max-width:1000px){
  .pr-step{gap:8vw}
  .pr-quality-grid{grid-template-columns:1fr;gap:50px}
}
@media (max-width:760px){
  .pr-steps{padding:10px 0 80px}
  .pr-line{left:22px}
  .pr-step,.pr-step-rev{grid-template-columns:1fr;gap:26px;padding:44px 0 44px 58px}
  .pr-step-text,.pr-step-rev .pr-step-text{grid-column:1;grid-row:1;justify-self:start}
  .pr-step-img,.pr-step-rev .pr-step-img{grid-column:1;grid-row:2;justify-self:start;width:100%}
  .pr-dot{left:22px;top:64px;width:40px;height:40px}
  .pr-dot span{width:10px;height:10px}
  .pr-no{font-size:56px}
  .pr-quality{padding:80px 0}
  .pr-q-cards article{min-height:150px;padding:24px 20px}
}

/* =========================================================
   V33 — Quality at Every Step on white
   ========================================================= */
.pr-quality{background:#fbf8f3 !important;color:var(--ink)}
.page-process main .pr-quality h2{color:var(--blue) !important}
.page-process .pr-quality .eyebrow{color:var(--blue) !important;opacity:.8}
.page-process main .pr-quality-grid>div>p:not(.eyebrow){color:#111111 !important}
.pr-q-cards{background:rgba(31,42,68,.14);border-color:rgba(31,42,68,.14)}
.pr-q-cards article{background:#fbf8f3}
.pr-q-ic{color:var(--blue)}
.page-process main .pr-q-cards h3{color:var(--blue) !important;transition:color .4s}
.pr-q-cards article:hover{background:var(--blue)}
.pr-q-cards article:hover .pr-q-ic,.page-process main .pr-q-cards article:hover h3{color:#fff !important}
.pr-q-ic{transition:color .4s}

/* =========================================================
   V48 — bigger step images, hover on the timeline dot
   ========================================================= */
.pr-step{grid-template-columns:1fr 1fr;gap:10vw}
.pr-step-img{width:100%;max-width:600px !important;aspect-ratio:4/3}
.pr-step-rev .pr-step-img{justify-self:end}
.pr-step:not(.pr-step-rev) .pr-step-img{justify-self:start}
.pr-step-img img{transition:transform 1s var(--ease)}
.pr-step:hover .pr-step-img img{transform:scale(1.05)}

.pr-dot{cursor:pointer;transition:border-color .45s,background .45s,box-shadow .45s,transform .5s var(--ease) !important}
.pr-dot:hover,.pr-step:hover .pr-dot{transform:translate(-50%,-50%) scale(1.15) !important;background:#1f2a44 !important;border-color:#c6a75e !important;box-shadow:0 0 0 10px rgba(198,167,94,.18) !important}
.pr-dot:hover span,.pr-step:hover .pr-dot span{background:#c6a75e !important;transform:scale(1.5) !important}
.pr-step:hover .pr-no{color:rgba(198,167,94,.25);-webkit-text-stroke-color:#c6a75e}
@media (max-width:760px){
  .pr-step-img{max-width:none !important}
  .pr-dot:hover,.pr-step:hover .pr-dot{transform:translate(-50%,-50%) scale(1.1) !important}
}

/* V123: real artwork proof and dispatch truck — full image, no parallax crop */
.pr-step-img.pr-step-fit img{height:100% !important;top:0 !important;object-fit:cover}

/* V125: mobile — one full-width column so the step text and image use the whole width */
@media (max-width:760px){
  .pr-step,.pr-step.pr-step-rev{grid-template-columns:minmax(0,1fr) !important;padding-right:0 !important}
  .pr-step .pr-step-text,.pr-step .pr-step-img,.pr-step-rev .pr-step-text,.pr-step-rev .pr-step-img{grid-column:1 !important;width:100% !important;max-width:none !important;justify-self:stretch !important}
}