/* Responsive overrides focused on mobile polish *//* 1) Home video: maintain 16:9 and fill container */.video-container{
  position:relative;
  aspect-ratio:16/9;
  background:#000;
  border-radius:10px;
  overflow:hidden
}
.video-container iframe,.video-container video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  border:0
}
/* 2) Navbar spacing when collapsed */@media (max-width: 991.98px){
  #navbar .navbar-collapse{
    background-color:rgba(33,37,41,0.97);
    border-top:1px solid rgba(255,255,255,.1);
    padding:.5rem 1rem
  }
  #navbar .navbar-nav{
    gap:.25rem
  }
  #navbar .nav-link{
    margin-right:0;
    padding:.75rem 0;
    font-size:1.05rem;
    text-align:center
  }
  #navbar .nav-link,#navbar .nav-link:hover,#navbar .nav-link.active{
    background-image:none!important;
    padding-bottom:0
  }
}
/* 3) Container breathing room on small screens */@media (max-width: 575.98px){
  .container{
    padding-left:1rem;
    padding-right:1rem
  }
}
/* 4) Avoid horizontal scroll from large images */img,video,iframe{
  max-width:100%
}
/* 5) Hero and elements tuning on small screens */@media (max-width: 768px){
  .home-section{
    text-align:center;
    padding-top:7rem
  }
  .home-title{
    font-size:clamp(2.4rem,7vw,3.6rem)
  }
  .home-subtitle{
    font-size:clamp(1rem,4vw,1.4rem);
    margin-bottom:1rem;
    line-height:1.2
  }
  .home-slogan{
    font-size:clamp(1.2rem,5vw,1.6rem)
  }
  .sustainability-container{
    text-align:center;
    margin-top:2rem
  }
  .sustainability-images{
    justify-content:center;
    gap:.5rem
  }
  .sustainability-icon{
    width:80px;
    height:80px
  }
  .icons-container{
    justify-content:center;
    gap:1rem
  }
  .home-icon{
    width:auto;
    max-width:120px
  }
}
/* 6) Anchor offset for sticky navbar */@media (max-width: 575.98px){
  html{
    scroll-padding-top:72px
  }
}

/* 7) Sustainability grid mobile: 2x3 with 16 centered on last row */
@media (max-width: 768px){
  .sustainability-images{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.75rem;
    justify-items:center;
    align-items:center;
    margin-bottom:1rem;
  }
  .sustainability-images img:last-child{
    grid-column:1 / -1;
    justify-self:center;
  }
  .sustainability-container{
    padding-bottom:.75rem;
    border-bottom:2px solid rgba(101,193,190,.8);
    margin-bottom:1rem;
  }
}

/* 8) Swap hero background on mobile */
@media (max-width: 768px){
  .home-section{
    background-image:url('../images/backgrounds/Home_mobile.jpg') !important;
    background-position:center top;
    background-size:cover;
  }
}

