/* Forge & Foundation — core stylesheet */
:root{
  --bg:#ece4d6; --bg-2:#e2d7c3; --panel:#f8f3e9; --panel-2:#f0e8d8;
  --ink:#241f1a; --ink-2:#453b30; --muted:#7b6b58;
  --line:#cdbb9f; --line-2:#b9a486;
  --accent:#a8551c; --accent-2:#7d3d0e; --gold:#c98a3c;
  --steel:#2c2723; --steel-2:#3a332c;
  --shadow:0 1px 0 rgba(0,0,0,.06), 0 8px 22px rgba(70,45,20,.10);
  --radius:4px; --maxw:1180px; --header-h:68px;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; min-height:100vh; color:var(--ink); background-color:var(--bg);
  background-image:
    radial-gradient(1200px 620px at 12% -8%, rgba(201,138,60,.16), transparent 62%),
    radial-gradient(1000px 520px at 92% 108%, rgba(120,80,40,.11), transparent 62%),
    repeating-linear-gradient(0deg, rgba(60,45,30,.028) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(60,45,30,.028) 0 1px, transparent 1px 3px);
  background-attachment:fixed;
  font-family: ui-serif, Georgia, "Iowan Old Style", "Palatino Linotype",
               "Book Antiqua", Palatino, serif;
  font-size:17px; line-height:1.68; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; display:block; }
a{ color:var(--accent-2); text-decoration-thickness:1px; text-underline-offset:2px; }
a:hover{ color:var(--accent); }
.skip{ position:absolute; left:-9999px; top:0; background:var(--accent); color:#fff;
  padding:.6rem 1rem; z-index:999; }
.skip:focus{ left:1rem; top:1rem; }
.site-header{ position:sticky; top:0; z-index:60;
  background:linear-gradient(180deg,#2f2924 0%,#221d19 100%);
  border-bottom:3px solid var(--accent); box-shadow:0 2px 14px rgba(0,0,0,.35); }
/* === header layout v2 === */
.header-inner{
  max-width:none;
  margin:0;
  padding:.55rem 1.25rem .55rem 1rem;
  display:flex;
  align-items:center;
  gap:.75rem;
  min-height:var(--header-h);
  width:100%;
}
.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
  text-decoration:none;
  color:#f4ead8;
  flex-shrink:0;
  padding-right:.5rem;
}
.brand-logo{ width:85px; height:68px; flex-shrink:0; }
.brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.brand-title{
  font-size:1.02rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  white-space:nowrap;
}
.brand-sub{
  font-size:.54rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  white-space:nowrap;
}
.nav-toggle{
  display:none;
  margin-left:auto;
  background:transparent;
  border:1px solid rgba(201,138,60,.5);
  color:#f0e3c9;
  font-size:1.3rem;
  line-height:1;
  padding:.35rem .6rem;
  border-radius:3px;
  cursor:pointer;
}
.site-nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:.15rem;
  flex-wrap:wrap;
  padding-left:.75rem;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
}
.site-nav a{
  color:#e6dac2;
  text-decoration:none;
  padding:.5rem .7rem;
  font-size:.76rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-weight:600;
  border:1px solid transparent;
  border-radius:3px;
  transition:background .15s ease, color .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.site-nav a:hover{
  background:rgba(201,138,60,.16);
  border-color:rgba(201,138,60,.45);
  color:#fff;
}
.site-nav a.active{
  background:var(--accent);
  border-color:var(--accent-2);
  color:#fff;
}
.site-nav a.kjv-link{
  border-color:rgba(201,138,60,.55);
  color:var(--gold);
  margin-left:.25rem;
}
.site-nav a.kjv-link:hover{
  background:rgba(201,138,60,.22);
  color:#fff;
}
.site-nav a.kjv-link.active{
  background:var(--gold);
  border-color:var(--accent-2);
  color:#241f1a;
}

@media (max-width: 1100px){
  .brand-sub{ display:none; }
}
@media (max-width: 940px){
  .brand-title{ font-size:.92rem; letter-spacing:.09em; }
  .site-nav a{ font-size:.72rem; padding:.45rem .55rem; letter-spacing:.1em; }
}
@media (max-width: 820px){
  .nav-toggle{ display:block; }
  .site-nav{
    display:none;
    position:absolute;
    top:100%; left:0; right:0;
    margin:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:#241f1a;
    border-bottom:3px solid var(--accent);
    padding:.4rem .6rem .8rem;
  }
  .site-nav.open{ display:flex; }
  .site-nav a{ padding:.85rem 1rem; border-radius:3px; }
  .header-inner{ position:relative; flex-wrap:wrap; }
  .brand-sub{ display:none; }
}

.hero{ position:relative; overflow:hidden; color:#f4ead8;
  background:linear-gradient(160deg,#3a3129 0%,#262019 55%,#1a1613 100%);
  border-bottom:3px solid var(--accent); }
.hero::before{ content:""; position:absolute; inset:0;
  background:url(../images/emblem.png) center 42% / min(420px, 62vw) no-repeat;
  opacity:0.22; pointer-events:none; }
.hero::after{ content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse at 50% 18%, rgba(201,138,60,.18), transparent 66%),
    linear-gradient(180deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,0) 32%, rgba(0,0,0,.24) 100%);
  pointer-events:none; }
.hero-inner{ position:relative; z-index:2; max-width:880px; margin:0 auto;
  padding:3.4rem 1.25rem 3.2rem; text-align:center; }
.hero-kicker{ margin:0 0 .7rem; font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.68rem; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); }
.hero-title{ margin:0 0 .75rem; font-size:clamp(2rem, 5.2vw, 3.3rem); line-height:1.12;
  font-weight:700; letter-spacing:.01em; text-shadow:0 3px 18px rgba(0,0,0,.55); }
.hero-lead{ margin:0 auto 1.2rem; max-width:660px;
  font-size:clamp(1rem, 1.55vw, 1.18rem); color:#e2d3b9;
  text-shadow:0 2px 10px rgba(0,0,0,.45); }
.hero-cta{ display:flex; gap:.7rem; justify-content:center; flex-wrap:wrap; margin-top:1.4rem; }
[contenteditable="true"]{ outline:none; }
[contenteditable="true"]:hover{ box-shadow:inset 0 -1px 0 rgba(201,138,60,.45); }
[contenteditable="true"]:focus{ box-shadow:inset 0 0 0 1px rgba(201,138,60,.8),
  0 0 0 4px rgba(201,138,60,.16); border-radius:3px; }
.btn{ display:inline-block; font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.78rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  text-decoration:none; padding:.8rem 1.5rem; border-radius:3px;
  border:1px solid rgba(201,138,60,.55); color:#f0e2c6; background:rgba(255,255,255,.04);
  transition:background .15s ease, color .15s ease, border-color .15s ease; }
