/* ---------------------- 스크롤 모션 ---------------------- */

/* 위로 페이드 */
.fade_up {
  opacity: 0;
  transform: translateY(30px);
}
.fade_up.show {
  animation: fadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1.2) forwards;
}
@keyframes fadeUp {
  0% {opacity: 0; transform: translateY(30px);}
  100% {opacity: 1; transform: translateY(0);}
}

/* 아래로 페이드 */
.fade_down {
  opacity: 0;
  transform: translateY(-30px);
}
.fade_down.show {
  animation: fadeDown 1s cubic-bezier(0.2, 0.8, 0.2, 1.2) forwards;
}
@keyframes fadeDown {
  0% {opacity: 0; transform: translateY(-30px);}
  100% {opacity: 1; transform: translateY(0);}
}

/* 슬라이드 다운 */
.slide_down {
  opacity: 0;
  transform: translateY(-140px);
}
.slide_down.show {
  animation: slideDown 0.5s ease-out forwards;
}
@keyframes slideDown {
  to {opacity: 1; transform: translateY(0);}
}

/* 페이드 인 */
.fade_in {
  opacity: 0;
}
.fade_in.show {
  animation: fadeIn 1s ease-out forwards;
}
@keyframes fadeIn {
  to {opacity: 1;}
}

/* 팝 인 */
.pop_in {
  opacity: 0;
  transform: scale(0.5);
}
.pop_in.show {
  animation: popIn 0.6s ease-out forwards;
}
@keyframes popIn {
  80% {opacity: 1; transform: scale(1.05);}
  100% {opacity: 1; transform: scale(1);}
}

/* 좌 → 우 */
.ltr_in {
  opacity: 0;
  transform: translateX(-40px);
  filter: blur(2px);
}
.ltr_in.show {
  animation: ltr-in 0.8s cubic-bezier(.22, .61, .36, 1) both;
}
@keyframes ltr-in {
  from {transform: translateX(-40px); opacity: 0; filter: blur(2px);}
  to   {transform: translateX(0);     opacity: 1; filter: blur(0);}
}

/* 우 → 좌 */
.rtr_in {
  opacity: 0;
  transform: translateX(40px);
  filter: blur(2px);
}
.rtr_in.show {
  animation: rtr-in-reverse 0.8s cubic-bezier(.22, .61, .36, 1) both;
}
@keyframes rtr-in-reverse {
  from {transform: translateX(40px); opacity: 0; filter: blur(2px);}
  to   {transform: translateX(0);    opacity: 1; filter: blur(0);}
}