/* ==========================================================================
   X-SEEK — Bible: AI Chat & Daily Pray
   Quiet, premium, reflective: parchment, ivory, midnight navy, restrained
   gold. Technology stays secondary to reading and reflection.
   ========================================================================== */

body[data-app="bible"] {
  background: var(--app-surface);
  color: var(--accent-ink);
}
body[data-app="bible"] .eyebrow { color: var(--accent); }
body[data-app="bible"] .site-nav.is-scrolled { background: color-mix(in srgb, var(--app-surface) 90%, transparent); border-bottom-color: var(--app-line); }
body[data-app="bible"] .nav-links a { color: color-mix(in srgb, var(--accent-ink) 60%, transparent); }
body[data-app="bible"] .nav-links a:hover, body[data-app="bible"] .nav-links a[aria-current="page"] { color: var(--accent-ink); }
body[data-app="bible"] .nav-brand, body[data-app="bible"] .nav-menu-btn { color: var(--accent-ink); }
body[data-app="bible"] .nav-brand__mark { background: var(--accent-ink); color: var(--app-surface); }
body[data-app="bible"] .nav-menu-btn { border-color: var(--app-line); }
body[data-app="bible"] .btn-primary { background: var(--accent-ink); color: var(--app-surface); }
body[data-app="bible"] .btn-ghost-dark { color: var(--accent-ink); border-color: var(--app-line); }
body[data-app="bible"] .btn-ghost-dark:hover { background: rgba(28,37,68,0.06); }

/* ---- Hero: light emerging from dark ---------------------------------------*/

