/* ==========================================================================
   mission.css — "Tattooing for Christ" mission section (section CSS, index only).
   Ported from the preview's §8 MISSION. The still, reverent counterpoint to the
   ceremony + gallery — restraint is the point; motion stays minimal here.
   NO global redefs — .eyebrow/.btn/.section-head live in base.css, .reveal in
   reveal.css.
   ========================================================================== */

#mission {
  padding-block: clamp(4.5rem, 9vw, 9rem);
  position: relative;
  text-align: center;
}
#mission .wrap {
  max-width: 780px;
}

/* the still moment — her scripture (Psalm 23:4, KJV) */
.psalm {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: var(--step-2);
  line-height: 1.4;
  color: var(--bone);
  margin: 1.6rem auto 0.8rem;
  max-width: 22ch;
}
.psalm-cite {
  font-size: var(--step--1);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--grace);
}

/* thin vertical gold rule under the citation */
.mission-rule {
  width: 1px;
  height: 56px;
  margin: 0 auto 1.4rem;
  background: linear-gradient(var(--grace), transparent);
}

.mission-body {
  margin: 2rem auto 2rem;
  color: var(--bone-dim);
  font-size: var(--step-1);
  font-family: var(--font-display);
  font-weight: 300;
  max-width: 52ch;
}

/* the concrete proof — what the barter actually takes */
.barter {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  margin-top: 1.4rem;
}
.chip {
  font-size: var(--step--1);
  letter-spacing: 0.08em;
  padding: 0.45rem 0.95rem;
  border: 1px solid var(--veil);
  border-radius: var(--radius-pill);
  color: var(--bone-dim);
}

/* contextual link out to the full /about/ story */
.mission-more {
  margin-top: 1.6rem;
  font-size: var(--step--1);
  letter-spacing: 0.02em;
}
.mission-more a {
  color: var(--grace);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.mission-more a:hover {
  color: var(--grace-hi);
}