@charset "utf-8";

/* ==========================================================================
   Header — 상단(다크 위) 투명+흰 로고/흰 텍스트 → 스크롤 시 흰 배경+검은 텍스트+컬러 로고
   ※ header.js 계약: uwHeader / is-scrolled / uw-gnb__* / uw-mobile-* / uw-sitemap-*
   ========================================================================== */

.uw-header {
  position: fixed; top: 0; left: 0; width: 100%; height: var(--header-height);
  z-index: 1000; display: flex; align-items: center;
  background: transparent; transition: background .3s ease, box-shadow .3s ease, border-color .3s ease;
  border-bottom: 1px solid transparent;
}
.uw-header.is-scrolled {
  background: #fff; border-bottom-color: var(--border);
  box-shadow: 0 2px 22px rgba(11, 18, 32, .06);
}

.uw-header-inner {
  width: 100%; max-width: var(--area-width); margin: 0 auto; padding: 0 var(--area-padding);
  display: flex; align-items: center; gap: 34px;
}

/* Logo — 흰/컬러 스왑 */
.uw-logo { flex-shrink: 0; line-height: 0; }
.uw-logo a { display: inline-flex; align-items: center; }
.uw-logo img { height: 40px; width: auto; }
.uw-logo__light { display: block; }
.uw-logo__color { display: none; }
.uw-header.is-scrolled .uw-logo__light { display: none; }
.uw-header.is-scrolled .uw-logo__color { display: block; }

/* GNB (PC) */
.uw-gnb { margin-left: auto; }
.uw-gnb__list { display: flex; align-items: center; gap: 4px; }
.uw-gnb__item { position: relative; }
.uw-gnb__link { display: block; padding: 10px 15px; font-family: var(--font-title); font-size: 16px; font-weight: 400;
  color: rgba(255, 255, 255, .82); transition: color .2s; white-space: nowrap; }
