/* 공개 페이지의 로고 위치와 글꼴을 랜딩 헤더 기준으로 유지합니다. */
@font-face {
  font-family: "MuCut Header";
  src: url("/assets/fonts/PretendardVariable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 45 920;
  font-display: swap;
}

:root {
  --site-header-height: 56px;
  --site-header-color: #eae3e5;
  --site-header-ink: #28242b;
}
.nav,
.nav.nav-scrolled,
.site-header,
.guide-nav {
  height: var(--site-header-height);
  border-bottom: 1px solid rgba(40, 36, 43, .1);
  background: var(--site-header-color);
  color: var(--site-header-ink);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.nav,
.nav.nav-scrolled {
  background: rgba(234, 227, 229, calc(.85 + var(--nav-opacity, 0) * .15));
  border-bottom-color: rgba(40, 36, 43, calc(var(--nav-opacity, 0) * .1));
  transition: none;
}
.nav .nav-inner,
.site-header .header-inner,
.guide-nav-inner {
  display: flex;
  width: min(calc(100% - 30px), 1240px);
  height: 100%;
  min-height: 0;
  margin-inline: auto;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.nav .brand,
.site-header .brand,
.guide-nav .brand {
  display: inline-flex;
  min-height: 44px;
  margin-left: 0;
  align-items: center;
  color: var(--site-header-ink);
  font-family: "MuCut Header", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 26px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.075em;
  text-decoration: none;
  text-transform: none;
  text-shadow: none;
  -webkit-font-smoothing: antialiased;
}
.nav .nav-links a,
.site-header .header-inner nav,
.guide-nav .back-link {
  color: #4e4850;
  text-shadow: none;
}
.site-header #back-link {
  color: #4e4850;
  font-size: 12px;
  text-decoration: none;
}
.nav .nav-cta {
  border-color: var(--site-header-ink);
  background: var(--site-header-ink);
  color: #fff;
  box-shadow: none;
}
.nav .nav-cta:hover { background: #413740; border-color: #413740; }
.nav .auth-trigger,
.nav .account-trigger {
  background: rgba(255, 255, 255, .18);
  color: var(--site-header-ink);
  backdrop-filter: none;
}
.step-tabs { top: var(--site-header-height); }
.is-embedded .step-tabs { top: 0; }

@media (max-width: 640px) {
  :root { --site-header-height: 52px; }
  .nav .nav-inner,
  .site-header .header-inner,
  .guide-nav-inner {
    width: min(calc(100% - 26px), 1240px);
    gap: 8px;
  }
  .nav .brand,
  .site-header .brand,
  .guide-nav .brand {
    margin-left: 3px;
    font-size: 24px;
  }
}