:root{--bg:#0f221a;--bone:#ebe4d6;--ox:#2f7a4f;--mute:#9bb0a3;--line:#ebe4d62e;--gold:#c8b45f}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:17px/1.7 "Libre Franklin",system-ui,sans-serif;background:var(--bg);color:var(--bone)}
a{color:inherit}
:focus-visible{outline:3px solid var(--ox);outline-offset:3px}
.bl{font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-weight:400;letter-spacing:.03em;line-height:1}
nav{position:fixed;inset:0 0 auto;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px 5vw;background:#0f221acc;backdrop-filter:blur(6px)}
nav .bl{font-size:36px;text-decoration:none;color:var(--gold)}
nav .signin{justify-self:end;font-size:15px;padding:10px 18px;text-decoration:none;background:var(--gold);color:var(--bg)}
.burger{justify-self:start;display:grid;gap:6px;width:44px;padding:10px 6px;background:none;border:0;cursor:pointer}
.burger:hover{background:none}
.burger span{display:block;height:2px;background:var(--bone)}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
@media(prefers-reduced-motion:no-preference){.burger span{transition:transform .2s,opacity .2s}}
.menu{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 5vw;background:#0f221a}
.menu[hidden]{display:none}
.menu a{font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-size:clamp(56px,10vw,120px);line-height:1.05;letter-spacing:.03em;text-decoration:none;color:var(--gold)}
.menu a:hover{color:var(--bone)}
@media(max-width:600px){nav .bl{font-size:28px}nav .signin{font-size:13px;padding:8px 10px}}
.btn,button{display:inline-block;font:inherit;font-weight:700;padding:12px 24px;background:var(--ox);color:var(--bone);border:0;text-decoration:none;cursor:pointer}
.btn:hover,button:hover{background:var(--bone);color:var(--bg)}
.hero{min-height:100vh;display:grid;place-content:center;text-align:center;padding:12vh 5vw 8vh;background:linear-gradient(#0f221a66,#0f221ae6),url("img/hero.jpg") center/cover,url("img/hero.jpeg") center/cover,url("img/hero.png") center/cover,url("img/hero.webp") center/cover}
.hero h1{font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-weight:400;font-size:clamp(56px,11vw,160px);letter-spacing:.03em;text-transform:uppercase;line-height:1;animation:rise 1.2s ease-out both}
.hero p{margin-top:24px;color:var(--mute);font-size:18px}
.hero .btn{margin:32px auto 0}
@keyframes rise{from{opacity:0;transform:translateY(24px)}}
@media(prefers-reduced-motion:reduce){.hero h1{animation:none}html{scroll-behavior:auto}}
section{padding:12vh 5vw}
h2{font-size:clamp(48px,7vw,104px);margin-bottom:40px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;margin-bottom:48px}
.facts b{display:block;color:var(--mute);font-weight:400;font-size:14px}
.story{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:center}
.story p+p{margin-top:18px}
.story p{max-width:52ch}
.ph{position:relative;aspect-ratio:4/5;background:#1d3a2c center/cover}
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:20px 0 28px}
.strip .ph{aspect-ratio:1}
.member{max-width:1100px;margin-bottom:80px}
.member h3{font-size:36px}
.member p{max-width:56ch;color:var(--mute)}
.blurb{max-width:56ch;color:var(--mute);margin:-12px 0 28px}.strip.clergy{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:830px;margin-inline:auto}.strip.clergy .ph{flex:0 0 calc((100% - 16px)/3)}@media(max-width:800px){.strip.clergy .ph{flex-basis:calc(50% - 4px)}}
.fade::after{content:"";position:absolute;inset:0;background:linear-gradient(#0f221a99,#0f221acc);pointer-events:none}
.clergy .ph{display:grid;place-items:center;cursor:pointer}.clergy .ph span{position:relative;z-index:1;opacity:0;color:#fff;text-shadow:0 1px 10px #000c,0 0 3px #0008;font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-size:clamp(24px,3vw,34px);letter-spacing:.03em;text-align:center;padding:0 8px}
.clergy .ph:hover span,.clergy .ph:focus span,.clergy .ph:active span{opacity:1}.fade:hover::after,.fade:focus::after,.fade:active::after,a:hover .fade::after,a:active .fade::after{opacity:0}

@media(prefers-reduced-motion:no-preference){.clergy .ph span,.fade::after{transition:opacity .25s}}
.soon{overflow:hidden}
.soon span{position:absolute;left:50%;top:50%;width:170%;padding:10px 0;text-align:center;transform:translate(-50%,-50%) rotate(-35deg);background:#0f221acc;color:#fff;text-shadow:0 1px 8px #000a;font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-size:clamp(26px,3vw,38px);letter-spacing:.08em;text-transform:uppercase;opacity:0;pointer-events:none}
a:hover .soon span,a:focus .soon span,a:active .soon span{opacity:1}
a:hover .ph.soon,a:hover .ph.fade{filter:none}
@media(prefers-reduced-motion:no-preference){.soon span{transition:opacity .25s}}
.ff{flex:0 0 100%;text-align:center;margin-top:14px;font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:.08em;line-height:1}
.ff a{color:#fff;text-decoration:none;font-size:12px}.ff a:hover{opacity:.8}
.ff b{font-weight:400;font-size:30px;color:#ece5d8}.ff i{font-style:normal;font-size:30px;color:#e2543a}
.center{text-align:center}
.center p{max-width:46ch;margin:0 auto 28px;color:var(--mute)}
form{display:grid;gap:18px;max-width:560px}
label{display:grid;gap:6px;font-size:15px}
input,textarea{font:inherit;padding:12px;border:1px solid var(--line);background:#173226;color:var(--bone)}
footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:32px 5vw;border-top:1px solid var(--line);font-size:14px;color:var(--mute)}
