@font-face {
  font-family: "Google Sans";
  src: url("assets/fonts/google-sans.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("assets/fonts/ibm-plex-mono.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
}
:root {
  --site-sans: "Google Sans", system-ui, sans-serif;
  --site-mono: "IBM Plex Mono", ui-monospace, monospace;
}
body, button, input, select, textarea,
h1, h2, h3, .hero h1 em, .prose, .prose h2, .prose figcaption {
  font-family: var(--site-sans);
}
.hero.hero-with-photo h1, .writing-wrap h1 {
  font-size: clamp(42px, 4.5vw, 64px);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -.05em;
}
.eyebrow, .tile-kicker, .case-meta, .fig-index,
.writing-wrap small, .writing-wrap .meta, .header nav span {
  font-family: var(--site-mono);
  font-weight: 500;
  letter-spacing: .04em;
}
.header nav a { font-weight: 500; }
.archive .intro, .article { padding: clamp(24px, 4vw, 58px); }