/* ============================================================
   faith.css — rules from styles.css used by one page, /faith.
   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).
   ============================================================ */

/* ───────────────── CATHOLIC TIMELINE PROMO ───────────────── */
.timeline-promo{
  position:relative;display:grid;grid-template-columns:90px 1fr auto;gap:24px;align-items:center;
  margin:0 0 42px;padding:28px 30px;overflow:hidden;
  background:#26170f;border:1px solid rgba(201,168,90,.55);color:#f6ead3;
  box-shadow:8px 9px 0 rgba(111,33,29,.09);transition:transform .25s,box-shadow .25s,border-color .25s;
}
.timeline-promo::after{
  position:absolute;right:-56px;bottom:-82px;width:190px;height:190px;
  border:1px solid rgba(217,189,120,.12);border-radius:50%;content:"";
  box-shadow:0 0 0 32px rgba(217,189,120,.025),0 0 0 64px rgba(217,189,120,.018);
}
.timeline-promo-mark{position:relative;z-index:1;display:flex;align-items:center;gap:9px;color:#d9bd78;font-family:var(--head);font-size:24px;font-style:italic;}
.timeline-promo-mark i{width:28px;height:1px;background:rgba(217,189,120,.5);}
.timeline-promo-copy{position:relative;z-index:1;display:flex;flex-direction:column;gap:5px;}
.timeline-promo-copy small{color:#d9bd78;font-family:var(--display);font-size:8px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;}
.timeline-promo-copy strong{color:#fff3dc;font-family:var(--head);font-size:29px;font-weight:600;line-height:1.05;}
.timeline-promo-copy>span{max-width:630px;color:#d1c1aa;font-family:var(--body);font-size:16px;line-height:1.45;}
.timeline-promo>b{position:relative;z-index:1;color:#ead7b4;font-family:var(--display);font-size:9px;font-weight:500;letter-spacing:.14em;line-height:1.6;text-align:right;text-transform:uppercase;white-space:nowrap;}
.timeline-promo>b em{display:inline-block;margin-left:5px;color:#d9bd78;font-size:16px;font-style:normal;transition:transform .25s;}.timeline-promo:hover>b em{transform:translateX(4px);}
@media(max-width:680px){
  .timeline-promo{grid-template-columns:1fr;padding:25px 24px;gap:14px}.timeline-promo-mark{font-size:19px}.timeline-promo-copy strong{font-size:26px}.timeline-promo>b{text-align:left}.timeline-promo>b br{display:none}
}