@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Thin.woff2") format("woff2");
  font-weight: 100;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Light.woff2") format("woff2");
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0a0a0a;
  color: #e0e0e0;
  font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
  position: relative;
}

body::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      ellipse 600px 500px at 15% 25%,
      rgba(60, 20, 90, 0.25),
      transparent
    ),
    radial-gradient(
      ellipse 500px 400px at 80% 15%,
      rgba(30, 40, 100, 0.2),
      transparent
    ),
    radial-gradient(
      ellipse 400px 600px at 70% 75%,
      rgba(90, 20, 70, 0.2),
      transparent
    ),
    radial-gradient(
      ellipse 550px 350px at 25% 80%,
      rgba(40, 30, 110, 0.18),
      transparent
    ),
    radial-gradient(
      ellipse 300px 450px at 50% 50%,
      rgba(70, 15, 80, 0.15),
      transparent
    ),
    radial-gradient(
      ellipse 450px 300px at 90% 50%,
      rgba(50, 20, 100, 0.12),
      transparent
    ),
    radial-gradient(
      ellipse 350px 500px at 5% 60%,
      rgba(80, 25, 60, 0.14),
      transparent
    );
  z-index: 0;
}

main {
  text-align: center;
  position: relative;
  z-index: 1;
}

h1 {
  font-size: 1.4rem;
  font-weight: 300;
  letter-spacing: 0.35em;
  text-transform: lowercase;
}

p {
  margin-top: 0.6rem;
  font-size: 0.85rem;
  font-weight: 300;
  letter-spacing: 0.2em;
  color: #666;
  text-transform: lowercase;
}