:root{
  --gold:#d4af37;
  --navy:#001F3F;
  --black:#111;
  --white:#fff;
  --muted:#666;
  --max-width:1200px;
  --radius:12px;
  --shadow: 0 10px 30px rgba(2,6,23,0.06);
}

/* Reset */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;color:var(--black);background:#fff;line-height:1.5}

/* Container */
.container{max-width:var(--max-width);margin:0 auto;padding:0 18px}

/* Header */
.header-top{background:linear-gradient(90deg,var(--navy),#072041);color:var(--gold);padding:14px 0}
.header-inner{display:flex;align-items:center;gap:16px;justify-content:space-between;max-width:var(--max-width);margin:0 auto;padding:0 18px}
.brand{display:flex;align-items:center;gap:12px}
.brand img.logo{height:70px;width:auto;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.15));transition:transform 0.25s ease,filter 0.25s ease}
.brand img.logo:hover{transform:scale(1.05);filter:drop-shadow(0 6px 10px rgba(0,0,0,0.20))}
.brand h1{font-size:1.15rem;margin:0}
.tagline{font-size:0.9rem;color:rgba(255,215,0,0.95)}

/* Navbar (menu) */
.navbar{background:var(--gold);display:flex;justify-content:center;gap:10px;padding:10px;flex-wrap:wrap}
.navbar a{display:inline-block;padding:8px 12px;border-radius:8px;color:var(--navy);font-weight:700;text-decoration:none}
.navbar a.active{box-shadow:inset 0 -3px 0 rgba(0,0,0,0.06)}

/* Hero */
.hero{background:linear-gradient(180deg, rgba(10,26,68,0.95), rgba(10,26,68,0.78));color:var(--gold);padding:56px 0;text-align:center;border-radius:0 0 var(--radius) var(--radius)}
.hero h2{font-size:2rem;margin-bottom:8px}
.lead{font-size:1.05rem;opacity:0.95}

/* Sections */
main{padding:28px 0}
.section{padding:18px 0}
.card{background:#fff;border-radius:10px;padding:16px;box-shadow:var(--shadow)}

/* Quick grid */
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.quick-grid .card{text-align:center}

/* Pastors */
.pastor-section{display:flex;gap:20px;align-items:flex-start}
.pastor-photo img{width:280px;border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,0.06)}
.pastor-details h3{margin-top:0}
.mission-vision{margin-top:18px;background:#fafafa;padding:14px;border-radius:8px}

/* Ministries */
.ministry{margin-bottom:18px}
.ministry h3{color:var(--navy)}
.ministry p{color:var(--muted)}

/* Grid / gallery */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid img{width:100%;border-radius:8px;border:4px solid rgba(212,175,55,0.12);cursor:pointer}

/* Thumbs */
.thumb-row{display:flex;gap:10px;align-items:center}
.thumb{width:140px;border-radius:8px;cursor:pointer}

/* FAQ */
.faq-item{margin-bottom:12px}
.faq-q{width:100%;text-align:left;padding:12px;border-radius:8px;background:#f7f7f7;border:1px solid #eee;font-weight:700;cursor:pointer}
.faq-a{display:none;padding:12px;border-left:4px solid var(--gold);background:#fff}

/* Forms */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.input, textarea{width:100%;padding:10px;border-radius:8px;border:1px solid #ddd;font-size:0.95rem}
textarea{min-height:120px;resize:vertical}

/* Contact grid */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}

/* Donate */
.bank-details{list-style:none;padding:0;margin-top:8px}
.bank-details li{padding:8px 0;border-bottom:1px dashed rgba(0,0,0,0.04)}

/* Footer */
.site-footer{background:transparent;padding:18px;text-align:center;color:var(--muted);font-weight:700;margin-top:26px}

/* Modal / Lightbox */
.modal, .lightbox{display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:1500;background:rgba(0,0,0,0.6);align-items:center;justify-content:center;padding:18px}
.modal .modal-content, .lightbox .lightbox-content{background:var(--white);border-radius:10px;padding:18px;max-width:920px;width:100%}
.modal .modal-close, .lightbox .close{position:absolute;right:20px;top:18px;background:transparent;border:none;color:#fff;font-size:26px;cursor:pointer}

/* utilities */
.center{text-align:center}
.small{font-size:0.95rem;color:var(--muted)}

/* Responsive */
@media (max-width:980px){
  .quick-grid{grid-template-columns:1fr}
  .pastor-section{flex-direction:column;align-items:center}
  .grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:520px){
  .grid{grid-template-columns:1fr}
  .brand{flex-direction:column;align-items:center;gap:8px}
  .navbar{font-size:0.92rem}
  .brand img.logo{height:60px}
}
