*{box-sizing:border-box;margin:0}
:root{--crimson:#a3122a;--vestment:#7d0f20;--oxblood:#4a0a14;--linen:#f8eef0;--ink:#2b0e14;--line:#ecd5d9;--glass:rgba(255,255,255,.13);--edge:rgba(255,255,255,.34);--serif:'Bellefair',Georgia,serif;--text:'Spectral',Georgia,serif}
html{scroll-behavior:smooth}
body{font:400 1.1rem/1.7 var(--text);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
h1,h2,h3{font:400 1.2rem/1.08 var(--serif)}
a{color:inherit}
:focus-visible{outline:2px solid var(--crimson);outline-offset:3px}
.dark :focus-visible,.nav :focus-visible{outline-color:#fff}
.sr{position:absolute;left:-9999px}
.glass{background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 30px 60px -30px rgba(0,0,0,.55)}
.btn{display:inline-block;font:600 1rem/1 var(--text);padding:.9rem 1.7rem;border-radius:999px;border:1px solid transparent;background:#fff;color:var(--crimson);text-decoration:none;cursor:pointer}
.btn.ghost{background:transparent;color:#fff;border-color:var(--edge)}
.btn.red{background:var(--crimson);color:#fff}
.btn:hover{filter:brightness(.94)}

/* navigation */
.nav{position:fixed;z-index:20;top:14px;left:50%;transform:translateX(-50%);width:min(1120px,calc(100% - 24px));display:flex;align-items:center;justify-content:space-between;padding:.5rem .55rem .5rem 1.5rem;border-radius:999px;background:rgba(60,6,16,.5);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border:1px solid var(--edge);color:#fff}
.brand{font:1.5rem var(--serif);text-decoration:none}
.nav nav{display:flex;gap:.2rem;align-items:center}
.nav nav a{padding:.5rem 1rem;border-radius:999px;text-decoration:none;font-size:1rem}
.nav nav a:hover{background:rgba(255,255,255,.15)}
.nav nav a.visit{background:#fff;color:var(--crimson);font-weight:600}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--edge);background:transparent;cursor:pointer;position:relative}
.burger span{position:absolute;left:13px;right:13px;height:2px;background:#fff;top:17px}
.burger span+span{top:25px}

/* hero slider */
.hero{position:relative;min-height:100svh;color:#fff;overflow:hidden;background:var(--oxblood)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s;background-size:cover;background-position:center}
.slide.on{opacity:1}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(35,3,9,.72),rgba(35,3,9,.1) 75%)}
.v0{background-image:radial-gradient(55% 70% at 78% 25%,#d8304a,transparent 65%),linear-gradient(160deg,#8a1023,#2e0610)}
.v1{background-image:radial-gradient(50% 60% at 70% 80%,#c21e38,transparent 65%),radial-gradient(40% 50% at 90% 10%,#f0788a,transparent 60%),linear-gradient(200deg,#5c0b19,#260510)}
.v2{background-image:radial-gradient(60% 70% at 85% 60%,#e0455c,transparent 62%),linear-gradient(120deg,#6b0d1e,#340712)}
.hero-in{position:relative;z-index:2;min-height:100svh;display:grid;grid-template-columns:minmax(0,520px) 1fr;gap:3rem;align-items:end;padding:6.5rem 5vw 6.2rem;max-width:1360px;margin:auto}
.arch{border-radius:260px 260px 18px 18px;padding:8.5rem 2.6rem 2.6rem;text-align:center}
.arch-body{display:grid}
.copy{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .7s,visibility .7s}
.copy.on{opacity:1;visibility:visible}
.copy h2{font-size:clamp(2.3rem,4.6vw,3.5rem);margin-bottom:1rem}
.copy p{margin:0 auto 1.8rem;max-width:30ch;opacity:.92}
.pips{display:flex;gap:.6rem;justify-self:end}
.pip{width:38px;height:60px;border-radius:999px 999px 4px 4px;border:1px solid var(--edge);background:var(--glass);cursor:pointer;position:relative;overflow:hidden;padding:0}
.pip.on::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:bottom;animation:fill var(--dur,7s) linear forwards}
.hold .pip.on::after{animation-play-state:paused}
@keyframes fill{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.bar{position:absolute;z-index:3;left:0;right:0;bottom:0;display:flex;flex-wrap:wrap;gap:.2rem 2.4rem;padding:1.05rem 5vw;background:rgba(35,3,9,.38);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--edge);font-size:1rem}

/* daily prayer */
.prayer,.cta{position:relative;overflow:hidden;color:#fff;padding:7rem 5vw}
.prayer{background:var(--oxblood)}
.prayer::before{content:"";position:absolute;width:46rem;height:46rem;border-radius:50%;left:-14rem;top:-12rem;background:#b3142d;filter:blur(40px)}
.prayer::after{content:"";position:absolute;width:30rem;height:30rem;border-radius:50%;right:-6rem;bottom:-12rem;background:#e03a52;opacity:.55;filter:blur(40px)}
.prayer-in{position:relative;z-index:1;max-width:1120px;margin:auto;display:grid;grid-template-columns:auto 1fr;gap:4.5rem;align-items:center}
.day b{display:block;font:400 clamp(7rem,15vw,12rem)/.85 var(--serif)}
.day span{display:block;font-size:1.25rem;opacity:.85}
.quote{padding:3.4rem clamp(1.6rem,4vw,3.6rem) 2.4rem;border-radius:220px 26px 26px 26px}
.quote p{font:400 clamp(1.5rem,2.6vw,2.1rem)/1.4 var(--serif)}
.quote footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:2rem;opacity:.95}

/* about and services */
.about{padding:7rem 5vw;background:#fff}
.about-in{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.15fr .85fr;gap:5rem}
.about h2,.visit h2{font-size:clamp(2.3rem,4.4vw,3.6rem);color:var(--crimson);margin-bottom:1.5rem}
.lead{font-size:1.45rem;line-height:1.55;margin-bottom:1.2rem}
.times{list-style:none;padding:0;align-self:end}
.times li{display:grid;grid-template-columns:6.2rem 1fr;gap:1rem;align-items:baseline;padding:1rem 0;border-bottom:1px solid var(--line)}
.times b{font:400 1.8rem var(--serif);color:var(--crimson)}
.times small{display:block;color:#7a5a61;font-size:.95rem}

/* bible call to action */
.cta{background:var(--crimson)}
.cta::before{content:"";position:absolute;width:28rem;height:28rem;border-radius:50%;right:8%;top:-9rem;background:#ec5c72;filter:blur(30px)}
.cta-in{position:relative;z-index:1;max-width:1120px;margin:auto;display:grid;grid-template-columns:1fr minmax(0,380px);gap:4rem;align-items:center}
.cta h2{font-size:clamp(2.1rem,4vw,3.2rem);margin-bottom:1rem}
.cta form{padding:2rem;border-radius:26px;display:grid;gap:1rem}
.cta label{display:grid;gap:.3rem;font-weight:600}
.cta select,.cta input{font:inherit;padding:.7rem .9rem;border-radius:12px;border:1px solid var(--edge);background:rgba(255,255,255,.9);color:var(--ink);width:100%}

/* visit and footer */
.visit{padding:6rem 5vw;background:var(--linen)}
.visit-in{max-width:1120px;margin:auto}
.visit dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem}
.visit dt{color:var(--crimson);font:1.35rem var(--serif)}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding:2.2rem 5vw;background:var(--oxblood);color:#fff}
.foot p{opacity:.75}
.foot>a{opacity:.6;font-size:.95rem}

/* bible reader */
.reader-wrap{position:relative;overflow:hidden;min-height:100vh;padding:6.5rem 4vw 6rem;background:var(--oxblood);color:#fff}
.reader-wrap::before{content:"";position:fixed;width:40rem;height:40rem;border-radius:50%;left:-12rem;top:-10rem;background:#b3142d;filter:blur(50px)}
.reader-wrap::after{content:"";position:fixed;width:28rem;height:28rem;border-radius:50%;right:-8rem;bottom:-10rem;background:#e03a52;opacity:.5;filter:blur(50px)}
.tools,.page{position:relative;z-index:1}
.tools{max-width:980px;margin:0 auto;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding:.6rem;border-radius:34px}
.tools select,.tools input{font:inherit;font-size:1rem;color:#fff;background:rgba(255,255,255,.12);border:1px solid var(--edge);border-radius:999px;padding:.6rem 1rem}
.tools input{flex:1;min-width:160px}
.tools input::placeholder{color:rgba(255,255,255,.7)}
.tools option,.tools optgroup{color:#000}
.tools .btn{padding:.7rem 1.1rem}
.size{display:flex;gap:.3rem}
.page{max-width:820px;margin:1.4rem auto 0;background:rgba(255,255,255,.96);color:var(--ink);border-radius:240px 240px 24px 24px;padding:7.5rem clamp(1.5rem,6vw,4.5rem) 3rem}
.page h1{text-align:center;font-size:clamp(2.2rem,5vw,3.2rem);color:var(--crimson);margin-bottom:2.2rem}
.text{font-size:var(--fs,1.3rem);line-height:1.9}
.v{cursor:pointer;border-radius:4px;transition:background .2s}
.v.sel{background:#f6d3d9}
.v sup{font:600 .62em var(--text);color:var(--crimson);margin-right:.3em;vertical-align:.5em}
.empty{text-align:center;color:#7a5a61}
.pager{display:flex;justify-content:space-between;gap:1rem;margin-top:2.6rem}
.results h1{margin-bottom:1rem}
.results button.hit{display:block;width:100%;text-align:left;padding:.9rem 0;border:0;border-bottom:1px solid var(--line);background:none;font:inherit;cursor:pointer;color:inherit}
.results b{color:var(--crimson)}
.results mark{background:#f6d3d9;color:inherit}
.selbar{position:fixed;z-index:15;left:50%;bottom:18px;transform:translateX(-50%);display:none;align-items:center;gap:.8rem;padding:.6rem .6rem .6rem 1.4rem;border-radius:999px;background:rgba(60,6,16,.7);color:#fff}
.selbar.on{display:flex}

/* admin */
.adm{background:var(--linen);min-height:100vh}
.adm header{background:var(--oxblood);color:#fff;display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;padding:.9rem 4vw}
.adm header b{font:1.5rem var(--serif);margin-right:auto}
.adm header a{padding:.4rem .9rem;border-radius:999px;text-decoration:none}
.adm header a.on{background:#fff;color:var(--crimson)}
.adm main{max-width:880px;margin:2rem auto;padding:0 4vw 4rem}
.adm h1{font-size:2.3rem;color:var(--crimson);margin-bottom:.5rem}
.adm form{display:grid;gap:.9rem}
.adm label{display:grid;gap:.3rem;font-weight:600;font-size:.95rem}
.adm input,.adm textarea,.adm select{font:inherit;font-weight:400;padding:.65rem .8rem;border:1px solid #d9b9bf;border-radius:10px;background:#fff;width:100%}
.adm input[type=checkbox]{width:auto}
.adm details,.adm .box{background:#fff;border:1px solid var(--line);border-radius:14px;margin:.8rem 0}
.adm .box{padding:1.2rem}
.adm summary{padding:1rem 1.2rem;cursor:pointer;display:flex;justify-content:space-between;gap:1rem}
.adm details>form,.adm details>.del{padding:0 1.2rem 1.2rem}
.adm .row{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.adm .ok,.adm .bad{background:#fff;border-left:4px solid var(--crimson);padding:.8rem 1rem;margin:1rem 0}
.adm .btn{background:var(--crimson);color:#fff;justify-self:start}
.adm .btn.danger{background:none;color:var(--crimson);border-color:var(--crimson)}
.adm .thumb{width:100%;max-height:150px;object-fit:cover;border-radius:10px}
.adm small{font-weight:400;color:#6b4b52}
.adm .login{max-width:380px;margin:12vh auto;background:#fff;padding:2rem;border-radius:20px}

@media(max-width:860px){
  .burger{display:block}
  .nav nav{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;align-items:stretch;padding:.6rem;border-radius:26px;background:rgba(60,6,16,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--edge)}
  .nav.open nav{display:flex}
  .hero-in{grid-template-columns:1fr;padding-bottom:8rem;gap:1.4rem}
  .arch{border-radius:200px 200px 18px 18px;padding:6.5rem 1.4rem 2rem}
  .pips{justify-self:center}
  .pip{width:30px;height:46px}
  .prayer-in,.about-in,.cta-in{grid-template-columns:1fr;gap:2.5rem}
  .day{display:flex;gap:1.2rem;align-items:flex-end}
  .day b{font-size:6rem}
  .quote{border-radius:120px 24px 24px 24px;padding-top:2.6rem}
  .page{border-radius:150px 150px 20px 20px;padding-top:5rem}
  .adm .row{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}