/* ===============================
   0) 공통 기본
=============================== */
html, body { height: 100%; }
html { scroll-behavior: smooth; }
body {
  margin: 0; padding: 0;
  overscroll-behavior-y: none;        /* 바운스 방지 */
  scroll-snap-type: y mandatory;      /* 전체 스냅 */
}
body.snap-off { scroll-snap-type: none !important; }

/* ===============================
   1) 스냅 섹션
=============================== */
.snap-section {
  display: block;
  min-height: 100svh;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  margin: 0 !important;
}
.snap-section:first-of-type{
  height: 100svh;
  min-height: 0;
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.snap-section:first-of-type > *:first-child { margin-top: 0 !important; }
.snap-section.snap-end{
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  min-height: auto !important;
  padding-bottom: clamp(64px, 10vh, 160px);
}
.product-section{
  min-height: 100svh;
  display: flex; 
  flex-direction: column;
  justify-content: flex-start;
  margin: 0 !important;
}
.snap-section.snap-end .product-section { min-height: auto !important; }

/* ===============================
   2) 배너(캐러셀)
=============================== */
#mainCarousel,
#mainCarousel .carousel-inner,
#mainCarousel .carousel-item { height: 100%; }
#mainCarousel .carousel-item img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}

/* ===============================
   3) 푸터: 스냅 타깃
=============================== */
footer, .site-footer{
  scroll-snap-align: end;
  scroll-snap-stop: always;
}

/* ===============================
   4) 헤더 오버레이 & 전환
=============================== */
.home .site-header{
  position: absolute;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 헤더 내부 바 기본: 투명 + 흰 글씨 */
.home .site-header .bbp-topbar,
.home .site-header .bbp-brandbar,
.home .site-header nav.navbar{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #fff !important;
}

/*  스크롤 후/배너 벗어남 고정 스타일 - 항상 흰 배경 */
.home .site-header.scrolled .bbp-topbar,
.home .site-header.scrolled .bbp-brandbar,
.home .site-header.scrolled nav.navbar,
.home .site-header.hovering .bbp-topbar,
.home .site-header.hovering .bbp-brandbar,
.home .site-header.hovering nav.navbar {
  background: rgba(255,255,255,0.95) !important;
  border: 0 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.05) !important;
  color: #000 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/*  배너에서만 hover / 드롭다운 열림 시 전환 (스크롤 상태가 아닐 때만) */
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-topbar,
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-brandbar,
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) nav.navbar {
  background: rgba(255,255,255,0.9) !important; /* 반투명 흰 */
  border: 0 !important;
  /*  로고 위 굵은 선 제거 - border-bottom 삭제 */
  /* border-bottom: 1px solid #e5e7eb !important; */
  box-shadow: 0 2px 8px rgba(0,0,0,.05) !important;
  color: #000 !important;

  /*  블러 완전 제거 */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/*  스크롤 후/배너 벗어남 링크/고객센터 색상 - 항상 검정 */
.home .site-header.scrolled a,
.home .site-header.scrolled .nav-link,
.home .site-header.scrolled span,
.home .site-header.scrolled .icon-link,
.home .site-header.hovering a,
.home .site-header.hovering .nav-link,
.home .site-header.hovering span,
.home .site-header.hovering .icon-link {
  color:#000 !important;
}

/*  배너에서만 호버 시 링크 색상 변경 (스크롤 상태가 아닐 때만) */
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) a,
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .nav-link,
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) span,
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .icon-link {
  color:#000 !important;
}

/*  스크롤 후/배너 벗어남 로고 - 항상 검정 로고 */
.home .site-header.scrolled .navbar-brand img,
.home .site-header.hovering .navbar-brand img{
  content: url('/include/image/transparent_logo.png') !important;
}

/*  배너에서만 호버 시 로고 전환 (스크롤 상태가 아닐 때만) */
.home .site-header:not(.scrolled):is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .navbar-brand img{
  content: url('/include/image/transparent_logo.png') !important;
}

/* 토글 버튼 */
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .navbar-toggler{
  border-color: rgba(17,17,17,.4) !important;
}
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .navbar-toggler-icon{
  filter:none !important;
}
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-icon-btn{
  color:#111 !important;
  border-color:#e5e7eb !important;
  background:#fff !important;
}

