:root{
  --bg:#100d0a;--bg2:#17120e;--panel:#201912;--panel2:#281f17;
  --text:#eee4d4;--muted:#ad9f8b;--gold:#c58a3e;--gold2:#9a672d;
  --line:rgba(211,166,94,.19);--max:1180px;--radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--text);
  background:
    radial-gradient(circle at 15% 8%,rgba(122,72,30,.13),transparent 34rem),
    linear-gradient(180deg,var(--bg),var(--bg2) 62%,#0d0b09);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
a{color:inherit;text-decoration:none}button,input{font:inherit}button{color:inherit}img{max-width:100%}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.shell{width:min(var(--max),calc(100% - 48px));margin:0 auto}
.site-header{
  position:sticky;top:0;z-index:50;height:76px;display:flex;align-items:center;
  background:rgba(15,12,9,.91);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.06)
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;gap:11px;min-width:0}
.brand img{width:46px;height:46px;border-radius:50%}
.brand strong{font:400 20px Georgia,"Times New Roman",serif}
.brand small{display:block;color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-top:2px}
nav{display:flex;align-items:center;gap:22px;color:#d4c7b5;font-size:14px}
nav a:hover{color:#fff0d9}.support-pill{border:1px solid var(--line);padding:9px 14px;border-radius:999px}

.hero{
  min-height:1040px;position:relative;display:flex;align-items:stretch;overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.05)
}
.hero-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center
}
.hero-shade{
  position:absolute;inset:0;background:
    linear-gradient(90deg,rgba(9,7,5,.64) 0%,rgba(9,7,5,.40) 20%,rgba(9,7,5,.10) 34%,rgba(9,7,5,.02) 44%,rgba(9,7,5,.01) 72%,rgba(9,7,5,.10) 100%),
    linear-gradient(0deg,rgba(10,8,6,.76) 0%,rgba(10,8,6,.46) 24%,rgba(10,8,6,.12) 48%,transparent 68%)
}
.hero-shell{position:relative;z-index:2;display:flex;align-items:flex-end;padding-bottom:18px}
.hero-kjv{
  position:absolute;z-index:5;top:30px;left:50%;transform:translateX(-50%);display:block!important;visibility:visible!important;opacity:1!important;
  margin:0;padding:8px 14px;border:1px solid rgba(197,138,62,.34);border-radius:999px;
  background:rgba(18,13,9,.90);box-shadow:0 4px 18px rgba(0,0,0,.22);
  color:#d59b4d;font-size:10px;font-weight:800;letter-spacing:.24em;text-transform:uppercase;
  white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.6)
}
.hero-content{
  position:relative;max-width:555px;padding:0 0 24px;transform:none
}
.hero-content:before{
  content:"";position:absolute;z-index:-1;inset:-26px -42px -22px -34px;pointer-events:none;
  background:radial-gradient(ellipse at 12% 58%,rgba(8,6,5,.76) 0%,rgba(8,6,5,.50) 40%,rgba(8,6,5,.20) 64%,transparent 78%)
}
.eyebrow{margin:0 0 13px;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.hero-wordmark{display:none}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.02em}
.hero h1{font-size:clamp(43px,4.3vw,59px);line-height:1.03;margin:0 0 16px;text-shadow:0 2px 18px rgba(0,0,0,.70)}
.lede{max-width:555px;font:18px/1.65 Georgia,"Times New Roman",serif;color:#e0d4c4;text-shadow:0 1px 10px rgba(0,0,0,.72)}
.actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:47px;padding:0 19px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-weight:700;font-size:14px}
.btn-primary{background:linear-gradient(135deg,#d3a052,#9d672a);color:#1b1208;border:0}
.btn-ghost{background:rgba(15,12,9,.42);backdrop-filter:blur(3px)}
.promise{margin-top:22px;color:#c2b39f;font-size:13px;text-shadow:0 1px 8px rgba(0,0,0,.72)}

.section{padding:82px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:32px}
.section h2{font-size:clamp(34px,4vw,54px);margin:.12em 0}.intro{max-width:520px;color:var(--muted);line-height:1.7}
.watch-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,.68fr);gap:22px}
.player{aspect-ratio:16/9;min-height:270px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;position:relative;background:#080706;box-shadow:0 20px 52px rgba(0,0,0,.32)}
.placeholder{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:32px;background:radial-gradient(circle at center,rgba(194,129,54,.17),transparent 22rem),linear-gradient(145deg,#18110c,#090806)}
.placeholder img{width:112px;border-radius:50%}.placeholder h3{font-size:27px;margin:14px 0 5px}.placeholder p{margin:0;color:var(--muted)}
.mount,.mount iframe,.mount video{position:absolute;inset:0;width:100%;height:100%;border:0}
.now{border:1px solid var(--line);border-radius:var(--radius);padding:27px;background:linear-gradient(180deg,rgba(42,33,25,.88),rgba(25,20,16,.84))}
.now h3{font-size:29px;margin:4px 0 12px}.now p{color:var(--muted);line-height:1.65}
.now-controls{display:flex;gap:8px;margin:24px 0 18px}.mini{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:999px;padding:9px 12px;cursor:pointer}.mini:disabled{opacity:.34;cursor:not-allowed}
.text-link{color:#d4a05a;font-weight:700;font-size:14px}.disabled{pointer-events:none;opacity:.35}

.library-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.search{min-height:42px;width:270px;border-radius:999px;border:1px solid var(--line);background:#17120e;color:var(--text);padding:0 16px;outline:none}
.filter{min-height:42px;border:1px solid var(--line);background:#17120e;border-radius:999px;padding:0 13px;color:#bbad99;cursor:pointer}
.filter.active,.filter:hover{background:#2a2118;color:#f3e7d4;border-color:rgba(209,154,78,.4)}
.book-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.book-card{position:relative;min-height:176px;text-align:left;padding:22px;border-radius:16px;border:1px solid rgba(255,255,255,.07);cursor:pointer;color:var(--text);overflow:hidden;background:
  radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 27%,transparent),transparent 62%),
  linear-gradient(160deg,#211a14,#14100d)}
.book-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--accent);opacity:.8}
.book-card small{color:var(--accent);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.16em}
.book-card h3{font-size:25px;margin:21px 0 7px}.book-card p{margin:0;color:var(--muted);font-size:13px}
.book-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 60%,transparent)}
.roadmap{margin-top:26px;border-top:1px solid var(--line);padding-top:22px;color:var(--muted);display:flex;justify-content:space-between;gap:24px;align-items:center}
.roadmap strong{color:#ded1bd;font-family:Georgia,serif;font-size:19px;font-weight:400}

.three-up{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:20px}
.feature{border-top:1px solid var(--line);padding:28px 5px 12px}.feature span{color:var(--gold);font:italic 18px Georgia,serif}.feature h3{font-size:30px;margin:12px 0 7px}.feature p{max-width:330px;color:var(--muted);line-height:1.65}
.about{display:grid;grid-template-columns:1.5fr .65fr;gap:75px;align-items:center;border-top:1px solid var(--line)}
.about-copy>p:not(.eyebrow){font:17px/1.8 Georgia,serif;color:#baad99}.about img{width:min(100%,300px);border-radius:50%}
blockquote{margin:32px 0 0;padding:18px 0 0 23px;border-left:2px solid var(--gold2);font:italic 21px/1.6 Georgia,serif;color:#dfd1bd}
blockquote cite{display:block;margin-top:8px;color:var(--gold);font:normal 11px Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase}

.support-band{margin-bottom:74px;border:1px solid var(--line);border-radius:22px;padding:43px;display:flex;justify-content:space-between;align-items:center;gap:40px;background:linear-gradient(145deg,#251c15,#17120e)}
.support-band h2{font-size:39px}.support-band p{max-width:650px;color:var(--muted);line-height:1.65}

.drawer{position:fixed;inset:0;z-index:70;pointer-events:none}.drawer.open{pointer-events:auto}
.backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(0,0,0,.68);opacity:0;transition:.2s}
.drawer.open .backdrop{opacity:1}
.drawer-panel{position:absolute;right:0;top:0;width:min(470px,92vw);height:100%;overflow:auto;padding:31px;background:#17120e;border-left:1px solid var(--line);transform:translateX(100%);transition:.24s}
.drawer.open .drawer-panel{transform:none}.drawer-close{float:right;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#211a14;font-size:25px;cursor:pointer}
.drawer-panel h2{font-size:43px;margin:3px 0 8px}.drawer-meta{color:var(--muted)}
.complete-btn{width:100%;margin:28px 0 21px;padding:19px;border-radius:14px;text-align:left;cursor:pointer;border:1px solid rgba(209,154,78,.32);background:linear-gradient(135deg,rgba(197,138,62,.18),rgba(197,138,62,.05))}
.complete-btn small{display:block;color:var(--gold);font-size:10px;letter-spacing:.15em;text-transform:uppercase}.complete-btn strong{display:block;margin-top:5px;font:400 21px Georgia,serif}
.chapter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.chapter-btn{aspect-ratio:1;border-radius:12px;border:1px solid var(--line);background:#201913;cursor:pointer}.chapter-btn:hover{background:#2d231a;border-color:rgba(209,154,78,.5)}

.page-hero{padding:90px 0 56px;border-bottom:1px solid var(--line)}.page-hero h1{font-size:clamp(42px,6vw,68px)}.prose{max-width:780px}.prose p,.prose li{color:#bcaf9d;line-height:1.8}.prose h2{font-size:32px;margin-top:38px}
.support-card{max-width:780px;border:1px solid var(--line);border-radius:20px;padding:34px;background:linear-gradient(145deg,#251c15,#17120e);margin-top:28px}
.status-note{padding:13px 15px;border:1px solid var(--line);border-radius:12px;color:#cabcaa;background:#18130f}
.site-footer{border-top:1px solid rgba(255,255,255,.06);padding:56px 0;text-align:center;color:var(--muted)}.site-footer img{width:205px;opacity:.9}.footer-links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:18px 0;font-size:13px}.footer-small{font-size:12px}

@media(max-width:900px){
  .hero{min-height:940px}
  nav a:not(.support-pill){display:none}.section-head{align-items:flex-start;flex-direction:column}
  .watch-grid,.about{grid-template-columns:1fr}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about>img{display:none}.support-band{align-items:flex-start;flex-direction:column}.roadmap{align-items:flex-start;flex-direction:column}
}
@media(max-width:590px){
  .shell{width:calc(100% - 30px)}.brand small{display:none}.hero{min-height:840px}.hero-bg{object-position:58% center}.hero-kjv{top:20px;font-size:9px;padding:7px 11px}.hero-content{padding-bottom:24px;max-width:100%}.hero-content:before{inset:-24px -20px -18px -20px}.hero h1{font-size:43px}
  h1{font-size:44px}.section{padding:62px 0}.book-grid{grid-template-columns:1fr}.library-tools,.search{width:100%}
  .three-up{grid-template-columns:1fr}.support-band{padding:29px 22px}.chapter-grid{grid-template-columns:repeat(3,1fr)}
}

/* Hero V6: keep the main message on one line on desktop and let the shorter block sit lower. */
@media (min-width: 901px){
  .hero-content{
    max-width:940px;
    padding-bottom:24px;
  }
  .hero h1{
    white-space:nowrap;
    font-size:clamp(40px,3.3vw,52px);
    line-height:1.05;
    margin-bottom:14px;
  }
  .lede{
    max-width:700px;
    margin-top:0;
  }
  .hero-content:before{
    inset:-22px -56px -20px -34px;
  }
}

@media (max-width:900px){
  .hero h1{white-space:normal}
}

/* =========================================================
   Lamplit Bible — Responsive Mobile V7
   Preserves the desktop hero while reflowing the site cleanly
   for tablets and phones.
   ========================================================= */

body{overflow-x:hidden}

@media (max-width: 900px){
  .shell{width:min(100% - 32px,var(--max))}

  .site-header{height:68px}
  .header-inner{gap:12px}
  .brand{gap:9px}
  .brand img{width:40px;height:40px;flex:0 0 40px}
  .brand strong{font-size:18px;white-space:nowrap}
  .brand small{font-size:9px;letter-spacing:.09em}
  nav{gap:10px;font-size:13px;flex:0 0 auto}
  nav a:not(.support-pill){display:none}
  .support-pill{padding:8px 12px}

  /* On phones/tablets the banner becomes its own responsive image,
     and the hero message flows below it instead of overlapping it. */
  .hero{
    display:block;
    min-height:0;
    overflow:hidden;
    background:linear-gradient(180deg,#100d0a,#15100c);
  }
  .hero-bg{
    position:relative;
    inset:auto;
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:16/9;
    object-fit:cover;
    object-position:center center;
  }
  .hero-shade{display:none}
  .hero-kjv{
    top:14px;
    padding:7px 11px;
    font-size:9px;
    letter-spacing:.19em;
    background:rgba(18,13,9,.86);
  }
  .hero-shell{display:block;padding:0}
  .hero-content{
    max-width:none;
    width:100%;
    padding:28px 0 38px;
    transform:none;
  }
  .hero-content:before{display:none}
  .hero h1{
    white-space:normal;
    font-size:clamp(36px,8.2vw,48px);
    line-height:1.04;
    margin:0 0 14px;
    text-shadow:none;
  }
  .lede{
    max-width:720px;
    margin:0;
    font-size:17px;
    line-height:1.58;
    color:#ddd0bd;
    text-shadow:none;
  }
  .actions{margin-top:20px}
  .promise{margin-top:18px;text-shadow:none}

  .section{padding:64px 0}
  .section-head{
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
    margin-bottom:26px;
  }
  .section h2{font-size:clamp(34px,7vw,46px);line-height:1.06}
  .intro{max-width:100%}

  .watch-grid{grid-template-columns:1fr;gap:16px}
  .player{min-height:0;width:100%}
  .now{padding:24px}

  .library-tools{width:100%;justify-content:flex-start;gap:8px}
  .library-tools label{width:100%}
  .search{width:100%;max-width:none}
  .filter{flex:0 1 auto}
  .book-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .book-card{min-height:158px;padding:20px}
  .book-card h3{font-size:23px;margin-top:18px}

  .roadmap{flex-direction:column;align-items:flex-start;gap:12px}
  .three-up{grid-template-columns:1fr;gap:10px}
  .feature{padding-top:22px}
  .about{grid-template-columns:1fr;gap:28px}
  .about>img{display:none}
  .support-band{flex-direction:column;align-items:flex-start;gap:24px}

  .page-hero{padding:66px 0 42px}
  .page-hero h1{font-size:clamp(38px,9vw,56px);line-height:1.04}
  .support-card{padding:28px}

  .drawer-panel{width:min(500px,100vw)}
  .site-footer{padding:44px 0}
}

@media (max-width: 640px){
  .shell{width:calc(100% - 28px)}

  .site-header{height:62px}
  .brand img{width:36px;height:36px;flex-basis:36px}
  .brand strong{font-size:17px}
  .brand small{display:none}
  .support-pill{padding:7px 11px;font-size:12px}

  .hero-kjv{top:10px;font-size:8px;padding:6px 9px;letter-spacing:.16em}
  .hero-content{padding:25px 0 32px}
  .hero h1{font-size:clamp(34px,10vw,42px);margin-bottom:12px}
  .lede{font-size:16px;line-height:1.55}
  .actions{display:grid;grid-template-columns:1fr;width:100%;gap:10px}
  .btn{width:100%;min-height:46px;padding:0 16px}
  .promise{font-size:12px;line-height:1.45}

  .section{padding:52px 0}
  .section-head{margin-bottom:22px}
  .section h2{font-size:clamp(32px,9vw,40px)}
  .eyebrow{font-size:10px}

  .now{padding:20px}
  .now h3{font-size:26px}
  .now-controls{flex-wrap:wrap}
  .mini{flex:1 1 120px}

  .library-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .library-tools label{grid-column:1/-1}
  .filter{width:100%;padding:0 9px;font-size:12px}
  .book-grid{grid-template-columns:1fr}
  .book-card{min-height:145px;padding:18px}

  .roadmap{font-size:14px;line-height:1.55}
  .roadmap strong{font-size:18px}
  .feature h3{font-size:28px}
  .feature p{max-width:none}

  .about-copy>p:not(.eyebrow){font-size:16px;line-height:1.7}
  blockquote{font-size:19px;padding-left:18px}

  .support-band{padding:26px 20px;margin-bottom:54px;border-radius:18px}
  .support-band h2{font-size:34px;line-height:1.08}
  .support-band .actions{width:100%}

  .drawer-panel{padding:22px 16px}
  .drawer-panel h2{font-size:36px}
  .chapter-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .chapter-btn{min-width:0}

  .page-hero{padding:52px 0 34px}
  .page-hero h1{font-size:clamp(36px,11vw,48px)}
  .prose h2{font-size:28px}
  .support-card{padding:22px 18px}

  .site-footer img{width:175px}
  .footer-links{gap:12px;font-size:12px}
}

@media (max-width: 390px){
  .shell{width:calc(100% - 24px)}
  .brand strong{font-size:16px}
  .support-pill{padding:7px 9px}
  .hero h1{font-size:34px}
  .lede{font-size:15.5px}
  .library-tools{grid-template-columns:1fr 1fr}
  .chapter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}