/* Brand display face, served from this site (no third-party font requests).
   SIL Open Font License: fonts/OFL.txt. */
@font-face {
  font-family: "Barlow Condensed";
  src: url("fonts/BarlowCondensed-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}
:root {
  --bg: #0a0e0c; --surface: #141914; --pine: #1b2a20; --line: #232b25;
  --fg: #f2f4f1; --muted: #a3afa6; --soft: #c4cec6;
  --accent: #86ad8f; --tan: #c9a774; --green: #4f7358;
}
@media (prefers-color-scheme: light) {
  :root {
    --bg: #f6f5f1; --surface: #ffffff; --pine: #e3ece4; --line: #e0e3dc;
    --fg: #14180f; --muted: #59625c; --soft: #3d4640;
    --accent: #3e5e47; --tan: #7a5f38; --green: #4f7358;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg);
  font: 17px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
a { color: var(--accent); }
.display { font-family: "Barlow Condensed", "Arial Narrow", sans-serif; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.03em; line-height: 0.95; }

/* Header and footer, on every page */
.bar { max-width: 1120px; margin: 0 auto; padding: 20px 24px; display: flex;
  flex-wrap: wrap; align-items: center; gap: 10px 22px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--fg);
  text-decoration: none; margin-right: auto; }
.brand img { width: 34px; height: 34px; border-radius: 8px; }
.brand span { font-size: 27px; letter-spacing: 0.06em; }
.bar a:not(.brand) { font-size: 15px; text-decoration: none; }
footer { border-top: 1px solid var(--line); margin-top: 48px; }
footer .bar { font-size: 14px; color: var(--muted); }

/* Documents (privacy, terms) */
main.doc { max-width: 720px; margin: 0 auto; padding: 16px 24px 32px; }
main.doc h1 { font-size: 46px; margin: 8px 0 4px; }
main.doc h2 { font-size: 20px; margin: 32px 0 8px; }
p.updated, .muted { color: var(--muted); }
li { margin: 4px 0; }

/* Landing page */
.hero { max-width: 1120px; margin: 0 auto; padding: 40px 24px 56px; display: flex;
  flex-wrap: wrap; align-items: center; gap: 40px; }
.hero .copy { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.eyebrow { font-size: 14px; font-weight: 700; letter-spacing: 0.08em; color: var(--tan); }
.hero h1 { margin: 0; font-size: clamp(56px, 9vw, 104px); }
.hero p.lead { margin: 0; font-size: 20px; color: var(--soft); max-width: 34rem; }
.soon { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start;
  padding: 10px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface);
  font-weight: 600; }
.soon small { color: var(--muted); font-weight: 400; }
.hero .art { flex: 1 1 280px; display: flex; justify-content: center; }
.hero .art img { width: min(320px, 70vw); height: auto; }
.features { max-width: 1120px; margin: 0 auto; padding: 0 24px; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.card { padding: 24px; border-radius: 22px; background: var(--surface); border: 1px solid var(--line); }
.card h2 { margin: 0 0 10px; font-size: 30px; }
.card p { margin: 0; color: var(--soft); }