/* CCAA 42차 | 첫 화면의 움직임을 느리고 자연스럽게
   41차 스크롤 효과는 그대로 유지하고 배너·날씨에만 적용. */

/* 별도로 남아 있던 0.7초짜리 heroEnter 효과를 대체. */
@media (prefers-reduced-motion: no-preference) {
  #main > .hero .hero-copy {
    animation: ccaa-hero-soft-enter 1600ms cubic-bezier(.18,.56,.25,1) both !important;
    backface-visibility: hidden;
  }
  /* 사진은 위치 이동 없이 아주 천천히 선명해집니다. */
  #main > .hero .hero-image {
    animation: ccaa-hero-image-fade 1800ms cubic-bezier(.2,.58,.3,1) both;
  }
  #main > .hero .hero-badge {
    animation: ccaa-hero-badge-fade 1450ms 220ms ease-out both;
  }
}
@keyframes ccaa-hero-soft-enter {
  from { opacity: 0; transform: translate3d(0,12px,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}
@keyframes ccaa-hero-image-fade {
  from { opacity: .66; }
  to { opacity: 1; }
}
@keyframes ccaa-hero-badge-fade {
  from { opacity: .35; }
  to { opacity: 1; }
}

/* PC 날씨 위젯은 별도 JS 대기 없이 즉시 표시합니다. */
/* 모바일 기존 SVG 구름 애니메이션은 동일한 2px 거리만 12초에 걸쳐 이동. */
@media (max-width: 650px) and (prefers-reduced-motion: no-preference) {
  #main .weather-showcase .ccaa-mobile-weather .mobile-weather-icon svg {
    animation: ccaa-gentle-cloud-float 12s cubic-bezier(.42,0,.58,1) infinite !important;
    will-change: transform;
  }
}
@keyframes ccaa-gentle-cloud-float {
  0%,100% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(0,-2px,0); }
}
@media (prefers-reduced-motion: reduce) {
  #main > .hero .hero-copy,
  #main > .hero .hero-image,
  #main > .hero .hero-badge,
  #main .weather-showcase .ccaa-mobile-weather .mobile-weather-icon svg {
    animation: none !important;
  }
}
