/* 35차 미리보기(2026-11-02 · ko-ver2) — 홈페이지 전체 움직임 층. js/p-r35m.js 가 html.r35m 과 대상 표시(.r35-rv)를 붙일 때만 쓰인다.
   숨김은 아직 나타나지 않은 것(:not(.r35-in))에만. 나타날 때는 transition 이 아니라 animation(backwards)이라 각 요소의 원래 transition · 호버가 그대로 산다.
   움직임 줄이기 설정이면 JS 가 아무것도 붙이지 않는다 → 이 파일의 숨김 · 움직임은 하나도 걸리지 않는다. */
:root { --r35e: cubic-bezier(.2, .7, .2, 1); }

.r35m .r35-rv:not(.r35-in) { opacity: 0; }
.r35m .r35-rv.r35-in { animation-duration: 1.1s; animation-timing-function: var(--r35e); animation-delay: var(--r35d, 0s); animation-fill-mode: backwards; }

/* 짧은 문단 · 링크: 떠오른다 */
.r35m .r35-up.r35-in { animation-name: r35Up; }
@keyframes r35Up { from { opacity: 0; translate: 0 26px; } }

/* 사진 칸: 조금 작게 · 아래에서 떠올라 제자리 크기로 */
.r35m .r35-ph.r35-in { animation-name: r35Ph; animation-duration: 1.3s; }
@keyframes r35Ph { from { opacity: 0; translate: 0 48px; scale: .94; } }

/* 카드: 뒤로 누워 있다가 일어서며 올라온다(입체). 원근은 카드 묶음에 */
.r35m .r35-3d { perspective: 1400px; }
.r35m .r35-card.r35-in { animation-name: r35Card; animation-duration: 1.2s; transform-origin: 50% 100%; }
@keyframes r35Card { from { opacity: 0; translate: 0 56px; rotate: x 16deg; } }

/* 큰 윤곽 글자: 흐릿하게 작았다가 자리를 잡는다(PC 는 스크롤에 따라 옆으로 천천히 밀린다 — JS) */
.r35m .r35-bgtx.r35-in { animation-name: r35Bg; animation-duration: 1.8s; }
@keyframes r35Bg { from { opacity: 0; scale: .9; } }

/* PC: 마우스 기울기 · 칸 안 사진 패럴랙스(가장자리가 비지 않게 조금 크게) */
.r35-tilt { transition: transform .6s var(--r35e), box-shadow .4s; will-change: auto; }
.r35-tilt.is-tilting { transition: transform .12s linear, box-shadow .4s; }
.r35-pximg { scale: 1.1; }

/* 모바일: 거리 · 기울기를 줄인다 */
@media (max-width: 1023px) {
  @keyframes r35Ph { from { opacity: 0; translate: 0 32px; scale: .96; } }
  @keyframes r35Card { from { opacity: 0; translate: 0 36px; rotate: x 10deg; } }
  .r35m .r35-rv.r35-in { animation-duration: .9s; }
}
@media (prefers-reduced-motion: reduce) {
  .r35m .r35-rv:not(.r35-in) { opacity: 1; }
  .r35m .r35-rv.r35-in { animation: none; }
}