:root{
  --navy:#0a1630; --maroon:#28081a; --gold:#F2C14E; --gold-d:#b8860b;
  --ink:#1b1f2a; --muted:#5a6070; --card:#ffffff; --page:#f4f1ea; --line:#e4ddcc;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--page);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:19px;line-height:1.6;overflow-wrap:break-word}
a{color:#7a1c3d}
img{max-width:100%;display:block}

/* sticky back bar */
.backbar{position:sticky;top:0;z-index:20;background:rgba(10,22,48,.96);
  border-bottom:2px solid var(--gold);backdrop-filter:saturate(1.2) blur(6px)}
.backbar a{display:flex;align-items:center;gap:.5em;min-height:52px;padding:.55em 1em;
  color:#fff;text-decoration:none;font-weight:700;font-size:17px;max-width:880px;margin:0 auto}
.backbar a span.arrow{color:var(--gold);font-size:1.3em;line-height:1}
.backbar a:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}

/* header */
.hero{position:relative;color:#fff;overflow:hidden;
  background:linear-gradient(135deg,var(--navy) 0%,#1a0f2b 55%,var(--maroon) 100%)}
.hero .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% center;opacity:.55}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,22,48,.35) 0%,rgba(10,22,48,.75) 55%,rgba(40,8,26,.96) 100%)}
.hero .inner{position:relative;z-index:1;max-width:880px;margin:0 auto;padding:2.2em 1.1em 1.8em}
.kicker{display:inline-block;color:var(--navy);background:var(--gold);font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;font-size:13px;padding:.3em .7em;border-radius:6px}
.hero h1{font-size:clamp(34px,9vw,56px);line-height:1.08;margin:.45em 0 .25em;font-weight:800;
  text-shadow:0 2px 12px rgba(0,0,0,.45)}
