/* ==========================================================================
   pages.css — 404, Scripture index, legal and About
   Ported verbatim from the inline <style> block of their original inline blocks.
   Shared tokens, base, buttons, header and footer live in global.css.
   ========================================================================== */
/* --- 404 page ---------------------------------------------------------- */
.err{min-height:calc(100vh - 74px);display:flex;align-items:center;justify-content:center;text-align:center;
     background:linear-gradient(180deg,var(--ivory-deep),var(--ivory));padding:clamp(3rem,8vw,6rem) var(--pad)}
.err .code{font-family:var(--serif);font-weight:600;font-size:clamp(4.5rem,16vw,9rem);line-height:1;color:var(--navy)}
.err .code span{color:var(--gold)}
.err h1{font-size:clamp(1.6rem,4vw,2.4rem);margin:.6rem 0 .8rem}
.err p{color:var(--muted);max-width:46ch;margin:0 auto 2rem;font-size:1.05rem}
.err .actions{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}
.err .verse{margin-top:2.4rem;font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--navy)}
.err .verse cite{display:block;margin-top:.5rem;font-style:normal;font-family:var(--sans);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;color:var(--gold)}

/* --- Scripture index --------------------------------------------------- */
.sx-hero{background:linear-gradient(180deg,var(--ivory-deep),var(--ivory));padding:clamp(3rem,8vw,5rem) 0 clamp(1.8rem,4vw,2.6rem);border-bottom:1px solid var(--line);text-align:center}
.sx-hero .eyebrow{display:block;font-family:var(--sans);font-weight:700;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem}
.sx-hero h1{font-size:clamp(2.2rem,5vw,3.2rem);color:var(--navy);margin:0}
.sx-hero p{color:var(--muted);font-size:1.06rem;margin:.9rem auto 0;max-width:54ch}
.sx-body{padding-block:clamp(2.5rem,6vw,4rem)}
.sx-jump{margin-bottom:2.5rem}
.sx-jump-row{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;align-items:center;margin-bottom:.9rem}
.sx-jump-label{font-family:var(--sans);font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-right:.35rem}
.sx-jump a{font-family:var(--sans);font-size:.86rem;font-weight:600;color:var(--navy);background:var(--ivory-deep);
  border:1px solid var(--line);border-radius:999px;padding:.4rem .9rem;text-decoration:none;transition:background .2s,border-color .2s}
.sx-jump a:hover{background:var(--stone);border-color:var(--gold)}
.sx-book{margin-bottom:2.6rem;scroll-margin-top:90px}
.sx-book h3{font-size:1.6rem;font-family:var(--serif);font-weight:500;color:var(--navy);margin:0 0 .3rem;padding-bottom:.5rem;border-bottom:1px solid var(--line)}
.sx-list{list-style:none;padding:0;margin:.7rem 0 0}
.sx-list li{border-bottom:1px solid var(--line)}
.sx-list li:last-child{border-bottom:0}
.sx-list a{display:flex;gap:1rem;align-items:baseline;justify-content:space-between;
  flex-wrap:wrap;text-decoration:none;padding:.8rem .6rem;border-radius:8px;
  transition:background .2s ease}
.sx-list a:hover,.sx-list a:focus-visible{background:var(--ivory-deep)}
.sx-title{font-family:var(--serif);font-size:1.15rem;line-height:1.35;color:var(--navy);
  flex:1 1 16rem;transition:color .2s ease}
.sx-list a:hover .sx-title,.sx-list a:focus-visible .sx-title{color:var(--gold)}
.sx-date{font-family:var(--sans);font-size:.82rem;color:var(--muted);flex:0 0 auto}
.sx-empty{text-align:center;color:var(--muted);padding:3rem 1rem}
.sx-empty h2{font-family:var(--serif);color:var(--navy);font-size:1.6rem;margin-bottom:.5rem}

/* --- Legal pages (privacy, terms) -------------------------------------- */
.legal-hero{background:linear-gradient(180deg,var(--ivory-deep),var(--ivory));padding:clamp(3rem,8vw,5rem) 0 clamp(1.8rem,4vw,2.6rem);border-bottom:1px solid var(--line)}
.legal-hero .eyebrow{display:block;font-family:var(--sans);font-weight:700;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem}
.legal-hero h1{font-size:clamp(2.2rem,5vw,3.2rem);color:var(--navy);margin:0}
.legal-hero .updated{color:var(--muted);font-family:var(--sans);font-size:.92rem;margin-top:.7rem}
.legal-body{max-width:760px;padding-block:clamp(2.5rem,6vw,4rem)}
.legal-body h2{font-size:1.5rem;color:var(--navy);margin:2.3rem 0 .8rem}
.legal-body h3{font-size:1.15rem;color:var(--navy);margin:1.6rem 0 .5rem}
.legal-body p,.legal-body li{color:var(--ink);line-height:1.72;margin-bottom:1rem;font-size:1.02rem}
.legal-body ul{padding-left:1.25rem;margin-bottom:1.2rem}
.legal-body li{margin-bottom:.5rem}
.legal-body a{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.legal-body strong{color:var(--navy)}
.legal-note{background:var(--ivory-deep);border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.3rem;font-size:.95rem}

/* --- About page ------------------------------------------------------ */
.legal-hero .lede{color:var(--muted);font-size:1.08rem;margin-top:.9rem;max-width:52ch}
.about-note{background:var(--ivory-deep);border:1px solid var(--line);border-radius:14px;padding:1.3rem 1.5rem;margin:1.6rem 0}
.about-note p{margin-bottom:.7rem}
.about-note p:last-child{margin-bottom:0}
.contact-card{display:grid;gap:.45rem;background:var(--ivory-deep);border:1px solid var(--line);border-radius:14px;padding:1.3rem 1.5rem;margin-top:1rem}
.contact-card span{font-family:var(--sans);font-size:1rem;color:var(--ink)}
.contact-card .lbl{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700}

/* about.html used slightly larger body type than the legal pages;
   scoped here so both keep their original sizing. */
.legal-body.about-body h2{font-size:1.55rem;color:var(--navy);margin:2.4rem 0 .8rem}
.legal-body.about-body p,.legal-body.about-body li{color:var(--ink);line-height:1.75;margin-bottom:1rem;font-size:1.04rem}

/* --- Confirmation / unsubscribe message pages ------------------------- */
.msg-wrap{min-height:58vh;display:flex;align-items:center;justify-content:center;padding:clamp(3rem,8vw,5.5rem) 1.25rem;text-align:center}
.msg-card{max-width:560px}
.msg-card .mark{width:44px;height:64px;object-fit:contain;display:block;margin:0 auto 1.4rem}
.msg-card h1{font-size:clamp(2rem,5vw,2.9rem);color:var(--navy);margin:0 0 .9rem}
.msg-card p{color:var(--ink);line-height:1.7;font-size:1.05rem;margin:0 0 1rem}
.msg-card .muted{color:var(--muted);font-size:.95rem}
.msg-actions{margin-top:1.8rem;display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}

/* --- Scripture index: testament grouping -------------------------------- */
.sx-testament{margin-bottom:3.4rem}
.sx-testament > h2{
  font-family:var(--serif);font-weight:500;font-size:clamp(1.9rem,4vw,2.5rem);
  color:var(--navy);margin:0 0 1.6rem;padding-bottom:.7rem;
  border-bottom:2px solid var(--gold);
  display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.6rem;
}
.sx-testament > h2 .count{
  font-family:var(--sans);font-size:.74rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.sx-testament .sx-book{margin-bottom:2.2rem}
.sx-testament .sx-book:last-child{margin-bottom:0}
