/* ===================== THEME TOKENS ===================== */
      :root{
        --bg: #ffffff;
        --fg: #121417;
        --muted:#5b6370;
        --header-bg:#ffffff;
        --card:#ffffff;
        --border:#e5e7eb;
        --section:#f2f6ff;             /* light-tinted section */
        --accent:#2a6eff;
        --accent-contrast:#ffffff;      /* text on accent */

        --shadow-sm: 0 2px 8px rgb(0 0 0 / .06);
        --shadow-md: 0 6px 18px rgb(0 0 0 / .10);

        /* Footer palette (kept dark for both themes for brand feel) */
        --footer-bg:#111;
        --footer-fg:#f2f2f2;
        --footer-link:#d4daff;
        --footer-border:#333;
      }
      [data-theme="dark"]{
        --bg: #0f1318;
        --fg: #e9eef2;
        --muted:#aeb7c2;
        --header-bg:#12171e;
        --card:#151b23;
        --border:#2a3440;
        --section:#0f1724;              /* subtle slate */
        --accent:#7ca6ff;               /* lighter accent for dark */
        --accent-contrast:#0a1220;

        --shadow-sm: 0 1px 4px rgb(0 0 0 / .40);
        --shadow-md: 0 6px 18px rgb(0 0 0 / .35);

        --footer-bg:#0f1114;
        --footer-fg:#e4e7ee;
        --footer-link:#a9bfff;
        --footer-border:#202630;
      }

      /* ===================== BASE ===================== */
      * { margin:0; padding:0; box-sizing:border-box; }
      html { scroll-behavior:smooth; }
      body {
        font-family: 'Poppins', sans-serif;
        background: var(--bg);
        color: var(--fg);
      }
      a { color: inherit; text-decoration: none; }

      .container {
        max-width: 1200px;
        margin: auto;
        padding: 40px 20px;
      }

      h1 {
        text-align: center;
        font-size: 2.6rem;
        margin-bottom: 10px;
        color: var(--fg);
      }
      p.overview {
        text-align: center;
        font-size: 1.1rem;
        margin-bottom: 40px;
        color: var(--muted);
      }

      /* ===================== HEADER ===================== */
      header {
        display:flex; justify-content:space-between; align-items:center;
        padding: 1.2rem 2rem;
        background-color: var(--header-bg);
        border-bottom: 1px solid var(--border);
        position: sticky; top:0; z-index:10;
      }
      .logo-container { display:flex; align-items:center; }
      .logo-container img {
        width:60px; height:60px; object-fit:cover; border-radius:50%;
      }
      .logo-container a { display:flex; align-items:center; color: var(--fg); }
      .site-description { font-size:1.25rem; font-weight:700; color: var(--fg); margin-left:12px; }

      .nav-links { display:flex; list-style:none; }
      .nav-links li { margin-left:30px; }
      .nav-links li a {
        color: var(--fg);
        font-size:1rem;
        transition: color .25s ease;
      }
      .nav-links li a:hover { color: var(--accent); }
      @media (max-width: 768px) { .nav-links { display:none; } }

      /* ===================== CARDS ===================== */
      .leadership, .employee-grid {
        display:flex; flex-wrap:wrap; justify-content:center;
        gap: 30px; margin-bottom: 60px;
      }
      .profile-card {
        background: var(--card);
        color: var(--fg);
        border:1px solid var(--border);
        border-radius: 16px;
        box-shadow: var(--shadow-sm);
        text-align: center;
        padding: 20px;
        width: 240px;
        transition: transform .3s ease, box-shadow .3s ease, border-color .3s;
      }
      .profile-card:hover {
        transform: translateY(-8px);
        box-shadow: var(--shadow-md);
        border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
      }
      .profile-card img {
        width:100px; height:100px; border-radius:50%;
        object-fit:cover; margin-bottom:10px;
        border:2px solid color-mix(in srgb, var(--accent) 25%, transparent);
      }
      .profile-card h3 { margin:0; font-size:1.05rem; font-weight:700; color: var(--fg); }
      .profile-card p  { margin:6px 0 0; font-size:.95rem; color: var(--muted); }

      /* ===================== LOCATIONS ===================== */
      .location-section { margin-bottom:60px; }
      .location-section h2 {
        font-size:1.6rem; margin-bottom:20px;
        border-left:5px solid var(--accent); padding-left:15px;
        color: var(--fg);
      }

    /* ============ IMPACT (clean, responsive, dark/light) ============ */
.impact-section{
  position:relative; padding:72px 0;
  background:
    radial-gradient(1100px 480px at -10% -20%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 60%),
    radial-gradient(900px 420px at 110% 120%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%),
    linear-gradient(180deg, color-mix(in srgb, var(--section) 92%, transparent), var(--section));
}

