/* ========================= */
/* header-menu.css */
/* ========================= */

/* 공통 기본값 */
ul { margin: 0; padding: 0; list-style: none; }
a { text-decoration: none; color: inherit; }

/* PC 메뉴 */
.header-menu.pc-menu {
  display: flex; 
  gap: 36px; 
  align-items: center;
}
.header-menu.pc-menu li a {
  color: #fff;
  font-size: 1.13rem;
  font-weight: 600;
  padding: 10px 18px 12px 18px;
  border-radius: 6px;
  letter-spacing: 0.01em;
  background: transparent;
  transition: background .22s, color .16s, box-shadow .2s;
}
.header-menu.pc-menu li a:hover {
  color: #222; 
  background: #ffe066;
  box-shadow: 0 4px 16px #ffe06633;
}

/* 모바일 메뉴 */
@media (max-width: 650px) {
  body .header-nav-wrap, 
  body .header-nav {
    top: 0 !important; 
    left: 0 !important; 
    right: 0 !important;
    width: 100% !important; 
    margin: 0 !important; 
    padding: 0 !important;
    background: #111 !important; 
    box-shadow: none !important; 
    z-index: 9999 !important;
    height: auto !important; 
    display: block !important;
  }

  .header-menu.pc-menu { display: none !important; }

  .menu-toggle-btn {
    display: block !important; 
    position: fixed !important; 
    left: 20px !important; 
    bottom: 20px !important;
    z-index: 5000 !important; 
    background: rgba(30,30,30,0.88) !important; 
    border: none !important;
    font-size: 2.3rem !important; 
    color: #fff !important; 
    border-radius: 50% !important;
    width: 54px !important; 
    height: 54px !important; 
    line-height: 54px !important; 
    text-align: center !important;
    cursor: pointer !important; 
    box-shadow: 0 3px 14px 0 rgba(0,0,0,0.17) !important; 
    transition: background 0.2s !important;
  }
  .menu-toggle-btn:active { background: #333 !important; }

  .mobile-menu-row { display: none !important; }
  .header-nav.menu-open .mobile-menu-row { 
    display: block !important; 
    position: fixed !important; 
    top: 0; left: 0; 
    width: 100vw; height: 100vh; 
    background: rgba(20,20,20,0.97); 
    z-index: 4000; 
  }

  .mobile-menu-row .close-btn {
    position: absolute !important; 
    top: 18px !important; 
    right: 18px !important; 
    z-index: 4100 !important;
    background: none !important; 
    border: none !important; 
    font-size: 2.5rem !important; 
    color: #fff !important;
    cursor: pointer !important; 
    width: 50px !important; 
    height: 50px !important; 
    line-height: 50px !important; 
    text-align: center !important;
  }

  .mobile-menu-row .header-menu.mobile-menu {
    flex-direction: column !important; 
    align-items: center !important; 
    gap: 0 !important;
    padding: 70px 0 0 0 !important; 
    text-align: center !important;
  }

  .mobile-menu-row .header-menu.mobile-menu li { 
    padding: 18px 0 !important; 
  }
  .mobile-menu-row .header-menu.mobile-menu li a { 
    color: #fff !important; 
    font-size: 1.15rem !important; 
    background: none !important; 
  }
}

/* PC 환경에서 모바일 메뉴 숨김 */
@media (min-width: 651px) {
  .mobile-menu-row, .menu-toggle-btn, .header-menu.mobile-menu { 
    display: none !important; 
  }
}