/* ==========================================================================
   Sarvajan Kalyan Evam Shikshan Sansthan — site styles
   Palette: bone paper, deep slate-indigo ink, marigold accent, leaf green
   Type: Fraunces (display/headings) + Public Sans (body/UI)
   ========================================================================== */

:root{
  --paper:#FAF7F0;
  --paper-deep:#F1ECE0;
  --ink:#232E3B;
  --ink-soft:#4E5A67;
  --line:#DED6C4;
  --marigold:#C4831F;
  --marigold-deep:#9C6714;
  --leaf:#2E6B57;
  --navy:#1B2430;
  --white:#FFFFFF;

  --font-display:"Fraunces", Georgia, serif;
  --font-body:"Public Sans", -apple-system, Segoe UI, sans-serif;

  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.15;
  margin:0 0 .5em;
  color:var(--navy);
}
h1{font-size:clamp(2.1rem,4vw,3.4rem)}
h2{font-size:clamp(1.5rem,2.6vw,2.1rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em;max-width:68ch;color:var(--ink-soft)}
.container{max-width:var(--max);margin:0 auto;padding:0 28px}
section{padding:72px 0}
section.tight{padding:44px 0}

/* ---- header / nav ---- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(250,247,240,.92);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:14px;padding-bottom:14px;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:46px;width:auto}
.brand-name{
  font-family:var(--font-display);
  font-weight:600;font-size:1.05rem;color:var(--navy);
  line-height:1.15;max-width:220px;
}
.brand-name small{display:block;font-family:var(--font-body);font-weight:400;font-size:.72rem;color:var(--ink-soft);letter-spacing:.02em}

nav.main-nav{display:flex;align-items:center;gap:28px}
nav.main-nav a{
  text-decoration:none;color:var(--ink);font-size:.95rem;font-weight:500;
  padding:6px 2px;border-bottom:2px solid transparent;
}
nav.main-nav a:hover,nav.main-nav a.active{border-bottom-color:var(--marigold);color:var(--navy)}
.donate-btn{
  background:var(--marigold);color:var(--white)!important;
  padding:10px 20px;border-radius:3px;font-weight:600;
  border-bottom:none!important;
}
.donate-btn:hover{background:var(--marigold-deep)}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:6px}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--navy);margin:5px 0}

@media (max-width:860px){
  nav.main-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--paper);border-bottom:1px solid var(--line);
    flex-direction:column;align-items:flex-start;gap:0;
    padding:8px 28px 18px;display:none;
  }
  nav.main-nav.open{display:flex}
  nav.main-nav a{width:100%;padding:12px 0;border-bottom:1px solid var(--line)}
  nav.main-nav a.active{border-bottom-color:var(--line);color:var(--marigold-deep)}
  .donate-btn{margin-top:10px;text-align:center}
  .nav-toggle{display:block}
}

/* ---- hero ---- */
.hero{
  position:relative;
  padding:0;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero-media{position:relative;min-height:52vh;display:flex;align-items:flex-end}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(0deg, rgba(27,36,48,.86) 0%, rgba(27,36,48,.35) 55%, rgba(27,36,48,.15) 100%);
}
.hero-content{position:relative;color:var(--white);padding:56px 0 44px}
.hero-content h1{color:var(--white);max-width:16ch}
.hero-content p{color:#E7E1D2;font-size:1.08rem;max-width:52ch}
.eyebrow{
  color:var(--marigold);font-weight:700;font-size:.8rem;
  letter-spacing:.03em;margin-bottom:10px;
}

.page-intro{
  border-bottom:1px solid var(--line);
  padding:52px 0 40px;
}
.page-intro .eyebrow{color:var(--marigold-deep)}

/* ---- buttons ---- */
.btn{
  display:inline-block;padding:12px 24px;border-radius:3px;
  text-decoration:none;font-weight:600;font-size:.95rem;
  border:1px solid var(--navy);color:var(--navy);
}
.btn.solid{background:var(--navy);color:var(--white);border-color:var(--navy)}
.btn.marigold{background:var(--marigold);border-color:var(--marigold);color:var(--white)}
.btn:hover{opacity:.88}

/* ---- cards / grids ---- */
.grid{display:grid;gap:28px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
@media (max-width:760px){.grid.cols-3,.grid.cols-2{grid-template-columns:1fr}}

.card{
  background:var(--white);border:1px solid var(--line);
  padding:30px;border-radius:2px;
}
.card h3{margin-bottom:10px}
.card p{margin-bottom:0;font-size:.95rem}

.stat-row{display:flex;gap:48px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:32px;margin-top:36px}
.stat{min-width:120px}
.stat b{display:block;font-family:var(--font-display);font-size:2rem;color:var(--marigold-deep)}
.stat span{font-size:.85rem;color:var(--ink-soft)}

/* activities */
.activity-block{border-top:1px solid var(--line);padding:34px 0;display:grid;grid-template-columns:220px 1fr;gap:32px}
.activity-block:first-of-type{border-top:none}
.activity-block h3{color:var(--leaf)}
@media (max-width:700px){.activity-block{grid-template-columns:1fr;gap:10px}}

/* gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gallery-grid figure{margin:0;overflow:hidden;border-radius:2px;border:1px solid var(--line)}
.gallery-grid img{aspect-ratio:4/3;object-fit:cover;transition:transform .35s ease}
.gallery-grid a:hover img{transform:scale(1.04)}
@media (max-width:700px){.gallery-grid{grid-template-columns:1fr 1fr}}

/* downloads / contact / donate */
.doc-list{list-style:none;margin:0;padding:0}
.doc-list li{
  display:flex;align-items:center;justify-content:space-between;
  border-top:1px solid var(--line);padding:20px 0;
}
.doc-list li:last-child{border-bottom:1px solid var(--line)}
.doc-meta b{display:block;font-family:var(--font-display);font-size:1.05rem;color:var(--navy)}
.doc-meta span{font-size:.85rem;color:var(--ink-soft)}

.detail-table{width:100%;border-collapse:collapse;margin:18px 0 0}
.detail-table td{padding:12px 0;border-top:1px solid var(--line);font-size:.95rem;vertical-align:top}
.detail-table td:first-child{color:var(--ink-soft);width:220px}
.detail-table td:last-child{color:var(--ink);font-weight:500}

.contact-panel{background:var(--navy);color:var(--white);padding:36px;border-radius:2px}
.contact-panel h3{color:var(--white)}
.contact-panel p{color:#C9D0D8}
.contact-panel a{color:var(--marigold);text-decoration:none;font-weight:600}

form.contact-form{display:grid;gap:16px}
form.contact-form label{font-size:.85rem;font-weight:600;color:var(--navy);display:block;margin-bottom:6px}
form.contact-form input,form.contact-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:2px;
  font-family:var(--font-body);font-size:.95rem;background:var(--white);color:var(--ink);
}
form.contact-form textarea{min-height:130px;resize:vertical}
form.contact-form button{justify-self:start}

.bank-card{background:var(--white);border:1px solid var(--line);padding:30px;border-radius:2px}

/* hero slider */
.hero-slider .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.1s ease}
.hero-slider .slide.active{opacity:1;position:absolute}
.hero-slider img.active{position:absolute}
.slider-dots{position:absolute;z-index:2;bottom:20px;right:28px;display:flex;gap:8px}
.slider-dots button{
  width:9px;height:9px;border-radius:50%;border:1px solid rgba(255,255,255,.8);
  background:transparent;padding:0;cursor:pointer;
}
.slider-dots button.active{background:var(--marigold);border-color:var(--marigold)}

/* faq */
.faq-list{border-top:1px solid var(--line);max-width:78ch}
.faq-item{border-bottom:1px solid var(--line);padding:18px 0}
.faq-item summary{
  cursor:pointer;font-weight:600;color:var(--navy);font-size:1.02rem;
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-family:var(--font-display);font-size:1.3rem;color:var(--marigold-deep);flex:none}
.faq-item[open] summary::after{content:"\2212"}
.faq-item p{margin:14px 0 0;font-size:.95rem}

/* team */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.team-card{text-align:center}
.team-photo{
  width:150px;height:150px;border-radius:50%;overflow:hidden;
  margin:0 auto 18px;border:3px solid var(--white);
  box-shadow:0 0 0 1px var(--line);
}
.team-photo img{width:100%;height:100%;object-fit:cover}
.team-card h3{margin-bottom:2px;font-size:1.1rem}
.team-role{color:var(--marigold-deep);font-weight:600;font-size:.85rem;letter-spacing:.02em}
@media (max-width:700px){.team-grid{grid-template-columns:1fr}}

/* secretary message */
.message-block{
  display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:start;
  background:var(--white);border:1px solid var(--line);padding:36px;border-radius:2px;
}
.message-photo{width:100%;aspect-ratio:1/1;border-radius:50%;overflow:hidden;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line)}
.message-photo img{width:100%;height:100%;object-fit:cover}
.message-block blockquote{margin:0 0 16px;font-family:var(--font-display);font-size:1.15rem;line-height:1.5;color:var(--navy);font-weight:500}
.message-sign b{display:block;color:var(--navy);font-family:var(--font-display)}
.message-sign span{font-size:.85rem;color:var(--ink-soft)}
@media (max-width:700px){.message-block{grid-template-columns:1fr;text-align:center}.message-photo{width:140px;margin:0 auto}}

/* footer */
footer.site-footer{background:var(--navy);color:#C9D0D8;padding:48px 0 28px;margin-top:0}
footer.site-footer .container{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
footer.site-footer h4{color:var(--white);font-family:var(--font-body);font-size:.85rem;letter-spacing:.03em;margin-bottom:14px}
footer.site-footer a{color:#C9D0D8;text-decoration:none;font-size:.92rem;display:block;margin-bottom:8px}
footer.site-footer a:hover{color:var(--marigold)}
.footer-bottom{
  max-width:var(--max);margin:34px auto 0;padding:20px 28px 0;
  border-top:1px solid rgba(255,255,255,.12);font-size:.8rem;color:#8894A0;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
}
@media (max-width:760px){footer.site-footer .container{grid-template-columns:1fr}}