/* ============================================================
   FAITH PAGE - page-specific layer (shared tokens above)
   The live page's cream/gold buttons and its two emoji are gone:
   palette law is Forest / Mint / Mint Deep / Mint Tint / White /
   Cool Tint only, and every icon here is inline SVG.
   ============================================================ */
.sec{padding:76px 0}

.sec-tight{padding:60px 0}

.sec-head{margin-bottom:34px}

/* -- hero: light, no footage; a thin cross motif at low opacity */
.hero-page{min-height:min(46vh,440px);padding:80px 0 64px}

.hero-solo{max-width:56rem}

.hero-page h1{max-width:18ch;font-size:clamp(2.1rem,4.3vw,3.4rem)}

.hero-page .hero-sub{max-width:64ch;margin-bottom:0}

.hero-cross{position:absolute;top:50%;right:5%;width:min(300px,34vw);height:auto;
  transform:translateY(-50%);color:var(--emerald);opacity:.09;z-index:1;pointer-events:none}

/* on phones the motif stays fully inside the viewport - the hero clips
   with overflow:hidden, but nothing decorative should need the clip */
@media (max-width:900px){.hero-cross{right:3%;width:min(200px,30vw);opacity:.07}}

/* -- verse band (flat Forest; the closing band is a gradient so the
      two dark bands on this page are visibly different) --------- */
.verse{position:relative;overflow:hidden;background:var(--forest);color:#fff;padding:62px 0;
  text-align:center}

.verse blockquote{margin:0 auto;max-width:60ch}

