/**
 * Structural CSS for One Page Scroll test page only.
 * Does NOT change fonts, paddings, line-heights, or section design tokens.
 */

body.home-onepage-scroll .onepage-wrapper {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

body.home-onepage-scroll .onepage-wrapper > section,
body.home-onepage-scroll #main.onepage-wrapper > section {
  width: 100%;
  height: 100%;
}

/* Plugin default dots unused — we keep the theme .side-nav */
body.home-onepage-scroll .onepage-pagination {
  display: none !important;
}

/*
 * Mobile fallback (<768): unlock VERTICAL scroll only.
 * Never use overflow:visible on html/body — that enables horizontal scroll,
 * which parks the menu links off to the right of the viewport.
 */
html:has(body.home-onepage-scroll.disabled-onepage-scroll),
html.ops-native-scroll,
body.home-onepage-scroll.disabled-onepage-scroll {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: auto !important;
  max-height: none !important;
  max-width: 100% !important;
  width: 100% !important;
  position: static !important;
}

body.home-onepage-scroll.disabled-onepage-scroll .onepage-wrapper,
body.home-onepage-scroll.disabled-onepage-scroll #main.onepage-wrapper {
  overflow-x: hidden !important;
  overflow-y: visible !important;
  transform: none !important;
  -webkit-transform: none !important;
  height: auto !important;
  min-height: 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
}

body.home-onepage-scroll.disabled-onepage-scroll .onepage-wrapper > section,
body.home-onepage-scroll.disabled-onepage-scroll #main.onepage-wrapper > section {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  height: auto !important;
  max-height: none !important;
  /* Content-sized like the live home — do NOT force full viewport on every band */
  min-height: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  -webkit-transform: none !important;
  transform: none !important;
  justify-content: flex-start !important;
}

/* Theme mobile hero / contact — only these keep a viewport floor */
@media (max-width: 767px) {
  body.home-onepage-scroll.disabled-onepage-scroll #main > section#top,
  body.home-onepage-scroll.disabled-onepage-scroll #top {
    height: auto !important;
    max-height: none !important;
    min-height: 100svh !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }

  /* Ivory / compact bands: match live home height (no 100vh stretch) */
  body.home-onepage-scroll.disabled-onepage-scroll #main > section.bg-ivory,
  body.home-onepage-scroll.disabled-onepage-scroll #recognitions,
  body.home-onepage-scroll.disabled-onepage-scroll #memberships,
  body.home-onepage-scroll.disabled-onepage-scroll #firm,
  body.home-onepage-scroll.disabled-onepage-scroll #people,
  body.home-onepage-scroll.disabled-onepage-scroll #ctabox,
  body.home-onepage-scroll.disabled-onepage-scroll .fullfeaturesections {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    justify-content: flex-start !important;
  }

  body.home-onepage-scroll.disabled-onepage-scroll #contact {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }

  /* Kill page-wide horizontal scroll + pin menu to the visual viewport */
  html.ops-native-scroll,
  body.home-onepage-scroll.disabled-onepage-scroll,
  body.home-onepage-scroll {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  body.home-onepage-scroll #mobilemenu,
  body.home-onepage-scroll #mobilemenu.open,
  body.home-onepage-scroll.menu-open #mobilemenu {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: 100% !important;
    height: 100dvh !important;
    margin: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
    overflow: hidden !important;
    z-index: 200 !important;
  }

  body.home-onepage-scroll #mobilemenu .menu-panel,
  body.home-onepage-scroll #mobilemenu.open .menu-panel,
  body.home-onepage-scroll.menu-open #mobilemenu .menu-panel {
    position: absolute !important;
    inset: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
  }

  body.home-onepage-scroll #mobilemenu .menu-panel__nav {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 1.25rem 1.25rem 2.5rem !important;
    align-items: flex-end !important;
    overflow-x: hidden !important;
  }

  body.home-onepage-scroll #mobilemenu .menu-panel__nav .menu-link {
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* Menu overlay lives on body (not inside header) so fixed inset covers the viewport */
body.home-onepage-scroll #mobilemenu {
  z-index: 80;
}

/*
 * Mobile: sticky-nav desktop rules must not run. Force open-menu content visible.
 */
@media (max-width: 767px) {
  body.home-onepage-scroll.nav-past-hero header#nav,
  body.home-onepage-scroll.nav-past-hero header#nav .headerlogo,
  body.home-onepage-scroll.nav-past-hero #navlinks {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Hide duplicate burger while drawer is open (panel has its own close) */
  body.home-onepage-scroll.menu-open.nav-past-hero #navlinks {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.home-onepage-scroll #mobilemenu.open,
  body.home-onepage-scroll.menu-open #mobilemenu {
    pointer-events: auto !important;
    visibility: visible !important;
    z-index: 100 !important;
  }

  body.home-onepage-scroll #mobilemenu.open .menu-panel,
  body.home-onepage-scroll.menu-open #mobilemenu .menu-panel {
    transform: translateX(0) !important;
  }

  body.home-onepage-scroll #mobilemenu.open .menu-panel__nav .menu-link,
  body.home-onepage-scroll.menu-open #mobilemenu .menu-panel__nav .menu-link,
  body.home-onepage-scroll #mobilemenu.open .menu-panel__top-icons,
  body.home-onepage-scroll.menu-open #mobilemenu .menu-panel__top-icons {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
    color: #1a1f4d !important;
  }
}

/*
 * Desktop only: transform paging keeps the header fixed.
 * After hero: hide logo, keep search + burger; re-enable menu when open.
 */
@media (min-width: 768px) {
  body.home-onepage-scroll.nav-past-hero header#nav {
    pointer-events: none;
  }

  body.home-onepage-scroll.nav-past-hero header#nav .headerlogo {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body.home-onepage-scroll.nav-past-hero #navlinks {
    pointer-events: auto;
  }

  body.home-onepage-scroll.nav-past-hero #mobilemenu.open {
    pointer-events: auto;
  }

  /* Sticky icon pill overlaps the panel close button */
  body.home-onepage-scroll.menu-open.nav-past-hero #navlinks {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body.home-onepage-scroll #mobilemenu.open {
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0.92) 0%,
      rgba(255, 255, 255, 0.4) 100%
    );
  }

  body.home-onepage-scroll.menu-open #main::before {
    content: none !important;
    display: none !important;
  }

  body.home-onepage-scroll.menu-open .side-nav {
    transform: translateY(-50%) translateX(calc(-1 * var(--menu-push)));
  }
}