html,body{margin:0;height:100vh;height:calc(var(--vh,1vh) * 100);overflow:hidden;background:linear-gradient(#fff,#f7f9fb);font-family:system-ui}
body{display:flex;flex-direction:column}
.waves,.wave{margin:0;padding:0;list-style:none}
.waves{position:fixed;inset:0;z-index:0;pointer-events:none}
.wave{position:absolute;left:0;right:0;bottom:0;background:rgba(47,104,157,.03);animation:wavy 3s alternate infinite;transform-origin:bottom center}
.wave:nth-child(1){top:0%;animation-delay:.3s;}
.wave:nth-child(2){top:10%;animation-delay:.6s;}
.wave:nth-child(3){top:20%;animation-delay:.9s;}
.wave:nth-child(4){top:30%;animation-delay:1.2s;}
.wave:nth-child(5){top:40%;animation-delay:1.5s;}
.wave:nth-child(6){top:50%;animation-delay:1.8s;}
.wave:nth-child(7){top:60%;animation-delay:2.1s;}
.wave:nth-child(8){top:70%;animation-delay:2.4s;}
.wave:nth-child(9){top:80%;animation-delay:2.7s;}
.wave:nth-child(10){top:90%;animation-delay:3s;}
@keyframes wavy{to{transform:translateY(40px)}}
.hero{position:relative;z-index:2;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem}
.circle-wrap{position:relative;width:min(480px,55vw);aspect-ratio:1}
.circle{width:100%}.center{position:absolute;inset:0;display:flex;justify-content:center;align-items:center}.logo{width:48%}
.coming{width:min(520px,60vw);margin-top:2rem;clip-path:inset(0 100% 0 0)}
.address{position:relative;z-index:2;flex:0 0 auto;text-align:center;color:#2f689d;padding:1rem;font-size:.85rem}
@media(max-width:768px){.circle-wrap{width:75vw}.coming{width:80vw}}