/* ── GNB ──────────────────────────────────────────── */
.gnb{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:26px;height:72px;
 padding:0 var(--gut);background:#fff;
 border-bottom:1px solid transparent;transition:border-color .2s ease,background .2s ease}
.gnb.stuck{border-bottom-color:var(--nf-color-border);background:#fff}
.gnb .mark{display:flex;align-items:center;flex:none;text-decoration:none}
.gnb .mark svg{display:block;height:30px;width:auto}
.gnb nav{display:flex;align-items:center;gap:2px}
.gnb .mark{display:inline-flex;align-items:center;min-height:40px}
/* 열린 항목은 색이 아니라 회색 알약으로 표시한다 */
.gnb nav [data-nav]{padding:9px 15px;text-decoration:none;border-radius:var(--nf-radius-150);background:none;border:0;
 font-size:.9375rem;font-weight:600;color:var(--nf-color-body);
 display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
 transition:background .16s linear}
.gnb nav [data-nav]:hover{background:var(--nf-color-backgroundNeutral)}
.gnb .mega-wrap:hover>[data-nav],.gnb .mega-wrap:focus-within>[data-nav]{background:var(--nf-color-grey2)}
.gnb nav [data-nav] svg{transition:rotate .2s ease}
.gnb .mega-wrap:hover>.has svg,.gnb .mega-wrap:focus-within>.has svg{rotate:180deg}
/* 현재 페이지 표시. 페이지가 <body data-page="..."> 를 선언하면 걸린다 */
body[data-page] .gnb nav [data-nav]{position:relative}
body[data-page="ax-education"] [data-nav="ax-education"],
body[data-page="ax-consulting"] [data-nav="ax-consulting"],
body[data-page="ax-lab"] [data-nav="ax-lab"],
body[data-page="insights"] [data-nav="insights"]{background:var(--nf-color-grey2)}
.gnb .sp{flex:1}
.gnb .act{display:flex;align-items:center;gap:10px;flex:none}

/* 메가 드롭다운 */
.mega-wrap{position:relative}
/* 2열 그리드 → 세로 한 줄. 제목 아래 설명이 붙는 리스트형 */
.mega{position:absolute;top:calc(100% + 10px);left:50%;translate:-50% 6px;width:min(340px,88vw);
 padding:12px;background:#fff;border:1px solid var(--nf-color-border);border-radius:var(--nf-radius-panel);
 box-shadow:0 2px 6px #0515240a,0 18px 44px -16px #05152433;
 display:flex;flex-direction:column;gap:2px;
 opacity:0;visibility:hidden;transition:opacity .18s ease,translate .18s ease,visibility .18s}
.mega-wrap:hover .mega,.mega:hover,.mega-wrap:focus-within .mega{opacity:1;visibility:visible;translate:-50% 0}
.mega a{display:block;padding:12px 14px;border-radius:var(--nf-radius-media);text-decoration:none;
 color:inherit;transition:background .16s linear}
.mega a:hover{background:var(--nf-color-grey1)}
/* 플랫폼과 프로젝트는 층위가 다르다. 평평한 목록이면 OS 가 제품 하나로 보인다 */
.mega .grp{display:block;margin:10px 14px 6px;font-size:.6875rem;font-weight:700;
 letter-spacing:.14em;color:var(--nf-color-grey5)}
.mega .grp:not(:first-child){margin-top:14px;padding-top:12px;
 border-top:1px solid var(--nf-color-border)}
.mega .t{display:block;font-size:.9375rem;font-weight:600;line-height:1.4}
.mega .d{display:block;margin-top:5px;font-size:.8125rem;line-height:1.5;
 color:var(--nf-color-bodyDimmed)}

/* ── 모바일 메뉴 ──────────────────────────────────── */
.burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;
 border:0;background:transparent;border-radius:var(--nf-radius-btn);flex:none}
.burger:hover{background:var(--nf-color-backgroundNeutral)}
.burger i{display:block;width:18px;height:1.6px;background:var(--nf-color-body);border-radius:2px;
 position:relative;transition:background .2s ease}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:18px;height:1.6px;
 background:var(--nf-color-body);border-radius:2px;transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.burger i::before{top:-6px}.burger i::after{top:6px}
.burger[aria-expanded="true"] i{background:transparent}
.burger[aria-expanded="true"] i::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i::after{transform:translateY(-6px) rotate(-45deg)}
.sheet{display:none;position:fixed;inset:72px 0 0;z-index:59;background:#fff;
 padding:22px var(--gut) 40px;overflow-y:auto;flex-direction:column;gap:4px}
.sheet[data-open="true"]{display:flex}
.sheet a,.sheet .grp>button{display:block;width:100%;text-align:left;padding:15px 0;border:0;
 background:none;font:inherit;font-size:1.0625rem;font-weight:600;color:var(--nf-color-body);
 border-bottom:1px solid var(--nf-color-border);text-decoration:none}
.sheet .sub{padding:4px 0 12px}
.sheet .sub a{font-size:.9375rem;font-weight:500;color:var(--nf-color-bodyDimmed);
 padding:11px 0 11px 14px;border-bottom:0}
.sheet .act{display:flex;flex-direction:column;gap:10px;margin-top:26px}
.sheet .act .btn{display:flex;align-items:center;justify-content:center;width:100%;height:50px;padding:15px 20px;text-align:center;border-radius:var(--nf-radius-btn-lg)}

@media(max-width:820px){
 .gnb nav,.gnb>.act{display:none}
 .burger{display:inline-flex}
 body[data-lock="1"]{overflow:hidden}
}
