
:root{
  --navy:#102f50; --navy2:#183f67; --gold:#b8892f; --cream:#f7f4ed;
  --ink:#27313b; --muted:#65717d; --line:#e3ddd0; --white:#fff;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#fff;font-family:Arial,Helvetica,sans-serif;line-height:1.65}
a{color:inherit} img{max-width:100%}
.wrap{width:min(1120px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:.88rem;padding:.42rem 0}
.topbar .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
header{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;gap:2rem;min-height:88px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{width:66px;height:66px;object-fit:contain}
.brand strong{font-family:Georgia,serif;color:var(--navy);font-size:1.08rem;letter-spacing:.04em}
.brand span{display:block;color:var(--gold);font-size:.78rem;font-weight:700;letter-spacing:.18em}
nav{display:flex;gap:1.25rem;align-items:center}
nav a{text-decoration:none;color:var(--navy);font-weight:700;font-size:.92rem}
nav a:hover{color:var(--gold)}
.give-btn,.btn{display:inline-block;background:var(--gold);color:#fff!important;padding:.72rem 1rem;border-radius:4px;text-decoration:none;font-weight:700}
.hero{background:linear-gradient(120deg,rgba(16,47,80,.96),rgba(24,63,103,.91));color:#fff;padding:92px 0 84px}
.hero-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:56px;align-items:center}
.eyebrow{color:#e1bc6d;text-transform:uppercase;letter-spacing:.18em;font-weight:700;font-size:.82rem}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;color:var(--navy);line-height:1.18}
.hero h1{color:#fff;font-size:clamp(2.45rem,5vw,4.5rem);margin:.4rem 0 1rem}
.hero p{font-size:1.17rem;max-width:760px;color:#eef3f7}
.hero-logo{text-align:center}.hero-logo img{width:min(310px,80%);filter:drop-shadow(0 10px 20px rgba(0,0,0,.25))}
.btn.secondary{background:transparent;border:1px solid #d7bd82;margin-left:.55rem}
section{padding:76px 0}.cream{background:var(--cream)}
.section-head{text-align:center;max-width:760px;margin:0 auto 42px}
.section-head h2{font-size:2.25rem;margin:.35rem 0 .8rem}.section-head p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border:1px solid var(--line);padding:28px;border-radius:7px;box-shadow:0 8px 22px rgba(20,40,60,.04)}
.card h3{margin-top:0}.card p{color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.photo-placeholder{min-height:340px;border:2px dashed #cbbd9f;background:#fbfaf6;border-radius:8px;display:flex;align-items:center;justify-content:center;text-align:center;padding:40px;color:#7b725f}
.photo-placeholder strong{display:block;color:var(--navy);font-family:Georgia,serif;font-size:1.4rem}
.scripture{background:var(--navy);color:#fff;text-align:center;padding:55px 0}
.scripture blockquote{font-family:Georgia,serif;font-size:clamp(1.5rem,3vw,2.35rem);font-style:italic;margin:0 auto 12px;max-width:850px}
.scripture cite{color:#dcb96f;font-style:normal;font-weight:700;letter-spacing:.14em}
.project-box{border-left:5px solid var(--gold);padding:25px 28px;background:#fff}
.notice{background:#f2eee4;border:1px solid #ded2b7;padding:18px;border-radius:6px;color:#5e5748}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact-card{border-top:4px solid var(--gold);padding:25px;background:#fff}
footer{background:#0b253f;color:#dfe7ed;padding:40px 0 24px}footer strong{color:#fff}footer a{color:#dfe7ed}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:40px}.copyright{border-top:1px solid rgba(255,255,255,.15);margin-top:28px;padding-top:18px;font-size:.86rem;color:#aebbc5}
.page-hero{background:var(--navy);color:#fff;padding:58px 0}.page-hero h1{color:#fff;margin:.2rem 0;font-size:2.8rem}
.prose{max-width:850px;margin:auto}.prose h2{margin-top:2rem}
@media(max-width:850px){
 nav{display:none}.hero-grid,.two,.cards,.contact-grid,.footer-grid{grid-template-columns:1fr}
 .hero{padding:65px 0}.hero-logo img{width:210px}.nav{min-height:78px}
 .brand strong{font-size:.95rem}.brand img{width:58px;height:58px}
 .btn.secondary{margin-left:0;margin-top:.6rem}
}

/* v2 photo and ministry-story additions */
.real-photo{width:100%;height:100%;min-height:340px;object-fit:cover;border-radius:8px;display:block;box-shadow:0 12px 28px rgba(20,40,60,.10)}
.photo-frame{position:relative;min-height:340px}.photo-frame .real-photo{position:absolute;inset:0}
.photo-caption{font-size:.88rem;color:var(--muted);margin-top:.65rem;line-height:1.45}
.story-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}.photo-pair img{width:100%;height:285px;object-fit:cover;border-radius:7px}
.feature-photo{width:100%;height:440px;object-fit:cover;border-radius:8px;box-shadow:0 12px 28px rgba(20,40,60,.10)}
.ministry-note{border-left:5px solid var(--gold);padding:22px 26px;background:#fff;margin-top:24px}
.ministry-note p:last-child{margin-bottom:0}
.amounts{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:28px 0 18px}.amount{border:1px solid var(--line);background:#fff;padding:18px 10px;text-align:center;border-radius:6px;font-family:Georgia,serif;color:var(--navy);font-size:1.25rem;font-weight:700}.amount span{display:block;font-family:Arial,sans-serif;color:var(--muted);font-size:.72rem;font-weight:400;margin-top:4px;text-transform:uppercase;letter-spacing:.08em}
.kicker{font-family:Georgia,serif;font-size:1.18rem;color:var(--navy);font-style:italic}
.site-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.site-strip img{width:100%;height:230px;object-fit:cover;border-radius:6px}
@media(max-width:850px){
 nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem 1rem;padding-bottom:14px}.nav{flex-direction:column;gap:.35rem;padding-top:10px}.brand{align-self:flex-start}.brand strong{font-size:.86rem}
 .story-grid,.photo-pair,.site-strip{grid-template-columns:1fr}.feature-photo,.photo-pair img,.site-strip img{height:auto}.photo-frame{min-height:280px}.amounts{grid-template-columns:repeat(2,1fr)}
}

.source-note{margin-top:28px;font-size:.82rem;color:var(--muted);font-style:italic}

/* v6 About Malawi visual */
.malawi-visual{max-width:1120px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px;box-shadow:0 12px 30px rgba(20,40,60,.08)}
.malawi-visual img{display:block;width:100%;height:auto;border-radius:4px}
.btn.dark-outline{background:transparent;color:var(--navy)!important;border:1px solid var(--navy);margin-left:.55rem}
@media(max-width:850px){.btn.dark-outline{margin-left:0;margin-top:.6rem}}

/* v8: show the complete Malawi congregation photograph without cropping */
.feature-photo.full-photo{height:auto;object-fit:contain;object-position:center;}

/* v9 Pastor Charles profile */
.pastor-profile{display:grid;grid-template-columns:300px 1fr;gap:44px;align-items:center}
.pastor-photo{display:block;width:100%;height:auto;border-radius:8px;border:1px solid var(--line);box-shadow:0 12px 28px rgba(20,40,60,.10)}
.pastor-profile h2{font-size:2.25rem;margin:.35rem 0 1rem}
@media(max-width:850px){.pastor-profile{grid-template-columns:1fr}.pastor-photo{max-width:320px;margin:0 auto}}


/* v10 Stay Connected mailing-list signup */
.stay-connected{background:var(--cream);padding:58px 0}
.signup-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:center;background:#fff;border:1px solid var(--line);border-top:5px solid var(--gold);border-radius:8px;padding:34px 38px;box-shadow:0 10px 26px rgba(20,40,60,.06)}
.signup-copy h2{font-size:2rem;margin:.35rem 0 .7rem}.signup-copy p{color:var(--muted);margin-bottom:0}
.signup-fields{display:grid;grid-template-columns:1fr 1.35fr auto;gap:12px;align-items:end}
.signup-form label{display:block;color:var(--navy);font-weight:700;font-size:.82rem}
.signup-form input[type="text"],.signup-form input[type="email"]{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:12px 11px;border:1px solid #cfc9bc;border-radius:4px;font:inherit;color:#243746;background:#fff}
.signup-button{border:0;cursor:pointer;white-space:nowrap;font:inherit;min-height:43px}
.consent{margin-top:14px!important;font-weight:400!important;color:var(--muted)!important;line-height:1.4}.consent input{margin-right:7px;vertical-align:middle}
.privacy-note{font-size:.78rem;color:var(--muted);margin:.55rem 0 0}.hidden-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
@media(max-width:850px){.signup-panel,.signup-fields{grid-template-columns:1fr}.signup-panel{padding:28px 22px}.signup-button{width:100%}}

/* Give page currency selector (USD / ZAR) */
.currency-switch{margin:28px 0 0}
.currency-radio{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.currency-choice-label{display:block;color:var(--navy);font-weight:700;font-size:.92rem;margin-bottom:10px}
.currency-options{display:inline-flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff}
.currency-options label{cursor:pointer;padding:.72rem 1.15rem;font-weight:700;font-size:.95rem;color:var(--navy);background:#fff;transition:background .15s,color .15s}
.currency-options label+label{border-left:1px solid var(--line)}
.currency-options label:hover{background:var(--cream)}
#currency-usd:checked~.currency-choice label[for=currency-usd],#currency-zar:checked~.currency-choice label[for=currency-zar]{background:var(--navy);color:#fff}
#currency-usd:focus-visible~.currency-choice label[for=currency-usd],#currency-zar:focus-visible~.currency-choice label[for=currency-zar]{outline:3px solid var(--gold);outline-offset:-3px}
.currency-panel-zar{display:none}
#currency-zar:checked~.currency-panel-usd{display:none}
#currency-zar:checked~.currency-panel-zar{display:block}
.currency-panel .amounts{margin-top:20px}
.amount-note{color:var(--muted);font-size:.92rem;margin:0 0 1rem}
.minimum-note{color:var(--navy);font-size:.92rem;font-weight:700;margin:0 0 .5rem}
@media(max-width:850px){.currency-options{display:flex}.currency-options label{flex:1 1 50%;text-align:center;padding:.72rem .6rem}}
@media(max-width:420px){.currency-options label{flex-basis:100%}.currency-options label+label{border-left:0;border-top:1px solid var(--line)}}
