:root{
  --paper:#EFE6D6;
  --ink:#241E18;
  --accent:#7A3E2E;
  --rule:rgba(36,30,24,.18);
  --measure:64ch;
}

*{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Georgia,'Times New Roman',serif;
  font-size:19px;
  line-height:1.78;
  text-rendering:optimizeLegibility;
}

.measure{
  width:100%;
  max-width:var(--measure);
  margin:0 auto;
  padding:0 22px;
}

a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(122,62,46,.45)}
a:hover{border-bottom-color:var(--accent)}

strong{font-weight:700}

/* ---------- top bar ---------- */
.topbar{
  border-bottom:1px solid var(--rule);
  background:var(--paper);
  position:relative;
}
.topbar__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding-top:16px;
  padding-bottom:16px;
  flex-wrap:wrap;
}
.wordmark{
  display:inline-flex;
  align-items:center;
  gap:9px;
  border-bottom:0;
  color:var(--ink);
}
.wordmark__glyph{display:inline-flex;color:var(--accent)}
.wordmark__text{
  font-family:Georgia,'Times New Roman',serif;
  font-size:1.26rem;
  letter-spacing:.05em;
}
.nav{
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  display:flex;
  gap:18px;
}
.nav a{
  color:var(--ink);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
}
.nav a:hover,.nav a.is-active{
  color:var(--accent);
  border-bottom-color:var(--accent);
}

/* ---------- hero / objection ---------- */
.hero{padding:58px 0 10px}
.kicker{
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.74rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--accent);
  margin:0 0 20px;
}
h1{
  font-weight:400;
  font-size:clamp(1.85rem,5.4vw,2.7rem);
  line-height:1.2;
  margin:0 0 18px;
  letter-spacing:-.01em;
}
.meta{
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.82rem;
  letter-spacing:.06em;
  color:rgba(36,30,24,.72);
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding:9px 0;
  margin:0 0 30px;
}
.lead{
  font-size:1.22rem;
  line-height:1.62;
  margin:0 0 24px;
}

p{margin:0 0 20px}

/* ---------- prose chapters ---------- */
.prose{padding:26px 0 10px}
h2{
  font-weight:400;
  font-size:clamp(1.35rem,3.6vw,1.72rem);
  line-height:1.3;
  margin:52px 0 16px;
  padding-top:22px;
  border-top:1px solid var(--rule);
}
.chapter-num{
  display:block;
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.7rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:9px;
}

.pull{
  margin:40px 0;
  padding:22px 0 22px 22px;
  border-left:3px solid var(--accent);
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
}
.pull p{
  margin:0;
  font-size:1.18rem;
  line-height:1.55;
  font-style:italic;
}

/* ---------- contact ---------- */
.contact{padding:10px 0 60px}
.address{
  font-size:1.05rem;
  line-height:1.6;
}
.social{
  list-style:none;
  margin:26px 0 28px;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.fineprint{
  font-family:'Source Sans 3',Arial,sans-serif;
  font-size:.78rem;
  letter-spacing:.04em;
  color:rgba(36,30,24,.72);
  border-top:1px solid var(--rule);
  padding-top:16px;
  margin-top:34px;
}

@media (max-width:520px){
  body{font-size:18px}
  .hero{padding-top:40px}
  .topbar__inner{align-items:flex-start}
  .nav{gap:14px;font-size:.74rem}
}

@media (min-width:1000px){
  :root{--measure:66ch}
}
