/* 베타 홈 「진행 절차」 1→6 스크롤 (2026-10-09 Son 27676 「스크롤 인터렉션으로 해서 마우스 스크롤 내릴때마다 파란색이 1부터6까지 가게 해줘」)
   home-u-src/k3/apply-k3.js 가 홈·PC 화면(/drafts/beta-home/pc/)에 붙인다. 손으로 고치면 ?v= 를 올릴 것
   k3-steps.js 가 ol.bt-steps 에 k3-on 을 달고, 내린 만큼 --k3p(0~1)·칸마다 --k3f(0~1)와 li.is-on(1~현재)·li.is-now(현재)를 바꾼다
   - PC(1024~ 한 줄): 회색 줄 위 파란 줄이 1 → 6 으로 차고, 줄이 닿은 번호가 파랗게 · 휴대폰(~767 세로): 칸 사이 세로 줄이 위에서 아래로
   - 768~1023(3칸 × 2줄)은 줄 없이 번호만 · 스크립트가 없으면 예전 화면(4·5 파랑) 그대로 */
.bt-steps.k3-on .bt-step-no{transition:background-color .3s ease,color .3s ease,box-shadow .3s ease,transform .3s ease}
.bt-steps.k3-on li.is-now .bt-step-no{box-shadow:0 0 0 6px rgba(36,104,246,.16);transform:scale(1.06)}
.bt-steps.k3-on::after{content:"";position:absolute;z-index:0;left:8.33%;right:8.33%;top:23px;height:2px;background:var(--nv-blue,#2468f6);transform-origin:0 50%;transform:scaleX(var(--k3p,0));transition:transform .2s ease-out;pointer-events:none}
@media (max-width:1023px){
  .bt-steps.k3-on::after{display:none}
}
@media (max-width:767px){
  .bt-steps.k3-on li:not(:last-child)::after{content:"";position:absolute;z-index:0;left:21px;top:44px;bottom:0;width:2px;background:var(--nv-blue,#2468f6);transform-origin:50% 0;transform:scaleY(var(--k3f,0));transition:transform .2s ease-out;pointer-events:none}
}
@media (prefers-reduced-motion:reduce){
  .bt-steps.k3-on .bt-step-no,.bt-steps.k3-on::after,.bt-steps.k3-on li::after{transition:none}
  .bt-steps.k3-on li.is-now .bt-step-no{transform:none}
}