/* =====================================================================
   Bahuuddeshiya Gramvikas Sevabhavi Sanstha — Design tokens
   Palette: teal (trust/growth) + maroon (identity/logo) + ochre (warmth)
   Signature motif: a dashed "footpath" — echoes the tagline
   "खेड्याकडे चला" (Let's walk to the villages) and the walking
   Gandhi figure on the letterhead.
   ===================================================================== */
:root{
  --teal-900:#083f3c;
  --teal-700:#0b5e59;
  --teal-600:#0f766e;
  --teal-100:#e3f2f0;
  --maroon-700:#8c2a26;
  --maroon-600:#a4342e;
  --ochre-500:#c98a2c;
  --ochre-100:#faf1de;
  --cream:#faf6ef;
  --cream-dark:#f1ead9;
  --ink:#2b2620;
  --ink-soft:#5b5347;
  --line:#e6ddc9;

  --font-display:'Baloo 2', 'Noto Sans Devanagari', sans-serif;
  --font-body:'Noto Sans Devanagari','Inter',sans-serif;
  --radius:14px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
}
h1,h2,h3,h4,h5,.font-display{
  font-family:var(--font-display);
  color:var(--teal-900);
  font-weight:700;
}
a{color:var(--teal-700); text-decoration:none;}
a:hover{color:var(--maroon-600);}
::selection{background:var(--ochre-500); color:#fff;}

/* ---------- Utility ---------- */
.text-maroon{color:var(--maroon-600) !important;}
.text-ochre{color:var(--ochre-500) !important;}
.text-teal{color:var(--teal-700) !important;}
.bg-teal{background:var(--teal-700) !important;}
.bg-cream{background:var(--cream) !important;}
.bg-cream-dark{background:var(--cream-dark) !important;}
.section{padding:4.5rem 0;}
@media(max-width:767px){.section{padding:3rem 0;}}
.eyebrow{
  font-family:var(--font-display);
  color:var(--maroon-600);
  letter-spacing:.04em;
  font-weight:700;
  font-size:.95rem;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.5rem;
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--ochre-500);display:inline-block;}
.section-title{font-size:2rem;margin-bottom:.75rem;}
.section-sub{color:var(--ink-soft); max-width:640px;}

/* ---------- Footpath signature motif ---------- */
.footpath-divider{
  height:22px;
  background-image: radial-gradient(circle, var(--ochre-500) 3px, transparent 3.5px);
  background-size: 26px 22px;
  background-repeat: repeat-x;
  background-position: center;
  opacity:.55;
  margin: .5rem 0;
}
.footstep-list{list-style:none; padding-left:0; margin:0;}
.footstep-list li{
  position:relative;
  padding:.35rem 0 .35rem 2rem;
  border-left:2px dashed var(--line);
  margin-left:9px;
}
.footstep-list li::before{
  content:"";
  position:absolute; left:-8px; top:.7rem;
  width:14px; height:14px; border-radius:50%;
  background:var(--ochre-500);
  box-shadow:0 0 0 4px var(--cream);
}
.footstep-list li:last-child{border-left-color:transparent;}

