:root {
  color-scheme: dark;
  --ink: #f3f0e8;
  --muted: #a9aa9c;
  --accent: #c4e36a;
  --background: #121611;
}

* { box-sizing: border-box; }

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

body {
  margin: 0;
  background: radial-gradient(circle at 82% 18%, #283023 0, transparent 25rem), var(--background);
  color: var(--ink);
  font-family: Manrope, system-ui, sans-serif;
}

main {
  min-height: 100vh;
  padding: 2rem clamp(1.5rem, 6vw, 6rem);
  display: flex;
  flex-direction: column;
}

.wordmark {
  color: var(--ink);
  font-family: "DM Mono", monospace;
  font-size: 0.9rem;
  font-weight: 500;
  letter-spacing: 0.17em;
  text-decoration: none;
}

.wordmark span { color: var(--accent); }

.hero { margin: auto 0; max-width: 45rem; }

.eyebrow {
  color: var(--accent);
  font-family: "DM Mono", monospace;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  margin: 0 0 1.25rem;
  text-transform: uppercase;
}

h1 {
  font-size: clamp(3.5rem, 10vw, 8rem);
  font-weight: 500;
  letter-spacing: -0.075em;
  line-height: 0.94;
  margin: 0;
}

.intro {
  color: var(--muted);
  font-size: clamp(1rem, 1.7vw, 1.25rem);
  line-height: 1.7;
  margin: 2.25rem 0 0;
  max-width: 39rem;
}

.footer {
  color: var(--muted);
  font-family: "DM Mono", monospace;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  margin: 0;
}

@media (max-width: 480px) {
  main { padding: 1.5rem; }
  .hero { margin: auto 0; }
}