:root{
 --white:#f7f7ff; --muted:#c8c8dc; --accent:#913aff; --line:rgba(150,105,255,.75);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#040619;color:var(--white);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
body{min-height:100svh}
a{color:inherit}
.site{
 min-height:100svh;
 background:#040619 url("/assets/hero-mobile.webp") center/cover no-repeat;
 position:relative;
 overflow-x:hidden;
}
.site:before{
 content:"";position:absolute;inset:0;background:rgba(3,5,18,.33);pointer-events:none
}
.shell{
 position:relative;z-index:1;width:min(100% - 30px,1320px);margin:auto;min-height:100svh;
 display:grid;grid-template-rows:auto 1fr;
}
header{
 display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
 padding:24px 0 8px;
}
.kicker{
 font-size:.67rem;letter-spacing:.34em;line-height:1.62;text-transform:uppercase;color:#c0bed9
}
.kicker:after{content:"";display:block;width:40px;height:3px;background:var(--accent);margin-top:15px;border-radius:99px}
nav{display:flex;gap:18px;font-size:.88rem}
nav a{text-decoration:none;opacity:.92}
.hero{
 display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
 padding:14px 0 28px;
}
.logo{width:142px;height:auto;margin:0 0 4px;filter:drop-shadow(0 7px 18px rgba(108,53,255,.35))}
h1{font-size:clamp(2.35rem,11vw,5rem);font-weight:300;line-height:.98;letter-spacing:-.03em;margin:0}
.tagline{margin:11px 0 0;font-size:.74rem;letter-spacing:.34em;color:#a8a9ff}
.coming{margin:36px 0 0;font-size:clamp(1.5rem,7vw,2.7rem);letter-spacing:.28em;font-weight:300}
.sub{margin:14px auto 0;max-width:620px;font-size:1rem;line-height:1.45;color:#e0e0ed}
.signup{
 width:min(100%,720px);margin:24px auto 0;display:flex;flex-direction:column;gap:10px
}
.signup input,.signup button{height:56px;border-radius:16px}
.signup input{
 padding:0 18px;background:rgba(5,7,27,.62);border:1px solid var(--line);color:#fff;outline:none
}
.signup input::placeholder{color:#a4a4b9}
.signup button{
 border:0;background:#8d35f6;color:#fff;font-weight:650;cursor:pointer;padding:0 26px
}
.features{
 width:min(100%,760px);margin:22px auto 0;display:grid;grid-template-columns:1fr;gap:6px
}
.feature{font-size:.68rem;letter-spacing:.19em;text-transform:uppercase;padding:8px;color:#d9d7f2}
.feature .icon{display:block;font-size:1.25rem;color:#8a69ff;margin-bottom:5px}
.bottomline{margin-top:22px;font-size:.62rem;letter-spacing:.27em;text-transform:uppercase;color:#b5b5c8}
.bottomline:after{content:"";display:block;width:48px;height:2px;margin:14px auto 0;background:#733cff}
.modal{position:fixed;inset:0;background:rgba(0,0,10,.76);display:none;align-items:center;justify-content:center;padding:20px;z-index:5}
.modal.open{display:flex}
.modal-card{width:min(100%,620px);background:#0b0d27;border:1px solid rgba(148,98,255,.35);border-radius:20px;padding:26px;text-align:left}
.modal-card h2{margin:0 0 9px}.modal-card p{color:#c9c9da;line-height:1.6}.close{float:right;border:0;background:transparent;color:#fff;font-size:1.7rem;cursor:pointer}
.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(min-width:640px){
 .shell{width:min(100% - 54px,1320px)}
 header{padding-top:28px}
 nav{gap:30px;font-size:.95rem}
 .signup{flex-direction:row;gap:0;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:rgba(5,7,27,.55)}
 .signup input{flex:1;border:0;border-radius:0;background:transparent}
 .signup button{min-width:205px;border-radius:16px}
 .features{grid-template-columns:repeat(3,1fr);gap:0}
 .feature+.feature{border-left:1px solid rgba(180,174,220,.26)}
}
@media(min-width:760px){
 .site{background-image:url("/assets/hero-tablet.webp")}
}
@media(min-width:1100px){
 html,body,.site,.shell{height:100%;min-height:100vh}
 .site{background-image:url("/assets/hero-desktop.webp");background-position:center 50%}
 .shell{grid-template-rows:78px minmax(0,1fr)}
 header{padding:24px 0 0}
 .hero{
   min-height:0;
   justify-content:center;
   padding:0 0 18px;
   transform:translateY(-4px);
 }
 .logo{width:178px;margin-bottom:0}
 h1{font-size:clamp(3.2rem,5.25vw,5rem)}
 .tagline{font-size:.82rem;margin-top:8px}
 .coming{margin-top:27px;font-size:2rem}
 .sub{margin-top:10px;font-size:.98rem}
 .signup{margin-top:20px}
 .features{margin-top:18px}
 .bottomline{margin-top:17px}
}
@media(max-height:780px) and (min-width:1100px){
 .shell{grid-template-rows:66px minmax(0,1fr)}
 header{padding-top:18px}
 .logo{width:142px}
 h1{font-size:3.55rem}
 .coming{margin-top:18px;font-size:1.75rem}
 .sub{font-size:.9rem;margin-top:8px}
 .signup{margin-top:14px}
 .signup input,.signup button{height:50px}
 .features{margin-top:10px}
 .feature{padding:5px}
 .bottomline{margin-top:10px}
}