{"id":654,"date":"2026-01-05T15:58:54","date_gmt":"2026-01-05T15:58:54","guid":{"rendered":"https:\/\/gihd.edu.pk\/fansforkids\/?page_id=654"},"modified":"2026-03-26T06:55:36","modified_gmt":"2026-03-26T06:55:36","slug":"elementor-654","status":"publish","type":"page","link":"https:\/\/gihd.edu.pk\/fansforkids\/","title":{"rendered":"Home Page"},"content":{"rendered":"\n\n\n\n\n\n\n\nFans For Kids<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap\" rel=\"stylesheet\">\n<style>\n\/* \u2500\u2500 RESET & ROOT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }\nhtml { scroll-behavior:smooth; }\n\n:root {\n --bg-1:#eef6ff;\n --bg-2:#e9fbff;\n --primary:#6c63ff;\n --primary-dark:#5548ff;\n --secondary:#00bcd4;\n --accent:#ff758c;\n --accent-2:#ff7eb9;\n --text:#1f2937;\n --muted:#5b6472;\n --white:#ffffff;\n --glass:rgba(255,255,255,0.72);\n --glass-strong:rgba(255,255,255,0.84);\n --border:rgba(255,255,255,0.34);\n --shadow:0 10px 30px rgba(31,41,55,0.08);\n --shadow-lg:0 18px 50px rgba(31,41,55,0.14);\n --radius-xl:28px;\n --radius-lg:22px;\n --radius-md:16px;\n --radius-sm:12px;\n}\n\na { text-decoration:none; color:inherit; }\nimg { max-width:100%; display:block; }\n\n\/* \u2500\u2500 BODY \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\nbody {\n font-family:'Inter',sans-serif;\n color:var(--text);\n background:\n radial-gradient(circle at top left, rgba(108,99,255,0.14), transparent 28%),\n radial-gradient(circle at top right, rgba(0,188,212,0.12), transparent 24%),\n linear-gradient(160deg, var(--bg-1), var(--bg-2));\n line-height:1.65;\n overflow-x:hidden;\n \/* prevent accidental horizontal scroll on all devices *\/\n max-width:100vw;\n}\n\n\/* \u2500\u2500 CONTAINER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.container {\n width:min(1200px, calc(100% - 32px));\n margin-inline:auto;\n}\n\n\/* \u2500\u2500 SECTION \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.section {\n position:relative;\n margin-top:28px;\n padding:clamp(24px, 5vw, 60px) clamp(20px, 4vw, 48px);\n background:var(--glass);\n border:1px solid var(--border);\n border-radius:var(--radius-xl);\n backdrop-filter:blur(14px);\n -webkit-backdrop-filter:blur(14px);\n box-shadow:var(--shadow);\n overflow:hidden;\n}\n\n.section::before {\n content:\"\";\n position:absolute;\n width:200px; height:200px;\n right:-80px; top:-80px;\n border-radius:50%;\n background:radial-gradient(circle, rgba(108,99,255,0.10), transparent 70%);\n pointer-events:none;\n}\n\n.section h2 {\n font-size:clamp(24px, 4vw, 42px);\n text-align:center;\n margin-bottom:14px;\n font-weight:800;\n letter-spacing:-0.03em;\n color:#111827;\n}\n\n.section-intro {\n max-width:820px;\n margin:0 auto;\n text-align:center;\n color:var(--muted);\n font-size:clamp(14px, 2vw, 18px);\n line-height:1.8;\n}\n\n\/* \u2500\u2500 BG ORBS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.bg-orb {\n position:fixed;\n border-radius:50%;\n filter:blur(50px);\n opacity:0.28;\n z-index:-1;\n pointer-events:none;\n}\n.bg-orb.one { width:220px; height:220px; left:-50px; top:100px; background:#7c72ff; }\n.bg-orb.two { width:260px; height:260px; right:-70px; top:260px; background:#67dff0; }\n.bg-orb.three { width:220px; height:220px; left:18%; bottom:40px;background:#ff8faf; }\n\n\/* \u2500\u2500 HERO WRAP \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.hero-wrap {\n width:min(1240px, calc(100% - 20px));\n margin:18px auto 0;\n}\n\n\/* \u2500\u2500 HERO \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.hero {\n position:relative;\n overflow:hidden;\n border-radius:34px;\n padding:clamp(52px, 9vw, 130px) clamp(20px, 5vw, 56px);\n text-align:center;\n background:\n linear-gradient(135deg, rgba(108,99,255,0.95), rgba(0,188,212,0.88)),\n linear-gradient(135deg, #6c63ff, #00bcd4);\n color:#fff;\n box-shadow:0 26px 60px rgba(0,0,0,0.14);\n}\n\n.hero::before {\n content:\"\";\n position:absolute;\n width:300px; height:300px;\n background:rgba(255,255,255,0.12);\n border-radius:50%;\n top:-110px; left:-80px;\n}\n\n.hero::after {\n content:\"\";\n position:absolute;\n width:380px; height:380px;\n background:rgba(255,255,255,0.10);\n border-radius:50%;\n right:-120px; bottom:-180px;\n}\n\n.hero h1 {\n position:relative; z-index:1;\n font-size:clamp(28px, 6vw, 62px);\n line-height:1.1;\n font-weight:900;\n margin-bottom:16px;\n letter-spacing:-0.04em;\n}\n\n.hero p {\n position:relative; z-index:1;\n max-width:780px;\n margin:0 auto;\n font-size:clamp(15px, 2.1vw, 21px);\n color:rgba(255,255,255,0.94);\n padding:0 8px;\n}\n\n\/* \u2500\u2500 HERO BUTTONS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.hero-btns {\n position:relative; z-index:1;\n display:flex;\n gap:14px;\n justify-content:center;\n flex-wrap:wrap;\n margin-top:32px;\n}\n\n.btn {\n display:inline-flex;\n align-items:center;\n justify-content:center;\n min-height:52px;\n padding:13px 26px;\n border-radius:14px;\n font-weight:700;\n letter-spacing:.01em;\n font-size:clamp(14px, 1.8vw, 16px);\n transition:all .35s ease;\n position:relative;\n overflow:hidden;\n white-space:nowrap;\n}\n\n.btn-primary {\n color:#fff;\n background:linear-gradient(90deg, var(--accent-2), var(--accent));\n box-shadow:0 14px 26px rgba(255,117,140,0.28);\n}\n\n.btn-secondary {\n color:#fff;\n background:rgba(255,255,255,0.14);\n border:1px solid rgba(255,255,255,0.26);\n backdrop-filter:blur(10px);\n}\n\n.btn:hover { transform:translateY(-4px) scale(1.02); }\n.btn-primary:hover { box-shadow:0 18px 36px rgba(255,117,140,0.36); }\n.btn-secondary:hover { background:rgba(255,255,255,0.20); }\n\n\/* \u2500\u2500 HERO MINI STATS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.hero-mini-stats {\n position:relative; z-index:1;\n display:grid;\n grid-template-columns:repeat(3, 1fr);\n gap:14px;\n max-width:860px;\n margin:34px auto 0;\n width:100%;\n}\n\n.hero-mini-card {\n padding:16px 14px;\n border-radius:16px;\n background:rgba(255,255,255,0.14);\n border:1px solid rgba(255,255,255,0.18);\n backdrop-filter:blur(8px);\n}\n\n.hero-mini-card strong {\n display:block;\n font-size:clamp(20px, 3vw, 28px);\n font-weight:800;\n}\n\n.hero-mini-card span {\n display:block;\n font-size:clamp(12px, 1.4vw, 14px);\n opacity:0.95;\n margin-top:4px;\n}\n\n\/* \u2500\u2500 GRID (cards) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.grid {\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));\n gap:24px;\n margin-top:34px;\n}\n\n.card {\n position:relative;\n padding:28px 24px;\n border-radius:22px;\n background:linear-gradient(145deg, rgba(255,255,255,0.96), rgba(241,245,249,0.90));\n border:1px solid rgba(255,255,255,0.56);\n box-shadow:var(--shadow);\n transition:all .35s ease;\n overflow:hidden;\n text-align:center;\n}\n\n.card::before {\n content:\"\";\n position:absolute; inset:0;\n background:linear-gradient(135deg, rgba(108,99,255,0.06), rgba(0,188,212,0.05));\n opacity:0;\n transition:opacity .35s ease;\n}\n\n.card:hover { transform:translateY(-10px); box-shadow:var(--shadow-lg); border-color:rgba(108,99,255,0.20); }\n.card:hover::before { opacity:1; }\n\n.card-icon {\n position:relative; z-index:1;\n width:62px; height:62px;\n margin:0 auto 18px;\n border-radius:18px;\n display:grid; place-items:center;\n font-size:28px; color:#fff;\n background:linear-gradient(135deg, var(--primary), var(--secondary));\n box-shadow:0 14px 22px rgba(108,99,255,0.20);\n}\n\n.card h3 { position:relative; z-index:1; font-size:clamp(18px,2.5vw,22px); margin-bottom:10px; font-weight:800; color:#111827; }\n.card p { position:relative; z-index:1; font-size:clamp(14px,1.8vw,15.8px); color:var(--muted); line-height:1.8; }\n\n\/* \u2500\u2500 STATS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.stats {\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(min(100%, 200px), 1fr));\n gap:22px;\n margin-top:34px;\n}\n\n.stat {\n position:relative; overflow:hidden;\n padding:30px 24px;\n border-radius:22px;\n text-align:center;\n background:linear-gradient(135deg, #6dd5ed, #2193b0);\n color:#fff;\n box-shadow:var(--shadow);\n transition:all .35s ease;\n}\n\n.stat::before {\n content:\"\";\n position:absolute;\n width:140px; height:140px;\n top:-45px; right:-30px;\n border-radius:50%;\n background:rgba(255,255,255,0.18);\n}\n\n.stat:hover { transform:translateY(-8px) scale(1.015); box-shadow:var(--shadow-lg); }\n.stat-icon { font-size:26px; margin-bottom:10px; }\n.stat h4 { font-size:clamp(28px, 4vw, 42px); font-weight:900; margin-bottom:6px; }\n.stat p { font-size:clamp(13px,1.6vw,15px); opacity:0.96; }\n\n\/* \u2500\u2500 VIDEO GRID \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.video-grid {\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));\n gap:24px;\n margin-top:34px;\n}\n\n.video-card {\n position:relative;\n min-height:260px;\n border-radius:22px;\n overflow:hidden;\n box-shadow:var(--shadow);\n transition:all .35s ease;\n isolation:isolate;\n display:block; \/* ensure <a> behaves like block *\/\n}\n\n.video-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-lg); }\n\n.video-card img {\n width:100%; height:100%;\n object-fit:cover;\n transition:transform .6s ease;\n position:absolute; inset:0;\n}\n\n.video-card:hover img { transform:scale(1.08); }\n\n.video-card::after {\n content:\"\";\n position:absolute; inset:0;\n background:linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,.18), transparent);\n}\n\n.video-play {\n position:absolute; top:16px; right:16px; z-index:2;\n width:48px; height:48px;\n display:grid; place-items:center;\n border-radius:50%;\n background:rgba(255,255,255,0.18);\n color:#fff;\n backdrop-filter:blur(8px);\n border:1px solid rgba(255,255,255,0.22);\n font-size:18px;\n}\n\n.video-title {\n position:absolute; left:16px; right:16px; bottom:16px; z-index:2;\n padding:12px 14px;\n border-radius:14px;\n background:rgba(255,255,255,0.14);\n border:1px solid rgba(255,255,255,0.20);\n backdrop-filter:blur(8px);\n color:#fff;\n}\n\n.video-title strong { display:block; font-size:clamp(14px,1.8vw,16px); font-weight:700; }\n.video-title span { display:block; font-size:clamp(11px,1.4vw,13px); opacity:0.92; margin-top:3px; }\n\n\/* \u2500\u2500 CTA BAND \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.cta-band {\n margin-top:28px;\n padding:clamp(20px,3vw,28px) clamp(16px,3vw,24px);\n border-radius:24px;\n text-align:center;\n background:linear-gradient(135deg, rgba(108,99,255,0.10), rgba(0,188,212,0.10));\n border:1px solid rgba(108,99,255,0.08);\n}\n\n.cta-band h3 { font-size:clamp(20px,3.5vw,34px); font-weight:800; margin-bottom:10px; }\n.cta-band p { color:var(--muted); max-width:760px; margin:0 auto; font-size:clamp(14px,1.8vw,16px); }\n\n\/* \u2500\u2500 CONTACT \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.contact-grid {\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr));\n gap:20px;\n margin-top:30px;\n}\n\n.contact-card {\n padding:24px 20px;\n border-radius:20px;\n background:linear-gradient(145deg, #ffffff, #f3f8fc);\n box-shadow:var(--shadow);\n text-align:center;\n transition:all .35s ease;\n border:1px solid rgba(255,255,255,0.48);\n}\n\n.contact-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-lg); }\n\n.contact-icon {\n width:58px; height:58px;\n margin:0 auto 14px;\n border-radius:16px;\n display:grid; place-items:center;\n color:#fff; font-size:24px;\n background:linear-gradient(135deg, var(--primary), var(--secondary));\n box-shadow:0 12px 22px rgba(108,99,255,0.18);\n}\n\n.contact-card h4 { font-size:clamp(16px,2vw,18px); font-weight:800; margin-bottom:6px; }\n.contact-card p { color:var(--muted); word-break:break-word; font-size:clamp(13px,1.6vw,15px); }\n\n\/* \u2500\u2500 FOOTER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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.footer {\n width:min(1200px, calc(100% - 32px));\n margin:26px auto 30px;\n text-align:center;\n color:#667085;\n font-size:clamp(12px,1.4vw,14px);\n padding:0 16px;\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 *\/\n.fade-up { animation:fadeUp .8s ease both; }\n.delay-1 { animation-delay:.08s; }\n.delay-2 { animation-delay:.16s; }\n.delay-3 { animation-delay:.24s; }\n\n@keyframes fadeUp {\n from { opacity:0; transform:translateY(22px); }\n to { opacity:1; transform:translateY(0); }\n}\n\n\/* \u2554\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\u2557\n \u2551 RESPONSIVE BREAKPOINTS \u2551\n \u255a\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\u255d *\/\n\n\/* \u2500\u2500 LARGE DESKTOP 1200px+ \u2500\u2500 (default above, no extra needed) *\/\n\n\/* \u2500\u2500 DESKTOP \/ LARGE TABLET 992px \u2013 1199px \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n@media (max-width:1199px) {\n .hero { border-radius:30px; }\n .hero-mini-stats { max-width:700px; }\n}\n\n\/* \u2500\u2500 TABLET LANDSCAPE 768px \u2013 991px \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:991px) {\n .hero { border-radius:26px; }\n\n \/* Keep 3 columns but compress them *\/\n .hero-mini-stats {\n grid-template-columns:repeat(3, 1fr);\n max-width:600px;\n gap:10px;\n }\n\n .hero-mini-card strong { font-size:22px; }\n .hero-mini-card span { font-size:12px; }\n\n .grid,\n .video-grid,\n .contact-grid { grid-template-columns:repeat(2, 1fr); gap:20px; }\n\n .stats { grid-template-columns:repeat(3, 1fr); gap:16px; }\n}\n\n\/* \u2500\u2500 TABLET PORTRAIT 600px \u2013 767px \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:767px) {\n .container { width:calc(100% - 24px); }\n\n .hero {\n padding:52px 20px;\n border-radius:22px;\n }\n\n \/* 2-column mini stats on medium tablet *\/\n .hero-mini-stats {\n grid-template-columns:repeat(2, 1fr);\n max-width:400px;\n margin-top:26px;\n }\n\n \/* Third card spans full width *\/\n .hero-mini-card:last-child {\n grid-column: 1 \/ -1;\n }\n\n .section {\n margin-top:18px;\n padding:24px 18px;\n border-radius:20px;\n }\n\n .grid { grid-template-columns:1fr 1fr; gap:16px; }\n .stats { grid-template-columns:1fr 1fr; gap:16px; }\n .video-grid { grid-template-columns:1fr; gap:20px; }\n .contact-grid{ grid-template-columns:1fr 1fr; gap:16px; }\n\n .video-card { min-height:240px; }\n\n .btn { min-height:48px; padding:12px 20px; font-size:14px; }\n}\n\n\/* \u2500\u2500 LARGE MOBILE 480px \u2013 599px \u2500\u2500\u2500\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:599px) {\n .hero { padding:44px 18px; border-radius:20px; }\n\n .hero h1 { font-size:26px; line-height:1.15; }\n .hero p { font-size:15px; }\n\n .hero-btns { flex-direction:column; align-items:stretch; gap:10px; }\n .btn { width:100%; justify-content:center; }\n\n \/* 1-column mini stats *\/\n .hero-mini-stats {\n grid-template-columns:1fr;\n max-width:320px;\n }\n\n .hero-mini-card:last-child { grid-column:auto; }\n\n .hero-mini-card strong { font-size:26px; }\n .hero-mini-card span { font-size:13px; }\n\n .grid { grid-template-columns:1fr; }\n .stats { grid-template-columns:1fr; }\n .contact-grid { grid-template-columns:1fr; }\n\n .video-card { min-height:220px; }\n\n .cta-band { padding:18px 14px; }\n .cta-band h3 { font-size:20px; }\n}\n\n\/* \u2500\u2500 SMALL MOBILE \u2264479px \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\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:479px) {\n .hero-wrap { width:calc(100% - 14px); }\n\n .hero { padding:38px 16px; border-radius:18px; }\n .hero h1 { font-size:23px; }\n\n .container { width:calc(100% - 16px); }\n\n .section { padding:20px 14px; border-radius:16px; }\n\n .card, .stat, .contact-card { padding:20px 16px; }\n\n .card-icon { width:52px; height:52px; font-size:24px; }\n .contact-icon { width:50px; height:50px; font-size:20px; }\n\n .video-title { left:10px; right:10px; bottom:10px; padding:10px 12px; }\n .video-title strong { font-size:14px; }\n .video-title span { font-size:11px; }\n\n .footer { font-size:12px; }\n}\n<\/style>\n<\/head>\n<body>\n\n<div class=\"bg-orb one\"><\/div>\n<div class=\"bg-orb two\"><\/div>\n<div class=\"bg-orb three\"><\/div>\n\n<div class=\"hero-wrap fade-up delay-1\">\n <div class=\"hero\">\n <h1>Empowering Children for a Brighter Tomorrow<\/h1>\n <p>Fans For Kids supports children through education, emotional care, family support, and meaningful community programs that help them grow with confidence, joy, and opportunity.<\/p>\n\n <div class=\"hero-btns\">\n <a href=\"#mission\" class=\"btn btn-primary\">Discover Our Mission<\/a>\n <a href=\"#contact\" class=\"btn btn-secondary\">Partner With Us<\/a>\n <\/div>\n\n <div class=\"hero-mini-stats\">\n <div class=\"hero-mini-card\">\n <strong>500+<\/strong>\n <span>Children Supported<\/span>\n <\/div>\n <div class=\"hero-mini-card\">\n <strong>30+<\/strong>\n <span>Community Programs<\/span>\n <\/div>\n <div class=\"hero-mini-card\">\n <strong>100%<\/strong>\n <span>Commitment & Transparency<\/span>\n <\/div>\n <\/div>\n <\/div>\n<\/div>\n\n<div class=\"container section fade-up delay-1\" id=\"mission\">\n <h2>Our Mission<\/h2>\n <p class=\"section-intro\">\n We provide children with access to education, emotional support, family-centered care, and practical resources that help them build a stronger future and become confident contributors to society.\n <\/p>\n<\/div>\n\n<div class=\"container section fade-up delay-1\" id=\"problem\">\n <h2>The Problem<\/h2>\n <p class=\"section-intro\">\n Many children and families face barriers that limit growth, learning, and future opportunities. We work to break those barriers through care, support, and sustainable action.\n <\/p>\n <div class=\"grid\">\n <div class=\"card\">\n <div class=\"card-icon\">\ud83d\udcda<\/div>\n <h3>Lack of Access<\/h3>\n <p>Many children grow up without consistent access to education, healthcare, or safe spaces that allow them to thrive and learn with confidence.<\/p>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\">\ud83e\udd1d<\/div>\n <h3>Limited Support<\/h3>\n <p>Families often need stronger support systems, awareness, and resources to guide children through important stages of development.<\/p>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\">\ud83c\udf31<\/div>\n <h3>Broken Opportunities<\/h3>\n <p>Without intervention, small struggles can grow into long-term cycles of poverty, emotional stress, and missed life opportunities.<\/p>\n <\/div>\n <\/div>\n<\/div>\n\n<div class=\"container section fade-up delay-2\" id=\"approach\">\n <h2>Our Approach<\/h2>\n <p class=\"section-intro\">\n Our work is centered around education, compassion, family engagement, and sustainable growth so that our impact continues far beyond one-time support.\n <\/p>\n <div class=\"grid\">\n <div class=\"card\">\n <div class=\"card-icon\">\ud83c\udf93<\/div>\n <h3>Education First<\/h3>\n <p>We focus on learning opportunities that equip children with the confidence, skills, and knowledge they need for a brighter future.<\/p>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\">\ud83c\udfe1<\/div>\n <h3>Community Support<\/h3>\n <p>We work hand in hand with families, caregivers, and local communities to create stronger foundations for every child.<\/p>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\">\ud83d\ude80<\/div>\n <h3>Sustainable Impact<\/h3>\n <p>Our initiatives are built to scale over time, helping us reach more children every year with meaningful and lasting outcomes.<\/p>\n <\/div>\n <\/div>\n<\/div>\n\n<div class=\"container section fade-up delay-2\" id=\"impact\">\n <h2>Our Impact<\/h2>\n <p class=\"section-intro\">\n Every milestone reflects our commitment to serving children and families with transparency, compassion, and measurable community change.\n <\/p>\n <div class=\"stats\">\n <div class=\"stat\">\n <div class=\"stat-icon\">\ud83d\udc67<\/div>\n <h4>500+<\/h4>\n <p>Children Supported<\/p>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-icon\">\ud83c\udf0d<\/div>\n <h4>30+<\/h4>\n <p>Community Programs<\/p>\n <\/div>\n <div class=\"stat\">\n <div class=\"stat-icon\">\u2705<\/div>\n <h4>100%<\/h4>\n <p>Commitment to Transparency<\/p>\n <\/div>\n <\/div>\n <div class=\"cta-band\">\n <h3>Small acts of care can shape a lifetime of hope<\/h3>\n <p>Together, we can create safe environments, stronger support systems, and better futures for children who need it most.<\/p>\n <\/div>\n<\/div>\n\n<div class=\"container section fade-up delay-3\" id=\"videos\">\n <h2>Video Highlights<\/h2>\n <p class=\"section-intro\">\n Explore program moments, awareness content, and impact stories that highlight how Fans For Kids is changing lives through action and care.\n <\/p>\n <div class=\"video-grid\">\n <a href=\"https:\/\/www.mhinnovation.net\/innovations\/scale-and-evaluation-family-networks-children-developmental-delays-fans-kids\" target=\"_blank\" class=\"video-card\">\n <img decoding=\"async\" src=\"https:\/\/gihd.edu.pk\/fansforkids\/wp-content\/uploads\/2025\/12\/spreading-awareness-1.gif\" alt=\"Educational Program\">\n <div class=\"video-play\">\u25b6<\/div>\n <div class=\"video-title\">\n <strong>Educational Program 2026<\/strong>\n <span>Awareness, learning, and child-centered growth<\/span>\n <\/div>\n <\/a>\n <a href=\"https:\/\/www.mhinnovation.net\/innovations\/fans-kids-project\" target=\"_blank\" class=\"video-card\">\n <img decoding=\"async\" src=\"https:\/\/gihd.edu.pk\/fansforkids\/wp-content\/uploads\/2025\/12\/211-1.gif\" alt=\"Community Event Highlights\">\n <div class=\"video-play\">\u25b6<\/div>\n <div class=\"video-title\">\n <strong>Community Event Highlights<\/strong>\n <span>Connecting families and building support networks<\/span>\n <\/div>\n <\/a>\n <a href=\"https:\/\/embermentalhealth.org\/index.php?p=an-ember-story\" target=\"_blank\" class=\"video-card\">\n <img decoding=\"async\" src=\"https:\/\/gihd.edu.pk\/fansforkids\/wp-content\/uploads\/2025\/12\/Tablet-based-Avatar-Cascade-Training-ACT-system-2-1.gif\" alt=\"Impact Stories\">\n <div class=\"video-play\">\u25b6<\/div>\n <div class=\"video-title\">\n <strong>Impact Stories<\/strong>\n <span>Real journeys of hope, progress, and care<\/span>\n <\/div>\n <\/a>\n <\/div>\n<\/div>\n\n<div class=\"container section fade-up delay-3\" id=\"contact\">\n <h2>Contact Us<\/h2>\n <p class=\"section-intro\">\n Reach out to learn more about our programs, partnerships, collaborations, and the work we are doing for children and families.\n <\/p>\n <div class=\"contact-grid\">\n <div class=\"contact-card\">\n <div class=\"contact-icon\">\ud83d\udce7<\/div>\n <h4>Email Us<\/h4>\n <p>info@gihd.stmu.edu.pk<\/p>\n <\/div>\n <div class=\"contact-card\">\n <div class=\"contact-icon\">\ud83d\udcde<\/div>\n <h4>Call Us<\/h4>\n <p>+92-333-0590373<\/p>\n <\/div>\n <div class=\"contact-card\">\n <div class=\"contact-icon\">\ud83e\udd0d<\/div>\n <h4>Work Together<\/h4>\n <p>Let’s build stronger futures for children through education, care, and community support.<\/p>\n <\/div>\n <\/div>\n<\/div>\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Fans For Kids Empowering Children for a Brighter Tomorrow Fans For Kids supports children through education, emotional care, family support, […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-654","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/pages\/654","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/comments?post=654"}],"version-history":[{"count":60,"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/pages\/654\/revisions"}],"predecessor-version":[{"id":1023,"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/pages\/654\/revisions\/1023"}],"wp:attachment":[{"href":"https:\/\/gihd.edu.pk\/fansforkids\/wp-json\/wp\/v2\/media?parent=654"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}