/* Spendrobe "launching soon" page: the game's editorial look (off-white, ink, one magenta accent, high-contrast serif). */
:root {
  --bg: #fbf8f4;
  --card: #fffdf9;
  --ink: #141414;
  --soft: #6d6660;
  --line: #e6ddd3;
  --accent: #a3285f;
  --shadow: 0 10px 30px -18px rgba(20, 20, 20, 0.35);
  --serif: Didot, 'Bodoni 72', 'Bodoni MT', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #121012; --card: #1b181a; --ink: #f3ece6; --soft: #b4aaa3; --line: #353033; --accent: #e57aa8; --shadow: 0 10px 30px -18px rgba(0, 0, 0, 0.8); color-scheme: dark; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 17px/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-underline-offset: 3px; }
.top, .hero, .prose, .foot { max-width: 60rem; margin: 0 auto; padding: 0 16px; }
.top { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-top: 1.5rem; padding-bottom: 0.9rem; border-bottom: 1px solid var(--ink); }
.wordmark { font: 400 2rem/1 var(--serif); color: var(--ink); text-decoration: none; }
.eyebrow { font: 600 0.72rem/1.2 var(--sans); letter-spacing: 0.18em; text-transform: uppercase; color: var(--soft); }
.hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 2.5rem; align-items: center; padding-top: 3rem; padding-bottom: 3rem; }
h1 { font: 400 clamp(2.2rem, 6vw, 3.6rem)/1.05 var(--serif); margin: 0 0 1.25rem; letter-spacing: -0.01em; }
.lead { font-size: 1.1rem; color: var(--ink); max-width: 36rem; }
.contact { margin-top: 1.5rem; color: var(--soft); }
.stage { margin: 0; border-radius: 1.25rem; overflow: hidden; box-shadow: var(--shadow); background: var(--card); }
.stage svg { display: block; width: 100%; height: auto; }
@media (max-width: 44rem) {
  .hero { grid-template-columns: 1fr; padding-top: 2rem; }
  .stage { width: min(13rem, 60vw); margin: 0 auto; order: -1; }
}
.prose { padding-top: 2rem; padding-bottom: 2rem; }
.prose h1 { font-size: 2.4rem; }
.prose h2 { font: 400 1.35rem/1.3 var(--serif); margin: 1.75rem 0 0.4rem; }
.muted { color: var(--soft); font-size: 0.9rem; }
.foot { border-top: 1px solid var(--line); padding-top: 1.5rem; padding-bottom: 2.5rem; color: var(--soft); font-size: 0.85rem; }
.foot p { margin: 0.4rem 0; max-width: 46rem; }