.verse p{font-family:var(--sans);font-style:italic;font-size:clamp(1.2rem,2.4vw,1.62rem);
  line-height:1.55;color:#fff;margin:0 0 18px}

.verse cite{display:block;font-family:var(--serif);font-style:italic;font-weight:700;
  font-size:.9rem;letter-spacing:.06em;color:var(--mint)}

/* -- mission layout + the Proverbs tile ----------------------- */
.mission{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:start;margin-top:8px}

.mission > *{min-width:0}

.prose{max-width:64ch}

.prose p{color:var(--body)}

.tile{background:linear-gradient(180deg,var(--tint-soft) 0%,#dff7ec 100%);border:1px solid #a9e8cf;
  border-radius:var(--r);padding:30px 28px;box-shadow:0 2px 4px rgba(6,28,20,.05),0 20px 46px rgba(5,150,105,.13)}

/* scripture is quoted, never headlined - a verse in Title Case would be wrong */
.tile-q{font-family:var(--sans);font-style:italic;font-size:clamp(1.06rem,1.8vw,1.26rem);
  line-height:1.5;color:var(--emerald-ink);margin:0 0 12px}

.tile-ref{font-family:var(--serif);font-style:italic;font-weight:700;font-size:.86rem;
  letter-spacing:.05em;color:var(--forest);margin:0}

.tile-rule{height:1px;border:0;margin:20px 0;background:rgba(5,150,105,.28)}

.tile p:last-child{margin:0;font-size:.95rem;color:var(--body);line-height:1.66}

/* -- prayer (Cool Tint) --------------------------------------- */
.prayer{text-align:center}

.prayer .wrap > *{margin-inline:auto}

.prayer h2{max-width:18ch}

.prayer .lede{max-width:62ch;margin-bottom:30px}

.pray-mark{width:52px;height:52px;border-radius:15px;background:var(--tint);color:var(--emerald-ink);
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px}

.pray-mark svg{width:26px;height:26px}

/* the prayer line is a tappable sms: card, not a call button - WQS 11
   bans click-to-call buttons; this opens a text message, and it is the
   owner's own page furniture carried over from the live site */
.prayer-card{display:flex;align-items:center;gap:18px;max-width:440px;margin:0 auto;
  background:var(--white);border:1px solid var(--hairline-2);border-radius:var(--r);
  padding:20px 22px;box-shadow:var(--sh-1);text-align:left;color:var(--forest)}

.prayer-card:hover{color:var(--forest);border-color:var(--emerald)}

.pc-icon{width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:var(--tint);
  color:var(--emerald-ink);display:flex;align-items:center;justify-content:center}

.pc-icon svg{width:22px;height:22px}

.pc-body{flex:1 1 auto;min-width:0}

.pc-label{display:block;font-family:var(--sans);font-style:italic;font-size:.8rem;
  letter-spacing:.04em;color:var(--emerald-ink);margin-bottom:2px}

.pc-num{display:block;font-family:var(--serif);font-weight:700;font-size:1.2rem;
  color:var(--forest);line-height:1.2}

.pc-go{flex:0 0 auto;color:var(--emerald-ink);font-size:1.05rem;line-height:1}

.tmpl{max-width:560px;margin:24px auto 0;padding:20px 22px;text-align:left;
  background:var(--white);border:1px solid var(--hairline);border-radius:var(--r-sm)}

.tmpl-label{display:block;font-family:var(--sans);font-style:italic;font-size:.8rem;
  letter-spacing:.04em;color:var(--emerald-ink);margin-bottom:8px}

.tmpl p{margin:0;font-size:.95rem;line-height:1.6;color:var(--body)}

.prayer-note{max-width:58ch;margin:24px auto 0;font-size:.9rem;color:var(--muted);line-height:1.6}

/* -- seekers layout + the roadmap card ------------------------ */
.seekers{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:start;margin-top:8px}

.seekers > *{min-width:0}

.seek-cta{margin-top:28px}

.roadmap{background:linear-gradient(180deg,var(--white) 0%,#fafcfb 100%);border:1px solid var(--hairline);
  border-radius:var(--r);padding:28px 26px;box-shadow:var(--sh-1)}

.rm-head{display:flex;align-items:center;gap:14px;padding-bottom:18px;margin-bottom:4px;
  border-bottom:1px solid var(--hairline)}

.rm-mark{width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:var(--tint);
  color:var(--emerald-ink);display:flex;align-items:center;justify-content:center}

.rm-mark svg{width:23px;height:23px}

.rm-head h3{margin:0;font-size:1.08rem}

.rm-sub{margin:2px 0 0;font-size:.84rem;color:var(--muted);line-height:1.4}

.rm-list{list-style:none;padding:0;margin:0}

.rm-list li{display:flex;gap:15px;align-items:flex-start;padding:16px 0;
  border-bottom:1px solid var(--hairline)}

.rm-list li:last-child{border-bottom:0;padding-bottom:0}

.rm-n{flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:var(--white);
  border:1px solid var(--hairline-2);color:var(--emerald-ink);font-family:var(--serif);
  font-weight:700;font-size:.86rem;display:flex;align-items:center;justify-content:center}

.rm-t{font-size:.93rem;line-height:1.6;color:var(--muted);margin:0}

.rm-t strong{display:block;color:var(--forest);font-weight:600;margin-bottom:2px}

/* -- closing band (deep-green gradient) ----------------------- */
.blessing{position:relative;overflow:hidden;color:#fff;padding:84px 0;text-align:center;
  background:linear-gradient(160deg,#061c14 0%,#0b3b27 56%,#061c14 100%)}

.blessing h2{color:#fff;max-width:20ch;margin-inline:auto}

.blessing h2 em{color:var(--mint)}

.blessing p{color:#c6ded3;max-width:58ch;margin-inline:auto;font-size:1.06rem}

/* -- responsive ------------------------------------------------ */
@media (max-width:900px){
  .mission,.seekers{grid-template-columns:1fr;gap:34px}
}

@media (max-width:860px){
  .hero-page{padding:62px 0 50px;min-height:0}
  .sec{padding:64px 0}
  .verse{padding:52px 0}
  .blessing{padding:66px 0}
}

@media (max-width:560px){
  .prayer-card{gap:14px;padding:18px 16px}
  .pc-num{font-size:1.08rem}
  .blessing .ctarow .btn{width:100%}
  .seek-cta .btn{width:100%}
}