/* 전체 페이지 공통 헤더. 본문 너비 토큰과 독립적으로 유지 */
header.nav{--nav-width:1260px;position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1px solid var(--line);backdrop-filter:none}
header.nav>.nav-in{box-sizing:border-box;width:100%;max-width:var(--nav-width);margin:0 auto;padding:0 clamp(24px,5vw,72px);height:64px;min-height:64px;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:20px}
header.nav .brand{display:inline-flex;align-items:center;flex-shrink:0;margin:0;padding:0;text-decoration:none}
header.nav .header-symbol{display:block;width:auto;height:28px;color:var(--ink)}
header.nav .nav-links{display:flex;align-items:center;justify-content:flex-start;width:auto;gap:34px;margin:0;padding:0}
header.nav .nav-group{position:static;display:flex;align-items:center;align-self:stretch}
header.nav .nav-trigger{font-family:inherit;font-size:13px;font-weight:500;line-height:1.6;letter-spacing:normal;white-space:nowrap;padding:22px 0;margin:0;border:0;background:transparent;color:var(--muted);cursor:pointer}
header.nav .nav-trigger span{display:none}
header.nav .nav-dropdown{position:absolute;top:100%;left:0;right:0;transform:none;width:100%;min-width:0;padding:40px max(24px,calc((100vw - 1116px)/2)) 52px;border:0;border-radius:0;background:var(--bg);box-shadow:none}
header.nav .nav-dropdown a{display:block;font-size:25px!important;font-weight:650;line-height:1.25;letter-spacing:-.025em;padding:10px 0;text-decoration:none}
header.nav .store-link{display:flex!important;align-items:center;justify-content:center;width:36px;height:44px;padding:0!important;margin:0!important;color:var(--ink)}
@media(max-width:800px){header.nav>.nav-in{height:auto;min-height:64px;flex-wrap:wrap;gap:10px;padding:18px clamp(24px,5vw,72px) 0}header.nav .header-symbol{height:25px}header.nav .nav-links{width:100%;justify-content:space-between;gap:8px}header.nav .nav-trigger{font-size:12px;padding:15px 0}header.nav .store-link{width:27px}header.nav .nav-dropdown,header.nav .nav-group:nth-last-of-type(-n+2) .nav-dropdown{left:0;right:0;transform:none;padding:28px 24px 40px;min-width:0}header.nav .nav-dropdown a{font-size:22px!important;padding:10px 0}}

/* 긴 홈과 짧은 하위 페이지 사이의 스크롤바 유무로 인한 이동 방지 */
html{overflow-y:scroll;scrollbar-gutter:stable}
header.nav{font-family:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;font-size:13px;font-weight:400;line-height:1.6;letter-spacing:normal;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
header.nav .brand{font-size:13px;font-weight:400;line-height:1;letter-spacing:normal;gap:0;color:var(--ink)}
header.nav .nav-trigger{font-family:inherit;text-rendering:inherit;-webkit-font-smoothing:inherit}

header.nav a.nav-trigger{display:flex;align-items:center;text-decoration:none;color:var(--muted)}

header.nav .nav-links{gap:26px}@media(max-width:800px){header.nav .nav-links{gap:6px}header.nav .nav-trigger{font-size:11px}}

/* 작은 제목은 실제 하위 분류에 사용 */
header.nav .nav-dropdown::before{display:none}
header.nav .nav-group.is-open .nav-dropdown{display:flex;align-items:flex-start;gap:80px}
header.nav .nav-section{min-width:200px}
header.nav .nav-section-title{font-size:12px;font-weight:400;line-height:1.5;letter-spacing:0;color:var(--muted);margin:0 0 18px;padding:0}
@media(max-width:800px){header.nav .nav-group.is-open .nav-dropdown{gap:28px;flex-wrap:wrap}header.nav .nav-section{min-width:0;flex:1 1 180px}header.nav .nav-section-title{margin-bottom:12px}}
/* 페이지별 스타일에 의존하지 않는 공통 카트 아이콘 */
header.nav .nav-links .store-link{flex:0 0 36px;line-height:1;color:var(--ink)}
header.nav .nav-links .store-link>svg{display:block;width:23px;height:23px;min-width:23px;max-width:23px;max-height:23px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;opacity:1}
@media(max-width:800px){header.nav .nav-links .store-link{flex-basis:27px}}

/* ── 반응형 보강 ── */
/* 데스크톱 드롭다운: 화면보다 길면 안에서 스크롤, 아래 경계선 */
header.nav .nav-dropdown{overflow-y:auto;overscroll-behavior:contain;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(0,0,0,.08);max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px)}

/* 모바일(800px 이하): 심볼 · 장바구니 · 햄버거 한 줄 헤더, 메뉴는 햄버거 안에서 아코디언 */
.nav-burger,.m-menu{display:none}
@media(max-width:800px){
header.nav{--nav-h:56px}
header.nav>.nav-in{height:var(--nav-h);min-height:var(--nav-h);flex-wrap:nowrap;gap:4px;padding:0 20px 0 24px}
header.nav .header-symbol{height:26px}
header.nav .nav-links{width:auto;margin-left:auto;gap:0;justify-content:flex-end}
header.nav .nav-group{display:none}
header.nav .nav-links .store-link{flex:0 0 44px;width:44px;height:44px}
.nav-burger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:44px;height:44px;margin:0 -10px 0 0;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent}
.nav-burger span{display:block;width:18px;height:1.5px;background:currentColor;border-radius:2px;transition:transform .25s ease}
.nav-burger[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.nav-burger[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.m-menu{display:block;position:absolute;top:100%;left:0;right:0;height:calc(100vh - var(--nav-h));height:calc(100dvh - var(--nav-h));overflow-y:auto;overscroll-behavior:contain;background:var(--bg);padding:8px 24px calc(40px + env(safe-area-inset-bottom));visibility:hidden;opacity:0;transition:opacity .2s ease,visibility 0s linear .2s}
.m-menu.open{visibility:visible;opacity:1;transition:opacity .2s ease}
.m-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:18px 0;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:22px;font-weight:650;letter-spacing:-.025em;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.m-chev{width:9px;height:9px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);margin:-4px 4px 0 0;transition:transform .25s ease}
.m-group.open .m-chev{transform:rotate(225deg);margin-top:4px}
.m-body{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .28s ease,visibility 0s linear .28s}
.m-group.open .m-body{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .28s ease}
.m-body>div{overflow:hidden;min-height:0}
.m-sec{padding:6px 0 10px}
.m-sec-title{margin:14px 0 2px;font-size:12px;line-height:1.5;color:var(--muted)}
.m-sec a{display:block;padding:11px 0;font-size:18px;font-weight:550;line-height:1.35;letter-spacing:-.02em;color:var(--ink);text-decoration:none}
.m-group.open+.m-group .m-trigger{border-top:0}
}
@media(prefers-reduced-motion:reduce){.m-menu,.m-body,.m-chev,.nav-burger span{transition:none!important}}