/* ==========================================================================
   theprophecyledger.com , sacred-archive theme override
   Loaded AFTER /styles.css. Redefines the SAME custom-property names
   styles.css's rules already read from, swapping the gunmetal+cyan system
   for near-black + gold leaf, and adds a small set of new component
   classes for schema fields styles.css never had (self-ID pills,
   scripture-support lists, evidence-review lines, calendar/signal
   components). Class names from styles.css are kept working as-is.
   ========================================================================== */
:root {
  --navy-deep: #050403;
  --navy: #120e09;
  --navy-light: #1b140c;
  --gold: #d4af5b;
  --gold-bright: #f3d98a;
  --gold-small: #e3c169;
  --white: #f6f1e6;
  --dim: #cfc9bc;
  --dim-strong: #a89f89;
  --line: rgba(212, 175, 91, 0.22);
  --glow: #d4af5b;
  --glow-soft: rgba(212, 175, 91, 0.3);
  --metal: linear-gradient(135deg, #f3e6bd 0%, #c9a94f 45%, #f6ecc9 70%, #ad8a3a 100%);
}
/* 2026-09-03 legibility pass (Jason directive), matching rapturenft.com's
   theme.css: --dim/--dim-strong raised in luminance, --gold-small added
   for small labels/eyebrows/refs (kept off large display type, which
   stays --gold/--gold-bright). Caption/footnote minimum is 13px; the
   base styles.css classes below are overridden here rather than edited
   in styles.css itself, since that file is still shared byte-for-byte
   with jasonhaygood.com and must stay untouched. */
.section-eyebrow { font-size: 13px; color: var(--gold-small); }
.kc-label, .cc-label, .vc-label { font-size: 13px; }
.footer-meta { font-size: 13px; }
.venture-card.mini .vc-label { font-size: 13px; }
.hp-subtitle { font-size: 13px; }
.hp-booklink { font-size: 13px; }
body { background: var(--navy-deep); background-image: radial-gradient(ellipse at 20% 0%, rgba(212,175,91,0.05), transparent 55%); }
/* Safety net: no page in this project has a global img{max-width:100%}
   reset, so any <img> that misses its intended class rule (or loads
   before/without theme.css) renders at its native pixel width and blows
   out the page at narrow viewports. Cheap, harmless, always correct. */
img { max-width: 100%; }

/* ---- self-identification pill (Part 1b schema extension) ---- */
.pill.selfid { border-color: var(--line); color: var(--gold-bright); background: rgba(212,175,91,0.08); font-weight: 700; }
.pill.debunked { border-color: rgba(160,60,60,0.5); color: #d99; text-decoration: line-through; }
.pill.missed { border-color: rgba(160,60,60,0.5); color: #c98686; }
.pill.hit { border-color: var(--gold); color: var(--gold-bright); }
.x-body .scripture-support { margin: 8px 0; padding-left: 0; list-style: none; }
.x-body .scripture-support li { font-family: 'Fraunces', serif; font-style: italic; color: var(--gold-bright); font-size: 13px; margin-bottom: 4px; }
.x-body .evidence-review { font-size: 13px; color: var(--dim); border-top: 1px solid var(--line); padding-top: 8px; margin-top: 8px; }
.x-body .evidence-review b { color: var(--white); letter-spacing: 1px; font-size: 13px; display: block; margin-bottom: 4px; }

/* ---- full-bleed hero on new pages ---- */
.pl-hero { position: relative; min-height: 62vh; display: flex; align-items: flex-end; overflow: hidden; }
.pl-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; filter: brightness(0.5) saturate(0.9); }
.pl-hero-scrim { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(5,4,3,0.55) 0%, rgba(5,4,3,0.7) 50%, rgba(5,4,3,0.97) 100%); }
.pl-hero-content { position: relative; z-index: 2; padding: 160px 0 48px; }
.pl-hero-cap { position: absolute; left: 32px; bottom: 16px; z-index: 2; font-size: 13px; letter-spacing: 1.5px; color: var(--dim-strong); }

/* ---- sticky sub-nav ---- */
.pl-subnav { position: sticky; top: 0; z-index: 90; background: rgba(5,4,3,0.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); display: flex; gap: 4px; overflow-x: auto; padding: 0 24px; }
.pl-subnav a { padding: 14px 16px; font-size: 13px; font-weight: 700; letter-spacing: 1px; color: var(--dim); white-space: nowrap; border-bottom: 2px solid transparent; }
.pl-subnav a:hover, .pl-subnav a.on { color: var(--gold-small); border-bottom-color: var(--gold); }

/* ---- stats band (homepage) ---- */
.pl-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-top: 24px; }
.pl-stat { text-align: center; border: 1px solid var(--line); border-radius: 8px; padding: 22px 12px; background: var(--navy-light); }
.pl-stat b { display: block; font-family: 'Fraunces', serif; font-style: italic; font-weight: 700; font-size: 40px; color: var(--gold-bright); }
.pl-stat span { font-size: 13px; letter-spacing: 1px; color: var(--dim-strong); text-transform: uppercase; }

