@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');

html,body{margin:0;height:100%;overflow:hidden;background:#050509;color:#fff;font-family:'Orbitron',sans-serif;}
#starfield{position:fixed;inset:0;pointer-events:none;z-index:0;}

header{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1rem;}

.logo{margin:0;line-height:0.8;}
.logo .top{display:block;font-size:clamp(3.2rem,10vw,9rem);font-weight:700;background:linear-gradient(90deg,#ff5f6d,#ffc371,#ff5f6d);background-size:300% 300%;-webkit-background-clip:text;color:transparent;animation:glowTop 3s linear infinite;}
.logo .bottom{display:block;font-size:clamp(2.4rem,7vw,6.4rem);font-weight:700;background:linear-gradient(90deg,#43cea2,#185a9d,#43cea2);background-size:300% 300%;-webkit-background-clip:text;color:transparent;animation:glowBottom 3s linear infinite reverse;}
.dotai{font-size:0.45em;margin-left:0.2em;vertical-align:super;color:#e0e0e0;background:none;-webkit-background-clip:initial;}

@keyframes glowTop{
  0%{background-position:0% 50%;}
  100%{background-position:100% 50%;}
}
@keyframes glowBottom{
  0%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}

.tagline{margin:2rem 0 2.5rem;font-size:1.1rem;opacity:0.85;}

.btn{display:inline-block;padding:0.9rem 1.8rem;border-radius:10px;background:#9d4edd;color:#fff;font-weight:700;text-decoration:none;box-shadow:0 0 12px #9d4edd80;transition:transform .25s,box-shadow .25s;}
.btn:hover{transform:translateY(-3px);box-shadow:0 0 22px #9d4eddcc;}