.scene{position:absolute;inset:0;pointer-events:none}.scene-1 .star{position:absolute;left:50%;top:-10%;width:5vmax;height:5vmax;transform:translate(-50%,-50%);background-color:var(--bg-color);--star-shape:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E");-webkit-mask-image:var(--star-shape);mask-image:var(--star-shape);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;animation:star-drop 1s cubic-bezier(.55,.085,.68,.53) 0s forwards,star-bounce-explode 1.5s ease-in-out 1s forwards;transition:background-color 811ms cubic-bezier(.55,0,.1,1)}.scene-1 .ripple{position:absolute;left:50%;top:60%;width:10vmax;height:3vmax;border:2px solid hsla(0,0%,100%,.8);border-radius:50%;transform:translate(-50%,-50%) scale(0);opacity:0;animation:ripple-effect .8s ease-out .9s forwards}@keyframes star-drop{0%{top:-10%}to{top:60%}}@keyframes star-bounce-explode{0%{top:60%;transform:translate(-50%,-50%) scale(1) rotate(0deg)}30%{top:50%;transform:translate(-50%,-50%) scale(1) rotate(180deg)}50%{transform:translate(-50%,-50%) scale(1.5) rotate(220deg)}to{top:50%;transform:translate(-50%,-50%) scale(100) rotate(1turn)}}@keyframes ripple-effect{0%{transform:translate(-50%,-50%) scale(0);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}.scene-2{display:flex;justify-content:center;align-items:center}.scene-2 .content-wrapper{position:relative;width:150vmax;height:20vmax;transform:rotate(-12deg)}.scene-2 .line{position:absolute;top:50%;left:0;width:100%;height:4px;background-color:var(--text-color);clip-path:inset(0 100% 0 0);animation:line-shoot .6s cubic-bezier(.22,1,.36,1) 2.2s forwards,line-trim .5s cubic-bezier(.22,1,.36,1) 2.8s forwards}.scene-2 .text{position:absolute;color:var(--text-color);font-weight:800;opacity:0;animation:text-fade-in .5s ease 3.3s forwards}.scene-2 .text-top{bottom:50%;left:0;width:100%;text-align:center;font-size:6.6rem;letter-spacing:2px;margin-bottom:-10px}.scene-2 .text-bottom{top:50%;left:0;width:100%;text-align:center;font-size:2.5rem;margin-top:10px}@keyframes line-shoot{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes line-trim{0%{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 30% 0 30%)}}@keyframes text-fade-in{0%{opacity:0;transform:translateY(10px) rotate(0deg)}to{opacity:1;transform:translateY(0)}}