/* OWNER-CONFIRMED RULE — 4 November 2026
   Preserve this behaviour on every page using a section-navigation banner:
   1. Place the banner immediately BELOW the hero in the document order.
   2. Keep it sticky while scrolling, with clearance below any sticky header.
   3. Keep section-link destinations visible below the sticky navigation.
   Do not move these banners above the hero, disable their sticky behaviour,
   or override this shared rule in page-specific CSS without the owner's
   explicit permission. Apply the same rule to new pages of this type.
*/

/* Shared section-navigation contract: immediately after the hero in main.
   Markup defines the reading order; this file owns sticky behaviour on every page. */
body[data-c2-section-navigation] nav[data-c2-section-nav] {
  position: sticky;
  top: var(--c2-section-header-offset, 0px);
  z-index: 19;
  width: 100%;
  margin-block: 0;
}
body[data-c2-section-navigation] main [id] {
  scroll-margin-top: calc(var(--c2-section-header-offset, 0px) + var(--c2-section-nav-height, 48px) + 20px);
}
/* Keep all section links accessible in a single horizontal rail on small screens. */
body[data-c2-section-navigation] nav[data-c2-section-nav].teen-subnav > .wrap {
  height: auto;
  min-height: 48px;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: thin;
}
body[data-c2-section-navigation] nav[data-c2-section-nav].teen-subnav > .wrap > div {
  display: flex;
  flex-wrap: nowrap;
  flex-shrink: 0;
}
body[data-c2-section-navigation] nav[data-c2-section-nav] a {
  flex-shrink: 0;
  white-space: nowrap;
}
body[data-c2-section-navigation] nav[data-c2-section-nav] a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -2px;
}
/* Clip decorative content without creating a scroll container that disables sticky. */
body[data-c2-section-navigation] > main {
  overflow: clip;
}
