.lottie-character{position:relative;display:block;width:100%;aspect-ratio:var(--character-ratio);cursor:default}
.lottie-character>img,.lottie-character>.character-player{position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;object-fit:contain;pointer-events:none}
.lottie-character>.character-player>svg{display:block;width:100%!important;height:100%!important;overflow:hidden}
.lottie-character.is-loaded>img{visibility:hidden}
.hero>.new-character.char-girl{left:8%;bottom:7%;width:clamp(140px,15vw,220px)}
.hero>.new-character.char-boy{left:22%;bottom:6%;width:clamp(140px,14vw,210px)}
.hero>.hills{z-index:auto}
.hero>.hills>svg{z-index:2}
.hero>.hills>svg:last-child{z-index:5;pointer-events:none}
.hero>.hero-butterfly{position:absolute;z-index:3;width:clamp(38px,4vw,64px);pointer-events:none}
.hero>.butterfly-coral{left:14%;top:34%;rotate:-12deg}
.hero>.butterfly-teal{right:6.5%;top:33%;rotate:16deg}
.sticker-wrap>.sticker{position:relative;z-index:2}
.sticker-wrap>.sticker-char{z-index:1;bottom:58%;left:50%;right:auto;translate:-50% 0;width:clamp(200px,18vw,270px)}
.sticker-wrap>.sticker.g + .sticker-char{left:50%;right:auto}
.visit-cast{position:absolute;z-index:3;left:50%;bottom:14%;width:min(1060px,94%);transform:translateX(-50%)}
.visit-scene>.hills.cast-foreground{z-index:4;pointer-events:none}
@media(max-width:860px){
  .hero>.new-character.char-girl{left:3%;width:clamp(120px,20vw,170px)}
  .hero>.new-character.char-boy{left:23%;width:clamp(120px,19vw,160px)}
  .hero>.butterfly-coral{top:27%;left:5%}
  .hero>.butterfly-teal{right:5%;top:56%}
  .visit-cast{width:96%;bottom:14%}
}
@media(max-width:560px){
  .hero>.new-character.char-girl{width:112px;left:0;bottom:4.5%}
  .hero>.new-character.char-boy{width:108px;left:24%;bottom:5%}
  .hero>.hero-butterfly{width:34px}
  .hero>.butterfly-coral{top:20%;left:4%}
  .hero>.butterfly-teal{top:70%;right:60%}
  .visit-cast{width:96%;bottom:15%}
}