body {
  margin: 0;
  height: 100vh;
  background: radial-gradient(circle at top, #2b0049, #04000d);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", sans-serif;
  overflow: hidden;
  color: white;
  position: relative;
}

/* Center container */
.container {
  text-align: center;
  position: relative;
  z-index: 2;
  margin-top: -220px; /* lifted overall */
}

/* Logo */
.logo {
  width: 320px;
  max-width: 80%;
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 0.3s;
  transform: translateY(-200px); /* raised higher */
  margin-bottom: 10px;
}

/* Main heading */
.chrome-text {
  font-size: 80px;
  font-weight: 900;
  letter-spacing: 6px;
  background: linear-gradient(90deg, #fff, #bbb, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 25px rgba(180, 100, 255, 0.6);
  animation: shine 6s linear infinite;
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 1.2s;
  margin-top: -20px;
}

@keyframes shine {
  0% { background-position: -200px; }
  100% { background-position: 200px; }
}

/* Subheading */
.subtitle {
  font-style: italic;
  font-size: 24px;
  color: white;
  margin-top: 0px;
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 2.1s;
  transform: translateY(-20px);
}

/* Coming soon */
.coming-soon {
  margin-top: 70px;
  font-size: 26px;
  font-weight: 500;
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 3s;
}

.gear {
  display: inline-block;
  animation: spin 3s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Footer */
footer {
  position: absolute;
  bottom: 25px;
  font-size: 14px;
  color: rgba(255,255,255,0.5);
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 3.8s;
}

/* Vision 2030 footer */
.vision2030 {
  position: absolute;
  bottom: 8px;
  font-size: 13px;
  color: rgba(255,255,255,0.35);
  letter-spacing: 0.5px;
  text-align: center;
  width: 100%;
  opacity: 0;
  animation: fadein 1.5s ease forwards;
  animation-delay: 4.3s;
}

/* Stars */
.star {
  position: absolute;
  background: white;
  border-radius: 50%;
  opacity: 0;
  width: 2px;
  height: 2px;
  animation: twinkle 4s ease-in-out infinite;
}

@keyframes twinkle {
  0%, 100% { opacity: 0.2; }
  50% { opacity: 1; }
}

/* Fade animation */
@keyframes fadein {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Mobile */
@media (max-width: 600px) {
  .chrome-text { font-size: 50px; letter-spacing: 3px; margin-top: -10px; }
  .subtitle { font-size: 20px; transform: translateY(-10px); }
  .logo { width: 260px; transform: translateY(-180px); }
  .coming-soon { font-size: 22px; margin-top: 70px; }
  .vision2030 { font-size: 12px; bottom: 6px; }
}