/* ==========================================================================
   NAVIGA nav.v2.css — SSOT: 홈 nav의 유일 정본. (v1 → v2, 2026-07-04 E-1 A안)
   v2 변경: ①모바일(≤760px) 전화 직노출 — kakaobtn만 숨기고 callbtn을 아이콘형
   소형 원형 버튼으로 축약(마크업에 svg.ico + aria-label 필요) ②햄버거 드롭다운
   (.navlinks.open) 맨 아래 전화 항목 a.navlinks-call 1줄(데스크톱에선 숨김).
   전 셀렉터 nav.nav-dark 스코프·자급자족 토큰 등 나머지는 v1 그대로.
   수정 시 파일명 버전업(nav.v3.css) 규율 — 이 파일은 immutable 처럼 다룬다.
   ========================================================================== */

/* --- 자급자족 토큰 (builder.css :root + home.v2.css :root{--gold-2} 복사) --- */
nav.nav-dark{
  --green-900:#161E15; --green-800:#1F2A1E; --green-700:#2E3A2E; --green-600:#3A4A3A;
  --green-500:#4A5A48; --sage:#9CAE96; --sage-2:#B9C6B2; --sage-3:#D7DED1;
  --ivory:#F4F1EA; --ivory-2:#EDE9DF; --paper:#FBFAF6; --charcoal:#272A24; --muted:#6E7268;
  --line:rgba(46,58,46,.15); --line-2:rgba(46,58,46,.28); --gold:#B8923F; --gold-2:#C9A86A;
  --serif-ko:'Nanum Myeongjo',serif; --serif-en:'Cormorant Garamond',serif; --sans:'Pretendard',sans-serif;
}

/* --- nav 베이스 (home.v2.css nav{} — fixed·투명·보더·트랜지션) --- */
nav.nav-dark{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;border-bottom:1px solid rgba(160,140,90,.22);transition:background .35s,border-color .35s,box-shadow .35s}

/* --- 앵커 리셋: 홈은 builder.css a{color:inherit;text-decoration:none}에 의존. tools 하위 도구엔 전역 a 리셋이 없어 nav 앵커에 파란 밑줄이 새므로 nav 스코프로 자체 리셋(자급자족) --- */
nav.nav-dark a{color:inherit;text-decoration:none}

/* --- .wrap (builder.css .wrap) + nav .wrap (builder flex + home.v2 height:94px) --- */
nav.nav-dark .wrap{max-width:1180px;margin:0 auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;height:94px}

/* --- .brand (builder base + home.v2 오버라이드). ★.ko 최종 25px = builder.css .brand .ko{font-size:25px} 계승 --- */
nav.nav-dark .brand{display:flex;align-items:baseline;gap:11px;font-size:29px;letter-spacing:.16em;padding-right:28px;border-right:1px solid rgba(160,140,90,.28)}
nav.nav-dark .brand .ko{font-family:var(--serif-ko);font-weight:800;font-size:25px;letter-spacing:.16em}
nav.nav-dark .brand .ko .ha{font-weight:700}

/* --- .navlinks (home.v2 오버라이드: gap 0·구분선). ::after 밑줄 숨김 --- */
nav.nav-dark .navlinks{display:flex;gap:0;font-size:16.5px}
nav.nav-dark .navlinks a{position:relative;padding:10px 26px;border-right:1px solid rgba(160,140,90,.28);transition:color .25s}
nav.nav-dark .navlinks a:first-child{border-left:1px solid rgba(160,140,90,.28)}
nav.nav-dark .navlinks a::after{display:none}
nav.nav-dark .navlinks .navlinks-call{display:none}

/* --- .navbtns (home.v2) --- */
nav.nav-dark .navbtns{display:flex;align-items:center;gap:20px}

/* --- .callbtn (home.v2 오버라이드: 세로 스택·구분선) --- */
nav.nav-dark .callbtn{display:inline-flex;flex-direction:column;align-items:flex-end;gap:0;line-height:1.1;padding:0 20px 0 0;border:0;border-right:1px solid rgba(160,140,90,.28);border-radius:0;background:transparent}
nav.nav-dark .callbtn:hover{background:transparent;border-color:rgba(160,140,90,.28)}
nav.nav-dark .callbtn .lab{font-size:12px;letter-spacing:.14em}
nav.nav-dark .callbtn .num{font-family:var(--serif-en);font-size:23px;letter-spacing:.06em;font-weight:600}
nav.nav-dark .callbtn .ico{display:none;width:19px;height:19px;fill:currentColor}

