Ihsan Foundation Slider<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n html, body { width: 100%; overflow-x: hidden; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }\n\n \/* \u2500\u2500 WordPress full-width escape \u2500\u2500 *\/\n .sl-wrap {\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow: hidden;\n background: #000;\n user-select: none;\n }\n\n .sl-track {\n display: flex;\n transition: transform 0.85s cubic-bezier(0.77, 0, 0.175, 1);\n height: 78vh;\n min-height: 460px;\n max-height: 680px;\n }\n\n .sl-slide { min-width: 100vw; height: 100%; position: relative; overflow: hidden; flex-shrink: 0; }\n\n .sl-slide img {\n width: 100%; height: 100%; object-fit: cover; display: block;\n transition: transform 7s ease;\n }\n .sl-slide.active img { transform: scale(1.07); }\n\n .sl-overlay {\n position: absolute; inset: 0;\n display: flex; flex-direction: column;\n align-items: flex-start; justify-content: flex-end;\n padding: 3.5rem 4rem;\n background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.2) 60%, transparent 100%);\n }\n\n .sl-tag {\n font-size: 11px; font-weight: 600; letter-spacing: 0.13em;\n text-transform: uppercase; color: #fff;\n background: rgba(0,165,80,0.92);\n padding: 5px 16px; border-radius: 20px; margin-bottom: 0.9rem;\n display: inline-block;\n opacity: 0; transform: translateY(14px);\n transition: opacity 0.55s ease 0.2s, transform 0.55s ease 0.2s;\n }\n\n .sl-title {\n font-size: clamp(1.7rem, 4vw, 2.9rem); font-weight: 700;\n color: #fff; line-height: 1.18; margin-bottom: 0.8rem; max-width: 660px;\n opacity: 0; transform: translateY(18px);\n transition: opacity 0.55s ease 0.35s, transform 0.55s ease 0.35s;\n text-shadow: 0 2px 14px rgba(0,0,0,0.5);\n }\n\n .sl-desc {\n font-size: clamp(0.88rem, 1.6vw, 1.02rem);\n color: rgba(255,255,255,0.9); line-height: 1.72; max-width: 560px;\n opacity: 0; transform: translateY(18px);\n transition: opacity 0.55s ease 0.5s, transform 0.55s ease 0.5s;\n text-shadow: 0 1px 6px rgba(0,0,0,0.35);\n }\n\n .sl-slide.active .sl-tag,\n .sl-slide.active .sl-title,\n .sl-slide.active .sl-desc { opacity: 1; transform: translateY(0); }\n\n .sl-counter {\n position: absolute; top: 24px; right: 26px; z-index: 20;\n background: rgba(0,0,0,0.45); color: #fff;\n font-size: 12px; font-weight: 500; padding: 5px 14px;\n border-radius: 20px; letter-spacing: 0.07em; font-family: monospace;\n }\n\n .sl-nav {\n position: absolute; top: 50%; transform: translateY(-50%); z-index: 20;\n width: 52px; height: 52px; border-radius: 50%; border: none;\n background: rgba(255,255,255,0.92); color: #0087f0;\n cursor: pointer; font-size: 20px;\n display: flex; align-items: center; justify-content: center;\n transition: all 0.25s ease;\n }\n .sl-nav:hover { background: #fff; color: #00a550; transform: translateY(-50%) scale(1.1); }\n .sl-prev { left: 26px; }\n .sl-next { right: 26px; }\n\n .sl-dots {\n position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);\n display: flex; gap: 9px; z-index: 20; align-items: center;\n }\n .sl-dot {\n width: 9px; height: 9px; border-radius: 50%;\n background: rgba(255,255,255,0.4);\n border: 1.5px solid rgba(255,255,255,0.75);\n cursor: pointer; transition: all 0.3s ease;\n }\n .sl-dot.on { background: #00a550; border-color: #00a550; width: 28px; border-radius: 5px; }\n .sl-dot:hover:not(.on) { background: rgba(255,255,255,0.78); }\n\n .sl-prog {\n position: absolute; bottom: 0; left: 0; height: 3px;\n background: linear-gradient(90deg, #00a550, #0087f0);\n z-index: 20; width: 0%;\n }\n\n @media (max-width: 768px) {\n .sl-overlay { padding: 2.2rem 2rem; }\n }\n @media (max-width: 480px) {\n .sl-overlay { padding: 1.8rem 1.2rem; }\n .sl-nav { width: 40px; height: 40px; font-size: 16px; }\n .sl-prev { left: 10px; }\n .sl-next { right: 10px; }\n .sl-counter { top: 14px; right: 14px; font-size: 11px; }\n .sl-dots { bottom: 16px; }\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"sl-wrap\" id=\"sl\">\n <div class=\"sl-counter\"><span id=\"sl-cur\">01<\/span> \/ <span id=\"sl-tot\">04<\/span><\/div>\n\n <div class=\"sl-track\" id=\"sl-track\">\n\n \n <div class=\"sl-slide active\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\" alt=\"African community\" loading=\"eager\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Mission<\/span>\n <h2 class=\"sl-title\">Empowering vulnerable communities across Africa<\/h2>\n <p class=\"sl-desc\">A humanitarian organization led by Somali professionals and scholars \u2014 driven by compassion, education, and the Islamic principles of mercy, justice, and solidarity.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Camel-Project-5-scaled.jpg\" alt=\"Camel project\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Vision<\/span>\n <h2 class=\"sl-title\">A world where no community is left behind<\/h2>\n <p class=\"sl-desc\">Founded by Somali professionals, volunteers, and scholars committed to building a future of dignity, self-reliance, and lasting change across the continent.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-7-scaled.jpg\" alt=\"Community support\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Values<\/span>\n <h2 class=\"sl-title\">Guided by mercy, justice, and solidarity<\/h2>\n <p class=\"sl-desc\">Every project, every initiative, every hand extended \u2014 grounded in the values that define Ihsan: excellence in giving, integrity in service, compassion in action.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-3.jpeg\" alt=\"Humanitarian aid\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Impact<\/span>\n <h2 class=\"sl-title\">Transforming lives through sustainable development<\/h2>\n <p class=\"sl-desc\">From humanitarian aid to education and livelihood programmes \u2014 Ihsan Foundation is creating measurable, lasting change across communities throughout Africa.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n\n <button class=\"sl-nav sl-prev\" aria-label=\"Previous slide\">❮<\/button>\n <button class=\"sl-nav sl-next\" aria-label=\"Next slide\">❯<\/button>\n <div class=\"sl-dots\" id=\"sl-dots\"><\/div>\n <div class=\"sl-prog\" id=\"sl-prog\"><\/div>\n<\/div>\n\n<script>\n(function () {\n const track = document.getElementById('sl-track');\n const slides = track.querySelectorAll('.sl-slide');\n const dotsWrap = document.getElementById('sl-dots');\n const curEl = document.getElementById('sl-cur');\n const prog = document.getElementById('sl-prog');\n const n = slides.length;\n let cur = 0, autoTimer, progInterval, elapsed = 0;\n const DUR = 5500;\n\n document.getElementById('sl-tot').textContent = String(n).padStart(2, '0');\n\n const dots = [];\n for (let i = 0; i < n; i++) {\n const d = document.createElement('span');\n d.className = 'sl-dot' + (i === 0 ? ' on' : '');\n d.addEventListener('click', () => go(i, true));\n dotsWrap.appendChild(d);\n dots.push(d);\n }\n\n function activate(i) {\n slides[cur].classList.remove('active');\n dots[cur].classList.remove('on');\n cur = i;\n slides[cur].classList.add('active');\n dots[cur].classList.add('on');\n curEl.textContent = String(cur + 1).padStart(2, '0');\n track.style.transform = `translateX(-${cur * 100}%)`;\n }\n\n function startProg() {\n elapsed = 0;\n prog.style.transition = 'none';\n prog.style.width = '0%';\n clearInterval(progInterval);\n progInterval = setInterval(() => {\n elapsed += 50;\n prog.style.transition = 'width 50ms linear';\n prog.style.width = (Math.min(elapsed \/ DUR, 1) * 100) + '%';\n if (elapsed >= DUR) clearInterval(progInterval);\n }, 50);\n }\n\n function startAuto() {\n clearTimeout(autoTimer);\n autoTimer = setTimeout(() => go((cur + 1) % n, false), DUR);\n }\n\n function go(i, manual) {\n if (manual) { clearTimeout(autoTimer); clearInterval(progInterval); }\n activate(i);\n startProg();\n startAuto();\n }\n\n document.querySelector('.sl-prev').addEventListener('click', () => go((cur - 1 + n) % n, true));\n document.querySelector('.sl-next').addEventListener('click', () => go((cur + 1) % n, true));\n\n let tx = 0;\n track.addEventListener('touchstart', e => { tx = e.touches[0].clientX; });\n track.addEventListener('touchend', e => {\n const dx = e.changedTouches[0].clientX - tx;\n if (Math.abs(dx) > 50) go(dx < 0 ? (cur + 1) % n : (cur - 1 + n) % n, true);\n });\n\n track.addEventListener('mouseenter', () => { clearTimeout(autoTimer); clearInterval(progInterval); });\n track.addEventListener('mouseleave', () => { startProg(); startAuto(); });\n\n go(0, true);\n})();\n<\/script>\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ca3911b e-flex e-con-boxed e-con e-parent\" data-id=\"ca3911b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-96e4049 elementor-widget elementor-widget-html\" data-id=\"96e4049\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-about\">\n <div class=\"ihsan-about__inner\">\n\n \n <div class=\"ihsan-about__media\">\n <div class=\"ihsan-about__img-wrap ihsan-about__img-wrap--main\">\n <img decoding=\"async\"\n src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/02\/20260125_113519-scaled.jpg\"\n alt=\"Community members gathered under a tree for an outdoor meeting\"\n loading=\"lazy\"\n \/>\n <div class=\"ihsan-about__badge\">\n <span class=\"ihsan-about__badge-number\">2,026<\/span>\n <span class=\"ihsan-about__badge-label\">Impact-ready website sample<\/span>\n <\/div>\n <\/div>\n\n <div class=\"ihsan-about__img-wrap ihsan-about__img-wrap--small\">\n <img decoding=\"async\"\n src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/WATER-WELL-18-scaled.jpg\"\n alt=\"Smiling children together outdoors\"\n loading=\"lazy\"\n \/>\n <\/div>\n <\/div>\n\n \n <div class=\"ihsan-about__content\">\n <div class=\"ihsan-about__eyebrow\">\n <span class=\"ihsan-about__eyebrow-line\"><\/span>\n <span>About Ihsan Foundation<\/span>\n <\/div>\n\n <h2 class=\"ihsan-about__heading\">\n We deliver help with dignity, speed and accountability.\n <\/h2>\n\n <p class=\"ihsan-about__text\">\n Ihsan Foundation waa hay\u2019ad samafal oo ka shaqeysa gaarsiinta deeqaha iyo garab\n istaagga dadka u baahan. Waxaan bulshada nugul u fidinaa cunto, biyo, qurbaani,\n agoon taageero, waxbarasho iyo gurmad degdeg ah.\n <\/p>\n\n <p class=\"ihsan-about__text\">\n This website sample is designed as a professional NGO\/charity homepage with active\n front-end functions, latest information panels and modern animations.\n <\/p>\n\n <div class=\"ihsan-about__actions\">\n <a href=\"#\" class=\"ihsan-about__btn ihsan-about__btn--primary\">Our Programs<\/a>\n <a href=\"#\" class=\"ihsan-about__btn ihsan-about__btn--secondary\">Become Partner<\/a>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<style>\n #ihsan-about{\n --ihsan-bg: #eef3ee;\n --ihsan-green: #1f7a4d;\n --ihsan-green-dark: #155c39;\n --ihsan-text-dark: #16241c;\n --ihsan-text-body: #4b5a52;\n --ihsan-white: #ffffff;\n --ihsan-radius: 22px;\n\n \/* ---- FULL WIDTH \/ FULL-BLEED FIX ----\n This breaks the section out of Elementor's \"boxed\" page\n container (and any theme content wrapper) so the green\n background spans the entire browser width, even if this\n HTML widget sits inside a width-restricted column\/section. *\/\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow-x: clip;\n\n background: var(--ihsan-bg);\n padding: 90px 24px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n overflow: hidden;\n }\n\n #ihsan-about *{\n box-sizing: border-box;\n }\n\n #ihsan-about .ihsan-about__inner{\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 70px;\n align-items: center;\n }\n\n \/* ---------- MEDIA \/ IMAGES ---------- *\/\n #ihsan-about .ihsan-about__media{\n position: relative;\n min-height: 560px;\n }\n\n #ihsan-about .ihsan-about__img-wrap{\n border-radius: var(--ihsan-radius);\n overflow: hidden;\n background: var(--ihsan-white);\n padding: 10px;\n box-shadow: 0 25px 50px -12px rgba(22, 36, 28, 0.18);\n transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease;\n }\n\n #ihsan-about .ihsan-about__img-wrap img{\n width: 100%;\n height: 100%;\n display: block;\n object-fit: cover;\n border-radius: calc(var(--ihsan-radius) - 8px);\n transition: transform 1.1s cubic-bezier(.2,.8,.2,1);\n }\n\n #ihsan-about .ihsan-about__img-wrap--main{\n position: relative;\n width: 84%;\n aspect-ratio: 4\/5;\n z-index: 1;\n }\n\n #ihsan-about .ihsan-about__img-wrap--small{\n position: absolute;\n right: 0;\n bottom: -6%;\n width: 52%;\n aspect-ratio: 4\/3;\n z-index: 2;\n }\n\n \/* Hover animation: images lift + slight zoom *\/\n #ihsan-about .ihsan-about__img-wrap:hover{\n transform: translateY(-10px);\n box-shadow: 0 35px 60px -10px rgba(22, 36, 28, 0.28);\n }\n\n #ihsan-about .ihsan-about__img-wrap:hover img{\n transform: scale(1.06);\n }\n\n \/* Impact badge *\/\n #ihsan-about .ihsan-about__badge{\n position: absolute;\n left: 18px;\n bottom: 18px;\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n border-radius: 14px;\n padding: 18px 22px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n box-shadow: 0 12px 24px -6px rgba(0,0,0,.25);\n transition: transform .35s ease, background .35s ease;\n }\n\n #ihsan-about .ihsan-about__img-wrap--main:hover .ihsan-about__badge{\n transform: translateY(-4px);\n background: var(--ihsan-green);\n }\n\n #ihsan-about .ihsan-about__badge-number{\n font-size: 28px;\n font-weight: 800;\n line-height: 1;\n }\n\n #ihsan-about .ihsan-about__badge-label{\n font-size: 13px;\n font-weight: 600;\n opacity: .92;\n }\n\n \/* ---------- CONTENT ---------- *\/\n #ihsan-about .ihsan-about__eyebrow{\n display: flex;\n align-items: center;\n gap: 10px;\n color: var(--ihsan-green-dark);\n font-weight: 700;\n font-size: 13px;\n letter-spacing: .12em;\n text-transform: uppercase;\n margin-bottom: 22px;\n }\n\n #ihsan-about .ihsan-about__eyebrow-line{\n width: 34px;\n height: 3px;\n border-radius: 2px;\n background: linear-gradient(90deg, var(--ihsan-green-dark), #c9d96a);\n }\n\n #ihsan-about .ihsan-about__heading{\n font-size: clamp(34px, 4.2vw, 52px);\n line-height: 1.12;\n font-weight: 800;\n color: var(--ihsan-text-dark);\n margin: 0 0 26px 0;\n letter-spacing: -0.01em;\n }\n\n #ihsan-about .ihsan-about__text{\n font-size: 16px;\n line-height: 1.75;\n color: var(--ihsan-text-body);\n margin: 0 0 18px 0;\n max-width: 560px;\n }\n\n #ihsan-about .ihsan-about__actions{\n display: flex;\n gap: 16px;\n margin-top: 30px;\n flex-wrap: wrap;\n }\n\n #ihsan-about .ihsan-about__btn{\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 16px 30px;\n border-radius: 50px;\n font-weight: 700;\n font-size: 15px;\n text-decoration: none;\n transition: transform .3s ease, box-shadow .3s ease, background .3s ease, color .3s ease;\n white-space: nowrap;\n }\n\n #ihsan-about .ihsan-about__btn--primary{\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n box-shadow: 0 10px 22px -6px rgba(21,92,57,.45);\n }\n\n #ihsan-about .ihsan-about__btn--primary:hover{\n background: var(--ihsan-green);\n transform: translateY(-3px);\n box-shadow: 0 16px 28px -6px rgba(21,92,57,.55);\n }\n\n #ihsan-about .ihsan-about__btn--secondary{\n background: var(--ihsan-white);\n color: var(--ihsan-green-dark);\n border: 1px solid rgba(21,92,57,.15);\n }\n\n #ihsan-about .ihsan-about__btn--secondary:hover{\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n transform: translateY(-3px);\n box-shadow: 0 14px 24px -6px rgba(21,92,57,.35);\n }\n\n \/* ---------- SCROLL REVEAL (lightweight, no JS dependency required) ---------- *\/\n #ihsan-about .ihsan-about__media,\n #ihsan-about .ihsan-about__content{\n opacity: 0;\n transform: translateY(24px);\n animation: ihsanFadeUp .8s ease forwards;\n }\n #ihsan-about .ihsan-about__content{ animation-delay: .12s; }\n\n @keyframes ihsanFadeUp{\n to{ opacity: 1; transform: translateY(0); }\n }\n\n \/* ---------- RESPONSIVE ---------- *\/\n\n \/* Tablets \/ small laptops *\/\n @media (max-width: 1024px){\n #ihsan-about{ padding: 70px 24px; }\n #ihsan-about .ihsan-about__inner{\n grid-template-columns: 1fr;\n gap: 56px;\n }\n #ihsan-about .ihsan-about__media{\n min-height: 0;\n max-width: 520px;\n margin: 0 auto;\n }\n #ihsan-about .ihsan-about__content{\n text-align: center;\n }\n #ihsan-about .ihsan-about__eyebrow{\n justify-content: center;\n }\n #ihsan-about .ihsan-about__text{\n margin-left: auto;\n margin-right: auto;\n }\n #ihsan-about .ihsan-about__actions{\n justify-content: center;\n }\n }\n\n \/* Mobile *\/\n @media (max-width: 560px){\n #ihsan-about{ padding: 56px 16px; }\n #ihsan-about .ihsan-about__inner{ gap: 44px; }\n #ihsan-about .ihsan-about__heading{ font-size: 30px; }\n #ihsan-about .ihsan-about__media{\n min-height: 0;\n padding-bottom: 40px; \/* room for the offset small image *\/\n }\n #ihsan-about .ihsan-about__img-wrap--main{ width: 100%; }\n #ihsan-about .ihsan-about__img-wrap--small{\n width: 60%;\n right: -6px;\n bottom: -8%;\n }\n #ihsan-about .ihsan-about__badge{\n left: 10px;\n bottom: 10px;\n padding: 12px 16px;\n }\n #ihsan-about .ihsan-about__badge-number{ font-size: 22px; }\n #ihsan-about .ihsan-about__badge-label{ font-size: 11px; }\n #ihsan-about .ihsan-about__actions{\n flex-direction: column;\n width: 100%;\n }\n #ihsan-about .ihsan-about__btn{ width: 100%; }\n }\n\n \/* Respect reduced motion preference *\/\n @media (prefers-reduced-motion: reduce){\n #ihsan-about .ihsan-about__media,\n #ihsan-about .ihsan-about__content{\n animation: none;\n opacity: 1;\n transform: none;\n }\n #ihsan-about .ihsan-about__img-wrap,\n #ihsan-about .ihsan-about__img-wrap img,\n #ihsan-about .ihsan-about__btn,\n #ihsan-about .ihsan-about__badge{\n transition: none;\n }\n }\n<\/style>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1fb26ee e-flex e-con-boxed e-con e-parent\" data-id=\"1fb26ee\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7f15fbb elementor-widget elementor-widget-html\" data-id=\"7f15fbb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-campaigns\">\n <h2 class=\"sr-only\">Active Ihsan Foundation campaigns with search and filter<\/h2>\n <h2 class=\"ihsan-camp__heading\">Active campaigns with search, filter and progress.<\/h2>\n <div class=\"ihsan-camp__controls\">\n <div class=\"ihsan-camp__tabs\" id=\"ihsanCampTabs\"><\/div>\n <div class=\"ihsan-camp__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle>\n <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line>\n <\/svg>\n <input type=\"text\" id=\"ihsanCampSearch\" placeholder=\"Search projects...\" autocomplete=\"off\" \/>\n <\/div>\n <\/div>\n <div class=\"ihsan-camp__status\" id=\"ihsanCampStatus\"><\/div>\n <div class=\"ihsan-camp__grid\" id=\"ihsanCampGrid\"><\/div>\n <div class=\"ihsan-camp__more-wrap\" id=\"ihsanCampMoreWrap\" style=\"display:none;\">\n <button class=\"ihsan-camp__more-btn\" id=\"ihsanCampMoreBtn\">Load More<\/button>\n <\/div>\n<\/section>\n\n<style>\n#ihsan-campaigns {\n --camp-bg: #eef3ee;\n --camp-green: #1f7a4d;\n --camp-green-dark: #155c39;\n --camp-text-dark: #16241c;\n --camp-text-body: #5b6b62;\n --camp-white: #ffffff;\n --camp-track: #eef0e6;\n --camp-progress: linear-gradient(90deg, #e8b339, #bcd95f);\n --camp-radius: 18px;\n\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow-x: clip;\n\n background: var(--camp-bg);\n padding: 70px 24px 90px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-campaigns * { box-sizing: border-box; }\n\n\/* ---------- HEADING ---------- *\/\n#ihsan-campaigns .ihsan-camp__heading {\n max-width: 1240px;\n margin: 0 auto 32px;\n font-size: clamp(28px, 3.4vw, 40px);\n line-height: 1.2;\n font-weight: 800;\n color: var(--camp-text-dark);\n}\n\n\/* ---------- CONTROLS ---------- *\/\n#ihsan-campaigns .ihsan-camp__controls {\n max-width: 1240px;\n margin: 0 auto 36px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__tabs {\n display: flex;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__tab {\n border: none;\n background: var(--camp-white);\n color: var(--camp-text-dark);\n font-weight: 700;\n font-size: 14px;\n padding: 10px 20px;\n border-radius: 50px;\n cursor: pointer;\n transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease;\n box-shadow: 0 2px 6px rgba(0,0,0,.05);\n}\n\n#ihsan-campaigns .ihsan-camp__tab:hover {\n transform: translateY(-2px);\n box-shadow: 0 8px 16px -4px rgba(21,92,57,.25);\n}\n\n#ihsan-campaigns .ihsan-camp__tab.is-active {\n background: var(--camp-green-dark);\n color: var(--camp-white);\n}\n\n#ihsan-campaigns .ihsan-camp__search {\n position: relative;\n display: flex;\n align-items: center;\n}\n\n#ihsan-campaigns .ihsan-camp__search svg {\n position: absolute;\n left: 16px;\n color: #9aa79e;\n pointer-events: none;\n}\n\n#ihsan-campaigns .ihsan-camp__search input {\n width: 260px;\n max-width: 100%;\n padding: 12px 16px 12px 42px;\n border-radius: 50px;\n border: 1px solid #e1e8e2;\n background: var(--camp-white);\n font-size: 14px;\n outline: none;\n transition: box-shadow .25s ease, border-color .25s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__search input:focus {\n border-color: var(--camp-green);\n box-shadow: 0 0 0 3px rgba(31,122,77,.15);\n}\n\n\/* ---------- STATUS ---------- *\/\n#ihsan-campaigns .ihsan-camp__status {\n max-width: 1240px;\n margin: 0 auto 20px;\n font-size: 14px;\n color: var(--camp-text-body);\n min-height: 1px;\n}\n#ihsan-campaigns .ihsan-camp__status.is-error { color: #b3261e; }\n\n\/* ---------- GRID ---------- *\/\n#ihsan-campaigns .ihsan-camp__grid {\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 26px;\n}\n\n\/* ---------- CARD ---------- *\/\n#ihsan-campaigns .ihsan-camp__card {\n background: var(--camp-white);\n border-radius: var(--camp-radius);\n overflow: hidden;\n box-shadow: 0 10px 30px -10px rgba(22,36,28,.12);\n transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;\n display: flex;\n flex-direction: column;\n opacity: 0;\n transform: translateY(18px);\n animation: ihsanCampFadeUp .6s ease forwards;\n}\n\n@keyframes ihsanCampFadeUp { to { opacity: 1; transform: translateY(0); } }\n\n#ihsan-campaigns .ihsan-camp__card:hover {\n transform: translateY(-8px);\n box-shadow: 0 26px 44px -12px rgba(22,36,28,.22);\n}\n\n\/* ---------- MEDIA \/ IMAGE ---------- *\/\n#ihsan-campaigns .ihsan-camp__media {\n position: relative;\n height: 200px;\n overflow: hidden;\n background: linear-gradient(135deg, #1f7a4d, #bcd95f);\n}\n\n#ihsan-campaigns .ihsan-camp__media img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .6s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__card:hover .ihsan-camp__media img {\n transform: scale(1.08);\n}\n\n\/* Dark gradient overlay so the badge stays readable on any image *\/\n#ihsan-campaigns .ihsan-camp__media-overlay {\n position: absolute;\n inset: 0;\n background: linear-gradient(to top, rgba(0,0,0,.38) 0%, transparent 55%);\n pointer-events: none;\n}\n\n#ihsan-campaigns .ihsan-camp__cat-badge {\n position: absolute;\n top: 14px;\n left: 14px;\n background: rgba(255,255,255,.92);\n color: var(--camp-green-dark);\n font-size: 11px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .04em;\n padding: 5px 12px;\n border-radius: 50px;\n z-index: 2;\n}\n\n\/* ---------- CARD BODY ---------- *\/\n#ihsan-campaigns .ihsan-camp__body {\n padding: 20px 22px 22px;\n display: flex;\n flex-direction: column;\n flex: 1;\n}\n\n#ihsan-campaigns .ihsan-camp__title {\n font-size: 19px;\n font-weight: 800;\n color: var(--camp-text-dark);\n margin: 0 0 10px;\n line-height: 1.3;\n}\n\n#ihsan-campaigns .ihsan-camp__meta-row {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__location {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 12.5px;\n font-weight: 700;\n color: var(--camp-text-body);\n}\n\n#ihsan-campaigns .ihsan-camp__funded-pill {\n background: #e7f5ec;\n color: var(--camp-green-dark);\n font-size: 12px;\n font-weight: 800;\n padding: 3px 11px;\n border-radius: 50px;\n}\n\n#ihsan-campaigns .ihsan-camp__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: var(--camp-text-body);\n margin: 0 0 16px;\n flex: 1;\n}\n\n#ihsan-campaigns .ihsan-camp__progress-track {\n height: 8px;\n border-radius: 6px;\n background: var(--camp-track);\n overflow: hidden;\n margin-bottom: 8px;\n}\n\n#ihsan-campaigns .ihsan-camp__progress-fill {\n height: 100%;\n border-radius: 6px;\n background: var(--camp-progress);\n width: 0%;\n transition: width 1s cubic-bezier(.2,.8,.2,1);\n}\n\n#ihsan-campaigns .ihsan-camp__amount-row {\n display: flex;\n justify-content: space-between;\n font-size: 13px;\n font-weight: 700;\n color: var(--camp-text-dark);\n margin-bottom: 18px;\n}\n\n#ihsan-campaigns .ihsan-camp__amount-row .raised { color: var(--camp-green-dark); }\n#ihsan-campaigns .ihsan-camp__amount-row .goal { color: var(--camp-text-body); font-weight: 600; }\n\n#ihsan-campaigns .ihsan-camp__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n align-self: flex-start;\n padding: 12px 26px;\n border-radius: 50px;\n background: var(--camp-white);\n border: 1.5px solid var(--camp-green-dark);\n color: var(--camp-green-dark);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__btn:hover {\n background: var(--camp-green-dark);\n color: var(--camp-white);\n transform: translateY(-2px);\n box-shadow: 0 12px 22px -6px rgba(21,92,57,.4);\n}\n\n\/* ---------- SKELETON ---------- *\/\n#ihsan-campaigns .ihsan-camp__skeleton .ihsan-camp__media { background: #e3e9e3; }\n#ihsan-campaigns .ihsan-camp__skel-line {\n height: 12px;\n border-radius: 6px;\n background: #e3e9e3;\n margin-bottom: 10px;\n animation: ihsanPulse 1.3s ease-in-out infinite;\n}\n@keyframes ihsanPulse { 0%,100%{ opacity:1; } 50%{ opacity:.5; } }\n\n\/* ---------- LOAD MORE ---------- *\/\n#ihsan-campaigns .ihsan-camp__more-wrap { text-align: center; margin-top: 40px; }\n#ihsan-campaigns .ihsan-camp__more-btn {\n border: none;\n background: var(--camp-green-dark);\n color: var(--camp-white);\n font-weight: 700;\n font-size: 14px;\n padding: 13px 32px;\n border-radius: 50px;\n cursor: pointer;\n transition: background .25s ease, transform .25s ease;\n}\n#ihsan-campaigns .ihsan-camp__more-btn:hover {\n background: var(--camp-green);\n transform: translateY(-2px);\n}\n\n\/* ---------- RESPONSIVE ---------- *\/\n@media (max-width: 1024px) {\n #ihsan-campaigns .ihsan-camp__grid { grid-template-columns: repeat(2, 1fr); }\n}\n\n@media (max-width: 640px) {\n #ihsan-campaigns { padding: 50px 16px 70px; }\n #ihsan-campaigns .ihsan-camp__grid { grid-template-columns: 1fr; }\n #ihsan-campaigns .ihsan-camp__controls { flex-direction: column; align-items: stretch; }\n #ihsan-campaigns .ihsan-camp__search input { width: 100%; }\n #ihsan-campaigns .ihsan-camp__tabs {\n overflow-x: auto;\n flex-wrap: nowrap;\n padding-bottom: 4px;\n -webkit-overflow-scrolling: touch;\n }\n #ihsan-campaigns .ihsan-camp__tab { flex: 0 0 auto; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-campaigns .ihsan-camp__card { animation: none; opacity: 1; transform: none; }\n #ihsan-campaigns * { transition: none !important; }\n}\n<\/style>\n\n<script>\n(function () {\n\n \/* =================================================================\n CONFIG\n ================================================================= *\/\n\n var SITE_ORIGIN = \"https:\/\/ihsaanfoundation.org\";\n var WP_BASE_PRETTY = SITE_ORIGIN + \"\/wp-json\/wp\/v2\";\n var WP_BASE_PLAIN = SITE_ORIGIN + \"\/?rest_route=\/wp\/v2\";\n var WP_BASE = WP_BASE_PRETTY;\n\n var CHILD_CATEGORY_IDS = [8, 9, 10, 11, 12, 13, 14, 15];\n\n var CATEGORY_MAP = [\n { label: \"All\", id: CHILD_CATEGORY_IDS.join(\",\") },\n { label: \"Qurban Project\", id: \"8\" },\n { label: \"Ramadan Iftar\", id: \"9\" },\n { label: \"Food Aid & Distribution\", id: \"10\" },\n { label: \"Cataract Treatment & Surgery\", id: \"11\" },\n { label: \"Water Well Construction\", id: \"12\" },\n { label: \"Milk Goat Distribution\", id: \"13\" },\n { label: \"Orphan Sponsorship\", id: \"14\" },\n { label: \"Stationary\", id: \"15\" }\n ];\n\n \/*\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * CATEGORY COVER IMAGES\n * One dedicated cover image per category.\n * To change any image, simply replace the full URL value.\n * You can use Unsplash, your own WordPress media, or any CDN.\n * Recommended size: 800\u00d7400 px.\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n *\/\n var CATEGORY_COVERS = {};\n\n \/* \u2500\u2500 ALL PROJECTS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[CHILD_CATEGORY_IDS.join(\",\")] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\";\n\n \/* \u2500\u2500 QURBAN PROJECT (id: 8) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"8\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\";\n\n \/* \u2500\u2500 RAMADAN IFTAR (id: 9) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"9\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-18.jpeg\";\n\n \/* \u2500\u2500 FOOD AID & DISTRIBUTION (id: 10) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"10\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Food-Aid-7-scaled.jpg\";\n\n \/* \u2500\u2500 CATARACT TREATMENT & SURGERY (id: 11) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"11\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Cataract-Treatment-and-Surgery-2-scaled.jpg\";\n\n \/* \u2500\u2500 WATER WELL CONSTRUCTION (id: 12) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"12\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/WATER-WELL-15-scaled.jpg\";\n\n \/* \u2500\u2500 MILK GOAT DISTRIBUTION (id: 13) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"13\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-4.jpeg\";\n\n \/* \u2500\u2500 ORPHAN SPONSORSHIP (id: 14) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"14\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Orphan-Project-7-1-scaled.jpg\";\n\n \/* \u2500\u2500 STATIONARY (id: 15) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"15\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/KIRTASIYE-DAGITIMI-18-scaled.jpg\";\n\n \/* Custom field key names (ACF or registered meta) *\/\n var FIELD_RAISED = \"raised_amount\";\n var FIELD_GOAL = \"goal_amount\";\n var FIELD_LOCATION = \"location\";\n\n var PER_PAGE = 6;\n\n \/* Auto-detect pretty vs plain permalink REST endpoint *\/\n var endpointReady = fetch(WP_BASE_PRETTY + \"\/posts?per_page=1\")\n .then(function (res) {\n if (res.ok) { WP_BASE = WP_BASE_PRETTY; return; }\n throw new Error(\"pretty endpoint returned \" + res.status);\n })\n .catch(function () { WP_BASE = WP_BASE_PLAIN; });\n\n \/* =================================================================\n STATE\n ================================================================= *\/\n\n var state = {\n activeCategory: CATEGORY_MAP[0].id,\n search: \"\",\n page: 1,\n loading: false,\n items: []\n };\n\n var grid = document.getElementById(\"ihsanCampGrid\");\n var tabsWrap = document.getElementById(\"ihsanCampTabs\");\n var statusBox = document.getElementById(\"ihsanCampStatus\");\n var searchBox = document.getElementById(\"ihsanCampSearch\");\n var moreWrap = document.getElementById(\"ihsanCampMoreWrap\");\n var moreBtn = document.getElementById(\"ihsanCampMoreBtn\");\n\n \/* =================================================================\n HELPERS\n ================================================================= *\/\n\n function stripHtml(html) {\n var tmp = document.createElement(\"div\");\n tmp.innerHTML = html || \"\";\n return (tmp.textContent || tmp.innerText || \"\").trim();\n }\n\n function truncate(text, max) {\n if (text.length <= max) return text;\n return text.slice(0, max).replace(\/\\s+\\S*$\/, \"\") + \"\u2026\";\n }\n\n function getCategoryLabel(post) {\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) return terms[0].name;\n } catch (e) {}\n return \"Project\";\n }\n\n function getPostFeaturedImage(post) {\n try { return post._embedded[\"wp:featuredmedia\"][0].source_url; }\n catch (e) { return \"\"; }\n }\n\n function getCustomField(post, key) {\n if (post.acf && post.acf[key] !== undefined && post.acf[key] !== \"\") return post.acf[key];\n if (post.meta && post.meta[key] !== undefined && post.meta[key] !== \"\") return post.meta[key];\n return null;\n }\n\n function formatMoney(n) {\n n = Number(n);\n if (isNaN(n)) return null;\n return \"$\" + n.toLocaleString(\"en-US\");\n }\n\n \/*\n * getCoverForPost\n * Always uses CATEGORY_COVERS \u2014 ignores the WordPress featured image\n * because posts were inheriting the wrong Qurban image and overriding\n * the correct per-category cover for Stationary and Ramadan Iftar.\n *\n * Priority:\n * 1. CATEGORY_COVERS entry matching the post's own sub-category id\n * 2. CATEGORY_COVERS entry for the currently active tab\n *\/\n function getCoverForPost(post) {\n var catId = \"\";\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) catId = String(terms[0].id);\n } catch (e) {}\n\n if (catId && CATEGORY_COVERS[catId]) return CATEGORY_COVERS[catId];\n return CATEGORY_COVERS[state.activeCategory] || CATEGORY_COVERS[CATEGORY_MAP[0].id];\n }\n\n \/* =================================================================\n RENDER TABS\n ================================================================= *\/\n\n function renderTabs() {\n tabsWrap.innerHTML = \"\";\n CATEGORY_MAP.forEach(function (cat) {\n var btn = document.createElement(\"button\");\n btn.className = \"ihsan-camp__tab\" + (cat.id === state.activeCategory ? \" is-active\" : \"\");\n btn.textContent = cat.label;\n btn.addEventListener(\"click\", function () {\n if (state.activeCategory === cat.id) return;\n state.activeCategory = cat.id;\n state.page = 1;\n state.items = [];\n renderTabs();\n fetchPosts(true);\n });\n tabsWrap.appendChild(btn);\n });\n }\n\n \/* =================================================================\n SKELETON PLACEHOLDERS\n ================================================================= *\/\n\n function renderSkeletons(count) {\n var html = \"\";\n for (var i = 0; i < count; i++) {\n html +=\n '<div class=\"ihsan-camp__card ihsan-camp__skeleton\">' +\n '<div class=\"ihsan-camp__media\"><\/div>' +\n '<div class=\"ihsan-camp__body\">' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:70%;height:18px;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:40%;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:90%;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:60%;\"><\/div>' +\n '<\/div>' +\n '<\/div>';\n }\n grid.innerHTML = html;\n }\n\n \/* =================================================================\n RENDER CARDS\n ================================================================= *\/\n\n function renderCards(posts, append) {\n if (!append) grid.innerHTML = \"\";\n\n if (!posts.length && !append) {\n grid.innerHTML = '<p style=\"grid-column:1\/-1;text-align:center;color:#5b6b62;padding:40px 0;\">No projects found. Try a different category or search term.<\/p>';\n return;\n }\n\n posts.forEach(function (post, i) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 110);\n var cover = getCoverForPost(post);\n var catLabel = getCategoryLabel(post);\n var location = getCustomField(post, FIELD_LOCATION);\n var raised = getCustomField(post, FIELD_RAISED);\n var goal = getCustomField(post, FIELD_GOAL);\n\n var hasProgress = raised !== null && goal !== null && Number(goal) > 0;\n var pct = hasProgress ? Math.min(100, Math.round((Number(raised) \/ Number(goal)) * 100)) : 0;\n\n var card = document.createElement(\"div\");\n card.className = \"ihsan-camp__card\";\n card.style.animationDelay = (i * 0.06) + \"s\";\n\n var progressHtml = hasProgress\n ? '<div class=\"ihsan-camp__progress-track\">' +\n '<div class=\"ihsan-camp__progress-fill\" data-pct=\"' + pct + '\"><\/div>' +\n '<\/div>' +\n '<div class=\"ihsan-camp__amount-row\">' +\n '<span class=\"raised\">' + (formatMoney(raised) || raised) + '<\/span>' +\n '<span class=\"goal\">' + (formatMoney(goal) || goal) + '<\/span>' +\n '<\/div>'\n : \"\";\n\n var fundedPill = hasProgress ? '<span class=\"ihsan-camp__funded-pill\">' + pct + '% funded<\/span>' : \"\";\n var locationHtml = location ? '<span class=\"ihsan-camp__location\">\ud83d\udccd ' + location + '<\/span>' : \"\";\n\n card.innerHTML =\n '<div class=\"ihsan-camp__media\">' +\n '<img decoding=\"async\" src=\"' + cover + '\" alt=\"' + title.replace(\/\"\/g, \"\") + '\" loading=\"lazy\" \/>' +\n '<div class=\"ihsan-camp__media-overlay\"><\/div>' +\n '<span class=\"ihsan-camp__cat-badge\">' + catLabel + '<\/span>' +\n '<\/div>' +\n '<div class=\"ihsan-camp__body\">' +\n '<h3 class=\"ihsan-camp__title\">' + title + '<\/h3>' +\n '<div class=\"ihsan-camp__meta-row\">' + locationHtml + fundedPill + '<\/div>' +\n '<p class=\"ihsan-camp__excerpt\">' + excerpt + '<\/p>' +\n progressHtml +\n '<a class=\"ihsan-camp__btn\" href=\"' + post.link + '\">View Details<\/a>' +\n '<\/div>';\n\n grid.appendChild(card);\n });\n\n \/* Animate progress bars after DOM insertion *\/\n requestAnimationFrame(function () {\n grid.querySelectorAll(\".ihsan-camp__progress-fill\").forEach(function (el) {\n el.style.width = el.getAttribute(\"data-pct\") + \"%\";\n });\n });\n }\n\n \/* =================================================================\n FETCH POSTS FROM WORDPRESS\n ================================================================= *\/\n\n function fetchPosts(reset) {\n if (state.loading) return;\n state.loading = true;\n\n if (reset) renderSkeletons(PER_PAGE);\n statusBox.textContent = \"Loading campaigns\u2026\";\n statusBox.classList.remove(\"is-error\");\n\n endpointReady.then(function () {\n var url = WP_BASE + \"\/posts?_embed&per_page=\" + PER_PAGE + \"&page=\" + state.page +\n \"&categories=\" + state.activeCategory;\n\n if (state.search.trim()) {\n url += \"&search=\" + encodeURIComponent(state.search.trim());\n }\n\n return fetch(url).then(function (res) {\n if (!res.ok) {\n return res.text().then(function (body) {\n var detail = \"\";\n try { detail = JSON.parse(body).message || \"\"; } catch (e) { detail = body.slice(0, 120); }\n throw new Error(\"HTTP \" + res.status + (detail ? \" \u2014 \" + detail : \"\"));\n });\n }\n var totalPages = res.headers.get(\"X-WP-TotalPages\");\n return res.json().then(function (data) {\n return { data: data, totalPages: Number(totalPages || 1) };\n });\n });\n })\n .then(function (result) {\n statusBox.textContent = \"\";\n if (state.page === 1) {\n state.items = result.data;\n } else {\n state.items = state.items.concat(result.data);\n }\n renderCards(result.data, state.page > 1);\n moreWrap.style.display = (state.page < result.totalPages) ? \"block\" : \"none\";\n })\n .catch(function (err) {\n var msg = (err && err.message) ? err.message : \"Unknown error\";\n statusBox.textContent = \"Couldn't load campaigns: \" + msg;\n statusBox.classList.add(\"is-error\");\n if (state.page === 1) grid.innerHTML = \"\";\n moreWrap.style.display = \"none\";\n console.error(\"Ihsan campaigns fetch error:\", err, \"| URL base used:\", WP_BASE);\n })\n .finally(function () { state.loading = false; });\n }\n\n \/* =================================================================\n SEARCH (debounced 400ms)\n ================================================================= *\/\n\n var searchTimer = null;\n searchBox.addEventListener(\"input\", function () {\n clearTimeout(searchTimer);\n searchTimer = setTimeout(function () {\n state.search = searchBox.value;\n state.page = 1;\n fetchPosts(true);\n }, 400);\n });\n\n \/* =================================================================\n LOAD MORE\n ================================================================= *\/\n\n moreBtn.addEventListener(\"click\", function () {\n state.page += 1;\n fetchPosts(false);\n });\n\n \/* =================================================================\n INIT\n ================================================================= *\/\n\n renderTabs();\n fetchPosts(true);\n\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d3336a7 e-con-full e-flex e-con e-parent\" data-id=\"d3336a7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-32f9164 elementor-widget elementor-widget-html\" data-id=\"32f9164\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\">\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n <title>AIAF About Section<\/title>\r\n <style>\r\n \/* Reset and Base Styles *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n \r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n line-height: 1.6;\r\n color: #333;\r\n overflow-x: hidden;\r\n }\r\n \r\n \/* Full Width Section *\/\r\n .aiaf-about-section {\r\n width: 100vw;\r\n margin-left: calc(-50vw + 50%);\r\n background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);\r\n padding: 80px 0;\r\n overflow: hidden;\r\n }\r\n \r\n .aiaf-container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 0 20px;\r\n }\r\n \r\n \/* Two Column Layout *\/\r\n .aiaf-columns {\r\n display: flex;\r\n align-items: center;\r\n gap: 60px;\r\n }\r\n \r\n .aiaf-content {\r\n flex: 1;\r\n padding-right: 20px;\r\n }\r\n \r\n .aiaf-image {\r\n flex: 1;\r\n position: relative;\r\n height: 500px;\r\n overflow: hidden;\r\n }\r\n \r\n \/* Content Styling *\/\r\n .aiaf-subtitle {\r\n color: #0087f0;\r\n font-size: 18px;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 15px;\r\n display: block;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 42px;\r\n font-weight: 700;\r\n color: #222;\r\n margin-bottom: 25px;\r\n line-height: 1.2;\r\n }\r\n \r\n .aiaf-title span {\r\n color: #00a550;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 18px;\r\n color: #555;\r\n margin-bottom: 25px;\r\n line-height: 1.8;\r\n text-align: justify;\r\n text-justify: inter-word;\r\n }\r\n \r\n \/* Button Styling *\/\r\n .aiaf-button {\r\n display: inline-block;\r\n padding: 15px 35px;\r\n background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n color: white;\r\n text-decoration: none;\r\n border-radius: 50px;\r\n font-weight: 600;\r\n font-size: 16px;\r\n transition: all 0.3s ease;\r\n box-shadow: 0 4px 15px rgba(0, 135, 240, 0.3);\r\n position: relative;\r\n overflow: hidden;\r\n z-index: 1;\r\n }\r\n \r\n .aiaf-button:before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(135deg, #0087f0 0%, #00a550 100%);\r\n z-index: -1;\r\n opacity: 0;\r\n transition: opacity 0.3s ease;\r\n }\r\n \r\n .aiaf-button:hover {\r\n transform: translateY(-3px);\r\n box-shadow: 0 6px 20px rgba(0, 135, 240, 0.4);\r\n }\r\n \r\n .aiaf-button:hover:before {\r\n opacity: 1;\r\n }\r\n \r\n \/* Image Mask Styling *\/\r\n .image-mask {\r\n width: 100%;\r\n height: 100%;\r\n position: relative;\r\n border-radius: 20px;\r\n overflow: hidden;\r\n background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n \r\n .mask-shape {\r\n position: absolute;\r\n border-radius: 50%;\r\n background: rgba(255, 255, 255, 0.1);\r\n animation: float 6s ease-in-out infinite;\r\n }\r\n \r\n .shape-1 {\r\n width: 120px;\r\n height: 120px;\r\n top: 10%;\r\n left: 10%;\r\n animation-delay: 0s;\r\n }\r\n \r\n .shape-2 {\r\n width: 80px;\r\n height: 80px;\r\n top: 60%;\r\n left: 70%;\r\n animation-delay: 2s;\r\n }\r\n \r\n .shape-3 {\r\n width: 150px;\r\n height: 150px;\r\n top: 30%;\r\n left: 50%;\r\n animation-delay: 4s;\r\n }\r\n \r\n .shape-4 {\r\n width: 100px;\r\n height: 100px;\r\n top: 70%;\r\n left: 20%;\r\n animation-delay: 1s;\r\n }\r\n \r\n .image-container {\r\n position: relative;\r\n width: 85%;\r\n height: 85%;\r\n border-radius: 15px;\r\n overflow: hidden;\r\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);\r\n z-index: 2;\r\n }\r\n \r\n .about-image {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n object-position: center;\r\n transition: transform 0.5s ease;\r\n }\r\n \r\n .image-container:hover .about-image {\r\n transform: scale(1.05);\r\n }\r\n \r\n \/* Custom Shape Clip Path *\/\r\n .shape-clip {\r\n clip-path: polygon(0 0, 100% 0, 100% 85%, 85% 100%, 0 100%);\r\n }\r\n \r\n \/* Alternative Shape Options (uncomment to use) *\/\r\n \r\n \/* Rounded Diamond Shape *\/\r\n \/* .shape-clip {\r\n clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);\r\n border-radius: 20px;\r\n } *\/\r\n \r\n \/* Organic Blob Shape *\/\r\n \/* .shape-clip {\r\n clip-path: path(\"M0.5,0.5 C0.5,0.5,0.8,0.1,1,0.5 C1.2,0.9,0.9,1,0.5,1 C0.1,1,-0.1,0.9,0,0.5 C0.1,0.1,0.5,0.5,0.5,0.5 Z\");\r\n } *\/\r\n \r\n \/* Animation *\/\r\n @keyframes float {\r\n 0%, 100% {\r\n transform: translateY(0) rotate(0deg);\r\n }\r\n 50% {\r\n transform: translateY(-20px) rotate(10deg);\r\n }\r\n }\r\n \r\n \/* Responsive Styles *\/\r\n @media (max-width: 1024px) {\r\n .aiaf-columns {\r\n gap: 40px;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 36px;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 17px;\r\n }\r\n \r\n .aiaf-image {\r\n height: 450px;\r\n }\r\n }\r\n \r\n @media (max-width: 768px) {\r\n .aiaf-about-section {\r\n padding: 60px 0;\r\n }\r\n \r\n .aiaf-columns {\r\n flex-direction: column;\r\n gap: 50px;\r\n }\r\n \r\n .aiaf-content {\r\n padding-right: 0;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 32px;\r\n text-align: center;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 16px;\r\n text-align: justify;\r\n }\r\n \r\n .aiaf-image {\r\n height: 400px;\r\n width: 100%;\r\n }\r\n \r\n .aiaf-button {\r\n display: block;\r\n text-align: center;\r\n margin: 0 auto;\r\n width: fit-content;\r\n }\r\n }\r\n \r\n @media (max-width: 480px) {\r\n .aiaf-about-section {\r\n padding: 40px 0;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 28px;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 15px;\r\n }\r\n \r\n .aiaf-button {\r\n padding: 12px 30px;\r\n font-size: 15px;\r\n }\r\n \r\n .aiaf-image {\r\n height: 300px;\r\n }\r\n \r\n .shape-1, .shape-2, .shape-3, .shape-4 {\r\n display: none;\r\n }\r\n \r\n .image-container {\r\n width: 90%;\r\n height: 90%;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <section class=\"aiaf-about-section\">\r\n <div class=\"aiaf-container\">\r\n <div class=\"aiaf-columns\">\r\n \r\n <div class=\"aiaf-content\">\r\n <span class=\"aiaf-subtitle\">About Our Foundation<\/span>\r\n <h2 class=\"aiaf-title\">Transforming Lives Through <span>Compassionate Action<\/span><\/h2>\r\n <p class=\"aiaf-description\">\r\n Ihsan Foundation is an independent, non-profit organization founded by Somali professionals, volunteers, and scholars to support vulnerable communities through Islamic values of mercy, justice, and solidarity. Our foundation works tirelessly to address the most pressing challenges facing communities across Africa\r\n <\/p>\r\n <p class=\"aiaf-description\">\r\n Our mission is to alleviate suffering, empower communities, and foster sustainable development through impactful projects in education, healthcare, emergency relief, and economic empowerment. We believe in creating lasting change through collaboration, compassion, and community-driven solutions.\r\n <\/p>\r\n <a href=\"#\" class=\"aiaf-button\">Learn More About Us<\/a>\r\n <\/div>\r\n \r\n \r\n <div class=\"aiaf-image\">\r\n <div class=\"image-mask\">\r\n <div class=\"mask-shape shape-1\"><\/div>\r\n <div class=\"mask-shape shape-2\"><\/div>\r\n <div class=\"mask-shape shape-3\"><\/div>\r\n <div class=\"mask-shape shape-4\"><\/div>\r\n <div class=\"image-container shape-clip\">\r\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Orphan-Project-2-1-scaled.jpg\" alt=\"AIAF Community Work\" class=\"about-image\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3887ce0 e-flex e-con-boxed e-con e-parent\" data-id=\"3887ce0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-867393f elementor-widget elementor-widget-html\" data-id=\"867393f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-news\">\n\n <div class=\"ihsan-news__header\">\n <h2 class=\"ihsan-news__headline\">Latest News<\/h2>\n <\/div>\n\n <div class=\"ihsan-news__inner\" id=\"ihsanNewsInner\">\n\n \n <div class=\"ihsan-news__hero ihsan-news__skel-hero\">\n <div class=\"ihsan-news__skel-img\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:40%;height:13px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:22px;margin-top:10px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:80%;height:22px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:70%;height:14px;margin-top:10px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:70%;height:14px;\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"ihsan-news__sidebar\">\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.05s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.1s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.15s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.2s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n\n \n <div class=\"ihsan-news__grid\" id=\"ihsanNewsGrid\"><\/div>\n\n <div class=\"ihsan-news__load-more-wrap\" id=\"ihsanLoadMoreWrap\" style=\"display:none;\">\n <button type=\"button\" class=\"ihsan-news__load-more\" id=\"ihsanLoadMoreBtn\">\n <span class=\"ihsan-news__load-more-text\">Load More<\/span>\n <span class=\"ihsan-news__load-more-spinner\" aria-hidden=\"true\"><\/span>\n <\/button>\n <\/div>\n\n <div class=\"ihsan-news__error\" id=\"ihsanNewsError\" style=\"display:none;\"><\/div>\n\n<\/section>\n\n<style>\n#ihsan-news {\n --n-green: #1f7a4d;\n --n-green-dark: #155c39;\n --n-green-mid: #2a8f5a;\n --n-text-dark: #16241c;\n --n-text-body: #5b6b62;\n --n-text-muted: #8a9e93;\n --n-bg: #eef3ee;\n --n-white: #ffffff;\n --n-radius: 16px;\n --n-radius-sm: 10px;\n\n background: var(--n-bg);\n padding: 60px 24px 70px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-news * { box-sizing: border-box; }\n\n\/* \u2500\u2500 HEADLINE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__header {\n max-width: 1240px;\n margin: 0 auto 32px;\n}\n\n.ihsan-news__headline {\n font-size: clamp(26px, 3.2vw, 36px);\n font-weight: 800;\n color: var(--n-text-dark);\n margin: 0;\n line-height: 1.15;\n padding-left: 20px;\n border-left: 5px solid var(--n-green-dark);\n}\n\n\/* \u2500\u2500 INNER LAYOUT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__inner {\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: 1fr 380px;\n gap: 20px;\n align-items: start;\n}\n\n\/* \u2500\u2500 HERO CARD (left, large) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__hero {\n background: var(--n-white);\n border-radius: var(--n-radius);\n overflow: hidden;\n box-shadow: 0 8px 28px -8px rgba(22,36,28,.13);\n display: flex;\n flex-direction: column;\n text-decoration: none;\n transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;\n opacity: 0;\n animation: ihsanNewsFade .55s ease forwards;\n}\n\n.ihsan-news__hero:hover {\n transform: translateY(-5px);\n box-shadow: 0 20px 40px -12px rgba(22,36,28,.2);\n}\n\n\/* Hero image *\/\n.ihsan-news__hero-img {\n position: relative;\n width: 100%;\n height: 340px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n flex-shrink: 0;\n}\n\n.ihsan-news__hero-img img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .6s ease;\n}\n\n.ihsan-news__hero:hover .ihsan-news__hero-img img {\n transform: scale(1.05);\n}\n\n\/* Hero body *\/\n.ihsan-news__hero-body {\n padding: 28px 30px 32px;\n}\n\n.ihsan-news__eyebrow {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 14px;\n}\n\n.ihsan-news__eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 6px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__hero-title {\n font-size: clamp(20px, 2.2vw, 26px);\n font-weight: 800;\n color: var(--n-text-dark);\n line-height: 1.25;\n margin: 0 0 14px;\n}\n\n.ihsan-news__hero-excerpt {\n font-size: 15px;\n line-height: 1.65;\n color: var(--n-text-body);\n margin: 0 0 24px;\n}\n\n.ihsan-news__hero-actions {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.ihsan-news__btn-primary {\n display: inline-flex;\n align-items: center;\n padding: 11px 24px;\n border-radius: 50px;\n background: var(--n-green-dark);\n color: var(--n-white);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: background .25s, transform .25s, box-shadow .25s;\n}\n\n.ihsan-news__btn-primary:hover {\n background: var(--n-green-mid);\n transform: translateY(-2px);\n box-shadow: 0 10px 20px -6px rgba(21,92,57,.4);\n}\n\n.ihsan-news__btn-ghost {\n display: inline-flex;\n align-items: center;\n padding: 11px 22px;\n border-radius: 50px;\n background: transparent;\n border: 1.5px solid #c8d9cc;\n color: var(--n-text-dark);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: border-color .25s, background .25s;\n}\n\n.ihsan-news__btn-ghost:hover {\n border-color: var(--n-green-dark);\n background: rgba(21,92,57,.05);\n}\n\n\/* \u2500\u2500 SIDEBAR (right column) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__sidebar {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n\n\/* \u2500\u2500 SIDEBAR CARD \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__side-card {\n background: var(--n-white);\n border-radius: var(--n-radius-sm);\n overflow: hidden;\n box-shadow: 0 4px 16px -6px rgba(22,36,28,.1);\n display: flex;\n gap: 0;\n text-decoration: none;\n transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;\n opacity: 0;\n animation: ihsanNewsFade .55s ease forwards;\n}\n\n.ihsan-news__side-card:hover {\n transform: translateY(-3px);\n box-shadow: 0 12px 26px -8px rgba(22,36,28,.18);\n}\n\n\/* Sidebar thumbnail *\/\n.ihsan-news__side-thumb {\n width: 110px;\n min-width: 110px;\n height: 110px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n flex-shrink: 0;\n}\n\n.ihsan-news__side-thumb img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-news__side-card:hover .ihsan-news__side-thumb img {\n transform: scale(1.08);\n}\n\n\/* Sidebar card body *\/\n.ihsan-news__side-body {\n padding: 14px 16px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n min-width: 0;\n}\n\n.ihsan-news__side-eyebrow {\n font-size: 10.5px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 6px;\n display: flex;\n gap: 5px;\n align-items: center;\n}\n\n.ihsan-news__side-eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 5px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__side-title {\n font-size: 14.5px;\n font-weight: 700;\n color: var(--n-text-dark);\n line-height: 1.35;\n margin: 0 0 6px;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.ihsan-news__side-excerpt {\n font-size: 12.5px;\n line-height: 1.55;\n color: var(--n-text-body);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\/* \u2500\u2500 LOAD-MORE GRID (extra posts) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__grid {\n max-width: 1240px;\n margin: 24px auto 0;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 20px;\n}\n\n.ihsan-news__grid-card {\n background: var(--n-white);\n border-radius: var(--n-radius-sm);\n overflow: hidden;\n box-shadow: 0 4px 16px -6px rgba(22,36,28,.1);\n display: flex;\n flex-direction: column;\n text-decoration: none;\n transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;\n opacity: 0;\n animation: ihsanNewsFade .5s ease forwards;\n}\n\n.ihsan-news__grid-card:hover {\n transform: translateY(-4px);\n box-shadow: 0 14px 28px -8px rgba(22,36,28,.18);\n}\n\n.ihsan-news__grid-thumb {\n width: 100%;\n height: 180px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n}\n\n.ihsan-news__grid-thumb img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-news__grid-card:hover .ihsan-news__grid-thumb img {\n transform: scale(1.06);\n}\n\n.ihsan-news__grid-body {\n padding: 18px 20px 20px;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n\n.ihsan-news__grid-eyebrow {\n font-size: 10.5px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n}\n\n.ihsan-news__grid-eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 5px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__grid-title {\n font-size: 16px;\n font-weight: 700;\n color: var(--n-text-dark);\n line-height: 1.35;\n margin: 0 0 8px;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.ihsan-news__grid-excerpt {\n font-size: 13px;\n line-height: 1.6;\n color: var(--n-text-body);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\/* \u2500\u2500 LOAD MORE BUTTON \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__load-more-wrap {\n display: flex;\n justify-content: center;\n margin-top: 36px;\n}\n\n.ihsan-news__load-more {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 13px 32px;\n border-radius: 50px;\n background: var(--n-white);\n border: 1.5px solid var(--n-green-dark);\n color: var(--n-green-dark);\n font-weight: 800;\n font-size: 14px;\n font-family: inherit;\n cursor: pointer;\n transition: background .25s, color .25s, transform .25s, box-shadow .25s;\n}\n\n.ihsan-news__load-more:hover {\n background: var(--n-green-dark);\n color: var(--n-white);\n transform: translateY(-2px);\n box-shadow: 0 10px 20px -6px rgba(21,92,57,.3);\n}\n\n.ihsan-news__load-more:disabled {\n cursor: default;\n opacity: .75;\n transform: none;\n box-shadow: none;\n}\n\n.ihsan-news__load-more-spinner {\n display: none;\n width: 14px;\n height: 14px;\n border: 2px solid currentColor;\n border-top-color: transparent;\n border-radius: 50%;\n animation: ihsanNewsSpin .7s linear infinite;\n}\n\n.ihsan-news__load-more.is-loading .ihsan-news__load-more-spinner {\n display: inline-block;\n}\n\n\/* \u2500\u2500 SKELETON \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__skel-img {\n width: 100%;\n height: 340px;\n background: #dde5de;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-body {\n padding: 28px 30px;\n flex: 1;\n}\n\n.ihsan-news__skel-thumb {\n width: 110px;\n min-width: 110px;\n height: 110px;\n background: #dde5de;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-line {\n height: 13px;\n border-radius: 6px;\n background: #dde5de;\n margin-bottom: 10px;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-hero { pointer-events: none; }\n.ihsan-news__skel-side { pointer-events: none; }\n\n\/* \u2500\u2500 ERROR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__error {\n max-width: 1240px;\n margin: 20px auto 0;\n padding: 16px 20px;\n background: #fdf2f2;\n border-radius: var(--n-radius-sm);\n color: #b3261e;\n font-size: 14px;\n}\n\n\/* \u2500\u2500 ANIMATIONS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@keyframes ihsanNewsFade {\n from { opacity: 0; transform: translateY(14px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n@keyframes ihsanNewsPulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: .45; }\n}\n\n@keyframes ihsanNewsSpin {\n to { transform: rotate(360deg); }\n}\n\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@media (max-width: 900px) {\n .ihsan-news__inner {\n grid-template-columns: 1fr;\n }\n .ihsan-news__sidebar {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .ihsan-news__side-card {\n flex: 1 1 calc(50% - 7px);\n min-width: 240px;\n }\n .ihsan-news__grid {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n\n@media (max-width: 580px) {\n #ihsan-news { padding: 40px 16px 56px; }\n .ihsan-news__hero-img { height: 220px; }\n .ihsan-news__hero-body { padding: 20px 20px 24px; }\n .ihsan-news__sidebar { flex-direction: column; }\n .ihsan-news__side-card { flex: 1 1 100%; }\n .ihsan-news__grid { grid-template-columns: 1fr; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-news * { animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; }\n}\n<\/style>\n\n<script>\n(function () {\n\n \/* =================================================================\n CONFIG \u2014 edit these to match your site\n ================================================================= *\/\n\n var SITE_ORIGIN = \"https:\/\/ihsaanfoundation.org\";\n var WP_BASE_PRETTY = SITE_ORIGIN + \"\/wp-json\/wp\/v2\";\n var WP_BASE_PLAIN = SITE_ORIGIN + \"\/?rest_route=\/wp\/v2\";\n var WP_BASE = WP_BASE_PRETTY;\n\n \/* Posts shown on first load: 1 hero + 4 sidebar = 5 *\/\n var INITIAL_COUNT = 5;\n \/* Posts fetched per \"Load More\" click (fills a 3-col grid row) *\/\n var LOAD_MORE_COUNT = 3;\n\n \/* =================================================================\n AUTO-DETECT ENDPOINT\n ================================================================= *\/\n\n var endpointReady = fetch(WP_BASE_PRETTY + \"\/posts?per_page=1\")\n .then(function (res) {\n if (res.ok) { WP_BASE = WP_BASE_PRETTY; }\n else { throw 0; }\n })\n .catch(function () { WP_BASE = WP_BASE_PLAIN; });\n\n \/* =================================================================\n HELPERS\n ================================================================= *\/\n\n function stripHtml(html) {\n var d = document.createElement(\"div\");\n d.innerHTML = html || \"\";\n return (d.textContent || d.innerText || \"\").trim();\n }\n\n function truncate(text, max) {\n if (text.length <= max) return text;\n return text.slice(0, max).replace(\/\\s+\\S*$\/, \"\") + \"\u2026\";\n }\n\n \/*\n * getFeaturedImage\n * Tries every known location WordPress puts the featured image URL.\n *\/\n function getFeaturedImage(post) {\n try {\n var media = post._embedded[\"wp:featuredmedia\"][0];\n if (media && media.source_url) return media.source_url;\n var sizes = media.media_details && media.media_details.sizes;\n if (sizes) {\n return (sizes.full && sizes.full.source_url) ||\n (sizes.large && sizes.large.source_url) ||\n (sizes.medium && sizes.medium.source_url) || \"\";\n }\n } catch (e) {}\n if (post.featured_media_url) return post.featured_media_url;\n if (post.jetpack_featured_media_url) return post.jetpack_featured_media_url;\n return \"\";\n }\n\n \/* Returns array like [\"CATEGORY\", \"SUBCATEGORY\"] from embedded terms *\/\n function getEyebrow(post) {\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) {\n return terms.slice(0, 2).map(function (t) { return t.name.toUpperCase(); });\n }\n } catch (e) {}\n return [\"UPDATE\"];\n }\n\n \/* =================================================================\n BUILD HERO CARD (latest post)\n ================================================================= *\/\n\n function buildHero(post) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 160);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var hero = document.createElement(\"a\");\n hero.href = link;\n hero.className = \"ihsan-news__hero\";\n hero.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n hero.innerHTML =\n '<div class=\"ihsan-news__hero-img\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"' + title.replace(\/\"\/g, \"\") + '\" loading=\"eager\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__hero-body\">' +\n '<div class=\"ihsan-news__eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<h2 class=\"ihsan-news__hero-title\">' + title + '<\/h2>' +\n '<p class=\"ihsan-news__hero-excerpt\">' + excerpt + '<\/p>' +\n '<div class=\"ihsan-news__hero-actions\">' +\n '<a class=\"ihsan-news__btn-primary\" href=\"' + link + '\">Read Full Update<\/a>' +\n '<a class=\"ihsan-news__btn-ghost\" href=\"' + link + '\">Share<\/a>' +\n '<\/div>' +\n '<\/div>';\n\n return hero;\n }\n\n \/* =================================================================\n BUILD SIDEBAR CARD\n ================================================================= *\/\n\n function buildSideCard(post, delay) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 90);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var card = document.createElement(\"a\");\n card.href = link;\n card.className = \"ihsan-news__side-card\";\n card.style.animationDelay = delay + \"s\";\n card.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n card.innerHTML =\n '<div class=\"ihsan-news__side-thumb\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"\" loading=\"lazy\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__side-body\">' +\n '<div class=\"ihsan-news__side-eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<p class=\"ihsan-news__side-title\">' + title + '<\/p>' +\n '<p class=\"ihsan-news__side-excerpt\">' + excerpt + '<\/p>' +\n '<\/div>';\n\n return card;\n }\n\n \/* =================================================================\n BUILD \"LOAD MORE\" GRID CARD\n ================================================================= *\/\n\n function buildGridCard(post, delay) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 110);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var card = document.createElement(\"a\");\n card.href = link;\n card.className = \"ihsan-news__grid-card\";\n card.style.animationDelay = delay + \"s\";\n card.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n card.innerHTML =\n '<div class=\"ihsan-news__grid-thumb\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"\" loading=\"lazy\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__grid-body\">' +\n '<div class=\"ihsan-news__grid-eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<p class=\"ihsan-news__grid-title\">' + title + '<\/p>' +\n '<p class=\"ihsan-news__grid-excerpt\">' + excerpt + '<\/p>' +\n '<\/div>';\n\n return card;\n }\n\n \/* =================================================================\n DOM REFS\n ================================================================= *\/\n\n var inner = document.getElementById(\"ihsanNewsInner\");\n var gridEl = document.getElementById(\"ihsanNewsGrid\");\n var errorBox = document.getElementById(\"ihsanNewsError\");\n var loadMoreWrap = document.getElementById(\"ihsanLoadMoreWrap\");\n var loadMoreBtn = document.getElementById(\"ihsanLoadMoreBtn\");\n\n var loadedCount = 0;\n var totalPosts = null; \/* filled in from X-WP-Total header when available *\/\n var isLoading = false;\n\n function showError(message) {\n errorBox.style.display = \"block\";\n errorBox.textContent = message;\n }\n\n function readTotalHeader(res) {\n try {\n var totalHeader = res.headers.get(\"X-WP-Total\");\n if (totalHeader !== null && totalHeader !== \"\") {\n return parseInt(totalHeader, 10);\n }\n } catch (e) {}\n return null;\n }\n\n \/* =================================================================\n INITIAL FETCH & RENDER\n ================================================================= *\/\n\n endpointReady.then(function () {\n var url = WP_BASE + \"\/posts?_embed=wp:featuredmedia,wp:term&per_page=\" + INITIAL_COUNT + \"&orderby=date&order=desc\";\n\n return fetch(url).then(function (res) {\n if (!res.ok) throw new Error(\"HTTP \" + res.status);\n var headerTotal = readTotalHeader(res);\n if (headerTotal !== null) totalPosts = headerTotal;\n return res.json();\n });\n })\n .then(function (posts) {\n if (!posts || !posts.length) {\n inner.innerHTML = '<p style=\"color:#5b6b62;padding:20px 0;\">No posts found.<\/p>';\n return;\n }\n\n \/* Clear skeletons *\/\n inner.innerHTML = \"\";\n\n \/* Hero = first (latest) post *\/\n inner.appendChild(buildHero(posts[0]));\n\n \/* Sidebar = remaining posts from this batch *\/\n var sidebar = document.createElement(\"div\");\n sidebar.className = \"ihsan-news__sidebar\";\n\n posts.slice(1).forEach(function (post, i) {\n sidebar.appendChild(buildSideCard(post, 0.08 + i * 0.08));\n });\n\n inner.appendChild(sidebar);\n\n loadedCount = posts.length;\n\n var hasMore = (totalPosts !== null)\n ? loadedCount < totalPosts\n : posts.length === INITIAL_COUNT; \/* no total header: assume more if we got a full page *\/\n\n loadMoreWrap.style.display = hasMore ? \"flex\" : \"none\";\n })\n .catch(function (err) {\n inner.innerHTML = \"\";\n showError(\"Couldn't load latest posts: \" + (err && err.message ? err.message : \"Unknown error\"));\n console.error(\"Ihsan latest posts error:\", err, \"| WP_BASE:\", WP_BASE);\n });\n\n \/* =================================================================\n LOAD MORE\n ================================================================= *\/\n\n loadMoreBtn.addEventListener(\"click\", function () {\n if (isLoading) return;\n isLoading = true;\n loadMoreBtn.classList.add(\"is-loading\");\n loadMoreBtn.disabled = true;\n\n var url = WP_BASE + \"\/posts?_embed=wp:featuredmedia,wp:term&per_page=\" + LOAD_MORE_COUNT +\n \"&offset=\" + loadedCount + \"&orderby=date&order=desc\";\n\n fetch(url)\n .then(function (res) {\n if (!res.ok) throw new Error(\"HTTP \" + res.status);\n var headerTotal = readTotalHeader(res);\n if (headerTotal !== null) totalPosts = headerTotal;\n return res.json();\n })\n .then(function (posts) {\n posts.forEach(function (post, i) {\n gridEl.appendChild(buildGridCard(post, i * 0.06));\n });\n\n loadedCount += posts.length;\n\n var noMoreLeft = (totalPosts !== null)\n ? loadedCount >= totalPosts\n : posts.length < LOAD_MORE_COUNT; \/* fewer than requested = end of list *\/\n\n if (!posts.length || noMoreLeft) {\n loadMoreWrap.style.display = \"none\";\n }\n })\n .catch(function (err) {\n showError(\"Couldn't load more posts: \" + (err && err.message ? err.message : \"Unknown error\"));\n console.error(\"Ihsan load-more error:\", err);\n })\n .then(function () {\n isLoading = false;\n loadMoreBtn.classList.remove(\"is-loading\");\n loadMoreBtn.disabled = false;\n }, function () {\n isLoading = false;\n loadMoreBtn.classList.remove(\"is-loading\");\n loadMoreBtn.disabled = false;\n });\n });\n\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4669c1a e-flex e-con-boxed e-con e-parent\" data-id=\"4669c1a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-277ee74c elementor-widget elementor-widget-elementskit-heading\" data-id=\"277ee74c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elementskit-heading.default\">\n\t\t\t\t\t<div class=\"ekit-wid-con\" ><div class=\"ekit-heading elementskit-section-title-wraper center ekit_heading_tablet- ekit_heading_mobile-\"><h3 class=\"ekit-heading--title elementskit-section-title \">Our Team<\/h3><div class=\"ekit_heading_separetor_wraper ekit_heading_elementskit-border-divider ekit-dotted\"><div class=\"elementskit-border-divider ekit-dotted\"><\/div><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a312d77 elementor-widget elementor-widget-html\" data-id=\"a312d77\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-team\">\n\n <div class=\"ihsan-team__inner\">\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Mohamed-Abdullahi-Shoble-scaled.jpg\" alt=\"Mohamed Abdullahi Shoble\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Mohamed Abdullahi Shoble<\/h3>\n <p class=\"ihsan-team__role\">Chairman<\/p>\n <\/a>\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Mohamed-Ahmed-Mohamed-scaled.jpg\" alt=\"Mohamed Ahmed Mohamed\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Mohamed Ahmed Mohamed<\/h3>\n <p class=\"ihsan-team__role\">Vice Chairman<\/p>\n <\/a>\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Abdirahman-Ali-Elmi-scaled.jpg\" alt=\"Abdirahman Ali Elmi\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Abdirahman Ali Elmi<\/h3>\n <p class=\"ihsan-team__role\">Secretary<\/p>\n <\/a>\n\n <\/div>\n\n<\/section>\n\n<style>\n#ihsan-team {\n --n-green: #1f7a4d;\n --n-green-dark: #155c39;\n --n-green-mid: #2a8f5a;\n --n-text-dark: #16241c;\n --n-text-body: #5b6b62;\n --n-text-muted: #8a9e93;\n --n-bg: #ffffff;\n --n-white: #ffffff;\n\n background: var(--n-bg);\n padding: 64px 24px 70px;\n box-sizing: border-box;\n overflow-x: hidden;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-team * { box-sizing: border-box; }\n\n.ihsan-team__inner {\n max-width: 1100px;\n margin: 0 auto;\n display: flex;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: flex-start;\n gap: clamp(12px, 4vw, 36px);\n}\n\n.ihsan-team__card {\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n text-decoration: none;\n padding: 8px 0 0;\n border-radius: 18px;\n flex: 1 1 0;\n min-width: 0;\n max-width: 320px;\n transition: transform .3s cubic-bezier(.2,.8,.2,1);\n}\n\n.ihsan-team__card:hover {\n transform: translateY(-4px);\n}\n\n.ihsan-team__card:focus-visible {\n outline: 2px solid var(--n-green-dark);\n outline-offset: 4px;\n border-radius: 18px;\n}\n\n\/* \u2500\u2500 CIRCLE AVATAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-team__avatar {\n width: clamp(72px, 24vw, 190px);\n height: clamp(72px, 24vw, 190px);\n border-radius: 50%;\n overflow: hidden;\n margin: 0 auto clamp(10px, 2.5vw, 22px);\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n box-shadow: 0 0 0 4px var(--n-white), 0 10px 26px -8px rgba(22,36,28,.22);\n transition: box-shadow .3s ease;\n}\n\n.ihsan-team__card:hover .ihsan-team__avatar {\n box-shadow: 0 0 0 4px var(--n-white), 0 0 0 7px var(--n-green-mid), 0 16px 32px -10px rgba(22,36,28,.28);\n}\n\n.ihsan-team__avatar img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-team__card:hover .ihsan-team__avatar img {\n transform: scale(1.07);\n}\n\n\/* \u2500\u2500 TEXT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-team__name {\n font-size: clamp(12px, 3.2vw, 19px);\n font-weight: 800;\n color: var(--n-text-dark);\n margin: 0 0 4px;\n line-height: 1.3;\n padding: 0 4px;\n}\n\n.ihsan-team__role {\n font-size: clamp(9.5px, 2.2vw, 13.5px);\n font-weight: 600;\n color: var(--n-green-dark);\n text-transform: uppercase;\n letter-spacing: .05em;\n margin: 0;\n}\n\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@media (max-width: 700px) {\n #ihsan-team { padding: 48px 16px 56px; }\n}\n\n@media (max-width: 400px) {\n #ihsan-team { padding: 36px 10px 44px; }\n .ihsan-team__inner { gap: 10px; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-team * { transition: none !important; transform: none !important; }\n}\n<\/style>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3eba5017 e-flex e-con-boxed e-con e-parent\" data-id=\"3eba5017\" data-element_type=\"container\" data-e-type=\"container\" id=\"xs_team_3\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-44d2b55c e-con-full e-grid e-con e-child\" data-id=\"44d2b55c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n <div class=\"xs_social_share_widget xs_share_url after_content \t\tmain_content wslu-style-1 wslu-share-box-shaped wslu-fill-colored wslu-none wslu-share-horizontal wslu-theme-font-no wslu-main_content\">\n\n\t\t\n <ul>\n\t\t\t <\/ul>\n <\/div> \n","protected":false},"excerpt":{"rendered":"<p>Ihsan Foundation Slider 01 \/ 04 Our Mission Empowering vulnerable communities across Africa A humanitarian organization led by Somali professionals and scholars \u2014 driven by compassion, education, and the Islamic principles of mercy, justice, and solidarity. Our Vision A world where no community is left behind Founded by Somali professionals, volunteers, and scholars committed to […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"postBodyCss":"","postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"footnotes":""},"class_list":["post-25","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/comments?post=25"}],"version-history":[{"count":142,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25\/revisions"}],"predecessor-version":[{"id":722,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25\/revisions\/722"}],"wp:attachment":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/media?parent=25"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Ihsan Foundation Slider<\/title>\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n html, body { width: 100%; overflow-x: hidden; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }\n\n \/* \u2500\u2500 WordPress full-width escape \u2500\u2500 *\/\n .sl-wrap {\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow: hidden;\n background: #000;\n user-select: none;\n }\n\n .sl-track {\n display: flex;\n transition: transform 0.85s cubic-bezier(0.77, 0, 0.175, 1);\n height: 78vh;\n min-height: 460px;\n max-height: 680px;\n }\n\n .sl-slide { min-width: 100vw; height: 100%; position: relative; overflow: hidden; flex-shrink: 0; }\n\n .sl-slide img {\n width: 100%; height: 100%; object-fit: cover; display: block;\n transition: transform 7s ease;\n }\n .sl-slide.active img { transform: scale(1.07); }\n\n .sl-overlay {\n position: absolute; inset: 0;\n display: flex; flex-direction: column;\n align-items: flex-start; justify-content: flex-end;\n padding: 3.5rem 4rem;\n background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.2) 60%, transparent 100%);\n }\n\n .sl-tag {\n font-size: 11px; font-weight: 600; letter-spacing: 0.13em;\n text-transform: uppercase; color: #fff;\n background: rgba(0,165,80,0.92);\n padding: 5px 16px; border-radius: 20px; margin-bottom: 0.9rem;\n display: inline-block;\n opacity: 0; transform: translateY(14px);\n transition: opacity 0.55s ease 0.2s, transform 0.55s ease 0.2s;\n }\n\n .sl-title {\n font-size: clamp(1.7rem, 4vw, 2.9rem); font-weight: 700;\n color: #fff; line-height: 1.18; margin-bottom: 0.8rem; max-width: 660px;\n opacity: 0; transform: translateY(18px);\n transition: opacity 0.55s ease 0.35s, transform 0.55s ease 0.35s;\n text-shadow: 0 2px 14px rgba(0,0,0,0.5);\n }\n\n .sl-desc {\n font-size: clamp(0.88rem, 1.6vw, 1.02rem);\n color: rgba(255,255,255,0.9); line-height: 1.72; max-width: 560px;\n opacity: 0; transform: translateY(18px);\n transition: opacity 0.55s ease 0.5s, transform 0.55s ease 0.5s;\n text-shadow: 0 1px 6px rgba(0,0,0,0.35);\n }\n\n .sl-slide.active .sl-tag,\n .sl-slide.active .sl-title,\n .sl-slide.active .sl-desc { opacity: 1; transform: translateY(0); }\n\n .sl-counter {\n position: absolute; top: 24px; right: 26px; z-index: 20;\n background: rgba(0,0,0,0.45); color: #fff;\n font-size: 12px; font-weight: 500; padding: 5px 14px;\n border-radius: 20px; letter-spacing: 0.07em; font-family: monospace;\n }\n\n .sl-nav {\n position: absolute; top: 50%; transform: translateY(-50%); z-index: 20;\n width: 52px; height: 52px; border-radius: 50%; border: none;\n background: rgba(255,255,255,0.92); color: #0087f0;\n cursor: pointer; font-size: 20px;\n display: flex; align-items: center; justify-content: center;\n transition: all 0.25s ease;\n }\n .sl-nav:hover { background: #fff; color: #00a550; transform: translateY(-50%) scale(1.1); }\n .sl-prev { left: 26px; }\n .sl-next { right: 26px; }\n\n .sl-dots {\n position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);\n display: flex; gap: 9px; z-index: 20; align-items: center;\n }\n .sl-dot {\n width: 9px; height: 9px; border-radius: 50%;\n background: rgba(255,255,255,0.4);\n border: 1.5px solid rgba(255,255,255,0.75);\n cursor: pointer; transition: all 0.3s ease;\n }\n .sl-dot.on { background: #00a550; border-color: #00a550; width: 28px; border-radius: 5px; }\n .sl-dot:hover:not(.on) { background: rgba(255,255,255,0.78); }\n\n .sl-prog {\n position: absolute; bottom: 0; left: 0; height: 3px;\n background: linear-gradient(90deg, #00a550, #0087f0);\n z-index: 20; width: 0%;\n }\n\n @media (max-width: 768px) {\n .sl-overlay { padding: 2.2rem 2rem; }\n }\n @media (max-width: 480px) {\n .sl-overlay { padding: 1.8rem 1.2rem; }\n .sl-nav { width: 40px; height: 40px; font-size: 16px; }\n .sl-prev { left: 10px; }\n .sl-next { right: 10px; }\n .sl-counter { top: 14px; right: 14px; font-size: 11px; }\n .sl-dots { bottom: 16px; }\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"sl-wrap\" id=\"sl\">\n <div class=\"sl-counter\"><span id=\"sl-cur\">01<\/span> \/ <span id=\"sl-tot\">04<\/span><\/div>\n\n <div class=\"sl-track\" id=\"sl-track\">\n\n \n <div class=\"sl-slide active\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\" alt=\"African community\" loading=\"eager\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Mission<\/span>\n <h2 class=\"sl-title\">Empowering vulnerable communities across Africa<\/h2>\n <p class=\"sl-desc\">A humanitarian organization led by Somali professionals and scholars \u2014 driven by compassion, education, and the Islamic principles of mercy, justice, and solidarity.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Camel-Project-5-scaled.jpg\" alt=\"Camel project\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Vision<\/span>\n <h2 class=\"sl-title\">A world where no community is left behind<\/h2>\n <p class=\"sl-desc\">Founded by Somali professionals, volunteers, and scholars committed to building a future of dignity, self-reliance, and lasting change across the continent.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-7-scaled.jpg\" alt=\"Community support\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Values<\/span>\n <h2 class=\"sl-title\">Guided by mercy, justice, and solidarity<\/h2>\n <p class=\"sl-desc\">Every project, every initiative, every hand extended \u2014 grounded in the values that define Ihsan: excellence in giving, integrity in service, compassion in action.<\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"sl-slide\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-3.jpeg\" alt=\"Humanitarian aid\" loading=\"lazy\">\n <div class=\"sl-overlay\">\n <span class=\"sl-tag\">Our Impact<\/span>\n <h2 class=\"sl-title\">Transforming lives through sustainable development<\/h2>\n <p class=\"sl-desc\">From humanitarian aid to education and livelihood programmes \u2014 Ihsan Foundation is creating measurable, lasting change across communities throughout Africa.<\/p>\n <\/div>\n <\/div>\n\n <\/div>\n\n <button class=\"sl-nav sl-prev\" aria-label=\"Previous slide\">❮<\/button>\n <button class=\"sl-nav sl-next\" aria-label=\"Next slide\">❯<\/button>\n <div class=\"sl-dots\" id=\"sl-dots\"><\/div>\n <div class=\"sl-prog\" id=\"sl-prog\"><\/div>\n<\/div>\n\n<script>\n(function () {\n const track = document.getElementById('sl-track');\n const slides = track.querySelectorAll('.sl-slide');\n const dotsWrap = document.getElementById('sl-dots');\n const curEl = document.getElementById('sl-cur');\n const prog = document.getElementById('sl-prog');\n const n = slides.length;\n let cur = 0, autoTimer, progInterval, elapsed = 0;\n const DUR = 5500;\n\n document.getElementById('sl-tot').textContent = String(n).padStart(2, '0');\n\n const dots = [];\n for (let i = 0; i < n; i++) {\n const d = document.createElement('span');\n d.className = 'sl-dot' + (i === 0 ? ' on' : '');\n d.addEventListener('click', () => go(i, true));\n dotsWrap.appendChild(d);\n dots.push(d);\n }\n\n function activate(i) {\n slides[cur].classList.remove('active');\n dots[cur].classList.remove('on');\n cur = i;\n slides[cur].classList.add('active');\n dots[cur].classList.add('on');\n curEl.textContent = String(cur + 1).padStart(2, '0');\n track.style.transform = `translateX(-${cur * 100}%)`;\n }\n\n function startProg() {\n elapsed = 0;\n prog.style.transition = 'none';\n prog.style.width = '0%';\n clearInterval(progInterval);\n progInterval = setInterval(() => {\n elapsed += 50;\n prog.style.transition = 'width 50ms linear';\n prog.style.width = (Math.min(elapsed \/ DUR, 1) * 100) + '%';\n if (elapsed >= DUR) clearInterval(progInterval);\n }, 50);\n }\n\n function startAuto() {\n clearTimeout(autoTimer);\n autoTimer = setTimeout(() => go((cur + 1) % n, false), DUR);\n }\n\n function go(i, manual) {\n if (manual) { clearTimeout(autoTimer); clearInterval(progInterval); }\n activate(i);\n startProg();\n startAuto();\n }\n\n document.querySelector('.sl-prev').addEventListener('click', () => go((cur - 1 + n) % n, true));\n document.querySelector('.sl-next').addEventListener('click', () => go((cur + 1) % n, true));\n\n let tx = 0;\n track.addEventListener('touchstart', e => { tx = e.touches[0].clientX; });\n track.addEventListener('touchend', e => {\n const dx = e.changedTouches[0].clientX - tx;\n if (Math.abs(dx) > 50) go(dx < 0 ? (cur + 1) % n : (cur - 1 + n) % n, true);\n });\n\n track.addEventListener('mouseenter', () => { clearTimeout(autoTimer); clearInterval(progInterval); });\n track.addEventListener('mouseleave', () => { startProg(); startAuto(); });\n\n go(0, true);\n})();\n<\/script>\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ca3911b e-flex e-con-boxed e-con e-parent\" data-id=\"ca3911b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-96e4049 elementor-widget elementor-widget-html\" data-id=\"96e4049\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-about\">\n <div class=\"ihsan-about__inner\">\n\n \n <div class=\"ihsan-about__media\">\n <div class=\"ihsan-about__img-wrap ihsan-about__img-wrap--main\">\n <img decoding=\"async\"\n src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/02\/20260125_113519-scaled.jpg\"\n alt=\"Community members gathered under a tree for an outdoor meeting\"\n loading=\"lazy\"\n \/>\n <div class=\"ihsan-about__badge\">\n <span class=\"ihsan-about__badge-number\">2,026<\/span>\n <span class=\"ihsan-about__badge-label\">Impact-ready website sample<\/span>\n <\/div>\n <\/div>\n\n <div class=\"ihsan-about__img-wrap ihsan-about__img-wrap--small\">\n <img decoding=\"async\"\n src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/WATER-WELL-18-scaled.jpg\"\n alt=\"Smiling children together outdoors\"\n loading=\"lazy\"\n \/>\n <\/div>\n <\/div>\n\n \n <div class=\"ihsan-about__content\">\n <div class=\"ihsan-about__eyebrow\">\n <span class=\"ihsan-about__eyebrow-line\"><\/span>\n <span>About Ihsan Foundation<\/span>\n <\/div>\n\n <h2 class=\"ihsan-about__heading\">\n We deliver help with dignity, speed and accountability.\n <\/h2>\n\n <p class=\"ihsan-about__text\">\n Ihsan Foundation waa hay\u2019ad samafal oo ka shaqeysa gaarsiinta deeqaha iyo garab\n istaagga dadka u baahan. Waxaan bulshada nugul u fidinaa cunto, biyo, qurbaani,\n agoon taageero, waxbarasho iyo gurmad degdeg ah.\n <\/p>\n\n <p class=\"ihsan-about__text\">\n This website sample is designed as a professional NGO\/charity homepage with active\n front-end functions, latest information panels and modern animations.\n <\/p>\n\n <div class=\"ihsan-about__actions\">\n <a href=\"#\" class=\"ihsan-about__btn ihsan-about__btn--primary\">Our Programs<\/a>\n <a href=\"#\" class=\"ihsan-about__btn ihsan-about__btn--secondary\">Become Partner<\/a>\n <\/div>\n <\/div>\n\n <\/div>\n<\/section>\n\n<style>\n #ihsan-about{\n --ihsan-bg: #eef3ee;\n --ihsan-green: #1f7a4d;\n --ihsan-green-dark: #155c39;\n --ihsan-text-dark: #16241c;\n --ihsan-text-body: #4b5a52;\n --ihsan-white: #ffffff;\n --ihsan-radius: 22px;\n\n \/* ---- FULL WIDTH \/ FULL-BLEED FIX ----\n This breaks the section out of Elementor's \"boxed\" page\n container (and any theme content wrapper) so the green\n background spans the entire browser width, even if this\n HTML widget sits inside a width-restricted column\/section. *\/\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow-x: clip;\n\n background: var(--ihsan-bg);\n padding: 90px 24px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n overflow: hidden;\n }\n\n #ihsan-about *{\n box-sizing: border-box;\n }\n\n #ihsan-about .ihsan-about__inner{\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 70px;\n align-items: center;\n }\n\n \/* ---------- MEDIA \/ IMAGES ---------- *\/\n #ihsan-about .ihsan-about__media{\n position: relative;\n min-height: 560px;\n }\n\n #ihsan-about .ihsan-about__img-wrap{\n border-radius: var(--ihsan-radius);\n overflow: hidden;\n background: var(--ihsan-white);\n padding: 10px;\n box-shadow: 0 25px 50px -12px rgba(22, 36, 28, 0.18);\n transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s ease;\n }\n\n #ihsan-about .ihsan-about__img-wrap img{\n width: 100%;\n height: 100%;\n display: block;\n object-fit: cover;\n border-radius: calc(var(--ihsan-radius) - 8px);\n transition: transform 1.1s cubic-bezier(.2,.8,.2,1);\n }\n\n #ihsan-about .ihsan-about__img-wrap--main{\n position: relative;\n width: 84%;\n aspect-ratio: 4\/5;\n z-index: 1;\n }\n\n #ihsan-about .ihsan-about__img-wrap--small{\n position: absolute;\n right: 0;\n bottom: -6%;\n width: 52%;\n aspect-ratio: 4\/3;\n z-index: 2;\n }\n\n \/* Hover animation: images lift + slight zoom *\/\n #ihsan-about .ihsan-about__img-wrap:hover{\n transform: translateY(-10px);\n box-shadow: 0 35px 60px -10px rgba(22, 36, 28, 0.28);\n }\n\n #ihsan-about .ihsan-about__img-wrap:hover img{\n transform: scale(1.06);\n }\n\n \/* Impact badge *\/\n #ihsan-about .ihsan-about__badge{\n position: absolute;\n left: 18px;\n bottom: 18px;\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n border-radius: 14px;\n padding: 18px 22px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n box-shadow: 0 12px 24px -6px rgba(0,0,0,.25);\n transition: transform .35s ease, background .35s ease;\n }\n\n #ihsan-about .ihsan-about__img-wrap--main:hover .ihsan-about__badge{\n transform: translateY(-4px);\n background: var(--ihsan-green);\n }\n\n #ihsan-about .ihsan-about__badge-number{\n font-size: 28px;\n font-weight: 800;\n line-height: 1;\n }\n\n #ihsan-about .ihsan-about__badge-label{\n font-size: 13px;\n font-weight: 600;\n opacity: .92;\n }\n\n \/* ---------- CONTENT ---------- *\/\n #ihsan-about .ihsan-about__eyebrow{\n display: flex;\n align-items: center;\n gap: 10px;\n color: var(--ihsan-green-dark);\n font-weight: 700;\n font-size: 13px;\n letter-spacing: .12em;\n text-transform: uppercase;\n margin-bottom: 22px;\n }\n\n #ihsan-about .ihsan-about__eyebrow-line{\n width: 34px;\n height: 3px;\n border-radius: 2px;\n background: linear-gradient(90deg, var(--ihsan-green-dark), #c9d96a);\n }\n\n #ihsan-about .ihsan-about__heading{\n font-size: clamp(34px, 4.2vw, 52px);\n line-height: 1.12;\n font-weight: 800;\n color: var(--ihsan-text-dark);\n margin: 0 0 26px 0;\n letter-spacing: -0.01em;\n }\n\n #ihsan-about .ihsan-about__text{\n font-size: 16px;\n line-height: 1.75;\n color: var(--ihsan-text-body);\n margin: 0 0 18px 0;\n max-width: 560px;\n }\n\n #ihsan-about .ihsan-about__actions{\n display: flex;\n gap: 16px;\n margin-top: 30px;\n flex-wrap: wrap;\n }\n\n #ihsan-about .ihsan-about__btn{\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 16px 30px;\n border-radius: 50px;\n font-weight: 700;\n font-size: 15px;\n text-decoration: none;\n transition: transform .3s ease, box-shadow .3s ease, background .3s ease, color .3s ease;\n white-space: nowrap;\n }\n\n #ihsan-about .ihsan-about__btn--primary{\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n box-shadow: 0 10px 22px -6px rgba(21,92,57,.45);\n }\n\n #ihsan-about .ihsan-about__btn--primary:hover{\n background: var(--ihsan-green);\n transform: translateY(-3px);\n box-shadow: 0 16px 28px -6px rgba(21,92,57,.55);\n }\n\n #ihsan-about .ihsan-about__btn--secondary{\n background: var(--ihsan-white);\n color: var(--ihsan-green-dark);\n border: 1px solid rgba(21,92,57,.15);\n }\n\n #ihsan-about .ihsan-about__btn--secondary:hover{\n background: var(--ihsan-green-dark);\n color: var(--ihsan-white);\n transform: translateY(-3px);\n box-shadow: 0 14px 24px -6px rgba(21,92,57,.35);\n }\n\n \/* ---------- SCROLL REVEAL (lightweight, no JS dependency required) ---------- *\/\n #ihsan-about .ihsan-about__media,\n #ihsan-about .ihsan-about__content{\n opacity: 0;\n transform: translateY(24px);\n animation: ihsanFadeUp .8s ease forwards;\n }\n #ihsan-about .ihsan-about__content{ animation-delay: .12s; }\n\n @keyframes ihsanFadeUp{\n to{ opacity: 1; transform: translateY(0); }\n }\n\n \/* ---------- RESPONSIVE ---------- *\/\n\n \/* Tablets \/ small laptops *\/\n @media (max-width: 1024px){\n #ihsan-about{ padding: 70px 24px; }\n #ihsan-about .ihsan-about__inner{\n grid-template-columns: 1fr;\n gap: 56px;\n }\n #ihsan-about .ihsan-about__media{\n min-height: 0;\n max-width: 520px;\n margin: 0 auto;\n }\n #ihsan-about .ihsan-about__content{\n text-align: center;\n }\n #ihsan-about .ihsan-about__eyebrow{\n justify-content: center;\n }\n #ihsan-about .ihsan-about__text{\n margin-left: auto;\n margin-right: auto;\n }\n #ihsan-about .ihsan-about__actions{\n justify-content: center;\n }\n }\n\n \/* Mobile *\/\n @media (max-width: 560px){\n #ihsan-about{ padding: 56px 16px; }\n #ihsan-about .ihsan-about__inner{ gap: 44px; }\n #ihsan-about .ihsan-about__heading{ font-size: 30px; }\n #ihsan-about .ihsan-about__media{\n min-height: 0;\n padding-bottom: 40px; \/* room for the offset small image *\/\n }\n #ihsan-about .ihsan-about__img-wrap--main{ width: 100%; }\n #ihsan-about .ihsan-about__img-wrap--small{\n width: 60%;\n right: -6px;\n bottom: -8%;\n }\n #ihsan-about .ihsan-about__badge{\n left: 10px;\n bottom: 10px;\n padding: 12px 16px;\n }\n #ihsan-about .ihsan-about__badge-number{ font-size: 22px; }\n #ihsan-about .ihsan-about__badge-label{ font-size: 11px; }\n #ihsan-about .ihsan-about__actions{\n flex-direction: column;\n width: 100%;\n }\n #ihsan-about .ihsan-about__btn{ width: 100%; }\n }\n\n \/* Respect reduced motion preference *\/\n @media (prefers-reduced-motion: reduce){\n #ihsan-about .ihsan-about__media,\n #ihsan-about .ihsan-about__content{\n animation: none;\n opacity: 1;\n transform: none;\n }\n #ihsan-about .ihsan-about__img-wrap,\n #ihsan-about .ihsan-about__img-wrap img,\n #ihsan-about .ihsan-about__btn,\n #ihsan-about .ihsan-about__badge{\n transition: none;\n }\n }\n<\/style>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1fb26ee e-flex e-con-boxed e-con e-parent\" data-id=\"1fb26ee\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7f15fbb elementor-widget elementor-widget-html\" data-id=\"7f15fbb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-campaigns\">\n <h2 class=\"sr-only\">Active Ihsan Foundation campaigns with search and filter<\/h2>\n <h2 class=\"ihsan-camp__heading\">Active campaigns with search, filter and progress.<\/h2>\n <div class=\"ihsan-camp__controls\">\n <div class=\"ihsan-camp__tabs\" id=\"ihsanCampTabs\"><\/div>\n <div class=\"ihsan-camp__search\">\n <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" aria-hidden=\"true\">\n <circle cx=\"11\" cy=\"11\" r=\"7\"><\/circle>\n <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line>\n <\/svg>\n <input type=\"text\" id=\"ihsanCampSearch\" placeholder=\"Search projects...\" autocomplete=\"off\" \/>\n <\/div>\n <\/div>\n <div class=\"ihsan-camp__status\" id=\"ihsanCampStatus\"><\/div>\n <div class=\"ihsan-camp__grid\" id=\"ihsanCampGrid\"><\/div>\n <div class=\"ihsan-camp__more-wrap\" id=\"ihsanCampMoreWrap\" style=\"display:none;\">\n <button class=\"ihsan-camp__more-btn\" id=\"ihsanCampMoreBtn\">Load More<\/button>\n <\/div>\n<\/section>\n\n<style>\n#ihsan-campaigns {\n --camp-bg: #eef3ee;\n --camp-green: #1f7a4d;\n --camp-green-dark: #155c39;\n --camp-text-dark: #16241c;\n --camp-text-body: #5b6b62;\n --camp-white: #ffffff;\n --camp-track: #eef0e6;\n --camp-progress: linear-gradient(90deg, #e8b339, #bcd95f);\n --camp-radius: 18px;\n\n position: relative;\n left: 50%;\n right: 50%;\n margin-left: -50vw;\n margin-right: -50vw;\n width: 100vw;\n max-width: 100vw;\n overflow-x: clip;\n\n background: var(--camp-bg);\n padding: 70px 24px 90px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-campaigns * { box-sizing: border-box; }\n\n\/* ---------- HEADING ---------- *\/\n#ihsan-campaigns .ihsan-camp__heading {\n max-width: 1240px;\n margin: 0 auto 32px;\n font-size: clamp(28px, 3.4vw, 40px);\n line-height: 1.2;\n font-weight: 800;\n color: var(--camp-text-dark);\n}\n\n\/* ---------- CONTROLS ---------- *\/\n#ihsan-campaigns .ihsan-camp__controls {\n max-width: 1240px;\n margin: 0 auto 36px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__tabs {\n display: flex;\n gap: 10px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__tab {\n border: none;\n background: var(--camp-white);\n color: var(--camp-text-dark);\n font-weight: 700;\n font-size: 14px;\n padding: 10px 20px;\n border-radius: 50px;\n cursor: pointer;\n transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease;\n box-shadow: 0 2px 6px rgba(0,0,0,.05);\n}\n\n#ihsan-campaigns .ihsan-camp__tab:hover {\n transform: translateY(-2px);\n box-shadow: 0 8px 16px -4px rgba(21,92,57,.25);\n}\n\n#ihsan-campaigns .ihsan-camp__tab.is-active {\n background: var(--camp-green-dark);\n color: var(--camp-white);\n}\n\n#ihsan-campaigns .ihsan-camp__search {\n position: relative;\n display: flex;\n align-items: center;\n}\n\n#ihsan-campaigns .ihsan-camp__search svg {\n position: absolute;\n left: 16px;\n color: #9aa79e;\n pointer-events: none;\n}\n\n#ihsan-campaigns .ihsan-camp__search input {\n width: 260px;\n max-width: 100%;\n padding: 12px 16px 12px 42px;\n border-radius: 50px;\n border: 1px solid #e1e8e2;\n background: var(--camp-white);\n font-size: 14px;\n outline: none;\n transition: box-shadow .25s ease, border-color .25s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__search input:focus {\n border-color: var(--camp-green);\n box-shadow: 0 0 0 3px rgba(31,122,77,.15);\n}\n\n\/* ---------- STATUS ---------- *\/\n#ihsan-campaigns .ihsan-camp__status {\n max-width: 1240px;\n margin: 0 auto 20px;\n font-size: 14px;\n color: var(--camp-text-body);\n min-height: 1px;\n}\n#ihsan-campaigns .ihsan-camp__status.is-error { color: #b3261e; }\n\n\/* ---------- GRID ---------- *\/\n#ihsan-campaigns .ihsan-camp__grid {\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 26px;\n}\n\n\/* ---------- CARD ---------- *\/\n#ihsan-campaigns .ihsan-camp__card {\n background: var(--camp-white);\n border-radius: var(--camp-radius);\n overflow: hidden;\n box-shadow: 0 10px 30px -10px rgba(22,36,28,.12);\n transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;\n display: flex;\n flex-direction: column;\n opacity: 0;\n transform: translateY(18px);\n animation: ihsanCampFadeUp .6s ease forwards;\n}\n\n@keyframes ihsanCampFadeUp { to { opacity: 1; transform: translateY(0); } }\n\n#ihsan-campaigns .ihsan-camp__card:hover {\n transform: translateY(-8px);\n box-shadow: 0 26px 44px -12px rgba(22,36,28,.22);\n}\n\n\/* ---------- MEDIA \/ IMAGE ---------- *\/\n#ihsan-campaigns .ihsan-camp__media {\n position: relative;\n height: 200px;\n overflow: hidden;\n background: linear-gradient(135deg, #1f7a4d, #bcd95f);\n}\n\n#ihsan-campaigns .ihsan-camp__media img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .6s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__card:hover .ihsan-camp__media img {\n transform: scale(1.08);\n}\n\n\/* Dark gradient overlay so the badge stays readable on any image *\/\n#ihsan-campaigns .ihsan-camp__media-overlay {\n position: absolute;\n inset: 0;\n background: linear-gradient(to top, rgba(0,0,0,.38) 0%, transparent 55%);\n pointer-events: none;\n}\n\n#ihsan-campaigns .ihsan-camp__cat-badge {\n position: absolute;\n top: 14px;\n left: 14px;\n background: rgba(255,255,255,.92);\n color: var(--camp-green-dark);\n font-size: 11px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .04em;\n padding: 5px 12px;\n border-radius: 50px;\n z-index: 2;\n}\n\n\/* ---------- CARD BODY ---------- *\/\n#ihsan-campaigns .ihsan-camp__body {\n padding: 20px 22px 22px;\n display: flex;\n flex-direction: column;\n flex: 1;\n}\n\n#ihsan-campaigns .ihsan-camp__title {\n font-size: 19px;\n font-weight: 800;\n color: var(--camp-text-dark);\n margin: 0 0 10px;\n line-height: 1.3;\n}\n\n#ihsan-campaigns .ihsan-camp__meta-row {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n#ihsan-campaigns .ihsan-camp__location {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 12.5px;\n font-weight: 700;\n color: var(--camp-text-body);\n}\n\n#ihsan-campaigns .ihsan-camp__funded-pill {\n background: #e7f5ec;\n color: var(--camp-green-dark);\n font-size: 12px;\n font-weight: 800;\n padding: 3px 11px;\n border-radius: 50px;\n}\n\n#ihsan-campaigns .ihsan-camp__excerpt {\n font-size: 14px;\n line-height: 1.6;\n color: var(--camp-text-body);\n margin: 0 0 16px;\n flex: 1;\n}\n\n#ihsan-campaigns .ihsan-camp__progress-track {\n height: 8px;\n border-radius: 6px;\n background: var(--camp-track);\n overflow: hidden;\n margin-bottom: 8px;\n}\n\n#ihsan-campaigns .ihsan-camp__progress-fill {\n height: 100%;\n border-radius: 6px;\n background: var(--camp-progress);\n width: 0%;\n transition: width 1s cubic-bezier(.2,.8,.2,1);\n}\n\n#ihsan-campaigns .ihsan-camp__amount-row {\n display: flex;\n justify-content: space-between;\n font-size: 13px;\n font-weight: 700;\n color: var(--camp-text-dark);\n margin-bottom: 18px;\n}\n\n#ihsan-campaigns .ihsan-camp__amount-row .raised { color: var(--camp-green-dark); }\n#ihsan-campaigns .ihsan-camp__amount-row .goal { color: var(--camp-text-body); font-weight: 600; }\n\n#ihsan-campaigns .ihsan-camp__btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n align-self: flex-start;\n padding: 12px 26px;\n border-radius: 50px;\n background: var(--camp-white);\n border: 1.5px solid var(--camp-green-dark);\n color: var(--camp-green-dark);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease;\n}\n\n#ihsan-campaigns .ihsan-camp__btn:hover {\n background: var(--camp-green-dark);\n color: var(--camp-white);\n transform: translateY(-2px);\n box-shadow: 0 12px 22px -6px rgba(21,92,57,.4);\n}\n\n\/* ---------- SKELETON ---------- *\/\n#ihsan-campaigns .ihsan-camp__skeleton .ihsan-camp__media { background: #e3e9e3; }\n#ihsan-campaigns .ihsan-camp__skel-line {\n height: 12px;\n border-radius: 6px;\n background: #e3e9e3;\n margin-bottom: 10px;\n animation: ihsanPulse 1.3s ease-in-out infinite;\n}\n@keyframes ihsanPulse { 0%,100%{ opacity:1; } 50%{ opacity:.5; } }\n\n\/* ---------- LOAD MORE ---------- *\/\n#ihsan-campaigns .ihsan-camp__more-wrap { text-align: center; margin-top: 40px; }\n#ihsan-campaigns .ihsan-camp__more-btn {\n border: none;\n background: var(--camp-green-dark);\n color: var(--camp-white);\n font-weight: 700;\n font-size: 14px;\n padding: 13px 32px;\n border-radius: 50px;\n cursor: pointer;\n transition: background .25s ease, transform .25s ease;\n}\n#ihsan-campaigns .ihsan-camp__more-btn:hover {\n background: var(--camp-green);\n transform: translateY(-2px);\n}\n\n\/* ---------- RESPONSIVE ---------- *\/\n@media (max-width: 1024px) {\n #ihsan-campaigns .ihsan-camp__grid { grid-template-columns: repeat(2, 1fr); }\n}\n\n@media (max-width: 640px) {\n #ihsan-campaigns { padding: 50px 16px 70px; }\n #ihsan-campaigns .ihsan-camp__grid { grid-template-columns: 1fr; }\n #ihsan-campaigns .ihsan-camp__controls { flex-direction: column; align-items: stretch; }\n #ihsan-campaigns .ihsan-camp__search input { width: 100%; }\n #ihsan-campaigns .ihsan-camp__tabs {\n overflow-x: auto;\n flex-wrap: nowrap;\n padding-bottom: 4px;\n -webkit-overflow-scrolling: touch;\n }\n #ihsan-campaigns .ihsan-camp__tab { flex: 0 0 auto; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-campaigns .ihsan-camp__card { animation: none; opacity: 1; transform: none; }\n #ihsan-campaigns * { transition: none !important; }\n}\n<\/style>\n\n<script>\n(function () {\n\n \/* =================================================================\n CONFIG\n ================================================================= *\/\n\n var SITE_ORIGIN = \"https:\/\/ihsaanfoundation.org\";\n var WP_BASE_PRETTY = SITE_ORIGIN + \"\/wp-json\/wp\/v2\";\n var WP_BASE_PLAIN = SITE_ORIGIN + \"\/?rest_route=\/wp\/v2\";\n var WP_BASE = WP_BASE_PRETTY;\n\n var CHILD_CATEGORY_IDS = [8, 9, 10, 11, 12, 13, 14, 15];\n\n var CATEGORY_MAP = [\n { label: \"All\", id: CHILD_CATEGORY_IDS.join(\",\") },\n { label: \"Qurban Project\", id: \"8\" },\n { label: \"Ramadan Iftar\", id: \"9\" },\n { label: \"Food Aid & Distribution\", id: \"10\" },\n { label: \"Cataract Treatment & Surgery\", id: \"11\" },\n { label: \"Water Well Construction\", id: \"12\" },\n { label: \"Milk Goat Distribution\", id: \"13\" },\n { label: \"Orphan Sponsorship\", id: \"14\" },\n { label: \"Stationary\", id: \"15\" }\n ];\n\n \/*\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * CATEGORY COVER IMAGES\n * One dedicated cover image per category.\n * To change any image, simply replace the full URL value.\n * You can use Unsplash, your own WordPress media, or any CDN.\n * Recommended size: 800\u00d7400 px.\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n *\/\n var CATEGORY_COVERS = {};\n\n \/* \u2500\u2500 ALL PROJECTS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[CHILD_CATEGORY_IDS.join(\",\")] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\";\n\n \/* \u2500\u2500 QURBAN PROJECT (id: 8) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"8\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\";\n\n \/* \u2500\u2500 RAMADAN IFTAR (id: 9) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"9\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-18.jpeg\";\n\n \/* \u2500\u2500 FOOD AID & DISTRIBUTION (id: 10) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"10\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Food-Aid-7-scaled.jpg\";\n\n \/* \u2500\u2500 CATARACT TREATMENT & SURGERY (id: 11) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"11\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Cataract-Treatment-and-Surgery-2-scaled.jpg\";\n\n \/* \u2500\u2500 WATER WELL CONSTRUCTION (id: 12) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"12\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/WATER-WELL-15-scaled.jpg\";\n\n \/* \u2500\u2500 MILK GOAT DISTRIBUTION (id: 13) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"13\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-4.jpeg\";\n\n \/* \u2500\u2500 ORPHAN SPONSORSHIP (id: 14) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"14\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Orphan-Project-7-1-scaled.jpg\";\n\n \/* \u2500\u2500 STATIONARY (id: 15) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n CATEGORY_COVERS[\"15\"] =\n \"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/KIRTASIYE-DAGITIMI-18-scaled.jpg\";\n\n \/* Custom field key names (ACF or registered meta) *\/\n var FIELD_RAISED = \"raised_amount\";\n var FIELD_GOAL = \"goal_amount\";\n var FIELD_LOCATION = \"location\";\n\n var PER_PAGE = 6;\n\n \/* Auto-detect pretty vs plain permalink REST endpoint *\/\n var endpointReady = fetch(WP_BASE_PRETTY + \"\/posts?per_page=1\")\n .then(function (res) {\n if (res.ok) { WP_BASE = WP_BASE_PRETTY; return; }\n throw new Error(\"pretty endpoint returned \" + res.status);\n })\n .catch(function () { WP_BASE = WP_BASE_PLAIN; });\n\n \/* =================================================================\n STATE\n ================================================================= *\/\n\n var state = {\n activeCategory: CATEGORY_MAP[0].id,\n search: \"\",\n page: 1,\n loading: false,\n items: []\n };\n\n var grid = document.getElementById(\"ihsanCampGrid\");\n var tabsWrap = document.getElementById(\"ihsanCampTabs\");\n var statusBox = document.getElementById(\"ihsanCampStatus\");\n var searchBox = document.getElementById(\"ihsanCampSearch\");\n var moreWrap = document.getElementById(\"ihsanCampMoreWrap\");\n var moreBtn = document.getElementById(\"ihsanCampMoreBtn\");\n\n \/* =================================================================\n HELPERS\n ================================================================= *\/\n\n function stripHtml(html) {\n var tmp = document.createElement(\"div\");\n tmp.innerHTML = html || \"\";\n return (tmp.textContent || tmp.innerText || \"\").trim();\n }\n\n function truncate(text, max) {\n if (text.length <= max) return text;\n return text.slice(0, max).replace(\/\\s+\\S*$\/, \"\") + \"\u2026\";\n }\n\n function getCategoryLabel(post) {\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) return terms[0].name;\n } catch (e) {}\n return \"Project\";\n }\n\n function getPostFeaturedImage(post) {\n try { return post._embedded[\"wp:featuredmedia\"][0].source_url; }\n catch (e) { return \"\"; }\n }\n\n function getCustomField(post, key) {\n if (post.acf && post.acf[key] !== undefined && post.acf[key] !== \"\") return post.acf[key];\n if (post.meta && post.meta[key] !== undefined && post.meta[key] !== \"\") return post.meta[key];\n return null;\n }\n\n function formatMoney(n) {\n n = Number(n);\n if (isNaN(n)) return null;\n return \"$\" + n.toLocaleString(\"en-US\");\n }\n\n \/*\n * getCoverForPost\n * Always uses CATEGORY_COVERS \u2014 ignores the WordPress featured image\n * because posts were inheriting the wrong Qurban image and overriding\n * the correct per-category cover for Stationary and Ramadan Iftar.\n *\n * Priority:\n * 1. CATEGORY_COVERS entry matching the post's own sub-category id\n * 2. CATEGORY_COVERS entry for the currently active tab\n *\/\n function getCoverForPost(post) {\n var catId = \"\";\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) catId = String(terms[0].id);\n } catch (e) {}\n\n if (catId && CATEGORY_COVERS[catId]) return CATEGORY_COVERS[catId];\n return CATEGORY_COVERS[state.activeCategory] || CATEGORY_COVERS[CATEGORY_MAP[0].id];\n }\n\n \/* =================================================================\n RENDER TABS\n ================================================================= *\/\n\n function renderTabs() {\n tabsWrap.innerHTML = \"\";\n CATEGORY_MAP.forEach(function (cat) {\n var btn = document.createElement(\"button\");\n btn.className = \"ihsan-camp__tab\" + (cat.id === state.activeCategory ? \" is-active\" : \"\");\n btn.textContent = cat.label;\n btn.addEventListener(\"click\", function () {\n if (state.activeCategory === cat.id) return;\n state.activeCategory = cat.id;\n state.page = 1;\n state.items = [];\n renderTabs();\n fetchPosts(true);\n });\n tabsWrap.appendChild(btn);\n });\n }\n\n \/* =================================================================\n SKELETON PLACEHOLDERS\n ================================================================= *\/\n\n function renderSkeletons(count) {\n var html = \"\";\n for (var i = 0; i < count; i++) {\n html +=\n '<div class=\"ihsan-camp__card ihsan-camp__skeleton\">' +\n '<div class=\"ihsan-camp__media\"><\/div>' +\n '<div class=\"ihsan-camp__body\">' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:70%;height:18px;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:40%;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:90%;\"><\/div>' +\n '<div class=\"ihsan-camp__skel-line\" style=\"width:60%;\"><\/div>' +\n '<\/div>' +\n '<\/div>';\n }\n grid.innerHTML = html;\n }\n\n \/* =================================================================\n RENDER CARDS\n ================================================================= *\/\n\n function renderCards(posts, append) {\n if (!append) grid.innerHTML = \"\";\n\n if (!posts.length && !append) {\n grid.innerHTML = '<p style=\"grid-column:1\/-1;text-align:center;color:#5b6b62;padding:40px 0;\">No projects found. Try a different category or search term.<\/p>';\n return;\n }\n\n posts.forEach(function (post, i) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 110);\n var cover = getCoverForPost(post);\n var catLabel = getCategoryLabel(post);\n var location = getCustomField(post, FIELD_LOCATION);\n var raised = getCustomField(post, FIELD_RAISED);\n var goal = getCustomField(post, FIELD_GOAL);\n\n var hasProgress = raised !== null && goal !== null && Number(goal) > 0;\n var pct = hasProgress ? Math.min(100, Math.round((Number(raised) \/ Number(goal)) * 100)) : 0;\n\n var card = document.createElement(\"div\");\n card.className = \"ihsan-camp__card\";\n card.style.animationDelay = (i * 0.06) + \"s\";\n\n var progressHtml = hasProgress\n ? '<div class=\"ihsan-camp__progress-track\">' +\n '<div class=\"ihsan-camp__progress-fill\" data-pct=\"' + pct + '\"><\/div>' +\n '<\/div>' +\n '<div class=\"ihsan-camp__amount-row\">' +\n '<span class=\"raised\">' + (formatMoney(raised) || raised) + '<\/span>' +\n '<span class=\"goal\">' + (formatMoney(goal) || goal) + '<\/span>' +\n '<\/div>'\n : \"\";\n\n var fundedPill = hasProgress ? '<span class=\"ihsan-camp__funded-pill\">' + pct + '% funded<\/span>' : \"\";\n var locationHtml = location ? '<span class=\"ihsan-camp__location\">\ud83d\udccd ' + location + '<\/span>' : \"\";\n\n card.innerHTML =\n '<div class=\"ihsan-camp__media\">' +\n '<img decoding=\"async\" src=\"' + cover + '\" alt=\"' + title.replace(\/\"\/g, \"\") + '\" loading=\"lazy\" \/>' +\n '<div class=\"ihsan-camp__media-overlay\"><\/div>' +\n '<span class=\"ihsan-camp__cat-badge\">' + catLabel + '<\/span>' +\n '<\/div>' +\n '<div class=\"ihsan-camp__body\">' +\n '<h3 class=\"ihsan-camp__title\">' + title + '<\/h3>' +\n '<div class=\"ihsan-camp__meta-row\">' + locationHtml + fundedPill + '<\/div>' +\n '<p class=\"ihsan-camp__excerpt\">' + excerpt + '<\/p>' +\n progressHtml +\n '<a class=\"ihsan-camp__btn\" href=\"' + post.link + '\">View Details<\/a>' +\n '<\/div>';\n\n grid.appendChild(card);\n });\n\n \/* Animate progress bars after DOM insertion *\/\n requestAnimationFrame(function () {\n grid.querySelectorAll(\".ihsan-camp__progress-fill\").forEach(function (el) {\n el.style.width = el.getAttribute(\"data-pct\") + \"%\";\n });\n });\n }\n\n \/* =================================================================\n FETCH POSTS FROM WORDPRESS\n ================================================================= *\/\n\n function fetchPosts(reset) {\n if (state.loading) return;\n state.loading = true;\n\n if (reset) renderSkeletons(PER_PAGE);\n statusBox.textContent = \"Loading campaigns\u2026\";\n statusBox.classList.remove(\"is-error\");\n\n endpointReady.then(function () {\n var url = WP_BASE + \"\/posts?_embed&per_page=\" + PER_PAGE + \"&page=\" + state.page +\n \"&categories=\" + state.activeCategory;\n\n if (state.search.trim()) {\n url += \"&search=\" + encodeURIComponent(state.search.trim());\n }\n\n return fetch(url).then(function (res) {\n if (!res.ok) {\n return res.text().then(function (body) {\n var detail = \"\";\n try { detail = JSON.parse(body).message || \"\"; } catch (e) { detail = body.slice(0, 120); }\n throw new Error(\"HTTP \" + res.status + (detail ? \" \u2014 \" + detail : \"\"));\n });\n }\n var totalPages = res.headers.get(\"X-WP-TotalPages\");\n return res.json().then(function (data) {\n return { data: data, totalPages: Number(totalPages || 1) };\n });\n });\n })\n .then(function (result) {\n statusBox.textContent = \"\";\n if (state.page === 1) {\n state.items = result.data;\n } else {\n state.items = state.items.concat(result.data);\n }\n renderCards(result.data, state.page > 1);\n moreWrap.style.display = (state.page < result.totalPages) ? \"block\" : \"none\";\n })\n .catch(function (err) {\n var msg = (err && err.message) ? err.message : \"Unknown error\";\n statusBox.textContent = \"Couldn't load campaigns: \" + msg;\n statusBox.classList.add(\"is-error\");\n if (state.page === 1) grid.innerHTML = \"\";\n moreWrap.style.display = \"none\";\n console.error(\"Ihsan campaigns fetch error:\", err, \"| URL base used:\", WP_BASE);\n })\n .finally(function () { state.loading = false; });\n }\n\n \/* =================================================================\n SEARCH (debounced 400ms)\n ================================================================= *\/\n\n var searchTimer = null;\n searchBox.addEventListener(\"input\", function () {\n clearTimeout(searchTimer);\n searchTimer = setTimeout(function () {\n state.search = searchBox.value;\n state.page = 1;\n fetchPosts(true);\n }, 400);\n });\n\n \/* =================================================================\n LOAD MORE\n ================================================================= *\/\n\n moreBtn.addEventListener(\"click\", function () {\n state.page += 1;\n fetchPosts(false);\n });\n\n \/* =================================================================\n INIT\n ================================================================= *\/\n\n renderTabs();\n fetchPosts(true);\n\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d3336a7 e-con-full e-flex e-con e-parent\" data-id=\"d3336a7\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-32f9164 elementor-widget elementor-widget-html\" data-id=\"32f9164\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\">\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n <title>AIAF About Section<\/title>\r\n <style>\r\n \/* Reset and Base Styles *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n \r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n line-height: 1.6;\r\n color: #333;\r\n overflow-x: hidden;\r\n }\r\n \r\n \/* Full Width Section *\/\r\n .aiaf-about-section {\r\n width: 100vw;\r\n margin-left: calc(-50vw + 50%);\r\n background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);\r\n padding: 80px 0;\r\n overflow: hidden;\r\n }\r\n \r\n .aiaf-container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 0 20px;\r\n }\r\n \r\n \/* Two Column Layout *\/\r\n .aiaf-columns {\r\n display: flex;\r\n align-items: center;\r\n gap: 60px;\r\n }\r\n \r\n .aiaf-content {\r\n flex: 1;\r\n padding-right: 20px;\r\n }\r\n \r\n .aiaf-image {\r\n flex: 1;\r\n position: relative;\r\n height: 500px;\r\n overflow: hidden;\r\n }\r\n \r\n \/* Content Styling *\/\r\n .aiaf-subtitle {\r\n color: #0087f0;\r\n font-size: 18px;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 15px;\r\n display: block;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 42px;\r\n font-weight: 700;\r\n color: #222;\r\n margin-bottom: 25px;\r\n line-height: 1.2;\r\n }\r\n \r\n .aiaf-title span {\r\n color: #00a550;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 18px;\r\n color: #555;\r\n margin-bottom: 25px;\r\n line-height: 1.8;\r\n text-align: justify;\r\n text-justify: inter-word;\r\n }\r\n \r\n \/* Button Styling *\/\r\n .aiaf-button {\r\n display: inline-block;\r\n padding: 15px 35px;\r\n background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n color: white;\r\n text-decoration: none;\r\n border-radius: 50px;\r\n font-weight: 600;\r\n font-size: 16px;\r\n transition: all 0.3s ease;\r\n box-shadow: 0 4px 15px rgba(0, 135, 240, 0.3);\r\n position: relative;\r\n overflow: hidden;\r\n z-index: 1;\r\n }\r\n \r\n .aiaf-button:before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(135deg, #0087f0 0%, #00a550 100%);\r\n z-index: -1;\r\n opacity: 0;\r\n transition: opacity 0.3s ease;\r\n }\r\n \r\n .aiaf-button:hover {\r\n transform: translateY(-3px);\r\n box-shadow: 0 6px 20px rgba(0, 135, 240, 0.4);\r\n }\r\n \r\n .aiaf-button:hover:before {\r\n opacity: 1;\r\n }\r\n \r\n \/* Image Mask Styling *\/\r\n .image-mask {\r\n width: 100%;\r\n height: 100%;\r\n position: relative;\r\n border-radius: 20px;\r\n overflow: hidden;\r\n background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n \r\n .mask-shape {\r\n position: absolute;\r\n border-radius: 50%;\r\n background: rgba(255, 255, 255, 0.1);\r\n animation: float 6s ease-in-out infinite;\r\n }\r\n \r\n .shape-1 {\r\n width: 120px;\r\n height: 120px;\r\n top: 10%;\r\n left: 10%;\r\n animation-delay: 0s;\r\n }\r\n \r\n .shape-2 {\r\n width: 80px;\r\n height: 80px;\r\n top: 60%;\r\n left: 70%;\r\n animation-delay: 2s;\r\n }\r\n \r\n .shape-3 {\r\n width: 150px;\r\n height: 150px;\r\n top: 30%;\r\n left: 50%;\r\n animation-delay: 4s;\r\n }\r\n \r\n .shape-4 {\r\n width: 100px;\r\n height: 100px;\r\n top: 70%;\r\n left: 20%;\r\n animation-delay: 1s;\r\n }\r\n \r\n .image-container {\r\n position: relative;\r\n width: 85%;\r\n height: 85%;\r\n border-radius: 15px;\r\n overflow: hidden;\r\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);\r\n z-index: 2;\r\n }\r\n \r\n .about-image {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n object-position: center;\r\n transition: transform 0.5s ease;\r\n }\r\n \r\n .image-container:hover .about-image {\r\n transform: scale(1.05);\r\n }\r\n \r\n \/* Custom Shape Clip Path *\/\r\n .shape-clip {\r\n clip-path: polygon(0 0, 100% 0, 100% 85%, 85% 100%, 0 100%);\r\n }\r\n \r\n \/* Alternative Shape Options (uncomment to use) *\/\r\n \r\n \/* Rounded Diamond Shape *\/\r\n \/* .shape-clip {\r\n clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);\r\n border-radius: 20px;\r\n } *\/\r\n \r\n \/* Organic Blob Shape *\/\r\n \/* .shape-clip {\r\n clip-path: path(\"M0.5,0.5 C0.5,0.5,0.8,0.1,1,0.5 C1.2,0.9,0.9,1,0.5,1 C0.1,1,-0.1,0.9,0,0.5 C0.1,0.1,0.5,0.5,0.5,0.5 Z\");\r\n } *\/\r\n \r\n \/* Animation *\/\r\n @keyframes float {\r\n 0%, 100% {\r\n transform: translateY(0) rotate(0deg);\r\n }\r\n 50% {\r\n transform: translateY(-20px) rotate(10deg);\r\n }\r\n }\r\n \r\n \/* Responsive Styles *\/\r\n @media (max-width: 1024px) {\r\n .aiaf-columns {\r\n gap: 40px;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 36px;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 17px;\r\n }\r\n \r\n .aiaf-image {\r\n height: 450px;\r\n }\r\n }\r\n \r\n @media (max-width: 768px) {\r\n .aiaf-about-section {\r\n padding: 60px 0;\r\n }\r\n \r\n .aiaf-columns {\r\n flex-direction: column;\r\n gap: 50px;\r\n }\r\n \r\n .aiaf-content {\r\n padding-right: 0;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 32px;\r\n text-align: center;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 16px;\r\n text-align: justify;\r\n }\r\n \r\n .aiaf-image {\r\n height: 400px;\r\n width: 100%;\r\n }\r\n \r\n .aiaf-button {\r\n display: block;\r\n text-align: center;\r\n margin: 0 auto;\r\n width: fit-content;\r\n }\r\n }\r\n \r\n @media (max-width: 480px) {\r\n .aiaf-about-section {\r\n padding: 40px 0;\r\n }\r\n \r\n .aiaf-title {\r\n font-size: 28px;\r\n }\r\n \r\n .aiaf-description {\r\n font-size: 15px;\r\n }\r\n \r\n .aiaf-button {\r\n padding: 12px 30px;\r\n font-size: 15px;\r\n }\r\n \r\n .aiaf-image {\r\n height: 300px;\r\n }\r\n \r\n .shape-1, .shape-2, .shape-3, .shape-4 {\r\n display: none;\r\n }\r\n \r\n .image-container {\r\n width: 90%;\r\n height: 90%;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <section class=\"aiaf-about-section\">\r\n <div class=\"aiaf-container\">\r\n <div class=\"aiaf-columns\">\r\n \r\n <div class=\"aiaf-content\">\r\n <span class=\"aiaf-subtitle\">About Our Foundation<\/span>\r\n <h2 class=\"aiaf-title\">Transforming Lives Through <span>Compassionate Action<\/span><\/h2>\r\n <p class=\"aiaf-description\">\r\n Ihsan Foundation is an independent, non-profit organization founded by Somali professionals, volunteers, and scholars to support vulnerable communities through Islamic values of mercy, justice, and solidarity. Our foundation works tirelessly to address the most pressing challenges facing communities across Africa\r\n <\/p>\r\n <p class=\"aiaf-description\">\r\n Our mission is to alleviate suffering, empower communities, and foster sustainable development through impactful projects in education, healthcare, emergency relief, and economic empowerment. We believe in creating lasting change through collaboration, compassion, and community-driven solutions.\r\n <\/p>\r\n <a href=\"#\" class=\"aiaf-button\">Learn More About Us<\/a>\r\n <\/div>\r\n \r\n \r\n <div class=\"aiaf-image\">\r\n <div class=\"image-mask\">\r\n <div class=\"mask-shape shape-1\"><\/div>\r\n <div class=\"mask-shape shape-2\"><\/div>\r\n <div class=\"mask-shape shape-3\"><\/div>\r\n <div class=\"mask-shape shape-4\"><\/div>\r\n <div class=\"image-container shape-clip\">\r\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2026\/01\/Orphan-Project-2-1-scaled.jpg\" alt=\"AIAF Community Work\" class=\"about-image\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3887ce0 e-flex e-con-boxed e-con e-parent\" data-id=\"3887ce0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-867393f elementor-widget elementor-widget-html\" data-id=\"867393f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-news\">\n\n <div class=\"ihsan-news__header\">\n <h2 class=\"ihsan-news__headline\">Latest News<\/h2>\n <\/div>\n\n <div class=\"ihsan-news__inner\" id=\"ihsanNewsInner\">\n\n \n <div class=\"ihsan-news__hero ihsan-news__skel-hero\">\n <div class=\"ihsan-news__skel-img\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:40%;height:13px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:22px;margin-top:10px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:80%;height:22px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:70%;height:14px;margin-top:10px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:70%;height:14px;\"><\/div>\n <\/div>\n <\/div>\n\n <div class=\"ihsan-news__sidebar\">\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.05s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.1s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.15s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <div class=\"ihsan-news__side-card ihsan-news__skel-side\" style=\"animation-delay:.2s\">\n <div class=\"ihsan-news__skel-thumb\"><\/div>\n <div class=\"ihsan-news__skel-body\">\n <div class=\"ihsan-news__skel-line\" style=\"width:55%;height:11px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:90%;height:15px;margin-top:8px;\"><\/div>\n <div class=\"ihsan-news__skel-line\" style=\"width:75%;height:15px;\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <\/div>\n\n \n <div class=\"ihsan-news__grid\" id=\"ihsanNewsGrid\"><\/div>\n\n <div class=\"ihsan-news__load-more-wrap\" id=\"ihsanLoadMoreWrap\" style=\"display:none;\">\n <button type=\"button\" class=\"ihsan-news__load-more\" id=\"ihsanLoadMoreBtn\">\n <span class=\"ihsan-news__load-more-text\">Load More<\/span>\n <span class=\"ihsan-news__load-more-spinner\" aria-hidden=\"true\"><\/span>\n <\/button>\n <\/div>\n\n <div class=\"ihsan-news__error\" id=\"ihsanNewsError\" style=\"display:none;\"><\/div>\n\n<\/section>\n\n<style>\n#ihsan-news {\n --n-green: #1f7a4d;\n --n-green-dark: #155c39;\n --n-green-mid: #2a8f5a;\n --n-text-dark: #16241c;\n --n-text-body: #5b6b62;\n --n-text-muted: #8a9e93;\n --n-bg: #eef3ee;\n --n-white: #ffffff;\n --n-radius: 16px;\n --n-radius-sm: 10px;\n\n background: var(--n-bg);\n padding: 60px 24px 70px;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-news * { box-sizing: border-box; }\n\n\/* \u2500\u2500 HEADLINE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__header {\n max-width: 1240px;\n margin: 0 auto 32px;\n}\n\n.ihsan-news__headline {\n font-size: clamp(26px, 3.2vw, 36px);\n font-weight: 800;\n color: var(--n-text-dark);\n margin: 0;\n line-height: 1.15;\n padding-left: 20px;\n border-left: 5px solid var(--n-green-dark);\n}\n\n\/* \u2500\u2500 INNER LAYOUT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__inner {\n max-width: 1240px;\n margin: 0 auto;\n display: grid;\n grid-template-columns: 1fr 380px;\n gap: 20px;\n align-items: start;\n}\n\n\/* \u2500\u2500 HERO CARD (left, large) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__hero {\n background: var(--n-white);\n border-radius: var(--n-radius);\n overflow: hidden;\n box-shadow: 0 8px 28px -8px rgba(22,36,28,.13);\n display: flex;\n flex-direction: column;\n text-decoration: none;\n transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;\n opacity: 0;\n animation: ihsanNewsFade .55s ease forwards;\n}\n\n.ihsan-news__hero:hover {\n transform: translateY(-5px);\n box-shadow: 0 20px 40px -12px rgba(22,36,28,.2);\n}\n\n\/* Hero image *\/\n.ihsan-news__hero-img {\n position: relative;\n width: 100%;\n height: 340px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n flex-shrink: 0;\n}\n\n.ihsan-news__hero-img img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .6s ease;\n}\n\n.ihsan-news__hero:hover .ihsan-news__hero-img img {\n transform: scale(1.05);\n}\n\n\/* Hero body *\/\n.ihsan-news__hero-body {\n padding: 28px 30px 32px;\n}\n\n.ihsan-news__eyebrow {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 14px;\n}\n\n.ihsan-news__eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 6px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__hero-title {\n font-size: clamp(20px, 2.2vw, 26px);\n font-weight: 800;\n color: var(--n-text-dark);\n line-height: 1.25;\n margin: 0 0 14px;\n}\n\n.ihsan-news__hero-excerpt {\n font-size: 15px;\n line-height: 1.65;\n color: var(--n-text-body);\n margin: 0 0 24px;\n}\n\n.ihsan-news__hero-actions {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.ihsan-news__btn-primary {\n display: inline-flex;\n align-items: center;\n padding: 11px 24px;\n border-radius: 50px;\n background: var(--n-green-dark);\n color: var(--n-white);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: background .25s, transform .25s, box-shadow .25s;\n}\n\n.ihsan-news__btn-primary:hover {\n background: var(--n-green-mid);\n transform: translateY(-2px);\n box-shadow: 0 10px 20px -6px rgba(21,92,57,.4);\n}\n\n.ihsan-news__btn-ghost {\n display: inline-flex;\n align-items: center;\n padding: 11px 22px;\n border-radius: 50px;\n background: transparent;\n border: 1.5px solid #c8d9cc;\n color: var(--n-text-dark);\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n transition: border-color .25s, background .25s;\n}\n\n.ihsan-news__btn-ghost:hover {\n border-color: var(--n-green-dark);\n background: rgba(21,92,57,.05);\n}\n\n\/* \u2500\u2500 SIDEBAR (right column) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__sidebar {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n\n\/* \u2500\u2500 SIDEBAR CARD \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__side-card {\n background: var(--n-white);\n border-radius: var(--n-radius-sm);\n overflow: hidden;\n box-shadow: 0 4px 16px -6px rgba(22,36,28,.1);\n display: flex;\n gap: 0;\n text-decoration: none;\n transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;\n opacity: 0;\n animation: ihsanNewsFade .55s ease forwards;\n}\n\n.ihsan-news__side-card:hover {\n transform: translateY(-3px);\n box-shadow: 0 12px 26px -8px rgba(22,36,28,.18);\n}\n\n\/* Sidebar thumbnail *\/\n.ihsan-news__side-thumb {\n width: 110px;\n min-width: 110px;\n height: 110px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n flex-shrink: 0;\n}\n\n.ihsan-news__side-thumb img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-news__side-card:hover .ihsan-news__side-thumb img {\n transform: scale(1.08);\n}\n\n\/* Sidebar card body *\/\n.ihsan-news__side-body {\n padding: 14px 16px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1;\n min-width: 0;\n}\n\n.ihsan-news__side-eyebrow {\n font-size: 10.5px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 6px;\n display: flex;\n gap: 5px;\n align-items: center;\n}\n\n.ihsan-news__side-eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 5px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__side-title {\n font-size: 14.5px;\n font-weight: 700;\n color: var(--n-text-dark);\n line-height: 1.35;\n margin: 0 0 6px;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.ihsan-news__side-excerpt {\n font-size: 12.5px;\n line-height: 1.55;\n color: var(--n-text-body);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\/* \u2500\u2500 LOAD-MORE GRID (extra posts) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__grid {\n max-width: 1240px;\n margin: 24px auto 0;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 20px;\n}\n\n.ihsan-news__grid-card {\n background: var(--n-white);\n border-radius: var(--n-radius-sm);\n overflow: hidden;\n box-shadow: 0 4px 16px -6px rgba(22,36,28,.1);\n display: flex;\n flex-direction: column;\n text-decoration: none;\n transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;\n opacity: 0;\n animation: ihsanNewsFade .5s ease forwards;\n}\n\n.ihsan-news__grid-card:hover {\n transform: translateY(-4px);\n box-shadow: 0 14px 28px -8px rgba(22,36,28,.18);\n}\n\n.ihsan-news__grid-thumb {\n width: 100%;\n height: 180px;\n overflow: hidden;\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n}\n\n.ihsan-news__grid-thumb img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-news__grid-card:hover .ihsan-news__grid-thumb img {\n transform: scale(1.06);\n}\n\n.ihsan-news__grid-body {\n padding: 18px 20px 20px;\n flex: 1;\n display: flex;\n flex-direction: column;\n}\n\n.ihsan-news__grid-eyebrow {\n font-size: 10.5px;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: .07em;\n color: var(--n-green-dark);\n margin-bottom: 8px;\n display: flex;\n gap: 5px;\n align-items: center;\n}\n\n.ihsan-news__grid-eyebrow span + span::before {\n content: \"\u00b7\";\n margin-right: 5px;\n color: var(--n-text-muted);\n font-weight: 400;\n}\n\n.ihsan-news__grid-title {\n font-size: 16px;\n font-weight: 700;\n color: var(--n-text-dark);\n line-height: 1.35;\n margin: 0 0 8px;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.ihsan-news__grid-excerpt {\n font-size: 13px;\n line-height: 1.6;\n color: var(--n-text-body);\n margin: 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\/* \u2500\u2500 LOAD MORE BUTTON \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__load-more-wrap {\n display: flex;\n justify-content: center;\n margin-top: 36px;\n}\n\n.ihsan-news__load-more {\n display: inline-flex;\n align-items: center;\n gap: 10px;\n padding: 13px 32px;\n border-radius: 50px;\n background: var(--n-white);\n border: 1.5px solid var(--n-green-dark);\n color: var(--n-green-dark);\n font-weight: 800;\n font-size: 14px;\n font-family: inherit;\n cursor: pointer;\n transition: background .25s, color .25s, transform .25s, box-shadow .25s;\n}\n\n.ihsan-news__load-more:hover {\n background: var(--n-green-dark);\n color: var(--n-white);\n transform: translateY(-2px);\n box-shadow: 0 10px 20px -6px rgba(21,92,57,.3);\n}\n\n.ihsan-news__load-more:disabled {\n cursor: default;\n opacity: .75;\n transform: none;\n box-shadow: none;\n}\n\n.ihsan-news__load-more-spinner {\n display: none;\n width: 14px;\n height: 14px;\n border: 2px solid currentColor;\n border-top-color: transparent;\n border-radius: 50%;\n animation: ihsanNewsSpin .7s linear infinite;\n}\n\n.ihsan-news__load-more.is-loading .ihsan-news__load-more-spinner {\n display: inline-block;\n}\n\n\/* \u2500\u2500 SKELETON \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__skel-img {\n width: 100%;\n height: 340px;\n background: #dde5de;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-body {\n padding: 28px 30px;\n flex: 1;\n}\n\n.ihsan-news__skel-thumb {\n width: 110px;\n min-width: 110px;\n height: 110px;\n background: #dde5de;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-line {\n height: 13px;\n border-radius: 6px;\n background: #dde5de;\n margin-bottom: 10px;\n animation: ihsanNewsPulse 1.4s ease-in-out infinite;\n}\n\n.ihsan-news__skel-hero { pointer-events: none; }\n.ihsan-news__skel-side { pointer-events: none; }\n\n\/* \u2500\u2500 ERROR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-news__error {\n max-width: 1240px;\n margin: 20px auto 0;\n padding: 16px 20px;\n background: #fdf2f2;\n border-radius: var(--n-radius-sm);\n color: #b3261e;\n font-size: 14px;\n}\n\n\/* \u2500\u2500 ANIMATIONS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@keyframes ihsanNewsFade {\n from { opacity: 0; transform: translateY(14px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n@keyframes ihsanNewsPulse {\n 0%, 100% { opacity: 1; }\n 50% { opacity: .45; }\n}\n\n@keyframes ihsanNewsSpin {\n to { transform: rotate(360deg); }\n}\n\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@media (max-width: 900px) {\n .ihsan-news__inner {\n grid-template-columns: 1fr;\n }\n .ihsan-news__sidebar {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .ihsan-news__side-card {\n flex: 1 1 calc(50% - 7px);\n min-width: 240px;\n }\n .ihsan-news__grid {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n\n@media (max-width: 580px) {\n #ihsan-news { padding: 40px 16px 56px; }\n .ihsan-news__hero-img { height: 220px; }\n .ihsan-news__hero-body { padding: 20px 20px 24px; }\n .ihsan-news__sidebar { flex-direction: column; }\n .ihsan-news__side-card { flex: 1 1 100%; }\n .ihsan-news__grid { grid-template-columns: 1fr; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-news * { animation: none !important; transition: none !important; opacity: 1 !important; transform: none !important; }\n}\n<\/style>\n\n<script>\n(function () {\n\n \/* =================================================================\n CONFIG \u2014 edit these to match your site\n ================================================================= *\/\n\n var SITE_ORIGIN = \"https:\/\/ihsaanfoundation.org\";\n var WP_BASE_PRETTY = SITE_ORIGIN + \"\/wp-json\/wp\/v2\";\n var WP_BASE_PLAIN = SITE_ORIGIN + \"\/?rest_route=\/wp\/v2\";\n var WP_BASE = WP_BASE_PRETTY;\n\n \/* Posts shown on first load: 1 hero + 4 sidebar = 5 *\/\n var INITIAL_COUNT = 5;\n \/* Posts fetched per \"Load More\" click (fills a 3-col grid row) *\/\n var LOAD_MORE_COUNT = 3;\n\n \/* =================================================================\n AUTO-DETECT ENDPOINT\n ================================================================= *\/\n\n var endpointReady = fetch(WP_BASE_PRETTY + \"\/posts?per_page=1\")\n .then(function (res) {\n if (res.ok) { WP_BASE = WP_BASE_PRETTY; }\n else { throw 0; }\n })\n .catch(function () { WP_BASE = WP_BASE_PLAIN; });\n\n \/* =================================================================\n HELPERS\n ================================================================= *\/\n\n function stripHtml(html) {\n var d = document.createElement(\"div\");\n d.innerHTML = html || \"\";\n return (d.textContent || d.innerText || \"\").trim();\n }\n\n function truncate(text, max) {\n if (text.length <= max) return text;\n return text.slice(0, max).replace(\/\\s+\\S*$\/, \"\") + \"\u2026\";\n }\n\n \/*\n * getFeaturedImage\n * Tries every known location WordPress puts the featured image URL.\n *\/\n function getFeaturedImage(post) {\n try {\n var media = post._embedded[\"wp:featuredmedia\"][0];\n if (media && media.source_url) return media.source_url;\n var sizes = media.media_details && media.media_details.sizes;\n if (sizes) {\n return (sizes.full && sizes.full.source_url) ||\n (sizes.large && sizes.large.source_url) ||\n (sizes.medium && sizes.medium.source_url) || \"\";\n }\n } catch (e) {}\n if (post.featured_media_url) return post.featured_media_url;\n if (post.jetpack_featured_media_url) return post.jetpack_featured_media_url;\n return \"\";\n }\n\n \/* Returns array like [\"CATEGORY\", \"SUBCATEGORY\"] from embedded terms *\/\n function getEyebrow(post) {\n try {\n var terms = post._embedded[\"wp:term\"][0];\n if (terms && terms.length) {\n return terms.slice(0, 2).map(function (t) { return t.name.toUpperCase(); });\n }\n } catch (e) {}\n return [\"UPDATE\"];\n }\n\n \/* =================================================================\n BUILD HERO CARD (latest post)\n ================================================================= *\/\n\n function buildHero(post) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 160);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var hero = document.createElement(\"a\");\n hero.href = link;\n hero.className = \"ihsan-news__hero\";\n hero.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n hero.innerHTML =\n '<div class=\"ihsan-news__hero-img\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"' + title.replace(\/\"\/g, \"\") + '\" loading=\"eager\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__hero-body\">' +\n '<div class=\"ihsan-news__eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<h2 class=\"ihsan-news__hero-title\">' + title + '<\/h2>' +\n '<p class=\"ihsan-news__hero-excerpt\">' + excerpt + '<\/p>' +\n '<div class=\"ihsan-news__hero-actions\">' +\n '<a class=\"ihsan-news__btn-primary\" href=\"' + link + '\">Read Full Update<\/a>' +\n '<a class=\"ihsan-news__btn-ghost\" href=\"' + link + '\">Share<\/a>' +\n '<\/div>' +\n '<\/div>';\n\n return hero;\n }\n\n \/* =================================================================\n BUILD SIDEBAR CARD\n ================================================================= *\/\n\n function buildSideCard(post, delay) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 90);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var card = document.createElement(\"a\");\n card.href = link;\n card.className = \"ihsan-news__side-card\";\n card.style.animationDelay = delay + \"s\";\n card.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n card.innerHTML =\n '<div class=\"ihsan-news__side-thumb\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"\" loading=\"lazy\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__side-body\">' +\n '<div class=\"ihsan-news__side-eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<p class=\"ihsan-news__side-title\">' + title + '<\/p>' +\n '<p class=\"ihsan-news__side-excerpt\">' + excerpt + '<\/p>' +\n '<\/div>';\n\n return card;\n }\n\n \/* =================================================================\n BUILD \"LOAD MORE\" GRID CARD\n ================================================================= *\/\n\n function buildGridCard(post, delay) {\n var title = stripHtml(post.title.rendered);\n var excerpt = truncate(stripHtml(post.excerpt.rendered), 110);\n var image = getFeaturedImage(post);\n var cats = getEyebrow(post);\n var link = post.link;\n\n var card = document.createElement(\"a\");\n card.href = link;\n card.className = \"ihsan-news__grid-card\";\n card.style.animationDelay = delay + \"s\";\n card.setAttribute(\"aria-label\", title);\n\n var eyebrowHtml = cats.map(function (c) {\n return '<span>' + c + '<\/span>';\n }).join(\"\");\n\n card.innerHTML =\n '<div class=\"ihsan-news__grid-thumb\">' +\n (image ? '<img decoding=\"async\" src=\"' + image + '\" alt=\"\" loading=\"lazy\" \/>' : \"\") +\n '<\/div>' +\n '<div class=\"ihsan-news__grid-body\">' +\n '<div class=\"ihsan-news__grid-eyebrow\">' + eyebrowHtml + '<\/div>' +\n '<p class=\"ihsan-news__grid-title\">' + title + '<\/p>' +\n '<p class=\"ihsan-news__grid-excerpt\">' + excerpt + '<\/p>' +\n '<\/div>';\n\n return card;\n }\n\n \/* =================================================================\n DOM REFS\n ================================================================= *\/\n\n var inner = document.getElementById(\"ihsanNewsInner\");\n var gridEl = document.getElementById(\"ihsanNewsGrid\");\n var errorBox = document.getElementById(\"ihsanNewsError\");\n var loadMoreWrap = document.getElementById(\"ihsanLoadMoreWrap\");\n var loadMoreBtn = document.getElementById(\"ihsanLoadMoreBtn\");\n\n var loadedCount = 0;\n var totalPosts = null; \/* filled in from X-WP-Total header when available *\/\n var isLoading = false;\n\n function showError(message) {\n errorBox.style.display = \"block\";\n errorBox.textContent = message;\n }\n\n function readTotalHeader(res) {\n try {\n var totalHeader = res.headers.get(\"X-WP-Total\");\n if (totalHeader !== null && totalHeader !== \"\") {\n return parseInt(totalHeader, 10);\n }\n } catch (e) {}\n return null;\n }\n\n \/* =================================================================\n INITIAL FETCH & RENDER\n ================================================================= *\/\n\n endpointReady.then(function () {\n var url = WP_BASE + \"\/posts?_embed=wp:featuredmedia,wp:term&per_page=\" + INITIAL_COUNT + \"&orderby=date&order=desc\";\n\n return fetch(url).then(function (res) {\n if (!res.ok) throw new Error(\"HTTP \" + res.status);\n var headerTotal = readTotalHeader(res);\n if (headerTotal !== null) totalPosts = headerTotal;\n return res.json();\n });\n })\n .then(function (posts) {\n if (!posts || !posts.length) {\n inner.innerHTML = '<p style=\"color:#5b6b62;padding:20px 0;\">No posts found.<\/p>';\n return;\n }\n\n \/* Clear skeletons *\/\n inner.innerHTML = \"\";\n\n \/* Hero = first (latest) post *\/\n inner.appendChild(buildHero(posts[0]));\n\n \/* Sidebar = remaining posts from this batch *\/\n var sidebar = document.createElement(\"div\");\n sidebar.className = \"ihsan-news__sidebar\";\n\n posts.slice(1).forEach(function (post, i) {\n sidebar.appendChild(buildSideCard(post, 0.08 + i * 0.08));\n });\n\n inner.appendChild(sidebar);\n\n loadedCount = posts.length;\n\n var hasMore = (totalPosts !== null)\n ? loadedCount < totalPosts\n : posts.length === INITIAL_COUNT; \/* no total header: assume more if we got a full page *\/\n\n loadMoreWrap.style.display = hasMore ? \"flex\" : \"none\";\n })\n .catch(function (err) {\n inner.innerHTML = \"\";\n showError(\"Couldn't load latest posts: \" + (err && err.message ? err.message : \"Unknown error\"));\n console.error(\"Ihsan latest posts error:\", err, \"| WP_BASE:\", WP_BASE);\n });\n\n \/* =================================================================\n LOAD MORE\n ================================================================= *\/\n\n loadMoreBtn.addEventListener(\"click\", function () {\n if (isLoading) return;\n isLoading = true;\n loadMoreBtn.classList.add(\"is-loading\");\n loadMoreBtn.disabled = true;\n\n var url = WP_BASE + \"\/posts?_embed=wp:featuredmedia,wp:term&per_page=\" + LOAD_MORE_COUNT +\n \"&offset=\" + loadedCount + \"&orderby=date&order=desc\";\n\n fetch(url)\n .then(function (res) {\n if (!res.ok) throw new Error(\"HTTP \" + res.status);\n var headerTotal = readTotalHeader(res);\n if (headerTotal !== null) totalPosts = headerTotal;\n return res.json();\n })\n .then(function (posts) {\n posts.forEach(function (post, i) {\n gridEl.appendChild(buildGridCard(post, i * 0.06));\n });\n\n loadedCount += posts.length;\n\n var noMoreLeft = (totalPosts !== null)\n ? loadedCount >= totalPosts\n : posts.length < LOAD_MORE_COUNT; \/* fewer than requested = end of list *\/\n\n if (!posts.length || noMoreLeft) {\n loadMoreWrap.style.display = \"none\";\n }\n })\n .catch(function (err) {\n showError(\"Couldn't load more posts: \" + (err && err.message ? err.message : \"Unknown error\"));\n console.error(\"Ihsan load-more error:\", err);\n })\n .then(function () {\n isLoading = false;\n loadMoreBtn.classList.remove(\"is-loading\");\n loadMoreBtn.disabled = false;\n }, function () {\n isLoading = false;\n loadMoreBtn.classList.remove(\"is-loading\");\n loadMoreBtn.disabled = false;\n });\n });\n\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4669c1a e-flex e-con-boxed e-con e-parent\" data-id=\"4669c1a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-277ee74c elementor-widget elementor-widget-elementskit-heading\" data-id=\"277ee74c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"elementskit-heading.default\">\n\t\t\t\t\t<div class=\"ekit-wid-con\" ><div class=\"ekit-heading elementskit-section-title-wraper center ekit_heading_tablet- ekit_heading_mobile-\"><h3 class=\"ekit-heading--title elementskit-section-title \">Our Team<\/h3><div class=\"ekit_heading_separetor_wraper ekit_heading_elementskit-border-divider ekit-dotted\"><div class=\"elementskit-border-divider ekit-dotted\"><\/div><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a312d77 elementor-widget elementor-widget-html\" data-id=\"a312d77\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n\n<section id=\"ihsan-team\">\n\n <div class=\"ihsan-team__inner\">\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Mohamed-Abdullahi-Shoble-scaled.jpg\" alt=\"Mohamed Abdullahi Shoble\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Mohamed Abdullahi Shoble<\/h3>\n <p class=\"ihsan-team__role\">Chairman<\/p>\n <\/a>\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Mohamed-Ahmed-Mohamed-scaled.jpg\" alt=\"Mohamed Ahmed Mohamed\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Mohamed Ahmed Mohamed<\/h3>\n <p class=\"ihsan-team__role\">Vice Chairman<\/p>\n <\/a>\n\n <a class=\"ihsan-team__card\" href=\"#\">\n <div class=\"ihsan-team__avatar\">\n <img decoding=\"async\" src=\"https:\/\/ihsaanfoundation.org\/wp-content\/uploads\/2025\/10\/Abdirahman-Ali-Elmi-scaled.jpg\" alt=\"Abdirahman Ali Elmi\" loading=\"lazy\" onerror=\"this.style.display='none'\">\n <\/div>\n <h3 class=\"ihsan-team__name\">Abdirahman Ali Elmi<\/h3>\n <p class=\"ihsan-team__role\">Secretary<\/p>\n <\/a>\n\n <\/div>\n\n<\/section>\n\n<style>\n#ihsan-team {\n --n-green: #1f7a4d;\n --n-green-dark: #155c39;\n --n-green-mid: #2a8f5a;\n --n-text-dark: #16241c;\n --n-text-body: #5b6b62;\n --n-text-muted: #8a9e93;\n --n-bg: #ffffff;\n --n-white: #ffffff;\n\n background: var(--n-bg);\n padding: 64px 24px 70px;\n box-sizing: border-box;\n overflow-x: hidden;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n}\n\n#ihsan-team * { box-sizing: border-box; }\n\n.ihsan-team__inner {\n max-width: 1100px;\n margin: 0 auto;\n display: flex;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: flex-start;\n gap: clamp(12px, 4vw, 36px);\n}\n\n.ihsan-team__card {\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n text-decoration: none;\n padding: 8px 0 0;\n border-radius: 18px;\n flex: 1 1 0;\n min-width: 0;\n max-width: 320px;\n transition: transform .3s cubic-bezier(.2,.8,.2,1);\n}\n\n.ihsan-team__card:hover {\n transform: translateY(-4px);\n}\n\n.ihsan-team__card:focus-visible {\n outline: 2px solid var(--n-green-dark);\n outline-offset: 4px;\n border-radius: 18px;\n}\n\n\/* \u2500\u2500 CIRCLE AVATAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-team__avatar {\n width: clamp(72px, 24vw, 190px);\n height: clamp(72px, 24vw, 190px);\n border-radius: 50%;\n overflow: hidden;\n margin: 0 auto clamp(10px, 2.5vw, 22px);\n background: linear-gradient(135deg, var(--n-green), #bcd95f);\n box-shadow: 0 0 0 4px var(--n-white), 0 10px 26px -8px rgba(22,36,28,.22);\n transition: box-shadow .3s ease;\n}\n\n.ihsan-team__card:hover .ihsan-team__avatar {\n box-shadow: 0 0 0 4px var(--n-white), 0 0 0 7px var(--n-green-mid), 0 16px 32px -10px rgba(22,36,28,.28);\n}\n\n.ihsan-team__avatar img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n transition: transform .5s ease;\n}\n\n.ihsan-team__card:hover .ihsan-team__avatar img {\n transform: scale(1.07);\n}\n\n\/* \u2500\u2500 TEXT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ihsan-team__name {\n font-size: clamp(12px, 3.2vw, 19px);\n font-weight: 800;\n color: var(--n-text-dark);\n margin: 0 0 4px;\n line-height: 1.3;\n padding: 0 4px;\n}\n\n.ihsan-team__role {\n font-size: clamp(9.5px, 2.2vw, 13.5px);\n font-weight: 600;\n color: var(--n-green-dark);\n text-transform: uppercase;\n letter-spacing: .05em;\n margin: 0;\n}\n\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@media (max-width: 700px) {\n #ihsan-team { padding: 48px 16px 56px; }\n}\n\n@media (max-width: 400px) {\n #ihsan-team { padding: 36px 10px 44px; }\n .ihsan-team__inner { gap: 10px; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n #ihsan-team * { transition: none !important; transform: none !important; }\n}\n<\/style>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3eba5017 e-flex e-con-boxed e-con e-parent\" data-id=\"3eba5017\" data-element_type=\"container\" data-e-type=\"container\" id=\"xs_team_3\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-44d2b55c e-con-full e-grid e-con e-child\" data-id=\"44d2b55c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n <div class=\"xs_social_share_widget xs_share_url after_content \t\tmain_content wslu-style-1 wslu-share-box-shaped wslu-fill-colored wslu-none wslu-share-horizontal wslu-theme-font-no wslu-main_content\">\n\n\t\t\n <ul>\n\t\t\t <\/ul>\n <\/div> \n","protected":false},"excerpt":{"rendered":"<p>Ihsan Foundation Slider 01 \/ 04 Our Mission Empowering vulnerable communities across Africa A humanitarian organization led by Somali professionals and scholars \u2014 driven by compassion, education, and the Islamic principles of mercy, justice, and solidarity. Our Vision A world where no community is left behind Founded by Somali professionals, volunteers, and scholars committed to […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"postBodyCss":"","postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"footnotes":""},"class_list":["post-25","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/comments?post=25"}],"version-history":[{"count":142,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25\/revisions"}],"predecessor-version":[{"id":722,"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/pages\/25\/revisions\/722"}],"wp:attachment":[{"href":"https:\/\/ihsaanfoundation.org\/index.php\/wp-json\/wp\/v2\/media?parent=25"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}