/* "Em breve" page of the closed test launch (cmd/server/launch_gate.go). */
:root {
  color-scheme: dark;
  --void: #120E1B;
  --surface: #1C1628;
  --nova: #FAF6FF;
  --ash: #A79EBB;
  --ignition: #FF2E63;
  --volt: #17E9C0;
  --aurum: #FFB627;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body.soon {
  margin: 0;
  min-width: 320px;
  display: flex;
  flex-direction: column;
  color: var(--nova);
  background: var(--void);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

.soon-stage {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 48px 16px;
  text-align: center;
  overflow: hidden;
}

.soon-glow {
  position: absolute;
  inset: -20% -10% auto;
  height: 80%;
  background:
    radial-gradient(40% 50% at 30% 40%, rgba(255, 46, 99, 0.28), transparent 70%),
    radial-gradient(35% 45% at 72% 55%, rgba(23, 233, 192, 0.18), transparent 70%);
  filter: blur(20px);
  pointer-events: none;
}

.soon-stage > :not(.soon-glow) { position: relative; }

.soon-logo { width: min(320px, 78vw); height: auto; }

.soon-eyebrow {
  margin: 8px 0 0;
  color: var(--volt);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.soon-title {
  margin: 0;
  font-size: clamp(2.6rem, 9vw, 5.5rem);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.02em;
  background: linear-gradient(100deg, var(--nova) 10%, var(--aurum) 55%, var(--ignition) 95%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.soon-lede {
  max-width: 34rem;
  margin: 0;
  color: var(--ash);
  font-size: 1.05rem;
  line-height: 1.6;
}

.soon-bars { display: flex; gap: 8px; margin-top: 6px; }

.soon-bars span {
  width: 42px;
  height: 6px;
  border-radius: 999px;
  background: var(--ignition);
  animation: soon-pulse 1.8s ease-in-out infinite;
}

.soon-bars span:nth-child(2) { background: var(--aurum); animation-delay: 0.3s; }
.soon-bars span:nth-child(3) { background: var(--volt); animation-delay: 0.6s; }

@keyframes soon-pulse {
  0%, 100% { opacity: 0.35; transform: scaleX(0.7); }
  50% { opacity: 1; transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
  .soon-bars span { animation: none; opacity: 0.8; }
}

.soon-social { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 12px; }

.soon-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(250, 246, 255, 0.16);
  border-radius: 12px;
  color: var(--nova);
  background: var(--surface);
  transition: border-color 0.15s, color 0.15s;
}

.soon-social-link:hover, .soon-social-link:focus-visible { border-color: var(--volt); color: var(--volt); }
.soon-social-link svg { width: 20px; height: 20px; fill: currentColor; }

.soon-contact { margin: 0; color: var(--ash); font-size: 0.9rem; }
.soon-contact a { color: var(--aurum); }

.soon-footer {
  padding: 18px 16px;
  color: var(--ash);
  font-size: 0.8rem;
  text-align: center;
}