:root {
  --kh-nav-page-scale: 0.87;
  --kh-nav-scaled-rail: 1220px;
  --kh-nav-visual-rail: 1061px;
  --kh-nav-wide-inset: 92%;
  --kh-nav-mobile-inset: 24px;
  --kh-nav-top-offset: 12px;
  --kh-nav-tablet-top-offset: 14px;
  --kh-nav-shell-radius: 26px;
  --kh-nav-mobile-radius: 24px;
  --kh-nav-shell-gap: 18px;
  --kh-nav-tablet-gap: 12px;
  --kh-nav-mobile-gap: 10px;
  --kh-nav-shell-padding-y: 8px;
  --kh-nav-shell-padding-x: 14px;
  --kh-nav-tablet-padding-y: 9px;
  --kh-nav-tablet-padding-x: 14px;
  --kh-nav-mobile-padding-y: 8px;
  --kh-nav-mobile-padding-x: 10px;
  --kh-nav-pill-padding: 3px;
  --kh-nav-mobile-pill-padding: 2px;
  --kh-nav-link-height: 38px;
  --kh-nav-tablet-link-height: 42px;
  --kh-nav-mobile-link-height: 34px;
  --kh-nav-link-padding-x: 20px;
  --kh-nav-special-link-padding-x: 18px;
  --kh-nav-tablet-link-padding-x: 16px;
  --kh-nav-mobile-link-padding-x: 12px;
}

.page-marketing,
.status-page,
.page-legal {
  --kh-nav-rail: var(--kh-nav-scaled-rail);
}

.solana-page,
.notary-page {
  --kh-nav-rail: var(--kh-nav-visual-rail);
}

.page-marketing header.nav > .container,
.page-marketing header.nav > .mobile-subnav,
header.nav.nav--site > .container,
header.nav.nav--site > .mobile-subnav {
  width: min(var(--kh-nav-rail, var(--kh-nav-scaled-rail)), var(--kh-nav-wide-inset));
  max-width: var(--kh-nav-rail, var(--kh-nav-scaled-rail));
}

.site-nav,
.notary-nav {
  width: min(var(--kh-nav-rail, var(--kh-nav-visual-rail)), calc(100% - 64px));
  max-width: var(--kh-nav-rail, var(--kh-nav-visual-rail));
  margin: var(--kh-nav-top-offset) auto 0;
  border-radius: var(--kh-nav-shell-radius);
  padding: var(--kh-nav-shell-padding-y) var(--kh-nav-shell-padding-x);
  gap: var(--kh-nav-shell-gap);
}

.page-marketing .nav-inner,
.nav--site .nav-inner {
  border-radius: var(--kh-nav-shell-radius);
  gap: var(--kh-nav-shell-gap);
}

.page-marketing .nav-inner {
  padding: 10px 14px;
}

.page-marketing .nav-links,
.nav--site .nav-links,
.site-nav nav,
.notary-nav nav {
  padding: var(--kh-nav-pill-padding);
}

.site-nav nav {
  gap: 6px;
}

.site-nav nav a,
.notary-nav nav a,
.site-nav .nav-cta,
.notary-nav .nav-cta {
  min-height: var(--kh-nav-link-height);
}

.site-nav nav a,
.notary-nav nav a {
  min-width: 88px;
}

.site-nav nav a,
.site-nav .nav-cta {
  padding-left: var(--kh-nav-special-link-padding-x);
  padding-right: var(--kh-nav-special-link-padding-x);
}

.notary-nav nav a {
  padding-left: var(--kh-nav-link-padding-x);
  padding-right: var(--kh-nav-link-padding-x);
}

@media (max-width: 920px) {
  .site-nav,
  .notary-nav {
    width: calc(100% - var(--kh-nav-mobile-inset));
    max-width: none;
    margin-top: var(--kh-nav-tablet-top-offset);
    padding: var(--kh-nav-tablet-padding-y) var(--kh-nav-tablet-padding-x);
    gap: var(--kh-nav-tablet-gap);
  }

  .site-nav nav a,
  .notary-nav nav a,
  .site-nav .nav-cta,
  .notary-nav .nav-cta {
    min-height: var(--kh-nav-tablet-link-height);
  }
}

@media (max-width: 900px) {
  .page-marketing header.nav > .container,
  .page-marketing header.nav > .mobile-subnav,
  header.nav.nav--site > .container,
  header.nav.nav--site > .mobile-subnav {
    width: calc(100% - var(--kh-nav-mobile-inset));
    max-width: none;
  }

  .page-marketing .nav-inner,
  .nav--site .nav-inner {
    gap: var(--kh-nav-tablet-gap);
  }

  .page-marketing .nav-links,
  .nav--site .nav-links {
    padding: var(--kh-nav-mobile-pill-padding);
  }

  .page-marketing .nav-links a,
  .nav--site .nav-links a {
    min-height: var(--kh-nav-link-height);
    padding-left: var(--kh-nav-tablet-link-padding-x);
    padding-right: var(--kh-nav-tablet-link-padding-x);
  }
}

@media (max-width: 680px) {
  .site-nav,
  .notary-nav {
    width: calc(100% - var(--kh-nav-mobile-inset));
    border-radius: var(--kh-nav-mobile-radius);
    gap: var(--kh-nav-mobile-gap);
    padding: var(--kh-nav-mobile-padding-y) var(--kh-nav-mobile-padding-x);
  }

  .site-nav nav,
  .notary-nav nav {
    padding: var(--kh-nav-mobile-pill-padding);
  }

  .site-nav nav a,
  .notary-nav nav a,
  .site-nav .nav-cta,
  .notary-nav .nav-cta {
    min-height: var(--kh-nav-mobile-link-height);
    padding-left: var(--kh-nav-mobile-link-padding-x);
    padding-right: var(--kh-nav-mobile-link-padding-x);
  }
}

@media (max-width: 640px) {
  .page-marketing header.nav > .container,
  .page-marketing header.nav > .mobile-subnav,
  header.nav.nav--site > .container,
  header.nav.nav--site > .mobile-subnav {
    width: calc(100% - var(--kh-nav-mobile-inset));
  }

  .page-marketing .nav-inner,
  .nav--site .nav-inner {
    border-radius: var(--kh-nav-mobile-radius);
    gap: var(--kh-nav-mobile-gap);
    padding: var(--kh-nav-mobile-padding-y) var(--kh-nav-mobile-padding-x);
  }

  .page-marketing .nav-links a,
  .nav--site .nav-links a {
    min-height: var(--kh-nav-mobile-link-height);
    padding-left: var(--kh-nav-mobile-link-padding-x);
    padding-right: var(--kh-nav-mobile-link-padding-x);
  }

  .site-nav .nav-cta,
  .notary-nav .nav-cta {
    min-height: 36px;
  }
}