/* ── 10-03 전환 효과(사용자 "전환효과 만들어") — 상시 루프 없이, 들어올 때·바뀔 때·건드릴 때만 움직임 ──
   ① 스크롤 진입: 카드가 순서대로 떠오름(html.js-rv 가 붙은 뒤에만 숨김 → JS 가 없거나 죽어도 내용은 보임, 2.5초 안전망)
   ② 섹션 제목 아래 금색 선이 그려짐  ③ 첫 화면 문구가 차례로 등장  ④ 설문 단계: 앞으로는 오른쪽에서, 뒤로는 왼쪽에서
   ⑤ 확인 요약·신청서 요약 카드가 한 줄씩 펼쳐짐  ⑥ 버튼 누름 반응  ⑦ 금액이 바뀌면 살짝 튐(기존 bump)
   움직임 줄이기(prefers-reduced-motion) 환경에서는 전부 끔 */
.rv{opacity:1;transform:none}
.js-rv .rv:not(.in),.js-rv .rv2:not(.in){opacity:0;transform:translateY(22px)}
/* 카드별 hover 규칙(transition 축약형)이 지연을 지우지 않게 구체도를 올려 고정. 나타난 뒤에는 JS 가 --i 를 0 으로 돌려 hover 반응은 즉시 */
html.js-rv .rv2{transition-property:opacity,transform,box-shadow,background-color;transition-duration:.6s,.6s,.25s,.2s;transition-timing-function:cubic-bezier(.2,.7,.3,1);transition-delay:calc(var(--i,0) * 90ms)}
html.js-rv .rv2.settled{transition-duration:.2s,.25s,.25s,.2s}
.rv2.in{opacity:1;transform:none}
section h2{position:relative;padding-bottom:12px}
section h2::after{content:"";position:absolute;left:50%;bottom:0;width:56px;height:2px;margin-left:-28px;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .8s cubic-bezier(.2,.7,.3,1) .15s}
.invsplit h2::after{left:0;margin-left:0;transform-origin:left}
section h2.drawn::after{transform:scaleX(1)}
#promise h2::after{background:#e3c78f}
.hero .t>*{animation:heroin .8s cubic-bezier(.2,.7,.3,1) both}
.hero .t>*:nth-child(2){animation-delay:.12s}.hero .t>*:nth-child(3){animation-delay:.24s}.hero .t>*:nth-child(4){animation-delay:.36s}.hero .t>*:nth-child(5){animation-delay:.48s}.hero .t>*:nth-child(6){animation-delay:.6s}
@keyframes heroin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.svq.fwd{animation:svfwd .42s cubic-bezier(.2,.7,.3,1)}.svq.back{animation:svback .42s cubic-bezier(.2,.7,.3,1)}
@keyframes svfwd{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes svback{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.svsum>div,.svfsum dt,.svfsum dd{animation:rowin .45s cubic-bezier(.2,.7,.3,1) both;animation-delay:calc(var(--i,0) * 60ms)}
@keyframes rowin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.svfsum{animation:foldin .5s cubic-bezier(.2,.7,.3,1)}
@keyframes foldin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.svdots button{transition:color .2s,border-color .25s,background-color .2s}
button:active,.svcards label:active .c,.seg label:active span{transform:scale(.97)}
.svcards .c,.seg span,.svnav button,.submit,.hb button,.tabs button,.faq button,.drop,.bar button{transition:background-color .18s,border-color .18s,color .18s,box-shadow .2s,transform .14s}
.faq .a>div{transition:opacity .3s}.faq:not(.open) .a>div{opacity:0}
@media(prefers-reduced-motion:reduce){
  .js-rv .rv:not(.in),.js-rv .rv2:not(.in){opacity:1!important;transform:none!important}
  *,*::before,*::after{animation:none!important;transition:none!important}
  section h2::after{transform:scaleX(1)}
}
