/* =========================================================
   DataXsys Design System v3.1.11
   Reliable fixed header — desktop and mobile
   Loaded last so older sticky/fixed experiments cannot override it.
   ========================================================= */

:root {
  --dx-fixed-header-height: 84px;
}

html {
  scroll-padding-top: calc(var(--dx-fixed-header-height) + 16px);
}

body {
  padding-top: var(--dx-fixed-header-height) !important;
}

.site-header,
header.site-header,
#siteHeader {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  left: 0 !important;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  height: var(--dx-fixed-header-height) !important;
  min-height: var(--dx-fixed-header-height) !important;
  z-index: 2147483000 !important;
  margin: 0 !important;
  background: rgba(255, 255, 255, .97) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 1px 0 rgba(18, 20, 26, .09) !important;
  transform: translate3d(0, 0, 0) !important;
  -webkit-transform: translate3d(0, 0, 0) !important;
  overflow: visible !important;
}

.site-header.scrolled,
header.site-header.scrolled,
#siteHeader.scrolled {
  height: var(--dx-fixed-header-height) !important;
  min-height: var(--dx-fixed-header-height) !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 1px 0 rgba(18, 20, 26, .12), 0 8px 28px rgba(18, 20, 26, .05) !important;
}

.header-shell {
  height: 100% !important;
  min-height: var(--dx-fixed-header-height) !important;
}

/* Keep transformed/animated page sections below the global header. */
main,
.site-footer,
.hero,
.about-hero,
.client-hero,
.portfolio-hero,
.immersive-section,
.results {
  position: relative;
  z-index: 0;
}

/* WordPress admin bar while logged in. */
body.admin-bar {
  padding-top: calc(var(--dx-fixed-header-height) + 32px) !important;
}

body.admin-bar .site-header,
body.admin-bar header.site-header,
body.admin-bar #siteHeader {
  top: 32px !important;
  inset: 32px 0 auto 0 !important;
}

@media (max-width: 860px) {
  :root {
    --dx-fixed-header-height: 78px;
  }

  .header-shell {
    width: calc(100% - 28px) !important;
  }

  .primary-nav {
    position: fixed !important;
    top: var(--dx-fixed-header-height) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    height: calc(100dvh - var(--dx-fixed-header-height)) !important;
    max-height: calc(100dvh - var(--dx-fixed-header-height)) !important;
    z-index: 2147483002 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 782px) {
  body.admin-bar {
    padding-top: calc(var(--dx-fixed-header-height) + 46px) !important;
  }

  body.admin-bar .site-header,
  body.admin-bar header.site-header,
  body.admin-bar #siteHeader {
    top: 46px !important;
    inset: 46px 0 auto 0 !important;
  }

  body.admin-bar .primary-nav {
    top: calc(var(--dx-fixed-header-height) + 46px) !important;
    height: calc(100dvh - var(--dx-fixed-header-height) - 46px) !important;
    max-height: calc(100dvh - var(--dx-fixed-header-height) - 46px) !important;
  }
}

@media (min-width: 783px) and (max-width: 860px) {
  body.admin-bar .primary-nav {
    top: calc(var(--dx-fixed-header-height) + 32px) !important;
    height: calc(100dvh - var(--dx-fixed-header-height) - 32px) !important;
    max-height: calc(100dvh - var(--dx-fixed-header-height) - 32px) !important;
  }
}