/* ============================================================
   AION — Landing Page
   Tokens match the investor deck identity exactly.
   ============================================================ */

:root {
  --void:      #111110;
  --parchment: #F7F4EE;
  --stone:     #8A8782;
  --verdigris: #4D7C74;
}

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

html, body {
  width: 100%;
  height: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  background: var(--void);
  display: flex;
  align-items: center;
  justify-content: center;
}

main {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  user-select: none;
}

/* ── Mark ──────────────────────────────────────────────────── */

.mark {
  font-family: Optima, "Optima Regular", "Palatino Linotype", Palatino, Georgia, serif;
  font-weight: 400;
  font-size: clamp(52px, 8.2vw, 140px);
  letter-spacing: 0.45em;
  padding-left: 0.45em; /* optical compensation for trailing spacing */
  color: var(--parchment);
  margin-bottom: clamp(24px, 3.9vw, 64px);
  line-height: 1;
}

/* ── Tagline ────────────────────────────────────────────────── */

.tagline {
  font-family: Optima, "Optima Regular", "Palatino Linotype", Palatino, Georgia, serif;
  font-weight: 400;
  font-size: clamp(13px, 2.15vw, 36px);
  letter-spacing: 0.04em;
  color: var(--parchment);
  line-height: 1.4;
}