/**
 * @file
 * Typography.
 *
 * FiveNineteen shipped 40-odd self hosted font files (Lato, Montserrat, Open
 * Sans, Quattrocento, Roboto, Roboto Slab, Noto Sans, an icon font) and used
 * two of them. This keeps the two that were actually used and falls back to the
 * system stack, so the theme ships no font binaries at all.
 */

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-block: 0 var(--space-2xs);
  color: var(--text-strong);
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.6;
  text-wrap: balance;
}

h1 { font-size: var(--step-4); }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }
h5,
h6 { font-size: var(--step-0); }

p,
ul,
ol,
dl,
blockquote {
  margin-block: 0 var(--space-s);
}

.text-content {
  max-inline-size: 100%;
}

.text-content > * + * {
  margin-block-start: var(--space-s);
}

.text-content p {
  text-wrap: pretty;
}

blockquote {
  margin-inline: 0;
  padding: var(--space-2xs) var(--space-s);
  border-inline-start: 4px solid var(--border-strong);
  color: var(--text-muted);
  font-style: italic;
}

/* The quote filter's [quote] output. */
.quote-msg {
  margin-block: var(--space-s);
  padding: var(--space-xs) var(--space-s);
  border-inline-start: 4px solid var(--accent);
  background: var(--surface-sunken);
  border-radius: 0 var(--radius) var(--radius) 0;
}

.quote-author {
  display: block;
  margin-block-end: var(--space-3xs);
  color: var(--text-muted);
  font-size: var(--step--1);
  font-weight: 700;
}

code,
pre,
kbd {
  font-family: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, monospace;
  font-size: 0.9em;
}

pre {
  padding: var(--space-s);
  background: var(--surface-sunken);
  border-radius: var(--radius);
}

.submitted,
.field--name-created,
.comment__meta {
  color: var(--text-muted);
  font-size: var(--step--1);
}
