/* ==========================================================================
   ORIXON — 내비게이션 (헤더 4항목 + 사업 영역 패널, 푸터 메뉴)
   마크업: header.php / footer.php, 계약: functions.php orixon_nav_*(), 동작: site.js.
   brand-system.css 의 .ox-header/.ox-nav/.ox-footer 골격 위에 얹는다. 모든 스타일시트 다음에 로드한다.
   열림 상태는 hover 가 아니라 버튼의 aria-expanded 와 hidden 속성으로만 바뀐다.
   ========================================================================== */

.ox-header [hidden],.ox-footer [hidden]{display:none !important}

/* ---------- 최상위 항목 ---------- */
.ox-nav-item{display:flex;align-items:center}
.ox-header .ox-nav .ox-nav-trigger{display:inline-flex;align-items:center;gap:7px;min-height:var(--brand-control-h);padding:10px 0;
  background:none;border:0;border-radius:0;font:inherit;font-size:14px;font-weight:550;letter-spacing:-.015em;line-height:1.6;
  color:var(--brand-muted);white-space:nowrap;cursor:pointer}
.ox-header .ox-nav .ox-nav-trigger:hover,
.ox-header .ox-nav .ox-nav-trigger[aria-expanded=true],
.ox-header .ox-nav .ox-nav-trigger[aria-current]{color:var(--brand-text)}
.ox-nav-chevron{width:12px;height:12px;flex-shrink:0;color:var(--brand-subtle)}
.ox-nav-trigger[aria-expanded=true] .ox-nav-chevron{transform:rotate(180deg);color:var(--brand-accent)}
.ox-header .ox-nav .ox-nav-contact[aria-current=page]{border-color:var(--brand-accent)}

/* ---------- 사업 영역 패널 (데스크톱: 헤더 아래 전체 폭) ---------- */
.ox-nav-panel{position:absolute;left:0;right:0;top:100%;z-index:31;background:var(--brand-bg);
  border-top:1px solid var(--brand-line);border-bottom:1px solid var(--brand-line);box-shadow:0 28px 60px rgba(0,0,0,.42);
  max-height:calc(100vh - 76px);overflow-y:auto;overscroll-behavior:contain}
.ox-nav-panel-inner{display:grid;grid-template-columns:minmax(190px,.72fr) minmax(0,3fr);gap:22px clamp(24px,4vw,64px);padding-top:34px;padding-bottom:30px}
.ox-nav-panel-title{font-size:12px;font-weight:650;letter-spacing:.08em;line-height:1.7;color:var(--brand-subtle)}
.ox-nav-panel-lede{margin-top:12px;font-size:19px;font-weight:600;line-height:1.45;letter-spacing:-.03em;color:var(--brand-text)}
.ox-nav-axes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(16px,2.4vw,36px)}
.ox-nav-axis{min-width:0;border-top:1px solid var(--brand-line)}
.ox-header .ox-nav .ox-nav-axis-link{display:grid;justify-items:start;gap:3px;min-height:0;padding:14px 0 16px;border:0;
  white-space:normal;color:var(--brand-text);font-weight:500}
