/* Finder pages only (body.ff-page on finder.html / finder-auth.html).
   Loaded solely from those two pages. Does not change other site pages. */

@font-face{font-family:Oxanium;src:url(/fonts/oxanium-latin-variable.woff2) format("woff2");font-style:normal;font-weight:200 800;font-display:swap}

/* 1) Every text element on these pages uses the self-hosted Oxanium face.
   Header logo remains an image. */
body.ff-page{
  --serif:Oxanium,Inter,system-ui,sans-serif;
  --sans:Oxanium,Inter,system-ui,sans-serif;
  --map-sans:Oxanium,Inter,system-ui,sans-serif;
  font-family:Oxanium,Inter,system-ui,sans-serif;
}
body.ff-page,
body.ff-page *{
  font-family:Oxanium,Inter,system-ui,sans-serif !important;
}
body.ff-page .foot .verse,
body.ff-page blockquote{
  font-family:Oxanium,Inter,system-ui,sans-serif !important;
}

/* 2) Shorter map (about 20% less tall). Disc stays fully visible and centred via flatmap computeFit. */
body.ff-page #map{
  height:min(64vh,608px);
  min-height:336px;
}

/* 4) Nudge the finder row a little lower for even spacing under the stats band. */
body.ff-page .finder{margin-top:12px}

/* 3) Desktop: left panel stretches to the bottom of the right column
   (map + key + guide boxes). Listings scroll inside the remaining space. */
@media(min-width:961px){
  /* Row height comes from .mapwrap (map + guide). Left panel must not grow the row.
     height:0 + min-height:100% makes #directory match the Map buttons bottom. */
  body.ff-page .finder{align-items:start}
  body.ff-page .finder .mapwrap{display:flex;flex-direction:column;min-width:0}
  body.ff-page .finder #map{
    height:min(64vh,608px);
    min-height:336px;
    flex:none;
    box-sizing:border-box;
  }
  body.ff-page .finder #directory{
    display:flex;
    flex-direction:column;
    height:0;
    min-height:100%;
    overflow:hidden;
    box-sizing:border-box;
    align-self:stretch;
  }
  body.ff-page .finder #list{
    flex:1 1 auto;
    min-height:160px;
    max-height:none;
    overflow:auto;
  }
}

/* Phone / stacked: proportionally shorter than square; widths stay aligned. */
@media(max-width:960px){
  body.ff-page .finder{margin-top:8px}
  body.ff-page #map{
    height:auto;
    aspect-ratio:1 / .85;
    min-height:0;
  }
}

/* Centre the type/status key (Watchman branding + status rings) in its box. */
body.ff-page .map-below .maplegend{
  display:flex;
  flex-direction:column;
  align-items:center;
}
body.ff-page .map-below .maplegend .ml-grid{
  margin:0 auto;
  width:max-content;
  max-width:100%;
  justify-content:center;
}

/* Street / Satellite switch: exact #bMode .ilayers glyph from map-prototype.html, plus labels.
   Closed by default; opens to the RIGHT of #zmode (not below). */
body.ff-page .map-tl{grid-template-rows:auto auto;--zbtn:38px}
body.ff-page .map-tl #zmode{grid-row:1;grid-column:1}
body.ff-page .map-tl #zupright{grid-row:2;grid-column:1}
body.ff-page .map-tl #zseg{
  display:none;
  position:absolute;
  top:0;
  left:calc(var(--zbtn) + 8px);
  flex-direction:row;
  flex-wrap:nowrap;
  gap:4px;
  pointer-events:auto;
  align-items:stretch;
  z-index:8;
}
body.ff-page .map-tl #zseg.is-open{display:flex}
body.ff-page .map-tl #zseg button{
  pointer-events:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-width:38px;
  width:auto;
  padding:5px 6px;
  border-radius:10px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.65);
  color:var(--gold2);
  line-height:1;
  cursor:pointer;
}
body.ff-page .map-tl #zseg svg{
  display:block;width:20px;height:20px;margin:0;padding:0;pointer-events:none
}
body.ff-page .map-tl #zmode .ilayers,
body.ff-page .map-tl #zseg .ilayers,
body.ff-page .map-help-btns .ilayers{
  fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round
}
body.ff-page .map-tl #zmode .l1,
body.ff-page .map-tl #zseg .l1,
body.ff-page .map-help-btns .ilayers .l1{fill:rgba(245,212,122,.35)}
body.ff-page .map-tl #zseg .zseg-lab{
  font-size:8px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-align:center;
  line-height:1.1;
  color:inherit;
}
body.ff-page .map-tl #zseg button[aria-checked=true]{
  background:rgba(212,166,42,.22);
  border-color:var(--gold);
  color:var(--gold2)
}
body.ff-page .map-tl #zseg button[aria-checked=true] .l1{fill:#f5d47a}
body.ff-page .map-tl #zmode[aria-pressed=true] .l1{fill:#f5d47a}
@media(max-width:600px){
  body.ff-page .map-tl{--zbtn:44px}
  body.ff-page .map-tl #zseg button{min-width:44px;padding:6px 7px}
}