.hero .sub{font-size:clamp(19px,4.8vw,24px);color:#fdf3d6;margin:.2em 0 .6em;font-weight:600}
.hero .meta{color:#e8e3d6;font-size:17px;margin:.2em 0}
.hero .meta strong{color:var(--gold)}

main{max-width:880px;margin:0 auto;padding:1.1em .8em 2em}
.card{background:var(--card);border-radius:16px;padding:1.15em 1.15em 1.2em;margin:0 0 1em;
  box-shadow:0 1px 2px rgba(10,22,48,.06),0 6px 18px rgba(10,22,48,.07);border:1px solid var(--line)}
.card > :first-child{margin-top:0}
.card > :last-child{margin-bottom:0}
p{margin:0 0 .85em}
h2{font-size:clamp(25px,6.4vw,32px);line-height:1.2;margin:.1em 0 .5em;color:var(--navy)}
h3{font-size:21px;line-height:1.3;margin:1.1em 0 .3em;color:#7a1c3d}
.label{display:block;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-d);margin-bottom:.25em}

/* section banner (dark) */
.section-head{background:linear-gradient(135deg,var(--navy),var(--maroon));color:#fff;
  border-radius:16px;padding:1em 1.15em;margin:1.6em 0 1em;border-left:6px solid var(--gold)}
.section-head h2{color:#fff;margin:0}
.section-head .label{color:var(--gold)}

/* scripture */
.scripture{background:#fbf6e7;border:1px solid #ecdcae;border-left:6px solid var(--gold);
  border-radius:14px;padding:1em 1.1em;margin:.4em 0 1em;font-family:Georgia,"Times New Roman",serif;
  font-size:20px;line-height:1.65;color:#2a2416}
.scripture p:last-child{margin-bottom:0}
.scripture sup,.vnum{font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-weight:800;color:#9a6b00;font-size:.7em;vertical-align:.35em;margin-right:.15em}
.scripture .ref{display:block;font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:15px;font-weight:700;color:#7a5600;margin-top:.5em;letter-spacing:.03em}
q.sq,.sq{font-family:Georgia,"Times New Roman",serif;font-style:italic;color:#5b1430;background:#fbf3e0;
  padding:.05em .25em;border-radius:4px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
q.sq{quotes:none}

.refs{display:inline-block;font-size:15px;font-weight:700;color:#7a5600;background:#fbf3e0;
  border:1px solid #ecdcae;border-radius:999px;padding:.15em .7em;margin-top:.1em}

/* callout */
.callout{background:linear-gradient(135deg,#fff4cf,#f9e3a0);border:2px solid var(--gold);
  border-radius:14px;padding:.9em 1em;margin:1.1em 0 0;font-weight:700;color:#3a2a00;font-size:20px;line-height:1.45}
.callout::before{content:"\2605";color:#b8860b;margin-right:.4em}

.subpoint{border-top:1px solid var(--line);padding-top:.2em;margin-top:.9em}
.subpoint:first-of-type{border-top:0}
.lead{font-weight:800;color:var(--navy)}
ol.apps{padding-left:1.3em;margin:.2em 0}
ol.apps li{margin:.3em 0}

/* notes */
.notes{margin-top:1em;background:#f6f8fc;border:1px dashed #9aa6c3;border-radius:12px;padding:.75em .8em}
.notes label{display:block;font-weight:800;color:var(--navy);font-size:16px;margin-bottom:.35em}
.notes textarea{width:100%;min-height:6.5em;resize:vertical;font:inherit;font-size:18px;line-height:1.5;
  color:var(--ink);background:#fff;border:1.5px solid #b7c0d6;border-radius:10px;padding:.6em .7em}
.notes textarea:focus{outline:3px solid var(--gold);border-color:var(--gold-d)}
.notes .saved{font-size:14px;color:var(--muted);min-height:1.2em;margin-top:.25em}
.notes .print-notes{display:none}
.notes-info{background:#eef2fb;border:1px solid #c9d3ea;border-radius:14px;padding:.85em 1em;font-size:17px;color:#26314d}
.btn{display:inline-block;font:inherit;font-weight:800;font-size:17px;border-radius:12px;padding:.7em 1.1em;
  border:2px solid var(--maroon);background:#fff;color:var(--maroon);cursor:pointer;min-height:48px}
.btn:hover{background:#fbeef3}
.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:.6em;margin-top:.7em}

/* landing */
.link-card{display:block;text-decoration:none;color:inherit;overflow:hidden;padding:0}
.link-card img{width:100%;aspect-ratio:3/1;object-fit:cover;object-position:75% center}
.link-card .body{padding:1em 1.15em 1.2em}
.link-card h2{margin:0 0 .2em}
.link-card .go{display:inline-block;margin-top:.5em;font-weight:800;color:#7a1c3d}

footer{background:linear-gradient(135deg,var(--navy),var(--maroon));color:#e9e4d8;text-align:center;
  padding:1.6em 1em 2em;font-size:16px;border-top:3px solid var(--gold)}
footer strong{color:#fff;display:block;font-size:18px}
footer .verse{color:var(--gold);font-style:italic;margin-top:.5em}

@media (min-width:760px){
  body{font-size:20px}
  main{padding:1.6em 1.2em 2.5em}
  .card{padding:1.5em 1.7em}
  .hero .inner{padding:3.4em 1.4em 2.4em}
  .hero .bg{opacity:.7}
}

@media print{
  @page{margin:16mm 14mm}
  body{background:#fff;font-size:12pt;color:#000}
  .backbar,.btn-row,.no-print,.notes .saved,.hero .bg{display:none!important}
  .hero{background:none!important;color:#000;border-bottom:2pt solid #b8860b}
  .hero::after{display:none}
  .hero .inner{padding:0 0 8pt}
  .hero h1{text-shadow:none;color:#0a1630;font-size:26pt}
  .hero .sub,.hero .meta{color:#222}
  .hero .meta strong{color:#000}
  .kicker{border:1pt solid #b8860b;background:none;color:#000}
  main{padding:0;max-width:none}
  .card{box-shadow:none;border:1pt solid #ccc;border-radius:6pt;padding:8pt 10pt;break-inside:avoid-page}
  .section-head{background:none;color:#000;border:0;border-left:4pt solid #b8860b;border-radius:0;padding:2pt 8pt;break-after:avoid}
  .section-head h2,.section-head .label{color:#000}
  .scripture,.callout,.sq{background:none!important;color:#000}
  .callout{border:1.5pt solid #b8860b}
  .notes{background:none;border:1pt solid #999}
  .notes textarea{display:none}
  .notes .print-notes{display:block;min-height:5em;white-space:pre-wrap;
    background-image:repeating-linear-gradient(#fff 0 1.45em,#bbb 1.45em calc(1.45em + 1px))}
  a{color:#000;text-decoration:none}
  footer{background:none;color:#000;border-top:1pt solid #999;padding:8pt 0 0}
  footer strong{color:#000}
  footer .verse{color:#000}
  h2,h3{break-after:avoid}
}
.meta:empty{display:none}
ol.apps.plain{list-style:none;padding-left:0}
p.tight{margin:0 0 .3em}
.link-card img{height:auto;aspect-ratio:2.4/1}
@media print{.section-head{break-inside:avoid;page-break-after:avoid;break-after:avoid}.section-head + .card{break-before:avoid}}