/* thefoundself.com - squarespace-five-2013 adaptation
   layout family: tfs-white-sheet-doublerule-essay-stream-with-topic-count-rail-2013 */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #F5F5F4;
  color: #222222;
  font: 16px/1.65 "Helvetica Neue", Helvetica, Arial, sans-serif;
}
img, svg { max-width: 100%; }
a { color: #35507A; text-decoration: underline; text-underline-offset: 2px; }
a:hover { color: #223552; }
a:focus-visible, button:focus-visible { outline: 2px solid #35507A; outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) { a { transition: color 120ms linear; } }

.skip {
  position: absolute; left: -9999px; top: 0; background: #fff; color: #35507A;
  padding: 8px 12px; z-index: 20; border: 1px solid #DDDDDD;
}
.skip:focus { left: 8px; top: 8px; }

.sheet {
  max-width: 1040px; margin: 0 auto; background: #FFFFFF;
  border-left: 1px solid #EDEDEB; border-right: 1px solid #EDEDEB;
}

/* ---- module 1: centered identity header ---- */
.identity { padding: 44px 32px 26px; text-align: center; }
.wordmark {
  font: normal 38px/1.15 Georgia, "Times New Roman", serif;
  letter-spacing: .02em; margin: 0; color: #222222;
}
.wordmark a { color: inherit; text-decoration: none; }
.wordmark a:hover { color: #35507A; }
.lockup-rule { width: 132px; height: 1px; background: #222222; margin: 14px auto 12px; }
.tagline {
  margin: 0; font-size: 13px; color: #6E6E6B; letter-spacing: .02em;
}

/* ---- module 2: horizontal ruled page menu ---- */
.menu {
  border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD;
  padding: 0 32px; display: flex; align-items: center; justify-content: center;
  position: relative; min-height: 42px;
}
.menu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 28px; flex-wrap: wrap; justify-content: center; }
.menu a {
  display: inline-block; padding: 13px 0; font-size: 12px; letter-spacing: .09em;
  text-transform: uppercase; text-decoration: none; color: #222222;
  font-family: Arial, Helvetica, sans-serif;
}
.menu a:hover { color: #35507A; }
.menu a[aria-current="page"] { color: #35507A; }
.utility { position: absolute; right: 32px; top: 50%; transform: translateY(-50%); }
.utility ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 14px; }
.utility a { display: inline-flex; align-items: center; color: #35507A; text-decoration: none; }
.utility svg { width: 16px; height: 16px; display: block; fill: currentColor; }
.u-label {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* ---- body split ---- */
.body-split {
  display: grid; grid-template-columns: minmax(0, 1fr) 260px;
  gap: 48px; padding: 34px 32px 40px; align-items: start;
}
.stream { min-width: 0; }
.rail { min-width: 0; border-left: 1px solid #EDEDEB; padding-left: 24px; }

/* ---- entries + the paired rule stamp motif ---- */
.entry { padding-top: 26px; border-top: 1px solid #DDDDDD; margin-bottom: 34px; }
.entry:first-child { border-top: 0; padding-top: 0; }
.entry-title {
  font: normal 22px/1.3 Georgia, "Times New Roman", serif; margin: 0 0 6px;
  position: relative; padding-top: 14px;
}
.entry-title::before {
  content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 2px; background: #222222;
}
.entry-title a { color: #222222; text-decoration: none; }
.entry-title a:hover { color: #35507A; text-decoration: underline; }
.lead .entry-title { font-size: 28px; }
.meta {
  font-size: 12px; color: #6E6E6B; margin: 0 0 14px;
  font-family: Arial, Helvetica, sans-serif;
}
.meta a { color: #6E6E6B; }
.entry p { max-width: 66ch; }
.more { font-size: 13px; font-family: Arial, Helvetica, sans-serif; }
.stream-foot { font-size: 13px; font-family: Arial, Helvetica, sans-serif; padding-top: 4px; }

/* ---- article body ---- */
.article-body { font-size: 17px; }
.article-body p, .article-body li { max-width: 66ch; }
.article-body h2 {
  font: normal 20px/1.35 Georgia, "Times New Roman", serif;
  margin: 30px 0 10px;
}
.article-body blockquote {
  margin: 24px 0; padding: 2px 0 2px 20px; border-left: 2px solid #DDDDDD;
  font: italic 17px/1.6 Georgia, "Times New Roman", serif; color: #3A3A38;
}
.article-body blockquote p { margin: 0; max-width: 60ch; }
.article-body ul, .article-body ol { padding-left: 22px; }
.article-body li { margin-bottom: 8px; }

.page-title {
  font: normal 30px/1.25 Georgia, "Times New Roman", serif; margin: 0 0 6px;
  position: relative; padding-top: 14px;
}
.page-title::before {
  content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 2px; background: #222222;
}
.standfirst { color: #4A4A47; max-width: 66ch; margin: 0 0 26px; }

/* ---- index list ---- */
.index-list { list-style: none; margin: 0; padding: 0; }
.index-list > li { padding: 20px 0; border-bottom: 1px solid #DDDDDD; }
.index-list > li:first-child { padding-top: 4px; }
.index-title {
  font: normal 22px/1.3 Georgia, "Times New Roman", serif; margin: 0 0 4px;
  position: relative; padding-top: 12px;
}
.index-title::before {
  content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 2px; background: #222222;
}
.index-title a { color: #222222; text-decoration: none; }
.index-title a:hover { color: #35507A; text-decoration: underline; }
.index-list p { margin: 6px 0 0; max-width: 66ch; }

.topic-block { padding: 22px 0; border-bottom: 1px solid #DDDDDD; }
.topic-block h2 {
  font: normal 22px/1.3 Georgia, "Times New Roman", serif; margin: 0 0 6px;
  position: relative; padding-top: 12px;
}
.topic-block h2::before {
  content: ""; position: absolute; top: 0; left: 0; width: 44px; height: 2px; background: #222222;
}
.topic-block ul { margin: 10px 0 0; padding-left: 20px; }
.topic-block li { margin-bottom: 6px; }
.topic-block .count {
  font-size: 12px; color: #6E6E6B; font-family: Arial, Helvetica, sans-serif;
}

/* ---- prev/next ---- */
.prevnext {
  display: grid; grid-template-columns: 1fr 1fr; gap: 28px;
  border-top: 1px solid #DDDDDD; padding-top: 20px; margin-top: 36px;
}
.prevnext .dir {
  display: block; font-size: 11px; letter-spacing: .09em; text-transform: uppercase;
  color: #6E6E6B; font-family: Arial, Helvetica, sans-serif; margin-bottom: 4px;
}
.prevnext a { font: normal 16px/1.35 Georgia, "Times New Roman", serif; }
.prevnext .next { text-align: right; }
.return {
  font-size: 13px; font-family: Arial, Helvetica, sans-serif; margin-top: 22px;
  border-top: 1px solid #EDEDEB; padding-top: 16px;
}

/* ---- module 5: sidebar widget rail ---- */
.widget { margin-bottom: 30px; }
.widget h2 {
  font: normal 11px/1.4 Arial, Helvetica, sans-serif; letter-spacing: .1em;
  text-transform: uppercase; color: #222222; margin: 0 0 8px;
  border-bottom: 1px solid #DDDDDD; padding-bottom: 6px;
}
.widget ul { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.widget li { padding: 5px 0; border-bottom: 1px solid #F1F1EF; display: flex; justify-content: space-between; gap: 10px; }
.widget li:last-child { border-bottom: 0; }
.widget .count { color: #6E6E6B; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
.widget p { font-size: 14px; color: #4A4A47; margin: 0 0 10px; }
.widget-archive li { display: block; font: normal 14px/1.35 Georgia, "Times New Roman", serif; padding: 7px 0; }
.widget-archive p { margin: 10px 0 0; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
.widget-util li { justify-content: flex-start; align-items: center; gap: 8px; }
.widget-util svg { width: 14px; height: 14px; fill: #35507A; flex: 0 0 auto; }

/* ---- module 6: footer blocks ---- */
.footer-blocks {
  border-top: 1px solid #DDDDDD; padding: 26px 32px 22px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
}
.footer-blocks h2 {
  font: normal 11px/1.4 Arial, Helvetica, sans-serif; letter-spacing: .1em;
  text-transform: uppercase; margin: 0 0 8px; color: #222222;
}
.footer-blocks ul { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.footer-blocks li { padding: 4px 0; }
.footer-blocks .d { color: #6E6E6B; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }

/* ---- module 7: copyright and social line ---- */
.colophon {
  border-top: 1px solid #DDDDDD; padding: 14px 32px 30px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  font-size: 12px; color: #6E6E6B; font-family: Arial, Helvetica, sans-serif;
}
.colophon ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 14px; }
.colophon svg { width: 14px; height: 14px; fill: #35507A; display: block; }
.colophon a { display: inline-flex; }

/* ---- responsive ---- */
@media (max-width: 1080px) {
  .sheet { max-width: none; border-left: 0; border-right: 0; }
}
@media (max-width: 900px) {
  .body-split { grid-template-columns: minmax(0, 1fr) 220px; gap: 32px; }
  .rail { padding-left: 18px; }
}
@media (max-width: 760px) {
  .identity { padding: 26px 16px 18px; }
  .wordmark { font-size: 26px; }
  .lockup-rule { width: 96px; margin: 10px auto 9px; }
  .menu { flex-direction: column; padding: 8px 16px 10px; }
  .menu ul { gap: 8px 20px; }
  .menu a { padding: 4px 0; }
  .utility { position: static; transform: none; margin-top: 6px; }
  .utility ul { justify-content: center; }
  .body-split { grid-template-columns: minmax(0, 1fr); gap: 30px; padding: 24px 16px 30px; }
  .rail { border-left: 0; border-top: 1px solid #DDDDDD; padding-left: 0; padding-top: 22px; }
  .rail .widget ul { columns: 2; column-gap: 20px; }
  .rail .widget li { break-inside: avoid; }
  .rail .widget-util ul, .rail .widget-about ul, .rail .widget-archive ul { columns: 1; }
  .entry-title::before, .page-title::before, .index-title::before,
  .topic-block h2::before { width: 32px; }
  .lead .entry-title { font-size: 24px; }
  .page-title { font-size: 25px; }
  .article-body { font-size: 16px; }
  .prevnext { grid-template-columns: 1fr; gap: 18px; }
  .prevnext .next { text-align: left; }
  .footer-blocks { grid-template-columns: 1fr; gap: 22px; padding: 22px 16px 18px; }
  .colophon { flex-direction: column; align-items: center; text-align: center; padding: 14px 16px 26px; }
}