@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Plus+Jakarta+Sans:wght@400;500;700&display=swap";:root{--perspective: 1000px}body{margin:0;padding:0;font-family:Plus Jakarta Sans,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fafafa;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:Outfit,sans-serif}.border-thick{border:3px solid #3E2723}.text-outline{-webkit-text-stroke:1.5px #3E2723;color:#fdfbf7;text-shadow:4px 4px 0px #3E2723}.text-outline-sm{-webkit-text-stroke:1px #3E2723;color:#fdfbf7;text-shadow:2px 2px 0px #3E2723}.shadow-hard{box-shadow:4px 4px #3e2723}.btn-primary{background-color:#ffb74d;color:#3e2723;border:3px solid #3E2723;box-shadow:4px 4px #3e2723;transition:all .2s ease-in-out}.btn-primary:hover{transform:translate(2px,2px);box-shadow:2px 2px #3e2723}.btn-primary:active{transform:translate(4px,4px);box-shadow:0 0 #3e2723}.card-flat{background-color:#fff;border:3px solid #3E2723;box-shadow:8px 8px #3e2723}@keyframes float{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(5deg)}to{transform:translateY(0) rotate(0)}}.animate-float{animation:float 6s ease-in-out infinite}.animate-float-delayed{animation:float 7s ease-in-out infinite;animation-delay:2s}@keyframes slide-up-fade{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:slide-up-fade .8s cubic-bezier(.16,1,.3,1) forwards}.delay-100{animation-delay:.1s}.delay-200{animation-delay:.2s}.delay-300{animation-delay:.3s}@keyframes blob{0%{transform:translate(0) scale(1)}33%{transform:translate(30px,-50px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.9)}to{transform:translate(0) scale(1)}}.animate-blob{animation:blob 7s infinite}@keyframes liquid-fill{0%{transform:translateY(100%)}to{transform:translateY(0)}}.animate-liquid{animation:liquid-fill 2s ease-out forwards}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#cbd5e1}.bg-grain{background-image:url(https://grainy-gradients.vercel.app/noise.svg);filter:contrast(170%) brightness(100%)}.hero-container{position:relative;width:100%;height:100vh;overflow:hidden;background-color:#e6f3f5}.layer-sky-background{position:absolute;bottom:0;left:0;width:100%;height:100%;z-index:0;background-image:url(https://animal-images-1395769345.cos.ap-guangzhou.myqcloud.com/images/environment/sky_Background.webp);background-size:cover;background-position:center;background-repeat:no-repeat}.land-water-background{position:absolute;bottom:0;left:0;width:100%;height:auto;z-index:1}.land-water-background img{width:100%;height:auto;display:block}.cloud-large{position:absolute;bottom:75vw;left:50%;width:18vw;height:auto;z-index:1;opacity:.9}.cloud-large-2{position:absolute;bottom:55vw;left:18%;width:15vw;height:auto;z-index:1;opacity:.8}.cloud-middle{position:absolute;bottom:65vw;left:30%;width:16vw;height:auto;z-index:1;opacity:.9}.cloud-middle-2{position:absolute;bottom:40vw;right:30%;width:14vw;height:auto;z-index:1;opacity:.9}.cloud-middle-3{position:absolute;bottom:58vw;left:60%;width:15vw;height:auto;z-index:1;opacity:.85}.cloud-small{position:absolute;bottom:67vw;left:70%;width:10vw;height:auto;z-index:1;opacity:.9}.cloud-small-2{position:absolute;bottom:40vw;left:25%;width:8vw;height:auto;z-index:1;opacity:.85}.cloud-small-3{position:absolute;bottom:50vw;left:45%;width:9vw;height:auto;z-index:1;opacity:.85}.tree-left{position:absolute;bottom:19vw;left:-10vw;width:25vw;height:auto;z-index:2}.tree-right{position:absolute;bottom:17vw;right:-18vw;width:40vw;height:auto;z-index:2}.coral{position:absolute;bottom:-2vw;right:10%;width:15vw;height:auto;z-index:2}.boulder{position:absolute;bottom:-3vw;left:5%;width:12vw;height:auto;z-index:2}@keyframes bubbleRise{0%{transform:translateY(0);opacity:.8}50%{transform:translateY(-4vw);opacity:1}to{transform:translateY(-8vw);opacity:0}}.bubble-large{position:absolute;bottom:1vw;right:18%;width:5vw;height:auto;z-index:2;animation:bubbleRise 6s ease-in-out infinite;animation-delay:0s;will-change:transform,opacity}.bubble-middle{position:absolute;bottom:2vw;right:15%;width:3.5vw;height:auto;z-index:2;animation:bubbleRise 5s ease-in-out infinite;animation-delay:1.5s;will-change:transform,opacity}.bubble-small{position:absolute;bottom:3vw;right:13%;width:2vw;height:auto;z-index:2;animation:bubbleRise 4s ease-in-out infinite;animation-delay:3s;will-change:transform,opacity}@keyframes fly{0%{transform:translateY(0) translate(0) rotate(0)}50%{transform:translateY(-2vw) translate(2vw) rotate(2deg)}to{transform:translateY(0) translate(0) rotate(0)}}@keyframes swim{0%{transform:translate(0) rotate(0)}50%{transform:translate(-2vw) rotate(-2deg)}to{transform:translate(0) rotate(0)}}@keyframes breathe{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.animal-falcon{position:absolute;bottom:63vw;right:40%;width:12vw;height:auto;z-index:3;animation:fly 6s ease-in-out infinite}.animal-wolf{position:absolute;bottom:16vw;left:17%;width:19vw;height:auto;z-index:3;animation:breathe 5s ease-in-out infinite}.animal-peacock{position:absolute;bottom:16vw;right:12%;width:20vw;height:auto;z-index:3;animation:breathe 7s ease-in-out infinite}.animal-jellyfish{position:absolute;bottom:0vw;right:25%;width:12vw;height:auto;z-index:3;opacity:.8;animation:swim 15s ease-in-out infinite}.animal-dolphin{position:absolute;bottom:-1vw;left:25%;width:14vw;height:auto;z-index:3;animation:swim 8s ease-in-out infinite}.layer-title{position:absolute;top:0;left:0;width:100%;height:100%;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:0;pointer-events:none}.hero-title{font-size:clamp(2rem,13vw,6rem);font-weight:400;color:#fff8e1;text-align:center;-webkit-text-stroke:3px #3E2723;text-shadow:5px 5px 0px #3E2723;margin-bottom:2rem;pointer-events:auto;font-family:ZCOOL KuaiLe,Outfit,sans-serif;letter-spacing:2px;line-height:1.2;background-color:#4e7838;padding:.1em .5em;border-radius:99px;display:inline-block;box-shadow:6px 6px #3e2723;border:4px solid #3E2723;width:fit-content;white-space:nowrap;max-width:95vw;overflow:hidden}.hero-subtitle{font-size:1.5rem;font-weight:600;color:#fff8e1;text-align:center;max-width:85vw;margin-bottom:3rem;padding:.8rem 2rem;position:relative;z-index:5;pointer-events:auto;background-color:#4e7838;border-radius:16px;display:inline-block;width:fit-content;border:3px solid #3E2723;box-shadow:4px 4px #3e2723;text-shadow:none}.start-button{background-color:#ffb74d;color:#3e2723;border:4px solid #3E2723;padding:1rem 3rem;font-size:1.5rem;font-weight:800;border-radius:12px;cursor:pointer;pointer-events:auto;display:flex;align-items:center;gap:.8rem;transition:all .1s ease-in-out;box-shadow:6px 6px #3e2723;text-transform:uppercase;letter-spacing:1px}.start-button:hover{transform:translate(2px,2px);box-shadow:4px 4px #3e2723;background-color:#ffa726}.start-button:active{transform:translate(6px,6px);box-shadow:0 0 #3e2723}.button-icon{width:24px;height:24px}.chevron-icon{opacity:.6;transition:all .3s ease;width:24px;height:24px}.start-button:hover .chevron-icon{transform:translate(4px);opacity:1}@media(max-width:768px){.land-water-background{width:200%;left:-50%;height:auto}.tree-left{width:35vw;bottom:40vw;left:-15vw}.tree-right{width:50vw;bottom:35vw;right:-23vw}.cloud-large{width:40vw;top:15vw;left:-15vw}.cloud-large-2{display:none}.cloud-middle{width:30vw;top:30vw;left:70%}.cloud-middle-2,.cloud-middle-3{display:none}.cloud-small{width:20vw;top:35vw;left:30%}.cloud-small-2,.cloud-small-3{display:none}.animal-wolf{width:28vw;bottom:32vw;left:30%}.animal-peacock{display:none}.animal-falcon{width:23vw;top:10vw;right:20%}.animal-dolphin{display:none}.layer-title{padding-bottom:20vw}.hero-title{margin-bottom:1rem}.hero-subtitle{font-size:1.1rem;margin-bottom:2rem;max-width:90%}.start-button{font-size:1.2rem;padding:.8rem 2rem}.animal-jellyfish{width:20vw;bottom:3vw;left:35%}.coral{width:30vw;bottom:-4vw;right:5%}.boulder{width:25vw;bottom:-6vw;left:2%}.bubble-large{width:10vw;bottom:6vw;right:15%}.bubble-middle{width:7vw;bottom:6vw;right:12%}.bubble-small{width:4vw;bottom:6vw;right:22%}}@media(min-width:1920px){.tree-left,.tree-right{max-width:600px}}
