:root {
  --color-bg: #0b0d10;
  --color-text: #eef3f8;
  --color-muted: #7f8892;
  --color-blue: #2992ff;

  --font-primary: "Space Grotesk", Inter, system-ui, sans-serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;

  background:
    radial-gradient(circle at center,
      rgba(41, 146, 255, 0.045),
      transparent 38rem),
    var(--color-bg);

  color: var(--color-text);
  font-family: var(--font-primary);
}

.site {
  flex: 1;

  display: flex;
  justify-content: center;
  align-items: center;

  padding: 4rem 2rem;
}

.hero {
  text-align: center;
  max-width: 1100px;
}

.eyebrow {
  margin: 0;

  font-size: clamp(4.4rem, 9.5vw, 7.4rem);

  font-weight: 500;

  letter-spacing: .20em;
  text-indent: .20em;
}

.line {
  width: 120px;
  height: 1px;

  margin: 1.7rem auto 1.6rem;

  background: var(--color-blue);

  transform: scaleX(0);
  transform-origin: center;

  animation: lineReveal .9s cubic-bezier(.19,1,.22,1) forwards;
}

h1 {
  margin: 0;

  font-size: clamp(1.15rem, 2vw, 1.5rem);

  font-weight: 500;

  letter-spacing: .14em;
}

.disciplines {
  margin: 4rem 0;

  padding: 0;

  list-style: none;

  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .9rem;

  color: var(--color-muted);

  text-transform: uppercase;

  font-size: .95rem;

  letter-spacing: .12em;
}

.disciplines li {
  display: flex;
  align-items: center;
}

.disciplines li:not(:last-child)::after {
  content: "•";
  margin-left: .9rem;
  color: rgba(255,255,255,.22);
}

.status {
  color: rgba(255,255,255,.35);
  font-size: .9rem;
}

footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 1.5rem;

  text-align: center;

  color: rgba(255, 255, 255, 0.35);

  font-size: 0.85rem;
  letter-spacing: 0.08em;
}

@keyframes lineReveal {

  from {
    transform: scaleX(0);
    opacity: 0;
  }

  to {
    transform: scaleX(1);
    opacity: 1;
  }

}

@media (max-width: 700px) {

  .eyebrow {
    letter-spacing: .14em;
    text-indent: .14em;
  }

  h1 {
    letter-spacing: .08em;
  }

  .disciplines {
    flex-direction: column;
    gap: 1rem;
  }

  .disciplines li::after {
    display: none;
  }

}