:root{--pine:#284b63;--pine2:#24343d;--cream:#f7f2e8;--paper:#fcfaf6;--gold:#c9785c;--ink:#24343d;--muted:#66746f;--line:#dddcd3}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif}
a{color:inherit;text-decoration:none}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 7vw;background:#fcfaf6f5;border-bottom:1px solid #e5e0d6;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:12px;text-transform:uppercase;font-size:11px;letter-spacing:.13em;line-height:1.45}
.brand b{font-size:13px}
.compass{width:48px;height:48px;border-radius:50%;display:block;object-fit:contain;flex:0 0 auto}
.navLinks{display:flex;gap:34px;font-size:13px;font-weight:700}
.navLinks a:hover{color:#c9785c}
.hero{min-height:620px;background:linear-gradient(120deg,var(--pine2),var(--pine));color:white;padding:90px 7vw;display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:8vw;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0 0 0 auto;width:62%;background:linear-gradient(90deg,#24343d 0%,#284b63a8 30%,#284b6352 70%,#284b6326 100%),linear-gradient(180deg,#284b6366,#24343d8a),url('assets/spokane-temple.jpg') center/cover no-repeat;opacity:.86;mask-image:linear-gradient(90deg,transparent 0%,#000 28%,#000 100%)}
.heroContent,.nextCard{position:relative;z-index:1}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.22em;color:#e2bf70;margin:0 0 20px}
.eyebrow.green{color:#627f71}
.hero h1{font-family:Georgia,serif;font-size:clamp(56px,6.2vw,92px);line-height:.94;letter-spacing:-.045em;margin:0;font-weight:500}
.hero h1 em{color:#e4bd63;font-weight:400}
.heroCopy{font-size:18px;line-height:1.7;max-width:620px;color:#dce8e4;margin:28px 0}
.heroActions{display:flex;align-items:center;gap:30px}
.button{display:inline-flex;align-items:center;justify-content:center;padding:15px 22px;border-radius:3px;font-weight:800;font-size:13px}
.button.gold{background:var(--gold);color:var(--ink)}
.button.gold span{margin-left:28px}
.textLink{font-size:13px;font-weight:800;border-bottom:1px solid #ffffff70;padding:12px 0}
.textLink span{margin-left:18px}
.nextCard{background:#05211db3;border:1px solid #ffffff2b;backdrop-filter:blur(8px);padding:28px;max-width:390px;justify-self:end}
.nextCard>p{font-size:10px;letter-spacing:.24em;color:#e2bf70;font-weight:bold;margin:0}
.nextDate{display:flex;align-items:center;gap:15px;margin:20px 0}
.nextDate strong{font:400 60px/1 Georgia,serif}
.nextDate span{font-size:11px;line-height:1.55;color:#c5d6d1;font-weight:bold}
.nextCard h2{font:400 27px Georgia,serif;margin:0 0 9px}
.nextCard div p{font-size:13px;color:#bfd0cb}
.nextCard>a{display:flex;justify-content:space-between;border-top:1px solid #ffffff29;padding-top:18px;margin-top:24px;font-size:12px;font-weight:bold;color:#e2bf70}
.monthlyFlyer{max-width:1450px;margin:auto;padding:80px 7vw;display:grid;grid-template-columns:1fr minmax(260px,420px);align-items:center;gap:8vw;background:var(--paper)}
.monthlyFlyer.nextMonth{border-top:1px solid var(--line);background:var(--cream)}
.monthlyFlyer h2{font:400 clamp(38px,4.5vw,60px)/1.05 Georgia,serif;margin:0 0 20px}
.monthlyFlyer p:not(.eyebrow){max-width:620px;color:var(--muted);line-height:1.7;margin:0 0 26px}
.monthlyFlyerImage{display:block;background:white;padding:10px;border:1px solid var(--line);box-shadow:0 18px 45px #24343d17;transform:rotate(1deg);transition:.2s}
.monthlyFlyerImage:hover{transform:rotate(0) translateY(-3px)}
.monthlyFlyerImage img{display:block;width:100%;max-height:540px;object-fit:contain}
.eventsSection{padding:90px 7vw 110px;max-width:1450px;margin:auto}
.sectionHead{display:flex;justify-content:space-between;align-items:end;gap:40px}
.sectionHead h2,.welcome h2,.submit h2{font:400 clamp(40px,5vw,64px)/1.05 Georgia,serif;margin:0}
.sectionIntro{max-width:470px}
.sectionIntro p{line-height:1.6;color:var(--muted);font-size:14px;margin:0}
.calendarSubscribe{margin:34px 0 10px;padding:22px 24px;background:var(--cream);border:1px solid #e1ddd2;display:flex;align-items:center;justify-content:space-between;gap:28px}
.calendarSubscribeCopy{max-width:760px}
.calendarSubscribeCopy strong{display:block;font:400 23px/1.2 Georgia,serif;margin-bottom:6px;color:var(--ink)}
.calendarSubscribeCopy p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.calendarSubscribe .button{flex:0 0 auto;text-align:center}
.filters{display:flex;gap:12px;margin:32px 0 20px;align-items:end}
.filters label{display:flex;flex-direction:column;gap:8px}
.filters label>span{font-size:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:bold;color:#6e7a76}
.filters input,.filters select{height:48px;border:1px solid #d7d7cf;background:white;padding:0 15px;color:var(--ink);font-size:13px;border-radius:2px;min-width:180px}
.filters .search{position:relative;flex:1}
.filters .search>span{position:absolute;left:16px;bottom:13px;font-size:20px}
.filters .search input{width:100%;padding-left:46px}
.clear{border:0;background:transparent;text-decoration:underline;color:#58706a;height:48px;cursor:pointer}
.results{border-bottom:1px solid var(--line);padding-bottom:15px;display:flex;justify-content:space-between;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#64736f;font-weight:bold}
.legend{display:flex;align-items:center;gap:8px}
.legend i{width:9px;height:9px;border-radius:50%;background:var(--gold)}
.eventGroup{margin-top:54px}
.eventGroupHead{display:grid;grid-template-columns:1fr minmax(260px,430px);gap:40px;align-items:end;padding-bottom:18px;border-bottom:2px solid #cfd6d2}
.eventGroupHead .eyebrow{margin-bottom:8px}
.eventGroupHead h3{font:400 34px/1.1 Georgia,serif;margin:0}
.eventGroupHead>p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.eventCard{scroll-margin-top:105px;display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:28px;padding:28px 18px;border-bottom:1px solid var(--line);transition:.2s}
.eventCard:hover{background:white}
.eventCard.featured{border-left:3px solid var(--gold)}
.dateTile{width:72px;height:82px;border:1px solid #d5d7d0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:white}
.dateTile span{font-size:10px;letter-spacing:.15em;font-weight:bold;color:#b07e12}
.dateTile strong{font:400 38px Georgia,serif}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tags span{font-size:9px;text-transform:uppercase;letter-spacing:.12em;padding:5px 8px;background:#e9efeb;color:#376358;font-weight:bold}
.tags span.travelTag{background:#f3e5bd;color:#79570d}
.tags span.sourceTag{background:#dcecf0;color:#244f60}
.eventMain h3{font:400 27px Georgia,serif;margin:10px 0 7px}
.meta{font-size:13px;color:#65716d;margin:0}
.meta b{color:#c0993d;margin:0 4px}
.hosted{font-size:11px;color:#71807b;margin-top:8px}
.eventDetails{max-width:760px;font-size:14px;line-height:1.65;color:#53645f;margin-top:18px}
.eventDetails p{
  margin:7px 0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.cardActions{
  grid-column:2/-1;
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  max-width:none;
}
.cardActions button,.cardActions a{border:1px solid #cad0cc;background:white;padding:11px 13px;font-size:11px;font-weight:bold;color:#33594f;cursor:pointer;white-space:nowrap}
.cardActions a:last-child{background:var(--pine);color:white;border-color:var(--pine)}
.cardActions a.secondaryAction{background:white;color:#33594f;border-color:#cad0cc}
.empty{text-align:center;padding:60px 20px;color:#5d6b67}
#about{scroll-margin-top:30px}
.welcome{background:var(--pine);color:white;padding:85px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}
.welcome p:not(.eyebrow){line-height:1.8;color:#d6e3df;margin:5px 0 28px}
.welcome .programNote{padding-top:18px;border-top:1px solid #ffffff2b;font-size:14px}
.button.cream{background:var(--cream);color:var(--pine)}
.submit{padding:90px 7vw;display:flex;align-items:center;justify-content:space-between;gap:70px;background:var(--cream)}
.submit>div:first-child{max-width:760px}
.submit p:not(.eyebrow){line-height:1.7;color:#5f6c68;max-width:650px}
.submitActions{display:flex;flex-direction:column;gap:12px;min-width:280px}
.button.dark{background:var(--pine);color:white}
.submitActions span{font-size:10px;line-height:1.5;text-align:center;color:#7a7770}
.social{padding:75px 7vw;display:flex;align-items:center;justify-content:space-between;gap:70px;background:var(--paper);border-top:1px solid var(--line)}
.social>div:first-child{max-width:650px}
.social h2{font:400 clamp(38px,4.5vw,58px)/1.05 Georgia,serif;margin:0 0 18px}
.social p:not(.eyebrow){color:var(--muted);line-height:1.7;margin:0}
.socialActions{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:min(100%,470px)}
.socialButton{min-width:220px;display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:16px 18px;background:white;border:1px solid var(--line);font-weight:800;transition:.2s}
.socialButton:hover{transform:translateY(-2px);box-shadow:0 10px 25px #24343d14}
.socialButton small{display:block;font-size:8px;letter-spacing:.13em;color:var(--muted);margin-bottom:3px}
.socialIcon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:white;font:bold 24px Arial,sans-serif}
.facebook .socialIcon{background:#1877f2}
.instagram .socialIcon{background:linear-gradient(135deg,#833ab4,#e1306c,#f77737)}
.socialButton b{font-size:16px;color:var(--muted)}
footer{padding:40px 7vw;background:#24343d;color:#dce4e5;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:30px}
footer>p{font-size:11px;line-height:1.6}
footer>p:last-child{text-align:right}
.hidden{display:none!important}

@media(max-width:1000px){
.eventCard{grid-template-columns:76px minmax(0,1fr)}
.cardActions{grid-column:2;justify-content:flex-start;max-width:none}
}
@media(max-width:850px){
.nav{height:70px}
.navLinks{display:none}
.hero{grid-template-columns:1fr;padding:65px 6vw}
.hero:before{width:100%;opacity:.42;mask-image:linear-gradient(180deg,#000 0%,transparent 82%);background-position:62% center}
.nextCard{justify-self:start;width:100%;max-width:520px}
.monthlyFlyer{grid-template-columns:1fr;padding:70px 7vw;gap:40px}
.monthlyFlyerImage{max-width:420px}
.sectionHead,.submit,.social{align-items:start;flex-direction:column}
.calendarSubscribe{align-items:flex-start;flex-direction:column}
.calendarSubscribe .button{width:100%}
.eventGroupHead{grid-template-columns:1fr;gap:10px}
.filters{display:grid;grid-template-columns:1fr 1fr}
.filters .search{grid-column:1/-1}
.filters input,.filters select{width:100%}
.welcome{grid-template-columns:1fr;gap:30px}
footer{grid-template-columns:1fr}
footer>p:last-child{text-align:left}
}
@media(max-width:520px){
.nav{padding:0 5vw}.brand{font-size:9px}.brand b{font-size:11px}.compass{width:40px;height:40px}
.hero h1{font-size:54px}
.heroActions{align-items:flex-start;flex-direction:column;gap:10px}
.eventsSection{padding:70px 4vw}
.monthlyFlyer{padding:60px 7vw}
.calendarSubscribe{padding:20px;margin-top:28px}
.calendarSubscribeCopy strong{font-size:21px}
.filters{grid-template-columns:1fr}
.filters .search{grid-column:auto}
.eventGroup{margin-top:42px}
.eventGroupHead h3{font-size:29px}
.eventCard{scroll-margin-top:90px;grid-template-columns:58px minmax(0,1fr);gap:16px;padding:24px 4px}
.dateTile{width:58px;height:70px}
.dateTile strong{font-size:31px}
.eventMain h3{font-size:23px}
.cardActions{grid-column:1/-1;margin-left:74px;display:grid;grid-template-columns:1fr 1fr;width:calc(100% - 74px)}
.cardActions button,.cardActions a{text-align:center;width:100%;padding:12px 8px;white-space:normal}
.legend{display:none}
.welcome,.submit{padding:70px 7vw}
.social{padding:60px 7vw}
.socialActions{grid-template-columns:1fr;width:100%;min-width:0}
.socialButton{min-width:0;width:100%}
footer{padding:35px 7vw}
}
