:root{
  --nav-h: 64px;
}

.nav{
  min-height: var(--nav-h);
  overflow: visible;
}

.nav-inner{
  min-height: var(--nav-h);
}

.brand{
  flex: 0 0 auto;
  min-width: 0;
  line-height: 0;
}

.brand:hover,
.brand:focus{
  color: var(--ink);
  text-decoration: none;
}

.brand-mark{
  display:block;
  flex:0 0 auto;
  width:26px;
  height:26px;
  object-fit:cover;
}

.brand-logo{
  display:block;
  flex:0 0 auto;
  width:auto;
  height:50px;
  max-width:150px;
  object-fit:contain;
}

.nav-links a{
  font-size:16px !important;
}

.nav-links a.nav-cta{
  font-size:13px !important;
}

@media (max-width: 900px){
  .nav-links{
    display:none;
  }

  .menu-btn{
    display:inline-flex;
  }

  .mobile-menu{
    background: #fff;
    box-shadow: 0 28px 70px rgba(0,0,0,0.16);
    height: calc(100dvh - var(--nav-h));
    min-height: calc(100vh - var(--nav-h));
    overflow-y: auto;
    padding-left: max(22px, env(safe-area-inset-left));
    padding-right: max(22px, env(safe-area-inset-right));
    z-index: 60;
  }

  .menu-open{
    overflow: hidden;
  }

  .menu-open .nav{
    background: #fff;
  }
}

@media (max-width: 680px){
  :root{
    --nav-h: 56px;
  }

  .brand-mark{
    width:24px;
    height:24px;
  }

  .brand-logo{
    height:40px;
    max-width:120px;
  }
}

/* Footer credit band — full-width hairline divider, centered text inside */
footer .footer-credit{
  border-top: 1px solid var(--line-2);
  margin-top: 28px;
  padding: 16px 0 0;
}
footer .footer-credit .wrap{
  display: block;
  text-align: center;
  font-size: 11px;
  color: var(--muted);
  letter-spacing: 0.02em;
}
footer .footer-credit a{
  color: var(--muted);
  text-decoration: none;
  font-weight: 500;
  transition: color .15s ease;
  border-bottom: 1px dotted transparent;
}
footer .footer-credit a:hover{
  color: var(--ink);
  text-decoration: none;
  border-bottom-color: var(--ink);
}