/* NASDA - New Alternatives for Sustainable Development in Africa
  Global styles and theme variables */
:root {
  --primary: #1B5E20; /* deep green */
  --primary-contrast: #ffffff;
  --accent: #00A86B; /* jade */
  --dark: #0d1b2a;
  --light: #f7fbf9;
}

html { scroll-behavior: smooth; }
body { font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; background: var(--light); color: #222; }

.navbar-brand strong { color: var(--primary); }
.btn-primary { background-color: var(--primary); border-color: var(--primary); }
.btn-primary:hover, .btn-primary:focus { background-color: #154a19; border-color: #154a19; }
.btn-accent { background-color: var(--accent); border-color: var(--accent); color: #003020; }
.btn-accent:hover { background-color: #00965f; border-color: #00965f; color: #002518; }

.hero {
  background: linear-gradient(120deg, rgba(27,94,32,0.9), rgba(0,168,107,0.85)), url('../img/hero.jpg') center/cover no-repeat;
  color: var(--primary-contrast);
  padding: 96px 0;
}
.hero .lead { max-width: 720px; }

.section { padding: 64px 0; }
.section-light { background: #ffffff; }
.section-muted { background: #eef6f1; }

.feature-icon {
  width: 56px; height: 56px; border-radius: 12px;
  background: var(--light); color: var(--primary);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

footer { background: #0f2a1c; color: #cfe7db; }
footer a { color: #a9e6c8; text-decoration: none; }
footer a:hover { text-decoration: underline; }

.card-border { border: 1px solid #e2efe6; }

/* Program cards */
.program-card { border: 1px solid #e2efe6; border-radius: .5rem; background: #fff; height: 100%; transition: box-shadow .2s ease, transform .2s ease; }
.program-card:hover { box-shadow: 0 10px 20px rgba(0,0,0,0.08); transform: translateY(-2px); }
.icon-circle { width:56px; height:56px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background: #e9f3ee; color: var(--primary); }
.program-card ul { padding-left: 1.2rem; margin-bottom: .75rem; }
.program-card .btn { margin-top: .25rem; }

/* Impact helpers */
.kpi-card { background:#fff; border:1px solid #e2efe6; border-radius:.5rem; padding:1.25rem; }
.kpi-value { font-weight: 800; font-size: 1.75rem; color: var(--accent); line-height: 1; }
.kpi-label { font-size:.9rem; color:#555; }
.quote { background:#fff; border-left:4px solid var(--accent); padding:1rem 1.25rem; border-radius:.25rem; box-shadow:0 2px 8px rgba(0,0,0,.05); }
.quote footer { color:#666; font-size:.9rem; }

/* Blog helpers */
.post-card { background:#fff; border:1px solid #e2efe6; border-radius:.5rem; overflow:hidden; height:100%; transition: box-shadow .2s ease, transform .2s ease; }
.post-card:hover { box-shadow:0 10px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.post-card img { width:100%; height: 180px; object-fit: cover; }
.post-card .post-body { padding: 1rem 1.25rem; }
.post-meta { font-size:.85rem; color:#777; }
.tag { display:inline-block; font-size:.75rem; padding:.15rem .5rem; border:1px solid #d9e8df; border-radius:999px; color:#2f6f4f; margin-right:.25rem; }

/* Carousel sizing */
.hero-carousel .carousel-item img {
  max-height: 400px;
  width: 100%;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 768px) {
  .hero-carousel .carousel-item img { max-height: 400px; }
}

/* About page helpers */
.avatar { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; background: #e9f3ee; }
.brand-logos .brand-logo { height: 36px; opacity: .8; }
.brand-logos .brand-logo:hover { opacity: 1; }

/* Get Involved helpers */
.cta-strip { background: linear-gradient(120deg, rgba(27,94,32,0.9), rgba(0,168,107,0.85)); color: #fff; border-radius: .5rem; }
.action-card { border:1px solid #e2efe6; background:#fff; border-radius:.5rem; height:100%; transition: box-shadow .2s ease, transform .2s ease; }
.action-card:hover { box-shadow:0 10px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.action-card .bi { font-size: 1.4rem; color: var(--primary); }

/* Accessibility helpers */
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { position: static; width: auto; height: auto; padding: .5rem 1rem; background: #fff; }

/* Contact page helpers */
.contact-card { border:1px solid #e2efe6; border-radius:.5rem; background:#fff; transition: box-shadow .2s ease, transform .2s ease; }
.contact-card:hover { box-shadow:0 10px 20px rgba(0,0,0,.08); transform: translateY(-2px); }
.contact-card .feature-icon { background:#e9f3ee; color: var(--primary); }

/* Values list styling */
.values-list { margin: 0; }
.values-list li { display:flex; align-items:flex-start; gap:.4rem; padding:.25rem 0; border-bottom:1px solid #f0f5f2; }
.values-list li:last-child { border-bottom:none; }
.values-list .bi { font-size:.9rem; margin-top:.1rem; color: var(--accent); }
.values-list strong { color: var(--dark); }

/* Objectives list styling (legacy grid) */
.objectives-list .obj-item { display:flex; align-items:flex-start; gap:.25rem; padding:.15rem 0; }
.objectives-list .obj-item div { line-height: 1.25; }
.objectives-list .bi { font-size:.85rem; margin-top:.05rem; color: var(--accent); }

/* Super-compact objectives using CSS columns (fallback if used elsewhere) */
.objectives-compact { columns: 2; column-gap: 1rem; padding-left: 1.1rem; }
.objectives-compact li { break-inside: avoid; margin-bottom: .15rem; line-height: 1.25; }
@media (max-width: 768px) { .objectives-compact { columns: 1; } }

/* Tighten accordion spacing */
.accordion-button { padding:.5rem .75rem; }
.accordion-body { padding:.25rem .75rem; }
