.hero{
  position:relative;
  min-height:0;
  display:block;
  padding:clamp(130px,10vw,160px) 0 clamp(76px,7vw,110px);
  overflow:hidden;
}

.hero__grid{
  min-height:clamp(560px,62vw,720px);
  align-items:center;
}

.hero-title{
  display:flex;
  flex-direction:column;
  gap:.08em;
  margin:0 0 24px;
  font-family:"Barlow Condensed",Impact,sans-serif;
  font-weight:800;
  line-height:.9;
  letter-spacing:-.03em;
}

.hero-title__line{
  display:block;
}

.hero .hero-title__line--white{
  color:#f8f8fc;
  -webkit-text-fill-color:#f8f8fc;
  background:none;
  font-size:clamp(3rem,7vw,6.6rem);
  text-transform:none;
  text-shadow:0 5px 18px rgba(10,7,62,.34);
  filter:none;
}

.hero .hero-title__line--green{
  font-size:clamp(3.2rem,8vw,7.2rem);
  text-transform:uppercase;
  background:linear-gradient(
    180deg,
    #1fdfa8 0%,
    #28e783 30%,
    #39e048 66%,
    #4ef21a 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  filter:drop-shadow(0 5px 10px rgba(10,7,62,.28));
}

.hero__visual{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:0;
  padding-top:0;
}

.hero__logo{
  display:block;
  width:min(100%,560px);
  height:auto;
  border-radius:0;
  box-shadow:none;
}

.hero__tongue{
  position:absolute;
  top:120px;
  right:max(24px,calc((100vw - 1200px) / 2));
  z-index:3;
  display:block;
  width:clamp(96px,8vw,132px);
  height:auto;
}

@media(max-width:900px){
  .hero{
    padding-top:118px;
  }

  .hero__grid{
    min-height:0;
    gap:48px;
  }

  .hero-title{
    align-items:center;
  }

  .hero__visual{
    width:min(100%,620px);
    min-height:0;
    padding-top:0;
  }

  .hero__tongue{
    right:24px;
    width:96px;
  }
}

@media(max-width:640px){
  .hero{
    padding:108px 0 68px;
  }

  .hero-title{
    gap:.12em;
  }

  .hero .hero-title__line--white{
    font-size:clamp(2.7rem,14vw,4.4rem);
  }

  .hero .hero-title__line--green{
    font-size:clamp(3rem,16vw,5rem);
  }

  .hero__visual{
    min-height:0;
    padding-top:0;
  }

  .hero__tongue{
    right:14px;
    width:78px;
  }
}
