/* ===== JavaScript 제어 스냅용 CSS (스크롤 문제 해결) ===== */
html, body { 
  height: 100%; 
  margin: 0;
  padding: 0;
}

html {
  /* 스크롤 컨테이너 확실히 설정 */
  overflow: visible;
  overflow-y: auto;
  scroll-behavior: auto;
  scroll-snap-type: none;
}

body {
  /* body에서 스크롤 처리 */
  overflow: visible;
  overflow-y: auto;
  overscroll-behavior-y: none; /* 바운스 방지 */
  min-height: 100vh; /* 최소 높이 보장 */
}

/* 스크롤 가능하도록 충분한 높이 확보 */
.snap-section {
  min-height: 100vh;
  display: block;
  margin: 0 !important;
  position: relative;
  box-sizing: border-box;
}

/* 첫 섹션은 헤더 높이만큼 보정 */
.snap-section:first-of-type {
  min-height: calc(100vh - var(--header-h, 0px));
  height: auto;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.snap-section:first-of-type > *:first-child { 
  margin-top: 0 !important; 
}

/* 배너(캐러셀) 높이 */
#mainCarousel, 
#mainCarousel .carousel-inner, 
#mainCarousel .carousel-item { 
  height: 100%; 
}

#mainCarousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  object-position: center;
}

/* 제품 섹션 레이아웃 */
.product-section {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin: 0 !important;
  box-sizing: border-box;
}

/* 마지막 섹션 */
.snap-section.snap-end {
  min-height: auto !important;
  padding-bottom: clamp(64px, 10vh, 160px);
}

.snap-section.snap-end .product-section { 
  min-height: auto !important; 
}

/* 푸터 */
footer, 
.site-footer {
  margin: 0;
  padding: 0;
}

/* 전체 콘텐츠가 스크롤 가능하도록 강제 */
#root, 
#main,
.main-content {
  min-height: 400vh; /* 4개 섹션 * 100vh */
}

/* 캐러셀 아이템 기본 전환 */
#mainCarousel .carousel-item {
  transition: transform 2.5s ease-in-out, opacity 2.5s ease-in-out !important;
}

/* active/next/prev 상태에도 동일 적용 */
#mainCarousel .carousel-item-next,
#mainCarousel .carousel-item-prev,
#mainCarousel .carousel-item.active {
  transition: transform 2.5s ease-in-out, opacity 2.5s ease-in-out !important;
}

.snap-section {
  scroll-snap-align: start;
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

.snap-section:first-of-type {
  min-height: 100vh; /* header 보정 빼기 */
  scroll-snap-align: start;
}
/* 접근성 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --reduced-motion: 1;
  }
}