/* Operation Barnabas International. Clean warm white with deep colors from the painting and the field:
   forest green (the grass), slate blue (the sky and the shepherd's shirt), marigold, and warm charcoal. */
:root{
  --bg:#faf7f2;--surface:#fff;--sand:#f2ede4;--ink:#2b2622;--muted:#6b5f55;
  --accent:#2e5b7a;--accent-hover:#234a65;--flame:#2e5b7a;--label:#3b5a2f;--line:#e7e0d4;
  --button:#3b5a2f;--button-hover:#2f4a25;--on-button:#fff;
  --marigold:#e59a1d;--marigold-hover:#cf8512;--chip-devotional-ink:#8a5208;--logo:#c27a0e;--on-marigold:#2b2622;
  --band-green:#3b5a2f;--band-green-ink:#f6f1e6;--band-quote:#f1e6d4;--band-quote-ink:#2e5b7a;
  --footer-bg:#2b2622;--footer-ink:#ece4d8;--footer-muted:#b3a797;--footer-line:#453d36;--on-dark-accent:#c7d6a8;
  --hero-from:#faf7f2;--hero-to:#faf7f2;--arch:#f1e6d4;--shadow:0 18px 40px -18px rgba(60,35,15,.45);
  --wide:1200px;--read:720px;--prose:840px;--gutter:clamp(16px,4vw,48px);
  --serif:'Fraunces',Georgia,serif;--sans:'Source Sans 3',system-ui,sans-serif;
}
:root[data-theme="dark"]{
  --bg:#1d1916;--surface:#27211d;--sand:#2e2722;--ink:#f1e9de;--muted:#b8ab9b;
  --accent:#8fb8d6;--accent-hover:#b0cde3;--flame:#8fb8d6;--label:#9cc27f;--line:#3d342d;
  --button:#9cc27f;--button-hover:#b5d49d;--on-button:#1d1916;
  --marigold:#f0a830;--marigold-hover:#f5bf62;--chip-devotional-ink:#f0a830;--logo:#f0a830;--on-marigold:#1d1916;
  --band-green:#2c4223;--band-green-ink:#eef3e6;--band-quote:#2c2621;--band-quote-ink:#8fb8d6;
  --footer-bg:#141110;--footer-ink:#ece4d8;--footer-muted:#a89c8d;--footer-line:#352e28;--on-dark-accent:#c7d6a8;
  --hero-from:#1d1916;--hero-to:#1d1916;--arch:#2c2621;--shadow:0 18px 40px -18px rgba(0,0,0,.8);
}
/* Paper grain only in light mode; dark mode stays flat. */
:root[data-theme="dark"] body,:root[data-theme="dark"] .hero-visual::before,:root[data-theme="dark"] .about-visual::before,:root[data-theme="dark"] .triage{background-image:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--bg) url("assets/paper-texture.jpg");background-blend-mode:multiply;color:var(--ink);font:18px/1.7 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--accent);text-underline-offset:4px;text-decoration-thickness:1px}
a:hover{color:var(--accent-hover)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
h1,h2,h3,blockquote{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.01em}
h1,h2,h3{text-wrap:balance}
p,li,blockquote{text-wrap:pretty}
h1{font-size:clamp(40px,6vw,72px);margin:12px 0 24px}
h2{font-size:clamp(30px,4vw,44px);margin:10px 0 20px}
h3{font-size:26px;margin:8px 0 12px}
em{font-style:italic;color:var(--flame)}
.eyebrow{font:600 15px/1.4 var(--sans);letter-spacing:.01em;color:var(--label);margin:0}
.intro{font-size:21px;line-height:1.6;color:var(--ink)}
.muted{color:var(--muted)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--surface);padding:8px 14px;z-index:20}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Buttons */
.button{display:inline-flex;align-items:center;gap:8px;background:var(--button);color:var(--on-button);border:2px solid var(--button);border-radius:8px;padding:12px 22px;font:600 16px/1.2 var(--sans);text-decoration:none;transition:background .3s,border-color .3s,color .3s;cursor:pointer}
.button:hover{background:var(--button-hover);border-color:var(--button-hover);color:var(--on-button)}
.button.outline{background:transparent;color:var(--button);border-color:color-mix(in srgb,var(--button) 40%,transparent)}
.button.outline:hover{background:transparent;border-color:var(--button);color:var(--button)}
.button.small{padding:8px 16px;font-size:15px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}

