.cnp-desktop-nav-host {
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.4vw, 22px);
}

.cnp-desktop-header {
  background: #fff;
  border-bottom: 2px solid #1a1a1a;
  left: 0;
  padding: 14px 24px;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 100;
}

.cnp-desktop-nav {
  display: flex;
  flex: 1 1 auto;
  justify-content: center;
  align-items: center;
  gap: clamp(2px, 0.45vw, 8px);
  min-width: 0;
  font-family: Inter, system-ui, sans-serif;
  z-index: 120;
}

.cnp-desktop-nav a,
.cnp-desktop-nav button {
  color: #1a1a1a;
  background: transparent;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
  padding: 9px clamp(5px, 0.7vw, 11px);
  font: 700 clamp(9px, 0.9vw, 12px)/1.2 Inter, system-ui, sans-serif;
  letter-spacing: 0.035em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.cnp-desktop-nav a:hover,
.cnp-desktop-nav button:hover,
.cnp-desktop-nav button[aria-expanded="true"] {
  background: #fff9c4;
  color: #1a1a1a;
}

.cnp-desktop-nav .cnp-get-started {
  background: #5d24d6;
  border: 2px solid #1a1a1a;
  box-shadow: 3px 3px 0 #1a1a1a;
  color: #fff;
  flex: 0 0 auto;
  margin-left: clamp(2px, 0.5vw, 8px);
  padding: 8px clamp(6px, 0.65vw, 10px);
}

.cnp-desktop-nav .cnp-get-started:hover,
.cnp-desktop-nav .cnp-get-started:focus-visible {
  background: #1a1a1a;
  color: #fff;
}

.cnp-desktop-nav .cnp-menu-group {
  position: relative;
}

.cnp-desktop-nav .cnp-menu-trigger::after {
  content: "";
  border: 4px solid transparent;
  border-top-color: currentColor;
  margin-top: 4px;
}

.cnp-desktop-nav .cnp-menu-panel {
  background: #fff;
  border: 2px solid #1a1a1a;
  box-shadow: 4px 4px 0 #1a1a1a;
  display: none;
  left: 0;
  min-width: 205px;
  padding: 6px;
  position: absolute;
  top: calc(100% + 2px);
}

.cnp-desktop-nav .cnp-menu-group:hover .cnp-menu-panel,
.cnp-desktop-nav .cnp-menu-group:focus-within .cnp-menu-panel,
.cnp-desktop-nav .cnp-menu-group.is-open .cnp-menu-panel {
  display: grid;
}

.cnp-desktop-nav .cnp-menu-panel a {
  border-radius: 0;
  justify-content: flex-start;
  padding: 10px;
  text-transform: none;
  white-space: normal;
}

.cnp-desktop-nav .cnp-menu-panel a:hover,
.cnp-desktop-nav .cnp-menu-panel a:focus-visible {
  background: #ccff00;
}

.cnp-desktop-nav-host > .cnp-desktop-brand {
  color: #1a1a1a;
  flex: 0 0 auto;
  font: 800 16px/1 Inter, system-ui, sans-serif;
  text-decoration: none;
  white-space: nowrap;
}

.cnp-desktop-nav-host > .cnp-desktop-brand span {
  color: #5d24d6;
}

.cnp-desktop-nav-host > .cnp-desktop-nav {
  order: 2;
}

.cnp-desktop-nav-host > .cnp-desktop-brand {
  order: 1;
}

.cnp-desktop-nav-host > .nav-actions,
.cnp-desktop-nav-host > .header-actions {
  order: 3;
}

html {
  scroll-padding-top: 100px;
}

#navbar.cnp-dark-header .cnp-desktop-nav a,
#navbar.cnp-dark-header .cnp-desktop-nav button,
#navbar.cnp-dark-header .cnp-desktop-brand {
  color: #f8fafc;
}

#navbar.cnp-dark-header .cnp-desktop-nav a:hover,
#navbar.cnp-dark-header .cnp-desktop-nav button:hover,
#navbar.cnp-dark-header .cnp-desktop-nav button[aria-expanded="true"] {
  color: #1a1a1a;
}

#navbar.cnp-dark-header .cnp-desktop-nav .cnp-menu-panel a {
  color: #1a1a1a;
}

@media (max-width: 1199px) {
  .cnp-desktop-nav-host > .nav-actions,
  .cnp-desktop-nav-host > .header-actions {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  .cnp-desktop-nav-host .cnp-legacy-desktop-links {
    display: none !important;
  }

  .cnp-legacy-auth-actions {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .cnp-legacy-auth-actions .auth-mobile-signin {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .cnp-legacy-auth-actions a:not(.auth-mobile-signin) {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  .cnp-desktop-nav {
    display: none;
  }

  .cnp-desktop-header {
    display: none;
  }
}
