/* V73 — restore a long, seamless hero-to-white transition while keeping the service-card overlap. */
.techtrim-home .tt-hero{
  background:#fff!important;
}

/* Fade the actual approved hero artwork itself instead of relying on a hard section boundary. */
.techtrim-home .tt-hero > img{
  -webkit-mask-image:linear-gradient(to bottom,
    #000 0%,
    #000 56%,
    rgba(0,0,0,.995) 61%,
    rgba(0,0,0,.97) 66%,
    rgba(0,0,0,.91) 71%,
    rgba(0,0,0,.82) 76%,
    rgba(0,0,0,.70) 81%,
    rgba(0,0,0,.56) 85%,
    rgba(0,0,0,.42) 89%,
    rgba(0,0,0,.29) 92%,
    rgba(0,0,0,.18) 95%,
    rgba(0,0,0,.09) 97%,
    rgba(0,0,0,.035) 99%,
    transparent 100%)!important;
  mask-image:linear-gradient(to bottom,
    #000 0%,
    #000 56%,
    rgba(0,0,0,.995) 61%,
    rgba(0,0,0,.97) 66%,
    rgba(0,0,0,.91) 71%,
    rgba(0,0,0,.82) 76%,
    rgba(0,0,0,.70) 81%,
    rgba(0,0,0,.56) 85%,
    rgba(0,0,0,.42) 89%,
    rgba(0,0,0,.29) 92%,
    rgba(0,0,0,.18) 95%,
    rgba(0,0,0,.09) 97%,
    rgba(0,0,0,.035) 99%,
    transparent 100%)!important;
  -webkit-mask-size:100% 100%!important;
  mask-size:100% 100%!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
}

/* A second soft white veil bridges the hero and the overlapping service cards.
   It is deliberately independent from hero pseudo-elements used by exhaust effects. */
@media (min-width:981px){
  .techtrim-home #services::before{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:-188px!important;
    width:100vw!important;
    height:220px!important;
    transform:translateX(-50%)!important;
    pointer-events:none!important;
    z-index:0!important;
    background:linear-gradient(to bottom,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.015) 12%,
      rgba(255,255,255,.045) 23%,
      rgba(255,255,255,.10) 34%,
      rgba(255,255,255,.19) 45%,
      rgba(255,255,255,.31) 56%,
      rgba(255,255,255,.46) 66%,
      rgba(255,255,255,.62) 75%,
      rgba(255,255,255,.76) 83%,
      rgba(255,255,255,.88) 90%,
      rgba(255,255,255,.96) 96%,
      #fff 100%)!important;
  }
  .techtrim-home #services > h2,
  .techtrim-home #services .tt-service-cards{
    position:relative!important;
    z-index:2!important;
  }
}

@media (max-width:980px){
  .techtrim-home .tt-hero > img{
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,.88) 75%,rgba(0,0,0,.55) 86%,rgba(0,0,0,.20) 95%,transparent 100%)!important;
    mask-image:linear-gradient(to bottom,#000 0%,#000 62%,rgba(0,0,0,.88) 75%,rgba(0,0,0,.55) 86%,rgba(0,0,0,.20) 95%,transparent 100%)!important;
  }
}
