/* AVIX Water section submenu v60
   Compact T-Booster-inspired in-page navigation.
   Natural-width items, tight spacing, teal active state, no boxed cells. */

:root{
  --avix-section-nav-h:46px;
  --avix-section-nav-bg:#fbfaf8;
  --avix-section-nav-line:rgba(21,45,52,.10);
  --avix-section-nav-text:#56686d;
  --avix-section-nav-accent:#25a8bd;
}

.avix-section-nav{
  position:sticky;
  top:var(--avix-main-chrome,118px);
  z-index:98;
  width:100%;
  min-height:var(--avix-section-nav-h);
  border-top:1px solid var(--avix-section-nav-line);
  border-bottom:1px solid var(--avix-section-nav-line);
  background:rgba(251,250,248,.98);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}

.avix-section-nav__viewport{
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
.avix-section-nav__viewport::-webkit-scrollbar{display:none}

.avix-section-nav__inner{
  width:min(var(--avix-site-max,1280px),calc(100% - var(--avix-page-gutter,48px) - var(--avix-page-gutter,48px)));
  max-width:1280px;
  min-height:var(--avix-section-nav-h);
  margin-inline:auto;
  display:flex;
  align-items:stretch;
  justify-content:flex-start;
  gap:clamp(20px,2.1vw,34px);
}

.avix-section-nav__link{
  position:relative;
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  min-height:var(--avix-section-nav-h);
  padding:1px 0 0;
  color:var(--avix-section-nav-text);
  text-decoration:none;
  white-space:nowrap;
  font-size:10.5px;
  font-weight:800;
  line-height:1;
  letter-spacing:.02em;
  text-transform:uppercase;
  transition:color .18s ease;
}
.avix-section-nav__num,
.avix-section-nav__label{
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
}
.avix-section-nav__label{overflow:visible;text-overflow:clip}

.avix-section-nav__link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  border-radius:2px 2px 0 0;
  background:var(--avix-section-nav-accent);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .18s ease;
}
.avix-section-nav__link:hover,
.avix-section-nav__link:focus-visible,
.avix-section-nav__link.is-active{
  color:var(--avix-section-nav-accent);
  background:transparent;
}
.avix-section-nav__link:hover::after,
.avix-section-nav__link:focus-visible::after,
.avix-section-nav__link.is-active::after{transform:scaleX(1)}
.avix-section-nav__link:focus-visible{
  outline:2px solid rgba(37,168,189,.48);
  outline-offset:5px;
  border-radius:2px;
}

/* Keep anchor headings visible below the fixed site chrome + sticky section nav. */
body:has(.avix-section-nav) main [id]{
  scroll-margin-top:calc(var(--avix-main-chrome,118px) + var(--avix-section-nav-h) + 22px);
}

@media(max-width:1080px){
  :root{--avix-section-nav-h:45px}
  .avix-section-nav__inner{
    width:max-content;
    min-width:100%;
    max-width:none;
    margin:0;
    padding:0 24px;
    gap:26px;
  }
}

@media(max-width:860px){
  :root{--avix-section-nav-h:44px}
  .avix-section-nav{top:var(--avix-main-chrome,104px)}
  .avix-section-nav__inner{padding-inline:20px;gap:24px}
  .avix-section-nav__link{font-size:10.5px;gap:4px}
}

@media(max-width:620px){
  :root{--avix-section-nav-h:43px}
  .avix-section-nav{top:var(--avix-main-chrome,94px)}
  .avix-section-nav__inner{padding-inline:16px;gap:22px}
  .avix-section-nav__link{font-size:10px;letter-spacing:.016em}
}


/* Sticky reliability: Science and Products previously made <main> an overflow container,
   which prevents the in-page navigation from sticking to the viewport. */
.science-v12 main,
.products-v3 main{
  overflow:visible!important;
}

/* In compact landscape layouts the announcement bar is hidden, so the submenu
   sits directly below the fixed header rather than leaving the old top-bar gap. */
@media(orientation:landscape) and (max-height:600px) and (min-width:600px) and (max-width:960px){
  .avix-section-nav{top:70px!important}
}
@media(prefers-reduced-motion:reduce){
  .avix-section-nav__link,.avix-section-nav__link::after{transition:none}
}