/* Header card */
.impact-head{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow-sm);
  padding:clamp(1rem, 2vw, 2rem);
  max-width:1000px;
  margin:0 auto 1.6rem;
}
.impact-tag{
  display:inline-block; margin-bottom:.75rem;
  font-size:.8rem; font-weight:700; letter-spacing:.04em;
  padding:.28rem .6rem; border-radius:999px;
  background:color-mix(in srgb, var(--accent) 18%, transparent);
  color:var(--fg);
}
.impact-head-grid{
  display:grid; gap:1rem 2rem; align-items:center;
  grid-template-columns:1fr;
}
.impact-title{
  font-family:"Libre Baskerville", serif;
  font-weight:800; line-height:1.1;
  font-size:clamp(1.8rem, 2vw + 1.2rem, 3rem);
  color:var(--fg); margin:0;
}
.impact-lead{
  color:var(--muted);
  font-size:clamp(1rem, .6vw + .9rem, 1.1rem);
}
@media (min-width: 900px){
  .impact-head-grid{
    grid-template-columns:minmax(280px,420px) 1fr;  /* title | copy */
  }
}

/* Metrics grid */
.impact-grid{
  margin-top:2rem;
  display:grid; gap:1.2rem;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.impact-card{
  background:var(--card); color:var(--fg);
  border:1px solid var(--border);
  border-radius:14px; padding:1.4rem 1.2rem;
  box-shadow:var(--shadow-sm);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  min-height:185px; display:flex; flex-direction:column; justify-content:flex-start;
}
.impact-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-md);
  border-color:color-mix(in srgb, var(--accent) 35%, var(--border));
}
.impact-icon{
  font-size:1.85rem; line-height:1;
  width:46px; height:46px; border-radius:10px;
  display:inline-grid; place-items:center;
  background:color-mix(in srgb, var(--accent) 14%, transparent);
  color:var(--fg); margin-bottom:.75rem;
}
.impact-metric{
  display:flex; align-items:baseline; gap:.22rem;
  font-weight:800; color:var(--accent); margin-bottom:.2rem;
  font-variant-numeric: tabular-nums;
}
.impact-metric .num{ font-size:1.9rem; }
.impact-metric .unit{ font-size:1rem; color:var(--accent); }
.impact-card h3{ margin:.3rem 0 .15rem; font-size:1.05rem; color:var(--fg); }
.impact-card p{ font-size:.97rem; color:var(--muted); }

/* Highlights */
.impact-highlights{
  margin-top:1.6rem; display:flex; flex-wrap:wrap;
  gap:.7rem; justify-content:center;
}
.highlight{
  display:flex; align-items:center; gap:.5rem;
  padding:.55rem .9rem; border-radius:999px;
  background:var(--card); border:1px solid var(--border);
  box-shadow:var(--shadow-sm); color:var(--fg);
  font-size:.95rem;
}
.highlight .dot{ width:8px; height:8px; border-radius:50%; background:var(--accent); }

/* Simple reveal (if AOS is absent or fails) */
.reveal{ opacity:0; transform:translateY(18px); }
.reveal.in{ opacity:1; transform:none; transition:all .7s ease var(--reveal-delay, 0ms); }

/* Responsive spacing */
@media (max-width: 640px){
  .impact-section{ padding:56px 0; }
  .impact-grid{ gap:1rem; }
}



      /* ===================== FOOTER (tokenized) ===================== */
      .footer-section {
        background-color: var(--footer-bg);
        color: var(--footer-fg);
        padding: 2rem 1rem;
        font-size: 0.9rem;
      }
      .footer-container {
        display:flex; flex-direction:column; align-items:center;
        max-width:1200px; margin:auto; gap:2rem;
      }
      .footer-logo { text-align:center; margin-right:.9rem; }
      .footer-logo img {
        width:150px; margin-bottom:1rem; border-radius:50%;
        border: 2px solid var(--footer-fg);
      }
      .social-icons a {
        color: var(--footer-fg); font-size:1.2rem; margin:0 .5rem;
        transition: color .25s ease;
      }
      .social-icons a:hover { color:#fff; }
      .footer-links {
        display:flex; justify-content:space-between; width:100%;
        flex-wrap:wrap; gap:1rem;
      }
      .footer-column h4 { font-size:1.1rem; font-weight:700; margin-bottom:1rem; color: var(--footer-fg); }
      .footer-column ul { list-style:none; padding:0; }
      .footer-column ul li { margin-bottom:.5rem; }
      .footer-column ul li a { color: var(--footer-fg); text-decoration:none; }
      .footer-column ul li a:hover { text-decoration:underline; }
      .footer-bottom {
        border-top:1px solid var(--footer-border);
        padding-top:1rem; text-align:center; color: var(--footer-fg);
      }
      .footer-bottom ul {
        list-style:none; padding:0; display:flex; justify-content:center; gap:1rem; margin-top:.5rem;
      }
      .footer-bottom ul li a { color:#bfc6ff; text-decoration:none; }
      .footer-bottom ul li a:hover { color:#fff; }
      @media (min-width: 768px) {
        .footer-container { flex-direction:row; align-items:flex-start; justify-content:space-between; }
        .footer-logo { margin-right:4rem; text-align:left; }
      }