/* Shared Strategix Ops logo/header behavior. */
nav {
  --ops-logo-height: 56px;
  --ops-nav-padding-y: 12px;
  height: auto;
  min-height: 60px;
  padding: var(--ops-nav-padding-y) 56px;
  background: rgba(9, 9, 12, 0.88);
  border-bottom-color: rgba(74, 127, 165, 0.12);
  transition:
    padding 0.28s ease,
    background-color 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}

nav.is-scrolled {
  --ops-logo-height: 48px;
  --ops-nav-padding-y: 8px;
  background: rgba(9, 9, 12, 0.96);
  border-bottom-color: rgba(74, 127, 165, 0.24);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

.nav-logo {
  flex: 0 0 auto;
  gap: 0;
}

.nav-logo-image {
  display: block;
  width: auto;
  height: var(--ops-logo-height);
  max-width: none;
  object-fit: contain;
  transition: height 0.28s ease;
}

.mobile-nav {
  top: var(--ops-nav-height, 80px);
  transition: top 0.28s ease;
}

.footer-brand {
  gap: 0;
}

.footer-logo-image {
  display: block;
  width: auto;
  height: 34px;
  object-fit: contain;
}

@media (max-width: 980px) {
  nav {
    padding-right: 24px;
    padding-left: 24px;
  }

  .nav-links,
  .nav-contact {
    display: none;
  }

  .nav-mobile-toggle {
    display: flex;
  }
}

@media (max-width: 768px) {
  nav {
    --ops-logo-height: 42px;
    --ops-nav-padding-y: 9px;
  }

  nav.is-scrolled {
    --ops-logo-height: 36px;
    --ops-nav-padding-y: 7px;
  }

  .footer-logo-image {
    height: 30px;
  }
}

@media (max-width: 360px) {
  nav {
    --ops-logo-height: 38px;
    padding-right: 18px;
    padding-left: 18px;
  }

  nav.is-scrolled {
    --ops-logo-height: 34px;
  }
}

@media (prefers-reduced-motion: reduce) {
  nav,
  .nav-logo-image,
  .mobile-nav {
    transition-duration: 0.01ms;
  }
}