/* ============================================================
   BIBLE — OLD TESTAMENT THEME
   Terracotta · Bronze · Olive · Papyrus · Obsidian
   (Distinct from Gita's orange/gold and NT's royal-blue/burgundy)
   ============================================================ */
:root{
  /* Core palette */
  --bo-obsidian:#1a0f0a;         /* deep earth */
  --bo-obsidian-2:#2b1a10;
  --bo-terracotta:#a0522d;       /* burnt sienna — primary */
  --bo-terracotta-dark:#7a3d1f;
  --bo-terracotta-light:#c66b3d;
  --bo-bronze:#b8860b;           /* dark goldenrod */
  --bo-bronze-light:#daa520;
  --bo-gold:#e8b923;
  --bo-olive:#556b2f;            /* secondary */
  --bo-olive-light:#6b8e23;
  --bo-sand:#f5e7c8;
  --bo-sand-dark:#e8d4a0;
  --bo-clay:#d4a574;
  --bo-papyrus:#faf1dc;
  --bo-bone:#fdf8ee;
  --bo-text:#2d1810;
  --bo-text-soft:#5a3d2a;
  --bo-verse:#7a3d1f;
  --bo-shadow:0 8px 32px rgba(45,24,16,.18);
  --bo-shadow-hover:0 16px 48px rgba(45,24,16,.28);
  --bo-radius:14px;
  --bo-radius-sm:10px;
  --bo-transition:all .3s cubic-bezier(.4,0,.2,1);
  --bo-serif:'Palatino Linotype','Book Antiqua',Palatino,'Times New Roman',Georgia,serif;
}
html{scroll-behavior:smooth}

/* ---------- Page shell ---------- */
.bo-page{
  background:
    radial-gradient(circle at 12% 10%,rgba(184,134,11,.08) 0,transparent 38%),
    radial-gradient(circle at 88% 92%,rgba(160,82,45,.07) 0,transparent 42%),
    linear-gradient(135deg,var(--bo-papyrus) 0%,var(--bo-sand) 55%,var(--bo-sand-dark) 100%);
  min-height:100vh; padding:1.5rem 0 3rem;
  font-family:var(--bo-serif);
}