/* Header: Enter Fellowship Finder Map — gold .btn, desktop nav + phone hamburger. */
body.ff-page nav a.btn.nav-enter-map{
  position:relative;
  white-space:nowrap;
  text-align:center;
  text-decoration:none;
  color:#120d02;
  margin:0;
}
body.ff-page nav a.btn.nav-enter-map:after{content:none;display:none}
body.ff-page nav .nav-finder-btns a.btn.nav-enter-map{
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  text-align:center;
}
@media(max-width:860px){
  body.ff-page nav a.btn.nav-enter-map{
    font-family:Oxanium,Inter,system-ui,sans-serif !important;
    font-size:clamp(.72rem,3.6vw,.92rem) !important;
    font-weight:600;
    letter-spacing:.02em;
    padding:14px 16px;
    width:min(100%,300px);
    max-width:min(100%,300px);
    min-height:48px;
    height:48px;
    white-space:nowrap;
    line-height:1.2;
  }
}
@media(max-width:360px){
  body.ff-page nav a.btn.nav-enter-map{
    font-size:.72rem !important;
    letter-spacing:.015em;
    padding:14px 12px;
  }
}

/* Footer Follow us + exact homepage/welcome socials (page-scoped). */
body.ff-page .foot .fgrid>div:nth-child(3){text-align:center}
@media(min-width:761px){
  body.ff-page .foot .fgrid{grid-template-columns:2fr 1fr}
  body.ff-page .foot .fgrid>div:nth-child(3){grid-column:1/-1}
}
body.ff-page .foot .ff-follow-h{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:20px 0 16px;
  padding:0;
  font:600 .75rem/1 Oxanium,Inter,system-ui,sans-serif !important;
  letter-spacing:.32em;
  text-transform:uppercase !important;
  color:var(--gold);
  text-align:center;
}
body.ff-page .foot .ff-follow-h:before,
body.ff-page .foot .ff-follow-h:after{
  content:"";
  width:34px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold));
}
body.ff-page .foot .ff-follow-h:after{transform:scaleX(-1)}

/* Exact welcome .soc-top / .tt-btn / .yt-btn / pulse / hover, scoped to the Finder footer.
   IMPORTANT: the 6-column grid belongs ONLY on nav.soc-top (the 6 links' parent).
   .social.ff-follow is a one-child wrapper; giving it 6 columns squeezed .soc-top
   into the first column (~1/6 width) so the icons overflowed and stacked in one pile. */
@keyframes samplePulse{0%,100%{box-shadow:0 0 8px rgba(212,166,42,.2)}50%{box-shadow:0 0 18px rgba(245,212,122,.5)}}
body.ff-page .foot .social.ff-follow{
  display:block !important;
  width:100%;
  max-width:none;
  height:auto !important;
  margin:0;
  padding:0;
  gap:0;
  background:transparent;
  border:0;
  position:static;
}
body.ff-page .foot .ff-follow .soc-top{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:6px;
  width:100%;
  max-width:27rem;
  margin:0 auto;
  padding:0;
  justify-items:center;
  align-items:start;
  position:relative;
  box-sizing:border-box;
}
/* Phone: keep the 3-over-3 social grid. Desktop/tablet (≥521px): 6 in one row. */
@media(max-width:520px){
  body.ff-page .foot .ff-follow .soc-top{
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-width:18rem;
    gap:10px 8px;
  }
}
body.ff-page .foot .fgrid .ff-follow a.soc-top-item,
body.ff-page .foot .ff-follow .soc-top-item{
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  box-sizing:border-box;
  position:static !important;
  left:auto !important;
  top:auto !important;
  width:100% !important;
  max-width:100%;
  height:auto !important;
  min-width:0;
  grid-column:auto !important;
  grid-row:auto !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  margin:0 !important;
  padding:0 !important;
  text-decoration:none;
  color:var(--gold2);
  place-items:center;
  align-items:center !important;
  justify-content:flex-start !important;
}
body.ff-page .foot .ff-follow .yt-btn,
body.ff-page .foot .ff-follow .tt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:2.6rem;
  height:2.6rem;
  padding:0;
  flex:none;
  border:1px solid rgba(245,212,122,.7);
  border-radius:999px;
  background:rgba(212,166,42,.08);
  color:#f5d47a;
  box-shadow:0 0 10px rgba(212,166,42,.22);
  font:600 .66rem/1 Oxanium,Inter,system-ui,sans-serif;
  text-decoration:none;
  cursor:pointer;
  transition:border-color .2s,background .2s,box-shadow .2s,color .2s;
  animation:samplePulse 1.8s ease-in-out infinite;
}
body.ff-page .foot .ff-follow .soc-top-item:hover .tt-btn,
body.ff-page .foot .ff-follow .soc-top-item:focus-visible .tt-btn,
body.ff-page .foot .ff-follow .soc-top-item:hover .yt-btn,
body.ff-page .foot .ff-follow .soc-top-item:focus-visible .yt-btn{
  border-color:#f5d47a;
  color:#fff3cf;
  background:rgba(212,166,42,.18);
  box-shadow:0 0 18px rgba(245,212,122,.45);
  animation:none;
}
body.ff-page .foot .ff-follow .soc-top-item:focus-visible{
  outline:2px solid var(--gold2);
  outline-offset:3px;
  border-radius:8px;
}
/* Cancel site-wide .social svg{width:19px;fill:none;stroke} so brand marks stay filled.
   Exempt chips/SVG from page-wide Oxanium + uppercase * rules (labels stay uppercase). */