/* ---------- Top utility bar ---------- */
.topbar{
  background:var(--teal-900);
  color:#e9f3f1;
  font-size:.83rem;
  padding:.4rem 0;
}
.topbar a{color:#e9f3f1;}
.topbar a:hover{color:var(--ochre-500);}
.topbar .reg-strip{opacity:.85;}
.topbar .lang-switch a{opacity:.75;}
.topbar .lang-switch a.active{opacity:1; font-weight:700; text-decoration:underline;}
.lang-switch-mobile{
  color:var(--maroon-600); font-weight:700; font-size:.85rem;
  align-self:center; margin-left:auto; margin-right:.5rem; text-decoration:none;
}
.hp-field{position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden;}

/* ---------- Navbar ---------- */
.site-navbar{
  background:#fff;
  box-shadow:0 2px 14px rgba(11,94,89,.08);
  padding:.55rem 0;
}
.site-navbar .navbar-brand{display:flex; align-items:center; gap:.65rem;}
.site-navbar .brand-logo{height:52px; width:52px; object-fit:contain; border-radius:50%; border:2px solid var(--ochre-500); padding:2px; background:#fff;}
.site-navbar .brand-text-mr{font-family:var(--font-display); font-weight:700; color:var(--maroon-600); font-size:1.05rem; line-height:1.25; display:block;}
.site-navbar .brand-text-en{font-size:.72rem; color:var(--ink-soft); letter-spacing:.03em; display:block;}
.site-navbar .nav-link{
  font-weight:600;
  color:var(--ink);
  padding:.6rem .65rem !important;
  position:relative;
  white-space:nowrap;
}
@media (min-width:1200px) and (max-width:1399.98px){
  .site-navbar .nav-link{font-size:.92rem; padding:.6rem .5rem !important;}
}
.site-navbar .nav-link.active,
.site-navbar .nav-link:hover{color:var(--maroon-600);}
.site-navbar .nav-link.active::after{
  content:"";
  position:absolute; left:.65rem; right:.65rem; bottom:.2rem;
  height:3px; background:var(--ochre-500); border-radius:2px;
}
.btn-donate{
  background:var(--maroon-600); color:#fff; border-radius:50px;
  padding:.55rem 1.4rem; font-weight:700; border:none;
}
.btn-donate:hover{background:var(--maroon-700); color:#fff;}
.btn-teal{background:var(--teal-700); color:#fff; border-radius:50px; padding:.55rem 1.4rem; font-weight:700; border:none;}
.btn-teal:hover{background:var(--teal-900); color:#fff;}
.btn-outline-teal{border:2px solid var(--teal-700); color:var(--teal-700); border-radius:50px; padding:.5rem 1.3rem; font-weight:700; background:transparent;}
.btn-outline-teal:hover{background:var(--teal-700); color:#fff;}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  background:linear-gradient(120deg, var(--teal-900) 0%, var(--teal-700) 55%, var(--teal-600) 100%);
  color:#fff;
  overflow:hidden;
  padding:5.5rem 0 6.5rem;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background-image: radial-gradient(circle, rgba(255,255,255,.16) 2.5px, transparent 3px);
  background-size:34px 34px;
  opacity:.5;
}
.hero .eyebrow{color:var(--ochre-500);}
.hero .eyebrow::before{background:#fff;}
.hero h1{color:#fff; font-size:2.7rem;}
.hero p.lead{color:#dcefec; max-width:560px;}
.hero-stats{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius);
  backdrop-filter:blur(2px);
}
.hero-stats .stat-num{font-family:var(--font-display); font-size:1.9rem; font-weight:800; color:var(--ochre-500);}
.hero-stats .stat-label{font-size:.8rem; color:#dcefec;}
.hero-media{
  border-radius:22px;
  overflow:hidden;
  border:4px solid rgba(255,255,255,.25);
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}

/* ---------- Cards ---------- */
.card-ngo{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:transform .2s ease, box-shadow .2s ease;
  height:100%;
}
.card-ngo:hover{transform:translateY(-5px); box-shadow:0 16px 30px rgba(11,94,89,.12);}
.icon-badge{
  width:56px; height:56px; border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background:var(--teal-100); color:var(--teal-700); font-size:1.5rem;
  margin-bottom:1rem;
}
.card-ngo:nth-child(3n+2) .icon-badge{background:var(--ochre-100); color:var(--ochre-500);}
.card-ngo:nth-child(3n+3) .icon-badge{background:#fbe9e8; color:var(--maroon-600);}

/* ---------- Board members ---------- */
.member-card{text-align:center;}
.member-photo{
  width:150px; height:150px; border-radius:50%; object-fit:cover;
  border:4px solid var(--ochre-100); margin:0 auto 1rem;
}
.member-card h5{margin-bottom:.15rem;}
.member-card .designation{color:var(--maroon-600); font-weight:600; font-size:.9rem;}

/* ---------- Gallery ---------- */
.gallery-item{
  border-radius:var(--radius); overflow:hidden; position:relative; display:block;
  aspect-ratio:4/3;
}
.gallery-item img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.gallery-item:hover img{transform:scale(1.08);}
.gallery-item .overlay{
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,63,60,.75), transparent 55%);
  display:flex; align-items:flex-end; padding:.8rem;
  color:#fff; font-weight:600; font-size:.9rem; opacity:0; transition:opacity .25s;
}
.gallery-item:hover .overlay{opacity:1;}

.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:46px; height:46px; border-radius:50%; border:none;
  background:rgba(255,255,255,.15); color:#fff; font-size:1.4rem;
  display:flex; align-items:center; justify-content:center;
  z-index:5; transition:background .2s;
}
.lightbox-nav:hover{background:rgba(255,255,255,.3); color:#fff;}
.lightbox-prev{left:.5rem;}
.lightbox-next{right:.5rem;}
@media (min-width:768px){
  .lightbox-prev{left:-1.5rem;}
  .lightbox-next{right:-1.5rem;}
}

/* video */
.video-thumb{position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:16/9; display:block;}
.video-thumb img{width:100%; height:100%; object-fit:cover;}
.video-thumb .play-btn{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(8,63,60,.35);
}
.video-thumb .play-btn span{
  width:58px; height:58px; border-radius:50%; background:var(--maroon-600); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.4rem;
}

/* ---------- News / events ---------- */
.news-card .date-badge{
  background:var(--ochre-500); color:#fff; font-weight:700; border-radius:10px;
  padding:.35rem .7rem; font-size:.8rem; display:inline-block;
}
.news-card img{border-radius:var(--radius) var(--radius) 0 0; aspect-ratio:16/10; object-fit:cover; width:100%;}

/* ---------- Footer ---------- */
.site-footer{background:var(--teal-900); color:#cfe6e2; padding-top:3.5rem;}
.site-footer h6{color:#fff; font-family:var(--font-display); margin-bottom:1rem;}
.site-footer a{color:#cfe6e2;}
.site-footer a:hover{color:var(--ochre-500);}
.site-footer .reg-list li{font-size:.83rem; margin-bottom:.35rem; opacity:.9;}
.footer-bottom{background:var(--teal-900); border-top:1px solid rgba(255,255,255,.12); padding:1rem 0; font-size:.85rem;}
.social-circle{
  width:38px; height:38px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.1); color:#fff; margin-right:.4rem;
}
.social-circle:hover{background:var(--ochre-500); color:#fff;}

/* floating whatsapp */
.whatsapp-float{
  position:fixed; bottom:22px; right:22px; z-index:999;
  width:56px; height:56px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.back-to-top{
  position:fixed; bottom:22px; left:22px; z-index:999;
  width:46px; height:46px; border-radius:50%; background:var(--teal-700); color:#fff;
  display:none; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}

/* page banner (interior pages) */
.page-banner{
  background:linear-gradient(120deg, var(--teal-900), var(--teal-700));
  color:#fff; padding:3rem 0; position:relative; overflow:hidden;
}
.page-banner::before{
  content:"";
  position:absolute; inset:0;
  background-image: radial-gradient(circle, rgba(255,255,255,.14) 2.5px, transparent 3px);
  background-size:30px 30px;
}
.page-banner h1{color:#fff; margin-bottom:.4rem;}
.breadcrumb-ngo a{color:#cfe6e2;}
.breadcrumb-ngo .active{color:var(--ochre-500);}

/* forms */
.form-control, .form-select{
  border-radius:10px; border:1px solid var(--line); padding:.65rem .9rem;
}
.form-control:focus, .form-select:focus{
  border-color:var(--teal-600); box-shadow:0 0 0 .2rem rgba(15,118,110,.15);
}
label.form-label{font-weight:600; color:var(--teal-900);}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important; transition:none !important;}
}