/* ---------- Ancient Hero ---------- */
.bo-hero{
  background:linear-gradient(135deg,#1a0f0a 0%,var(--bo-obsidian-2) 45%,#3d2214 100%);
  color:#fff; padding:2.5rem 1.5rem; border-radius:var(--bo-radius);
  margin-bottom:2rem; position:relative; overflow:hidden;
  box-shadow:var(--bo-shadow); text-align:center;
}
.bo-hero::before{
  content:'✦';
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-size:15rem; line-height:1;
  color:rgba(232,185,35,.06);
  pointer-events:none;
}
.bo-hero::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 50% 100%,rgba(184,134,11,.18) 0,transparent 65%);
  pointer-events:none;
}
.bo-hero h1{
  font-family:var(--bo-serif);
  font-size:clamp(1.5rem,4vw,2.75rem); font-weight:800;
  letter-spacing:.06em; margin-bottom:.4rem; position:relative;
  background:linear-gradient(135deg,#daa520 0%,#f0c93a 50%,#b8860b 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:0 2px 20px rgba(232,185,35,.1);
}
.bo-hero .bo-subtitle{
  color:#cbbda0; font-size:1rem; margin:0; position:relative;
  font-style:italic; letter-spacing:.05em;
}
.bo-hero .bo-hero-icons{
  display:flex; justify-content:center; gap:1.2rem;
  margin-top:1rem; position:relative;
}
.bo-hero .bo-hero-icons i{
  font-size:1.3rem; color:var(--bo-gold);
  opacity:.85; transition:var(--bo-transition);
}
.bo-hero .bo-hero-icons i:hover{
  transform:translateY(-3px); opacity:1;
}

/* ---------- Book shelf / hub section ---------- */
.bo-shelf{
  background:var(--bo-bone); border-radius:var(--bo-radius);
  box-shadow:var(--bo-shadow); overflow:hidden;
  margin-bottom:2rem;
  border:1px solid rgba(45,24,16,.08);
}
.bo-shelf-header{
  background:linear-gradient(135deg,var(--bo-terracotta-dark),var(--bo-terracotta));
  color:var(--bo-gold);
  padding:1rem 1.4rem; font-weight:700; font-size:1.05rem;
  display:flex; align-items:center; gap:.6rem;
  font-family:var(--bo-serif); letter-spacing:.05em;
  border-bottom:3px solid var(--bo-bronze);
}
.bo-shelf-header .bi{font-size:1.35rem}

/* ---------- Book grid ---------- */
.bo-book-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:.55rem; padding:1.1rem;
}
.bo-book-btn{
  display:flex; align-items:center; justify-content:center;
  padding:.65rem .5rem; text-align:center;
  background:linear-gradient(135deg,var(--bo-papyrus),var(--bo-sand));
  border:1.5px solid rgba(160,82,45,.25);
  border-radius:var(--bo-radius-sm);
  color:var(--bo-text-soft); font-family:var(--bo-serif);
  font-weight:600; font-size:.85rem; text-decoration:none;
  transition:var(--bo-transition); position:relative;
  overflow:hidden;
}
.bo-book-btn::before{
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,transparent 55%,rgba(184,134,11,.18));
  opacity:0; transition:var(--bo-transition);
}
.bo-book-btn:hover{
  transform:translateY(-3px); text-decoration:none;
  background:linear-gradient(135deg,var(--bo-terracotta),var(--bo-terracotta-light));
  color:#fff;
  border-color:var(--bo-terracotta-dark);
  box-shadow:0 8px 20px rgba(160,82,45,.3);
}
.bo-book-btn:hover::before{opacity:1}

/* ---------- Book image banner ---------- */
.bo-book-images{
  display:flex; justify-content:center; align-items:center;
  gap:.8rem; flex-wrap:wrap; margin-top:1.5rem; padding:1rem;
}
.bo-book-images img{
  max-width:120px; height:auto; border-radius:6px;
  border:4px double var(--bo-bronze);
  box-shadow:var(--bo-shadow);
  transition:var(--bo-transition);
}
.bo-book-images img:hover{
  transform:scale(1.06) rotate(-2deg);
  box-shadow:var(--bo-shadow-hover);
}

/* ---------- Responsive iframe frame ---------- */
.bo-iframe-container{
  position:relative; width:100%; background:var(--bo-bone);
  border-radius:var(--bo-radius); overflow:hidden;
  box-shadow:var(--bo-shadow);
  border:3px solid var(--bo-bronze);
  margin-top:2rem;
}
.bo-iframe-container::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  border-radius:var(--bo-radius);
  box-shadow:inset 0 0 0 1px rgba(45,24,16,.08);
  z-index:2;
}
.bo-iframe-container iframe{
  display:block; width:100%; height:80vh; min-height:560px;
  border:none; background:#fff;
}
@media (max-width:768px){
  .bo-iframe-container iframe{height:70vh; min-height:440px}
}

/* ---------- Chapter header (per book) ---------- */
.bo-chapter-header{
  background:linear-gradient(135deg,var(--bo-obsidian),var(--bo-terracotta-dark));
  color:var(--bo-gold);
  padding:1.4rem 1.5rem;
  border-radius:var(--bo-radius);
  margin:1.5rem 0 1.25rem;
  text-align:center;
  box-shadow:var(--bo-shadow);
  position:relative; overflow:hidden;
}
.bo-chapter-header::after{
  content:''; position:absolute; bottom:0; left:0; right:0;
  height:4px;
  background:linear-gradient(90deg,transparent,var(--bo-bronze-light),transparent);
}
.bo-chapter-header h2{
  font-family:var(--bo-serif);
  font-size:clamp(1.15rem,3vw,1.7rem);
  font-weight:700; margin:0; letter-spacing:.05em;
}
.bo-chapter-header .bo-chapter-sub{
  color:#d8c8a8; font-size:.9rem; margin-top:.4rem; font-style:italic;
}

