/* 서브페이지: bootstrap.min.css 이후 로드 — 메인(index)과 동일한 상단·슬라이드 메뉴 유지
   (main.css의 :root 변수에 의존 — main.css를 반드시 그 앞에 둘 것) */
html{
  font-size:62.5%;
  scroll-behavior:smooth;
  scrollbar-gutter:stable;
}
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);
  box-sizing:border-box;
  background:rgba(255,255,255,0.97);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 48px;border-bottom:1px solid var(--border);
  box-shadow:0 1px 8px rgba(13,35,102,0.04);
  font-family:var(--font-nav);
  line-height:1;
  margin:0;
  -webkit-font-smoothing:antialiased;
}
.site-logo{
  font-size:clamp(1.1rem,1vw,1.3rem);letter-spacing:0.14rem;color:var(--ink);
  text-transform:uppercase;text-decoration:none;cursor:pointer;font-family:var(--font-nav);
  line-height:1.15;display:inline-flex;align-items:baseline;
  justify-self:start;
}
.site-logo-strong{font-weight:700;}
.site-logo-light{font-weight:300;}
.site-nav ul.site-nav-links{
  display:flex;gap:clamp(1.6rem,2.2vw,3.2rem);list-style:none;margin:0;padding:0;align-items:center;
  justify-self:center;
}
.site-nav .site-nav-links > li{
  margin:0;padding:0;list-style:none;display:flex;align-items:center;
}
.site-nav-links a{
  color:var(--ink);text-decoration:none;
  font-size:clamp(1.15rem,1.05vw,1.35rem);font-weight:300;
  letter-spacing:0.05em;text-transform:uppercase;transition:opacity .25s;cursor:pointer;
  line-height:1.2;display:inline-block;
}
.site-nav-links a:hover{opacity:0.55}
.site-nav-links a.active{opacity:1;font-weight:400}
.hamburger-btn{justify-self:end!important}
.hamburger-btn{
  background:none!important;border:none!important;cursor:pointer;padding:8px;
  display:flex;flex-direction:column;gap:5px;align-items:flex-end;
  box-shadow:none!important;border-radius:0!important;
  font:inherit;line-height:normal;
}
.hamburger-btn span{display:block;height:1.5px;background:var(--ink);transition:all .3s}
.hamburger-btn span:nth-child(1){width:24px}
.hamburger-btn span:nth-child(2){width:16px}
.hamburger-btn span:nth-child(3){width:24px}
.hamburger-btn.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);width:24px}
.hamburger-btn.open span:nth-child(2){opacity:0}
.hamburger-btn.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);width:24px}

.menu-overlay{
  position:fixed;inset:0;background:rgba(13,35,102,0.3);z-index:200;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.menu-overlay.open{opacity:1;pointer-events:all}
.slide-menu{
  position:fixed;top:0;right:0;bottom:0;width:300px;background:#fff;z-index:210;
  transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;padding:32px 40px;
  box-shadow:-8px 0 48px rgba(13,35,102,.14);
  font-family:var(--font-nav);
  max-height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.slide-menu.open{transform:translateX(0)}
.slide-menu{scrollbar-width:none;-ms-overflow-style:none;}
.slide-menu::-webkit-scrollbar{display:none;}
.slide-menu-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:48px}
.slide-menu-logo{font-size:1.2rem;font-weight:700;letter-spacing:0.14rem;color:var(--ink);text-transform:uppercase;font-family:var(--font-nav)}
.slide-menu-close{
  background:none!important;border:none!important;cursor:pointer;font-size:18px;color:var(--ink-soft);
  padding:4px;line-height:1;box-shadow:none!important;border-radius:0!important;
}
.slide-menu ul.slide-menu-links{
  list-style:none;flex:1;margin:0;padding:0;
}
.slide-menu-links li{border-bottom:1px solid var(--border);margin:0}
.slide-menu-links a{
  display:block;padding:18px 0;font-size:1.25rem;font-weight:300;letter-spacing:0.05em;
  text-transform:uppercase;color:var(--ink);text-decoration:none;font-family:var(--font-nav);
  transition:opacity .2s,padding-left .2s;cursor:pointer;
}
.slide-menu-links a:hover{opacity:0.55;padding-left:6px}
.slide-menu-footer{padding-top:24px;border-top:1px solid var(--border)}
.slide-menu-footer address{font-style:normal;font-size:1.15rem;font-weight:300;color:var(--ink-soft);line-height:1.8;font-family:var(--font-body)}

@media (max-width:768px){
  .site-nav{
    grid-template-columns:1fr auto;
    padding:0 20px;
  }
  /* 메인(index)과 동일하게 모바일/태블릿에서 상단 탭 숨김.
     line 31의 `.site-nav ul.site-nav-links{display:flex}` 보다 specificity 를 같거나 높게 유지. */
  .site-nav ul.site-nav-links{display:none}
}
