/* The Midlife Bible call-out box. One stylesheet shared by every page that carries the box.
   Markup (copy it as it is, only change the ?src= tag so the sales page can tell the pages apart):

   <aside class="bible-callout" aria-label="The Midlife Bible">
     <a class="bc-art" href="/midlife-bible/?src=home" tabindex="-1" aria-hidden="true"><img src="/assets/midlife-bible-fan.webp" alt="" width="1500" height="1007" loading="lazy"></a>
     <div class="bc-body">
       <p class="bc-eyebrow">The book</p>
       <h2>The Midlife Bible</h2>
       <p class="bc-text">...</p>
       <a class="bc-btn" href="/midlife-bible/?src=home">See what is inside, $7</a>
     </div>
   </aside>
*/
.bible-callout{max-width:1040px;margin:0 auto;padding:0;display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:center;background:var(--cream-deep,#F4EBD0);border:1px solid rgba(200,155,60,.6);border-top:4px solid var(--gold,#E5AF2C);border-radius:6px;box-shadow:0 10px 28px rgba(40,25,12,.1)}
.bible-callout .bc-art{display:block;padding:18px 0 18px 22px}
.bible-callout .bc-art img{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 16px rgba(40,25,12,.18))}
.bible-callout .bc-body{padding:26px 30px 26px 0}
.bible-callout .bc-eyebrow{font-family:var(--sans,"Inter",system-ui,sans-serif);font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink,#816218);margin:0}
.bible-callout h2{font-family:var(--serif,"Playfair Display",Georgia,serif);font-weight:700;font-size:clamp(26px,3.4vw,34px);line-height:1.08;color:#58041C;margin:8px 0 10px}
.bible-callout .bc-text{font-family:var(--sans,"Inter",system-ui,sans-serif);font-size:16px;line-height:1.55;color:var(--ink,#28190C);margin:0 0 16px;max-width:46ch}
.bible-callout .bc-btn{display:inline-block;background:var(--green,#58041C);color:var(--cream,#FBF6E6);font-family:var(--sans,"Inter",system-ui,sans-serif);font-weight:700;font-size:15.5px;text-decoration:none;padding:13px 26px;border-radius:6px}
.bible-callout .bc-btn:hover{background:var(--green-deep,#3D0313)}
.bible-callout-wrap{padding:34px 24px 40px;background:var(--cream,#FBF6E6)}
@media(max-width:760px){
  .bible-callout{grid-template-columns:1fr;gap:0;text-align:center}
  .bible-callout .bc-art{padding:20px 20px 0;max-width:420px;margin:0 auto}
  .bible-callout .bc-body{padding:14px 22px 26px}
  .bible-callout .bc-text{margin-left:auto;margin-right:auto}
}