body.ff-page .foot .ff-follow .tt-btn,
body.ff-page .foot .ff-follow .yt-btn,
body.ff-page .foot .ff-follow .tt-logo,
body.ff-page .foot .ff-follow .yt-logo,
body.ff-page .foot .ff-follow svg,
body.ff-page .foot .ff-follow svg *{
  text-transform:none !important;
}
body.ff-page .foot .ff-follow svg,
body.ff-page .foot .ff-follow .tt-logo,
body.ff-page .foot .ff-follow .yt-logo{
  width:1.4rem !important;
  height:1.4rem !important;
  display:block;
  flex:none;
  margin:0;
  object-fit:contain;
  fill:unset;
  stroke:none;
  stroke-width:unset;
  max-width:none;
  max-height:none;
}
body.ff-page .foot .ff-follow svg *{
  stroke:unset;
  stroke-width:unset;
}
body.ff-page .foot .ff-follow .soc-top-name{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  color:var(--gold2);
  font:600 .62rem/1.1 Oxanium,Inter,system-ui,sans-serif !important;
  letter-spacing:.04em;
  padding-left:.04em; /* balance trailing letter-spacing so the label centres on the icon */
  margin-left:0;
  white-space:nowrap;
  text-transform:uppercase !important;
  text-shadow:0 1px 2px rgba(0,0,0,.6),0 0 12px rgba(212,166,42,.18);
}
@media(prefers-reduced-motion:reduce){
  body.ff-page .foot .ff-follow .yt-btn,
  body.ff-page .foot .ff-follow .tt-btn{animation:none}
}
@media(max-width:360px){
  body.ff-page .foot .ff-follow .soc-top{gap:8px 6px}
  body.ff-page .foot .ff-follow .tt-btn,
  body.ff-page .foot .ff-follow .yt-btn{width:2.3rem;height:2.3rem}
  body.ff-page .foot .ff-follow .soc-top-name{font-size:.56rem !important}
}


/* Filter panel: centre every control; option labels stacked above their boxes.
   IDs, names and behaviour are unchanged (chips stay buttons). */
body.ff-page #directory{
  text-align:center;
}
body.ff-page #directory label{
  display:block;
  width:100%;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
body.ff-page #directory #sf{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-bottom:12px;
}
body.ff-page #directory #sf .row{
  flex-direction:column;
  width:100%;
  justify-content:center;
  align-items:stretch;
  gap:10px;
}
body.ff-page #directory #sf input{
  width:100%;
  margin-bottom:0;
  text-align:center;
}
body.ff-page #directory #sf .btn{
  flex:none !important;
  align-self:center;
  width:auto;
}
body.ff-page #directory #rad{
  text-align:center;
}
body.ff-page #directory .geo-wrap{
  width:100%;
  text-align:center;
}
body.ff-page #directory #typeChips{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  width:100%;
}
body.ff-page #directory #info{
  text-align:center;
}
/* Radius + units row: centred, units stay a balanced pair */
body.ff-page #directory > .row{
  flex-direction:column;
  justify-content:center;
  align-items:center;
  flex-wrap:nowrap;
  width:100%;
  gap:8px;
}
body.ff-page #directory > .row > div{
  display:flex;
  flex-direction:column;
  align-items:center;
  flex:0 1 auto;
}
body.ff-page #directory #rad{
  width:auto;
  min-width:8.5em;
  margin-left:auto;
  margin-right:auto;
}

/* Show only + km/mi: label text centred above a checkbox/radio box, options even. */
body.ff-page #directory .chips:has(#open),
body.ff-page #directory #unitChips{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:flex-start;
  gap:12px 28px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
}
body.ff-page #directory .chips:has(#open) .chip,
body.ff-page #directory #unitChips .chip{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex:0 1 auto;
  min-width:5.5em;
  max-width:11em;
  margin:0;
  padding:4px 8px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--silver);
  font:600 .72rem/1.2 Oxanium,Inter,system-ui,sans-serif;
  letter-spacing:.04em;
  text-align:center;
  white-space:normal;
}
body.ff-page #directory .chips:has(#open) .chip:hover,
body.ff-page #directory #unitChips .chip:hover{
  border-color:transparent;
  color:var(--gold2);
  background:transparent;
}
body.ff-page #directory .chips:has(#open) .chip[aria-pressed=true],
body.ff-page #directory #unitChips .chip[aria-pressed=true]{
  background:transparent;
  border-color:transparent;
  color:var(--gold2);
}
body.ff-page #directory .chips:has(#open) .chip::after,
body.ff-page #directory #unitChips .chip::after{
  content:"";
  width:18px;
  height:18px;
  box-sizing:border-box;
  flex:none;
  order:1;
  border:2px solid var(--gold2);
  background:transparent;
  box-shadow:none;
  pointer-events:none;
}
/* Open / Seeking are independent toggles → square checkbox */
body.ff-page #directory .chips:has(#open) .chip::after{
  border-radius:3px;
}
/* km / mi are a pair → round radio */
body.ff-page #directory #unitChips .chip::after{
  border-radius:50%;
}
body.ff-page #directory .chips:has(#open) .chip[aria-pressed=true]::after{
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:inset 0 0 0 2px #120d02;
}
body.ff-page #directory #unitChips .chip[aria-pressed=true]::after{
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:inset 0 0 0 3px #120d02;
}

