/* AVIX Water global hero hierarchy
   Homepage: 4 lines / cinematic
   Principal pages: 3 lines / editorial
   Utility: 2 lines / concise
   Legal and supporting: 1–2 lines / restrained
*/

:root{
  --avix-hero-home-min: 730px;
  --avix-hero-principal-min: 580px;
  --avix-hero-utility-min: 390px;
  --avix-hero-legal-min: 310px;
  --avix-hero-title-max: 840px;
}

/* Authored line groups */
.av5-hero h1,
.s12-hero-copy h1,
.p3-hero-copy h1,
.co2-hero h1,
.tc-hero h1,
.page-hero h1{
  display:grid;
  align-content:start;
  margin-inline:0;
}
.av5-hero h1 span,
.s12-hero-copy h1 span,
.p3-hero-copy h1 span,
.co2-hero h1 span,
.tc-hero h1 span,
.page-hero h1 span{
  display:block;
}

/* 1. Homepage: four-line cinematic signature */
.av5-hero{
  min-height:var(--avix-hero-home-min)!important;
  padding-top:116px!important;
}
.av5-hero-grid{
  min-height:614px!important;
  grid-template-columns:minmax(0,1.42fr) minmax(290px,.58fr)!important;
  gap:clamp(48px,5vw,72px)!important;
  align-items:center!important;
}
.av5-hero-copy{
  padding:54px 0 66px!important;
}
.av5-hero h1{
  max-width:var(--avix-hero-title-max)!important;
  gap:.035em;
  font-size:clamp(64px,5.8vw,96px)!important;
  line-height:.94!important;
  letter-spacing:-.055em!important;
  font-weight:790!important;
}
.av5-hero h1 span{
  color:#ffffff!important;
}
.av5-hero h1 span:last-child{
  color:var(--aqua)!important;
}
.av5-hero-lead{
  max-width:760px!important;
  margin-top:28px!important;
  font-size:clamp(17px,1.25vw,20px)!important;
  line-height:1.55!important;
}
.av5-hero-bottle{
  min-height:560px!important;
}
.av5-hero-bottle img{
  width:min(72%,340px)!important;
  max-height:535px!important;
  bottom:22px!important;
}
.av5-hero-bottle::after{
  left:23%!important;
  right:23%!important;
  bottom:30px!important;
}

/* 2. Principal inner pages: three authored lines */
.s12-hero,
.p3-hero,
.co2-hero,
.tc-team-hero{
  min-height:var(--avix-hero-principal-min)!important;
  padding-top:116px!important;
}
.s12-hero-grid,
.p3-hero-grid,
.co2-hero-grid,
.tc-team-hero .tc-hero-grid{
  min-height:464px!important;
  grid-template-columns:minmax(0,1.28fr) minmax(330px,.72fr)!important;
  gap:clamp(42px,5vw,68px)!important;
  align-items:center!important;
}
.s12-hero-copy,
.p3-hero-copy,
.co2-hero-copy,
.tc-team-hero .tc-hero-copy{
  padding:42px 0 54px!important;
}
.s12-hero-copy h1,
.p3-hero-copy h1,
.co2-hero h1,
.tc-team-hero h1{
  max-width:830px!important;
  gap:.035em;
  margin-top:16px!important;
  font-size:clamp(52px,5vw,82px)!important;
  line-height:.96!important;
  letter-spacing:-.045em!important;
  font-weight:820!important;
}
.s12-hero-copy h1 span,
.p3-hero-copy h1 span,
.co2-hero h1 span,
.tc-team-hero h1 span{
  color:#ffffff!important;
}
.s12-hero-copy h1 span:last-child,
.p3-hero-copy h1 span:last-child,
.co2-hero h1 span:last-child,
.tc-team-hero h1 span:last-child{
  color:var(--aqua)!important;
}
.s12-hero-copy>p:not(.av5-eyebrow),
.p3-hero-copy>p:not(.av5-eyebrow),
.co2-hero-copy>p:not(.av5-eyebrow),
.tc-team-hero .tc-hero-copy>p:not(.av5-eyebrow){
  max-width:760px!important;
  margin-top:24px!important;
  font-size:clamp(17px,1.25vw,19px)!important;
  line-height:1.55!important;
}

