/* Established homepage header, shared by the dubbing page.
   Geometry comes from source-backup/index.html and its existing
   dubbing-page.css navigation accommodation; only the theme tool is new. */
#root header.site-shared-header {
  position: fixed !important;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  z-index: 100 !important;
  filter: drop-shadow(0 10px 24px rgba(3, 8, 18, .14)) !important;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}
header.site-shared-header > nav {
  color: #475569;
  border-bottom-color: #d4d7db !important;
  background: #e8e8e8 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
header.site-shared-header .site-brand-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 7.4rem;
  height: 5.625rem;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0;
  background: #e8e8e8;
  box-shadow: none;
  transition: transform .25s ease, box-shadow .25s ease;
}
header.site-shared-header .site-brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  transform: scale(1.6);
}
header.site-shared-header .site-brand-logo:hover {
  transform: none;
  box-shadow: none;
}
header.site-shared-header > nav [class*="text-slate-400"],
header.site-shared-header > nav [class*="text-slate-300"] {
  color: #475569 !important;
}
header.site-shared-header > nav a:hover {
  color: #0f172a !important;
}
header.site-shared-header > nav a[class*="bg-gradient"] {
  color: #fff !important;
}
@media (min-width: 768px) {
  header.site-shared-header > nav > div > div[class*="hidden"][class*="md:flex"] {
    gap: clamp(2rem, 2.7vw, 3.25rem) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
  }
  header.site-shared-header > nav > div > div[class*="hidden"][class*="md:flex"] > a:not([class*="bg-gradient"]) {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    padding: .7rem .15rem;
    white-space: nowrap;
  }
  header.site-shared-header > nav > div > div[class*="hidden"][class*="md:flex"] > a[class*="bg-gradient"] {
    min-height: 3.35rem;
    padding: .9rem 2rem !important;
    font-size: 1rem !important;
    white-space: nowrap;
  }
}
@media (min-width: 768px) and (max-width: 1100px) {
  header.site-shared-header > nav > div > div[class*="hidden"][class*="md:flex"] {
    gap: 1.25rem !important;
    font-size: .9rem !important;
  }
  header.site-shared-header > nav > div > div[class*="hidden"][class*="md:flex"] > a[class*="bg-gradient"] {
    padding-inline: 1.25rem !important;
    font-size: .9rem !important;
  }
}
header.site-shared-header > nav div[class*="md:hidden"][class*="bg-charcoal"] {
  border-color: #d4d7db !important;
  background: #e8e8e8 !important;
}
header.site-shared-header #site-mobile-menu[hidden],
header.site-shared-header #mobile-menu[hidden] {
  display: none !important;
}
@media (max-width: 1080px) {
  header.site-shared-header > nav > div:first-child > div[class*="hidden"][class*="md:flex"] {
    display: none !important;
  }
  header.site-shared-header button[aria-controls="site-mobile-menu"],
  header.site-shared-header button[aria-controls="mobile-menu"] {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
  }
  header.site-shared-header #site-mobile-menu:not([hidden]),
  header.site-shared-header #mobile-menu:not([hidden]) {
    display: flex !important;
    max-height: calc(100dvh - 6rem);
    overflow-y: auto;
    gap: .65rem;
    padding: 1rem 1.5rem;
  }
  header.site-shared-header #site-mobile-menu > a,
  header.site-shared-header #mobile-menu > a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: .5rem .15rem;
  }
}
@media (min-width: 1081px) {
  header.site-shared-header > nav > div:first-child > div[class*="hidden"][class*="md:flex"] {
    display: flex !important;
    gap: clamp(.875rem, 1.6vw, 1.5rem) !important;
    font-size: .875rem !important;
  }
  header.site-shared-header > nav > div:first-child > div[class*="hidden"][class*="md:flex"] > a[class*="bg-gradient"] {
    padding: .85rem 1.2rem !important;
    font-size: .875rem !important;
  }
  header.site-shared-header button[aria-controls="site-mobile-menu"],
  header.site-shared-header button[aria-controls="mobile-menu"],
  header.site-shared-header #site-mobile-menu,
  header.site-shared-header #mobile-menu {
    display: none !important;
  }
}
@media (max-width: 767px) {
  header.site-shared-header .site-brand-logo {
    width: 6.2rem;
    height: 4.625rem;
  }
}
/* Theme control adds to the original menu without replacing it. */
header.site-shared-header .site-header-tools {
  display: none;
  align-items: center;
  flex: 0 0 auto;
  gap: .5rem;
  margin-left: .75rem;
}
@media (max-width: 1080px) {
  header.site-shared-header .site-header-tools { display: flex; }
}
header.site-shared-header .site-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  flex: 0 0 44px;
  padding: 0;
  color: #475569;
  background: transparent;
  border: 1px solid #c7cdd5;
  border-radius: .65rem;
  cursor: pointer;
  transition: background .15s, color .15s;
}
header.site-shared-header .site-theme-toggle:hover {
  color: #172033;
  background: rgba(255,255,255,.5);
}
header.site-shared-header .site-theme-toggle svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}
header.site-shared-header .site-menu-toggle {
  color: #0f172a;
}
header.site-shared-header :focus-visible {
  outline: 3px solid #527bff;
  outline-offset: 4px;
}
/* Dark mode changes colors only; geometry stays identical. */
html[data-public-theme="dark"] header.site-shared-header > nav,
html[data-public-theme="dark"] header.site-shared-header #site-mobile-menu,
html[data-public-theme="dark"] header.site-shared-header #mobile-menu {
  border-color: #354a65 !important;
  background: #101d2e !important;
  color: #d8e3f2;
}
html[data-public-theme="dark"] header.site-shared-header > nav [class*="text-slate-400"],
html[data-public-theme="dark"] header.site-shared-header > nav [class*="text-slate-300"] {
  color: #d8e3f2 !important;
}
html[data-public-theme="dark"] header.site-shared-header > nav a:hover {
  color: #fff !important;
}
html[data-public-theme="dark"] header.site-shared-header .site-theme-toggle {
  color: #d8e3f2;
  border-color: #49607b;
}
html[data-public-theme="dark"] header.site-shared-header .site-theme-toggle:hover {
  color: #fff;
  background: #203650;
}
html[data-public-theme="dark"] header.site-shared-header .site-menu-toggle {
  color: #d8e3f2 !important;
}
/* Use the existing transparent brand variant on dark public navigation. */
html[data-public-theme="dark"] header.site-shared-header .site-brand-logo {
  background: transparent;
}
html[data-public-theme="dark"] header.site-shared-header .site-brand-logo img {
  content: url('/assets/sclyve-digital-logo-footer.png?v=20261009-theme-logo');
  filter: none;
}
@media (prefers-reduced-motion: reduce) {
  header.site-shared-header .site-theme-toggle { transition: none; }
}