/* ALL visible text on Finder pages is uppercase (CSS only; source strings unchanged).
   Overrides keepcase / geo-note sentence-case exceptions on these pages only. */
body.ff-page,
body.ff-page *,
body.ff-page *::placeholder,
body.ff-page *::before,
body.ff-page *::after,
body.ff-page option,
body.ff-page input,
body.ff-page textarea,
body.ff-page select,
body.ff-page button,
body.ff-page .keepcase,
body.ff-page .geo-note,
body.ff-page .foot .verse,
body.ff-page input[type="email"],
body.ff-page input[type="email"]::placeholder{
  text-transform:uppercase !important;
}

/* Sign up and log in coming soon — under the public preview box only. */
body.ff-page .preview-coming-soon{
  display:block;
  text-align:center;
  margin:0 auto 1.15em;
  max-width:40em;
  font-weight:500;
  letter-spacing:.04em;
}

/* Two header buttons: equal height side by side on desktop; stacked and equal on phone. */
body.ff-page nav .nav-finder-btns{
  display:flex;
  flex-direction:row;
  align-items:stretch;
  justify-content:center;
  gap:10px;
  flex-wrap:nowrap;
}
@media(max-width:860px){
  body.ff-page nav .nav-finder-btns{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:min(100%,300px);
    max-width:min(100%,300px);
    gap:13px;
    margin:0 auto;
  }
  body.ff-page nav .nav-finder-btns a.btn.nav-enter-map{
    flex:0 0 auto;
    width:min(100%,300px);
    max-width:min(100%,300px);
    box-sizing:border-box;
  }
}

