/* Lightweight modern layer over the base theme: better contrast, spacing, and mobile polish */

:root{
  --brand:#0a5729; /* primary green */
  --brand-accent:#2ecf6b;
}

/* Hero/banner readability */
.banner-section .image-layer{ position: relative; }
.banner-section .image-layer::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(1200px 400px at 10% -10%, rgba(46,207,107,.28), transparent),
              linear-gradient(180deg, rgba(9,26,18,.55) 0%, rgba(9,26,18,.15) 55%, rgba(9,26,18,.0) 100%);
  pointer-events:none;
}
.banner-section .content-box h2{ text-shadow: 0 2px 8px rgba(0,0,0,.35); }
.banner-section .support-box{ backdrop-filter: blur(3px); background: rgba(255,255,255,.14); border-radius: 10px; }

/* Buttons */
.theme-btn.btn-one{ background: var(--brand); border-color: var(--brand); }
.theme-btn.btn-one:hover{ filter:brightness(1.05); }
.btn-outline-light{ border-color: rgba(255,255,255,.7); color:#fff; }
.btn-outline-light:hover{ background:rgba(255,255,255,.12); }

/* Sections */
.sec-title h2{ letter-spacing:.2px }
.feature-block-one .inner-box, .feature-block-two .inner-box, .join-inner, .donation-inner, .card{
  border-radius: 14px; box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* Tables and forms (if present on public pages) */
.form-control:focus, .form-select:focus{
  border-color: var(--brand) !important; box-shadow: 0 0 0 .2rem rgba(10,87,41,.12) !important;
}

/* Footer logo subtle */
.main-footer .logo-icon img{ opacity:.2; }

/* Mobile spacing tweaks */
@media (max-width: 991.98px){
  .banner-section .content-box h2{ font-size: clamp(1.6rem, 4.5vw, 2.2rem); }
  .about-section .image-box{ margin-bottom: 18px; }
  .join-volunteer-section .sec-title p{ margin-bottom: .5rem; }
}

/* Ensure header Donate button is always visible on all screen sizes */
@media (max-width: 1200px){
  .main-header .menu-right-content .btn-box{ display:block !important; margin-left: 10px; }
  .header-btn{ display:inline-flex; align-items:center; white-space:nowrap; }
}

@media (max-width: 500px){
  .main-header .menu-right-content .btn-box{ display:block !important; margin-left: 10px; }
  .header-btn{ display:inline-flex; align-items:center; white-space:nowrap; }
}