@font-face {
  font-family: "Source Serif 4";
  src: url("/fonts/source-serif-4/source-serif-4-latin-wght400-600.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Cinzel";
  src: url("/fonts/cinzel/cinzel-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Code Pro";
  src: url("/fonts/source-code-pro/source-code-pro-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #f8f7f4;
  --fg: #1d1b18;
  --muted: #5d584f;
  --rule: #d9d4ca;
  --link: #2f6b5f;
  --link-hover: #1f4a42;
  --glyph: #7fbfae;
  --measure: 38rem;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --inscribed: "Cinzel", "Trajan Pro", Georgia, serif;
  --mono: "Source Code Pro", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #161513;
    --fg: #ece8e1;
    --muted: #a9a398;
    --rule: #3a3731;
    --link: #7fbfae;
    --link-hover: #a6d4c7;
    --glyph: #2f6b5f;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 1.0625rem/1.6 var(--serif);
}
main { max-width: var(--measure); margin: 0 auto; padding: 4rem 1rem 0; }
a { color: var(--link); }
a:hover { color: var(--link-hover); }

/* Marks: tablets in the text colour, the inscribed lines cut through to the ground. */
.ink { fill: var(--fg); }
.cut { fill: var(--bg); }
.glyph { fill: var(--glyph); }
.glyph-section { font: 24px var(--serif); }
.glyph-initial { font: 500 20px var(--inscribed); }

.masthead { display: flex; align-items: center; gap: 1rem; margin: 0 0 2rem; }
.masthead svg { display: block; flex: none; width: 3.125rem; height: auto; }
h1 { margin: 0; font-size: 2.5rem; font-weight: 400; line-height: 1.05; letter-spacing: -0.01em; }
.inscription {
  display: block;
  margin-top: 0.5rem;
  font: 500 0.875rem/1.2 var(--inscribed);
  letter-spacing: 0.32em;
  color: var(--muted);
}

h2 {
  margin: 2.75rem 0 0.75rem;
  font: 400 0.8125rem/1.4 var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted);
}
dl { margin: 0; }
dt { margin-top: 1.25rem; font-weight: 600; }
dt a { display: inline-flex; align-items: center; gap: 0.625rem; }
dt svg { display: block; flex: none; }
dd { margin: 0.25rem 0 0; padding-left: 1.875rem; color: var(--muted); }
.cp-footer { --cp-footer-width: var(--measure); }