*{ margin:0; padding:0; box-sizing:border-box; }
html,body{ height:100%; }
body{
  background:#000;
  color:#F6F5F0;
  font-family:'Poppins',sans-serif;
  overflow:hidden;
  height:100vh;
  width:100vw;
  position:relative;
}
.mono{ font-family:'Space Mono',monospace; }

/* ---------- moving light background ---------- */
.stage{ position:fixed; top:0; left:0; right:0; bottom:0; overflow:hidden; background:#050505; }
.blob{ position:absolute; border-radius:50%; filter:blur(90px); mix-blend-mode:screen; }
.b1{
  width:60vw; height:60vw; max-width:800px; max-height:800px;
  background:#F7452B; top:-10%; left:-10%;
  animation:float1 22s ease-in-out infinite;
}
.b2{
  width:55vw; height:55vw; max-width:720px; max-height:720px;
  background:#6C4CFF; bottom:-15%; right:-10%;
  animation:float2 28s ease-in-out infinite;
}
.b3{
  width:45vw; height:45vw; max-width:600px; max-height:600px;
  background:#CFFF3D; top:35%; left:55%;
  animation:float3 34s ease-in-out infinite;
  opacity:0.7;
}
@keyframes float1{
  0%,100%{ transform:translate(0,0) scale(1); }
  25%{ transform:translate(18vw,10vh) scale(1.15); }
  50%{ transform:translate(5vw,22vh) scale(0.9); }
  75%{ transform:translate(-8vw,5vh) scale(1.05); }
}
@keyframes float2{
  0%,100%{ transform:translate(0,0) scale(1); }
  30%{ transform:translate(-15vw,-12vh) scale(1.2); }
  60%{ transform:translate(-5vw,-25vh) scale(0.85); }
  85%{ transform:translate(8vw,-8vh) scale(1.1); }
}
@keyframes float3{
  0%,100%{ transform:translate(0,0) scale(1); }
  33%{ transform:translate(-12vw,15vh) scale(1.1); }
  66%{ transform:translate(-20vw,-8vh) scale(0.95); }
}

/* ---------- sparkle / disco-ball glitter ---------- */
.sparks{ position:fixed; top:0; left:0; right:0; bottom:0; z-index:2; }
.spark{ position:absolute; border-radius:50%; animation:twinkle ease-in-out infinite; }
@keyframes twinkle{ 0%,100%{ opacity:0; transform:scale(0.6); } 50%{ opacity:0.9; transform:scale(1); } }

/* ---------- texture ---------- */
.grain{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:3; pointer-events:none;
  opacity:0.06; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scanlines{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:3; pointer-events:none; opacity:0.35;
  background:repeating-linear-gradient(to bottom, rgba(0,0,0,0.25) 0px, rgba(0,0,0,0.25) 1px, transparent 1px, transparent 3px);
}
.vignette{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:3; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,0.75) 100%);
}

/* ---------- center content ---------- */
.center{
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:4;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
}
.center img{
  width:min(38vw, 380px);
  animation:breathe 7s ease-in-out infinite;
  filter:brightness(0) drop-shadow(0 0 40px rgba(0,0,0,0.6));
}
@keyframes breathe{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.035); } }
.tagline{
  margin-top:26px; font-family:'Space Mono',monospace; font-size:12px; letter-spacing:4px; text-transform:uppercase;
  color:rgba(246,245,240,0.7);
}

.corner{
  position:fixed; bottom:28px; left:0; right:0; z-index:4; text-align:center;
}
.corner a{
  font-family:'Plus Jakarta Sans',sans-serif; font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase;
  color:rgba(246,245,240,0.4); text-decoration:none; transition:color 0.2s ease;
}
.corner a:hover{ color:rgba(246,245,240,0.85); }

@media (max-width:600px){
  .center img{ width:60vw; }
}