.uw-gnb__link:hover { color: #fff; }
.uw-gnb__item.is-active .uw-gnb__link { color: #fff; }
.uw-header.is-scrolled .uw-gnb__link { color: var(--text); }
.uw-header.is-scrolled .uw-gnb__link:hover,
.uw-header.is-scrolled .uw-gnb__item.is-active .uw-gnb__link { color: var(--black); }
.uw-gnb__item.is-active .uw-gnb__link::after {
  content: ''; display: block; height: 2px; margin-top: 5px; border-radius: 2px; background: var(--primary); }
.uw-gnb__sub { display: none !important; }

/* Utility (다국어 + 모바일버튼) */
.uw-header-util { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }

/* 다국어 — Global 드롭다운 */
.uw-lang { position: relative; }
.uw-lang__toggle { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 8px;
  font-family: var(--font-title); font-size: 14px; font-weight: 700; color: rgba(255, 255, 255, .82);
  transition: color .2s, background .2s; }
.uw-lang__toggle:hover { color: #fff; background: rgba(255, 255, 255, .10); }
.uw-lang__globe { width: 18px; height: 18px; flex-shrink: 0; }
.uw-header.is-scrolled .uw-lang__toggle { color: var(--text); }
.uw-header.is-scrolled .uw-lang__toggle:hover { color: var(--black); background: var(--bg); }

/* 드롭다운 메뉴 (항상 흰 팝업) */
.uw-lang__menu { position: absolute; top: calc(100% + 10px); right: 0; min-width: 168px; list-style: none;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
  padding: 6px; opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease; z-index: 1100; }
.uw-lang.is-open .uw-lang__menu { opacity: 1; visibility: visible; transform: translateY(0); }
.uw-lang__menu a { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 12px; border-radius: 6px; font-family: var(--font-title); font-size: 14px; font-weight: 600;
  color: var(--text); letter-spacing: 0; transition: var(--transition); }
.uw-lang__menu a:hover { background: var(--bg); color: var(--black); }
.uw-lang__menu a.is-active { color: var(--primary); }
.uw-lang__menu a[aria-disabled="true"] { color: var(--text-light); cursor: default; }
.uw-lang__menu a[aria-disabled="true"]:hover { background: transparent; color: var(--text-light); }
.uw-lang__menu small { font-size: 11px; font-weight: 400; color: var(--text-light); }

/* PC 사이트맵 — 미사용 */
.uw-sitemap-btn, .uw-sitemap { display: none !important; }

/* Mobile hamburger */
.uw-mobile-btn { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 44px; margin-right: -11px; }
.uw-mobile-btn .line { display: block; width: 22px; height: 2px; background: #fff; margin: 0 auto; border-radius: 2px; transition: var(--transition); }
.uw-header.is-scrolled .uw-mobile-btn .line { background: var(--black); }

/* ==========================================================================
   Mobile Nav Drawer (≤1024) — 항상 다크 드로어
   ========================================================================== */
.uw-mobile-overlay { position: fixed; inset: 0; z-index: 1050; background: rgba(5, 8, 15, .5);
  opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; }
.uw-mobile-overlay.is-active { opacity: 1; visibility: visible; }

.uw-mobile-nav { position: fixed; top: 0; right: 0; z-index: 1060; width: 300px; max-width: 84vw; height: 100%;
  background: var(--d-bg); border-left: 1px solid var(--d-line);
  transform: translateX(100%); transition: transform .32s cubic-bezier(.16, 1, .3, 1);
  display: flex; flex-direction: column; padding: 22px; overflow-y: auto; }
.uw-mobile-nav.is-open { transform: translateX(0); }
.uw-mobile-nav__close { align-self: flex-end; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; font-size: 26px; color: var(--d-dim); }
.uw-mobile-nav__list { margin-top: 6px; }
.uw-mobile-nav__item { border-bottom: 1px solid var(--d-line); }
.uw-mobile-nav__link,
.uw-mobile-nav__trigger { display: flex; align-items: center; justify-content: space-between; width: 100%;
  padding: 16px 4px; font-family: var(--font-title); font-size: 17px; font-weight: 400; color: var(--d-text); text-align: left; }
.uw-mobile-nav__link:hover { color: var(--primary); }
.uw-mobile-nav__sub { display: none; padding: 0 4px 12px; }
.uw-mobile-nav__item.is-open .uw-mobile-nav__sub { display: block; }
.uw-mobile-nav__sub a, .uw-mobile-nav__sub-link { display: block; padding: 9px 0; color: var(--d-dim); font-size: 15px; }
.uw-mobile-nav__lang { margin-top: 24px; padding-top: 20px; }
.uw-mobile-nav__lang-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px;
  font-family: var(--font-title); font-size: 13px; font-weight: 700; letter-spacing: .04em; color: var(--d-dim); }
.uw-mobile-nav__lang-head svg { width: 17px; height: 17px; flex-shrink: 0; }
.uw-mobile-nav__lang a { display: flex; align-items: center; justify-content: space-between;
  padding: 12px 4px; font-family: var(--font-title); font-size: 16px; font-weight: 600; color: var(--d-text); }
.uw-mobile-nav__lang a.is-active { color: var(--primary); }
.uw-mobile-nav__lang a[aria-disabled="true"] { color: var(--d-dim); }
.uw-mobile-nav__lang small { font-size: 12px; font-weight: 400; color: var(--d-dim); }

body.mobile-menu-open { position: fixed; width: 100%; overflow: hidden; }

/* ==========================================================================
   Responsive — GNB > 1024, 햄버거 ≤ 1024
   ========================================================================== */
@media (max-width: 1024px) {
  .uw-gnb { display: none; }
  .uw-lang { display: none; }               /* 모바일 헤더에선 언어토글 제거 (드로어 내 언어선택 유지) */
  .uw-header-util { margin-left: auto; }     /* gnb가 담당하던 우측정렬을 util이 대신 → 햄버거 우측 고정 */
  .uw-mobile-btn { display: flex; }
  .uw-logo img { height: 36px; }
}
@media (max-width: 600px) {
  .uw-logo img { height: 32px; }
}