/* ---------- Chapter nav (grid of numbers) ---------- */
.bo-chapter-nav{
  display:flex; flex-wrap:wrap; gap:.35rem;
  padding:.9rem;
  background:var(--bo-bone);
  border:1px solid rgba(45,24,16,.1);
  border-radius:var(--bo-radius-sm);
  margin-bottom:1.5rem;
  box-shadow:inset 0 2px 8px rgba(45,24,16,.05);
}
.bo-chapter-nav a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:42px; height:36px; padding:0 .55rem;
  background:linear-gradient(135deg,var(--bo-papyrus),var(--bo-sand));
  border:1.5px solid rgba(160,82,45,.3);
  border-radius:50px;
  color:var(--bo-terracotta-dark);
  font-family:var(--bo-serif);
  font-weight:700; font-size:.82rem;
  text-decoration:none;
  transition:var(--bo-transition);
}
.bo-chapter-nav a:hover{
  background:linear-gradient(135deg,var(--bo-terracotta),var(--bo-terracotta-light));
  color:var(--bo-gold);
  border-color:var(--bo-terracotta-dark);
  transform:scale(1.1);
  box-shadow:0 4px 12px rgba(160,82,45,.35);
}

/* ---------- Chapter content card ---------- */
.bo-chapter-card{
  background:linear-gradient(135deg,var(--bo-bone) 0%,var(--bo-papyrus) 100%);
  border-radius:var(--bo-radius);
  padding:1.5rem 1.75rem 1.15rem;
  margin-bottom:1.5rem;
  box-shadow:var(--bo-shadow);
  border-left:5px solid var(--bo-bronze);
  position:relative;
  scroll-margin-top:90px;
  transition:var(--bo-transition);
  background-image:
    repeating-linear-gradient(
      90deg,
      transparent 0 60px,
      rgba(184,134,11,.02) 60px 61px
    );
}
.bo-chapter-card:hover{box-shadow:var(--bo-shadow-hover)}
.bo-chapter-card .bo-chapter-num{
  display:inline-flex; align-items:center; gap:.4rem;
  background:linear-gradient(135deg,var(--bo-terracotta),var(--bo-terracotta-light));
  color:var(--bo-gold);
  font-family:var(--bo-serif);
  font-weight:700; font-size:.85rem; letter-spacing:.06em;
  padding:.32rem .9rem; border-radius:6px;
  margin-bottom:1rem;
  box-shadow:0 3px 10px rgba(160,82,45,.35);
  border:1px solid var(--bo-bronze);
}
.bo-chapter-card p{
  font-family:var(--bo-serif);
  font-size:1rem; line-height:1.85;
  color:var(--bo-text);
  text-align:justify; margin-bottom:.75rem;
}
.bo-chapter-card p:last-of-type{margin-bottom:0}
.bo-chapter-card em{
  color:var(--bo-verse);
  font-style:normal; font-weight:700;
  font-size:.85em; margin-right:.3rem;
  padding:0 .15em;
}
.bo-chapter-card a{
  color:var(--bo-terracotta-dark);
  text-decoration:none;
  border-bottom:1px dotted var(--bo-terracotta-dark);
  transition:var(--bo-transition);
}
.bo-chapter-card a:hover{
  color:var(--bo-bronze);
  border-bottom-color:var(--bo-bronze);
}