/*  검색창 전환 + 테두리 추가 */
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-searchbar .input-group,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .glass-search,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-search-pill {
  background:#fff !important;
  border:1px solid #d1d5db !important;   /*  회색 테두리 추가 */
  border-radius: 9999px !important;      /*  pill 형태 유지 */
  backdrop-filter:none !important;
}
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-searchbar .form-control,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .glass-input,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-search-input {
  color:#111 !important;
}
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-searchbar .form-control::placeholder,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .glass-input::placeholder,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-search-input::placeholder {
  color:#9aa0a6 !important;
}
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-searchbar .btn,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .glass-btn,
.home .site-header:is(
  :hover, .hovering,
  :has(.bbp-topbar:hover), :has(.bbp-brandbar:hover),
  :has(nav.navbar:hover), :has(nav.navbar .dropdown.show)
) .bbp-search-btn{
  background: rgba(0,0,0,.06) !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 로고 기본 스타일 */
.navbar-brand img {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  outline: none !important;
  display: block;
  max-height: 60px;
}
.home .site-header:hover .navbar-brand img,
.home .site-header.hovering .navbar-brand img,
.site-header.scrolled .navbar-brand img {
  background: transparent !important;
  box-shadow: none !important;
}

/* ===============================
   6) 다른 페이지(홈이 아닌 페이지) 기본 스타일 - 강제 적용
=============================== */
/* 다른 페이지에서 헤더 배경 */
body:not(.home) .site-header {
  background: #fff !important;
  border-bottom: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  position: relative;
}

/* 다른 페이지에서 헤더 내부 바 스타일 */
body:not(.home) .site-header .bbp-topbar,
body:not(.home) .site-header .bbp-brandbar,
body:not(.home) .site-header nav.navbar {
  background: #fff !important;
  color: #111 !important;
}

/*  다른 페이지에서 아이콘들 강제 검정색 */
body:not(.home) .site-header .icon-link,
body:not(.home) .site-header .icon-link .bi,
body:not(.home) .bbp-quick-actions .icon-link,
body:not(.home) .bbp-quick-actions .icon-link .bi {
  color: #111 !important;
}

/*  다른 페이지에서 고객센터 텍스트 강제 검정색 */
body:not(.home) .site-header .bbp-customer-center *,
body:not(.home) .site-header .bbp-customer-center .bbp-customer-label,
body:not(.home) .site-header .bbp-customer-center .bbp-customer-number,
body:not(.home) .site-header .bbp-customer-center .bbp-customer-time,
body:not(.home) .site-header .bbp-customer-center .text-muted,
body:not(.home) .site-header .bbp-customer-center .text-dark {
  color: #111 !important;
}

/* 다른 페이지에서 링크/텍스트 색상 */
body:not(.home) .site-header a,
body:not(.home) .site-header .nav-link,
body:not(.home) .site-header span {
  color: #111 !important;
}

/*  다른 페이지에서 검색창 강제 스타일 */
body:not(.home) .site-header .bbp-search-pill,
body:not(.home) .site-header .bbp-searchbar .input-group {
  background: #fff !important;
  border: 1px solid #d1d5db !important;
  border-radius: 9999px !important;
}

body:not(.home) .site-header .bbp-search-pill .bbp-search-input,
body:not(.home) .site-header .bbp-search-pill .form-control {
  color: #111 !important;
}

body:not(.home) .site-header .bbp-search-pill .bbp-search-input::placeholder,
body:not(.home) .site-header .bbp-search-pill .form-control::placeholder {
  color: #6b7280 !important;
}

/* 다른 페이지에서 검색 버튼 */
body:not(.home) .site-header .bbp-search-pill .btn.bbp-search-btn,
body:not(.home) .site-header .btn.bbp-search-btn {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 50% !important;
}

/* 다른 페이지에서 로고는 검정 버전 사용 */
body:not(.home) .site-header .navbar-brand img {
  content: url('/include/image/transparent_logo.png') !important;
}

/*  상단바 텍스트도 강제 검정색 */
body:not(.home) .site-header .bbp-topbar a,
body:not(.home) .site-header .bbp-topbar span {
  color: #111 !important;
}
@media (prefers-reduced-motion: reduce){
  body { scroll-snap-type: none; }
  .snap-section { scroll-snap-align: none; }
}
/* ===============================
   7) 모바일 전용 탑바(홈=투명, 스크롤/다른페이지=흰 배경)
=============================== */
@media (max-width: 991.98px){
  /* 기본 레이아웃 */
  .mobile-topbar{
    position: fixed; top:0; left:0; right:0; height:56px;
    display:flex; align-items:center; justify-content:center;
    padding:0 12px; z-index:1200;
    background:#fff; border-bottom:1px solid rgba(0,0,0,.08);
  }
  /* 모바일은 기본 여백 확보, 홈은 배너 오버레이라 여백 제거 */
  body:not(.home){ padding-top:56px; }
  body.home{ padding-top:0; }

  /* 좌측 햄버거, 로고 중앙 */
  .mobile-topbar .mobile-menu-btn{
    position:absolute; left:8px; top:50%; transform:translateY(-50%);
    font-size:24px; color:#111;
  }
  .mobile-topbar .mobile-logo{ height:28px; content:url('/include/image/transparent_logo.png'); }

  /* 홈(배너 위)에서 투명 + 흰색 */
  .home .mobile-topbar{
    background:transparent !important;
    border-bottom:1px solid rgba(255,255,255,.22) !important;
  }
  .home .mobile-topbar .mobile-menu-btn{ color:#fff !important; }
  .home .mobile-topbar .mobile-logo{ content:url('/include/image/bbcpork_logo_white.png') !important; }

  /* 홈에서 스크롤 후: 흰 배경 + 검정 */
  .home .site-header.scrolled .mobile-topbar{
    background:#fff !important; border-bottom-color:rgba(0,0,0,.12) !important;
  }
  .home .site-header.scrolled .mobile-topbar .mobile-menu-btn{ color:#111 !important; }
  .home .site-header.scrolled .mobile-topbar .mobile-logo{ content:url('/include/image/transparent_logo.png') !important; }
}