.bible-hero {
  position: relative;
  overflow: hidden;
  background: radial-gradient(120% 100% at 50% -10%, #2a3560 0%, #1c2544 42%, #141a34 100%);
  padding-top: clamp(2rem, 1rem + 3vw, 3.5rem);
  padding-bottom: var(--sp-9);
}
.bible-hero__glow {
  position: absolute;
  top: -10%; left: 50%;
  transform: translateX(-50%);
  width: 90%; height: 70%;
  background: radial-gradient(50% 50% at 50% 0%, rgba(201, 169, 104, 0.22), transparent 70%);
  pointer-events: none;
}
.bible-hero-inner {
  position: relative; z-index: 1;
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: var(--page-pad);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bible-hero .eyebrow { color: #d8bd7c; justify-content: center; }
.bible-hero__title {
  font-size: var(--fs-11);
  color: #f7f1e2;
  max-width: 16ch;
  margin-top: var(--sp-3);
}
.bible-hero__sub {
  margin-top: var(--sp-4);
  font-size: var(--fs-7);
  color: rgba(247, 241, 226, 0.72);
  max-width: 50ch;
}
.bible-hero__actions { margin-top: var(--sp-5); justify-content: center; }
.bible-hero .btn-primary { background: #d8bd7c; color: #201a08; }
.bible-hero .btn-ghost-dark { color: #f7f1e2; border-color: rgba(247,241,226,0.28); }
.bible-hero .btn-ghost-dark:hover { background: rgba(247,241,226,0.08); }
.bible-hero__footnote { margin-top: var(--sp-3); font-size: var(--fs-4); color: rgba(247, 241, 226, 0.45); }

.bible-hero__device {
  position: relative;
  margin-top: var(--sp-7);
  width: min(72vw, 280px);
}
.bible-hero__device .device-frame { box-shadow: 0 40px 90px -30px rgba(0,0,0,0.7), 0 0 0 1px rgba(216,189,124,0.15); }
.bible-hero__rays {
  position: absolute;
  top: -18%; left: 50%;
  transform: translateX(-50%);
  width: 220%;
  height: 60%;
  background: conic-gradient(from 200deg at 50% 0%, transparent, rgba(216,189,124,0.16), transparent 30%);
  pointer-events: none;
  filter: blur(2px);
}

/* ---- Section shell (ivory) -------------------------------------------------*/

body[data-app="bible"] .section-title { color: var(--accent-ink); font-size: var(--fs-10); margin-top: var(--sp-2); }

/* ---- Reading path ------------------------------------------------------- */

.bible-path-grid {
  margin-top: var(--sp-6);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-4);
}
.bible-path-step {
  padding: var(--sp-5);
  border-radius: var(--radius-md);
  background: var(--app-surface-raised);
  border: 1px solid var(--app-line);
}
.bible-path-step__num { font-family: var(--font-display); font-style: italic; font-size: var(--fs-9); color: var(--accent); opacity: 0.6; }
.bible-path-step h3 { margin-top: var(--sp-2); font-size: var(--fs-8); color: var(--accent-ink); }
.bible-path-step p { margin-top: 0.5rem; color: color-mix(in srgb, var(--accent-ink) 62%, transparent); font-size: var(--fs-5); line-height: 1.6; }
@media (max-width: 820px) { .bible-path-grid { grid-template-columns: 1fr; } }

/* ---- Passage highlight demonstration ---------------------------------------*/

.bible-passage {
  border-top: 1px solid var(--app-line);
  background: linear-gradient(180deg, var(--app-surface), var(--app-surface-raised));
}
.bible-passage-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 4vw, 5rem);
  align-items: center;
  margin-top: var(--sp-6);
}
.bible-passage__card {
  background: var(--app-surface-raised);
  border: 1px solid var(--app-line);
  border-radius: var(--radius-lg);
  padding: clamp(1.75rem, 2vw, 2.75rem);
  box-shadow: var(--shadow-1);
}
.bible-passage__ref { font-size: var(--fs-4); letter-spacing: 0.08em; text-transform: uppercase; color: var(--accent); font-weight: 600; }
.bible-passage__text {
  margin-top: var(--sp-3);
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.85rem);
  line-height: 1.5;
  color: var(--accent-ink);
}
.bible-passage__text .hl {
  background: linear-gradient(180deg, transparent 62%, color-mix(in srgb, var(--accent) 45%, transparent) 62%);
  transition: background 900ms var(--ease-out);
}
.bible-passage.is-lit .bible-passage__text .hl { background: linear-gradient(180deg, transparent 62%, color-mix(in srgb, var(--accent) 55%, transparent) 62%); }

.bible-passage__copy h3 { font-size: var(--fs-9); color: var(--accent-ink); max-width: 15ch; }
.bible-passage__copy p { margin-top: var(--sp-3); color: color-mix(in srgb, var(--accent-ink) 62%, transparent); font-size: var(--fs-7); line-height: 1.65; max-width: 46ch; }
@media (max-width: 880px) { .bible-passage-inner { grid-template-columns: 1fr; } }

/* ---- Feature list (quiet, no cards) ------------------------------------- */

.bible-features { border-top: 1px solid var(--app-line); }
.bible-features-inner {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
  margin-top: var(--sp-6);
}
.bible-feature-list { display: flex; flex-direction: column; }
.bible-feature-item {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: var(--sp-3);
  padding-block: var(--sp-4);
  border-top: 1px solid var(--app-line);
}
.bible-feature-item:last-child { border-bottom: 1px solid var(--app-line); }
.bible-feature-item svg { color: var(--accent); margin-top: 4px; }
.bible-feature-item h3 { font-size: var(--fs-7); color: var(--accent-ink); }
.bible-feature-item p { margin-top: 0.35rem; font-size: var(--fs-5); color: color-mix(in srgb, var(--accent-ink) 60%, transparent); line-height: 1.6; }
@media (max-width: 880px) { .bible-features-inner { grid-template-columns: 1fr; } }

/* ---- Showcase -------------------------------------------------------------*/

.bible-showcase-grid {
  margin-top: var(--sp-6);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-4);
}
.bible-showcase-grid figcaption { margin-top: var(--sp-2); font-size: var(--fs-4); color: color-mix(in srgb, var(--accent-ink) 60%, transparent); text-align: center; }
@media (max-width: 880px) { .bible-showcase-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .bible-showcase-grid { grid-template-columns: 1fr; } }

/* ---- Final CTA (return to dark) -------------------------------------------*/

.bible-final {
  text-align: center;
  background: radial-gradient(120% 100% at 50% 110%, #2a3560 0%, #1c2544 45%, #141a34 100%);
  color: #f7f1e2;
}
.bible-final h2 { font-size: var(--fs-10); max-width: 18ch; margin-inline: auto; color: #f7f1e2; }
.bible-final p { margin-top: var(--sp-3); color: rgba(247,241,226,0.68); }
.bible-final .btn-row { justify-content: center; margin-top: var(--sp-5); }
.bible-final .btn-primary { background: #d8bd7c; color: #201a08; }

body[data-app="bible"] .switcher, body[data-app="bible"] .site-footer { background: #141a34; color: #f7f1e2; }
body[data-app="bible"] .switcher .switcher-card { background: rgba(247,241,226,0.04); border-color: rgba(247,241,226,0.12); }
body[data-app="bible"] .switcher .switcher-card:hover { background: rgba(247,241,226,0.08); }