/* Footer stack: Explore, existing separator line, neon shield, Follow us + socials, verse, three-line footer. */
body.ff-page .foot .fgrid.ff-foot{
  grid-template-columns:1fr;
  justify-items:center;
  gap:0;
}
body.ff-page .foot .ff-foot-explore{text-align:center;width:100%}
body.ff-page .foot .ff-follow-block{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  max-width:40rem;
  text-align:center;
}
/* Existing footer hairline, moved to sit between Explore and the shield (not removed). */
body.ff-page .foot .ff-sep{
  display:block;
  width:100%;
  height:0;
  margin:20px auto;
  border:0;
  border-top:1px solid rgba(255,255,255,.06);
  pointer-events:none;
}
/* Homepage neon shield (homeShieldNeon, #f5d47a), centred under the separator. */
@keyframes homeShieldNeon{
  0%,100%{filter:drop-shadow(0 0 2px #f5d47a) drop-shadow(0 0 6px #f5d47a) drop-shadow(0 0 14px rgba(245,212,122,.9)) drop-shadow(0 0 28px rgba(245,212,122,.5))}
  50%{filter:drop-shadow(0 0 3px #fff3cf) drop-shadow(0 0 10px #f5d47a) drop-shadow(0 0 22px rgba(245,212,122,1)) drop-shadow(0 0 40px rgba(245,212,122,.7))}
}
body.ff-page .foot .home-shield,
body.ff-page .foot .ff-foot-shield{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:20px auto 0;
  pointer-events:none;
}
body.ff-page .foot .home-shield img,
body.ff-page .foot .ff-foot-shield img{
  display:block;
  width:56px;
  height:auto;
  filter:drop-shadow(0 0 2px #f5d47a) drop-shadow(0 0 6px #f5d47a) drop-shadow(0 0 14px rgba(245,212,122,.95)) drop-shadow(0 0 28px rgba(245,212,122,.65));
  animation:homeShieldNeon 1.8s ease-in-out infinite;
}
@media(max-width:600px){
  body.ff-page .foot .home-shield img,
  body.ff-page .foot .ff-foot-shield img{width:40px}
}
@media(prefers-reduced-motion:reduce){
  body.ff-page .foot .home-shield img,
  body.ff-page .foot .ff-foot-shield img{animation:none}
}

/* Homepage-matching verse + Ezekiel 33–7 under the socials (exempt italic silver footer verse). */
@keyframes verseShimmer{0%{background-position:100% 0,0 0}60%{background-position:0% 0,0 0}100%{background-position:0% 0,0 0}}
body.ff-page .foot .ff-home-verse,
body.ff-page .foot .ff-home-ref{
  font-family:Oxanium,system-ui,sans-serif !important;
  font-style:normal !important;
  font-weight:700;
  font-size:.85rem;
  line-height:1.6;
  letter-spacing:.05em;
  text-transform:uppercase !important;
  text-align:center;
  max-width:30em;
  margin:20px auto 0;
  opacity:1;
  color:transparent;
  background-image:linear-gradient(100deg,rgba(255,246,214,0) 0%,rgba(255,246,214,0) 42%,rgba(255,240,200,.55) 47%,rgba(255,252,240,.95) 50%,rgba(255,240,200,.55) 53%,rgba(255,246,214,0) 58%,rgba(255,246,214,0) 100%),linear-gradient(100deg,#b8862b 0%,#d9a93a 20%,#f1cf7a 40%,#f7e2a8 50%,#ebc066 66%,#d9a23c 84%,#c4922f 100%);
  background-size:300% 100%,100% 100%;
  background-repeat:no-repeat;
  background-position:100% 0,0 0;
  -webkit-background-clip:text;
  background-clip:text;
  filter:none;
  animation:verseShimmer 7.5s linear infinite;
}
body.ff-page .foot .ff-home-ref{display:block;margin-top:16px}
@media(prefers-reduced-motion:reduce){
  body.ff-page .foot .ff-home-verse,
  body.ff-page .foot .ff-home-ref{animation:none}
}

/* Finder three-line copyright: tight gap between line 2 and Ezekiel 33:2.7 */
body.ff-page .fbot.ff-fbot,
body.ff-page .ff-fbot{
  text-align:center;
  margin-top:20px;
  padding-top:0;
  border-top:0;
}
body.ff-page .ff-fbot p{
  margin:0;
  padding:0;
  font-weight:400;
  line-height:1.35;
}
body.ff-page .ff-fbot .ft-name{
  font-weight:700;
  margin-bottom:6px;
}
body.ff-page .ff-fbot .ft-l2{
  margin:0;
  line-height:1.25;
  font-weight:700;
}
body.ff-page .ff-fbot .ft-l3{
  margin:2px 0 0;
  padding:0;
  line-height:1.1;
}

/* Finder "Find believers near you": exact live homepage h1 treatment.
   Reuses existing verseShimmer (identical 7.5s keyframes). titleGlowPlus is new. */
@keyframes titleGlowPlus{
  0%,100%{filter:drop-shadow(0 0 8px rgba(212,166,42,.26)) drop-shadow(0 0 16px rgba(245,212,122,.2))}
  50%{filter:drop-shadow(0 0 18px rgba(245,212,122,.62)) drop-shadow(0 0 16px rgba(245,212,122,.2))}
}
body.ff-page .ph h1,
body.ff-page .ph h1.gold{
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  background-image:linear-gradient(100deg,rgba(255,246,214,0) 0%,rgba(255,246,214,0) 42%,rgba(255,240,200,.55) 47%,rgba(255,252,240,.95) 50%,rgba(255,240,200,.55) 53%,rgba(255,246,214,0) 58%,rgba(255,246,214,0) 100%),linear-gradient(100deg,#b8862b 0%,#d9a93a 20%,#f1cf7a 40%,#f7e2a8 50%,#ebc066 66%,#d9a23c 84%,#c4922f 100%);
  background-size:300% 100%,100% 100%;
  background-repeat:no-repeat;
  background-position:100% 0,0 0;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:verseShimmer 7.5s linear infinite,titleGlowPlus 1.8s ease-in-out infinite;
  filter:drop-shadow(0 0 8px rgba(212,166,42,.26)) drop-shadow(0 0 16px rgba(245,212,122,.2));
}
@media(prefers-reduced-motion:reduce){
  body.ff-page .ph h1,
  body.ff-page .ph h1.gold{animation:none}
}

/* Footer Follow nav.soc-top must not inherit the phone hamburger `nav{opacity:0}` rule. */
@media(max-width:860px){
  body.ff-page nav.soc-top{
    position:static !important;
    inset:auto !important;
    opacity:1 !important;
    pointer-events:auto !important;
    z-index:auto !important;
    background:transparent !important;
    transform:none !important;
    width:100%;
  }
}

/* Map buttons: icon centred above its description; description text-align:center.
   2-column grid on desktop and 1 column on phone come from style.css. */
body.ff-page #mapbtns,
body.ff-page #mapbtns h3,
body.ff-page section.map-help{
  text-align:center;
}
body.ff-page #mapbtns .map-help-btns{
  width:100%;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  justify-items:center;
  justify-content:center;
  box-sizing:border-box;
}
body.ff-page #mapbtns .map-help-btns li{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  gap:8px;
  width:100%;
  box-sizing:border-box;
}
body.ff-page #mapbtns .map-help-btns li > span:not(.mh-ico){
  text-align:center;
  max-width:18em;
}


/* ========== /fellowship-finder only: homepage SUPPORT THE MINISTRY button copy.
   Scoped under .ph .ff-support so other Finder .btn rules (Search, nav, geo) are untouched. */
@keyframes liveGlitter{0%{background-position:114% 0,0 0,0 0,0 0,0 0}100%{background-position:-20% 0,0 0,0 0,0 0,0 0}}
@keyframes ltChipPulse{0%,100%{transform:scale(.92)}50%{transform:scale(1.04)}}
body.ff-page .ph .ff-support{
  width:min(480px, calc(100% + 8px));
  max-width:min(480px, calc(100% + 8px));
  margin:0 auto 14px;
  box-sizing:border-box;
  text-align:center;
}
body.ff-page .ph .ff-support a.btn.live,
body.ff-page .ph .ff-support a.btn.live *{
  font-family:Oxanium,system-ui,-apple-system,"Segoe UI",sans-serif !important;
}
body.ff-page .ph .ff-support a.btn.live{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  justify-content:space-between;
  gap:0 12px;
  column-gap:12px;
  text-align:center;
  width:100%;
  max-width:480px;
  margin:0 auto;
  box-sizing:border-box;
  position:relative;
  overflow:hidden;
  min-height:64px;
  padding:14px 20px;
  border:0;
  border-radius:16px;
  font:600 1.02rem/1.3 Oxanium,system-ui,-apple-system,"Segoe UI",sans-serif;
  letter-spacing:normal;
  text-decoration:none;
  text-align:center;
  background:var(--grad);
  color:#1a1205;
  box-shadow:0 10px 30px -10px rgba(212,166,42,.6);
  cursor:pointer;
  filter:none;
  transition:transform .2s,box-shadow .2s;
  animation:samplePulse 1.8s ease-in-out infinite;
}
body.ff-page .ph .ff-support a.btn.live:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 36px -10px rgba(212,166,42,.75);
  filter:none;
  animation:none;
}
body.ff-page .ph .ff-support a.btn.live:focus-visible{
  outline:2px solid var(--gold2);
  outline-offset:3px;
  animation:none;
}
body.ff-page .ph .ff-support a.btn.live small{color:#3b2a06;display:block;font-weight:400;font-size:.82rem;margin-top:2px}
body.ff-page .ph .ff-support a.btn.live>.btn-side{
  position:relative;z-index:1;display:flex;align-items:center;pointer-events:none;color:#1a1205;
}
body.ff-page .ph .ff-support a.btn.live>.btn-side:first-child{justify-self:start;justify-content:flex-start}
body.ff-page .ph .ff-support a.btn.live>.btn-side:nth-child(3){justify-self:end;justify-content:flex-end}
body.ff-page .ph .ff-support a.btn.live svg,
body.ff-page .ph .ff-support a.btn.live .btn-menorah{
  width:2em;height:2em;display:block;flex:none;margin:0;padding:0;
  fill:currentColor;stroke:unset;stroke-width:unset;stroke-linecap:unset;stroke-linejoin:unset;
  filter:none;box-shadow:none;
}
body.ff-page .ph .ff-support a.btn.live>.btn-label{
  position:relative;z-index:1;justify-self:center;text-align:center;pointer-events:none;color:#1a1205;
}
body.ff-page .ph .ff-support a.btn.live::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(105deg,transparent 0%,transparent 38%,rgba(245,212,122,0) 42%,rgba(245,212,122,.55) 50%,rgba(212,166,42,.35) 54%,transparent 62%,transparent 100%),radial-gradient(circle at 18% 35%,rgba(245,212,122,.55) 0 1px,transparent 2px),radial-gradient(circle at 62% 70%,rgba(212,166,42,.5) 0 1px,transparent 2px),radial-gradient(circle at 78% 28%,rgba(245,212,122,.45) 0 1.2px,transparent 2.2px),radial-gradient(circle at 40% 80%,rgba(212,166,42,.4) 0 .8px,transparent 1.8px);
  background-repeat:no-repeat;
  background-size:220% 100%,100% 100%,100% 100%,100% 100%,100% 100%;
  background-position:114% 0,0 0,0 0,0 0,0 0;
  animation:liveGlitter 3.35s linear infinite;
}
body.ff-page .ph .ff-support a.btn.live .st-title{
  display:block;font-size:1.08em;line-height:1.2;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;color:#1a1205;
}
body.ff-page .ph .ff-support a.btn.live small.lt-link{
  display:flex;width:fit-content;align-items:center;justify-content:center;gap:.45em;margin:6px auto 0;padding:4px 11px;
  border-radius:999px;background:rgba(26,18,5,.88);color:#f5d47a;font-weight:700;font-size:.86rem;letter-spacing:.06em;line-height:1.2;max-width:100%;
  box-shadow:0 0 0 1px rgba(245,212,122,.45) inset;
  transform-origin:50% 50%;animation:ltChipPulse 3.6s ease-in-out infinite;will-change:transform;
}
body.ff-page .ph .ff-support a.btn.live small.lt-link .lt-ico{
  width:1.2em;height:1.2em;flex:none;display:block;padding:.18em;box-sizing:border-box;
  background:#43E55E;color:#000;border-radius:24%;fill:currentColor;stroke:none;
}
body.ff-page .ph .ff-support a.btn.live small.lt-link .lt-dom{font-style:italic;color:#43E55E}
body.ff-page .ph .ff-support a.btn.live small.lt-link .lt-wm{color:#eeeae2}
@media(max-width:379px){
  body.ff-page .ph .ff-support a.btn.live small.lt-link{font-size:.76rem;padding:4px 9px;letter-spacing:.03em}
  body.ff-page .ph .ff-support a.btn.live .st-title{font-size:1.04em}
}
@media(min-width:768px){
  body.ff-page .ph .ff-support a.btn.live{min-height:72px;padding:18px 26px;font-size:1.08rem}
}
@media(min-width:1200px){
  body.ff-page .ph .ff-support a.btn.live{flex-direction:row;align-items:center;justify-content:center;min-height:96px;padding:24px}
}
@media(prefers-reduced-motion:reduce){
  body.ff-page .ph .ff-support a.btn.live{transition:none;animation:none;box-shadow:0 10px 30px -10px rgba(212,166,42,.6),0 0 16px 1px rgba(245,212,122,.28)}
  body.ff-page .ph .ff-support a.btn.live:hover{transform:none}
  body.ff-page .ph .ff-support a.btn.live::before{animation:none;background:radial-gradient(circle at 50% 40%,rgba(245,212,122,.18),transparent 60%)}
  body.ff-page .ph .ff-support a.btn.live small.lt-link{animation:none;transform:none}
}

/* ========== /fellowship-finder only: map-page STREET / SATELLITE selector, right side of #map.
   Visuals copied from map-prototype .pseg. Shown when the map is in street or satellite mode.
   High z-index + pointer-events so the canvas cannot swallow clicks. */
body.ff-page #map #pseg{
  position:absolute;
  top:14px;
  right:102px; /* immediately left of .mapctl-aux (right:58px, 38px buttons, 6px gap) */
  z-index:20;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  height:auto;
  padding:3px;
  gap:2px;
  border:1px solid var(--line);
  border-radius:10px;
  background:rgba(0,0,0,.65);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-4px);
  transition:opacity .35s,transform .35s,visibility 0s .35s;
  box-sizing:border-box;
  font-family:Oxanium,var(--sans);
}
body.ff-page #map[data-base=street] #pseg,
body.ff-page #map[data-base=satellite] #pseg,
body.ff-page #map.m-real #pseg{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
  transition:opacity .35s .15s,transform .35s .15s,visibility 0s;
}
body.ff-page #map #pseg,
body.ff-page #map #pseg button{-webkit-tap-highlight-color:transparent}
body.ff-page #map #pseg button{
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--silver);
  font:600 12px/1 Oxanium,var(--sans);
  letter-spacing:.03em;
  padding:0 11px;
  min-height:30px;
  width:100%;
  cursor:pointer;
  pointer-events:auto;
  position:relative;
  z-index:21;
  transition:background .25s,color .25s;
  text-transform:uppercase;
}
body.ff-page #map #pseg button[aria-checked=false]{background:transparent;color:var(--silver)}
body.ff-page #map #pseg button[aria-checked=true]{background:var(--grad);color:#120d02}
body.ff-page #map #pseg button:focus:not(:focus-visible){outline:none}
body.ff-page #map #pseg button:focus-visible{outline:2px solid var(--gold2);outline-offset:1px}
@media (hover:hover) and (pointer:fine){
  body.ff-page #map #pseg button[aria-checked=false]:hover{color:var(--gold2)}
}
/* Phone: keep the box immediately left of the taller right-side controls so it is not covered. */
@media(max-width:600px){
  body.ff-page #map #pseg{top:10px;right:108px;padding:3px;height:auto}
  body.ff-page #map #pseg button{padding:0 8px;font-size:11px;min-height:30px}
}

