/* AVIX Water v133 — queued mobile refinement pass
   Scope: announcement readability, Science visual/arrows/plant diagram,
   Products hero/subnav spacing, Commercial CTA-to-visual spacing,
   and Team section separator cleanup. Desktop intentionally unchanged. */

@media (max-width:767px){
  :root{
    --avix-m-top:38px;
    --avix-m-header:64px;
    --avix-m-chrome:102px;
    --avix-main-chrome:102px;
    --avix-section-stick-top:102px;
  }

  /* 1 — Announcement: readable on real iPhones while retaining one line. */
  html body.home-v8:not(.page-diagram) .av5-topline{
    height:38px!important;
    min-height:38px!important;
  }
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre{
    width:100%!important;
    max-width:none!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 10px!important;
    gap:0!important;
    justify-content:center!important;
    overflow:hidden!important;
    white-space:nowrap!important;
  }
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre span{
    display:inline-flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    font-size:9.6px!important;
    line-height:1!important;
    letter-spacing:.015em!important;
    font-weight:800!important;
    white-space:nowrap!important;
  }
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre i{
    display:block!important;
    flex:0 0 4px!important;
    width:4px!important;
    height:4px!important;
    min-width:4px!important;
    margin:0 13px!important;
    border:0!important;
    border-radius:50%!important;
    background:#4BC8EF!important;
    opacity:.82!important;
  }

  /* 2 — Science hero: use the true mobile SVG at a useful Retina size. */
  html body.home-v8.science-v12.avix-principal-page .s12-hero-visual--system{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    margin:8px auto 0!important;
    padding:18px 0 30px!important;
    overflow:visible!important;
  }
  html body.home-v8.science-v12.avix-principal-page .s12-hero-visual--system picture{
    display:block!important;
    width:100%!important;
    max-width:390px!important;
    margin:0 auto!important;
  }
  html body.home-v8.science-v12.avix-principal-page .s12-hero-visual--system .s12-science-system-svg{
    display:block!important;
    width:100%!important;
    max-width:390px!important;
    height:auto!important;
    max-height:none!important;
    margin:0 auto!important;
    object-fit:contain!important;
  }

  /* 3 — Science transition arrows: slimmer, centred and less dominant. */
  html body.home-v8.science-v12 .sr-profile-arrow{
    grid-template-columns:minmax(0,1fr) 28px!important;
    min-height:50px!important;
    padding:7px 5px!important;
    gap:12px!important;
  }
  html body.home-v8.science-v12 .sr-profile-arrow b{
    position:relative!important;
    display:block!important;
    width:28px!important;
    height:30px!important;
    margin:0!important;
    transform:none!important;
    font-size:0!important;
    color:transparent!important;
  }
  html body.home-v8.science-v12 .sr-profile-arrow b::before{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:4px!important;
    width:2px!important;
    height:17px!important;
    border-radius:2px!important;
    background:#4BC8EF!important;
    transform:translateX(-50%)!important;
  }
  html body.home-v8.science-v12 .sr-profile-arrow b::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:4px!important;
    width:9px!important;
    height:9px!important;
    border-right:2px solid #4BC8EF!important;
    border-bottom:2px solid #4BC8EF!important;
    transform:translateX(-50%) rotate(45deg)!important;
  }

  /* 4 — Plant diagram: complete width, no horizontal swipe. Height is also
        auto-fitted by the small same-origin script on science.html. */
  html body.home-v8.science-v12 .s12-diagram-frame{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  html body.home-v8.science-v12 iframe.s12-plant-diagram{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:2200px;
    min-height:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  /* 5 — Products: more breathing room under bottles and vertically centred subnav. */
  html body.home-v8.products-v3.avix-principal-page{
    --avix-m-subnav:52px;
    --avix-section-nav-h:52px;
  }
  html body.home-v8.products-v3.avix-principal-page .p3-hero-grid{
    padding-bottom:24px!important;
  }
  html body.home-v8.products-v3.avix-principal-page .p3-hero-products{
    margin:10px auto 38px!important;
  }
  html body.home-v8.products-v3.avix-principal-page .avix-section-nav,
  html body.home-v8.products-v3.avix-principal-page .avix-section-nav__viewport,
  html body.home-v8.products-v3.avix-principal-page .avix-section-nav__inner,
  html body.home-v8.products-v3.avix-principal-page .avix-section-nav__link{
    height:52px!important;
    min-height:52px!important;
  }

  /* 6 — Commercial: a modest pause after the second CTA before the readiness graphic. */
  html body.home-v8.co18-page.avix-principal-page .co18-hero-visual{
    margin-top:22px!important;
  }

  /* 7 — Team build: remove the unwanted full-width separator rules only. */
  html body.home-v8.tc-team-page.avix-principal-page .team9-build{
    border-top:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  html body.home-v8.tc-team-page.avix-principal-page .team9-build::before,
  html body.home-v8.tc-team-page.avix-principal-page .team9-build::after,
  html body.home-v8.tc-team-page.avix-principal-page .tc-prefooter.story-prefooter::before{
    content:none!important;
    display:none!important;
  }
  html body.home-v8.tc-team-page.avix-principal-page .tc-prefooter.story-prefooter{
    border-top:0!important;
    box-shadow:none!important;
  }
}

/* Slightly tighter announcement spacing on the narrowest phones. */
@media (max-width:374px){
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre{
    padding:0 7px!important;
  }
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre span{
    font-size:9px!important;
    letter-spacing:0!important;
  }
  html body.home-v8:not(.page-diagram) .av5-topline .av5-topline-centre i{
    margin:0 8px!important;
  }
}