.ox-nav-axis-no{font-size:12px;font-weight:650;letter-spacing:.06em;color:var(--brand-accent);font-variant-numeric:tabular-nums}
.ox-nav-axis-link strong{font-size:20px;font-weight:650;line-height:1.35;letter-spacing:-.03em}
.ox-nav-note{font-size:13px;font-weight:500;line-height:1.6;letter-spacing:0;color:var(--brand-muted)}
.ox-header .ox-nav .ox-nav-axis-link:hover strong{color:var(--brand-accent)}
.ox-nav-axis-link[aria-current=location] strong{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.ox-nav-sub{padding-left:14px;border-left:1px solid var(--brand-line)}
.ox-header .ox-nav .ox-nav-sub a{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;min-height:40px;padding:8px 0;border:0;
  white-space:normal;font-size:14px;font-weight:550;color:var(--brand-text)}
.ox-header .ox-nav .ox-nav-sub a:hover .ox-nav-sub-label{color:var(--brand-accent)}
.ox-nav-panel-foot{grid-column:2;padding-top:4px;border-top:1px solid var(--brand-line)}
.ox-header .ox-nav .ox-nav-all{display:inline-flex;align-items:center;gap:8px;min-height:var(--brand-control-h);padding:10px 0;border:0;
  font-size:14px;font-weight:600;color:var(--brand-accent)}
.ox-header .ox-nav .ox-nav-all:hover{color:var(--brand-text)}
.ox-nav-all .ox-arrow{width:13px;height:13px}
.ox-header .ox-nav .ox-nav-panel a[aria-current=page]{color:var(--brand-text)}

@media (min-width:901px) and (max-width:1100px){
  .ox-nav-panel-inner{grid-template-columns:1fr}
  .ox-nav-panel-intro{display:flex;align-items:baseline;gap:18px}
  .ox-nav-panel-lede{margin-top:0;font-size:16px}
  .ox-nav-panel-lede br{display:none}
  .ox-nav-panel-foot{grid-column:1}
}

/* ---------- 모바일: 같은 버튼이 메뉴 안의 중첩 목록을 연다 ---------- */
@media (max-width:900px){
  .ox-header .ox-nav{max-height:calc(100vh - 68px);max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain}
  /* 스크롤 영역 가장자리에서 포커스 링이 잘리지 않도록 안쪽에 그린다. */
  .ox-header .ox-nav :focus-visible{outline-offset:-2px}
  .ox-nav-item{display:block}
  .ox-header .ox-nav .ox-nav-trigger,
  .ox-header .ox-nav .ox-nav-fallback{display:flex;width:100%;min-height:48px;padding:12px 0;border-bottom:1px solid var(--brand-line);font-size:15px;text-align:left}
  .ox-nav-trigger > span{flex:1}
  .ox-nav-panel{position:static;box-shadow:none;border:0;max-height:none;overflow:visible;background:transparent}
  .ox-nav-panel-inner{display:block;max-width:none;padding:6px 0 10px 14px;border-bottom:1px solid var(--brand-line)}
  .ox-nav-panel-intro{display:none}
  .ox-nav-axes{display:block;padding-left:14px;border-left:1px solid var(--brand-accent)}
  .ox-nav-axis{border-top:0}
  .ox-header .ox-nav .ox-nav-axis-link{grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:10px;row-gap:0;
    min-height:48px;padding:10px 0;border-bottom:1px solid var(--brand-line)}
  .ox-nav-axis-link .ox-nav-note{grid-column:2}
  .ox-nav-axis-link strong{font-size:16px}
  .ox-nav-sub{margin:4px 0 6px;padding-left:14px}
  .ox-header .ox-nav .ox-nav-sub a{min-height:44px;padding:10px 0;border-bottom:1px solid var(--brand-line);font-size:14.5px}
  .ox-header .ox-nav .ox-nav-sub li:last-child a{border-bottom:0}
  .ox-nav-panel-foot{padding-top:0;border-top:0}
  .ox-header .ox-nav .ox-nav-all{min-height:48px;padding:12px 0}
}

/* ---------- 푸터: 사업 영역 / 회사 ---------- */
.ox-footer-links .ox-footer-nav{display:grid;grid-template-columns:repeat(2,minmax(0,auto));gap:24px clamp(40px,6vw,96px);align-items:start;max-width:none}
.ox-footer-nav-title{font-size:12px;font-weight:650;letter-spacing:.08em;line-height:1.7;color:var(--brand-subtle)}
.ox-footer-nav ul{margin-top:8px}
.ox-footer-links .ox-footer-nav a{min-height:32px;padding:5px 0;font-size:13.5px;line-height:1.5;color:var(--brand-muted);white-space:normal}
.ox-footer-links .ox-footer-nav a:hover,.ox-footer-links .ox-footer-nav a[aria-current]{color:var(--brand-text)}
.ox-footer-nav .ox-footer-nav-sub{margin:0 0 4px 2px;padding-left:12px;border-left:1px solid var(--brand-line)}
.ox-footer-nav-sub span{margin-left:8px;font-size:12px;color:var(--brand-subtle)}
@media (max-width:600px){
  .ox-footer-links .ox-footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px;margin-top:26px}
}
@media (max-width:400px){
  .ox-footer-links .ox-footer-nav{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:no-preference){
  .ox-nav-chevron{transition:transform .16s ease}
  .ox-header .ox-nav .ox-nav-trigger,.ox-header .ox-nav .ox-nav-axis-link strong,.ox-header .ox-nav .ox-nav-sub-label{transition:color .16s ease}
}