/* Gold QUICK SEARCH section title (Fellowship Finder left panel, and later /ff-test under the map). */
body.ff-page .ff-quick-h{
  display:block;
  margin:0 0 10px;
  padding:0;
  text-align:center;
  color:var(--gold2);
  font:700 .8rem/1.2 Oxanium,Inter,system-ui,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:700;
}


/* Help box + key button: /fellowship-finder MOBILE ONLY (max-width 960px).
   Desktop (>=961px) stays pixel-identical — the control is not displayed and
   does not occupy grid space. /ff-test (body.ff-auth) may show it on all widths later. */
@media(min-width:961px){
  body.ff-page:not(.ff-auth) .map-tl #zkey,
  body.ff-page:not(.ff-auth) #mapwelcome{
    display:none !important;
    pointer-events:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
}
@media(max-width:960px){
  body.ff-page:not(.ff-auth) .map-tl{
    grid-template-rows:auto auto auto;
  }
  body.ff-page .map-tl #zkey{
    pointer-events:auto;
    grid-column:1;
    grid-row:1;
    z-index:7;
  }
  body.ff-page:not(.ff-auth) .map-tl #zmode{grid-row:2;grid-column:1}
  body.ff-page:not(.ff-auth) .map-tl #zupright{grid-row:3;grid-column:1}
  body.ff-page:not(.ff-auth) .map-tl #pinfo{grid-row:1;grid-column:2}
  /* Neutral default; do not inherit the legend-toggle gold-on style from style.css. */
  body.ff-page .map-tl #zkey,
  html:not(.map-key-off) body.ff-page .map-tl #zkey,
  body.ff-page .map-tl #zkey[aria-pressed=false],
  body.ff-page .map-tl #zkey[aria-expanded=false]{
    background:rgba(0,0,0,.65);
    border-color:var(--line);
    color:var(--gold2);
  }
  body.ff-page .map-tl #zkey[aria-expanded=true],
  body.ff-page .map-tl #zkey[aria-pressed=true]{
    background:rgba(212,166,42,.22);
    border-color:var(--gold);
    color:var(--gold2);
  }
  body.ff-page #mapwelcome{
    z-index:22;
    pointer-events:none;
  }
  body.ff-page #mapwelcome.on{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
}