.btn:hover{ background:rgba(201,138,60,.2); color:#fff; border-color:var(--gold); }
.btn-primary{ background:var(--accent); border-color:var(--accent-2); color:#fff; }
.btn-primary:hover{ background:#c1631f; border-color:var(--accent); color:#fff; }
.crumbs{ font-family: ui-sans-serif, system-ui, sans-serif; font-size:.68rem;
  letter-spacing:.16em; text-transform:uppercase; color:#b8a888; margin:0 0 1rem; }
.crumbs a{ color:#d8c49c; text-decoration:none; }
.crumbs a:hover{ color:#fff; text-decoration:underline; }
.crumbs .crumb-sep{ margin:0 .45rem; opacity:.5; }
.crumbs [aria-current]{ color:var(--gold); }
.scripture{ max-width:var(--maxw); margin:2.2rem auto; padding:0 1.25rem; }
.scripture blockquote{ margin:0; padding:1.3rem 1.6rem 1.3rem 1.5rem;
  background:var(--panel); border-left:5px solid var(--accent);
  border-radius:var(--radius); box-shadow:var(--shadow);
  color:var(--ink-2); font-style:italic; font-size:1.06rem; position:relative; }
.scripture blockquote::before{ content:"\201C"; position:absolute; top:-.15rem; left:.6rem;
  font-size:3.2rem; line-height:1; color:var(--line-2); opacity:.55; font-style:normal; }
.scripture blockquote p{ margin:0 0 0 .9rem; }
.scripture cite{ display:block; margin-top:.7rem; margin-left:.9rem; font-style:normal;
  font-family: ui-sans-serif, system-ui, sans-serif; font-size:.72rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--accent-2); }
.container{ max-width:var(--maxw); margin:0 auto; padding:0 1.25rem; }
main{ display:block; }
.section{ max-width:var(--maxw); margin:2.6rem auto; padding:0 1.25rem; }
.section h2{ font-size:1.5rem; letter-spacing:.02em; margin:0 0 .4rem;
  padding-bottom:.55rem; border-bottom:2px solid var(--line); position:relative; }
.section h2::after{ content:""; position:absolute; left:0; bottom:-2px;
  width:74px; height:2px; background:var(--accent); }
.section h3{ font-size:1.12rem; margin:1.6rem 0 .35rem; color:var(--ink); }
.section p{ color:var(--ink-2); }
.lede{ font-size:1.08rem; color:var(--ink-2); max-width:74ch; }
.grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:1.1rem; margin-top:1.4rem; }
.card{ display:flex; flex-direction:column; gap:.35rem; background:var(--panel);
  border:1px solid var(--line); border-top:3px solid var(--accent);
  border-radius:var(--radius); padding:1.15rem 1.25rem 1.25rem;
  box-shadow:var(--shadow);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease; }
.card:hover{ transform:translateY(-2px);
  box-shadow:0 3px 0 rgba(0,0,0,.05), 0 14px 30px rgba(70,45,20,.16);
  border-color:var(--line-2); }
.card h3{ margin:0; font-size:1.1rem; letter-spacing:.02em; }
.card h3 a{ color:var(--ink); text-decoration:none; }
.card h3 a:hover{ color:var(--accent); }
.card p{ margin:.15rem 0 0; font-size:.95rem; color:var(--muted); }
.card .card-meta{ margin-top:.6rem; font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--line-2); }
.listing{ list-style:none; margin:1.2rem 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:.45rem 1.4rem; }
.listing li{ margin:0; }
.listing a{ display:block; padding:.42rem .2rem .42rem .9rem; text-decoration:none;
  color:var(--ink-2); border-left:2px solid var(--line); font-size:.95rem;
  transition:border-color .12s ease, color .12s ease, padding-left .12s ease; }
.listing a:hover{ border-left-color:var(--accent); color:var(--accent-2); padding-left:1.15rem; }
.placeholder{ border:1px dashed var(--line-2); background:rgba(255,255,255,.35);
  border-radius:var(--radius); padding:1.5rem 1.4rem; color:var(--muted);
  font-style:italic; margin-top:1.4rem; }
.prose{ max-width:74ch; }
.prose p{ margin:0 0 1.15rem; font-size:1.06rem; color:var(--ink-2); line-height:1.78; }
.prose h3{ margin:2rem 0 .55rem; font-size:1.2rem; color:var(--ink); }
.prose ul{ margin:.5rem 0 1.4rem; padding-left:1.3rem; }
.prose li{ margin:.45rem 0; color:var(--ink-2); font-size:1.03rem; line-height:1.65; }
.prose strong{ color:var(--ink); }
.prose em{ color:var(--ink); }
.scripture-inline{ border-left:4px solid var(--accent); background:var(--panel);
  padding:1.1rem 1.4rem 1.15rem; margin:1.8rem 0; border-radius:var(--radius);
  color:var(--ink-2); font-style:italic; font-size:1.04rem; box-shadow:var(--shadow); }
.scripture-inline p{ margin:0; line-height:1.7; }
.scripture-inline cite{ display:block; margin-top:.55rem; font-style:normal;
  font-family: ui-sans-serif, system-ui, sans-serif; font-size:1rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--accent-2); }
.wisdom-quote{ position:relative; border-left:5px solid var(--gold);
  background:linear-gradient(180deg, #fbf5e8 0%, #f1e5cc 100%);
  padding:1.35rem 1.6rem 1.35rem 1.5rem; margin: 0rem 0;
  border-radius:var(--radius); box-shadow:var(--shadow); color:var(--ink-2);
  font-style:italic; font-size:1.06rem; }
.wisdom-quote::before{ content:"\201C"; position:absolute; top:-.2rem; left:.65rem;
  font-size:3.2rem; line-height:1; color:var(--gold); opacity:.55; font-style:normal; }
.wisdom-quote p{ margin:0 0 0 1rem; line-height:1.72; }
.wisdom-quote cite{ display:block; margin-top:.6rem; margin-left:1rem;
  font-style:normal; font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--accent-2); }
.wisdom-quote.prager-quote{ border-left-color:#8a4712; }
.wisdom-quote.prager-quote::before{ color:#8a4712; }
.wisdom-quote.prager-quote cite{ color:#8a4712; }
.wisdom-quote.peterson-quote{ border-left-color:#2c2723; background:linear-gradient(180deg, #f2f0eb 0%, #e6e2da 100%); }
.wisdom-quote.peterson-quote::before{ color:#3a332c; }
.wisdom-quote.peterson-quote cite{ color:#3a332c; }
.truth-callout{ background:linear-gradient(160deg, #3a3129 0%, #262019 100%);
  color:#f0e2c6; padding:2rem 1.8rem 1.9rem; border-radius:var(--radius);
  border-left:5px solid var(--gold); margin:2.4rem 0; box-shadow:var(--shadow); }
.truth-callout h3{ margin:0 0 .8rem; color:var(--gold);
  font-family: ui-sans-serif, system-ui, sans-serif; font-size:.76rem;
  letter-spacing:.28em; text-transform:uppercase; font-weight:700; }
.truth-callout p{ margin:0 0 1rem; font-size:1.08rem; line-height:1.72; color:#e8dcc3; }
.truth-callout p:last-child{ margin-bottom:0; }
.truth-callout strong{ color:#f9edcf; }
.compare-table{ width:100%; border-collapse:collapse; margin:1.6rem 0;
  font-family: ui-sans-serif, system-ui, sans-serif; font-size:.92rem;
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.compare-table th,.compare-table td{ padding:.7rem .9rem; text-align:left;
  border-bottom:1px solid var(--line); vertical-align:top; }
.compare-table thead th{ background:linear-gradient(180deg,#3a3129 0%,#262019 100%);
  color:var(--gold); font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; font-size:.72rem; }
.compare-table tbody th{ color:var(--ink); font-weight:700; width:34%; }
.compare-table td{ color:var(--ink-2); }
.compare-table tr:last-child th,.compare-table tr:last-child td{ border-bottom:none; }
.stats-updated{ font-family: ui-sans-serif, system-ui, sans-serif; font-size:.72rem;
  letter-spacing:.1em; color:var(--muted); margin-top:1rem; }
.stats-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:1rem; margin:1.4rem 0 1.8rem; }
.stat-card{ background:linear-gradient(180deg,#fbf6ea 0%,#f2e7ce 100%);
  border:1px solid var(--line); border-top:3px solid var(--gold);
  border-radius:var(--radius); padding:1rem 1.1rem 1.1rem;
  box-shadow:var(--shadow); display:flex; flex-direction:column; gap:.25rem; }
.stat-value{ font-size:1.6rem; font-weight:800; letter-spacing:-.01em;
  color:var(--accent-2); line-height:1.1; }
.stat-label{ font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.76rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-2); line-height:1.35; }
.stat-note{ font-size:.78rem; color:var(--muted); line-height:1.45; }
.stat-source{ margin-top:.4rem; font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.62rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--line-2); text-decoration:none; }
.chart-wrap{ background:var(--panel); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:1.4rem 1.4rem 1.2rem; margin:1.6rem 0; }
.chart-wrap h3{ margin:0 0 1rem; font-size:1rem;
  font-family: ui-sans-serif, system-ui, sans-serif; letter-spacing:.04em; }
.chart-caption{ margin:.9rem 0 0; font-size:.82rem; color:var(--muted); line-height:1.55; }
.source-list{ margin-top:1.4rem; padding-top:1rem; border-top:1px solid var(--line); }
.source-list ul{ margin:0; padding-left:1.1rem; }
.source-list li{ margin:.25rem 0; font-size:.88rem; color:var(--ink-2); }
.source-note{ font-size:.78rem; color:var(--muted); font-style:italic;
  margin-top:.5rem; line-height:1.5; }
.site-footer{ margin-top:4rem; padding:2.6rem 1.25rem 2.2rem;
  background:linear-gradient(180deg,#262019 0%,#17130f 100%);
  border-top:3px solid var(--accent); color:#c3b7a2; text-align:center; }
.footer-emblem{ width:88px; height:88px; margin:0 auto 1rem; opacity:.92; }
.footer-title{ font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.74rem; letter-spacing:.34em; text-transform:uppercase;
  color:var(--gold); margin:0 0 .35rem; }
.footer-nav{ display:flex; justify-content:center; flex-wrap:wrap; gap:.2rem;
  margin:1.1rem 0 1.2rem; font-family: ui-sans-serif, system-ui, sans-serif; }
.footer-nav a{ color:#cbbda4; text-decoration:none; font-size:.72rem;
  letter-spacing:.16em; text-transform:uppercase; padding:.35rem .7rem; border-radius:3px; }
.footer-nav a:hover{ color:#fff; background:rgba(201,138,60,.16); }
.footer-note{ font-size:.78rem; color:#8e8270; max-width:52ch; margin:0 auto; line-height:1.6; }
.footer-rule{ width:64px; height:2px; background:var(--accent); margin:1.2rem auto 0; opacity:.7; }
/* ===== Section Table of Contents ===== */
.section-toc{
  background:linear-gradient(180deg, #fbf6ea 0%, #f2e7ce 100%);
  border:1px solid var(--line);
  border-left:4px solid var(--gold);
  border-radius:var(--radius);
  padding:1.4rem 1.5rem 1.5rem;
  box-shadow:var(--shadow);
  margin:2rem auto;
}
.section-toc .toc-kicker{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size:.66rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--accent-2);
  margin:0 0 .35rem;
  font-weight:700;
}
.section-toc h2{
  font-size:1.08rem;
  margin:0 0 1.1rem;
  padding:0 0 .6rem;
  border-bottom:1px solid var(--line);
  letter-spacing:.03em;
  position:relative;
}
.section-toc h2::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:52px;
  height:2px;
  background:var(--accent);
}
.section-toc .listing{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:.55rem .8rem;
}
.section-toc .listing li{ margin:0; }
.section-toc .listing a{
  display:block;
  padding:.62rem .9rem;
  background:#f8f3e9;
  border:1px solid var(--line);
  border-left:3px solid var(--gold);
  border-radius:3px;
  text-decoration:none;
  color:var(--ink-2);
  font-size:.92rem;
  line-height:1.35;
  transition:transform .12s ease, border-color .12s ease,
             background .12s ease, color .12s ease;
}
.section-toc .listing a:hover{
  background:linear-gradient(180deg, #fbf6ea 0%, #f2e7ce 100%);
  border-left-color:var(--accent);
  color:var(--accent-2);
  transform:translateX(2px);
}


/* ===== Workshop resource cards ===== */
.resource-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:1.1rem;
  margin:1.4rem 0 1.8rem;
}
.resource-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-top:3px solid var(--accent);
  border-radius:var(--radius);
  padding:1.15rem 1.25rem 1.25rem;
  box-shadow:var(--shadow);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.resource-card:hover{
  transform:translateY(-2px);
  box-shadow:0 3px 0 rgba(0,0,0,.05), 0 14px 30px rgba(70,45,20,.16);
  border-color:var(--line-2);
}
.resource-card h3{
  margin:0 0 .4rem;
  font-size:1.05rem;
  letter-spacing:.01em;
}
.resource-card h3 a{
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:border-color .12s ease, color .12s ease;
}
.resource-card h3 a:hover{
  color:var(--accent);
  border-bottom-color:var(--accent);
}
.resource-card p{
  margin:.35rem 0 0;
  font-size:.94rem;
  color:var(--ink-2);
  line-height:1.6;
}
.resource-phone{
  display:inline-block;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--accent-2);
  background:linear-gradient(180deg, #fbf6ea 0%, #f2e7ce 100%);
  border:1px solid var(--line);
  border-radius:3px;
  padding:.28rem .6rem;
  margin:.35rem 0 .1rem !important;
}
.resource-note{
  font-size:.82rem !important;
  color:var(--muted) !important;
  font-style:italic;
  margin-top:.5rem !important;
}

/* ===== Church locator ===== */
.church-locator{
  background:linear-gradient(180deg, #fbf6ea 0%, #f2e7ce 100%);
  border:1px solid var(--line);
  border-left:4px solid var(--gold);
  border-radius:var(--radius);
  padding:1.6rem 1.6rem 1.8rem;
  box-shadow:var(--shadow);
  margin:1.6rem 0;
}
.church-locator-label{
  display:block;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--accent-2);
  margin:0 0 .55rem;
}
.church-locator-row{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
}
.church-locator-input{
  flex:1 1 200px;
  min-width:0;
  padding:.85rem 1rem;
  border:1px solid var(--line-2);
  border-radius:3px;
  background:#fdfaf3;
  color:var(--ink);
  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size:1.05rem;
  letter-spacing:.18em;
  text-align:center;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.church-locator-input:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(201,138,60,.22);
}
.church-locator-input[aria-invalid="true"]{
  border-color:#b8420f;
  box-shadow:0 0 0 3px rgba(184,66,15,.18);
}
.church-locator-row .btn{
  flex:0 0 auto;
  cursor:pointer;
  font-family: ui-sans-serif, system-ui, sans-serif;
}
.church-locator-hint{
  margin:.7rem 0 0;
  font-size:.82rem;
  color:var(--muted);
  font-style:italic;
}
.church-locator-error{
  margin:.7rem 0 0;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size:.82rem;
  font-weight:700;
  color:#b8420f;
}
.church-locator-alt{
  margin-top:1.8rem;
  padding-top:1.4rem;
  border-top:1px solid var(--line);
}
.church-locator-alt h3{
  font-size:1.05rem;
  margin:0 0 .35rem;
}
.church-locator-alt p{
  margin:0 0 .9rem;
  font-size:.94rem;
  color:var(--ink-2);
}
.church-directory-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:.7rem;
}
.church-directory-list li{
  background:#fdfaf3;
  border:1px solid var(--line);
  border-left:3px solid var(--gold);
  border-radius:3px;
  padding:.75rem .95rem;
  transition:border-left-color .12s ease, background .12s ease;
}
.church-directory-list li:hover{
  border-left-color:var(--accent);
  background:linear-gradient(180deg, #fbf6ea 0%, #f2e7ce 100%);
}
.church-directory-list a{
  color:var(--ink-2);
  text-decoration:none;
  font-size:.93rem;
  line-height:1.55;
  display:block;
}
.church-directory-list a strong{
  color:var(--ink);
  display:inline;
}
.church-directory-list a:hover strong{
  color:var(--accent);
}

@media (max-width: 520px){
  .church-locator-row{
    flex-direction:column;
  }
  .church-locator-row .btn{
    width:100%;
    text-align:center;
  }
}

@media (max-width:820px){
  .nav-toggle{ display:block; }
  .site-nav{ display:none; position:absolute; top:100%; left:0; right:0;
    margin:0; flex-direction:column; align-items:stretch; gap:0;
    background:#241f1a; border-bottom:3px solid var(--accent);
    padding:.4rem .6rem .8rem; }
  .site-nav.open{ display:flex; }
  .site-nav a{ padding:.85rem 1rem; border-radius:3px; }
  .header-inner{ position:relative; flex-wrap:wrap; }
  .hero-inner{ padding:2.6rem 1.1rem 2.4rem; }
  .brand-sub{ display:none; }
  .compare-table{ font-size:.82rem; }
  .compare-table th,.compare-table td{ padding:.55rem .6rem; }
}
@media (max-width:480px){
  body{ font-size:16px; }
  .brand-title{ font-size:.95rem; letter-spacing:.1em; }
  .grid{ grid-template-columns:1fr; }
  .stats-grid{ grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; animation:none !important; }
  html{ scroll-behavior:auto; }
}

/* === barron-quote === */
.wisdom-quote.barron-quote{
  border-left-color:#2c3e5c;
  background:linear-gradient(180deg, #eef1f6 0%, #dde3ec 100%);
}
.wisdom-quote.barron-quote::before{ color:#2c3e5c; }
.wisdom-quote.barron-quote cite{ color:#2c3e5c; }

/* === philosopher-quote === */
.wisdom-quote.philosopher-quote{
  border-left-color:#4a3520;
  background:linear-gradient(180deg, #f5efe3 0%, #ebe1cf 100%);
}
.wisdom-quote.philosopher-quote::before{ color:#4a3520; }
.wisdom-quote.philosopher-quote cite{ color:#4a3520; }
.wisdom-quote.rousseau-quote{ border-left-color:#6b4f2c; }
.wisdom-quote.rousseau-quote::before{ color:#6b4f2c; }
.wisdom-quote.rousseau-quote cite{ color:#6b4f2c; }
.wisdom-quote.feuerbach-quote{ border-left-color:#5a4a35; }
.wisdom-quote.feuerbach-quote::before{ color:#5a4a35; }
.wisdom-quote.feuerbach-quote cite{ color:#5a4a35; }
.wisdom-quote.marx-quote{ border-left-color:#8a2c2c; }
.wisdom-quote.marx-quote::before{ color:#8a2c2c; }
.wisdom-quote.marx-quote cite{ color:#8a2c2c; }
.wisdom-quote.nietzsche-quote{ border-left-color:#3a2a1a; }
.wisdom-quote.nietzsche-quote::before{ color:#3a2a1a; }
.wisdom-quote.nietzsche-quote cite{ color:#3a2a1a; }
.wisdom-quote.darwin-quote{ border-left-color:#2c4a35; }
.wisdom-quote.darwin-quote::before{ color:#2c4a35; }
.wisdom-quote.darwin-quote cite{ color:#2c4a35; }
.wisdom-quote.freud-quote{ border-left-color:#2c3e5c; }
.wisdom-quote.freud-quote::before{ color:#2c3e5c; }
.wisdom-quote.freud-quote cite{ color:#2c3e5c; }

/* === header nav shift left (added by adjust_nav.py) === */
@media (min-width: 821px) {
  .site-nav {
    margin-right: 2.25rem;
  }
}

/* ============================================================
   LIBRARY LAYOUT OVERRIDE — header + skip link
   These rules force the correct desktop layout on every page,
   regardless of what the mobile CSS is trying to do. The mobile
   layout still applies below 820px as designed.
   ============================================================ */

/* Skip link must be off-screen until focused */
.skip{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
}
.skip:focus,
.skip:active{
  left:1rem !important;
  top:1rem !important;
  width:auto !important;
  height:auto !important;
  overflow:visible !important;
  clip:auto !important;
  background:var(--accent);
  color:#fff;
  padding:.6rem 1rem;
  z-index:99999;
}

/* Force the nav toggle button hidden on desktop */
@media (min-width:821px){
  .nav-toggle{
    display:none !important;
    visibility:hidden !important;
  }

  /* Force horizontal nav on desktop regardless of any .open class */
  .site-nav,
  .site-nav.open{
    position:static !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:.15rem !important;
    margin-left:auto !important;
    padding:0 0 0 .75rem !important;
    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    max-height:none !important;
    overflow:visible !important;
    width:auto !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
  }

  .site-nav a,
  .site-nav.open a{
    display:inline-block !important;
    padding:.55rem .82rem !important;
    font-size:.78rem !important;
    letter-spacing:.15em !important;
    min-height:auto !important;
    border-radius:3px !important;
    background:transparent !important;
    color:#e6dac2 !important;
    width:auto !important;
  }

  .site-nav a:hover{
    background:rgba(201,138,60,.16) !important;
    border-color:rgba(201,138,60,.45) !important;
    color:#fff !important;
  }

  .site-nav a.active,
  .site-nav a[aria-current="page"]{
    background:var(--accent) !important;
    border-color:var(--accent-2) !important;
    color:#fff !important;
  }

  .site-nav a.kjv-link{
    border:1px solid rgba(201,138,60,.55) !important;
    color:var(--gold) !important;
    margin-left:.25rem !important;
  }

  /* Header stays in a single row on desktop */
  .header-inner{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    position:relative !important;
  }

  .brand{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:.7rem !important;
  }
}

/* On mobile, still allow the nav to open cleanly via the hamburger */
@media (max-width:820px){
  .site-nav:not(.open){
    display:none !important;
  }
}

/* ============================================================
   SHIMMER EFFECT — forge/gold theme
   A slow diagonal sweep of light across buttons and quote boxes
   on hover. Only runs on devices that actually hover, so touch
   devices are unaffected.
   ============================================================ */

@keyframes ff-shimmer {
  0%   { background-position: -180% 0; }
  100% { background-position: 280% 0; }
}

@keyframes ff-glow-pulse {
  0%   { box-shadow: var(--shadow); }
  50%  { box-shadow: var(--shadow),
                     0 0 22px rgba(201,138,60,.35); }
  100% { box-shadow: var(--shadow); }
}

@media (hover: hover) and (pointer: fine) {

  /* ---------- Buttons ---------- */
  .btn,
  button.btn,
  input[type="button"],
  input[type="submit"] {
    position: relative;
    overflow: hidden;
    isolation: isolate;
  }

  .btn::after,
  button.btn::after,
  input[type="button"]::after,
  input[type="submit"]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 30%,
      rgba(255,235,190,0)   42%,
      rgba(255,235,190,.55) 50%,
      rgba(255,235,190,0)   58%,
      transparent 70%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    z-index: 1;
    transition: opacity .18s ease;
  }

  .btn:hover::after,
  button.btn:hover::after,
  input[type="button"]:hover::after,
  input[type="submit"]:hover::after {
    opacity: 1;
    animation: ff-shimmer 1.1s ease-out;
  }

  /* Primary buttons get a slightly warmer shimmer sweep */
  .btn-primary::after {
    background: linear-gradient(
      115deg,
      transparent 30%,
      rgba(255,240,200,0)   42%,
      rgba(255,240,200,.7)  50%,
      rgba(255,240,200,0)   58%,
      transparent 70%
    );
  }

  /* ---------- Scripture inline boxes ---------- */
  .scripture-inline {
    position: relative;
    overflow: hidden;
    transition: box-shadow .25s ease;
  }

  .scripture-inline::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 30%,
      rgba(255,235,190,0)   40%,
      rgba(255,235,190,.45) 50%,
      rgba(255,235,190,0)   60%,
      transparent 70%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
  }

  .scripture-inline:hover::before {
    opacity: 1;
    animation: ff-shimmer 1.3s ease-out;
  }

  .scripture-inline:hover {
    box-shadow: var(--shadow),
                0 0 22px rgba(201,138,60,.30);
  }

  /* ---------- Wisdom quotes (Prager / Peterson / philosopher) ---------- */
  .wisdom-quote {
    position: relative;
    overflow: hidden;
    transition: box-shadow .25s ease;
  }

  .wisdom-quote::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 30%,
      rgba(255,235,190,0)   40%,
      rgba(255,235,190,.40) 50%,
      rgba(255,235,190,0)   60%,
      transparent 70%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
  }

  .wisdom-quote:hover::after {
    opacity: 1;
    animation: ff-shimmer 1.3s ease-out;
  }

  .wisdom-quote:hover {
    box-shadow: var(--shadow),
                0 0 24px rgba(201,138,60,.32);
  }

  /* ---------- Scripture pull boxes (side pages) ---------- */
  .pull-scripture,
  .stat-scripture,
  .scripture blockquote {
    position: relative;
    overflow: hidden;
    transition: box-shadow .25s ease;
  }

  .pull-scripture::after,
  .stat-scripture::after,
  .scripture blockquote::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 32%,
      rgba(255,235,190,0)   42%,
      rgba(255,235,190,.42) 50%,
      rgba(255,235,190,0)   58%,
      transparent 68%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
  }

  .pull-scripture:hover::after,
  .stat-scripture:hover::after,
  .scripture blockquote:hover::after {
    opacity: 1;
    animation: ff-shimmer 1.3s ease-out;
  }

  .pull-scripture:hover,
  .stat-scripture:hover,
  .scripture blockquote:hover {
    box-shadow: var(--shadow),
                0 0 24px rgba(201,138,60,.28);
  }

  /* ---------- Pull think boxes (dark) ---------- */
  .pull-stat,
  .pull-thinker,
  .truth-callout {
    position: relative;
    overflow: hidden;
    transition: box-shadow .25s ease;
  }

  .pull-stat::after,
  .pull-thinker::after,
  .truth-callout::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 32%,
      rgba(255,215,140,0)   42%,
      rgba(255,215,140,.35) 50%,
      rgba(255,215,140,0)   58%,
      transparent 68%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
  }

  .pull-stat:hover::after,
  .pull-thinker:hover::after,
  .truth-callout:hover::after {
    opacity: 1;
    animation: ff-shimmer 1.4s ease-out;
  }

  .pull-stat:hover,
  .pull-thinker:hover,
  .truth-callout:hover {
    box-shadow: var(--shadow),
                0 0 26px rgba(201,138,60,.30);
  }

  /* ---------- Library notice box ---------- */
  .library-notice {
    position: relative;
    overflow: hidden;
    transition: box-shadow .25s ease;
  }

  .library-notice::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      115deg,
      transparent 32%,
      rgba(255,235,190,0)   42%,
      rgba(255,235,190,.42) 50%,
      rgba(255,235,190,0)   58%,
      transparent 68%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    background-position: -180% 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
  }

  .library-notice:hover::after {
    opacity: 1;
    animation: ff-shimmer 1.3s ease-out;
  }

  .library-notice:hover {
    box-shadow: var(--shadow),
                0 0 24px rgba(201,138,60,.30);
  }

  /* ---------- Cards: subtle glow pulse on hover ---------- */
  .card {
    transition: transform .14s ease,
                box-shadow .25s ease,
                border-color .14s ease;
  }

  .card:hover {
    animation: ff-glow-pulse 1.6s ease-out;
  }
}

/* ---------- Respect reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .btn::after,
  .scripture-inline::before,
  .wisdom-quote::after,
  .pull-scripture::after,
  .pull-stat::after,
  .pull-thinker::after,
  .stat-scripture::after,
  .truth-callout::after,
  .library-notice::after,
  .scripture blockquote::after {
    animation: none !important;
    opacity: 0 !important;
  }
  .card:hover { animation: none !important; }
}

/* ============================================================
   HOUSEKEEPING + TRIBUTE
   ============================================================ */

.housekeeping-list{
  list-style:none;
  padding:0;
  margin:1.4rem 0 0;
  counter-reset:housekeeping;
}

.housekeeping-list li{
  position:relative;
  padding:1rem 1.2rem 1rem 3.4rem;
  background:var(--panel);
  border:1px solid var(--line);
  border-left:4px solid var(--accent);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  margin:0 0 .8rem;
  font-size:1.02rem;
  line-height:1.65;
  color:var(--ink-2);
  transition:transform .15s ease, box-shadow .25s ease;
}

.housekeeping-list li:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow), 0 12px 28px rgba(70,45,20,.15);
}

.housekeeping-list li::before{
  counter-increment:housekeeping;
  content:counter(housekeeping);
  position:absolute;
  left:1rem;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#fbf5e8 0%,#f1e5cc 100%);
  border:1px solid var(--line);
  border-radius:50%;
  font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:.72rem;
  font-weight:800;
  color:var(--accent-2);
  letter-spacing:.02em;
}

.tribute-block{
  margin:2rem 0;
  padding:1.4rem 1.5rem 1.5rem;
  background:var(--panel);
  border:1px solid var(--line);
  border-left:4px solid var(--gold);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.tribute-block h3{
  margin:0 0 1rem;
  font-size:1.05rem;
  letter-spacing:.02em;
  color:var(--accent-2);
  padding-bottom:.55rem;
  border-bottom:1px solid var(--line);
}

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

.tribute-list li{
  position:relative;
  padding:.55rem 0 .55rem 1.6rem;
  font-size:1.02rem;
  line-height:1.65;
  color:var(--ink-2);
  border-bottom:1px dashed var(--line);
}

.tribute-list li:last-child{border-bottom:none}

.tribute-list li::before{
  content:"";
  position:absolute;
  left:.2rem;
  top:1.05rem;
  width:8px;
  height:8px;
  background:var(--gold);
  border-radius:50%;
  box-shadow:0 0 0 3px rgba(201,138,60,.18);
}

.tribute-paragraph{
  margin:0 0 .9rem;
  font-size:1.04rem;
  line-height:1.72;
  color:var(--ink-2);
}

.tribute-thanks{
  text-align:center;
  background:linear-gradient(180deg,#fbf5e8 0%,#f1e5cc 100%);
  border-left-color:var(--accent);
}

.tribute-thanks-line{
  margin:0;
  font-size:1.3rem;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--accent-2);
  font-style:italic;
}

.tribute-blessing{
  margin:1rem 0 0;
  text-align:center;
  font-size:1.14rem;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--accent-2);
  font-style:italic;
}

.tribute-happy{
  margin-top:.4rem;
  font-size:1.24rem;
  color:var(--gold);
}

@media (max-width:640px){
  .housekeeping-list li{
    padding:.85rem .9rem .85rem 2.9rem;
    font-size:.98rem;
  }
  .housekeeping-list li::before{
    left:.85rem;
    width:24px;
    height:24px;
    font-size:.66rem;
  }
  .tribute-block{padding:1.1rem 1.1rem 1.2rem}
  .tribute-block h3{font-size:.98rem}
  .tribute-list li{font-size:.98rem}
  .tribute-thanks-line{font-size:1.1rem}
  .tribute-blessing{font-size:1rem}
  .tribute-happy{font-size:1.08rem}
}

/* ============================================================
   QUOTE BOX GLOW — forged metal / light from within
   Applies to scripture boxes, hero quote, and wisdom quotes.
   Runs only on hover-capable devices.
   ============================================================ */

@keyframes ff-forge-glow {
  0% {
    box-shadow:var(--shadow), inset 0 0 0 rgba(201,138,60,0);
    border-color:var(--line);
  }
  35% {
    box-shadow:var(--shadow),
               0 0 24px rgba(201,138,60,.45),
               inset 0 0 18px rgba(201,138,60,.12);
    border-color:var(--gold);
  }
  70% {
    box-shadow:var(--shadow),
               0 0 32px rgba(201,138,60,.55),
               inset 0 0 26px rgba(201,138,60,.18);
    border-color:var(--gold);
  }
  100% {
    box-shadow:var(--shadow), inset 0 0 0 rgba(201,138,60,0);
    border-color:var(--line);
  }
}

@keyframes ff-forge-sweep {
  0%   { background-position: -220% 0; opacity: 0; }
  15%  { opacity: 1; }
  100% { background-position: 320% 0; opacity: 0; }
}

@media (hover: hover) and (pointer: fine) {

  /* Scripture hero + inline boxes */
  .scripture blockquote,
  .scripture-inline,
  .pull-scripture,
  .stat-scripture,
  .wisdom-quote,
  .pull-thinker,
  .truth-callout,
  .library-notice {
    position:relative;
    overflow:hidden;
    isolation:isolate;
    transition:border-color .3s ease;
  }

  /* The sweep — a diagonal shaft of warm light */
  .scripture blockquote::after,
  .scripture-inline::after,
  .pull-scripture::after,
  .stat-scripture::after,
  .wisdom-quote::after,
  .pull-thinker::after,
  .truth-callout::after,
  .library-notice::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
      118deg,
      transparent 30%,
      rgba(255,235,190,0)   40%,
      rgba(255,235,190,.55) 50%,
      rgba(255,235,190,0)   60%,
      transparent 70%
    );
    background-size:240% 100%;
    background-repeat:no-repeat;
    background-position:-220% 0;
    pointer-events:none;
    opacity:0;
    z-index:1;
    mix-blend-mode:screen;
  }

  .scripture blockquote:hover::after,
  .scripture-inline:hover::after,
  .pull-scripture:hover::after,
  .stat-scripture:hover::after,
  .wisdom-quote:hover::after,
  .pull-thinker:hover::after,
  .truth-callout:hover::after,
  .library-notice:hover::after {
    animation:ff-forge-sweep 1.35s ease-out;
  }

  /* The glow — inner and outer, like forged metal */
  .scripture blockquote:hover,
  .scripture-inline:hover,
  .pull-scripture:hover,
  .stat-scripture:hover,
  .wisdom-quote:hover,
  .pull-thinker:hover,
  .truth-callout:hover,
  .library-notice:hover {
    animation:ff-forge-glow 1.6s ease-in-out;
  }

  /* Dark quote boxes get a warmer inner glow */
  .pull-stat:hover,
  .pull-thinker:hover,
  .truth-callout:hover {
    animation:ff-forge-glow-dark 1.6s ease-in-out;
  }
}

@keyframes ff-forge-glow-dark {
  0% {
    box-shadow:var(--shadow), inset 0 0 0 rgba(255,215,140,0);
  }
  40% {
    box-shadow:var(--shadow),
               0 0 28px rgba(255,215,140,.5),
               inset 0 0 22px rgba(255,215,140,.16);
  }
  75% {
    box-shadow:var(--shadow),
               0 0 36px rgba(255,215,140,.6),
               inset 0 0 30px rgba(255,215,140,.22);
  }
  100% {
    box-shadow:var(--shadow), inset 0 0 0 rgba(255,215,140,0);
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .scripture blockquote::after,
  .scripture-inline::after,
  .pull-scripture::after,
  .stat-scripture::after,
  .wisdom-quote::after,
  .pull-thinker::after,
  .truth-callout::after,
  .library-notice::after { animation:none !important; opacity:0 !important; }
  .scripture blockquote:hover,
  .scripture-inline:hover,
  .pull-scripture:hover,
  .stat-scripture:hover,
  .wisdom-quote:hover,
  .pull-thinker:hover,
  .truth-callout:hover,
  .library-notice:hover,
  .pull-stat:hover { animation:none !important; }
}

/* ============================================================
   HOUSEKEEPING PANEL — self-contained bordered section
   ============================================================ */

.housekeeping-panel{
  max-width:var(--maxw);
  margin:2.4rem auto;
  padding:1.8rem 1.6rem 2rem;
  background:linear-gradient(180deg,#fbf6ea 0%,#efe4cc 100%);
  border:2px solid var(--line-2);
  border-top:6px solid var(--accent);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.housekeeping-panel-head{
  padding-bottom:1rem;
  margin-bottom:1.2rem;
  border-bottom:2px solid var(--line);
}

.housekeeping-panel-head h2{
  margin:0;
  font-size:1.4rem;
  letter-spacing:.02em;
  color:var(--accent-2);
  position:relative;
  padding-bottom:.4rem;
}

.housekeeping-panel-head h2::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-6px;
  width:64px;
  height:3px;
  background:var(--accent);
}

.housekeeping-panel .housekeeping-list{
  list-style:none;
  padding:0;
  margin:.6rem 0 0;
  counter-reset:housekeeping;
}

.housekeeping-panel .housekeeping-list li{
  position:relative;
  padding:1rem 1.2rem 1rem 3.4rem;
  background:var(--panel);
  border:1px solid var(--line);
  border-left:4px solid var(--accent);
  border-radius:var(--radius);
  box-shadow:0 1px 0 rgba(0,0,0,.03);
  margin:0 0 .8rem;
  font-size:1.02rem;
  line-height:1.65;
  color:var(--ink-2);
  transition:transform .15s ease, box-shadow .25s ease,
             border-color .2s ease;
}

.housekeeping-panel .housekeeping-list li:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow), 0 12px 28px rgba(70,45,20,.15);
  border-left-color:var(--gold);
}

.housekeeping-panel .housekeeping-list li::before{
  counter-increment:housekeeping;
  content:counter(housekeeping);
  position:absolute;
  left:1rem;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#fbf5e8 0%,#f1e5cc 100%);
  border:1px solid var(--line);
  border-radius:50%;
  font-family:ui-sans-serif,system-ui,sans-serif;
  font-size:.72rem;
  font-weight:800;
  color:var(--accent-2);
}

/* Tribute blocks inside the same panel */
.housekeeping-panel .tribute-block{
  margin:1.4rem 0 0;
  padding:1.3rem 1.4rem 1.4rem;
  background:var(--panel);
  border:1px solid var(--line);
  border-left:4px solid var(--gold);
  border-radius:var(--radius);
  box-shadow:0 1px 0 rgba(0,0,0,.03);
}

/* ============================================================
   FOR FATHERS — content in the "Read the Times" section
   ============================================================ */

.for-fathers{
  margin:1.8rem 0 0;
  padding:1.5rem 1.6rem 1.6rem;
  background:linear-gradient(180deg,#fbf6ea 0%,#efe4cc 100%);
  border:1px solid var(--line);
  border-left:5px solid var(--accent);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.for-fathers h3{
  margin:0 0 .9rem;
  font-size:1.12rem;
  color:var(--accent-2);
  letter-spacing:.02em;
  padding-bottom:.55rem;
  border-bottom:1px solid var(--line);
}

.for-fathers p{
  margin:0 0 .9rem;
  font-size:1.02rem;
  line-height:1.72;
  color:var(--ink-2);
}

.for-fathers p:last-child{margin-bottom:0}
.for-fathers em{color:var(--ink)}

/* ============================================================
   QUOTE BOX GLOW — forced specificity so it applies
   ============================================================ */

/* Apply pulse keyframes to element itself, not just :hover */
@keyframes ff-forge-pulse {
  0%   { box-shadow:var(--shadow); }
  35%  { box-shadow:var(--shadow),
                     0 0 24px rgba(201,138,60,.45),
                     inset 0 0 16px rgba(201,138,60,.12); }
  70%  { box-shadow:var(--shadow),
                     0 0 32px rgba(201,138,60,.55),
                     inset 0 0 26px rgba(201,138,60,.18); }
  100% { box-shadow:var(--shadow); }
}

@keyframes ff-forge-sweep-2 {
  0%   { background-position:-220% 0; opacity:0; }
  20%  { opacity:1; }
  100% { background-position:320% 0; opacity:0; }
}

/* Use both class AND attribute selectors to raise specificity */
body .scripture blockquote,
body .scripture-inline,
body .pull-scripture,
body .stat-scripture,
body .wisdom-quote,
body .pull-thinker,
body .pull-stat,
body .truth-callout,
body .library-notice,
body .for-fathers,
body .housekeeping-panel .housekeeping-list li {
  position:relative;
  isolation:isolate;
}

/* The sweep layer */
body .scripture blockquote::after,
body .scripture-inline::after,
body .pull-scripture::after,
body .stat-scripture::after,
body .wisdom-quote::after,
body .pull-thinker::after,
body .pull-stat::after,
body .truth-callout::after,
body .library-notice::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    118deg,
    transparent 30%,
    rgba(255,235,190,0)   40%,
    rgba(255,235,190,.58) 50%,
    rgba(255,235,190,0)   60%,
    transparent 70%
  );
  background-size:240% 100%;
  background-repeat:no-repeat;
  background-position:-220% 0;
  pointer-events:none;
  opacity:0;
  z-index:1;
  border-radius:inherit;
  mix-blend-mode:screen;
}

body .scripture blockquote:hover::after,
body .scripture-inline:hover::after,
body .pull-scripture:hover::after,
body .stat-scripture:hover::after,
body .wisdom-quote:hover::after,
body .pull-thinker:hover::after,
body .pull-stat:hover::after,
body .truth-callout:hover::after,
body .library-notice:hover::after {
  animation:ff-forge-sweep-2 1.4s ease-out;
}

/* Glow layer */
body .scripture blockquote:hover,
body .scripture-inline:hover,
body .pull-scripture:hover,
body .stat-scripture:hover,
body .wisdom-quote:hover,
body .pull-thinker:hover,
body .truth-callout:hover,
body .library-notice:hover {
  animation:ff-forge-pulse 1.6s ease-in-out;
}

/* Allow the sweep to escape the box border by not clipping content */
body .pull-thinker,
body .wisdom-quote,
body .scripture-inline,
body .pull-scripture,
body .truth-callout,
body .library-notice {
  overflow:hidden;
}

/* Mobile — no hover, so no shimmer */
@media (hover: none) {
  body .scripture blockquote::after,
  body .scripture-inline::after,
  body .pull-scripture::after,
  body .stat-scripture::after,
  body .wisdom-quote::after,
  body .pull-thinker::after,
  body .pull-stat::after,
  body .truth-callout::after,
  body .library-notice::after { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  body .scripture blockquote:hover,
  body .scripture-inline:hover,
  body .pull-scripture:hover,
  body .stat-scripture:hover,
  body .wisdom-quote:hover,
  body .pull-thinker:hover,
  body .pull-stat:hover,
  body .truth-callout:hover,
  body .library-notice:hover { animation:none !important; }
  body .scripture blockquote:hover::after,
  body .scripture-inline:hover::after,
  body .pull-scripture:hover::after,
  body .stat-scripture:hover::after,
  body .wisdom-quote:hover::after,
  body .pull-thinker:hover::after,
  body .pull-stat:hover::after,
  body .truth-callout:hover::after,
  body .library-notice:hover::after { animation:none !important; opacity:0 !important; }
}

@media (max-width:640px){
  .housekeeping-panel{padding:1.2rem 1rem 1.4rem; margin:1.6rem auto}
  .housekeeping-panel-head h2{font-size:1.15rem}
  .housekeeping-panel .housekeeping-list li{
    padding:.85rem .9rem .85rem 2.9rem;
    font-size:.98rem;
  }
  .housekeeping-panel .housekeeping-list li::before{
    left:.85rem; width:24px; height:24px; font-size:.66rem;
  }
  .for-fathers{padding:1.15rem 1.1rem 1.2rem}
  .for-fathers h3{font-size:1rem}
}


/* ============================================================
   FORGE & FOUNDATION — RUGGED RETHEME
   Appended override. Palette: charcoal, iron, tobacco, oxblood,
   aged brass. Typography: worn serif for body, chiseled small-caps
   for headings. Borders: riveted, beveled, hand-worked.
   Everything below overrides what came before without deleting it.
   ============================================================ */

/* ---------------------------------------------------------- */
/*  PALETTE                                                    */
/* ---------------------------------------------------------- */
:root{
  /* Ground */
  --bg:          #1f1b17;   /* dark iron */
  --bg-2:        #26211c;
  --panel:       #f2e8d5;   /* aged parchment */
  --panel-2:     #e8dcc2;
  --panel-dark:  #2a241f;   /* dark panel for accents */

  /* Ink */
  --ink:         #1a1613;
  --ink-2:       #3a3027;
  --muted:       #6b5d4a;

  /* Metals & accents */
  --line:        #8f7956;   /* aged brass */
  --line-2:      #6f5c3d;
  --brass:       #b98a3c;
  --brass-2:     #8a6325;
  --brass-glow:  rgba(185,138,60,.42);
  --oxblood:     #6f1c1c;   /* deep leather red */
  --oxblood-2:   #4a1212;
  --iron:        #2a241f;
  --tobacco:     #7a4a1e;
  --gold:        #c99a4a;
  --accent:      #8a3a1a;   /* burnt sienna */
  --accent-2:    #5c230f;

  /* Shadows */
  --shadow:      0 1px 0 rgba(0,0,0,.35),
                 0 10px 26px rgba(0,0,0,.30);
  --shadow-lift: 0 3px 0 rgba(0,0,0,.35),
                 0 18px 40px rgba(0,0,0,.45);

  --radius: 3px;
  --maxw: 1200px;
}

/* ---------------------------------------------------------- */
/*  TYPOGRAPHY                                                 */
/* ---------------------------------------------------------- */
body{
  font-family: "Iowan Old Style","Book Antiqua","Palatino Linotype",
               Palatino, Georgia, "Times New Roman", serif;
  font-size: 17.5px;
  line-height: 1.72;
  letter-spacing: .005em;
  color: var(--ink);
  background-color: var(--bg);
  background-image:
    radial-gradient(1200px 600px at 12% -10%,
                    rgba(185,138,60,.10), transparent 60%),
    radial-gradient(900px 520px at 92% 108%,
                    rgba(111,28,28,.10), transparent 62%),
    repeating-linear-gradient(0deg,
                    rgba(255,240,210,.012) 0 1px,
                    transparent 1px 4px),
    repeating-linear-gradient(90deg,
                    rgba(0,0,0,.09) 0 1px,
                    transparent 1px 4px);
  background-attachment: fixed;
}

h1,h2,h3,h4{
  font-family: "Iowan Old Style","Book Antiqua","Palatino Linotype",
               Palatino, Georgia, serif;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--ink);
}

h1.hero-title{
  font-size: clamp(2.1rem, 5.2vw, 3.4rem);
  letter-spacing: .015em;
  text-shadow: 0 3px 20px rgba(0,0,0,.65),
               0 1px 0 rgba(255,220,160,.15);
}

/* Chiseled small-caps for section headings */
.section h2{
  font-family: "Iowan Old Style","Palatino Linotype", Palatino,
               Georgia, serif;
  font-size: 1.52rem;
  letter-spacing: .04em;
  text-transform: none;
  border-bottom-color: var(--line);
  padding-bottom: .6rem;
}
.section h2::after{
  height: 3px;
  width: 84px;
  background: linear-gradient(90deg,
              var(--brass) 0%, var(--oxblood) 100%);
  box-shadow: 0 0 12px var(--brass-glow);
}

.section h3{
  font-size: 1.14rem;
  letter-spacing: .03em;
  color: var(--accent-2);
}

/* Slightly larger, more grounded body copy */
.prose p,
.lede,
.section p{
  font-size: 1.045rem;
  line-height: 1.78;
  color: var(--ink-2);
}

.lede{
  font-size: 1.12rem;
  color: var(--ink-2);
}

em{ color: var(--ink); }
strong{ color: var(--ink); letter-spacing: .01em; }

/* ============================================================
   HEADER — dark iron with brass rivet line
   ============================================================ */
.site-header{
  background: linear-gradient(180deg, #1a1613 0%, #0f0c0a 100%);
  border-bottom: 3px solid var(--brass);
  box-shadow: 0 3px 0 rgba(0,0,0,.5),
              0 8px 24px rgba(0,0,0,.5);
  position: relative;
}
.site-header::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 3px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 8px,
      var(--brass-2) 8px 10px,
      transparent 10px 18px
    );
  opacity: .55;
}

.brand-title{
  color: #f0dcb8;
  letter-spacing: .2em;
  text-shadow: 0 1px 0 rgba(0,0,0,.6),
               0 0 12px rgba(185,138,60,.25);
}
.brand-sub{ color: var(--brass); }

.site-nav a{
  color: #e2d3b1;
  border-radius: 3px;
  position: relative;
}
.site-nav a:hover{
  background: rgba(185,138,60,.15);
  border-color: rgba(185,138,60,.55);
  color: #fff;
}
.site-nav a.active{
  background: linear-gradient(180deg, var(--brass) 0%,
                                       var(--brass-2) 100%);
  color: #17130f;
  border-color: var(--brass-2);
  box-shadow: inset 0 1px 0 rgba(255,220,160,.4),
              0 2px 8px rgba(0,0,0,.45);
}
.site-nav a.kjv-link{
  color: var(--gold);
  border-color: rgba(201,154,74,.6);
}
.site-nav a.kjv-link:hover{
  background: rgba(201,154,74,.22);
  color: #fff;
}

/* ============================================================
   HERO — dark iron with brass rivet edges
   ============================================================ */
.hero{
  background:
    linear-gradient(160deg, #2a241f 0%, #1a1613 60%, #0f0c0a 100%);
  border-bottom: 3px solid var(--brass);
  position: relative;
}
.hero::before{
  opacity: .16;
  filter: drop-shadow(0 0 24px rgba(185,138,60,.35));
}
.hero::after{
  background:
    radial-gradient(ellipse at 50% 22%,
                    rgba(185,138,60,.22), transparent 64%),
    linear-gradient(180deg,
                    rgba(0,0,0,.20) 0%,
                    rgba(0,0,0,0) 34%,
                    rgba(0,0,0,.34) 100%);
}
.hero-kicker{ color: var(--gold); }
.hero-lead{ color: #ded0b4; }

/* ============================================================
   BUTTONS — riveted metal look
   ============================================================ */
.btn, button.btn{
  font-family: ui-sans-serif, system-ui, -apple-system,
               "Segoe UI", sans-serif;
  letter-spacing: .2em;
  border-radius: 3px;
  border: 1px solid rgba(185,138,60,.55);
  background: linear-gradient(180deg,
              rgba(255,240,200,.06) 0%,
              rgba(0,0,0,.14) 100%);
  color: #f0e0bd;
  text-shadow: 0 1px 0 rgba(0,0,0,.5);
  box-shadow: inset 0 1px 0 rgba(255,220,160,.18),
              0 2px 8px rgba(0,0,0,.35);
}
.btn:hover{
  background: linear-gradient(180deg,
              rgba(255,220,160,.20) 0%,
              rgba(255,220,160,.05) 100%);
  border-color: var(--brass);
  color: #fff;
}
.btn-primary{
  background: linear-gradient(180deg,
              var(--brass) 0%, var(--brass-2) 100%);
  border-color: var(--brass-2);
  color: #17130f;
  text-shadow: 0 1px 0 rgba(255,220,160,.35);
}
.btn-primary:hover{
  background: linear-gradient(180deg,
              #d9a24a 0%, #9a6f28 100%);
  color: #100c08;
}

/* ============================================================
   CONTENT CONTAINERS — riveted panels
   ============================================================ */
.card,
.panel,
.section-toc,
.housekeeping-panel,
.library-notice,
.for-fathers,
.chart-wrap,
.stat-card,
.resource-card,
.church-locator,
.scripture-inline,
.wisdom-quote,
.scripture blockquote,
.pull-scripture,
.pull-stat,
.pull-thinker,
.stat-scripture,
.truth-callout,
.profile-header,
.map-figure,
.compare-table{
  border-radius: 3px;
  position: relative;
  box-shadow:
    inset 0 0 0 1px rgba(255,240,210,.22),
    inset 0 1px 0 rgba(255,255,255,.35),
    0 1px 0 rgba(0,0,0,.15),
    0 10px 26px rgba(0,0,0,.16);
}

/* Riveted corners using pseudo-element dots — one per corner of
   the more prominent containers */
.card::before,
.section-toc::before,
.housekeeping-panel::before,
.library-notice::before,
.for-fathers::before{
  content: "";
  position: absolute;
  inset: 6px;
  border-radius: 2px;
  pointer-events: none;
  background:
    radial-gradient(circle at 0 0,
      rgba(185,138,60,.7) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 0,
      rgba(185,138,60,.7) 0 2px, transparent 3px),
    radial-gradient(circle at 0 100%,
      rgba(185,138,60,.7) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 100%,
      rgba(185,138,60,.7) 0 2px, transparent 3px);
  background-repeat: no-repeat;
}

/* Card accents — brass top border */
.card{
  background:
    linear-gradient(180deg,
      #f6ecd7 0%, #ecdfc3 100%);
  border: 1px solid var(--line);
  border-top: 3px solid var(--brass);
  transition: transform .16s ease, box-shadow .22s ease,
              border-color .16s ease;
}
.card:hover{
  transform: translateY(-3px);
  box-shadow:
    inset 0 0 0 1px rgba(255,240,210,.28),
    inset 0 1px 0 rgba(255,255,255,.42),
    0 3px 0 rgba(0,0,0,.15),
    0 20px 44px rgba(0,0,0,.28);
  border-color: var(--line-2);
  border-top-color: var(--oxblood);
}
.card h3 a{ color: var(--ink); }
.card h3 a:hover{ color: var(--oxblood); }
.card .card-meta{
  color: var(--tobacco);
  border-top-color: var(--line);
}

/* Section TOC panel */
.section-toc{
  background: linear-gradient(180deg,
              #f6ecd7 0%, #e9dcc0 100%);
  border: 1px solid var(--line);
  border-left: 5px solid var(--brass);
  padding: 1.5rem 1.6rem 1.6rem;
}
.section-toc h2{
  color: var(--ink);
  border-bottom-color: var(--line);
}
.section-toc h2::after{
  background: linear-gradient(90deg,
              var(--brass), var(--oxblood));
  box-shadow: 0 0 12px var(--brass-glow);
}
.section-toc .listing a{
  background: linear-gradient(180deg,
              #fbf6ea 0%, #f0e5ca 100%);
  border: 1px solid var(--line);
  border-left: 3px solid var(--brass);
  color: var(--ink-2);
}
.section-toc .listing a:hover{
  background: linear-gradient(180deg,
              #fbf5e6 0%, #f1e2bd 100%);
  border-left-color: var(--oxblood);
  color: var(--accent-2);
  transform: translateX(2px);
}

/* Scripture inline boxes — aged parchment with brass rule */
.scripture-inline,
.scripture blockquote{
  background:
    linear-gradient(180deg, #f6ecd7 0%, #ecdfc3 100%);
  border: 1px solid var(--line);
  border-left: 5px solid var(--brass);
  color: var(--ink-2);
}
.scripture blockquote::before{
  color: var(--brass);
  opacity: .65;
}
.scripture cite{
  color: var(--oxblood);
}

/* Wisdom quotes — dark leather panel */
.wisdom-quote,
.pull-thinker,
.pull-stat,
.truth-callout{
  background:
    linear-gradient(160deg, #2a241f 0%, #17130f 100%);
  color: #efe0bd;
  border: 1px solid #1a1613;
  border-left: 5px solid var(--brass);
  box-shadow:
    inset 0 0 0 1px rgba(185,138,60,.28),
    inset 0 1px 0 rgba(255,220,160,.14),
    0 3px 0 rgba(0,0,0,.35),
    0 18px 40px rgba(0,0,0,.4);
}
.wisdom-quote p,
.pull-thinker p,
.pull-stat p,
.truth-callout p{ color: #e9dabd; }
.wisdom-quote cite,
.pull-thinker cite{
  color: var(--brass);
}
.wisdom-quote::before{
  color: var(--brass);
  opacity: .55;
}

/* Stat cards — dark iron with brass trim */
.stat-card{
  background:
    linear-gradient(180deg, #2a241f 0%, #1a1613 100%);
  border: 1px solid #0f0c0a;
  border-top: 3px solid var(--brass);
  color: #efe0bd;
}
.stat-value{ color: var(--gold); }
.stat-label{ color: #cfb98a; }
.stat-note{ color: #a89472; }

/* ============================================================
   FOOTER — dark iron with rivet band
   ============================================================ */
.site-footer{
  background:
    linear-gradient(180deg, #1a1613 0%, #0a0806 100%);
  border-top: 3px solid var(--brass);
  color: #c9b894;
  position: relative;
}
.site-footer::before{
  content: "";
  position: absolute;
  left: 0; right: 0; top: -6px;
  height: 3px;
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 8px,
      var(--brass-2) 8px 10px,
      transparent 10px 18px
    );
  opacity: .55;
}
.footer-title{ color: var(--gold); }
.footer-nav a{ color: #cbbd9f; }
.footer-nav a:hover{
  background: rgba(185,138,60,.18);
  color: #fff;
}

/* ============================================================
   LINKS — aged brass, warm hover
   ============================================================ */
a{ color: var(--oxblood); }
a:hover{ color: var(--accent-2); }
.prose a{ color: var(--oxblood); border-bottom: 1px dotted var(--line); }
.prose a:hover{ color: var(--brass-2); border-bottom-color: var(--brass); }

/* ============================================================
   SMALL SCREENS
   ============================================================ */
@media (max-width:640px){
  body{ font-size: 16.5px; }
  .section h2{ font-size: 1.32rem; }
  .hero-title{ font-size: clamp(1.75rem, 6.5vw, 2.4rem); }
  .lede{ font-size: 1.02rem; }
  .section-toc{ padding: 1.15rem 1.1rem 1.25rem; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .card{ transition: none; }
}


/* ============================================================
   PAGE BODY TEXT — dark ground, light ink
   ============================================================ */
body{
  color: var(--ink-light);
  font-size: 18px;
  line-height: 1.75;
}

/* Section wrappers sit directly on the dark ground — light text */
.section > .prose p,
.section > .prose li,
.section > p,
.section > .lede{
  color: var(--ink-light-2);
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.78;
}

/* Section headings that sit directly on the dark ground */
.section > h2{
  color: var(--head-light);
  text-shadow: 0 1px 0 rgba(0,0,0,.6),
               0 0 18px rgba(201,138,60,.28);
}
.section > h2::after{
  background: linear-gradient(90deg,
              var(--gold) 0%, var(--accent) 100%);
  box-shadow: 0 0 16px rgba(201,138,60,.55);
}
.section > h3{
  color: var(--head-light-2);
}
.section > h4{
  color: var(--head-light-2);
}

/* ============================================================
   PANELS — light parchment, dark ink
   ============================================================ */
.card,
.section-toc,
.housekeeping-panel,
.library-notice,
.for-fathers,
.chart-wrap,
.stat-card,
.resource-card,
.church-locator,
.profile-header,
.map-figure,
.compare-table{
  color: var(--ink-dark);
}

.card h3,
.card h3 a,
.section-toc h2,
.section-toc .toc-kicker,
.housekeeping-panel-head h2,
.for-fathers h3,
.tribute-block h3{
  color: var(--head-dark);
}

.card p,
.card .card-meta,
.section-toc .listing a{
  color: var(--ink-dark-2);
}

.card p{ font-size: 1rem; font-weight: 500; line-height: 1.7; }
.card .card-meta{ font-weight: 800; color: #7a3a10; }

/* For Fathers and housekeeping paragraphs — dark on parchment */
.for-fathers p,
.housekeeping-panel .housekeeping-list li,
.tribute-block p,
.tribute-list li,
.tribute-paragraph{
  color: var(--ink-dark-2);
  font-size: 1.04rem;
  font-weight: 500;
  line-height: 1.72;
}

/* Tribute and For Fathers headings on parchment */
.for-fathers h3,
.tribute-block h3{
  color: var(--head-dark);
  font-weight: 800;
}

/* ============================================================
   SCRIPTURE + QUOTE BOXES
   Light boxes: dark ink.  Dark boxes: light ink.
   ============================================================ */

/* Light scripture box (aged parchment) — dark ink */
.scripture blockquote,
.scripture-inline,
.pull-scripture,
.stat-scripture{
  color: var(--ink-dark-2);
}
.scripture blockquote p,
.scripture-inline p,
.pull-scripture p,
.stat-scripture p{
  color: var(--ink-dark);
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.78;
}
.scripture blockquote cite,
.scripture-inline cite,
.pull-scripture cite,
.stat-scripture cite{
  color: var(--accent-2);
  font-weight: 800;
  letter-spacing: .22em;
}

/* Dark wisdom and dark quote boxes — light ink */
.wisdom-quote,
.pull-thinker,
.pull-stat,
.truth-callout{
  color: var(--ink-light);
}
.wisdom-quote p,
.pull-thinker p,
.pull-stat p,
.truth-callout p{
  color: var(--ink-light);
  font-size: 1.1rem;
  font-weight: 500;
  line-height: 1.78;
}
.wisdom-quote cite,
.pull-thinker cite{
  color: var(--gold);
  font-weight: 800;
  letter-spacing: .24em;
}

/* Dark box callout headings (label chip) */
.truth-callout h3{
  color: var(--gold);
  font-weight: 800;
  letter-spacing: .28em;
}

/* ============================================================
   HERO
   ============================================================ */
.hero{ color: var(--ink-light); }
.hero-title{
  color: #fbeed0;
  font-weight: 800;
  text-shadow:
    0 0 30px rgba(201,138,60,.45),
    0 3px 0 rgba(0,0,0,.55),
    0 4px 26px rgba(0,0,0,.6);
}
.hero-lead{
  color: #e6d5b0;
  font-size: 1.12rem;
  font-weight: 500;
  line-height: 1.72;
}
.hero-kicker{
  color: var(--gold);
  font-weight: 800;
}

/* Crumbs on dark hero — light */
.crumbs,
.crumbs a{
  color: #d8c49c;
}
.crumbs a:hover{ color: #fff; }
.crumbs [aria-current]{ color: var(--gold); }

/* ============================================================
   HEADER / FOOTER
   ============================================================ */
.site-header{ color: #f0e2c6; }
.brand-title{ color: #f6e6c4; }
.brand-sub{ color: var(--gold); }

.site-footer{ color: #d8c9a8; }
.footer-title{ color: var(--gold); }
.footer-nav a{ color: #d8c9a8; }
.footer-note{ color: #a89878; }

/* ============================================================
   LISTS AND LEDES SITE-WIDE
   ============================================================ */
.lede{
  color: var(--ink-light-2);
  font-size: 1.16rem;
  font-weight: 500;
  line-height: 1.76;
}
.prose li{
  color: var(--ink-light-2);
  font-size: 1.04rem;
  font-weight: 500;
  line-height: 1.72;
}
.listing a{
  color: #e6d5b0;
}
.listing a:hover{ color: var(--gold); }

/* ============================================================
   TABLES
   ============================================================ */
.compare-table{
  background: #f2e8d5;
  color: var(--ink-dark);
}
.compare-table th,
.compare-table td{
  color: var(--ink-dark);
  font-weight: 500;
}
.compare-table thead th{
  color: var(--gold);
  font-weight: 800;
}
.compare-table tbody th{
  color: var(--head-dark);
  font-weight: 800;
}

/* ============================================================
   SMALL SCREENS
   ============================================================ */
@media (max-width:640px){
  body{ font-size: 17px; }
  .hero-title{ font-size: clamp(1.85rem, 6.5vw, 2.5rem); }
  .hero-lead{ font-size: 1.04rem; }
  .section > h2{ font-size: 1.42rem; }
  .section > h3{ font-size: 1.16rem; }
  .section > .prose p,
  .section > .prose li,
  .section > p,
  .section > .lede{ font-size: 1.03rem; }
  .scripture blockquote p,
  .scripture-inline p,
  .pull-scripture p,
  .stat-scripture p,
  .wisdom-quote p,
  .pull-thinker p,
  .pull-stat p,
  .truth-callout p{ font-size: 1.03rem; }
  .card p{ font-size: .97rem; }
}

@media (max-width:400px){
  body{ font-size: 16.5px; }
  .section > h2{ font-size: 1.3rem; }
}

/* ============================================================
   PANEL SOFTENING + BALANCE PASS
   Panels move from bright parchment to a muted tan leather.
   Section content containers get a balanced inner frame.
   The overall glare drops so the page reads comfortably.
   ============================================================ */

:root{
  /* Softer, less bright panels — tanned leather rather than paper */
  --panel:       #e4d7bb;
  --panel-2:     #d8c9a8;
  --panel-dark:  #b9a780;

  /* Slightly deeper inks for use on the softer panels */
  --ink-dark-2:  #423626;
  --head-dark:   #4f1a0c;
  --head-dark-2: #6b3210;

  /* Softer light inks for the dark ground so contrast is easier on eyes */
    --ink-light-2:    #d6c8a4;
  --head-light:     #d19a4a;
  --head-light-2:   #c08c3e;

  /* Muted borders */
  --line:    #7c6a4a;
  --line-2:  #5c4e34;
  --brass:   #a87934;
  --brass-2: #7a5a24;
}

/* Body ground stays dark but slightly warmer, no glow */
body{
  background-color: #1c1814;
  background-image:
    radial-gradient(1200px 600px at 12% -10%,
                    rgba(168,120,52,.08), transparent 62%),
    radial-gradient(900px 520px at 92% 108%,
                    rgba(79,26,12,.10), transparent 64%),
    repeating-linear-gradient(0deg,
                    rgba(255,240,210,.008) 0 1px,
                    transparent 1px 4px),
    repeating-linear-gradient(90deg,
                    rgba(0,0,0,.06) 0 1px,
                    transparent 1px 4px);
}

/* ============================================================
   LIGHT PANELS — softer, more balanced
   ============================================================ */

.card,
.section-toc,
.housekeeping-panel,
.library-notice,
.for-fathers,
.chart-wrap,
.stat-card,
.resource-card,
.church-locator,
.profile-header,
.map-figure,
.compare-table{
  background: linear-gradient(180deg,
              var(--panel) 0%,
              var(--panel-2) 100%);
  border-color: var(--line);
  color: var(--ink-dark);
}

/* Rivet accent softens too */
.card::before,
.section-toc::before,
.housekeeping-panel::before,
.library-notice::before,
.for-fathers::before{
  background:
    radial-gradient(circle at 0 0,
      rgba(122,90,36,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 0,
      rgba(122,90,36,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 0 100%,
      rgba(122,90,36,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 100%,
      rgba(122,90,36,.55) 0 2px, transparent 3px);
  background-repeat: no-repeat;
}

/* Card top accent — softer brass, not bright */
.card{
  border-top-color: var(--brass);
}
.card:hover{
  border-top-color: var(--head-dark);
}

/* ============================================================
   SECTION CONTENT CONTAINER — balanced inner frame
   Every .section gets an inset framed panel with proper padding,
   capped width, and softened edge so it does not dominate the page.
   ============================================================ */

.section{
  max-width: var(--maxw);
  margin: 2.2rem auto;
  padding: 1.5rem 1.6rem 1.7rem;
  background: linear-gradient(180deg,
              rgba(228,215,187,.94) 0%,
              rgba(216,201,168,.94) 100%);
  border: 1px solid var(--line);
  border-left: 4px solid var(--brass);
  border-radius: 3px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 0 0 1px rgba(255,235,200,.15),
    0 2px 0 rgba(0,0,0,.25),
    0 12px 30px rgba(0,0,0,.28);
  color: var(--ink-dark);
}

/* Inside the balanced section: heading is dark oxblood, body dark ink */
.section > h2{
  color: var(--head-dark);
  text-shadow: none;
  border-bottom-color: rgba(79,26,12,.28);
}
.section > h2::after{
  background: linear-gradient(90deg,
              var(--brass) 0%, var(--head-dark) 100%);
  box-shadow: 0 0 12px rgba(168,120,52,.45);
}
.section > h3{
  color: var(--head-dark-2);
}
.section > .prose p,
.section > .prose li,
.section > p,
.section > .lede{
  color: var(--ink-dark-2);
  font-size: 1.06rem;
  font-weight: 500;
  line-height: 1.76;
}
.section > .lede{ color: var(--ink-dark); }

/* Hero remains untouched — its own dark treatment */
.hero{
  border-radius: 0;
  border-left: none;
  box-shadow: none;
  margin: 0;
  padding: 0;
  background: linear-gradient(160deg,#2a241f 0%,#1a1613 60%,#0f0c0a 100%);
}

/* Scripture standalone areas on the dark ground — balanced panel */
.scripture{
  max-width: var(--maxw);
  margin: 1.8rem auto;
  padding: 0 1.25rem;
}
.scripture blockquote{
  background: linear-gradient(180deg,
              var(--panel) 0%,
              var(--panel-2) 100%);
  border: 1px solid var(--line);
  border-left: 5px solid var(--brass);
  color: var(--ink-dark-2);
  box-shadow:
    inset 0 0 0 1px rgba(255,235,200,.18),
    0 2px 0 rgba(0,0,0,.25),
    0 12px 28px rgba(0,0,0,.28);
}
.scripture blockquote p{
  color: var(--ink-dark);
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.76;
}
.scripture cite{
  color: var(--head-dark);
  font-weight: 800;
}

/* ============================================================
   QUOTE BOXES (light variant) — softer, matched to new panels
   ============================================================ */
.scripture-inline,
.pull-scripture,
.stat-scripture{
  background: linear-gradient(180deg,
              var(--panel) 0%,
              var(--panel-2) 100%);
  border-color: var(--line);
  border-left-color: var(--brass);
  color: var(--ink-dark-2);
  box-shadow:
    inset 0 0 0 1px rgba(255,235,200,.16),
    0 1px 0 rgba(0,0,0,.18),
    0 8px 20px rgba(0,0,0,.22);
}
.scripture-inline p,
.pull-scripture p,
.stat-scripture p{
  color: var(--ink-dark);
}
.scripture-inline cite,
.pull-scripture cite,
.stat-scripture cite{
  color: var(--head-dark);
}

/* ============================================================
   DARK QUOTE BOXES — slightly warmer so they don't glare
   ============================================================ */
.wisdom-quote,
.pull-thinker,
.pull-stat,
.truth-callout{
  background: linear-gradient(160deg,#2a241f 0%,#17130f 100%);
  color: var(--ink-light);
  border-color: #14100c;
  border-left-color: var(--brass);
  box-shadow:
    inset 0 0 0 1px rgba(168,120,52,.22),
    inset 0 1px 0 rgba(255,220,160,.10),
    0 2px 0 rgba(0,0,0,.4),
    0 14px 30px rgba(0,0,0,.42);
}
.wisdom-quote p,
.pull-thinker p,
.pull-stat p,
.truth-callout p{
  color: var(--ink-light);
}
.wisdom-quote cite,
.pull-thinker cite{
  color: var(--head-light);
}

/* ============================================================
   HEADINGS ON THE DARK GROUND (outside of .section frames)
   ============================================================ */
h1, h2, h3, h4{ color: var(--head-light); }
.hero-title{ color: #f0e0bd; }
.hero-lead{ color: #dccbac; }
.hero-kicker{ color: var(--head-light); }

/* Lists and ledes that sit on the dark ground */
.listing a{ color: #d8c9a8; }
.listing a:hover{ color: var(--head-light); }
.crumbs, .crumbs a{ color: #cbb98f; }
.crumbs a:hover{ color: #fff; }
.crumbs [aria-current]{ color: var(--head-light); }

/* ============================================================
   GRID BALANCE — consistent gaps and card heights
   ============================================================ */
.grid{
  gap: 1.15rem;
  align-items: stretch;
}
.card{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.card h3{ margin-top: 0; }
.card p{ flex: 1 1 auto; }
.card .card-meta{ margin-top: auto; }

/* ============================================================
   TOC / HOUSEKEEPING / FOR FATHERS — same softer treatment
   ============================================================ */
.section-toc{
  border-left-color: var(--brass);
  padding: 1.4rem 1.5rem 1.5rem;
}
.section-toc h2{
  color: var(--head-dark);
}
.section-toc .listing a{
  background: linear-gradient(180deg,
              rgba(240,232,214,.9) 0%,
              rgba(226,213,184,.9) 100%);
  border-color: var(--line);
  border-left-color: var(--brass);
  color: var(--ink-dark-2);
}
.section-toc .listing a:hover{
  background: linear-gradient(180deg,
              rgba(236,226,204,.95) 0%,
              rgba(220,205,175,.95) 100%);
  border-left-color: var(--head-dark);
  color: var(--head-dark);
}

.housekeeping-panel-head h2{ color: var(--head-dark); }
.for-fathers h3{ color: var(--head-dark); }
.tribute-block h3{ color: var(--head-dark); }

/* ============================================================
   SMALL SCREENS
   ============================================================ */
@media (max-width:900px){
  .section{ padding: 1.25rem 1.15rem 1.35rem; margin: 1.6rem auto; }
}
@media (max-width:640px){
  body{ font-size: 17px; }
  .section{ padding: 1.1rem 1rem 1.2rem; margin: 1.3rem auto; }
  .section > h2{ font-size: 1.4rem; }
  .section > h3{ font-size: 1.14rem; }
  .section > .prose p,
  .section > .prose li,
  .section > p,
  .section > .lede{ font-size: 1.02rem; }
  .scripture blockquote p,
  .scripture-inline p,
  .pull-scripture p,
  .stat-scripture p,
  .wisdom-quote p,
  .pull-thinker p,
  .pull-stat p,
  .truth-callout p{ font-size: 1.03rem; }
}

/* ============================================================
   SECTION TOC — distinct navigation panel style
   The In This Section block reads as a wayfinding panel,
   not as another content block. It has a dark iron surface,
   brass edges, and its own heading treatment.
   ============================================================ */

.section-toc{
  position: relative;
  max-width: var(--maxw);
  margin: 2rem auto;
  padding: 1.7rem 1.8rem 1.8rem;
  background:
    linear-gradient(160deg, #2a241f 0%, #1a1613 100%);
  color: var(--ink-light);
  border: 1px solid #0f0c0a;
  border-left: 5px solid var(--brass);
  border-radius: 3px;
  box-shadow:
    inset 0 0 0 1px rgba(168,120,52,.22),
    inset 0 1px 0 rgba(255,220,160,.10),
    0 2px 0 rgba(0,0,0,.4),
    0 14px 32px rgba(0,0,0,.35);
}

/* Rivet corners in brass to distinguish the panel */
.section-toc::before{
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 2px;
  pointer-events: none;
  background:
    radial-gradient(circle at 0 0,
      rgba(217,162,74,.75) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 0,
      rgba(217,162,74,.75) 0 2px, transparent 3px),
    radial-gradient(circle at 0 100%,
      rgba(217,162,74,.75) 0 2px, transparent 3px),
    radial-gradient(circle at 100% 100%,
      rgba(217,162,74,.75) 0 2px, transparent 3px);
  background-repeat: no-repeat;
}

/* Heading: kicker + h2 both light on the dark panel */
.section-toc .toc-kicker{
  margin: 0 0 .35rem;
  font-family: ui-sans-serif, system-ui, -apple-system,
               "Segoe UI", sans-serif;
  font-size: .68rem;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--head-light);
  font-weight: 800;
}

.section-toc h2{
  margin: 0 0 1.2rem;
  font-size: 1.32rem;
  color: var(--ink-light);
  letter-spacing: .03em;
  padding-bottom: .6rem;
  border-bottom: 1px solid rgba(168,120,52,.35);
  text-shadow: 0 1px 0 rgba(0,0,0,.5);
  position: relative;
}

.section-toc h2::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 64px;
  height: 2px;
  background: var(--brass);
  box-shadow: 0 0 12px rgba(217,162,74,.55);
}

/* The listing — two-column grid of link chips */
.section-toc .listing{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: .55rem .8rem;
}

.section-toc .listing li{ margin: 0; }

.section-toc .listing a{
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .68rem .95rem;
  background:
    linear-gradient(180deg,
      rgba(255,240,200,.05) 0%,
      rgba(0,0,0,.14) 100%);
  border: 1px solid rgba(168,120,52,.35);
  border-left: 3px solid var(--brass);
  border-radius: 3px;
  color: #e2d4b2;
  text-decoration: none;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.35;
  min-height: 46px;
  transition: background .14s ease,
              border-color .14s ease,
              color .14s ease,
              transform .14s ease;
}

.section-toc .listing a::before{
  content: "\2192";
  color: var(--brass);
  font-weight: 800;
  font-size: .9rem;
  flex-shrink: 0;
}

.section-toc .listing a:hover{
  background:
    linear-gradient(180deg,
      rgba(255,220,160,.18) 0%,
      rgba(255,220,160,.04) 100%);
  border-color: var(--brass);
  border-left-color: var(--gold);
  color: #fff;
  transform: translateX(3px);
}

.section-toc .listing a:hover::before{
  color: var(--gold);
}

/* Ensure the frame does not clip the hover translation */
.section-toc{ overflow: visible; }

/* ============================================================
   SMALL SCREENS
   ============================================================ */
@media (max-width:900px){
  .section-toc{
    padding: 1.35rem 1.3rem 1.45rem;
    margin: 1.6rem auto;
  }
}

@media (max-width:640px){
  .section-toc{
    padding: 1.15rem 1.1rem 1.25rem;
  }
  .section-toc h2{
    font-size: 1.14rem;
    margin-bottom: .95rem;
  }
  .section-toc .toc-kicker{
    font-size: .62rem;
    letter-spacing: .26em;
  }
  .section-toc .listing{
    grid-template-columns: 1fr;
    gap: .45rem;
  }
  .section-toc .listing a{
    font-size: .78rem;
    padding: .6rem .8rem;
    min-height: 42px;
  }
}

/* ============================================================
   FINAL POLISH PASS
   - Hero overlay lightened so the emblem reads through
   - Small refinements to panel spacing, borders, and type
   ============================================================ */

/* ------------------------------------------------------------
   HERO — lighter overlay, brighter emblem
   ------------------------------------------------------------ */

/* The emblem layer under the hero */
.hero::before{
  opacity: .26;                    /* was ~.16-.22 depending on override */
  filter: drop-shadow(0 0 22px rgba(201,138,60,.35));
}

/* The darkening overlay — reduced by ~20% vs the last value */
.hero::after{
  background:
    radial-gradient(ellipse at 50% 22%,
      rgba(201,138,60,.18) 0%,
      transparent 68%),
    linear-gradient(180deg,
      rgba(0,0,0,.11) 0%,
      rgba(0,0,0,0)  36%,
      rgba(0,0,0,.20) 100%);
}

/* Slightly taller hero so the emblem has more room to breathe */
.hero-inner{
  padding: 3.6rem 1.25rem 3.4rem;
}

@media (max-width:820px){
  .hero::before{ opacity:.22; }
  .hero-inner{ padding:2.7rem 1.1rem 2.5rem; }
}

@media (max-width:520px){
  .hero::before{ opacity:.18; }
}

/* ------------------------------------------------------------
   TEXT READABILITY ON THE HERO
   With a lighter overlay, the title benefits from a touch more
   shadow for contrast without losing the emblem.
   ------------------------------------------------------------ */
.hero-title{
  text-shadow:
    0 0 30px rgba(0,0,0,.55),
    0 2px 0 rgba(0,0,0,.55),
    0 3px 22px rgba(0,0,0,.6);
}

.hero-lead{
  text-shadow: 0 1px 12px rgba(0,0,0,.55);
}

/* ------------------------------------------------------------
   SMALL SPACING REFINEMENTS
   ------------------------------------------------------------ */

/* Section headings — a bit more air above, tighter below */
.section > h2{
  margin: 0 0 .6rem;
  padding-bottom: .65rem;
}
.section > h3{
  margin-top: 1.7rem;
  margin-bottom: .5rem;
}

/* Prose blocks — consistent rhythm */
.section > .prose p{
  margin: 0 0 1rem;
}
.section > .prose p:last-child{
  margin-bottom: 0;
}

/* Panels — consistent internal padding */
.card{
  padding: 1.2rem 1.25rem 1.25rem;
}

/* TOC panel — slightly tighter inner padding */
.section-toc{
  padding: 1.55rem 1.7rem 1.7rem;
}

@media (max-width:640px){
  .card{ padding: 1.05rem 1.1rem 1.1rem; }
  .section-toc{ padding: 1.15rem 1.1rem 1.25rem; }
}

/* ------------------------------------------------------------
   BORDER REFINEMENTS
   ------------------------------------------------------------ */

/* Cards get a slightly softer, warmer border */
.card{
  border-color: rgba(124,106,74,.5);
}
.card:hover{
  border-color: var(--brass);
}

/* Section headings get a subtle top rule to accent the frame */
.section > h2{
  border-top: 0;
}

/* Buttons — a touch more contrast against the dark ground */
.btn{
  border-color: rgba(168,120,52,.65);
}
.btn:hover{
  border-color: var(--head-light);
}

/* ------------------------------------------------------------
   LINK UNDERLINES IN PROSE
   ------------------------------------------------------------ */
.prose a{
  border-bottom: 1px dotted rgba(124,106,74,.55);
}
.prose a:hover{
  border-bottom-color: var(--brass);
}

/* ------------------------------------------------------------
   FOOTER EMPHASIS
   ------------------------------------------------------------ */
.footer-emblem{
  opacity: .95;
}

/* ------------------------------------------------------------
   HERO CTA SPACING
   ------------------------------------------------------------ */
.hero-cta{
  margin-top: 1.6rem;
}

/* ------------------------------------------------------------
   SCROLLBAR (desktop only)
   ------------------------------------------------------------ */
@media (hover:hover) and (pointer:fine){
  ::-webkit-scrollbar{
    width: 12px;
    height: 12px;
  }
  ::-webkit-scrollbar-track{
    background: #14100c;
  }
  ::-webkit-scrollbar-thumb{
    background: linear-gradient(180deg,
                #7a5a24 0%, #4a3717 100%);
    border-radius: 6px;
    border: 2px solid #14100c;
  }
  ::-webkit-scrollbar-thumb:hover{
    background: linear-gradient(180deg,
                #a87934 0%, #7a5a24 100%);
  }
}