/* Optional webfonts for Vignettes. Link AFTER style.css:
     <link rel="stylesheet" href="style.css">
     <link rel="stylesheet" href="fonts.css">
   Remove the second line and you're back to the system serif stack.

   Literata : body text. Static Regular / Italic / Bold, Latin subset (~29KB each),
              subset from the full upstream fonts with ALL OpenType features kept,
              so real small caps (smcp/c2sc) and old-style figures still work.
              (The Fontsource subsets strip these features; don't swap them back in.)
   Fraunces : wordmark only, subset to the letters of "vignettes." (~4KB)
   Both are SIL OFL. */

@font-face {
  font-family: "Literata";
  src: url("fonts/literata-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Literata";
  src: url("fonts/literata-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Literata";
  src: url("fonts/literata-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces Wordmark";
  src: url("fonts/fraunces-wordmark.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --serif: "Literata", Charter, "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  --display: "Fraunces Wordmark", "Literata", Georgia, serif;
}

/* Literata runs a touch larger than Charter */
body { font-size: 1.125rem; }

.masthead h1 {
  font-size: 3rem;
  font-weight: 500;
  letter-spacing: 0;
}

/* The first-line small caps from style.css now use Literata's real smcp glyphs,
   so nothing to override here. */

@media (max-width: 30rem) {
  body { font-size: 1.02rem; }
  .masthead h1 {
    font-size: 2.4rem;
  }
}