/* ============================================================
   the-beatitudes.css — rules from styles.css used by one page, /the-beatitudes.
   They were moved here so that no other page downloads them; their
   order, and the comments that went with them, are as they were.
   Linked straight after styles.css (and any family sheet).
   ============================================================ */

/* Bloch's Sermon on the Mount: Christ sits right of centre with his hand
   raised, his face about a quarter of the way down the frame. The banner keeps
   the face and the hand; a phone's narrower crop moves right to stay on him
   rather than on the crowd at the left. */
.article-hero-beatitudes{
  --article-hero-position:center 24%;
  --article-hero-position-mobile:66% 28%;
}
/* The Beatitudes is a rule of life rather than a run of paragraphs: eight
   numbered sections, each a heading, its promise, what it means and a list of
   practices, then a two-column table. Scoped to this essay so no other
   essay's bare lists or tables change. */
.beatitudes-contents{
  margin:0 0 40px;padding:22px 26px;border:1px solid var(--rule);
  border-left:3px solid var(--gold);background:var(--paper-card);
}
.beatitudes-prose .beatitudes-contents-head{
  margin:0 0 12px;font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);text-align:left;
}
.beatitudes-contents ol{margin:0;padding-left:26px;font-family:var(--head);font-size:19px;line-height:1.45;}
.beatitudes-contents li{margin:0 0 4px;}
.beatitudes-contents li::marker{font-family:var(--display);font-size:13px;color:var(--gold-deep);}
.beatitudes-prose .beatitudes-contents-coda{margin:12px 0 0;font-family:var(--head);font-size:19px;font-style:italic;text-align:left;}
.beatitudes-contents a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px;}
.beatitudes-contents a:focus-visible{outline:2px solid var(--gold-deep);outline-offset:2px;border-radius:2px;}
.beatitudes-prose .beatitude{margin:0 0 8px;padding-top:6px;}
.beatitudes-prose .beatitude + .beatitude{border-top:1px solid var(--rule);margin-top:40px;}
.beatitudes-prose .beatitude h2{
  margin:34px 0 8px;font-family:var(--head);font-size:clamp(25px,3.4vw,32px);
  font-weight:600;letter-spacing:0;line-height:1.22;color:var(--ink);
}
.beatitudes-prose .beatitude-promise{
  margin:0 0 20px;font-family:var(--head);font-style:italic;font-size:20px;
  color:var(--gold-deep);text-align:center;
}
.beatitudes-prose .beatitude-promise::before,
.beatitudes-prose .beatitude-promise::after{content:"\2014";margin:0 .45em;color:var(--gold);}
.beatitudes-prose .beatitude-meaning{text-align:left;}
.beatitudes-prose .beatitude-meaning strong{color:var(--gold-deep);font-weight:500;}
.beatitudes-prose .beatitude h3{
  margin:22px 0 10px;font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);
}
.beatitude-practice{margin:0 0 .85em;padding-left:24px;}
.beatitude-practice li{margin:0 0 9px;padding-left:4px;line-height:1.6;}
.beatitude-practice li::marker{color:var(--gold);}
.beatitudes-table-wrap{margin:26px 0 8px;overflow-x:auto;}
.beatitudes-table{width:100%;border-collapse:collapse;font-size:18px;}
.beatitudes-table th{
  padding:10px 14px;font-family:var(--display);font-size:12px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);
  text-align:left;border-bottom:2px solid var(--rule);
}
.beatitudes-table td{padding:11px 14px;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.45;}
.beatitudes-table td:first-child{color:var(--muted);font-style:italic;}
.beatitudes-table td:last-child{font-family:var(--head);font-size:20px;font-weight:600;color:var(--ink);}
@media(max-width:640px){
  .beatitudes-contents{padding:18px 18px;}
  .beatitudes-contents ol,
  .beatitudes-prose .beatitudes-contents-coda{font-size:18px;}
  .beatitudes-table{font-size:16px;}
  .beatitudes-table th,.beatitudes-table td{padding:9px 8px;}
  .beatitudes-table td:last-child{font-size:18px;}
}