/* Shared SemDev floating navigation. Compact campaign headers retain their own content. */
body.nav1-open { overflow: hidden; }
.site-nav-backdrop {
  position: fixed;
  z-index: 999;
  inset: 0 0 auto;
  height: 7rem;
  pointer-events: none;
  /* A continuous falloff softens content above and just below the floating panel. */
  background: rgb(6 9 17 / 96%);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  mask-image: linear-gradient(#000 20%, rgb(0 0 0 / 60%) 60%, transparent);
  -webkit-mask-image: linear-gradient(#000 20%, rgb(0 0 0 / 60%) 60%, transparent);
}
.skip-link:focus { z-index: 10001; }
#nav1-navigation {
  --text: #ced8e5;
  --muted: #a1b0c2;
  --white: #fff;
  --brand: #19c8ff;
  top: 14px;
  width: min(77.5rem, calc(100% - 2.5rem));
  min-height: 64px;
  padding: 0 1.25rem;
  border: 0;
  border-radius: 18px;
  background: #060911;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%), 0 10px 24px -16px rgb(0 0 0 / 55%);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: box-shadow 300ms ease;
}
#nav1-navigation.nav1-scrolled,
#nav1-navigation.nav1-active {
  background: #060911;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%), 0 12px 28px -16px rgb(0 0 0 / 65%);
}
#nav1-navigation .nav1-container { min-height: 64px; }
#nav1-navigation .header-btn .cta-button {
  min-height: 44px;
  padding: 0.65rem 1.125rem;
  font-size: 0.9rem;
  line-height: 1;
}
#nav1-navigation .nav1-ul > li > a,
#nav1-navigation .submenu-dropdown {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0.65rem 0.7rem;
  border-radius: 10px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.2;
  transition: color 300ms ease, background-color 300ms ease;
}
#nav1-navigation .nav1-ul > li > a:is(:hover, :focus-visible),
#nav1-navigation .submenu-dropdown:is(:hover, :focus-visible),
#nav1-navigation .has-submenu.open > .submenu-dropdown {
  color: var(--white);
  background: rgb(25 200 255 / 5%);
}
#nav1-navigation .nav1-ul > li > a[aria-current="page"] {
  background: rgb(255 255 255 / 3%);
  color: var(--white);
}
#nav1-navigation .has-submenu { position: relative; }
#nav1-navigation .submenu {
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #102135, #0a1522);
  box-shadow: 0 18px 40px -18px rgb(0 0 0 / 75%);
}
#nav1-navigation .has-submenu.open .submenu {
  margin-top: 0;
  padding: 8px;
  border: 0;
}
#nav1-navigation .submenu li { padding: 0; }
#nav1-navigation .submenu li a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.7rem 0.8rem;
  border-radius: 8px;
  color: var(--text);
  line-height: 1.4;
  transition: color 300ms ease, background-color 300ms ease;
}
#nav1-navigation .submenu li a:is(:hover, :focus-visible) {
  background: rgb(25 200 255 / 5%);
  color: var(--brand);
}
@media (min-width: 1024px) {
  #nav1-navigation .nav1-ul-wrapper { overflow: visible; }
  #nav1-navigation .nav1-ul { gap: clamp(0px, 0.4vw, 6px); }
  #nav1-navigation .submenu { top: calc(100% + 10px); left: 0; width: 235px; }
  #nav1-navigation .has-submenu::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 12px;
  }
}
@media (max-width: 1023px) {
  #nav1-navigation {
    top: 12px;
    width: calc(100% - 1.5rem);
    min-height: 56px;
    padding-inline: 1rem;
    border-radius: 16px;
  }
  #nav1-navigation .nav1-container { min-height: 56px; }
  #nav1-navigation .nav1-toggle {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 12px;
    background: #142336;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 5%);
  }
  #nav1-navigation .nav1-ul-wrapper {
    top: calc(100% + 10px);
    padding: 12px;
    max-height: calc(100dvh - 7rem);
    overflow-y: auto;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, #0b1725, #08111d);
    box-shadow: 0 18px 40px -18px rgb(0 0 0 / 75%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 250ms ease, transform 350ms var(--ease), visibility 0s 350ms;
  }
  #nav1-navigation.nav1-active .nav1-ul-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
  }
  #nav1-navigation .nav1-ul { padding: 0; gap: 4px; max-height: none; overflow: visible; }
  #nav1-navigation .nav1-ul > li { text-align: left; }
  #nav1-navigation .nav1-ul > li > a,
  #nav1-navigation .submenu-dropdown { justify-content: space-between; width: 100%; font-size: 1rem; color: var(--text); }
  #nav1-navigation .submenu { position: static; width: 100%; box-shadow: none; }
  #nav1-navigation .has-submenu.open .submenu { margin-block: 4px 8px; padding: 4px 8px; }
  #nav1-navigation .nav1-ul-wrapper .header-btn { padding: 12px 0 4px; }
  #nav1-navigation .nav1-ul-wrapper .header-btn .cta-button { width: 100%; margin: 0; }
}
/* Mobile navigation: visible logo, floating launcher and dark page scrim. */
@media (max-width: 1023px) {
  body:has(#nav1-navigation) .site-nav-backdrop {
    height: 8.5rem;
    background: rgb(6 9 17 / 86%);
    -webkit-mask-image: linear-gradient(#000 0%, rgb(0 0 0 / 70%) 32%, transparent 100%);
    mask-image: linear-gradient(#000 0%, rgb(0 0 0 / 70%) 32%, transparent 100%);
  }
  body #nav1-navigation,
  body #nav1-navigation:is(.nav1-scrolled, .nav1-active) {
    min-height: 48px;
    padding: 0;
    background: transparent;
    box-shadow: none;
    pointer-events: none;
  }
  body #nav1-navigation .nav1-container { min-height: 48px; }
  body #nav1-navigation .nav1-logo {
    margin-left: 0.5rem;
    pointer-events: auto;
    filter: drop-shadow(0 3px 7px #03060b) drop-shadow(0 6px 20px #03060b);
  }
  body #nav1-navigation .nav1-toggle {
    width: 48px;
    height: 48px;
    border: 1px solid rgb(255 255 255 / 9%);
    border-radius: 15px;
    background: linear-gradient(145deg, #14283a, #0b1725);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 6%), 0 5px 14px -5px rgb(0 0 0 / 65%);
    pointer-events: auto;
    transition: background-color 220ms ease, box-shadow 220ms ease;
  }
  body #nav1-navigation .nav1-ul-wrapper {
    top: calc(100% + 12px);
    max-height: calc(100dvh - 6rem);
    max-height: calc(100dvh - 6rem - env(safe-area-inset-bottom));
    padding: 1rem;
    border-radius: 18px;
    transform: translateY(-8px) scale(0.98);
    transform-origin: top right;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 4%), 0 18px 40px -18px rgb(0 0 0 / 85%);
    overscroll-behavior: contain;
    transition: opacity 220ms ease, transform 320ms var(--ease), visibility 0s 320ms;
  }
  body #nav1-navigation.nav1-active .nav1-ul-wrapper {
    transform: none;
    transition-delay: 0s;
  }
  body #nav-overlay {
    z-index: 998;
    height: 100dvh;
    background: rgb(2 5 10 / 78%);
    transition: opacity 250ms ease, visibility 0s 250ms;
  }
  body #nav-overlay.active { transition-delay: 0s; }
}
@media (max-width: 1023px) and (prefers-reduced-motion: reduce) {
  body #nav-overlay { transition: none; }
}

@media (prefers-reduced-motion: reduce) {
  #nav1-navigation,
  #nav1-navigation * { transition: none !important; }
}
@media (prefers-reduced-transparency: reduce) {
  #nav1-navigation { background: #060911; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .site-nav-backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
}

/* Landing pages keep a compact brand header instead of the full site menu. */
.semdev-compact-header {
  position: fixed;
  z-index: 1000;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  width: min(77.5rem, calc(100% - 2.5rem));
  height: 64px;
  min-height: 64px;
  margin: 0;
  padding: 0 1.25rem;
  border: 0;
  border-radius: 18px;
  background: #060911;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%), 0 10px 24px -16px rgb(0 0 0 / 55%);
}
.semdev-compact-header + main { padding-top: 82px; }
@media (max-width: 1023px) {
  .semdev-compact-header {
    top: 12px;
    width: calc(100% - 1.5rem);
    height: 56px;
    min-height: 56px;
    padding-inline: 1rem;
    border-radius: 16px;
  }
  .semdev-compact-header + main { padding-top: 72px; }
}
@media (max-width: 400px) {
  .semdev-compact-header .brand img { width: 108px; }
}
