:root{
  --paper:#F7F8F6;
  --ink:#202020;
  --muted:#6f6f6c;
  --hair:#dcdedb;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Newsreader",Georgia,serif;
  font-size:19px;
  line-height:1.6;
}

/* page frame: title block sits left, body column indents right of it */
.page{max-width:860px;margin:0 auto;padding:0 24px}
.indent{margin-left:96px;max-width:530px}
@media (max-width:760px){.indent{margin-left:0;max-width:100%}}

/* top nav */
nav{padding:22px 0 0}
nav .page{display:flex;justify-content:space-between;align-items:baseline}
nav a{color:var(--ink);text-decoration:none}
nav .home{font-weight:500;font-size:1rem}
nav .links a{margin-left:22px;font-size:.8rem;color:var(--muted)}
nav .links a:hover{color:var(--ink)}

/* chapter header */
.series{
  margin-top:72px;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink);
}
.byline{
  font-size:1.32rem;
  font-weight:400;
  margin-top:40px;
  line-height:1.5;
}
h1{
  font-weight:700;
  font-size:2.45rem;
  line-height:1.05;
  margin:.2em 0 1.4em;
  max-width:620px;
}

h2{
  font-weight:700;
  font-size:1.32rem;
  line-height:1.25;
  margin:2.2em 0 .6em;
}
p{margin:0 0 1em}
a{color:var(--ink)}

blockquote{
  margin:1.4em 0 1.4em 1.4em;
  font-style:italic;
}
blockquote p{margin-bottom:.6em}

sup{font-size:.68em;line-height:0}
sup a{text-decoration:none;color:var(--muted)}
sup a:hover{color:var(--ink)}

.footnotes{
  margin-top:3.6em;
  padding-top:1.6em;
  border-top:1px solid var(--hair);
  font-size:.85rem;
  color:var(--muted);
}
.footnotes p{margin-bottom:.7em}
.footnotes .fnum{display:inline-block;min-width:1.4em}

.note{font-size:.85rem;color:var(--muted)}

/* entry list on the home page */
.entry-list{list-style:none;padding:0;margin:1.2em 0 0}
.entry-list li{border-top:1px solid var(--hair);padding:1.1em 0}
.entry-list .num{
  font-size:.68rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  display:block;margin-bottom:.3em;color:var(--muted);
}
.entry-list a{font-size:1.35rem;font-weight:700;text-decoration:none;line-height:1.25}
.entry-list a:hover{text-decoration:underline}

/* subscribe band */
.subscribe{
  margin:4.2em 0 0;
  padding:2.2em 0 2.4em;
  border-top:1px solid var(--hair);
}
.subscribe h2{margin-top:0}
.subscribe p{color:var(--muted);max-width:460px}
.btn{
  display:inline-block;
  background:var(--ink);
  color:var(--paper);
  text-decoration:none;
  padding:.7em 1.7em;
  font-size:.85rem;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.btn:hover{opacity:.85}

.chapter-nav{
  display:flex;justify-content:space-between;
  margin:3.6em 0 0;padding-top:1.3em;
  border-top:1px solid var(--hair);
  font-size:.88rem;
}
.chapter-nav a{text-decoration:none;color:var(--muted)}
.chapter-nav a:hover{color:var(--ink)}

footer{margin-top:4.5em;padding:2em 0 3.2em;font-size:.78rem;color:var(--muted)}
footer .page{border-top:1px solid var(--hair);padding-top:1.8em}

@media (max-width:520px){
  body{font-size:17px}
  h1{font-size:1.9rem}
}