/* ---- calendar timeline ---- */
.pl-timeline { border-left: 2px solid var(--line); margin-left: 8px; padding-left: 24px; }
.pl-month { font-family: 'Fraunces', serif; font-style: italic; color: var(--gold-bright); font-size: 20px; margin: 32px 0 12px; position: relative; }
.pl-month::before { content: ""; position: absolute; left: -29px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px var(--glow-soft); }
.pl-entry { background: var(--navy-light); border: 1px solid var(--line); border-radius: 8px; padding: 14px 18px; margin-bottom: 10px; font-size: 13.5px; color: var(--dim); }
.pl-entry .et { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: 1px; padding: 2px 8px; border-radius: 999px; margin-right: 10px; border: 1px solid var(--line); }
.pl-entry .et.prophecy_claim { color: var(--gold-bright); border-color: var(--gold); }
.pl-entry .et.feast_day { color: #9ec9e8; border-color: rgba(158,201,232,0.4); }
.pl-entry .et.astronomical { color: #b39ee8; border-color: rgba(179,158,232,0.4); }
.pl-entry .et.cultural_marker { color: #9fd0a6; border-color: rgba(159,208,166,0.4); }
.pl-entry .et.historical_anniversary { color: #d9b56a; border-color: rgba(217,181,106,0.4); }
.pl-entry a { color: var(--gold-bright); }
.pl-legend { display: flex; gap: 14px; flex-wrap: wrap; margin: 8px 0 24px; font-size: 13px; color: var(--dim); }
details.pl-past { margin-top: 24px; }
details.pl-past summary { cursor: pointer; color: var(--dim); font-size: 13px; font-weight: 700; letter-spacing: 1px; }

/* ---- signals groups ---- */
.pl-signal-group { margin-bottom: 40px; }
.pl-signal-group h3 { font-family: 'Fraunces', serif; font-style: italic; color: var(--gold-bright); font-size: 20px; margin-bottom: 14px; }
.pl-signal { background: var(--navy-light); border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; margin-bottom: 10px; font-size: 13.5px; color: var(--dim); line-height: 1.6; }
.pl-signal .sig-title { color: var(--white); font-weight: 700; margin-bottom: 6px; }

/* ---- speaker taxonomy cards ---- */
.pl-taxo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-top: 8px; }
.pl-taxo-card { background: var(--navy-light); border: 1px solid var(--line); border-top: 3px solid var(--gold); border-radius: 8px; padding: 20px 22px; }
.pl-taxo-card .tc-label { font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 8px; }
.pl-taxo-card p { font-size: 13px; color: var(--dim); line-height: 1.55; margin-bottom: 8px; }
.pl-taxo-card .tc-test { font-family: 'Fraunces', serif; font-style: italic; color: var(--gold-bright); font-size: 13px; border-left: 2px solid var(--line); padding-left: 10px; }

/* ---- messianic (prophecies) filters + card ---- */
.pl-msg-card { background: var(--navy-light); border: 1px solid var(--line); border-radius: 8px; padding: 18px 20px; margin-bottom: 10px; }
.pl-msg-ot { font-family: 'Fraunces', serif; font-style: italic; color: var(--gold-bright); font-size: 14.5px; line-height: 1.55; }
.pl-msg-ref { font-size: 13px; letter-spacing: 1px; color: var(--dim-strong); margin: 4px 0 10px; }
.pl-msg-nt { font-size: 13px; color: var(--white); margin-bottom: 6px; }
.pl-msg-note { font-size: 13px; color: var(--dim); }
.pl-msg-consensus { display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: 1px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--line); color: var(--dim-strong); margin-top: 8px; }

/* ---- mobile nav overflow fix (2026-09-03) ---- */
/* prophecyledger's nav grew to 7 links + brand on top of styles.css's
   fixed .topnav, which never wraps (.footer-row/.footer-links reused for
   nav have no width cap). At 375px that forced the fixed nav wider than
   the viewport and dragged documentElement.scrollWidth past clientWidth
   (measured 1408px vs 375px), producing real page-level horizontal
   scroll. Scope the scroll to the nav's own link row instead: the row
   becomes a swipeable strip, the page stays fixed-width. */
@media (max-width: 760px) {
  .topnav .footer-row { flex-wrap: nowrap; }
  .topnav .footer-links {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: calc(100vw - 90px);
    gap: 18px;
    scrollbar-width: none;
  }
  .topnav .footer-links::-webkit-scrollbar { display: none; }
  .topnav .nav-link { flex-shrink: 0; }
}

/* Scripture translation switcher (2026-09-03). Shared markup convention:
   .translation-switcher holds 4 .translation-pill buttons (NIV/NKJV/ESV/KJV),
   built and driven entirely by /scripture.js. */
.translation-switcher {
  display: flex;
  gap: 4px;
  align-items: center;
  margin-left: 12px;
  flex-shrink: 0;
}
.translation-pill {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--dim, #9a9488);
  background: transparent;
  border: 1px solid var(--line, rgba(212,175,91,0.25));
  border-radius: 999px;
  padding: 4px 9px;
  cursor: pointer;
  transition: color .15s, background .15s, border-color .15s;
}
.translation-pill:hover { color: var(--gold-bright, #e8c766); border-color: var(--gold, #d4af5b); }
.translation-pill.active {
  color: #0c0a06;
  background: var(--gold, #d4af5b);
  border-color: var(--gold, #d4af5b);
}
.scripture-notice {
  font-size: 13px;
  color: var(--dim-strong, #6b6459);
  line-height: 1.5;
  max-width: 760px;
  margin: 10px auto 0;
  padding: 0 16px;
  text-align: center;
}
@media (max-width: 760px) {
  .translation-switcher { margin-left: 0; order: 3; width: 100%; justify-content: center; padding-top: 8px; }
}
.r-verse .v-text::before { content: "\201C"; }
.r-verse .v-text::after { content: "\201D"; }

/* ============================================================ MOBILE FIRST
   (2026-09-03, Jason directive) real edge padding + 44px tap targets at
   375/414px on theprophecyledger.com, matching rapturenft.com. */
@media (max-width: 480px) {
  .container { padding: 0 20px; }
  .pl-hero-content { padding: 130px 0 40px; }
}
.pl-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nav-link { min-height: 44px; display: inline-flex; align-items: center; }

/* ============================================================ HAMBURGER + LEFT DRAWER
   Same component/classes as rapturenft.com's theme.css so drawer.js is one
   shared file for both sites. Markup lives in build_sites.py's NAV_B (and
   NAV_A for the rapturenft.com ledger mirror). Hidden at desktop widths
   where .topnav already shows every link. */
.rn-hamburger {
  display: none;
  width: 44px; height: 44px;
  flex-direction: column; align-items: center; justify-content: center;
  gap: 5px;
  background: transparent; border: 1px solid var(--line); border-radius: 6px;
  cursor: pointer; flex-shrink: 0; margin-right: 12px;
}
.rn-hamburger span { display: block; width: 20px; height: 2px; background: var(--gold-small); border-radius: 2px; }
.rn-drawer-backdrop {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(5,4,3,0.7);
  opacity: 0; pointer-events: none;
  transition: opacity 0.22s ease;
}
.rn-drawer-backdrop.open { opacity: 1; pointer-events: auto; }
.rn-drawer {
  position: fixed; top: 0; left: 0; bottom: 0; z-index: 301;
  width: min(84vw, 320px);
  background: var(--navy);
  border-right: 1px solid var(--line);
  box-shadow: 20px 0 60px rgba(0,0,0,0.5);
  transform: translateX(-100%);
  transition: transform 0.26s ease;
  display: flex; flex-direction: column;
  padding: 20px 0;
  overflow-y: auto;
}
.rn-drawer.open { transform: translateX(0); }
.rn-drawer-head { display: flex; justify-content: space-between; align-items: center; padding: 4px 20px 20px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.rn-drawer-brand { font-family: 'Fraunces', serif; font-style: italic; color: var(--white); font-size: 16px; letter-spacing: 0.4px; }
.rn-drawer-close { width: 44px; height: 44px; display: grid; place-items: center; background: transparent; border: 1px solid var(--line); border-radius: 6px; color: var(--gold-small); font-size: 22px; line-height: 1; cursor: pointer; }
.rn-drawer-links { display: flex; flex-direction: column; padding: 4px 8px; }
.rn-drawer-links a {
  color: var(--dim); font-size: 15px; font-weight: 700; letter-spacing: 0.6px;
  padding: 13px 12px; border-radius: 6px; min-height: 44px; display: flex; align-items: center;
}
.rn-drawer-links a:hover, .rn-drawer-links a:focus-visible { color: var(--gold-small); background: rgba(212,175,91,0.08); }
.rn-drawer .translation-switcher { margin: 16px 12px 4px; padding-top: 16px; border-top: 1px solid var(--line); justify-content: flex-start; flex-wrap: wrap; }
body.rn-drawer-lock { overflow: hidden; }

@media (max-width: 899px) {
  .rn-hamburger { display: flex; }
  .topnav .footer-links { display: none; }
  .topnav .translation-switcher { display: none; }
  .topnav .footer-row { justify-content: flex-start; }
}
@media (min-width: 900px) {
  .rn-drawer, .rn-drawer-backdrop { display: none; }
}