/* ============================================
   Main Page Scroll Animations
   ============================================ */

/* 기본 애니메이션 클래스 */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.animate-on-scroll.animate {
    opacity: 1;
    transform: translateY(0);
}

/* 섹션별 애니메이션 효과 */

/* Section 1 - HERITAGE: 페이드인 + 위로 슬라이드 */
.section1 .section1_deco {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section1 .section1_deco.animate {
    opacity: 1;
    transform: translateY(0);
}

.section1 .section1_title {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.section1 .section1_title.animate {
    opacity: 1;
    transform: translateY(0);
}

.section1 .section1_text {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
}

.section1 .section1_text.animate {
    opacity: 1;
    transform: translateY(0);
}

.section1 .section1_thumbnails {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s;
}

.section1 .section1_thumbnails.animate {
    opacity: 1;
    transform: translateY(0);
}

.section1 .section1_right {
    opacity: 0;
    transform: translateX(50px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s;
}

.section1 .section1_right.animate {
    opacity: 1;
    transform: translateX(0);
}

/* Section 2 - 성혼률 통계: 좌우에서 슬라이드 */
.section2 .section2_left {
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section2 .section2_left.animate {
    opacity: 1;
    transform: translateX(0);
}

.section2 .section2_brand {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.section2 .section2_brand.animate {
    opacity: 1;
    transform: translateY(0);
}

.section2 .section2_title {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
}

.section2 .section2_title.animate {
    opacity: 1;
    transform: translateY(0);
}

.section2 .section2_subtitle {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s;
}

.section2 .section2_subtitle.animate {
    opacity: 1;
    transform: translateY(0);
}

.section2 .section2_main_stat_container {
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.5s;
}

.section2 .section2_main_stat_container.animate {
    opacity: 1;
    transform: scale(1);
}

.section2 .section2_stats_grid {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s;
}

.section2 .section2_stats_grid.animate {
    opacity: 1;
    transform: translateY(0);
}

/* Section 3 - High Society: 그리드 아이템들 순차 애니메이션 */
.section3 .section3_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section3 .section3_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section3 .section3_item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section3 .section3_item.animate {
    opacity: 1;
    transform: translateY(0);
}

.section3 .section3_item:nth-child(1) { transition-delay: 0.2s; }
.section3 .section3_item:nth-child(2) { transition-delay: 0.3s; }
.section3 .section3_item:nth-child(3) { transition-delay: 0.4s; }
.section3 .section3_item:nth-child(4) { transition-delay: 0.5s; }

/* Section 4 - 언론도 인정한 Gnoble: 비디오 아이템들 순차 애니메이션 */
.section4 .section4_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section4 .section4_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section4 .section4_item {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section4 .section4_item.animate {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.section4 .section4_item:nth-child(1) { transition-delay: 0.2s; }
.section4 .section4_item:nth-child(2) { transition-delay: 0.3s; }
.section4 .section4_item:nth-child(3) { transition-delay: 0.4s; }
.section4 .section4_item:nth-child(4) { transition-delay: 0.5s; }

/* Section 5 - 유수의 강연회: 중앙에서 확대 */
.section5 .section5_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section5 .section5_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section5 .section5_video_item {
    opacity: 0;
    transform: scale(0.9);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
}

.section5 .section5_video_item.animate {
    opacity: 1;
    transform: scale(1);
}

/* Section 6 - G.NOBLE 로고: 페이드인 */
.section6 .section6_logo {
    opacity: 0;
    transform: scale(0.8);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}

.section6 .section6_logo.animate {
    opacity: 1;
    transform: scale(1);
}

/* Section 7 - Gnoble 매칭시스템: 그리드 아이템들 순차 애니메이션 */
.section7 .section7_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section7 .section7_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section7 .section7_item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section7 .section7_item.animate {
    opacity: 1;
    transform: translateY(0);
}

.section7 .section7_item:nth-child(1) { transition-delay: 0.2s; }
.section7 .section7_item:nth-child(2) { transition-delay: 0.3s; }
.section7 .section7_item:nth-child(3) { transition-delay: 0.4s; }
.section7 .section7_item:nth-child(4) { transition-delay: 0.5s; }

/* Section 8 - Gnoble 프리미엄 멤버쉽: 카드들 순차 애니메이션 */
.section8 .section8_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section8 .section8_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section8 .section8_item {
    opacity: 0;
    transform: translateY(30px) scale(0.95);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section8 .section8_item.animate {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.section8 .section8_item:nth-child(1) { transition-delay: 0.2s; }
.section8 .section8_item:nth-child(2) { transition-delay: 0.3s; }
.section8 .section8_item:nth-child(3) { transition-delay: 0.4s; }
.section8 .section8_item:nth-child(4) { transition-delay: 0.5s; }
.section8 .section8_item:nth-child(5) { transition-delay: 0.6s; }
.section8 .section8_item:nth-child(6) { transition-delay: 0.7s; }

.section8 .section8_footer {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s;
}

.section8 .section8_footer.animate {
    opacity: 1;
    transform: translateY(0);
}

/* Section 9 - 서비스 & 혜택: 카드들 순차 애니메이션 */
.section9 .section9_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section9 .section9_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section9 .section9_item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section9 .section9_item.animate {
    opacity: 1;
    transform: translateY(0);
}

.section9 .section9_item:nth-child(1) { transition-delay: 0.2s; }
.section9 .section9_item:nth-child(2) { transition-delay: 0.3s; }
.section9 .section9_item:nth-child(3) { transition-delay: 0.4s; }
.section9 .section9_item:nth-child(4) { transition-delay: 0.5s; }

/* Section 10 - Gnoble Heritage Party: 파티 섹션 애니메이션 */
.section_party .section_party_header {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s ease-out;
}

.section_party .section_party_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section_party .section_party_video {
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.8s ease-out;
}

.section_party .section_party_video.animate {
    opacity: 1;
    transform: scale(1);
}

.section_party .section_party_item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
}

.section_party .section_party_item.animate {
    opacity: 1;
    transform: translateY(0);
}

.section_party .section_party_item:nth-child(1) { transition-delay: 0.1s; }
.section_party .section_party_item:nth-child(2) { transition-delay: 0.2s; }
.section_party .section_party_item:nth-child(3) { transition-delay: 0.3s; }
.section_party .section_party_item:nth-child(4) { transition-delay: 0.4s; }
.section_party .section_party_item:nth-child(5) { transition-delay: 0.5s; }
.section_party .section_party_item:nth-child(6) { transition-delay: 0.6s; }

/* Section 11 - 프라이빗 파티와 제주 썸투어: 카드들 순차 애니메이션 */
.section10 .section10_header {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section10 .section10_header.animate {
    opacity: 1;
    transform: translateY(0);
}

.section10 .section10_item {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section10 .section10_item.animate {
    opacity: 1;
    transform: translateY(0);
}

.section10 .section10_item:nth-child(1) { transition-delay: 0.2s; }
.section10 .section10_item:nth-child(2) { transition-delay: 0.3s; }
.section10 .section10_item:nth-child(3) { transition-delay: 0.4s; }

/* Section 11 - 2024 결혼정보회사 업계 최초 3관왕: 상단과 하단 분리 애니메이션 */
.section11 .section11_top {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}

.section11 .section11_top.animate {
    opacity: 1;
    transform: translateY(0);
}

.section11 .section11_certificate {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section11 .section11_certificate.animate {
    opacity: 1;
    transform: translateY(0);
}

.section11 .section11_certificate:nth-child(1) { transition-delay: 0.2s; }
.section11 .section11_certificate:nth-child(2) { transition-delay: 0.3s; }
.section11 .section11_certificate:nth-child(3) { transition-delay: 0.4s; }
.section11 .section11_certificate:nth-child(4) { transition-delay: 0.5s; }
.section11 .section11_certificate:nth-child(5) { transition-delay: 0.6s; }
.section11 .section11_certificate:nth-child(6) { transition-delay: 0.7s; }

/* Section 12 - 지노블 서울 & 제주: 슬라이더들 순차 애니메이션 */
.section12 .section12_slider {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.section12 .section12_slider.animate {
    opacity: 1;
    transform: translateY(0);
}

.section12 .section12_slider:first-child { transition-delay: 0.1s; }
.section12 .section12_slider:last-child { transition-delay: 0.3s; }

/* 특별한 애니메이션 효과들 */

/* 숫자 카운트업 애니메이션 */
.count-up {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.count-up.animate {
    opacity: 1;
    transform: translateY(0);
}

/* 좌우에서 슬라이드 */
.slide-from-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slide-from-left.animate {
    opacity: 1;
    transform: translateX(0);
}

.slide-from-right {
    opacity: 0;
    transform: translateX(50px);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.slide-from-right.animate {
    opacity: 1;
    transform: translateX(0);
}

/* 스케일 애니메이션 */
.scale-in {
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.scale-in.animate {
    opacity: 1;
    transform: scale(1);
}

/* 회전 애니메이션 */
.rotate-in {
    opacity: 0;
    transform: rotate(-10deg) scale(0.9);
    transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.rotate-in.animate {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}

/* 모바일 최적화 */
@media (max-width: 767px) {
    .animate-on-scroll {
        transform: translateY(30px);
    }
    
    .slide-from-left,
    .slide-from-right {
        transform: translateY(30px);
    }
    
    .slide-from-left.animate,
    .slide-from-right.animate {
        transform: translateY(0);
    }
}

/* 성능 최적화 */
.animate-on-scroll,
.section1 .section1_deco,
.section1 .section1_title,
.section1 .section1_text,
.section1 .section1_thumbnails,
.section1 .section1_right,
.section2 .section2_left,
.section2 .section2_brand,
.section2 .section2_title,
.section2 .section2_main_stat_container,
.section2 .section2_stats_grid,
.section3 .section3_header,
.section3 .section3_item,
.section4 .section4_header,
.section4 .section4_item,
.section5 .section5_header,
.section5 .section5_video_item,
.section6 .section6_logo,
.section7 .section7_header,
.section7 .section7_item,
.section8 .section8_header,
.section8 .section8_item,
.section8 .section8_footer,
.section9 .section9_header,
.section9 .section9_item,
.section10 .section10_header,
.section10 .section10_item,
.section11 .section11_top,
.section11 .section11_certificate,
.section12 .section12_slider {
    will-change: transform, opacity;
}

/* 애니메이션 완료 후 will-change 제거 */
.animate-on-scroll.animate,
.section1 .section1_deco.animate,
.section1 .section1_title.animate,
.section1 .section1_text.animate,
.section1 .section1_thumbnails.animate,
.section1 .section1_right.animate,
.section2 .section2_left.animate,
.section2 .section2_brand.animate,
.section2 .section2_title.animate,
.section2 .section2_main_stat_container.animate,
.section2 .section2_stats_grid.animate,
.section3 .section3_header.animate,
.section3 .section3_item.animate,
.section4 .section4_header.animate,
.section4 .section4_item.animate,
.section5 .section5_header.animate,
.section5 .section5_video_item.animate,
.section6 .section6_logo.animate,
.section7 .section7_header.animate,
.section7 .section7_item.animate,
.section8 .section8_header.animate,
.section8 .section8_item.animate,
.section8 .section8_footer.animate,
.section9 .section9_header.animate,
.section9 .section9_item.animate,
.section10 .section10_header.animate,
.section10 .section10_item.animate,
.section11 .section11_top.animate,
.section11 .section11_certificate.animate,
.section12 .section12_slider.animate {
    will-change: auto;
}
