/* ============================
   Global Base + Scroll Snap CSS
   ============================ */

:root{
  --dot: #9aa5af;
  --dot-active: #fff;

  /* footer.js가 실측으로 덮어쓰는 값 (fallback) */
  --header-h: 68px;
  --dock-h: 0px;

  --safe-b: env(safe-area-inset-bottom, 0px);
}

*{ box-sizing: border-box; }

/* ❌ html, body { height:100% } 금지 (스냅 기준 깨짐) */

body{
  margin:0;
  font-family:"Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:#fff;
  background:#000;

  /* ✅ 혹시라도 body가 스냅 컨테이너가 되는 걸 완전 차단 */
  scroll-snap-type: none !important;
  scroll-padding-top: 0 !important;
  scroll-padding-bottom: 0 !important;
}

/* =========================================
   Scroll Snap — 컨테이너는 html 하나만!
   ========================================= */

/* 초기 비활성( snap-ready.js 가 켬 ) */
html{ scroll-snap-type: none; }

/* ✅ 스냅 활성화: html만 컨테이너 */
html.snap-enabled{
  scroll-snap-type: y mandatory;
  overscroll-behavior-y: contain;
  scroll-behavior: smooth;

  /* 고정 헤더/하단 리본 보정은 padding으로만 처리 */
  scroll-padding-top: var(--header-h);
  scroll-padding-bottom: calc(var(--dock-h) + var(--safe-b));
}

/* 스냅 대상 섹션 공통 */
.snap-sec{
  /* ★ 모든 섹션 높이 통일 → 100svh
     (개별 섹션에서 -var(--dock-h) 같은 보정 ❌) */
  min-height: 100svh;

  /* 경계 기준 */
  scroll-snap-align: start;
  scroll-snap-stop: always;

  /* 고정 헤더/리본 보정 */
  scroll-margin-top: var(--header-h);
  scroll-margin-bottom: var(--dock-h);

  /* 섹션 간 마진 충돌 방지 */
  margin: 0;
}

/* 접근성: '움직임 줄이기' ON이면 스냅 해제 */
@media (prefers-reduced-motion: reduce){
  html.snap-enabled{ scroll-snap-type: none; }
  .snap-sec{ scroll-snap-align: none; scroll-snap-stop: normal; }
}

/* (선택) JS가 주입하는 사이트 푸터를 스냅 앵커로 취급 */
#gfFooter{
  scroll-snap-align: end;
  scroll-margin-bottom: var(--dock-h);
}

/* =========================================================
   (구) 고정 하단 도크 샘플 — 현재 footer.js 사용 중
   ========================================================= */
.dock-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:10000;
  background:#2c2f33; color:#fff;
  box-shadow:0 -10px 28px rgba(0,0,0,.25);
  transform:translateZ(0);
  padding:12px 16px;
  padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));
}
@supports (padding: max(0px)){
  .dock-bar{ padding-bottom:max(12px, env(safe-area-inset-bottom)); }
}
body.has-dock{
  padding-bottom:calc(var(--dock-h) + env(safe-area-inset-bottom,0px));
}
.dock-bar .dock-row{
  display:flex; gap:12px; align-items:center; justify-content:center; font-weight:700;
}
.dock-bar .btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:999px; border:2px solid #fff; color:#fff; text-decoration:none;
}
.dock-bar .btn:hover{ background:#fff; color:#000; }