/* Reading areas reserve paper locally; the ink continues around their edges. */
/* Tall backdrops may extend sideways, but cannot paint over an adjacent chapter. */
.layered-scene { clip-path: inset(0 -100vw); }

.hero-copy,
.story-copy,
.community-copy,
.history .chapter-heading,
.faith .section-intro > h2,
.faith .section-intro > p {
  position: relative;
  isolation: isolate;
}

.hero-copy::before,
.story-copy::before,
.community-copy::before,
.history .chapter-heading::before,
.faith .section-intro > h2::before,
.faith .section-intro > p::before {
  content: "";
  position: absolute;
  inset: -22px -24px;
  z-index: -1;
  pointer-events: none;
  background: #f4eee2;
  -webkit-mask-image:
    linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent),
    linear-gradient(180deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 18px), transparent),
    linear-gradient(180deg, transparent, #000 18px, #000 calc(100% - 18px), transparent);
  mask-composite: intersect;
}

.hero-copy::before {
  inset: -26px -16px -24px -28px;
}

.faith .section-intro > h2::before,
.faith .section-intro > p::before {
  background: #29312e;
}

.hero-description,
.story-copy > p:not(.lead),
.community-intro p:not(.lead),
.community-stories p,
.faith-copy > p {
  color: #3e423c;
  font-size: 16px;
  line-height: 1.95;
}

.hero-kicker { font-size: 14px; }
.hero-location { font-size: 12px; color: #4c5047; }
.small-title { font-size: 13px; }
.hero-button, .text-link { font-size: 14px; }

.section-label {
  width: max-content;
  max-width: 100%;
  padding: 5px 10px 5px 4px;
  margin-left: -4px;
  background: #f4eee2;
  color: #4c5047;
  font-size: 14px;
}
.faith .section-label { background: #29312e; color: #e6ddcb; }
.visit .section-label { background: #78352b; color: #f4eee2; }

.archival-photo figcaption {
  position: relative;
  padding: 9px 11px;
  background: #f4eee2;
  color: #4c5047;
  font-size: 13px;
  border-bottom: 1px solid var(--line);
}
.faith-figure figcaption {
  background: #242b28;
  color: #e6ddcb;
  border-bottom-color: #5e6357;
}

.hero-route {
  padding: 16px 20px;
  background: #f4eee2;
  border-bottom: 1px solid var(--line);
}
.hero-route a { font-size: 14px; line-height: 1.65; }
.hero-route span { flex-shrink: 0; }
.hero-route .route-label,
.hero-route .route-label span { font: inherit; color: inherit; }
.hero-route .route-label { min-width: 0; flex-shrink: 1; }
.hero-route .route-tail { white-space: nowrap; }

.community-stories {
  padding: 0 20px;
  background: #f4eee2;
}
.community-stories time { color: #4c5047; font-size: 13px; }
.community-stories .text-link { font-size: 14px; }

.section-intro > p { font-size: 16px; }
.faith .section-intro > p { color: #e6ddcb; }
.faith-tabs button { font-size: 14px; }
.faith-copy dl { font-size: 14px; }
.visit-intro { font-size: 16px; }

@media (max-width: 760px) {
  .hero-copy::before { inset: -20px -18px -20px -18px; }
  .hero-kicker { font-size: 13px; }
  .hero-description { font-size: 16px; line-height: 1.85; }
  .hero-description br:nth-child(2) { display: initial; }
  .story-copy::before { inset: -20px -18px -20px -18px; }
  .community-copy::before { inset: -20px -18px -20px -18px; }
  .small-title { font-size: 12px; }
  .section-label { font-size: 13px; }
  .archival-photo figcaption { font-size: 12px; padding: 8px 9px; }
  .hero-route { padding: 13px 10px; gap: 6px; }
  .hero-route a {
    padding-left: 9px;
    gap: 6px;
    font-size: 13px;
    line-height: 1.65;
    white-space: normal;
  }
  .hero-route a:first-child { padding-left: 0; }
  .hero-route span { font-size: 18px; }
  .hero-route .route-dot { display: none; }
  .hero-route .route-tail { display: block; }
  .hero-visual { z-index: 4; }
  .community-stories { padding: 0 14px; }
  .faith-tabs button { font-size: 14px; }
  .faith-tabs button:last-child { grid-column: span 2; }
}