:root {
  --bg-1: #050817;
  --bg-2: #0d1230;
  --ink: #eef3ff;
  --muted: #b9c8ef;
  --line: rgba(235, 243, 255, 0.35);
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
}

body {
  margin: 0;
  display: grid;
  place-items: center;
  font-family: "Sora", sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 20% 18%, rgba(95, 43, 210, 0.5), transparent 38%),
    radial-gradient(circle at 78% 24%, rgba(0, 151, 248, 0.45), transparent 42%),
    linear-gradient(150deg, var(--bg-1), var(--bg-2));
}

.placeholder {
  width: min(92vw, 920px);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 32px 26px;
  text-align: center;
  background: linear-gradient(145deg, rgba(136, 158, 255, 0.2), rgba(8, 15, 38, 0.62));
  backdrop-filter: blur(10px);
}

h1 {
  margin: 0 0 14px;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(1.4rem, 4vw, 2.2rem);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

p {
  margin: 0;
  font-size: clamp(0.98rem, 1.8vw, 1.2rem);
  color: var(--muted);
}