/* Header */
main{flex:1}
.site-header{width:100%;max-width:var(--wide);margin:0 auto;padding:22px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}
.brand:hover{color:var(--ink)}
.brand-mark{color:var(--logo);flex:none}
.brand-copy{font:600 22px/1.05 var(--serif);white-space:nowrap}
.brand-sub{display:block;font:inherit;color:inherit}
.main-nav{display:flex;align-items:center;gap:26px;font-size:16px}
.main-nav a:not(.button),.mobile-menu nav a:not(.button){color:var(--ink);text-decoration:none}
.main-nav a:not(.button):hover,.main-nav a[aria-current]{color:var(--accent)}
.main-nav a[aria-current]{text-decoration:underline;text-underline-offset:8px}
.ext{font-size:.8em;margin-left:3px;color:var(--muted)}
.menu-toggle,.menu-close{display:none;background:none;border:0;color:var(--ink);padding:6px;cursor:pointer}
.mobile-menu{margin:0;width:100%;max-width:none;height:100dvh;max-height:none;border:0;padding:20px var(--gutter);background:var(--bg);color:var(--ink)}
.mobile-menu::backdrop{background:rgba(0,0,0,.4)}
.mobile-menu-top{display:flex;justify-content:space-between;align-items:center}
.mobile-menu .menu-close{display:block}
.mobile-menu nav{display:flex;flex-direction:column;gap:6px;margin-top:28px}
.mobile-menu nav a:not(.button){font:28px/1.5 var(--serif);padding:6px 0;border-bottom:1px solid var(--line)}
.mobile-menu nav .button{margin-top:24px;justify-content:center;font-size:18px}
@media(max-width:900px){.main-nav{display:none}.menu-toggle{display:block}}