/* ---------- Back to top ---------- */
.bo-back-top{
  display:inline-flex; align-items:center; gap:.35rem;
  background:linear-gradient(135deg,var(--bo-bronze),var(--bo-bronze-light));
  color:var(--bo-obsidian);
  font-weight:700; font-size:.78rem;
  padding:.32rem .9rem; border-radius:50px;
  text-decoration:none;
  transition:var(--bo-transition);
  box-shadow:0 2px 8px rgba(184,134,11,.35);
  font-family:var(--bo-serif); margin-top:.85rem;
  letter-spacing:.03em;
}
.bo-back-top:hover{
  transform:translateY(-2px);
  color:var(--bo-obsidian);
  text-decoration:none;
  box-shadow:0 6px 16px rgba(184,134,11,.55);
}

/* ---------- Divider ---------- */
.bo-divider{
  display:flex; align-items:center; justify-content:center;
  gap:.75rem; margin:2rem 0;
  color:var(--bo-bronze); font-size:1.4rem;
}
.bo-divider::before,.bo-divider::after{
  content:''; flex:1; height:2px;
  background:linear-gradient(90deg,transparent,var(--bo-terracotta),transparent);
}

/* ---------- Closing banner ---------- */
.bo-closing{
  background:linear-gradient(135deg,var(--bo-obsidian),var(--bo-terracotta-dark));
  color:#fff;
  border-radius:var(--bo-radius);
  padding:2rem 1.5rem;
  text-align:center;
  margin-top:2rem;
  box-shadow:var(--bo-shadow);
  position:relative; overflow:hidden;
}
.bo-closing::before{
  content:'✦';
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-size:12rem; color:rgba(232,185,35,.07);
  line-height:1; pointer-events:none;
}
.bo-closing .bo-closing-title{
  color:var(--bo-gold);
  font-family:var(--bo-serif);
  font-weight:700; font-size:1.05rem;
  margin-bottom:.75rem;
  position:relative; letter-spacing:.05em;
}
.bo-closing .bo-closing-text{
  color:#d8c8a8;
  font-size:.95rem; line-height:1.75;
  position:relative; font-style:italic;
}

/* ---------- Floating back-to-top ---------- */
.bo-fab-top{
  position:fixed; bottom:2rem; right:2rem;
  width:52px; height:52px; border-radius:50%;
  background:linear-gradient(135deg,var(--bo-terracotta),var(--bo-terracotta-light));
  color:var(--bo-gold);
  border:2px solid var(--bo-bronze);
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem;
  box-shadow:0 6px 20px rgba(160,82,45,.45);
  cursor:pointer;
  transition:var(--bo-transition);
  z-index:1000; opacity:0; visibility:hidden;
}
.bo-fab-top.show{opacity:1; visibility:visible}
.bo-fab-top:hover{
  transform:translateY(-4px) scale(1.05);
  box-shadow:0 10px 28px rgba(160,82,45,.6);
}

/* ---------- Utility: badge (small "OT" pill) ---------- */
.bo-badge-ot{
  display:inline-flex; align-items:center; gap:.35rem;
  background:linear-gradient(135deg,var(--bo-terracotta-dark),var(--bo-terracotta));
  color:var(--bo-gold);
  font-size:.72rem; font-weight:700; letter-spacing:.1em;
  padding:.25rem .75rem; border-radius:50px;
  border:1px solid var(--bo-bronze);
  text-transform:uppercase;
}

/* ---------- Mobile ---------- */
@media (max-width:576px){
  .bo-hero{padding:1.5rem 1rem}
  .bo-book-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.4rem}
  .bo-book-btn{font-size:.78rem;padding:.55rem .35rem}
  .bo-chapter-card{padding:1.15rem}
  .bo-chapter-nav a{min-width:36px;height:32px;font-size:.75rem}
  .bo-fab-top{bottom:1rem;right:1rem;width:46px;height:46px}
}
@media print{
  .bo-fab-top,.bo-back-top,.bo-chapter-nav{display:none!important}
  .bo-hero,.bo-shelf-header,.bo-chapter-header{color:#000!important;background:#fff!important}
}