/* ========== /ff-test only (body.ff-auth on finder-auth.html). Does not change /fellowship-finder. */
body.ff-auth .ff-quick-wrap{
  width:100%;
  margin:16px 0 0;
  padding:0;
  box-sizing:border-box;
  text-align:center;
}
body.ff-auth .ff-quick-wrap .ff-quick-h{margin:0 0 10px}
body.ff-auth .ff-quick-wrap #sf{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  margin:0 auto;
  box-sizing:border-box;
}
body.ff-auth .ff-quick-wrap #sf .row{
  display:flex;
  flex-direction:column;
  width:100%;
  justify-content:center;
  align-items:stretch;
  gap:10px;
}
body.ff-auth .ff-quick-wrap #sf input{
  width:100%;
  margin-bottom:0;
  text-align:center;
  box-sizing:border-box;
}
body.ff-auth .ff-quick-wrap #sf .btn{
  flex:none !important;
  align-self:center;
  width:auto;
}
/* Left panel uses the shared 961px stretch so its bottom matches the right
   column (map + QUICK SEARCH + legend). There is no Map buttons box on /ff-test. */
/* Help button + box on phone and desktop for /ff-test. */
body.ff-auth .map-tl{grid-template-rows:auto auto auto}
body.ff-auth .map-tl #zkey{
  pointer-events:auto;
  display:flex;
  grid-column:1;
  grid-row:1;
  z-index:7;
}
body.ff-auth .map-tl #zmode{grid-row:2;grid-column:1}
body.ff-auth .map-tl #zupright{grid-row:3;grid-column:1}
body.ff-auth .map-tl #pinfo{grid-row:1;grid-column:2}
body.ff-auth .map-tl #zkey,
html:not(.map-key-off) body.ff-auth .map-tl #zkey,
body.ff-auth .map-tl #zkey[aria-pressed=false],
body.ff-auth .map-tl #zkey[aria-expanded=false]{
  background:rgba(0,0,0,.65);
  border-color:var(--line);
  color:var(--gold2);
}
body.ff-auth .map-tl #zkey[aria-expanded=true],
body.ff-auth .map-tl #zkey[aria-pressed=true]{
  background:rgba(212,166,42,.22);
  border-color:var(--gold);
  color:var(--gold2);
}
body.ff-auth #mapwelcome{z-index:22;pointer-events:none}
body.ff-auth #mapwelcome.on{opacity:1;visibility:visible;pointer-events:auto}


