/* 공통 상단 메뉴 — 정본 템플릿은 worker/site-nav.js.
   페이지마다 CSS 가 달라(a 색·img display 등) 흘러들지 않게, 쓰는 값은 여기서 전부 정한다. hn- 접두사만 쓴다. */
.hn{--hn-h:78px;box-sizing:border-box;height:var(--hn-h);position:sticky;top:0;z-index:60;background:rgba(255,252,248,.94);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #F1E3D7;
  font-family:'Gothic A1','Apple SD Gothic Neo','Malgun Gothic',sans-serif;word-break:keep-all}
.hn *,.hn *::before,.hn *::after{box-sizing:border-box}
.hn-in{max-width:1140px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hn a{text-decoration:none}
.hn-brand{display:flex;align-items:center;gap:11px;color:#241A15}
.hn-brand:hover{color:#241A15}
.hn-brand img{display:block;width:26px;height:26px;max-width:none}
.hn-brand span{font-size:17px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.hn-links{display:flex;align-items:center;gap:34px;flex-wrap:nowrap}
.hn-links a{font-size:15px;font-weight:600;color:#241A15;white-space:nowrap}
.hn-links a:hover,.hn-links a[aria-current="page"]{color:#C2551F}
.hn-links a.hn-cta{display:inline-flex;align-items:center;height:44px;padding:0 22px;border-radius:999px;
  background:linear-gradient(135deg,#FF9B36,#FE705D);color:#fff;font-weight:800;box-shadow:0 12px 28px rgba(254,112,93,.32)}
.hn-links a.hn-cta:hover{color:#fff}
.hn-burger{display:none;background:none;border:0;padding:10px;margin-right:-10px;cursor:pointer;line-height:0}
.hn-menu{display:none}
/* 중간 너비에서 메뉴가 줄바꿈되지 않게: 간격·글자를 줄이고, 그래도 좁으면 버튼과 겹치는 '상담신청' 을 숨긴다 */
@media (max-width:1180px){.hn-links{gap:22px}.hn-links a{font-size:14px}}
@media (max-width:1040px){.hn-links a.hn-apply{display:none}}
@media (max-width:900px){.hn-links{gap:16px}.hn-links a{font-size:13.5px}.hn-links a.hn-cta{padding:0 16px}}
@media (max-width:768px){
  .hn{--hn-h:60px}
  .hn-in{padding:0 20px}
  .hn-links{display:none}
  .hn-burger{display:block}
  /* 높이 제한으로 자르지 않는다(예전 max-height:280px 이 6번째 '심리테스트' 를 가렸다). hidden 으로 열고 닫는다 */
  .hn-menu:not([hidden]){display:block;position:absolute;top:100%;left:0;right:0;max-height:calc(100vh - 60px);overflow-y:auto;
    background:rgba(255,252,248,.98);border-bottom:1px solid #F1E3D7;box-shadow:0 16px 30px rgba(92,58,40,.08)}
  .hn-menu a{display:block;padding:16px 20px;font-size:16px;font-weight:600;color:#241A15;border-top:1px solid #F5EAE0}
  .hn-menu a[aria-current="page"]{color:#C2551F}
}
