/* === General Reset === */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body, html {
  height: 100%;
  background: radial-gradient(ellipse at center, #0b1c2c 0%, #000000 100%);
  font-family: 'Inter', sans-serif;
  color: white;
  overflow: hidden;
}

/* === Main Screen === */
.screen {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  text-align: center;
  animation: fadeIn 1.5s ease forwards;
  opacity: 0;
}

.logo-text {
  font-family: 'Playfair Display', serif;
  font-size: 2.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  opacity: 0;
  transform: scale(0.95);
  animation: logoTextIn 2s ease-out forwards;
  text-transform: uppercase;
}

.coming-soon {
  font-size: 2rem;
  letter-spacing: 0.25em;
  margin-top: 1.5rem;
  animation: textIn 2s ease 1s forwards;
  opacity: 0;
  transform: translateY(20px);
}

@media(max-width:500px) {
    .logo-text {
      font-size: 2.35rem;
    }
    .coming-soon {
      font-size: 1.8rem;
    }
}


@keyframes fadeIn {
  to { opacity: 1; }
}

@keyframes logoTextIn {
  0% { transform: scale(0.95); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes textIn {
  to { opacity: 1; transform: translateY(0); }
}