/* Principal visuals remain secondary to the H1 */
.s12-hero-visual,
.p3-hero-products,
.co2-hero-visual,
.tc-team-stage{
  min-height:450px!important;
  max-height:480px!important;
}
.s12-hero-visual img{
  width:min(46%,230px)!important;
  max-height:420px!important;
}
.s12-hero-orbit--outer{width:440px!important;height:440px!important}
.s12-hero-orbit--inner{width:310px!important;height:310px!important}
.s12-hero-label{transform:scale(.88)}
.p3-hero-products img{
  width:min(108%,620px)!important;
  max-height:470px!important;
}
.p3-hero-halo{width:440px!important;height:440px!important}
.co2-hero-visual img{
  width:min(106%,620px)!important;
  max-height:470px!important;
}
.tc-team-stage{
  align-self:center!important;
}
.tc-hero-person{
  width:min(48%,250px)!important;
  border-radius:23px!important;
}
.tc-hero-person--arif{bottom:28px!important}
.tc-hero-person--david{top:24px!important}
.tc-team-total{bottom:14px!important}

/* 3. Contact: two-line utility hero */
.tc-contact-hero{
  min-height:var(--avix-hero-utility-min)!important;
  padding-top:116px!important;
}
.tc-contact-hero .tc-hero-grid{
  min-height:274px!important;
  grid-template-columns:minmax(0,1.48fr) minmax(240px,.52fr)!important;
  gap:clamp(36px,5vw,64px)!important;
  align-items:center!important;
}
.tc-contact-hero .tc-hero-copy{
  padding:32px 0 42px!important;
}
.tc-contact-hero h1{
  max-width:760px!important;
  gap:.055em;
  font-size:clamp(42px,4.2vw,68px)!important;
  line-height:.99!important;
  letter-spacing:-.04em!important;
}
.tc-contact-hero h1 span{color:#ffffff!important}
.tc-contact-hero h1 span:last-child{color:var(--aqua)!important}
.tc-contact-hero .tc-hero-copy>p:not(.av5-eyebrow){
  max-width:720px!important;
  margin-top:20px!important;
  font-size:clamp(16px,1.15vw,18px)!important;
  line-height:1.55!important;
}
.tc-contact-bottle{
  min-height:270px!important;
  max-height:285px!important;
}
.tc-contact-bottle img{
  width:min(50%,165px)!important;
  max-height:260px!important;
  bottom:4px!important;
}
.tc-contact-bottle::after{
  left:28%!important;
  right:28%!important;
  bottom:8px!important;
  height:34px!important;
}

/* 4. Legal and supporting pages: restrained, primarily typographic */
.page-legal .page-hero,
.page-references .page-hero{
  display:flex!important;
  align-items:center!important;
  min-height:var(--avix-hero-legal-min)!important;
  padding:112px 0 48px!important;
}
.page-legal .page-hero .container,
.page-references .page-hero .container{
  width:min(calc(100% - 48px),1280px)!important;
  margin-inline:auto!important;
}
.page-legal .page-hero h1,
.page-references .page-hero h1{
  max-width:760px!important;
  gap:.05em;
  margin:14px 0 0!important;
  font-size:clamp(38px,3.6vw,58px)!important;
  line-height:1!important;
  letter-spacing:-.035em!important;
}
.page-legal .page-hero h1 span,
.page-references .page-hero h1 span{color:#ffffff!important}
.page-legal .page-hero h1 span:last-child,
.page-references .page-hero h1 span:last-child{color:#37b6d0!important}
.page-references .page-hero p:last-child{
  max-width:760px!important;
  margin-top:20px!important;
  font-size:16px!important;
  line-height:1.55!important;
}

/* Prevent accidental nowrap inherited from earlier page-specific CSS. */
.av5-hero h1 span,
.s12-hero-copy h1 span,
.p3-hero-copy h1 span,
.co2-hero h1 span,
.tc-hero h1 span,
.page-hero h1 span{
  white-space:normal!important;
}

/* Laptop */
@media(max-width:1120px){
  .av5-hero h1{font-size:clamp(60px,7vw,82px)!important}
  .s12-hero-copy h1,.p3-hero-copy h1,.co2-hero h1,.tc-team-hero h1{
    font-size:clamp(50px,6.3vw,70px)!important;
  }
  .s12-hero-grid,.p3-hero-grid,.co2-hero-grid,.tc-team-hero .tc-hero-grid{
    grid-template-columns:minmax(0,1.18fr) minmax(310px,.82fr)!important;
  }
  .tc-hero-person{width:min(50%,230px)!important}
}

/* Tablet and stacked layout */
@media(max-width:860px){
  .av5-hero,
  .s12-hero,
  .p3-hero,
  .co2-hero,
  .tc-team-hero,
  .tc-contact-hero{
    min-height:auto!important;
    padding-top:116px!important;
  }
  .av5-hero-grid,
  .s12-hero-grid,
  .p3-hero-grid,
  .co2-hero-grid,
  .tc-team-hero .tc-hero-grid,
  .tc-contact-hero .tc-hero-grid{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    gap:10px!important;
  }
  .av5-hero-copy,
  .s12-hero-copy,
  .p3-hero-copy,
  .co2-hero-copy,
  .tc-team-hero .tc-hero-copy,
  .tc-contact-hero .tc-hero-copy{
    padding:52px 0 8px!important;
  }
  .av5-hero h1{
    max-width:760px!important;
    font-size:clamp(56px,9vw,76px)!important;
  }
  .s12-hero-copy h1,
  .p3-hero-copy h1,
  .co2-hero h1,
  .tc-team-hero h1{
    max-width:760px!important;
    font-size:clamp(48px,8vw,66px)!important;
  }
  .tc-contact-hero h1{font-size:clamp(42px,7vw,58px)!important}
  .av5-hero-bottle{min-height:450px!important;width:min(520px,100%)!important;margin-inline:auto!important}
  .av5-hero-bottle img{width:min(65%,300px)!important;max-height:425px!important}
  .s12-hero-visual,.p3-hero-products,.co2-hero-visual,.tc-team-stage{
    min-height:470px!important;
    max-height:none!important;
    width:min(650px,100%)!important;
    margin-inline:auto!important;
  }
  .tc-contact-bottle{
    min-height:270px!important;
    max-height:270px!important;
    width:min(420px,100%)!important;
    margin-inline:auto!important;
  }
}

/* Mobile */
@media(max-width:620px){
  .av5-hero,
  .s12-hero,
  .p3-hero,
  .co2-hero,
  .tc-team-hero,
  .tc-contact-hero{
    padding-top:100px!important;
  }
  .av5-hero-copy,
  .s12-hero-copy,
  .p3-hero-copy,
  .co2-hero-copy,
  .tc-team-hero .tc-hero-copy,
  .tc-contact-hero .tc-hero-copy{
    padding:48px 0 4px!important;
  }
  .av5-hero h1{
    gap:.06em;
    font-size:clamp(43px,13vw,58px)!important;
    line-height:.96!important;
    letter-spacing:-.047em!important;
  }
  .s12-hero-copy h1,
  .p3-hero-copy h1,
  .co2-hero h1,
  .tc-team-hero h1{
    gap:.05em;
    font-size:clamp(39px,11.7vw,52px)!important;
    line-height:.97!important;
    letter-spacing:-.04em!important;
  }
  .tc-contact-hero h1{
    gap:.07em;
    font-size:clamp(38px,10.8vw,48px)!important;
    line-height:1!important;
  }
  .av5-hero-lead,
  .s12-hero-copy>p:not(.av5-eyebrow),
  .p3-hero-copy>p:not(.av5-eyebrow),
  .co2-hero-copy>p:not(.av5-eyebrow),
  .tc-hero-copy>p:not(.av5-eyebrow){
    font-size:16px!important;
    line-height:1.55!important;
  }
  .av5-hero-bottle{min-height:390px!important}
  .av5-hero-bottle img{width:min(63%,245px)!important;max-height:370px!important}
  .s12-hero-visual,.p3-hero-products,.co2-hero-visual,.tc-team-stage{
    min-height:390px!important;
  }
  .s12-hero-visual img{width:min(44%,185px)!important;max-height:340px!important}
  .s12-hero-orbit--outer{width:340px!important;height:340px!important}
  .s12-hero-orbit--inner{width:240px!important;height:240px!important}
  .p3-hero-products img,.co2-hero-visual img{max-height:400px!important}
  .p3-hero-halo{width:340px!important;height:340px!important}
  .tc-team-stage{min-height:410px!important}
  .tc-hero-person{width:56%!important}
  .tc-contact-bottle{min-height:230px!important;max-height:230px!important}
  .tc-contact-bottle img{width:min(47%,145px)!important;max-height:220px!important}
  .page-legal .page-hero,
  .page-references .page-hero{
    min-height:auto!important;
    padding:108px 0 46px!important;
  }
  .page-legal .page-hero .container,
  .page-references .page-hero .container{
    width:min(calc(100% - 28px),1280px)!important;
  }
  .page-legal .page-hero h1,
  .page-references .page-hero h1{
    font-size:clamp(36px,10.5vw,48px)!important;
  }
}

/* Short landscape screens: compact without forcing viewport height. */
@media(max-height:520px) and (orientation:landscape) and (min-width:700px){
  .av5-hero,
  .s12-hero,
  .p3-hero,
  .co2-hero,
  .tc-team-hero,
  .tc-contact-hero{
    min-height:auto!important;
    padding-top:84px!important;
  }
  .av5-hero-grid,
  .s12-hero-grid,
  .p3-hero-grid,
  .co2-hero-grid,
  .tc-team-hero .tc-hero-grid,
  .tc-contact-hero .tc-hero-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(220px,.75fr)!important;
    min-height:420px!important;
  }
  .av5-hero-copy,
  .s12-hero-copy,
  .p3-hero-copy,
  .co2-hero-copy,
  .tc-hero-copy{
    padding:28px 0 34px!important;
  }
  .av5-hero h1{font-size:clamp(48px,6.8vw,64px)!important}
  .s12-hero-copy h1,.p3-hero-copy h1,.co2-hero h1,.tc-team-hero h1{font-size:clamp(42px,5.8vw,56px)!important}
  .tc-contact-hero h1{font-size:clamp(38px,5vw,50px)!important}
  .av5-hero-bottle,.s12-hero-visual,.p3-hero-products,.co2-hero-visual,.tc-team-stage,.tc-contact-bottle{
    min-height:400px!important;
    max-height:420px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .av5-hero *, .s12-hero *, .p3-hero *, .co2-hero *, .tc-hero *, .page-hero *{
    animation:none!important;
    transition:none!important;
  }
}

/* Final optical calibration: preserve the authored line count on large screens. */
@media(min-width:1121px){
  .av5-hero-grid{
    grid-template-columns:minmax(0,1.56fr) minmax(260px,.44fr)!important;
    gap:40px!important;
  }
  .av5-hero h1{
    max-width:1000px!important;
    font-size:clamp(68px,5.1vw,78px)!important;
  }
  .av5-hero-bottle img{
    width:min(70%,300px)!important;
    max-height:500px!important;
  }

  .s12-hero-grid,
  .p3-hero-grid,
  .co2-hero-grid,
  .tc-team-hero .tc-hero-grid{
    grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr)!important;
    gap:38px!important;
  }
  .s12-hero-copy h1,
  .p3-hero-copy h1,
  .co2-hero h1,
  .tc-team-hero h1{
    max-width:920px!important;
    font-size:clamp(56px,4.45vw,68px)!important;
  }
  .co2-hero h1{font-size:clamp(54px,4.2vw,64px)!important}
  .p3-hero-products img,.co2-hero-visual img{max-width:540px!important}
  .s12-hero-visual,.p3-hero-products,.co2-hero-visual,.tc-team-stage{
    min-height:430px!important;
    max-height:450px!important;
  }
  .tc-hero-person{width:min(48%,225px)!important}

  .tc-contact-hero .tc-hero-grid{
    grid-template-columns:minmax(0,1.68fr) minmax(210px,.32fr)!important;
    min-height:300px!important;
    gap:36px!important;
  }
  .tc-contact-hero h1{
    max-width:900px!important;
    font-size:clamp(48px,3.8vw,58px)!important;
  }
  .tc-contact-hero .tc-hero-copy>p:not(.av5-eyebrow){max-width:760px!important}
  .tc-contact-bottle{min-height:230px!important;max-height:245px!important}
  .tc-contact-bottle img{width:min(48%,145px)!important;max-height:225px!important}

  .page-legal .page-hero,
  .page-references .page-hero{padding:102px 0 34px!important}
}

/* Bring legacy legal/reference chrome into the approved AVIX header system. */
.page-legal .top-strip,
.page-references .top-strip{
  position:fixed;
  z-index:120;
  top:0;
  left:0;
  width:100%;
  height:34px;
  background:#060d0f!important;
  color:rgba(255,255,255,.78)!important;
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:transform .28s ease,opacity .22s ease;
}
.page-legal .top-strip .container,
.page-references .top-strip .container{
  min-height:34px!important;
  font-size:.61rem!important;
  letter-spacing:.11em!important;
}
.page-legal .site-header,
.page-references .site-header{
  position:fixed!important;
  z-index:110!important;
  top:34px!important;
  left:0;
  width:100%;
  background:rgba(8,16,18,.96)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(18px);
  transition:top .28s ease;
}
.page-legal.legacy-scrolled .top-strip,
.page-references.legacy-scrolled .top-strip{
  transform:translateY(-110%);
  opacity:0;
}
.page-legal.legacy-scrolled .site-header,
.page-references.legacy-scrolled .site-header{top:0!important}
.page-legal .header-inner,
.page-references .header-inner{height:82px!important}
.page-legal .brand img,
.page-references .brand img{width:206px!important;max-height:58px!important}
.page-legal .nav-link,
.page-references .nav-link{color:#f1eee9!important;font-weight:760!important}
.page-legal .nav-link:hover,
.page-legal .nav-link.active,
.page-references .nav-link:hover,
.page-references .nav-link.active{color:#37b6d0!important}
.page-legal .btn-primary,
.page-references .btn-primary{background:#37b6d0!important;color:#0a1518!important;font-weight:900!important;box-shadow:none!important}
.page-legal .menu-toggle span,
.page-references .menu-toggle span{background:#ffffff!important}
.page-legal .page-hero,
.page-references .page-hero{padding-top:150px!important}

@media(max-width:1080px){
  .page-legal .main-nav,
  .page-references .main-nav{
    top:106px!important;
    background:#081012!important;
    border:1px solid rgba(255,255,255,.1)!important;
  }
  .page-legal.legacy-scrolled .main-nav,
  .page-references.legacy-scrolled .main-nav{top:76px!important}
  .page-legal .nav-link,
  .page-references .nav-link{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
}
@media(max-width:620px){
  .page-legal .top-strip,
  .page-references .top-strip{height:32px}
  .page-legal .top-strip .container,
  .page-references .top-strip .container{min-height:32px!important;justify-content:center!important}
  .page-legal .top-strip .container span:not(:first-child),
  .page-references .top-strip .container span:not(:first-child){display:none!important}
  .page-legal .site-header,
  .page-references .site-header{top:32px!important}
  .page-legal.legacy-scrolled .site-header,
  .page-references.legacy-scrolled .site-header{top:0!important}
  .page-legal .header-inner,
  .page-references .header-inner{height:68px!important}
  .page-legal .brand img,
  .page-references .brand img{width:160px!important}
  .page-legal .page-hero,
  .page-references .page-hero{padding-top:124px!important}
}