/* --- .kakaobtn (home.v2 헤더 카카오 버튼, 두 상태 공통) --- */
nav.nav-dark .kakaobtn{display:inline-flex;align-items:center;gap:7px;background:#FEE500;color:#3A1D1D;padding:13px 22px;border-radius:999px;font-size:15px;font-weight:700;transition:background .25s}
nav.nav-dark .kakaobtn svg{width:18px;height:18px;fill:#3A1D1D;stroke:none}
nav.nav-dark .kakaobtn:hover{background:#FBDC00}

/* --- .menu-toggle (builder.css .menu-toggle — 햄버거) --- */
nav.nav-dark .menu-toggle{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;min-width:44px;min-height:44px;align-items:center;justify-content:center}
nav.nav-dark .menu-toggle span{width:24px;height:1.5px;display:block}

/* ---- 다크(상단) 상태 — nav:not(.nav-solid) ---- */
nav.nav-dark:not(.nav-solid) .brand .ko{color:var(--ivory)}
nav.nav-dark:not(.nav-solid) .brand .ko .ha{color:var(--gold-2)}
nav.nav-dark:not(.nav-solid) .navlinks{color:rgba(244,241,234,.86)}
nav.nav-dark:not(.nav-solid) .navlinks a:hover{color:var(--gold-2)}
nav.nav-dark:not(.nav-solid) .navlinks a[aria-current="page"]{color:var(--gold-2)}
nav.nav-dark:not(.nav-solid) .callbtn{color:var(--ivory)}
nav.nav-dark:not(.nav-solid) .callbtn .lab{color:rgba(244,241,234,.6)}
nav.nav-dark:not(.nav-solid) .callbtn .num{color:var(--gold-2)}
nav.nav-dark:not(.nav-solid) .menu-toggle span{background:var(--ivory)}

/* ---- 솔리드(스크롤/밝은배경) 상태 — nav.nav-solid ---- */
nav.nav-dark.nav-solid{background:rgba(244,241,234,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 6px 24px -14px rgba(46,58,46,.35)}
nav.nav-dark.nav-solid .brand .ko{color:var(--green-700)}
nav.nav-dark.nav-solid .brand .ko .ha{color:#000}
nav.nav-dark.nav-solid .navlinks{color:var(--green-600)}
nav.nav-dark.nav-solid .navlinks a:hover{color:var(--green-800)}
nav.nav-dark.nav-solid .navlinks a[aria-current="page"]{color:var(--green-800);font-weight:600}
nav.nav-dark.nav-solid .callbtn{color:var(--green-700)}
nav.nav-dark.nav-solid .callbtn .lab{color:var(--muted)}
nav.nav-dark.nav-solid .callbtn .num{color:var(--green-700)}
nav.nav-dark.nav-solid .menu-toggle span{background:var(--green-700)}

/* ---- responsive: 햄버거 전환 (@media 980px) ---- */
@media(max-width:980px){
  nav.nav-dark .navlinks{display:none}
  nav.nav-dark .brand{border-right:0;padding-right:0}
  nav.nav-dark .menu-toggle{display:flex}
  nav.nav-dark .navlinks.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--ivory);border-bottom:1px solid var(--line);box-shadow:0 18px 32px -24px rgba(46,58,46,.55);padding:6px 0;z-index:60}
  nav.nav-dark .navlinks.open a{padding:14px 28px;border:0;border-bottom:1px solid var(--line);color:var(--green-700);font-size:16px}
  nav.nav-dark .navlinks.open a:last-child{border-bottom:0}
  nav.nav-dark .navlinks.open .navlinks-call{display:block;font-weight:600}
}

/* ---- responsive: 모바일 전화 직노출(A안) — kakaobtn 숨김·callbtn 아이콘형 소형 버튼 (@media 760px) ---- */
@media(max-width:760px){
  nav.nav-dark .navbtns .kakaobtn{display:none}
  nav.nav-dark .navbtns .callbtn{flex-direction:row;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid rgba(160,140,90,.38);border-radius:999px}
  nav.nav-dark .navbtns .callbtn span{display:none}
  nav.nav-dark .navbtns .callbtn .ico{display:block}
}

/* ---- 방어: 초협폭에서 navbtns 내 .prebtn(builder 헤더 필) 숨김 — 전화 버튼과 공존 시 ~420px 이하 오버플로. ≤760 하단 sticky 독에 동일 CTA 존재 ---- */
@media(max-width:480px){
  nav.nav-dark .navbtns .prebtn{display:none}
}

/* ---- 하위 도구용: sticky 변형(문서 흐름 유지·본문 오프셋 불필요). @media print body>*:not(main) 숨김과 정합 ---- */
nav.nav-dark.nav-sticky{position:sticky;top:0}

/* ---- 방어적 이중 안전장치: 인쇄 시 nav 숨김 ---- */
@media print{nav.nav-dark{display:none!important}}