/* Home: hero */
.home-page main>section{max-width:var(--wide);margin:auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.home-page .hero{max-width:none;background:transparent;padding:56px max(var(--gutter),calc((100% - var(--wide))/2 + var(--gutter))) 88px;display:grid;grid-template-columns:1.25fr 1fr;gap:64px;align-items:center}
.hero h1{font-size:clamp(38px,4.6vw,64px)}
.hero h1 span,.hero h1 em{display:block;text-wrap:balance}
.hero .intro{max-width:560px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-verse{margin:44px 0 0;max-width:400px;text-wrap:balance;font:italic 19px/1.45 var(--serif);color:var(--muted)}
.hero-verse::before{content:"";display:block;width:48px;height:3px;border-radius:2px;background:var(--marigold);margin-bottom:16px}
.hero-verse cite{display:block;margin-top:6px;font:600 14px var(--sans);font-style:normal;color:var(--label)}
.hero-visual{position:relative;justify-self:center;width:100%;max-width:460px;padding:56px 40px 0}
/* Arched panel behind the hero photo, set slightly off-center like a chapel window. */
.hero-visual::before{content:"";position:absolute;top:0;bottom:64px;left:40px;right:0;background:var(--arch) url("assets/paper-texture.jpg");background-blend-mode:multiply;border-radius:999px 999px 18px 18px}
.hero-art{position:relative;margin:0 auto;max-width:380px;transform:rotate(1.5deg)}
.hero-art img{display:block;border:10px solid #fff;box-shadow:var(--shadow)}
.hero-art figcaption{font:italic 15px var(--serif);color:var(--muted);text-align:center;margin-top:16px;transform:rotate(-1.5deg)}
/* Gentle one-time entrance: copy rises in, the photo settles into its tilt. */
@media(prefers-reduced-motion:no-preference){
  .hero-copy>*{animation:hero-rise .7s cubic-bezier(.2,.7,.2,1) both}
  .hero-copy>:nth-child(2){animation-delay:.08s}.hero-copy>:nth-child(3){animation-delay:.16s}
  .hero-copy>:nth-child(4){animation-delay:.24s}.hero-copy>:nth-child(5){animation-delay:.32s}
  .hero-visual::before{animation:hero-fade .9s ease-out .1s both}
  .hero-art{animation:hero-settle .9s cubic-bezier(.2,.7,.2,1) .15s both}
}
@keyframes hero-rise{from{opacity:0;transform:translateY(14px)}}
@keyframes hero-fade{from{opacity:0}}
@keyframes hero-settle{from{opacity:0;transform:rotate(4deg) translateY(16px)}}
/* Phones: the photo becomes a small tilted thumbnail beside the headline. */
@media(max-width:800px){
  .home-page .hero{grid-template-columns:minmax(0,1fr) 124px;grid-template-areas:"eyebrow eyebrow" "title art" "intro intro" "actions actions" "verse verse";gap:0 16px;padding-top:28px;padding-bottom:56px}
  .hero-copy{display:contents}
  .hero-copy>.eyebrow{grid-area:eyebrow}.hero-copy>h1{grid-area:title;margin:10px 0 18px;font-size:clamp(32px,8.6vw,44px)}
  .hero-copy>.intro{grid-area:intro;margin-top:0;min-width:0}.hero-copy>.actions{grid-area:actions;margin-top:4px}.hero-copy>.hero-verse{grid-area:verse;margin-top:36px}
  .hero-visual{grid-area:art;align-self:start;max-width:none;padding:14px 4px 0 10px}
  .hero-visual::before{left:16px;right:-6px;top:0;bottom:18px}
  .hero-art{max-width:none}.hero-art img{border-width:5px}.hero-art figcaption{display:none}
}

/* Home: calling + pillars */
.home-page .calling{max-width:none;text-align:center;background:var(--footer-bg);color:var(--footer-ink);padding:88px var(--gutter)}
.calling .eyebrow{color:var(--marigold)}
.calling h2,.calling p{max-width:var(--read);margin-left:auto;margin-right:auto}
.calling h2+p{color:var(--footer-muted);font-size:20px}
.calling-more{margin-top:20px}
.calling-more a{color:var(--marigold);font-weight:600}
.calling-more a:hover{color:var(--marigold-hover)}
.calling-photo{margin:48px auto 0;max-width:960px}
.calling-photo img{display:block;width:100%;border-radius:14px}
.calling-photo figcaption{font:italic 15px var(--serif);color:var(--footer-muted);margin-top:12px}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-top:88px;padding-bottom:88px}
.pillars article{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:36px}
.pillars article{overflow:hidden}
.pillars-head{grid-column:1/-1;margin-bottom:-4px}
.pillars-head h2{margin-bottom:0}
.pillar-photo{display:block;width:calc(100% + 72px);max-width:none;margin:-36px -36px 28px;aspect-ratio:16/9;object-fit:cover}
.pillars h3{font-size:30px}
.pillars a{font-weight:600}
.pillar-links{display:flex;flex-wrap:wrap;gap:8px 28px;margin:0}
@media(max-width:800px){.pillars{grid-template-columns:1fr}.pillars article{padding:28px 24px}.pillar-photo{width:calc(100% + 48px);margin:-28px -24px 24px}}

/* Email sign-up: the primary call to action */
.subscribe{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center;background:var(--band-green);color:var(--band-green-ink);border-radius:16px;padding:44px 48px}
.home-page main>section.subscribe{width:calc(100% - 2*var(--gutter));max-width:calc(var(--wide) - 2*var(--gutter));margin-bottom:88px;padding:44px 48px}
.subscribe h2{margin:6px 0 10px}
.subscribe p{margin:0;color:var(--band-green-ink)}
.subscribe p+p,.subscribe-list+p{margin-top:12px}
.subscribe-list{margin:12px 0 0;padding-left:20px;line-height:1.55}
.subscribe-list li+li{margin-top:8px}
.subscribe .eyebrow{color:var(--band-green-ink);opacity:.85}
/* Airmail-envelope trim and a letter badge mark the band as an email sign-up */
.subscribe{position:relative;isolation:isolate}
.subscribe::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:7px;pointer-events:none;
  background:repeating-linear-gradient(-45deg,var(--marigold) 0 14px,transparent 14px 22px,var(--band-green-ink) 22px 36px,transparent 36px 44px);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:.9}
.subscribe-eyebrow{display:flex;align-items:center;gap:12px}
.subscribe .subscribe-eyebrow{opacity:1}
.subscribe-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--marigold);color:var(--on-marigold);transform:rotate(-6deg)}
.subscribe.will-reveal>*{opacity:0;transform:translateY(10px)}
.subscribe.will-reveal .subscribe-icon{opacity:0;transform:rotate(-24deg) scale(1.3)}
.subscribe.revealed>*{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.subscribe.revealed>*+*{transition-delay:.12s}
.subscribe.revealed .subscribe-icon{opacity:1;transform:rotate(-6deg);transition:opacity .3s ease .4s,transform .55s cubic-bezier(.3,1.4,.5,1) .4s}
.subscribe-row input{padding-left:46px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a7d70' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 6.5 8.5 6.5 8.5-6.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:16px center;background-size:20px}
.hero .actions .button:not(.outline),.site-footer .subscribe-form .button,.subscribe .button{background:#c27a0e;border-color:#c27a0e;color:#fff}
.hero .actions .button:not(.outline):hover,.site-footer .subscribe-form .button:hover,.subscribe .button:hover{background:#a9670b;border-color:#a9670b;color:#fff}
.subscribe-row input{border-color:transparent}
.prose .subscribe{margin:32px 0 40px;grid-template-columns:1fr;gap:20px;padding:32px}
.prose .subscribe h2{font-size:30px;margin-top:6px}
/* Updates page: a light sign-up strip that nods to the green band (badge, airmail trim) without its weight */
.subscribe-strip{position:relative;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);grid-template-areas:"icon title title" ". text form";gap:8px 20px;align-items:center;margin:28px 0 8px;padding:38px 32px 34px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.subscribe-strip::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:repeating-linear-gradient(-45deg,var(--marigold) 0 12px,transparent 12px 18px,var(--band-green) 18px 30px,transparent 30px 36px)}
.subscribe-strip .subscribe-icon{grid-area:icon}
.prose .subscribe-strip h2{grid-area:title;font:600 23px/1.3 var(--serif);margin:0}
.subscribe-strip>p{grid-area:text}
.subscribe-strip .subscribe-form{grid-area:form}
.subscribe-strip p{margin:0;font-size:16px;color:var(--muted)}
.prose .subscribe-strip div{margin-bottom:0}
.subscribe-strip .subscribe-form .button{background:var(--button);border-color:var(--button);color:var(--on-button)}
.subscribe-strip .subscribe-form .button:hover{background:var(--button-hover);border-color:var(--button-hover)}
.subscribe-strip .subscribe-status{margin-top:6px!important}
.subscribe-strip .subscribe-status:empty{min-height:0;margin:0!important}
@media(max-width:800px){.subscribe-strip{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon title" ". text" "form form"}.subscribe-strip .subscribe-form{margin-top:12px}}
.subscribe-row{display:flex;gap:10px}
.subscribe-row input{flex:1;min-width:0;font:inherit;color:var(--ink);background-color:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 16px 12px 46px}
.subscribe-status{min-height:1.4em;margin:10px 0 0!important;font-size:16px}
.subscribe-status[data-state="success"]{color:inherit;font-weight:600}
.subscribe-status[data-state="error"]{color:#b3261e}
:root[data-theme="dark"] .subscribe-status[data-state="error"]{color:#f2a49b}
/* Desktop band: the status line hangs below the field so the field itself centers against the text */
@media(min-width:801px){.home-page .subscribe .subscribe-form{position:relative}.home-page .subscribe .subscribe-status{position:absolute;top:100%;left:0;right:0}}
@media(max-width:800px){.subscribe,.home-page main>section.subscribe{grid-template-columns:1fr;gap:20px;padding:28px 24px}}
@media(max-width:420px){.subscribe-row{flex-direction:column}.subscribe-row .button{justify-content:center}}

/* Home: photo strip */
.gallery{padding-bottom:88px}
.photo-grid{display:grid;grid-template-columns:.8fr 1fr .8fr;grid-template-rows:260px 260px;grid-template-areas:"a b d" "a c d";gap:16px}
.photo-grid figure:nth-child(1){grid-area:a}.photo-grid figure:nth-child(2){grid-area:b}.photo-grid figure:nth-child(3){grid-area:d}.photo-grid figure:nth-child(4){grid-area:c}
.photo-grid figure{margin:0}
.photo-grid img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px}
@media(max-width:700px){.photo-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;grid-template-areas:"a d" "b c"}.photo-grid img{aspect-ratio:4/5}}
.wide-photo{margin:32px 0;clear:both}
.wide-photo img{display:block;width:100%;border-radius:12px}
.wide-photo figcaption{font-size:14px;color:var(--muted);margin-top:8px}

/* Home: triage quote, voices, latest */
.home-page .triage{max-width:none;background:var(--band-quote) url("assets/paper-texture.jpg");background-blend-mode:multiply;color:var(--band-quote-ink);padding:80px var(--gutter);text-align:center}
.triage blockquote{max-width:880px;margin:0 auto;font-size:clamp(24px,3vw,34px);line-height:1.35}
.triage .cite{font:600 15px var(--sans);letter-spacing:.01em;color:var(--muted);margin:24px 0 0}
/* A short marigold rule above the quote, and a quiet link on to the conferences */
.triage blockquote::before{content:"";display:block;width:48px;height:2px;margin:0 auto 28px;background:var(--marigold);border-radius:2px}
.triage-link{margin:28px 0 0}
.triage-link a{font:600 16px var(--sans);letter-spacing:.02em;color:var(--band-quote-ink);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--marigold) 70%,transparent);text-decoration-thickness:2px;text-underline-offset:6px;transition:text-decoration-color .2s}
.triage-link a:hover{text-decoration-color:var(--marigold)}
.triage-link span{display:inline-block;transition:transform .2s}
.triage-link a:hover span{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.triage-link span{transition:none}}
.voices{padding-top:88px;padding-bottom:40px}
.voices ul{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.voices li{border-top:3px solid var(--marigold);padding-top:20px}
.voices blockquote{margin:0 0 16px;font-size:21px;line-height:1.45}
.voices li p{margin:0;color:var(--muted);font-size:15px;font-weight:600}
@media(max-width:900px){.voices ul{grid-template-columns:1fr}}
.latest{padding-top:56px;padding-bottom:88px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}
.section-head a{font-weight:600;margin-bottom:24px}
.scripture{text-align:center;padding-top:72px;padding-bottom:96px;border-top:1px solid var(--line)}
.scripture blockquote{max-width:760px;margin:0 auto 16px;font-size:clamp(26px,3.4vw,38px);font-style:italic}
.scripture p{font:600 15px var(--sans);letter-spacing:.01em;color:var(--label)}

/* Cards (homepage + updates) */
.cards{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px}
.card h3{font-size:24px}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--accent);text-decoration:underline}
.card p:last-child{margin:0;color:var(--muted);font-size:16px}
.postmeta{margin:0;font-size:14px;color:var(--muted);display:flex;gap:10px;align-items:center}
.chip{background:var(--sand);color:var(--label);font-weight:600;font-size:13px;letter-spacing:.01em;padding:3px 10px;border-radius:99px}
/* Each category gets its own tint: News in slate blue, Devotionals in marigold */
.chip-news{background:color-mix(in srgb,var(--accent) 13%,var(--surface));color:var(--accent)}
.chip-devotionals{background:color-mix(in srgb,var(--marigold) 20%,var(--surface));color:var(--chip-devotional-ink)}

/* Interior pages */
.pagehead,.prose{max-width:calc(var(--prose) + 2*var(--gutter));margin:auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.pagehead{padding-top:48px}
.pagehead h1{font-size:clamp(38px,5.4vw,60px)}
.prose{padding-bottom:96px}
/* Conferences: sidebar of section links on desktop; the page fills the header's width. */
.toc{display:none}
.toc-layout h2{scroll-margin-top:24px}
@media(min-width:1000px){
  .toc-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-areas:"head head" "main toc";column-gap:64px;max-width:var(--wide);margin:auto;padding:0 var(--gutter)}
  .toc-layout .pagehead{grid-area:head}
  .toc-layout .prose{grid-area:main}
  .toc-layout .pagehead,.toc-layout .prose{max-width:none;margin:0;padding-left:0;padding-right:0}
  .toc{grid-area:toc;display:block;position:sticky;top:24px;align-self:start;margin-top:24px}
  .toc ul+.toc-title{margin-top:28px}
  .toc ul{list-style:none;margin:0;padding:0}
  .toc li+li{border-top:1px solid var(--line)}
  .toc a{display:block;padding:8px 0;color:var(--muted);text-decoration:none;font-size:16px;line-height:1.4}
  .toc a:hover{color:var(--accent)}
}
}
.prose h2{font-size:32px;margin-top:48px}
.prose h3{margin-top:36px}
.prose div{margin-bottom:1.2em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.5em}
.prose .alignright{float:right;margin:6px 0 16px 28px;max-width:45%}
.prose .cards{margin-top:32px;padding-left:0}
/* Updates: heading with News / Devotionals tabs beside it */
.updates-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 24px;margin:48px 0 20px}
.updates-head h2{margin:0}
.updates-head+.cards{margin-top:0}
@media(min-width:901px){.wide-page #update-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* The sign-up strip spans two of the three card columns */
  .wide-page .subscribe-strip{max-width:calc((100% - 48px)/3*2 + 24px);grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon title" ". text" ". form"}
  .wide-page .subscribe-strip .subscribe-form{margin-top:14px;max-width:520px}}
.filter-tabs{display:inline-flex;gap:4px;padding:4px;background:var(--sand);border-radius:99px}
.filter-tabs[hidden]{display:none}
.filter-tabs button{font:600 15px/1.2 var(--sans);color:var(--muted);background:transparent;border:0;border-radius:99px;padding:8px 16px;cursor:pointer;transition:background .2s,color .2s}
.filter-tabs button:hover{color:var(--ink)}
.filter-tabs button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(60,35,15,.18)}
.filter-tabs button[data-filter="news"][aria-pressed="true"]{color:var(--accent)}
.filter-tabs button[data-filter="devotionals"][aria-pressed="true"]{color:var(--chip-devotional-ink)}
.filter-tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.card[hidden]{display:none}
.postmeta+*{margin-top:28px}
.back{margin-top:48px;clear:both}
.post-note{clear:both;margin-top:40px;padding:16px 20px;border-left:3px solid var(--marigold);background:var(--surface);border-radius:0 10px 10px 0;font-size:16px;color:var(--muted)}
.post-note p{margin:0}
.post-note+.back{margin-top:32px}
.portrait{float:right;margin:6px 0 20px 32px;width:180px}
.portrait img{display:block;border-radius:10px}
.portrait figcaption{font-size:14px;color:var(--muted);margin-top:8px}
@media(max-width:600px){.portrait{width:130px;margin-left:20px}.prose .alignright{max-width:50%;margin-left:18px}}
.shepherd{clear:both;margin-top:64px;padding-top:48px;border-top:1px solid var(--line);scroll-margin-top:24px}
.shepherd h2{margin-top:8px}
.field-notes{display:grid;gap:18px;margin-top:24px}
.field-notes>p{margin:6px 0 0}
.field-notes blockquote{position:relative;margin:0;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:24px 28px 24px 64px;font-size:19px;line-height:1.6}
.field-notes blockquote::before{content:"\201C";position:absolute;left:22px;top:12px;font:600 52px/1 var(--serif);color:var(--marigold)}
.field-notes blockquote p{margin:0}
.field-notes cite{display:block;margin-bottom:6px;font:600 15px var(--sans);font-style:normal;letter-spacing:.01em;color:var(--label)}
@media(max-width:600px){.field-notes blockquote{padding:20px 20px 20px 50px;font-size:18px}.field-notes blockquote::before{left:16px;font-size:44px}}
blockquote.pull{margin:48px 0 0;padding-left:24px;border-left:3px solid var(--marigold);font-size:24px;line-height:1.4}
blockquote.pull cite{display:block;font:600 15px var(--sans);letter-spacing:.01em;color:var(--label);margin-top:12px;font-style:normal}

