.kv-title.inside {
  overflow: visible;
}

.kv-title.inside .hero-line {
  display: block;
  width: max-content;
  max-width: 100%;
  margin: 0;
  clip-path: inset(105% 0 0 0);
  opacity: 0;
  transform: translateY(34px);
  will-change: clip-path, opacity, transform;
}

.kv-title.inside .hero-line:first-child {
  animation: hero-line-reveal .82s 5.05s cubic-bezier(.22, .9, .28, 1) forwards;
}

.kv-title.inside .hero-line:last-child {
  animation: hero-line-reveal .82s 5.31s cubic-bezier(.22, .9, .28, 1) forwards;
}

.kv-title.inside .hero-line:last-child {
  text-align: left;
}

.kv-desc {
  opacity: 0;
  transform: translateY(18px);
  will-change: opacity, transform;
  animation: hero-description-in .75s 5.92s cubic-bezier(.22, .8, .28, 1) forwards;
}

.bottom-nav {
  transform: translateX(-50%) translateY(112%);
  opacity: 0;
  will-change: transform, opacity;
  animation: bottom-navigation-in .82s 4.34s cubic-bezier(.2, .88, .3, 1) forwards;
}

.home-qr-widget {
  opacity: 0;
  transform: translateY(18px);
  animation: floating-tool-in .6s 6.05s cubic-bezier(.22, .8, .28, 1) forwards;
}

.home-qr-widget.is-closing {
  animation: none;
}

@keyframes hero-line-reveal {
  0% {
    clip-path: inset(105% 0 0 0);
    opacity: 0;
    transform: translateY(34px);
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes hero-description-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes bottom-navigation-in {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(112%);
  }
  35% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

@keyframes floating-tool-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .kv-title.inside .hero-line,
  .kv-desc,
  .bottom-nav,
  .home-qr-widget {
    animation: none;
    clip-path: none;
    opacity: 1;
    transform: none;
  }

  .bottom-nav {
    transform: translateX(-50%);
  }
}