/* /fellowship-finder footer only (not /ff-test): homepage .w144-divider + larger neon shield. */
body.ff-page:not(.ff-auth) .w144-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:66%;
  max-width:340px;
  margin:22px auto 0;
  pointer-events:none;
}
body.ff-page:not(.ff-auth) .w144-divider .dv-line{
  flex:1 1 auto;
  height:1px;
  background:linear-gradient(90deg,rgba(212,166,42,0) 0%,rgba(212,166,42,.55) 55%,#f5d47a 100%);
  box-shadow:0 0 6px rgba(245,212,122,.35);
}
body.ff-page:not(.ff-auth) .w144-divider .dv-line.dv-r{
  background:linear-gradient(270deg,rgba(212,166,42,0) 0%,rgba(212,166,42,.55) 55%,#f5d47a 100%);
}
body.ff-page:not(.ff-auth) .w144-divider .dv-gem{
  flex:none;
  width:26px;
  height:26px;
  display:block;
  filter:drop-shadow(0 0 8px rgba(245,212,122,.5));
}
@media(max-width:379px){
  body.ff-page:not(.ff-auth) .w144-divider{width:72%;gap:8px;margin:18px auto 0}
}
/* Clearly larger shield (2x): 56px -> 112px desktop, 40px -> 80px on phones. Glow unchanged. */
body.ff-page:not(.ff-auth) .foot .home-shield.ff-foot-shield,
body.ff-page:not(.ff-auth) .foot .ff-foot-shield{
  margin:20px auto 0;
}
body.ff-page:not(.ff-auth) .foot .home-shield.ff-foot-shield img,
body.ff-page:not(.ff-auth) .foot .ff-foot-shield img{
  width:112px;
  height:auto;
}
@media(max-width:600px){
  body.ff-page:not(.ff-auth) .foot .home-shield.ff-foot-shield img,
  body.ff-page:not(.ff-auth) .foot .ff-foot-shield img{width:80px}
}