/* Conferences */
.schedule .year{margin-top:40px}
.schedule h2{font-size:28px;margin:0 0 12px}
.events{list-style:none;padding:0!important;margin:0;border-top:1px solid var(--line)}
.events li{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;margin:0;border-bottom:1px solid var(--line)}
.events .when{font-weight:700;color:var(--accent)}
@media(max-width:500px){.events li{grid-template-columns:1fr;gap:2px}}

/* Sidebar cards: Contact details and the Conferences sidebar */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:32px 0 40px}
.contact-card{position:relative}
.contact-card,.toc{overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:30px 28px 24px;box-shadow:0 12px 28px -20px rgba(60,35,15,.35)}
.contact-card::before,.toc::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--marigold)}
.contact-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--sand);color:var(--label);margin-bottom:16px}
.contact-card h2,.toc-title{font:600 15px/1.4 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--label);margin:0 0 10px}
.contact-card p{margin:0}
.contact-card address{font-style:normal;font-size:19px;line-height:1.6}
.phone-list{margin:0}
.prose .phone-list>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;padding:10px 0;border-top:1px solid var(--line)}
.prose .phone-list>div:first-child{border-top:0;padding-top:0}
.phone-list dt{color:var(--muted);font-size:16px}
.phone-list dd{margin:0;font-weight:600;white-space:nowrap}
.phone-list a{text-decoration:none}
.phone-list a:hover{text-decoration:underline}
@media(max-width:600px){.contact-grid{grid-template-columns:1fr}}
.contact-form{display:grid;gap:6px}
.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-fields>div{display:grid;gap:6px}
@media(max-width:600px){.contact-fields{grid-template-columns:1fr}}
.contact-form label{font-weight:600;font-size:16px;margin-top:10px}
.contact-form label span{font-weight:400;color:var(--muted)}
.contact-form input,.contact-form textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 14px;width:100%}
.contact-form .button{justify-self:start;margin-top:8px}
.form-honeypot{position:absolute;left:-9999px}
.form-note[data-state="error"]{color:#b3261e}
/* Match the header's width; on desktop, the mailing address and phone sit right of the intro and form */
.wide-page .pagehead,.wide-page .prose{max-width:var(--wide)}
.has-form .contact-grid{margin-bottom:0}
@media(min-width:901px){
  .contact-layout.has-form{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:64px;align-items:start}
  .has-form .contact-grid{grid-template-columns:1fr;margin-top:0}
}
:root[data-theme="dark"] .form-note[data-state="error"]{color:#f2a49b}
.form-note[data-state="success"]{color:var(--label);font-weight:600}

/* Footer */
.footer-subscribe{grid-column:1/-1;display:grid;grid-template-columns:1fr minmax(0,520px);gap:24px 40px;align-items:center;padding-bottom:40px;border-bottom:1px solid var(--footer-line)}
.footer-subscribe-label{font:400 26px/1.2 var(--serif);margin:0;color:var(--footer-ink)}
.footer-subscribe-note{margin:6px 0 0;color:var(--footer-muted)}
.site-footer .subscribe-status:empty{display:none}
@media(max-width:800px){.footer-subscribe{grid-template-columns:1fr;padding-bottom:32px}}
.site-footer .subscribe-row input{background-color:var(--footer-ink);color:#2a2420;border-color:transparent}
.site-footer .subscribe-status{color:var(--footer-ink)}
.site-footer .subscribe-status[data-state="error"]{color:#f2a49b}
.site-footer{background:var(--footer-bg);color:var(--footer-ink);padding:64px max(var(--gutter),calc((100% - var(--wide))/2 + var(--gutter))) 28px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;font-size:16px}
.footer-tagline{font:italic 20px/1.4 var(--serif);margin:24px 0 28px}
.footer-anm{display:inline-flex;flex-direction:column;gap:10px;color:var(--footer-muted);text-decoration:none;font-size:14px;margin-top:4px}
.footer-anm:hover{color:var(--footer-ink)}
.footer-anm img{display:block;width:150px;height:auto}
.footer-links{display:flex;flex-direction:column;gap:6px}
.footer-links h2{font:600 15px var(--sans);letter-spacing:.01em;color:var(--marigold);margin:6px 0 8px}
.footer-links p{margin:0 0 8px}
.footer-links a{color:var(--footer-ink)}
.footer-links a:hover{color:var(--marigold)}
.site-footer .brand,.site-footer .brand:hover{color:var(--footer-ink)}
.site-footer .brand-mark{color:var(--marigold)}
.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--footer-line);padding-top:20px;color:var(--footer-muted);font-size:14px}
.footer-bottom p{margin:0}
.footer-credit{color:inherit;font-size:13px;opacity:.75;white-space:nowrap}
.footer-credit:hover{color:var(--marigold);opacity:1}
@media(max-width:600px){.footer-sep{display:none}.footer-credit{display:block;margin-top:4px}}
.footer-actions{display:flex;align-items:center;gap:10px}
.theme-toggle,.footer-social{background:none;border:1px solid var(--footer-line);border-radius:99px;color:var(--footer-ink);padding:8px;display:inline-flex;cursor:pointer}
.footer-social:hover{color:var(--marigold);border-color:var(--marigold)}
@media(max-width:800px){.site-footer{grid-template-columns:1fr;gap:28px}}
.give-split{display:grid;grid-template-columns:1fr minmax(0,320px);grid-template-areas:"intro photo" "how photo";grid-template-rows:auto 1fr;column-gap:48px;align-content:start;align-items:start}
.give-split>.intro{grid-area:intro;margin-top:0}
.give-how{grid-area:how}
.give-how p:first-child{margin-top:0}
.give-photo{grid-area:photo;margin:0}
.give-photo img{display:block;width:100%;aspect-ratio:6/5;object-fit:cover;border-radius:12px}
.give-photo figcaption{font-size:14px;color:var(--muted);margin-top:8px}
@media(max-width:700px){.give-split{grid-template-columns:1fr;grid-template-areas:"intro" "photo" "how"}.give-photo{margin:8px 0 28px}.give-photo img{aspect-ratio:auto}}
/* About page: the painting in its arched panel beside the headline. */
.about-visual{float:right;position:relative;width:320px;margin:0 0 28px 44px;padding:36px 28px 0}
.about-visual::before{content:"";position:absolute;top:0;bottom:84px;left:28px;right:0;background:var(--arch) url("assets/paper-texture.jpg");background-blend-mode:multiply;border-radius:999px 999px 18px 18px}
.about-visual .hero-art img{width:100%;height:auto;border-width:8px}
.about-visual figcaption{font-size:14px;line-height:1.5}
.about-visual figcaption a{font:600 14px var(--sans);font-style:normal}
@media(max-width:700px){.about-visual{float:none;width:auto;max-width:300px;margin:0 auto 32px}}