@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--navy:#10183f;--muted:#687592;--purple:#5634f5;--green:#36b85b}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--navy);background:#fff}
.page{position:relative;isolation:isolate;display:flex;min-height:100vh;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:64px 24px 76px;background:radial-gradient(ellipse at 50% 38%,rgba(245,246,255,.58),transparent 42%),#fff}
.coming-soon{position:relative;z-index:2;width:min(100%,760px);margin-top:-12px;text-align:center}
.brand{display:inline-flex;flex-direction:column;align-items:center;gap:15px;color:inherit;text-decoration:none}
.brand-mark{position:relative;display:block;width:94px;height:72px}
.mark-purple,.mark-green{position:absolute;display:block;width:66px;height:40px;border-radius:25px 5px 25px 5px;transform:skewY(-2deg)}
.mark-purple{top:0;left:4px;border-top:12px solid #5634f5;border-left:12px solid #5634f5}
.mark-green{right:4px;bottom:0;border-top:12px solid #39b957;border-left:12px solid #39b957}
.brand-name{display:flex;flex-direction:column;line-height:1}
.brand-name strong{font-size:31px;font-weight:800;letter-spacing:3px}
.brand-name small{margin-top:8px;color:#687592;font-size:15px;letter-spacing:9px}
.divider-mark{display:flex;align-items:center;justify-content:center;gap:9px;margin:44px auto 36px}
.divider-mark span{width:43px;height:3px;border-radius:3px;background:#e8ebf5}
.divider-mark i{width:6px;height:6px;border-radius:50%;background:#dfe4f2}
.divider-mark b{width:9px;height:9px;border-radius:50%;background:var(--green)}
h1{margin:0;font-size:clamp(48px,7vw,88px);line-height:1.08;letter-spacing:-5px;font-weight:800}
h1 em{font-style:normal;color:var(--purple);background:linear-gradient(105deg,#633cff,#4b27e9);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.intro{margin:25px 0 48px;color:var(--muted);font-size:clamp(17px,2vw,23px);line-height:1.65}
.notify-form{display:flex;width:min(100%,615px);margin:0 auto;border:1px solid #e3e8f3;border-radius:19px;background:rgba(255,255,255,.92);box-shadow:0 8px 28px rgba(40,54,100,.045);overflow:hidden}
.email-field{display:flex;flex:1;min-width:0;align-items:center;gap:17px;padding:0 25px}
.email-field svg{width:27px;height:27px;flex:0 0 auto;fill:none;stroke:#71809e;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.email-field input{width:100%;min-width:0;height:64px;border:0;outline:0;color:var(--navy);background:transparent;font:inherit;font-size:16px}
.email-field input::placeholder{color:#8190ac;opacity:1}
.notify-form button{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:18px;min-width:185px;margin:0;padding:0 25px;border:0;border-radius:17px;color:#fff;background:linear-gradient(110deg,#633cff,#4b2be9);font:inherit;font-size:17px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}
.notify-form button:hover{transform:translateY(-1px);box-shadow:0 9px 22px rgba(86,52,245,.22)}
.notify-form button span{font-size:24px;line-height:1}
.form-message{margin:18px 0 0;font-size:14px;font-weight:500}
.form-message.success{color:#168b45}.form-message.error{color:#c23c4b}
.footer{position:absolute;z-index:2;right:20px;bottom:22px;left:20px;color:#8993aa;font-size:12px;text-align:center}
.waves{position:absolute;z-index:1;right:0;bottom:-2px;left:0;height:36%;min-height:210px;overflow:hidden;pointer-events:none}
.wave{position:absolute;right:-8%;bottom:-54%;left:-8%;height:100%;border-radius:50% 50% 0 0/32% 32% 0 0;filter:blur(1px)}
.wave-green{bottom:-60%;left:-15%;background:linear-gradient(100deg,rgba(108,221,168,.20),rgba(184,242,188,.17));transform:rotate(-8deg)}
.wave-blue{bottom:-70%;left:-10%;background:linear-gradient(100deg,rgba(161,215,248,.22),rgba(209,222,255,.18));transform:rotate(7deg)}
.wave-violet{right:-18%;bottom:-72%;background:linear-gradient(100deg,rgba(205,191,255,.18),rgba(160,143,255,.20));transform:rotate(-11deg)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){
.page{min-height:100svh;padding:48px 20px 84px}.coming-soon{margin-top:-25px}
.brand-mark{transform:scale(.82);margin-bottom:-7px}.brand-name strong{font-size:25px;letter-spacing:2.5px}
.brand-name small{font-size:12px;letter-spacing:7px}.divider-mark{margin:37px auto 30px}
h1{font-size:clamp(45px,12vw,62px);letter-spacing:-3px}.intro{margin:19px 0 32px;font-size:16px}
.notify-form{flex-direction:column;gap:8px;border:0;background:transparent;box-shadow:none;overflow:visible}
.email-field{min-height:58px;padding:0 17px;border:1px solid #e3e8f3;border-radius:14px;background:#fff}
.email-field input{height:56px;font-size:14px}.notify-form button{width:100%;min-height:56px;border-radius:14px}
.waves{height:27%;min-height:170px}.footer{bottom:15px;font-size:11px}
}
