/*-------------------------------------- Global-------------------- */
a, a:hover, a:focus, a:visited {
    text-decoration: none !important;
}
*, *::before, *::after { box-sizing: border-box; }

body {
       font-family: 'Poppins', sans-serif;
      margin: 0;
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
      background: #f9f9f9;
      color: #333;
      overflow-x: hidden;
    }
    a { text-decoration: none; color: inherit; }
    ul { list-style: none; padding: 0; margin: 0; }
    button { font: inherit; cursor: pointer; background: none; border: none; }


/*-------------------------------------- Header and Nav Bar Start here--------------------- */
    /* Reset */
 
    /* Top bar */
    .top-bar {
      background: #2a2b69;
      color: white;
      font-size: 0.875rem;
      display: flex;
      justify-content: space-evenly;
      align-items: center;
      padding: 0.3rem 1.5rem;
      user-select: none;
    }
    .top-left, .top-right { display:flex; align-items:center; gap:1.2rem; }
    .top-right { justify-content:flex-end;  }
    .top-left{ justify-content: center; flex: 1; gap: 2rem;}
    .top-left a, .top-right a {
      color: #f3f4f6; display:flex; align-items:center; gap:0.3rem; font-weight:500;
      transition: color .25s ease;
    }
    .top-left a:hover, .top-right a:hover { color: #fbbf24; }
    .icon-mail svg, .icon-phone svg { width:16px;height:16px;fill:#fbbf24;flex-shrink:0; }

    .social-icons { display:flex; gap:.8rem; }
    .social-icons a { display:inline-flex; width:22px; height:22px; transition:transform .25s; }
    .social-icons a:hover, .social-icons a:focus { transform:scale(1.15); }
    .social-icons svg { width:100%; height:100%; fill:currentColor; }
    .facebook{color:#1877F2} .twitter{color:#1DA1F2} .instagram{color:#E1306C} .linkedin{color:#0A66C2}

    .donate-btn {
      background:#fbbf24; color:#1e3a8a; font-weight:700; padding:.3rem 1rem; border-radius:25px;
      white-space:nowrap; transition:background .25s,color .25s;
    }
    .donate-btn:hover, .donate-btn:focus { background:#d69e0e; color:#fff; outline:none; }

    /* Header bottom nav */
    header {
      background:white;
      box-shadow:0 2px 8px rgba(0,0,0,.1);
      position: sticky; top:0; z-index:9999;
    }
    .nav-container {
      max-width:1200px; margin:auto; padding:.8rem 1.5rem;
      display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
    }

    /* Logo */
    .logo { font-weight:700; font-size:1.8rem; color:#1e3a8a; display:flex; gap:.5rem; align-items:center; }
    .logo span { color:#fbbf24; }
    .logo img { height:50px; width:auto; display:block; }
    /* Navigation - desktop default (untouched) */
    nav {
      flex:1 1 auto; margin-left:2rem; position:relative; z-index:10001;
      display:flex; align-items:center; justify-content:space-between;
    }
    nav ul.main-menu {
      display:flex; justify-content: center; gap:2rem; align-items:center; margin:0; padding:0; flex:1;
    }
    nav ul.main-menu li { position:relative; display:flex; align-items:center; }
    nav ul.main-menu li a {
      display:block; font-weight:750; font-size:1.0rem; padding:.3rem 0; color:#1e3a8a; white-space:nowrap;
      transition: color .25s;
    }
    nav ul.submenu li:hover, nav ul.submenu li:focus {
    background-color: #fbbf24;
}

    /* Desktop dropdown (keep as you had) */
    nav ul.main-menu li.has-submenu > a::after {
      content: "▾"; font-size: .6rem; margin-left:6px; vertical-align:middle; transition: transform .25s;
    }
    nav ul.main-menu li.has-submenu:hover > a::after,
    nav ul.main-menu li.has-submenu:focus-within > a::after { transform: rotate(-180deg); }

    nav ul.submenu {
      position:absolute; padding: 0; top:100%; left:0;
      background:white;  border-radius: 0 0 15px 15px; margin-top:.5rem;
      opacity:0; visibility:hidden; transform:translateY(-10px);
      transition: opacity .25s, transform .25s, visibility .25s; z-index:10; display:flex; flex-direction:column;
    }
    nav ul.submenu li {
      position:relative; border-bottom:1px solid rgba(73, 73, 73, 0.43)  /* fixed width for dropdown */
    }
    nav ul.submenu li :hover, nav ul.submenu li :focus,nav ul.submenu li a:hover, nav ul.submenu li a:focus {  color:white;} 
    nav ul.main-menu li.has-submenu:hover > ul.submenu,
    nav ul.main-menu li.has-submenu:focus-within > ul.submenu {
      opacity:1; visibility:visible; transform:translateY(0);
    }
    nav ul.submenu li a {
      padding:.6rem 1.2rem; font-weight:500; font-size:.9rem; color:#1e3a8a; white-space:nowrap;
      transition: background-color .25s, color .25s; display:block; 
    }
    nav ul.submenu li:last-child a { border-bottom:none; }
   /* nav ul.submenu li a:hover, nav ul.submenu li a:focus { background:#fbbf24; color:white; outline:none; } */

    .verify-menu {
      display:flex; align-items:center; gap:.3rem; font-size: 1.0rem; font-weight:750; color:#1e3a8a; cursor:pointer;
      white-space:nowrap; flex-shrink:0; transition:color .25s;
    }
    .verify-menu:hover, .verify-menu:focus { color:#fbbf24; outline:none; }
    .verify-menu svg { width:20px; height:20px; fill:currentColor; display:block; }

    .mobile-menu-btn {
      display:none; font-size:1.8rem; color:#1e3a8a; cursor:pointer; background:none; border:none; flex-shrink:0;
    }
    .mobile-menu-btn:focus { outline:2px solid #fbbf24; outline-offset:2px; }

    /* overlay */
    .overlay {
      position:fixed; top:0; left:0; width:100%; height:100%;
      background:rgba(0,0,0,.4); backdrop-filter: blur(3px);
      opacity:0; visibility:hidden; transition:opacity .25s; z-index:9998;
    }
    .overlay.show { opacity:1; visibility:visible; }
   
    /* === MOBILE OVERRIDES === */
    @media (max-width: 900px) {

      /* hide desktop verify item on mobile */
    .verify-menu { display:none; }
    .top-left, .top-right { display:flex; align-items:center; gap:1.2rem; }
    .top-left .email, .top-left .phone { display:none; }
      /* show burger */
      .mobile-menu-btn { display:block; }
      .top-bar{justify-content: center; align-items: center;}
   

      /* off-canvas nav from the left */
      nav {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 65%;
        max-width: 320px;
        background: white;
        padding: 4rem 1.5rem 2rem;
        box-shadow: 4px 0 12px rgba(0,0,0,.12);
        transform: translateX(-100%); /* hidden by default */
        transition: transform .32s cubic-bezier(.2,.9,.3,1);
        flex-direction: column;
        overflow-y: auto;
        z-index: 10001;
        justify-content: flex-start;
        margin: 0;
        gap: 20px;
      }
      nav.open { transform: translateX(0); }

      /* ensure main menu is vertical and full width */
      nav ul.main-menu {
        display: flex;
        flex-direction: column;
        gap: .25rem;
        align-items: stretch;
        width: 100%;
        flex:0;
      }
      
      /* top-level list items become block rows */
      nav ul.main-menu li {
        display: block;
        width: 100%;
      }

      /* anchors occupy full row, show toggle span at right */
      nav ul.main-menu li > a {
        display:flex;
        justify-content: space-between;
        align-items: center;
        width:100%;
        padding: .6rem 0;
        font-weight:600;
        color:#1e3a8a;
        border-bottom: 1px solid rgba(0,0,0,.09);
        
      }

      /* hide desktop ::after arrow (we use .toggle element) */
      nav ul.main-menu li.has-submenu > a::after { display:none; }

      /* default: submenu collapsed (keeps in flow, pushes content) */
      nav ul.submenu {
        position: static;        /* in-flow, not absolute */
        display: block;
        width: 100%;
        max-height: 0;           /* collapsed */
        overflow: hidden;
        transition: max-height .28s ease;
        background: transparent;
        margin: 0;
        padding: 0;
      }
        nav ul.submenu li:hover, nav ul.submenu li:focus {
         background-color: #fbbf24;
        }

      /* when expanded, allow enough height to show children */
      nav ul.main-menu li.expanded > ul.submenu {
        max-height: 800px; /* large enough to reveal children */
      }

      /* submenu items style for mobile push-down look */
      nav ul.submenu li a {
        display:block;
        padding: .6rem 1.2rem;
        border-bottom: 1px solid rgba(0,0,0,.08);
        font-weight:500; color:#1e3a8a;
      }
      nav ul.submenu li:last-child a { border-bottom:none; }

      /* style toggle span (plus/minus) */
      nav ul.main-menu li > a .toggle {
        margin-left: .5rem;
        font-weight:700;
        font-size:1.05rem;
        line-height:1;
      }



      /* small top-bar tweaks on very small screens */
      @media (max-width: 600px) {
        .top-left .email, .top-left .phone { display:none; }
        .top-bar { font-size:.85rem; padding:.35rem 1rem; }
        .donate-btn { padding:.25rem .8rem; font-size:.85rem; }
      }

    } /* end mobile override */

    /* nav close button (visible on mobile via CSS) */
    .nav-close-btn {
      position:absolute; top:1rem; right:1rem; font-size:2.2rem; color:#1e3a8a; background:none; border:none;
      cursor:pointer; user-select:none;
    }
    .nav-close-btn:focus {  outline:2px solid #fbbf24; outline-offset:2px; }
    @media (min-width: 901px) { 
    
    .nav-close-btn { display:none!important; } 
    .toggle {display: none !important; margin: 0; padding: 0; }
    .logo-container-mobile{  display: none !important;   }
    

 }

    /*-------------------------------------- Header and Nav Bar Ends here--------------------- */
   

    /*--------------------------------------------------------------
# Site Footer
--------------------------------------------------------------*/
.site-footer {
    background-color: rgb(21, 21, 31);
  position: relative;
  display: block;
   z-index: 1;
   border-top: solid 5px  red;
}

.site-footer-bg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  mix-blend-mode: luminosity;
  opacity: 0.03;
  z-index: -1;
}

.footer-widget__title {
  font-size: 20px;
  color: white;
  font-weight: 800;
  line-height: 20px;
  margin-bottom: 27px;
  letter-spacing: -0.02em;
}

.site-footer__top {
  position: relative;
  display: block;
  padding: 60px 0 38px;
}

.footer-widget__about {
  position: relative;
  display: block;
  margin-right: 84px;
}

.footer-widget__about-logo {
  position: relative;
  display: block;
}

.footer-widget__about-text-box {
  position: relative;
  display: block;
  padding-top: 16px;
  padding-bottom: 20px;
}

.footer-widget__about-text {
  color: #98a8a5;
  font-weight: 400;
  text-align: justify;
}

.footer-widget__links {
  position: relative;
  display: block;
}

.footer-widget__links-list {
  position: relative;
  display: block;
}

.footer-widget__links-list li {
  position: relative;
  display: block;
}

.footer-widget__links-list li + li {
  margin-top: 11px;
}

.footer-widget__links-list li a {
  position: relative;
  display: inline-block;
  font-size: 15px;
  color: #98a8a5;
  font-weight: 400;
  transition: all 500ms ease;
}

.footer-widget__links-list li a:hover {
  padding-left: 15px;
  color: white;
}

.footer-widget__links-list li a:before {
  position: absolute;
  top: 36%;
  left: 0;
  bottom: 0;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  transform: translateY(-50%);
  opacity: 0;
  transition: all 500ms ease;
  font-size: 15px;
  color: #fbd45a;
}

.footer-widget__links-list li a:hover:before {
  opacity: 1;
}

.footer-widget__non-profit {
  position: relative;
  display: block;
}

.footer-widget__non-profit-list {
  position: relative;
  display: block;
}

.footer-widget__non-profit-list li {
  position: relative;
  display: block;
}

.footer-widget__non-profit-list li + li {
  margin-top: 11px;
}

.footer-widget__non-profit-list li a {
  position: relative;
  display: inline-block;
  font-size: 15px;
  color: #98a8a5;
  font-weight: 400;
  transition: all 500ms ease;
}

.footer-widget__non-profit-list li a:hover {
  padding-left: 15px;
  color: white;
}

.footer-widget__non-profit-list li a:before {
  position: absolute;
  top: 36%;
  left: 0;
  bottom: 0;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  transform: translateY(-50%);
  opacity: 0;
  transition: all 500ms ease;
  font-size: 15px;
  color: #fbd45a;
}

.footer-widget__non-profit-list li a:hover:before {
  opacity: 1;
}

.footer-widget__contact {
  position: relative;
  display: block;
  margin-left: 100px;
}

.footer-widget__contact-text {
  color: #98a8a5;
  font-weight: 400;
  padding-bottom: 10px;
  text-align: justify;
}

.footer-widget__contact-list {
  position: relative;
  display: block;
}

.footer-widget__contact-list li {
  position: relative;
  display: flex;
  align-items: center;
}

.footer-widget__contact-list li .icon {
  position: relative;
  display: flex;
  align-items: center;
}

.footer-widget__contact-list li .icon i {
  position: relative;
  display: inline-block;
  font-size: 15px;
  color: #fbd45a;
}

.footer-widget__contact-list li .text {
  margin-left: 15px;
}

.footer-widget__contact-list li .text p {
  font-weight: 700;
}

.footer-widget__contact-list li .text p a {
  color: white;
  transition: all 500ms ease;
}

.footer-widget__contact-list li .text p a:hover {
  color: #fbd45a;
}

.site-footer__social {

  display: flex;

  align-items: center;
  margin-top: 22px;
}

.site-footer__social a {
  position: relative;
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;
  background-color: #212d2b;
  font-size: 15px;
  border-radius: 50%;
  overflow: hidden;
  transition: all 500ms ease;
  z-index: 1;
}

.site-footer__social a:hover {
  color: #00715d;
  background-color: white;
}

.site-footer__social a:after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  background-color: white;
  transition-delay: 0.1s;
  transition-timing-function: ease-in-out;
  transition-duration: 0.4s;
  transition-property: all;
  opacity: 1;
  transform-origin: top;
  transform-style: preserve-3d;
  transform: scaleY(0);
  z-index: -1;
}

.site-footer__social a:hover:after {
  opacity: 1;
  transform: scaleY(1);
}

.site-footer__social a + a {
  margin-left: 10px;
}

.site-footer__bottom {
  position: relative;
  display: block;
  background-color: #000907;
}

.site-footer__bottom-inner {
  position: relative;
  display: block;
  text-align: center;
  padding: 0;
}

.site-footer__bottom-text {
  font-size: 15px;
  color: white;
  font-weight: 400;
  margin: 5px;
  padding: 5px;
}

.site-footer__bottom-text a {
  color: white;
  transition: all 500ms ease;
}

.site-footer__bottom-text a:hover {
  color: white;
}