
/*
  Hero bottom transition fix
  Fixes the clipped proof-strip text and replaces the hard hero/content boundary with a smooth fade.
*/

/* Let the hero contain all of its own content instead of clipping the proof strip. */
html body .uc-hero{
  min-height:auto!important;
  overflow:hidden!important;
  padding-bottom:clamp(118px,10vw,168px)!important;
}

/* Add a soft fade from the purple hero into the normal site background. */
html body .uc-hero::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:-1px!important;
  height:220px!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      180deg,
      rgba(7,0,19,0) 0%,
      rgba(7,0,19,.38) 46%,
      rgba(5,12,23,.82) 78%,
      #050c17 100%
    )!important;
}

/* Keep background ribbons behind content and behind the bottom fade. */
html body .uc-hero-bg{z-index:0!important;}
html body .uc-hero::before{z-index:0!important;}
html body .uc-hero-inner{
  position:relative!important;
  z-index:3!important;
}

/* The proof strip now sits inside the hero, so it cannot be cut off. */
html body .uc-proof-strip{
  position:relative!important;
  z-index:4!important;
  transform:none!important;
  margin-top:clamp(54px,6vw,86px)!important;
  margin-bottom:0!important;
  overflow:visible!important;
  align-items:stretch!important;
}

html body .uc-proof-strip div{
  overflow:visible!important;
  min-height:128px!important;
}

html body .uc-proof-strip strong,
html body .uc-proof-strip span{
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
}

/* The next section should start naturally after the hero. No forced big jump needed anymore. */
html body main.container:has(.uc-hero) .uc-hero + *{
  margin-top:clamp(46px,5vw,72px)!important;
}

/* Smooth visual connection on the first content block after the hero. */
html body main.container:has(.uc-hero) > .public-section:first-of-type{
  position:relative!important;
}

html body main.container:has(.uc-hero) > .public-section:first-of-type::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:calc(-1 * clamp(46px,5vw,72px))!important;
  width:100vw!important;
  height:clamp(46px,5vw,72px)!important;
  transform:translateX(-50%)!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      180deg,
      #050c17 0%,
      rgba(5,12,23,.86) 42%,
      rgba(5,12,23,0) 100%
    )!important;
}

/* Mobile/tablet: keep proof cards readable without clipping. */
@media(max-width:1180px){
  html body .uc-hero{
    padding-bottom:76px!important;
  }
  html body .uc-proof-strip{
    margin-top:34px!important;
  }
  html body .uc-proof-strip div{
    min-height:110px!important;
  }
}

@media(max-width:760px){
  html body .uc-hero{
    padding-bottom:42px!important;
  }
  html body .uc-proof-strip{
    margin-top:28px!important;
  }
  html body .uc-proof-strip div{
    min-height:auto!important;
  }
}
