/* RUN9 motion v1 2026-10-14 — 힘의집 결(흐림→선명, 부드러운 감속, 숨 쉬는 신호)을 런나인 페이지에 */
:root{--r9-ease:cubic-bezier(.2,.75,.2,1)}
@keyframes r9BlurIn{0%{filter:blur(10px);opacity:0;transform:translateY(16px)}100%{filter:blur(0);opacity:1;transform:none}}
@keyframes r9Fade{from{opacity:0}to{opacity:1}}
@keyframes r9Pulse{0%,100%{opacity:.3;transform:scaleY(.6) translateY(-4px)}50%{opacity:1;transform:scaleY(1) translateY(4px)}}
@keyframes r9Sweep{0%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(320%) skewX(-18deg)}}
@keyframes r9Pop{0%{opacity:0;transform:scale(.86)}70%{opacity:1;transform:scale(1.04)}100%{transform:none}}

/* 글자: 줄마다 흐림→선명 (data-blur 붙이면 JS가 줄을 나눔) */
.r9-line{display:inline-block;animation:r9BlurIn 1.1s var(--r9-ease) both}
.r9-blur{animation:r9BlurIn 1.1s var(--r9-ease) both}
.r9-fade{animation:r9Fade 1s var(--r9-ease) both}

/* 스크롤 등장: JS가 켜졌을 때만 숨김(꺼져도 내용은 보임) */
html.r9js .rv{opacity:0;transform:translateY(24px);filter:blur(6px);transition:opacity .9s var(--r9-ease),transform .9s var(--r9-ease),filter .9s var(--r9-ease);transition-delay:var(--d,0s)}
html.r9js .rv.in{opacity:1;transform:none;filter:none}
html.r9js .rv-soft{opacity:0;transition:opacity 1.2s var(--r9-ease);transition-delay:var(--d,0s)}
html.r9js .rv-soft.in{opacity:1}

/* 빛 한 줄 지나가기(파란 카드) */
.r9-shine{position:relative;overflow:hidden}
.r9-shine::after{content:"";position:absolute;top:0;bottom:0;left:0;width:34%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);transform:translateX(-120%) skewX(-18deg);animation:r9Sweep 2.6s var(--r9-ease) .5s 1 both;pointer-events:none}

/* 숨 쉬는 '아래로' 신호 */
.r9-cue{display:flex;flex-direction:column;align-items:center;gap:8px;margin:18px auto 0;font-size:12px;color:var(--muted,#6b7280);letter-spacing:.06em;transition:opacity .4s}
.r9-cue i{display:block;width:1.5px;height:26px;background:currentColor;border-radius:2px;animation:r9Pulse 1.8s ease-in-out infinite}
.r9-cue.gone{opacity:0;pointer-events:none}

.r9-pop{animation:r9Pop .6s var(--r9-ease) both}

@media (prefers-reduced-motion:reduce){
  .r9-line,.r9-blur,.r9-fade,.r9-pop,.r9-cue i,.r9-shine::after{animation:none!important}
  html.r9js .rv,html.r9js .rv-soft{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
}