/* Shared navigation shell for every canonical MLTox marketing page.
   Geometry and behavior stay identical; only the Home color treatment changes. */

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

body.feedback-v02 .site-header {
  position: fixed;
  top: 16px;
  right: auto;
  left: 50%;
  z-index: 100;
  width: min(calc(100% - 32px), 1180px);
  height: 62px;
  border: 1px solid rgba(24, 63, 59, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 18px 48px rgba(22, 58, 54, 0.12);
  transform: translateX(-50%);
  backdrop-filter: saturate(1.2) blur(20px);
  -webkit-backdrop-filter: saturate(1.2) blur(20px);
}

body.feedback-v02 .site-header.scrolled,
body.feedback-v02.menu-open .site-header {
  border-color: rgba(24, 63, 59, 0.18);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 48px rgba(22, 58, 54, 0.15);
  backdrop-filter: saturate(1.2) blur(20px);
  -webkit-backdrop-filter: saturate(1.2) blur(20px);
}

body.feedback-v02 .site-header__inner {
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding-inline: 18px;
}

.feedback-v02:not([data-page="home"]) main {
  padding-top: 78px;
}

body.feedback-v02[data-page="home"] .site-header,
body.feedback-v02[data-page="home"] .site-header.scrolled,
body.feedback-v02.menu-open[data-page="home"] .site-header {
  border-color: rgba(211, 241, 235, 0.22);
  background: rgba(4, 28, 28, 0.84);
  box-shadow: 0 18px 48px rgba(0, 12, 13, 0.24);
}

body.feedback-v02[data-page="home"] .site-header.scrolled,
body.feedback-v02.menu-open[data-page="home"] .site-header {
  background: rgba(4, 28, 28, 0.96);
}

@media (max-width: 860px) {
  body.feedback-v02 .site-header {
    top: 10px;
    width: calc(100% - 20px);
  }

  .feedback-v02:not([data-page="home"]) main {
    padding-top: 82px;
  }

  body.feedback-v02 .site-header .primary-nav {
    position: absolute;
    inset: calc(100% + 8px) 0 auto;
    max-height: calc(100svh - 90px);
    padding: 14px 16px 20px;
    overflow: auto;
    border: 1px solid rgba(24, 63, 59, 0.14);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 48px rgba(22, 58, 54, 0.15);
  }

  body.feedback-v02[data-page="home"] .site-header .primary-nav {
    border-color: rgba(211, 241, 235, 0.18);
    background: rgba(4, 28, 28, 0.98);
  }
}

@media (prefers-reduced-transparency: reduce) {
  body.feedback-v02 .site-header,
  body.feedback-v02 .site-header.scrolled,
  body.feedback-v02.menu-open .site-header {
    background: #ffffff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.feedback-v02[data-page="home"] .site-header,
  body.feedback-v02[data-page="home"] .site-header.scrolled,
  body.feedback-v02.menu-open[data-page="home"] .site-header {
    background: #041c1c;
  }
}