{"id":12,"date":"2026-10-26T15:35:26","date_gmt":"2026-10-26T15:35:26","guid":{"rendered":"https:\/\/assuffahacademy.com\/?page_id=12"},"modified":"2026-11-04T13:51:07","modified_gmt":"2026-11-04T13:51:07","slug":"home-page","status":"publish","type":"page","link":"https:\/\/assuffahacademy.com\/","title":{"rendered":"Home Page"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"12\" class=\"elementor elementor-12\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7d1f3cb e-con e-atomic-element e-flexbox-base e-default-div e-16ea178 \" data-id=\"7d1f3cb\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"7d1f3cb\">\n    \t\t<div class=\"elementor-element elementor-element-8369264 elementor-widget elementor-widget-html\" data-id=\"8369264\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | 00 GLOBAL SETUP  (paste this block FIRST, at the very top of the page)\n  Contains: fonts, brand colors, shared styles (buttons, headings, photo slots), the icon set,\n  Google structured data and shared scripts (scroll animations, smooth scrolling, counters).\n  To change brand colors for the whole site, edit the --green \/ --orange values in \".asa{\" below.\n-->\n<span class=\"asa-setup\" hidden><\/span>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Amiri:wght@700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\n\n<style>\nbody{overflow-x:hidden;background:#FAF8F3}\n\/* Elementor fix: removes the padding and gaps Elementor adds around each HTML block,\n   so every section joins the next one with no white line. Works for any section you add later. *\/\n.elementor .e-con:has(.asa,.asa-setup){padding:0 !important;margin:0 !important;gap:0 !important;row-gap:0 !important;min-height:0 !important;max-width:none !important;width:100% !important;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;--gap:0px;--row-gap:0px;--column-gap:0px}\n.elementor .elementor-widget:has(.asa,.asa-setup){margin:0 !important;padding:0 !important;width:100% !important;max-width:none !important}\n.elementor .elementor-widget:has(.asa,.asa-setup)>.elementor-widget-container{margin:0 !important;padding:0 !important}\n\/* Hides the theme's own scroll-to-top button (the page already has one) *\/\n#ast-scroll-top{display:none !important}\n\/* Keeps the header stuck to the top while scrolling *\/\n.elementor .e-con:has(.asa-header-block){position:sticky !important;top:var(--wp-admin--admin-bar--height,0px);z-index:60}\n.asa.asa-header-block{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:60;background:transparent}\n.asa{--green:#1F4D36; --green-900:#12301F; --green-700:#2A6447; --mint:#E6EFE9; --mint-2:#D4E5DA; --cream:#FAF8F3; --sand:#F2ECDF; --beige:#D7CEAE; --orange:#E07A34; --orange-700:#C2621F; --orange-soft:#FCEBDD; --ink:#13221A; --muted:#5B675F; --line:#E7E2D6; --white:#FFFFFF; --r-sm:12px; --r:20px; --r-lg:28px; --wrap:1200px; --shadow:0 1px 2px rgba(19,34,26,.04),0 12px 32px -16px rgba(19,34,26,.18); --shadow-lg:0 2px 4px rgba(19,34,26,.04),0 30px 60px -28px rgba(19,34,26,.35); --ease:cubic-bezier(.2,.7,.2,1); position:relative; display:block; width:100vw; max-width:100vw !important; margin:0 calc(50% - 50vw) !important; padding:0 !important; background:var(--cream); color:var(--ink); font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; font-size:17px; line-height:1.65; font-weight:400; -webkit-font-smoothing:antialiased; text-align:left;}\n.asa *,.asa *::before,.asa *::after{box-sizing:border-box}\n.asa h1,.asa h2,.asa h3,.asa h4,.asa p,.asa ul,.asa ol,.asa li,.asa figure,.asa blockquote,.asa dl,.asa dd{margin:0;padding:0;border:0;background:none}\n.asa ul,.asa ol{list-style:none}\n.asa h1,.asa h2,.asa h3,.asa h4{font-family:inherit;color:var(--ink);font-weight:800;letter-spacing:-.025em;line-height:1.1;text-transform:none}\n.asa a{color:inherit;box-shadow:none;border:0}\n.asa a,.asa a:hover,.asa a:focus,.asa a:active,.asa a:visited{text-decoration:none!important}\n.ast-single-post .entry-content .asa a,.ast-single-post .entry-content .asa a:hover,.ast-single-post .entry-content .asa a:focus{text-decoration:none!important}\n.asa img{max-width:100%;display:block;border:0;border-radius:0;margin:0}\n.asa button,.asa input,.asa select,.asa textarea{font:inherit;color:inherit;letter-spacing:normal;text-transform:none}\n.asa button{cursor:pointer;background:none;border:0;padding:0;margin:0;box-shadow:none;border-radius:0;line-height:inherit;min-height:0;text-align:inherit}\n.asa svg.asa-i{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}\n.asa :focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:8px}\n.asa .asa-wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}\n.asa section{scroll-margin-top:80px}\n.asa .asa-sec{padding:110px 0}\n.asa .asa-head{max-width:660px;margin-bottom:52px}\n.asa .asa-head.asa-center{margin-left:auto;margin-right:auto;text-align:center}\n.asa .asa-head h2{font-size:clamp(2rem,4.2vw,3.1rem);margin-bottom:16px}\n.asa .asa-head p{color:var(--muted);font-size:1.1rem;line-height:1.7}\n.asa .asa-ar{font-family:'Amiri',serif;font-weight:700;direction:rtl;letter-spacing:0}\n.asa-js .asa [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}\n.asa-js .asa [data-reveal].asa-vis{opacity:1;transform:none}\n.asa-js .asa [data-reveal=\"2\"]{transition-delay:.08s}\n.asa-js .asa [data-reveal=\"3\"]{transition-delay:.16s}\n.asa-js .asa [data-reveal=\"4\"]{transition-delay:.24s}\n.asa .asa-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border-radius:999px;font-weight:700;font-size:1rem;line-height:1.2;border:2px solid transparent;white-space:nowrap;overflow:hidden;isolation:isolate;transition:transform .4s var(--ease),box-shadow .4s var(--ease),background-color .4s ease,color .4s ease,border-color .4s ease;-webkit-tap-highlight-color:transparent}\n.asa .asa-btn svg{transition:transform .25s var(--ease)}\n.asa .asa-btn:hover svg.asa-arrow{transform:translateX(4px)}\n.asa .asa-btn:active{transform:scale(.97)}\n.asa .asa-btn-orange{background:var(--orange);color:#fff;box-shadow:0 10px 24px -10px rgba(224,122,52,.7)}\n.asa .asa-btn-orange:hover{background:var(--green);color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(31,77,54,.6)}\n.asa .asa-btn-green{background:var(--green);color:#fff}\n.asa .asa-btn-green:hover{background:var(--orange);color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(224,122,52,.7)}\n.asa .asa-btn-soft{background:#fff;color:var(--ink);border-color:var(--line)}\n.asa .asa-btn-soft:hover{background:var(--green);border-color:var(--green);color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(31,77,54,.55)}\n.asa .asa-btn-line{border-color:var(--green);color:var(--green);background:#fff}\n.asa .asa-btn-line:hover{background:var(--green);border-color:var(--green);color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(31,77,54,.55)}\n.asa .asa-btn:focus-visible{outline:3px solid rgba(224,122,52,.45);outline-offset:3px}\n.asa .asa-nav a.asa-btn{transition:transform .4s var(--ease),box-shadow .4s var(--ease),background-color .4s ease,color .4s ease,border-color .4s ease}\n.asa .asa-btn-sm{padding:11px 20px;font-size:.93rem}\n.asa .asa-spot{position:relative;overflow:hidden}\n.asa .asa-spot::before{content:\"\";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(224,122,52,.13),transparent 45%);z-index:0}\n.asa .asa-spot:hover::before{opacity:1}\n.asa .asa-spot>*{position:relative;z-index:1}\n.asa .asa-brand{display:flex;align-items:center;gap:12px}\n.asa .asa-logo{width:66px;height:44px;flex:none;transition:transform .5s var(--ease)}\n.asa .asa-brand:hover .asa-logo{transform:rotate(-8deg) scale(1.06)}\n.asa .asa-logo img{width:100%;height:100%;object-fit:contain}\n.asa .asa-brand-name{font-weight:800;font-size:1.12rem;letter-spacing:-.02em;color:var(--green);line-height:1.1;display:block}\n.asa .asa-brand-sub{font-size:.78rem;color:var(--muted);font-weight:500;display:block;margin-top:2px}\n.asa .asa-photo{position:relative;width:100%;height:100%;background:linear-gradient(135deg,#DCEAE0 0%,#EEF2EA 45%,#F6E5D3 100%);overflow:hidden}\n.asa .asa-photo::before{content:\"\";position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.7),transparent 50%)}\n.asa .asa-photo::after{content:attr(data-label);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:.85rem;font-weight:600;color:var(--green);background:rgba(255,255,255,.75);padding:8px 16px;border-radius:999px;white-space:nowrap}\n.asa .asa-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .7s var(--ease)}\n.asa .asa-photo img[src=\"\"],.asa .asa-photo img:not([src]){display:none}\n@keyframes asaFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}\n.asa .asa-note{font-size:.88rem;color:var(--muted);margin-top:16px;display:flex;gap:8px;line-height:1.55}\n.asa .asa-note svg{width:17px;height:17px;color:var(--orange);margin-top:2px}\n@media (max-width:960px){\n  .asa{font-size:16px}\n  .asa .asa-sec{padding:80px 0}\n}\n@media (max-width:640px){\n  .asa .asa-wrap{padding:0 16px}\n  .asa .asa-sec{padding:68px 0}\n  .asa .asa-head{margin-bottom:36px}\n}\n@media (prefers-reduced-motion:reduce){\n  .asa *,.asa *::before,.asa *::after{animation:none !important;transition:none !important}\n  .asa-js .asa [data-reveal]{opacity:1;transform:none}\n}\n<\/style>\n\n<svg width=\"0\" height=\"0\" style=\"position:absolute\" aria-hidden=\"true\">\n  <defs>\n    <symbol id=\"asa-i-book\" viewBox=\"0 0 24 24\"><path d=\"M2 4h6a4 4 0 0 1 4 4v12a3 3 0 0 0-3-3H2z\"\/><path d=\"M22 4h-6a4 4 0 0 0-4 4v12a3 3 0 0 1 3-3h7z\"\/><\/symbol>\n    <symbol id=\"asa-i-cap\" viewBox=\"0 0 24 24\"><path d=\"M22 10 12 5 2 10l10 5 10-5z\"\/><path d=\"M6 12v5c3 2 9 2 12 0v-5\"\/><path d=\"M22 10v6\"\/><\/symbol>\n    <symbol id=\"asa-i-users\" viewBox=\"0 0 24 24\"><circle cx=\"9\" cy=\"7\" r=\"4\"\/><path d=\"M2 21v-2a4 4 0 0 1 4-4h6a4 4 0 0 1 4 4v2\"\/><path d=\"M16 3.1a4 4 0 0 1 0 7.8\"\/><path d=\"M22 21v-2a4 4 0 0 0-3-3.9\"\/><\/symbol>\n    <symbol id=\"asa-i-moon\" viewBox=\"0 0 24 24\"><path d=\"M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z\"\/><\/symbol>\n    <symbol id=\"asa-i-monitor\" viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"3\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M8 21h8M12 17v4\"\/><\/symbol>\n    <symbol id=\"asa-i-eye\" viewBox=\"0 0 24 24\"><path d=\"M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z\"\/><circle cx=\"12\" cy=\"12\" r=\"3\"\/><\/symbol>\n    <symbol id=\"asa-i-bus\" viewBox=\"0 0 24 24\"><rect x=\"4\" y=\"3\" width=\"16\" height=\"15\" rx=\"3\"\/><path d=\"M4 11h16M8 18v3M16 18v3M8 14.5h.01M16 14.5h.01\"\/><\/symbol>\n    <symbol id=\"asa-i-chip\" viewBox=\"0 0 24 24\"><rect x=\"5\" y=\"5\" width=\"14\" height=\"14\" rx=\"2\"\/><path d=\"M9 9h6v6H9zM9 2v3M15 2v3M9 19v3M15 19v3M2 9h3M2 15h3M19 9h3M19 15h3\"\/><\/symbol>\n    <symbol id=\"asa-i-wallet\" viewBox=\"0 0 24 24\"><path d=\"M20 7H5a2 2 0 0 1 0-4h13v4\"\/><path d=\"M3 5v14a2 2 0 0 0 2 2h15V7\"\/><path d=\"M16 14h.01\"\/><\/symbol>\n    <symbol id=\"asa-i-chat\" viewBox=\"0 0 24 24\"><path d=\"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z\"\/><path d=\"M8 9h8M8 13h5\"\/><\/symbol>\n    <symbol id=\"asa-i-flask\" viewBox=\"0 0 24 24\"><path d=\"M9 3h6M10 3v6L4 19a2 2 0 0 0 2 3h12a2 2 0 0 0 2-3l-6-10V3\"\/><path d=\"M7 15h10\"\/><\/symbol>\n    <symbol id=\"asa-i-pen\" viewBox=\"0 0 24 24\"><path d=\"M12 20h9\"\/><path d=\"M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z\"\/><\/symbol>\n    <symbol id=\"asa-i-phone\" viewBox=\"0 0 24 24\"><path d=\"M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z\"\/><\/symbol>\n    <symbol id=\"asa-i-mail\" viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"\/><path d=\"m22 6-10 7L2 6\"\/><\/symbol>\n    <symbol id=\"asa-i-pin\" viewBox=\"0 0 24 24\"><path d=\"M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/><\/symbol>\n    <symbol id=\"asa-i-check\" viewBox=\"0 0 24 24\"><path d=\"M20 6 9 17l-5-5\"\/><\/symbol>\n    <symbol id=\"asa-i-bed\" viewBox=\"0 0 24 24\"><path d=\"M2 4v16M2 8h16a4 4 0 0 1 4 4v8M2 17h20M6 8v9\"\/><\/symbol>\n    <symbol id=\"asa-i-food\" viewBox=\"0 0 24 24\"><path d=\"M3 2v7a3 3 0 0 0 6 0V2M6 2v20M19 15V2a5 5 0 0 0-5 5v6a2 2 0 0 0 2 2h3zm0 0v7\"\/><\/symbol>\n    <symbol id=\"asa-i-award\" viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"8\" r=\"6\"\/><path d=\"M15.5 13 17 22l-5-3-5 3 1.5-9\"\/><\/symbol>\n    <symbol id=\"asa-i-star\" viewBox=\"0 0 24 24\"><path d=\"M12 2l3.1 6.3 6.9 1-5 4.9 1.2 6.8L12 17.8 5.8 21l1.2-6.8-5-4.9 6.9-1z\"\/><\/symbol>\n    <symbol id=\"asa-i-snow\" viewBox=\"0 0 24 24\"><path d=\"M12 2v20M4.9 4.9l14.2 14.2M2 12h20M4.9 19.1 19.1 4.9\"\/><\/symbol>\n    <symbol id=\"asa-i-info\" viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M12 16v-4M12 8h.01\"\/><\/symbol>\n    <symbol id=\"asa-i-calc\" viewBox=\"0 0 24 24\"><rect x=\"4\" y=\"2\" width=\"16\" height=\"20\" rx=\"2\"\/><path d=\"M8 6h8M8 11h.01M12 11h.01M16 11h.01M8 15h.01M12 15h.01M16 15h.01M8 19h8\"\/><\/symbol>\n    <symbol id=\"asa-i-plus\" viewBox=\"0 0 24 24\"><path d=\"M12 5v14M5 12h14\"\/><\/symbol>\n    <symbol id=\"asa-i-menu\" viewBox=\"0 0 24 24\"><path d=\"M4 7h16M4 12h16M4 17h10\"\/><\/symbol>\n    <symbol id=\"asa-i-x\" viewBox=\"0 0 24 24\"><path d=\"M18 6 6 18M6 6l12 12\"\/><\/symbol>\n    <symbol id=\"asa-i-arrow\" viewBox=\"0 0 24 24\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/symbol>\n    <symbol id=\"asa-i-left\" viewBox=\"0 0 24 24\"><path d=\"M15 18l-6-6 6-6\"\/><\/symbol>\n    <symbol id=\"asa-i-right\" viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"\/><\/symbol>\n    <symbol id=\"asa-i-up\" viewBox=\"0 0 24 24\"><path d=\"M12 19V5M6 11l6-6 6 6\"\/><\/symbol>\n    <symbol id=\"asa-i-sparkle\" viewBox=\"0 0 24 24\"><path d=\"M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z\"\/><path d=\"M19 15l.8 2.2L22 18l-2.2.8L19 21l-.8-2.2L16 18l2.2-.8z\"\/><\/symbol>\n    <symbol id=\"asa-i-quran\" viewBox=\"0 0 24 24\"><path d=\"M4 19V5a2 2 0 0 1 2-2h13v16H6a2 2 0 0 0-2 2 2 2 0 0 0 2 2h13\"\/><path d=\"M12 7l1 2 2 .3-1.5 1.4.4 2.1L12 11.8l-1.9 1 .4-2.1L9 9.3l2-.3z\"\/><\/symbol>\n    <symbol id=\"asa-i-heart\" viewBox=\"0 0 24 24\"><path d=\"M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1 1.1L12 21l7.8-7.5 1-1.1a5.5 5.5 0 0 0 0-7.8z\"\/><\/symbol>\n    <!-- Simple emblem used until you add your real logo -->\n    <symbol id=\"asa-i-emblem\" viewBox=\"0 0 64 64\">\n      <path d=\"M32 5c-6 5-17 9-19 21v8h38v-8C49 14 38 10 32 5z\" fill=\"#1F4D36\"\/>\n      <circle cx=\"32\" cy=\"27\" r=\"7\" fill=\"#F0A93E\"\/>\n      <path d=\"M32 16v3M24 20l2 2M40 20l-2 2M21 27h3M43 27h-3\" stroke=\"#F0A93E\" stroke-width=\"2\" stroke-linecap=\"round\"\/>\n      <path d=\"M6 36c9-3 18-2 26 4 8-6 17-7 26-4-5 7-15 13-26 13S11 43 6 36z\" fill=\"#E07A34\"\/>\n      <path d=\"M10 37c8-1 15 1 22 6 7-5 14-7 22-6\" stroke=\"#fff\" stroke-width=\"1.6\" fill=\"none\" stroke-linecap=\"round\" opacity=\".85\"\/>\n      <path d=\"M14 48c6 4 12 6 18 6s12-2 18-6\" stroke=\"#1F4D36\" stroke-width=\"2.4\" fill=\"none\" stroke-linecap=\"round\"\/>\n    <\/symbol>\n  <\/defs>\n<\/svg>\n\n<script type=\"application\/ld+json\">\n{\n  \"@context\":\"https:\/\/schema.org\",\n  \"@type\":\"EducationalOrganization\",\n  \"name\":\"As Suffah Academy\",\n  \"alternateName\":\"\u0623\u0643\u0627\u062f\u064a\u0645\u064a\u0629 \u0627\u0644\u0635\u0641\u0629\",\n  \"description\":\"A women-led educational institution in Chattogram offering academic classes from Kindergarten to Grade 10, Dars-e-Nizami, Hifz and Quran programs, and an air-conditioned hostel.\",\n  \"slogan\":\"Ilm, Amal, Dawah\",\n  \"logo\":\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/as-suffah-academy-logo-transparent.webp\",\n  \"email\":\"assuffahacademy1445@gmail.com\",\n  \"telephone\":[\"+8801843222118\",\"+8801811204726\",\"+8801839689696\"],\n  \"address\":{\"@type\":\"PostalAddress\",\"streetAddress\":\"Chayaneer-193, Road No. 08, Block B, Chandgaon Residential Area\",\"addressLocality\":\"Chattogram\",\"addressCountry\":\"BD\"},\n  \"founder\":{\"@type\":\"Person\",\"name\":\"Nazmun Nessa\",\"jobTitle\":\"Founder and Principal\"}\n}\n<\/script>\n\n<script>\n\/* Shared helpers used by every block. Runs once per page. *\/\n(function(){\n  if(window.ASA) return;\n  var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  document.documentElement.classList.add('asa-js');\n  var A=window.ASA={reduce:reduce};\n  A.tk=function(n){return '\u09f3'+Math.round(n).toLocaleString('en-IN')};\n  A.ico=function(id,cls){return '<svg class=\"asa-i'+(cls?' '+cls:'')+'\"><use href=\"#asa-i-'+id+'\"\/><\/svg>'};\n  A.countTo=function(el,to,fmt,dur){\n    fmt=fmt||function(n){return Math.round(n)}; dur=dur||900;\n    var from=parseFloat(el.getAttribute('data-now')||0); el.setAttribute('data-now',to);\n    if(reduce){el.textContent=fmt(to);return}\n    var t0=null; function step(t){if(!t0)t0=t; var p=Math.min((t-t0)\/dur,1), e=1-Math.pow(1-p,3);\n      el.textContent=fmt(from+(to-from)*e); if(p<1) requestAnimationFrame(step);}\n    requestAnimationFrame(step);\n  };\n\n  function init(){\n    \/* Reveal on scroll + number counters *\/\n    var els=[].slice.call(document.querySelectorAll('.asa [data-reveal]'));\n    var count=function(box){[].forEach.call(box.querySelectorAll('[data-count]'),function(c){A.countTo(c,+c.getAttribute('data-count'),null,1400)})};\n    if('IntersectionObserver' in window && !reduce){\n      var ro=new IntersectionObserver(function(es){es.forEach(function(en){\n        if(en.isIntersecting){en.target.classList.add('asa-vis'); ro.unobserve(en.target); count(en.target);}\n      })},{threshold:.12,rootMargin:'0px 0px -40px 0px'});\n      els.forEach(function(el){ro.observe(el)});\n    } else {\n      els.forEach(function(el){el.classList.add('asa-vis')});\n      [].forEach.call(document.querySelectorAll('.asa [data-count]'),function(c){c.textContent=c.getAttribute('data-count')});\n    }\n\n    \/* Smooth scroll for links like #asa-programs *\/\n    document.addEventListener('click',function(e){\n      var a=e.target.closest&&e.target.closest('a[href^=\"#asa-\"]'); if(!a) return;\n      var t=document.getElementById(a.getAttribute('href').slice(1)); if(!t) return;\n      e.preventDefault(); t.scrollIntoView({behavior:reduce?'auto':'smooth',block:'start'});\n    });\n\n    \/* Card glow that follows the cursor *\/\n    document.addEventListener('mousemove',function(e){\n      var c=e.target.closest&&e.target.closest('.asa-spot'); if(!c) return;\n      var b=c.getBoundingClientRect(); c.style.setProperty('--mx',(e.clientX-b.left)+'px'); c.style.setProperty('--my',(e.clientY-b.top)+'px');\n    });\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-aae4b9c e-con e-atomic-element e-flexbox-base e-default-div e-7a67f86 \" data-id=\"aae4b9c\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"aae4b9c\">\n    \t\t<div class=\"elementor-element elementor-element-c2a925a elementor-widget elementor-widget-html\" data-id=\"c2a925a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | HEADER\n  Logo, menu links and the \"Apply now\" button. Sticks to the top while scrolling.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-header{position:relative;z-index:60;background:rgba(250,248,243,.8);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}\n.asa .asa-header.asa-scrolled{border-color:var(--line);background:rgba(255,255,255,.88)}\n.asa .asa-header::after{content:\"\";position:absolute;left:0;bottom:-1px;height:3px;width:var(--prog,0%);background:linear-gradient(90deg,var(--green),var(--orange));border-radius:0 3px 3px 0}\n.asa .asa-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;height:76px}\n.asa .asa-nav{display:flex;align-items:center;gap:2px}\n.asa .asa-nav a{position:relative;padding:8px 14px;font-weight:600;font-size:.95rem;color:var(--ink);transition:color .2s}\n.asa .asa-nav a:not(.asa-btn)::after{content:\"\";position:absolute;left:14px;right:14px;bottom:2px;height:2px;border-radius:2px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}\n.asa .asa-nav a:not(.asa-btn):hover::after,.asa .asa-nav a.asa-active::after{transform:scaleX(1)}\n.asa .asa-nav a.asa-active{color:var(--green)}\n.asa .asa-nav a.asa-btn{margin-left:12px;padding:12px 22px;color:#fff}\n.asa .asa-nav a.asa-btn:hover{color:#fff}\n.asa .asa-menu{display:none;width:46px;height:46px;border-radius:14px;align-items:center;justify-content:center;color:var(--green);background:var(--mint)}\n@media (max-width:1100px){\n  .asa .asa-nav a:not(.asa-btn){padding:8px 10px;font-size:.92rem}\n  .asa .asa-nav a:not(.asa-btn)::after{left:10px;right:10px}\n}\n@media (max-width:960px){\n  .asa .asa-menu{display:inline-flex}\n  .asa .asa-nav{position:absolute;left:0;right:0;top:76px;flex-direction:column;align-items:stretch;gap:2px;padding:12px 16px 20px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 24px 40px -24px rgba(0,0,0,.3);display:none}\n  .asa .asa-header.asa-open .asa-nav{display:flex;animation:asaFade .3s var(--ease)}\n  .asa .asa-nav a:not(.asa-btn){padding:14px;font-size:1.02rem;border-radius:12px}\n  .asa .asa-nav a:not(.asa-btn)::after{display:none}\n  .asa .asa-nav a.asa-active{background:var(--mint)}\n  .asa .asa-nav a.asa-btn{margin:10px 0 0}\n}\n<\/style>\n\n<div class=\"asa asa-header-block\">\n<header class=\"asa-header\" id=\"asa-header\">\n  <div class=\"asa-wrap asa-bar\">\n    <a href=\"#asa-home\" class=\"asa-brand\" aria-label=\"As Suffah Academy home\">\n      <span class=\"asa-logo\">\n        <img decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/as-suffah-academy-logo-transparent.webp\" alt=\"As Suffah Academy logo\" width=\"66\" height=\"44\">\n      <\/span>\n      <span>\n        <span class=\"asa-brand-name\">As Suffah Academy<\/span>\n        <span class=\"asa-brand-sub\">Chandgaon, Chattogram<\/span>\n      <\/span>\n    <\/a>\n    <button class=\"asa-menu\" id=\"asa-menu-btn\" aria-label=\"Open menu\" aria-expanded=\"false\" aria-controls=\"asa-nav\">\n      <svg class=\"asa-i\"><use href=\"#asa-i-menu\"\/><\/svg>\n    <\/button>\n    <nav class=\"asa-nav\" id=\"asa-nav\" aria-label=\"Main\">\n      <a href=\"#asa-about\">About<\/a>\n      <a href=\"#asa-programs\">Programs<\/a>\n      <a href=\"#asa-hostel\">Hostel<\/a>\n      <a href=\"#asa-activities\">Activities<\/a>\n      <a href=\"#asa-admission\">Fees<\/a>\n      <a href=\"#asa-contact\">Contact<\/a>\n      <a href=\"#asa-admission\" class=\"asa-btn asa-btn-orange\">Apply now<\/a>\n    <\/nav>\n  <\/div>\n<\/header>\n<\/div>\n\n<script>\n(function(){\n  function init(){\n    var header=document.getElementById('asa-header'), btn=document.getElementById('asa-menu-btn'); if(!header||!btn) return;\n    var ico=function(id){return '<svg class=\"asa-i\"><use href=\"#asa-i-'+id+'\"\/><\/svg>'};\n    function close(){header.classList.remove('asa-open'); btn.setAttribute('aria-expanded','false'); btn.innerHTML=ico('menu');}\n    btn.addEventListener('click',function(){\n      var open=header.classList.toggle('asa-open');\n      btn.setAttribute('aria-expanded',open?'true':'false'); btn.innerHTML=ico(open?'x':'menu');\n    });\n    [].forEach.call(header.querySelectorAll('.asa-nav a'),function(a){a.addEventListener('click',close)});\n\n    \/* Scroll progress line + header shadow *\/\n    var tick=false;\n    function onScroll(){\n      tick=false; var d=document.documentElement, y=window.scrollY||d.scrollTop, max=d.scrollHeight-window.innerHeight;\n      header.style.setProperty('--prog',((max>0?Math.min(1,y\/max):0)*100).toFixed(1)+'%');\n      header.classList.toggle('asa-scrolled',y>10);\n    }\n    window.addEventListener('scroll',function(){if(!tick){tick=true;requestAnimationFrame(onScroll)}},{passive:true}); onScroll();\n\n    \/* Highlight the menu link of the section on screen *\/\n    if('IntersectionObserver' in window){\n      var links=[].slice.call(header.querySelectorAll('.asa-nav a:not(.asa-btn)'));\n      var io=new IntersectionObserver(function(es){es.forEach(function(en){\n        if(en.isIntersecting) links.forEach(function(l){l.classList.toggle('asa-active',l.getAttribute('href')==='#'+en.target.id)});\n      })},{rootMargin:'-45% 0px -50% 0px'});\n      links.forEach(function(l){var s=document.getElementById(l.getAttribute('href').slice(1)); if(s) io.observe(s)});\n    }\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-407183c e-con e-atomic-element e-flexbox-base e-default-div e-06837a5 \" data-id=\"407183c\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"407183c\">\n    \t\t<div class=\"elementor-element elementor-element-e6cf23e elementor-widget elementor-widget-html\" data-id=\"e6cf23e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | HERO + STATS\n  First screen: academy name, rotating tagline, buttons, campus photo and the 4 number cards.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-hero{position:relative;overflow:hidden;padding:64px 0 130px}\n.asa .asa-hero::before{content:\"\";position:absolute;inset:0;background-image:radial-gradient(rgba(31,77,54,.13) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 70% 40%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 70% 40%,#000 20%,transparent 75%);pointer-events:none}\n.asa .asa-blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none;animation:asaBlob 16s ease-in-out infinite alternate}\n.asa .asa-blob-a{width:460px;height:460px;background:#BFDCC9;right:-80px;top:-120px}\n.asa .asa-blob-b{width:360px;height:360px;background:#F6C9A4;right:28%;bottom:-120px;animation-delay:-6s}\n@keyframes asaBlob{to{transform:translate(-40px,30px) scale(1.08)}}\n.asa .asa-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}\n.asa .asa-pill{display:inline-flex;align-items:center;gap:10px;padding:7px 16px 7px 8px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);font-size:.9rem;font-weight:600;color:var(--ink);margin-bottom:26px}\n.asa .asa-pill{white-space:nowrap}\n.asa .asa-pill b{background:var(--orange-soft);color:var(--orange-700);padding:3px 10px;border-radius:999px;font-weight:700;font-size:.8rem}\n.asa .asa-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 0 rgba(224,122,52,.6);animation:asaPulse 2s infinite}\n@keyframes asaPulse{70%{box-shadow:0 0 0 9px rgba(224,122,52,0)}100%{box-shadow:0 0 0 0 rgba(224,122,52,0)}}\n.asa .asa-hero h1{font-size:clamp(2.8rem,6.4vw,5.1rem);letter-spacing:-.045em;line-height:1;color:var(--green-900)}\n.asa .asa-hero h1 .asa-ar{display:block;font-size:.42em;color:var(--orange);margin-top:14px;width:fit-content;line-height:1.3}\n.asa .asa-tagline{margin-top:22px;font-size:clamp(1.3rem,2.4vw,1.75rem);font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.3;min-height:2.6em}\n.asa .asa-rot{display:inline-block;color:var(--green-700);position:relative;white-space:nowrap}\n.asa .asa-rot::after{content:\"\";position:absolute;left:0;right:0;bottom:-4px;height:8px;background:var(--orange-soft);z-index:-1;border-radius:4px}\n.asa .asa-rot.asa-out{animation:asaOut .35s var(--ease) forwards}\n.asa .asa-rot.asa-in{animation:asaInW .45s var(--ease) forwards}\n@keyframes asaOut{to{opacity:0;transform:translateY(-12px)}}\n@keyframes asaInW{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}\n.asa .asa-lead{font-size:1.1rem;max-width:33em;color:var(--muted);margin:18px 0 34px;line-height:1.75}\n.asa .asa-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:36px}\n.asa .asa-values{display:flex;flex-wrap:wrap;gap:10px}\n.asa .asa-values li{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;background:#fff;border:1px solid var(--line);border-radius:999px;font-weight:600;font-size:.93rem;transition:transform .25s var(--ease),border-color .25s}\n.asa .asa-values li:hover{transform:translateY(-3px);border-color:var(--green)}\n.asa .asa-values li span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--green);font-weight:800;font-size:.8rem}\n.asa .asa-values small{color:var(--muted);font-weight:500}\n.asa .asa-art{position:relative;max-width:500px;justify-self:end;width:100%;aspect-ratio:1\/1.08}\n.asa .asa-art-main{position:absolute;inset:0 0 0 8%;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg)}\n.asa .asa-float{position:absolute;z-index:2;transition:transform .5s var(--ease);transform:translate3d(var(--px,0),var(--py,0),0)}\n.asa .asa-float>div{animation:asaBob 6s ease-in-out infinite}\n.asa .asa-f2>div{animation-delay:-2s}\n.asa .asa-f3>div{animation-delay:-4s}\n@keyframes asaBob{50%{transform:translateY(-8px)}}\n.asa .asa-card-float{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-radius:18px;padding:14px 18px;box-shadow:var(--shadow-lg);display:flex;gap:12px;align-items:center}\n.asa .asa-card-float strong{display:block;font-size:.98rem;font-weight:800;color:var(--ink);line-height:1.25;letter-spacing:-.01em}\n.asa .asa-card-float span{font-size:.82rem;color:var(--muted);line-height:1.35;display:block}\n.asa .asa-card-float .asa-ic{width:42px;height:42px;border-radius:12px;background:var(--mint);color:var(--green);display:grid;place-items:center;flex:none}\n.asa .asa-f1{left:-6%;bottom:12%}\n.asa .asa-f2{right:-4%;top:9%}\n.asa .asa-f2 .asa-card-float{background:var(--orange);border-color:var(--orange);color:#fff}\n.asa .asa-f2 .asa-card-float strong{color:#fff}\n.asa .asa-f2 .asa-card-float .asa-ic{background:rgba(255,255,255,.2);color:#fff}\n.asa .asa-f3{right:-2%;bottom:-5%}\n.asa .asa-f3 .asa-card-float{flex-direction:column;align-items:flex-start;gap:8px;min-width:200px}\n.asa .asa-meter{display:flex;gap:4px;width:100%}\n.asa .asa-meter i{flex:1;height:6px;border-radius:3px;background:var(--mint-2)}\n.asa .asa-meter i.on{background:var(--green)}\n.asa .asa-stats-wrap{position:relative;z-index:3;margin-top:-70px}\n.asa .asa-stats{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);overflow:hidden}\n.asa .asa-stat{padding:28px 28px 26px;border-right:1px solid var(--line);transition:background .3s}\n.asa .asa-stat:last-child{border-right:0}\n.asa .asa-stat:hover{background:var(--mint)}\n.asa .asa-stat b{display:block;font-size:clamp(2.2rem,3.6vw,3rem);font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--green);font-variant-numeric:tabular-nums}\n.asa .asa-stat span{display:block;margin-top:8px;font-weight:600;color:var(--ink)}\n.asa .asa-stat small{display:block;color:var(--muted);font-size:.86rem;margin-top:2px}\n@media (max-width:960px){\n  .asa .asa-hero{padding:40px 0 120px}\n  .asa .asa-hero-grid{grid-template-columns:1fr;gap:36px}\n  .asa .asa-art{justify-self:center;max-width:440px}\n  .asa .asa-stats{grid-template-columns:repeat(2,1fr)}\n  .asa .asa-stat:nth-child(2){border-right:0}\n  .asa .asa-stat:nth-child(-n+2){border-bottom:1px solid var(--line)}\n}\n@media (max-width:640px){\n  .asa .asa-cta .asa-btn{flex:1 1 100%}\n  .asa .asa-art{aspect-ratio:1\/1.05}\n  .asa .asa-pill b{display:none}\n  .asa .asa-pill{padding-left:14px}\n  .asa .asa-f1{left:-2%;bottom:26%}\n  .asa .asa-f2{right:-2%}\n  .asa .asa-f3{right:2%;bottom:-4%}\n  .asa .asa-card-float{padding:11px 13px}\n  .asa .asa-f3 .asa-card-float{min-width:170px}\n  .asa .asa-stat{padding:20px 18px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-hero\">\n<section class=\"asa-hero\" id=\"asa-home\">\n  <span class=\"asa-blob asa-blob-a\"><\/span>\n  <span class=\"asa-blob asa-blob-b\"><\/span>\n  <div class=\"asa-wrap asa-hero-grid\">\n    <div>\n      <span class=\"asa-pill\" data-reveal><b>New session<\/b><span class=\"asa-dot\"><\/span>Admission opens in November<\/span>\n      <h1 data-reveal=\"2\">As Suffah Academy<span class=\"asa-ar\">\u0623\u0643\u0627\u062f\u064a\u0645\u064a\u0629 \u0627\u0644\u0635\u0641\u0629<\/span><\/h1>\n      <p class=\"asa-tagline\" data-reveal=\"3\">A place where students<br><span class=\"asa-rot\" id=\"asa-rot\">learn the Quran<\/span><\/p>\n      <p class=\"asa-lead\" data-reveal=\"3\">A women-led academy in Chattogram. Children, girls and women study the Quran, Islamic sciences and school subjects together, with qualified teachers on a safe, caring campus.<\/p>\n      <div class=\"asa-cta\" data-reveal=\"4\">\n        <a href=\"#asa-admission\" class=\"asa-btn asa-btn-orange\">Apply for admission <svg class=\"asa-i asa-arrow\"><use href=\"#asa-i-arrow\"\/><\/svg><\/a>\n        <a href=\"#asa-programs\" class=\"asa-btn asa-btn-soft\">Explore programs<\/a>\n      <\/div>\n      \n    <\/div>\n\n    <div class=\"asa-art\" id=\"asa-art\" data-reveal=\"2\">\n      <div class=\"asa-art-main\">\n        <div class=\"asa-photo\" data-label=\"Add campus photo\">\n          <img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/Hero-Section.webp\" alt=\"As Suffah Academy campus entrance decorated with colorful balloons in Chandgaon, Chattogram\" width=\"957\" height=\"718\" fetchpriority=\"high\">\n        <\/div>\n      <\/div>\n      <div class=\"asa-float asa-f1\" data-depth=\"22\"><div class=\"asa-card-float\">\n        <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-users\"\/><\/svg><\/span>\n        <span><strong>Led by women<\/strong><span>Founded and run by women educators<\/span><\/span>\n      <\/div><\/div>\n      <div class=\"asa-float asa-f2\" data-depth=\"-16\"><div class=\"asa-card-float\">\n        <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-snow\"\/><\/svg><\/span>\n        <span><strong>AC hostel<\/strong><span style=\"color:rgba(255,255,255,.85)\">Meals included<\/span><\/span>\n      <\/div><\/div>\n      <div class=\"asa-float asa-f3\" data-depth=\"12\"><div class=\"asa-card-float\">\n        <span><strong>KG-1 to Grade 10<\/strong><span>Plus Hifz and higher Islamic studies<\/span><\/span>\n        <span class=\"asa-meter\"><i class=\"on\"><\/i><i class=\"on\"><\/i><i class=\"on\"><\/i><i class=\"on\"><\/i><i><\/i><\/span>\n      <\/div><\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- Stats -->\n<div class=\"asa-stats-wrap\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-stats\" data-reveal>\n      <div class=\"asa-stat\"><b data-count=\"16\">0<\/b><span>Class levels<\/span><small>KG-1 to Dawrah-e-Hadith<\/small><\/div>\n      <div class=\"asa-stat\"><b data-count=\"5\">0<\/b><span>Quran sections<\/span><small>Noorani to Kitab<\/small><\/div>\n      <div class=\"asa-stat\"><b data-count=\"5\">0<\/b><span>Student clubs<\/span><small>Language, science, tech and more<\/small><\/div>\n      <div class=\"asa-stat\"><b data-count=\"4\">0<\/b><span>Hostel plans<\/span><small>Residential and day-care<\/small><\/div>\n    <\/div>\n  <\/div>\n<\/div>\n<\/div>\n\n<script>\n(function(){\n  \/* Rotating words in the tagline. Edit this list to change them. *\/\n  var WORDS=['learn the Quran','excel in academics','grow in character','live by the Sunnah'];\n\n  function init(){\n    var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    var rot=document.getElementById('asa-rot'), hero=document.getElementById('asa-home'); if(!rot||!hero) return;\n    var wi=0; rot.textContent=WORDS[0];\n    if(!reduce) setInterval(function(){\n      rot.classList.remove('asa-in'); rot.classList.add('asa-out');\n      setTimeout(function(){wi=(wi+1)%WORDS.length; rot.textContent=WORDS[wi]; rot.classList.remove('asa-out'); rot.classList.add('asa-in');},350);\n    },2800);\n\n    \/* Floating cards move slightly with the mouse *\/\n    var floats=[].slice.call(hero.querySelectorAll('.asa-float'));\n    if(!reduce && window.matchMedia('(hover:hover)').matches){\n      hero.addEventListener('mousemove',function(e){\n        var b=hero.getBoundingClientRect(), x=(e.clientX-b.left)\/b.width-.5, y=(e.clientY-b.top)\/b.height-.5;\n        floats.forEach(function(f){var d=+f.getAttribute('data-depth'); f.style.setProperty('--px',(x*d).toFixed(1)+'px'); f.style.setProperty('--py',(y*d).toFixed(1)+'px');});\n      });\n      hero.addEventListener('mouseleave',function(){floats.forEach(function(f){f.style.setProperty('--px','0px'); f.style.setProperty('--py','0px')})});\n    }\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-d827d81 e-con e-atomic-element e-flexbox-base e-default-div e-d827d81-d8148fb \" data-id=\"d827d81\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"d827d81\">\n    \t\t<div class=\"elementor-element elementor-element-a60a7d7 elementor-widget elementor-widget-html\" data-id=\"a60a7d7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | ABOUT\n  Mission card and the three pillars (academic, Quran, women-led).\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-bento{display:grid;grid-template-columns:1.15fr 1fr 1fr;grid-template-rows:auto auto;gap:18px}\n.asa .asa-tile{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}\n.asa .asa-tile:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}\n.asa .asa-tile h3{font-size:1.35rem;margin:18px 0 8px}\n.asa .asa-tile p{color:var(--muted)}\n.asa .asa-tile .asa-ic{width:52px;height:52px;border-radius:16px;background:var(--mint);color:var(--green);display:grid;place-items:center;transition:transform .4s var(--ease),background .3s,color .3s}\n.asa .asa-tile:hover .asa-ic{background:var(--orange);color:#fff;transform:rotate(-8deg)}\n.asa .asa-tile-mission{grid-row:span 2;background:var(--green);border-color:var(--green);color:#E8F0EA;display:flex;flex-direction:column;justify-content:space-between;gap:30px;padding:36px}\n.asa .asa-tile-mission::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.12),transparent 45%)}\n.asa .asa-tile-mission .asa-k{font-size:.9rem;font-weight:600;color:var(--beige)}\n.asa .asa-tile-mission blockquote{font-size:clamp(1.35rem,2.3vw,1.75rem);font-weight:700;letter-spacing:-.02em;line-height:1.35;color:#fff}\n.asa .asa-tile-mission .asa-triad{display:flex;gap:8px;flex-wrap:wrap}\n.asa .asa-tile-mission .asa-triad span{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);font-weight:600;font-size:.9rem}\n.asa .asa-tile-wide{grid-column:span 2;display:flex;gap:24px;align-items:center}\n.asa .asa-tile-wide h3{margin-top:0}\n.asa .asa-tile-wide .asa-ic{flex:none}\n@media (max-width:960px){\n  .asa .asa-bento{grid-template-columns:1fr 1fr}\n  .asa .asa-tile-mission{grid-row:auto;grid-column:span 2}\n}\n@media (max-width:640px){\n  .asa .asa-bento{grid-template-columns:1fr}\n  .asa .asa-tile-mission,.asa .asa-tile-wide{grid-column:auto}\n  .asa .asa-tile-wide{flex-direction:column;align-items:flex-start}\n}\n<\/style>\n\n<div class=\"asa asa-blk-about\">\n<section class=\"asa-sec\" id=\"asa-about\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Faith and learning, growing side by side<\/h2>\n      <p>As Suffah Academy blends Quranic education, Islamic sciences and modern academics into one clear path. Women founded the academy and lead every section, so families feel confident and students feel at home.<\/p>\n    <\/div>\n    <div class=\"asa-bento\">\n      <div class=\"asa-tile asa-tile-mission asa-spot\" data-reveal>\n        <span class=\"asa-k\">Our mission<\/span>\n        <blockquote>To uphold the Sunnah of the Prophet (\ufdfa) and nurture virtuous, exemplary women for the family and the Ummah.<\/blockquote>\n        <div class=\"asa-triad\"><span>Ilm<\/span><span>Amal<\/span><span>Dawah<\/span><\/div>\n      <\/div>\n      <div class=\"asa-tile asa-spot\" data-reveal=\"2\">\n        <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-cap\"\/><\/svg><\/span>\n        <h3>Academic learning<\/h3>\n        <p>A clear path from kindergarten to Grade 10, with general subjects taught alongside the Dars-e-Nizami curriculum.<\/p>\n      <\/div>\n      <div class=\"asa-tile asa-spot\" data-reveal=\"3\">\n        <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-quran\"\/><\/svg><\/span>\n        <h3>Quranic education<\/h3>\n        <p>Five Quran sections help every student move forward at the right pace, from first letters to full Hifz.<\/p>\n      <\/div>\n      <div class=\"asa-tile asa-tile-wide asa-spot\" data-reveal=\"2\">\n        <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-heart\"\/><\/svg><\/span>\n        <div>\n          <h3>A women-led campus<\/h3>\n          <p>Girls and women learn in comfort and privacy, guided by female teachers who care about each student's growth in knowledge and character.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-1651213 e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"1651213\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"1651213\">\n    \t\t<div class=\"elementor-element elementor-element-fb0021e elementor-widget elementor-widget-html\" data-id=\"fb0021e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | PROGRAMS\n  Tabs for Academics, Quran and Hifz, Girls and women. Stage details live in the script at the bottom of this block.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-programs{background:var(--sand)}\n.asa .asa-tabs{position:relative;display:inline-flex;gap:4px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:999px;margin-bottom:38px;box-shadow:var(--shadow)}\n.asa .asa-tab-ind{position:absolute;top:6px;bottom:6px;left:6px;width:0;border-radius:999px;background:var(--green);transition:left .45s var(--ease),width .45s var(--ease);z-index:0}\n.asa .asa-tab{position:relative;z-index:1;padding:12px 22px;border-radius:999px;font-weight:700;font-size:.95rem;color:var(--muted);transition:color .3s;white-space:nowrap}\n.asa .asa-tab:hover{color:var(--green)}\n.asa .asa-tab[aria-selected=\"true\"]{color:#fff}\n.asa .asa-panel[hidden]{display:none}\n.asa .asa-panel{animation:asaFade .5s var(--ease)}\n.asa .asa-journey{display:grid;grid-template-columns:.85fr 1.15fr;gap:22px;align-items:stretch}\n.asa .asa-stages{display:flex;flex-direction:column;gap:10px;position:relative}\n.asa .asa-stage-btn{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;border:1px solid transparent;transition:background .3s,border-color .3s,box-shadow .3s,transform .3s var(--ease);width:100%}\n.asa .asa-stage-btn:hover{background:rgba(255,255,255,.6);transform:translateX(4px)}\n.asa .asa-stage-btn .asa-n{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-weight:800;font-size:1.05rem;background:#fff;color:var(--green);border:1px solid var(--line);flex:none;transition:all .3s}\n.asa .asa-stage-btn b{display:block;font-weight:800;font-size:1.08rem;letter-spacing:-.01em;color:var(--ink)}\n.asa .asa-stage-btn small{display:block;font-size:.88rem;color:var(--muted)}\n.asa .asa-stage-btn[aria-pressed=\"true\"]{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}\n.asa .asa-stage-btn[aria-pressed=\"true\"] .asa-n{background:var(--orange);color:#fff;border-color:var(--orange)}\n.asa .asa-stage-detail{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:36px;box-shadow:var(--shadow);display:flex;flex-direction:column}\n.asa .asa-stage-detail .asa-k{font-weight:700;color:var(--orange-700);font-size:.92rem;margin-bottom:8px}\n.asa .asa-stage-detail h3{font-size:clamp(1.7rem,3vw,2.3rem);margin-bottom:12px}\n.asa .asa-stage-detail p{color:var(--muted);font-size:1.05rem;margin-bottom:24px;max-width:34em}\n.asa .asa-stage-detail .asa-swap{animation:asaFade .45s var(--ease)}\n.asa .asa-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}\n.asa .asa-chips li{font-size:.9rem;font-weight:600;padding:8px 14px;border-radius:12px;background:var(--mint);color:var(--green);transition:transform .25s var(--ease),background .25s}\n.asa .asa-chips li:hover{transform:translateY(-2px);background:var(--mint-2)}\n.asa .asa-stage-detail .asa-foot{margin-top:auto;display:flex;flex-wrap:wrap;gap:14px;align-items:center;color:var(--muted);font-size:.92rem}\n.asa .asa-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}\n.asa .asa-grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}\n.asa .asa-course{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:10px;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}\n.asa .asa-course:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}\n.asa .asa-course .asa-ic{width:50px;height:50px;border-radius:15px;background:var(--mint);color:var(--green);display:grid;place-items:center;margin-bottom:8px;transition:transform .4s var(--ease),background .3s,color .3s}\n.asa .asa-course:hover .asa-ic{transform:rotate(-8deg) scale(1.05);background:var(--orange);color:#fff}\n.asa .asa-course h3{font-size:1.3rem}\n.asa .asa-course p{color:var(--muted);font-size:.98rem;flex:1}\n.asa .asa-course .asa-tag{align-self:flex-start;font-size:.8rem;font-weight:700;color:var(--orange-700);background:var(--orange-soft);padding:5px 12px;border-radius:999px;margin-bottom:4px}\n.asa .asa-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--green);align-self:flex-start;font-size:.95rem;margin-top:6px;padding:9px 16px 9px 18px;border-radius:999px;background:var(--mint);transition:background .25s,color .25s,gap .25s}\n.asa .asa-link:hover{background:var(--green);color:#fff;gap:12px}\n.asa .asa-link svg{width:16px;height:16px}\n.asa .asa-course.asa-featured{background:var(--green);border-color:var(--green);color:#E8F0EA}\n.asa .asa-course.asa-featured h3{color:#fff}\n.asa .asa-course.asa-featured p{color:rgba(232,240,234,.85)}\n.asa .asa-course.asa-featured .asa-ic{background:rgba(255,255,255,.12);color:#fff}\n.asa .asa-course.asa-featured .asa-link{background:#fff;color:var(--green)}\n.asa .asa-course.asa-featured .asa-link:hover{background:var(--orange);color:#fff}\n.asa .asa-course.asa-featured::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.12),transparent 45%)}\n.asa .asa-course.asa-dashed{background:transparent;border-style:dashed;border-color:#CFC7B4}\n@media (max-width:960px){\n  .asa .asa-journey{grid-template-columns:1fr;gap:36px}\n  .asa .asa-grid3{grid-template-columns:repeat(2,1fr)}\n  .asa .asa-stages{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:6px;scrollbar-width:none}\n  .asa .asa-stages::-webkit-scrollbar{display:none}\n  .asa .asa-stage-btn{flex:0 0 auto;width:auto;padding:12px 16px}\n  .asa .asa-stage-btn:hover{transform:none}\n  .asa .asa-stage-btn small{display:none}\n  .asa .asa-stage-btn .asa-n{width:36px;height:36px;border-radius:11px;font-size:.95rem}\n}\n@media (max-width:640px){\n  .asa .asa-tabs{display:flex;overflow-x:auto;max-width:100%;scrollbar-width:none}\n  .asa .asa-tabs::-webkit-scrollbar{display:none}\n  .asa .asa-tab{flex:1 1 auto;text-align:center;padding:11px 10px;font-size:.88rem}\n  .asa .asa-stages{display:grid;grid-template-columns:1fr 1fr;overflow:visible}\n  .asa .asa-stage-btn{width:100%;padding:10px 12px;gap:10px}\n  .asa .asa-stage-btn b{font-size:.95rem}\n  .asa .asa-grid3,.asa .asa-grid2{grid-template-columns:1fr}\n  .asa .asa-stage-detail{padding:24px 20px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-programs\">\n<section class=\"asa-sec asa-programs\" id=\"asa-programs\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Find the right program<\/h2>\n      <p>Pick a category, then tap a stage or course to see the details. Every program has a button that fills in your inquiry for you.<\/p>\n    <\/div>\n\n    <div class=\"asa-tabs\" role=\"tablist\" aria-label=\"Program categories\" data-reveal>\n      <span class=\"asa-tab-ind\" id=\"asa-tab-ind\"><\/span>\n      <button class=\"asa-tab\" role=\"tab\" aria-selected=\"true\" aria-controls=\"asa-p1\" id=\"asa-t1\">Academics<\/button>\n      <button class=\"asa-tab\" role=\"tab\" aria-selected=\"false\" aria-controls=\"asa-p2\" id=\"asa-t2\" tabindex=\"-1\">Quran and Hifz<\/button>\n      <button class=\"asa-tab\" role=\"tab\" aria-selected=\"false\" aria-controls=\"asa-p3\" id=\"asa-t3\" tabindex=\"-1\">Girls and women<\/button>\n    <\/div>\n\n    <!-- Academic journey -->\n    <div class=\"asa-panel\" role=\"tabpanel\" id=\"asa-p1\" aria-labelledby=\"asa-t1\">\n      <div class=\"asa-journey\">\n        <div class=\"asa-stages\" id=\"asa-stages\" role=\"group\" aria-label=\"Academic stages\"><\/div>\n        <div class=\"asa-stage-detail\" id=\"asa-stage-detail\" aria-live=\"polite\"><\/div>\n      <\/div>\n    <\/div>\n\n    <!-- Quran -->\n    <div class=\"asa-panel\" role=\"tabpanel\" id=\"asa-p2\" aria-labelledby=\"asa-t2\" hidden>\n      <div class=\"asa-grid3\">\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-book\"\/><\/svg><\/span>\n          <h3>Noorani Section<\/h3>\n          <p>Learn the Arabic letters, correct pronunciation and how letters join, building a strong base for reading the Quran.<\/p>\n          <button class=\"asa-link\" data-ask=\"Noorani Section\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-quran\"\/><\/svg><\/span>\n          <h3>Nazera Section<\/h3>\n          <p>Read the Quran fluently from the Mushaf with proper Tajweed. Available as a full-time program.<\/p>\n          <button class=\"asa-link\" data-ask=\"Nazera \/ Qaidah (Full time)\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-featured asa-spot\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-star\"\/><\/svg><\/span>\n          <h3>Hifz Section<\/h3>\n          <p>Memorize the Holy Quran with a daily lesson, steady revision and close teacher guidance. A residential option is available.<\/p>\n          <button class=\"asa-link\" data-ask=\"Hifz \/ Quran\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-pen\"\/><\/svg><\/span>\n          <h3>Taheli Section<\/h3>\n          <p>Guided Quran study for students who have finished the basics and want to polish their recitation further.<\/p>\n          <button class=\"asa-link\" data-ask=\"Taheli Section\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-cap\"\/><\/svg><\/span>\n          <h3>Kitab Section<\/h3>\n          <p>Study of classical Islamic books in Arabic for students moving toward advanced religious learning.<\/p>\n          <button class=\"asa-link\" data-ask=\"Kitab Section\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-dashed\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-info\"\/><\/svg><\/span>\n          <h3>Not sure which level?<\/h3>\n          <p>Our teachers assess each new student and place them in the section that fits their reading level.<\/p>\n          <a class=\"asa-link\" href=\"tel:+8801843222118\">Call 01843-222118<\/a>\n        <\/article>\n      <\/div>\n    <\/div>\n\n    <!-- Girls and women -->\n    <div class=\"asa-panel\" role=\"tabpanel\" id=\"asa-p3\" aria-labelledby=\"asa-t3\" hidden>\n      <div class=\"asa-grid2\">\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-tag\">Part time<\/span>\n          <h3>Quran course for school-going girls<\/h3>\n          <p>Girls who study at other schools can learn Nazera and Qaidah here on a part-time schedule, in a supportive all-female setting.<\/p>\n          <button class=\"asa-link\" data-ask=\"Nazera \/ Qaidah (Part time, girls)\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-tag\">For adult women<\/span>\n          <h3>Quran program for elderly women<\/h3>\n          <p>It is never too late to read the Book of Allah. Mothers and grandmothers learn at a comfortable pace with patient female teachers.<\/p>\n          <button class=\"asa-link\" data-ask=\"Quran program for elderly women\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-tag\">Language<\/span>\n          <h3>Spoken English and Arabic<\/h3>\n          <p>Practical speaking classes that build real communication skills, so students talk with fluency and confidence in both languages.<\/p>\n          <button class=\"asa-link\" data-ask=\"Spoken English \/ Arabic\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n        <article class=\"asa-course asa-spot\">\n          <span class=\"asa-tag\">Creative<\/span>\n          <h3>Calligraphy and creative clubs<\/h3>\n          <p>Students explore the art of Arabic calligraphy with new styles and techniques, along with science and creative projects.<\/p>\n          <button class=\"asa-link\" data-ask=\"Calligraphy \/ Creative clubs\">Ask about this <svg class=\"asa-i\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n        <\/article>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  \/* Academic stages. Edit titles, descriptions and class lists here. *\/\n  var STAGES=[\n    {t:'Early years',r:'KG-1 to KG-3',d:'A gentle, playful start with reading, numbers, duas and daily adab.',c:['KG-1 (Play)','KG-2 (Nursery)','KG-3 (KG)'],ask:'Early years (KG)'},\n    {t:'Primary',r:'Grade 1 to 5',d:'Strong basics in language, maths and science, with regular Quran study every week.',c:['Grade 1','Grade 2','Grade 3','Grade 4','Grade 5'],ask:'Primary (Grade 1 to 5)'},\n    {t:'Dars-e-Nizami',r:'Grade 6 to 10',d:'General subjects taught side by side with classical Islamic studies, preparing students for higher learning.',c:['Grade 6','Grade 7','Grade 8','Grade 9','Grade 10'],ask:'Dars-e-Nizami (Grade 6 to 10)'},\n    {t:'Higher Islamic studies',r:'Sanawiyyah to Dawrah',d:'In-depth study of Hadith, Fiqh and Arabic texts, completed stage by stage.',c:['Sanawiyyah','Meshkat','Dawrah-e-Hadith'],ask:'Higher Islamic studies'}\n  ];\n\n  function init(){\n    var box=document.getElementById('asa-programs'); if(!box) return;\n    var ico=function(id,cls){return '<svg class=\"asa-i'+(cls?' '+cls:'')+'\"><use href=\"#asa-i-'+id+'\"\/><\/svg>'};\n\n    \/* Tabs with sliding indicator *\/\n    var tabs=[].slice.call(box.querySelectorAll('.asa-tab')), ind=document.getElementById('asa-tab-ind');\n    function moveInd(tab){ind.style.left=tab.offsetLeft+'px'; ind.style.width=tab.offsetWidth+'px';}\n    function selectTab(tab){\n      tabs.forEach(function(t){var on=t===tab; t.setAttribute('aria-selected',on); t.tabIndex=on?0:-1; document.getElementById(t.getAttribute('aria-controls')).hidden=!on;});\n      moveInd(tab);\n    }\n    tabs.forEach(function(t,i){\n      t.addEventListener('click',function(){selectTab(t)});\n      t.addEventListener('keydown',function(e){var n=e.key==='ArrowRight'?1:e.key==='ArrowLeft'?-1:0; if(!n) return; var nx=tabs[(i+n+tabs.length)%tabs.length]; selectTab(nx); nx.focus();});\n    });\n    function sync(){var a=tabs.filter(function(t){return t.getAttribute('aria-selected')==='true'})[0]; if(a) moveInd(a);}\n    sync(); window.addEventListener('resize',sync); window.addEventListener('load',sync);\n    if(document.fonts&&document.fonts.ready) document.fonts.ready.then(sync);\n\n    \/* Academic journey *\/\n    var list=document.getElementById('asa-stages'), detail=document.getElementById('asa-stage-detail');\n    function show(i){\n      var s=STAGES[i];\n      [].forEach.call(list.children,function(b,j){b.setAttribute('aria-pressed',j===i)});\n      detail.innerHTML='<div class=\"asa-swap\" style=\"display:flex;flex-direction:column;height:100%\"><span class=\"asa-k\">Stage '+(i+1)+' of '+STAGES.length+'<\/span><h3>'+s.t+'<\/h3><p>'+s.d+'<\/p><ul class=\"asa-chips\">'+\n        s.c.map(function(c){return '<li>'+c+'<\/li>'}).join('')+'<\/ul><div class=\"asa-foot\"><button class=\"asa-btn asa-btn-green asa-btn-sm\" data-ask=\"'+s.ask+'\">Ask about this stage '+ico('arrow','asa-arrow')+'<\/button><span>Seats are limited in each grade.<\/span><\/div><\/div>';\n    }\n    STAGES.forEach(function(s,i){\n      var b=document.createElement('button'); b.type='button'; b.className='asa-stage-btn';\n      b.innerHTML='<span class=\"asa-n\">'+(i+1)+'<\/span><span><b>'+s.t+'<\/b><small>'+s.r+'<\/small><\/span>';\n      b.addEventListener('click',function(){show(i)}); list.appendChild(b);\n    });\n    show(0);\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-9c7e00e e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"9c7e00e\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"9c7e00e\">\n    \t\t<div class=\"elementor-element elementor-element-2ec0fb8 elementor-widget elementor-widget-html\" data-id=\"2ec0fb8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | WHY CHOOSE US\n  Eight feature cards.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}\n.asa .asa-why-item{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}\n.asa .asa-why-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}\n.asa .asa-why-item .asa-ic{width:48px;height:48px;border-radius:14px;background:var(--orange-soft);color:var(--orange-700);display:grid;place-items:center;margin-bottom:18px;transition:transform .4s var(--ease),background .3s,color .3s}\n.asa .asa-why-item:hover .asa-ic{background:var(--orange);color:#fff;transform:scale(1.08) rotate(-6deg)}\n.asa .asa-why-item h3{font-size:1.12rem;margin-bottom:6px;letter-spacing:-.015em}\n.asa .asa-why-item p{color:var(--muted);font-size:.95rem;line-height:1.6}\n@media (max-width:1100px){\n  .asa .asa-why-grid{grid-template-columns:repeat(2,1fr)}\n}\n@media (max-width:640px){\n  .asa .asa-why-grid{grid-template-columns:1fr 1fr;gap:10px}\n  .asa .asa-why-item{padding:20px 16px}\n  .asa .asa-why-item p{font-size:.88rem}\n}\n<\/style>\n\n<div class=\"asa asa-blk-why\">\n<section class=\"asa-sec\" id=\"asa-why\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Why families trust As Suffah<\/h2>\n      <p>Parents want two things for their children: sound knowledge and good character. These everyday strengths help us deliver both.<\/p>\n    <\/div>\n    <div class=\"asa-why-grid\">\n      <div class=\"asa-why-item\" data-reveal><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-award\"\/><\/svg><\/span><h3>Qualified teachers<\/h3><p>Trained teachers who know every student by name.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"2\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-users\"\/><\/svg><\/span><h3>Small class size<\/h3><p>Fewer students per class, more attention for each child.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"3\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-moon\"\/><\/svg><\/span><h3>Talim and Tarbiyah<\/h3><p>Islamic values and daily adab are part of every school day.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"4\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-monitor\"\/><\/svg><\/span><h3>Smart classrooms<\/h3><p>Digital tools make lessons clear and engaging.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-eye\"\/><\/svg><\/span><h3>CCTV surveillance<\/h3><p>The whole campus is monitored to keep students safe.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"2\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-bus\"\/><\/svg><\/span><h3>Safe transport<\/h3><p>Reliable transport to and from the academy.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"3\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-chip\"\/><\/svg><\/span><h3>Digital management<\/h3><p>All operations run on software for accuracy and transparency.<\/p><\/div>\n      <div class=\"asa-why-item\" data-reveal=\"4\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-wallet\"\/><\/svg><\/span><h3>Affordable fees<\/h3><p>Quality education at a cost families can plan for.<\/p><\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-b04655d e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"b04655d\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"b04655d\">\n    \t\t<div class=\"elementor-element elementor-element-a681bfd elementor-widget elementor-widget-html\" data-id=\"a681bfd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | HOSTEL\n  Hostel photo, what to bring, and the 4 accommodation plans. Plan prices live in the script at the bottom of this block.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-hostel{position:relative;background:var(--green-900);color:#DCE7E0;overflow:hidden}\n.asa .asa-hostel::before{content:\"\";position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(42,100,71,.65),transparent 65%);left:-250px;top:-250px;pointer-events:none}\n.asa .asa-hostel::after{content:\"\";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(224,122,52,.18),transparent 65%);right:-160px;bottom:-200px;pointer-events:none}\n.asa .asa-hostel .asa-wrap{position:relative;z-index:1}\n.asa .asa-hostel .asa-head h2{color:#fff}\n.asa .asa-hostel .asa-head p{color:rgba(220,231,224,.8)}\n.asa .asa-hostel-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:start}\n.asa .asa-hostel-photo{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4\/3.4;margin-bottom:18px}\n.asa .asa-hostel-photo:hover img{transform:scale(1.05)}\n.asa .asa-bring{padding:22px 24px;border-radius:var(--r);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}\n.asa .asa-bring h4{color:#fff;font-size:1.05rem;margin-bottom:12px;letter-spacing:-.01em}\n.asa .asa-bring ul{display:flex;flex-wrap:wrap;gap:8px}\n.asa .asa-bring li{display:flex;gap:8px;align-items:center;font-size:.92rem;font-weight:600;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.08)}\n.asa .asa-bring svg{color:var(--orange);width:17px;height:17px}\n.asa .asa-plans{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:14px}\n.asa .asa-plan{position:relative;text-align:left;padding:18px 20px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#DCE7E0;transition:border-color .3s,background .3s,transform .3s var(--ease)}\n.asa .asa-plan:hover{border-color:rgba(255,255,255,.4);transform:translateY(-3px)}\n.asa .asa-plan[aria-pressed=\"true\"]{background:#fff;border-color:#fff;color:var(--ink)}\n.asa .asa-plan small{display:block;font-size:.8rem;font-weight:600;opacity:.7}\n.asa .asa-plan b{display:block;font-weight:800;font-size:1.02rem;line-height:1.3;letter-spacing:-.01em;margin-top:2px}\n.asa .asa-plan em{display:block;font-style:normal;font-weight:800;font-size:1.35rem;letter-spacing:-.03em;margin-top:10px;color:var(--orange)}\n.asa .asa-plan em span{font-size:.8rem;font-weight:500;opacity:.7;letter-spacing:0}\n.asa .asa-plan-detail{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:30px}\n.asa .asa-pd-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px}\n.asa .asa-pd-top h3{font-size:1.5rem}\n.asa .asa-pd-top p{color:var(--muted);font-size:.92rem}\n.asa .asa-big-num{font-size:clamp(2.2rem,4vw,2.9rem);font-weight:800;letter-spacing:-.045em;color:var(--green);line-height:1;font-variant-numeric:tabular-nums}\n.asa .asa-big-num small{font-size:.9rem;font-weight:600;color:var(--muted);letter-spacing:0}\n.asa .asa-meals{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}\n.asa .asa-meals li{display:flex;align-items:center;gap:7px;font-size:.86rem;font-weight:700;padding:7px 13px;border-radius:999px;background:var(--orange-soft);color:var(--orange-700);opacity:0;transform:scale(.85);animation:asaPop .4s var(--ease) forwards}\n.asa .asa-meals svg{width:15px;height:15px}\n@keyframes asaPop{to{opacity:1;transform:none}}\n.asa .asa-breakdown li{display:grid;grid-template-columns:130px 1fr auto;gap:14px;align-items:center;padding:9px 0;font-size:.95rem}\n.asa .asa-breakdown li span:first-child{color:var(--muted);font-weight:500}\n.asa .asa-bar-track{height:10px;border-radius:5px;background:var(--mint);overflow:hidden}\n.asa .asa-bar-fill{display:block;height:100%;width:0;border-radius:5px;background:linear-gradient(90deg,var(--green),var(--green-700));transition:width .9s var(--ease)}\n.asa .asa-breakdown li b{font-weight:700;font-variant-numeric:tabular-nums;min-width:68px;text-align:right}\n@media (max-width:960px){\n  .asa .asa-hostel-grid{grid-template-columns:1fr;gap:36px}\n}\n@media (max-width:640px){\n  .asa .asa-plans{grid-template-columns:1fr}\n  .asa .asa-plan-detail{padding:24px 20px}\n  .asa .asa-breakdown li{grid-template-columns:104px 1fr auto;gap:10px;font-size:.9rem}\n}\n@media (prefers-reduced-motion:reduce){\n  .asa .asa-meals li{opacity:1;transform:none}\n}\n<\/style>\n\n<div class=\"asa asa-blk-hostel\">\n<section class=\"asa-sec asa-hostel\" id=\"asa-hostel\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>A comfortable home on campus<\/h2>\n      <p>Air-conditioned rooms, daily meals and caring supervision. Pick a plan to see what it includes and the monthly cost.<\/p>\n    <\/div>\n    <div class=\"asa-hostel-grid\">\n      <div data-reveal>\n        <div class=\"asa-hostel-photo\">\n          <div class=\"asa-photo\" data-label=\"Add hostel photo\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/Laptop-room.webp\" alt=\"Laptops on a table with chairs in a room at As Suffah Academy\" width=\"1016\" height=\"1355\" loading=\"lazy\">\n          <\/div>\n        <\/div>\n        <div class=\"asa-bring\">\n          <h4>Residential students should bring<\/h4>\n          <ul>\n            <li><svg class=\"asa-i\"><use href=\"#asa-i-bed\"\/><\/svg>Two bed covers<\/li>\n            <li><svg class=\"asa-i\"><use href=\"#asa-i-bed\"\/><\/svg>Two pillow cases<\/li>\n            <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Personal essentials<\/li>\n          <\/ul>\n        <\/div>\n      <\/div>\n      <div data-reveal=\"2\">\n        <div class=\"asa-plans\" id=\"asa-plans\" role=\"group\" aria-label=\"Accommodation plans\"><\/div>\n        <div class=\"asa-plan-detail\" id=\"asa-plan-detail\" aria-live=\"polite\"><\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  \/* Monthly accommodation fees. Edit the amounts here; totals update automatically. *\/\n  var PLANS=[\n    {cat:'Category 01',name:'Hifz residential',meals:['Breakfast','Brunch','Lunch','Snacks','Dinner'],items:[['Tuition fee',4500],['Seat rent',500],['Food bill',6000],['Service charge',1000]],note:'Any other charges are confirmed by the admission office.'},\n    {cat:'Category 01',name:'Academy residential',meals:['Breakfast','Brunch','Lunch','Snacks','Dinner'],items:[['Tuition fee',2500],['Seat rent',500],['Food bill',6000],['Coaching fee',1500],['Service charge',1000]]},\n    {cat:'Category 02',name:'Residential, 3 meals',meals:['Breakfast','Lunch','Dinner'],items:[['Tuition fee',2500],['Seat rent',500],['Food bill',5000],['Coaching fee',1500],['Service charge',1000]]},\n    {cat:'Category 03',name:'Day-care',meals:['Lunch','Snacks'],items:[['Tuition fee',2500],['Seat rent',500],['Food bill',3000],['Coaching fee',1500],['Service charge',1000]]}\n  ];\n\n  function init(){\n    var box=document.getElementById('asa-plans'), detail=document.getElementById('asa-plan-detail'); if(!box||!detail) return;\n    var tk=function(n){return '\u09f3'+Math.round(n).toLocaleString('en-IN')};\n    var ico=function(id){return '<svg class=\"asa-i\"><use href=\"#asa-i-'+id+'\"\/><\/svg>'};\n    var countTo=function(el,to){ if(window.ASA) ASA.countTo(el,to,tk); else el.textContent=tk(to); };\n    var sum=function(items){return items.reduce(function(a,b){return a+b[1]},0)};\n    detail.innerHTML='<div class=\"asa-pd-top\"><div><h3 id=\"asa-pd-name\"><\/h3><p id=\"asa-pd-cat\"><\/p><\/div><div class=\"asa-big-num\"><span id=\"asa-pd-total\" data-now=\"0\">\u09f30<\/span> <small>\/month<\/small><\/div><\/div><ul class=\"asa-meals\" id=\"asa-pd-meals\"><\/ul><ul class=\"asa-breakdown\" id=\"asa-pd-rows\"><\/ul><p class=\"asa-note\">'+ico('info')+'<span id=\"asa-pd-note\"><\/span><\/p>';\n    var q=function(id){return document.getElementById(id)};\n    function show(i){\n      var p=PLANS[i];\n      [].forEach.call(box.children,function(b,j){b.setAttribute('aria-pressed',j===i)});\n      q('asa-pd-name').textContent=p.name; q('asa-pd-cat').textContent=p.cat+' monthly fee, tuition included';\n      countTo(q('asa-pd-total'),sum(p.items));\n      q('asa-pd-meals').innerHTML=p.meals.map(function(m,k){return '<li style=\"animation-delay:'+(k*70)+'ms\">'+ico('food')+m+'<\/li>'}).join('');\n      var max=Math.max.apply(null,p.items.map(function(r){return r[1]}));\n      q('asa-pd-rows').innerHTML=p.items.map(function(r){return '<li><span>'+r[0]+'<\/span><span class=\"asa-bar-track\"><span class=\"asa-bar-fill\" data-w=\"'+(r[1]\/max*100).toFixed(1)+'\"><\/span><\/span><b>'+tk(r[1])+'<\/b><\/li>'}).join('');\n      requestAnimationFrame(function(){requestAnimationFrame(function(){[].forEach.call(q('asa-pd-rows').querySelectorAll('.asa-bar-fill'),function(f){f.style.width=f.getAttribute('data-w')+'%'})})});\n      q('asa-pd-note').textContent=p.note||'Please confirm eligibility for this category with the admission office.';\n    }\n    PLANS.forEach(function(p,i){\n      var b=document.createElement('button'); b.className='asa-plan'; b.type='button';\n      b.innerHTML='<small>'+p.cat+'<\/small><b>'+p.name+'<\/b><em>'+tk(sum(p.items))+' <span>\/month<\/span><\/em>';\n      b.addEventListener('click',function(){show(i)}); box.appendChild(b);\n    });\n    show(0);\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-9e96152 e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"9e96152\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"9e96152\">\n    \t\t<div class=\"elementor-element elementor-element-430f731 elementor-widget elementor-widget-html\" data-id=\"430f731\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | CLUBS AND ACTIVITIES\n  Five clubs, the moving events strip and student benefits.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-clubs{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:56px}\n.asa .asa-club{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 20px;transition:transform .35s var(--ease),box-shadow .35s,background .35s,color .35s}\n.asa .asa-club .asa-ic{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;margin-bottom:22px;background:var(--mint);color:var(--green);transition:background .35s,color .35s,transform .4s var(--ease)}\n.asa .asa-club h3{font-size:1.08rem;letter-spacing:-.015em;line-height:1.3}\n.asa .asa-club:hover{transform:translateY(-6px);background:var(--green);color:#fff;box-shadow:var(--shadow-lg)}\n.asa .asa-club:hover h3{color:#fff}\n.asa .asa-club:hover .asa-ic{background:var(--orange);color:#fff;transform:rotate(-8deg)}\n.asa .asa-marquee{overflow:hidden;padding:6px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}\n.asa .asa-track{display:flex;gap:14px;width:max-content;animation:asaMarq 38s linear infinite}\n.asa .asa-marquee:hover .asa-track{animation-play-state:paused}\n.asa .asa-track li{display:flex;align-items:center;gap:12px;padding:16px 24px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:700;white-space:nowrap;transition:border-color .25s,color .25s}\n.asa .asa-track li:hover{border-color:var(--orange);color:var(--orange-700)}\n.asa .asa-track svg{color:var(--orange)}\n@keyframes asaMarq{to{transform:translateX(calc(-50% - 7px))}}\n.asa .asa-gains{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:44px}\n.asa .asa-gains li{display:flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:var(--mint);color:var(--green);font-weight:600;font-size:.93rem}\n.asa .asa-gains svg{width:17px;height:17px}\n@media (max-width:1100px){\n  .asa .asa-clubs{grid-template-columns:repeat(3,1fr)}\n}\n@media (max-width:640px){\n  .asa .asa-clubs{grid-template-columns:1fr 1fr}\n  .asa .asa-clubs .asa-club:last-child{grid-column:span 2}\n}\n<\/style>\n\n<div class=\"asa asa-blk-activities\">\n<section class=\"asa-sec\" id=\"asa-activities\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Learning that goes beyond books<\/h2>\n      <p>Clubs and events help students think critically, speak with confidence and work well in a team.<\/p>\n    <\/div>\n    <div class=\"asa-clubs\">\n      <div class=\"asa-club\" data-reveal><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-chat\"\/><\/svg><\/span><h3>Language Club<\/h3><\/div>\n      <div class=\"asa-club\" data-reveal=\"2\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-flask\"\/><\/svg><\/span><h3>Science and Innovation Club<\/h3><\/div>\n      <div class=\"asa-club\" data-reveal=\"3\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-moon\"\/><\/svg><\/span><h3>Islamic and Arabic Club<\/h3><\/div>\n      <div class=\"asa-club\" data-reveal=\"4\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-monitor\"\/><\/svg><\/span><h3>Digital Technology Club<\/h3><\/div>\n      <div class=\"asa-club\" data-reveal=\"4\"><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-pen\"\/><\/svg><\/span><h3>Calligraphy and Creative Club<\/h3><\/div>\n    <\/div>\n  <\/div>\n  <div class=\"asa-marquee\" aria-label=\"Events through the year\">\n    <ul class=\"asa-track\" id=\"asa-track\">\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-moon\"\/><\/svg>Talim and Tarbiyah<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-quran\"\/><\/svg>Quran Recitation Competition<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-sparkle\"\/><\/svg>Annual Cultural Program<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-calc\"\/><\/svg>Maths Carnival<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-book\"\/><\/svg>Spelling Bee and Book Reading<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-chat\"\/><\/svg>Arabic and Bengali Bee<\/li>\n    <\/ul>\n  <\/div>\n  <div class=\"asa-wrap\">\n    <ul class=\"asa-gains\" data-reveal aria-label=\"What students gain\">\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Critical thinking<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Creativity<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Confident communication<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Scientific curiosity<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Teamwork<\/li>\n      <li><svg class=\"asa-i\"><use href=\"#asa-i-check\"\/><\/svg>Cross-subject knowledge<\/li>\n    <\/ul>\n  <\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  function init(){\n    \/* Copies the event list once so the moving strip loops without a gap *\/\n    var track=document.getElementById('asa-track'); if(!track||track.getAttribute('data-done')) return;\n    track.setAttribute('data-done','1');\n    var n=track.children.length; track.innerHTML+=track.innerHTML;\n    [].slice.call(track.children,n).forEach(function(li){li.setAttribute('aria-hidden','true')});\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-170d499 e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"170d499\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"170d499\">\n    \t\t<div class=\"elementor-element elementor-element-151a91d elementor-widget elementor-widget-html\" data-id=\"151a91d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | PRINCIPAL\n  Principal photo, qualifications and message.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-principal{background:var(--sand)}\n.asa .asa-pr-card{display:grid;grid-template-columns:.8fr 1.2fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}\n.asa .asa-pr-photo{position:relative;min-height:440px}\n.asa .asa-monogram{position:absolute;inset:0;display:grid;place-items:center;font-size:6rem;font-weight:800;letter-spacing:-.06em;color:var(--green);opacity:.18}\n.asa .asa-pr-text{padding:48px}\n.asa .asa-pr-role{display:inline-block;font-weight:700;font-size:.88rem;color:var(--orange-700);background:var(--orange-soft);padding:6px 14px;border-radius:999px;margin-bottom:16px}\n.asa .asa-pr-text h2{font-size:clamp(2rem,4vw,2.9rem);margin-bottom:24px;letter-spacing:-.035em}\n.asa .asa-creds{display:grid;gap:10px;margin-bottom:28px}\n.asa .asa-creds li{display:flex;gap:14px;align-items:center;padding:14px 18px;background:var(--cream);border-radius:14px;border:1px solid var(--line);transition:transform .3s var(--ease),border-color .3s}\n.asa .asa-creds li:hover{transform:translateX(6px);border-color:var(--orange)}\n.asa .asa-creds .asa-ic{width:40px;height:40px;border-radius:12px;background:var(--orange-soft);color:var(--orange-700);display:grid;place-items:center;flex:none}\n.asa .asa-creds b{display:block;color:var(--ink);font-weight:700;font-size:.98rem}\n.asa .asa-creds span{font-size:.88rem;color:var(--muted)}\n.asa .asa-pr-msg{position:relative;padding-left:22px;border-left:3px solid var(--orange);color:var(--ink);font-size:1.04rem;line-height:1.75}\n.asa .asa-pr-msg p+p{margin-top:12px}\n@media (max-width:960px){\n  .asa .asa-pr-card{grid-template-columns:1fr}\n  .asa .asa-pr-photo{min-height:320px}\n  .asa .asa-pr-text{padding:32px}\n}\n@media (max-width:640px){\n  .asa .asa-pr-text{padding:26px 20px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-principal\">\n<section class=\"asa-sec asa-principal\" id=\"asa-principal\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-pr-card\" data-reveal>\n      <div class=\"asa-pr-photo\">\n        <div class=\"asa-photo\" data-label=\"Add principal's photo\" style=\"position:absolute;inset:0\">\n          \n          <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/Hijabi-Woman-Writing-at-Desk.webp\" alt=\"Nazmun Nessa, Founder and Principal of As Suffah Academy\" width=\"1254\" height=\"1254\" loading=\"lazy\">\n        <\/div>\n      <\/div>\n      <div class=\"asa-pr-text\">\n        <span class=\"asa-pr-role\">Founder and Principal<\/span>\n        <h2>Nazmun Nessa<\/h2>\n        <ul class=\"asa-creds\">\n          <li><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-award\"\/><\/svg><\/span><div><b>D.A.L, First Class First<\/b><span>Umm Al-Qura University, Makkah, KSA<\/span><\/div><\/li>\n          <li><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-cap\"\/><\/svg><\/span><div><b>B.S.S and M.A, First Class Second<\/b><span>Southern University, Bangladesh<\/span><\/div><\/li>\n          <li><span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-book\"\/><\/svg><\/span><div><b>Dawrah-e-Hadith, First Class<\/b><span>Advanced study of Hadith<\/span><\/div><\/li>\n        <\/ul>\n        <div class=\"asa-pr-msg\">\n          <!-- Replace these two paragraphs with the Principal's own approved message -->\n          <p>Alhamdulillah, our Principal guides the academy with wisdom and care, leading students and teachers toward excellence in both knowledge and character.<\/p>\n          <p>Her vision shapes everything we do: a place where girls and women gain beneficial knowledge, live by the Sunnah and grow into confident, virtuous members of society.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-0cdfbde e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"0cdfbde\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"0cdfbde\">\n    \t\t<div class=\"elementor-element elementor-element-a9b5e91 elementor-widget elementor-widget-html\" data-id=\"a9b5e91\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | ADMISSION AND FEES\n  Four admission steps, fee explorer and inquiry form. Fee amounts live in the script at the bottom of this block.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:56px;position:relative}\n.asa .asa-step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}\n.asa .asa-step:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}\n.asa .asa-step .asa-n{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800;margin-bottom:18px;transition:background .3s,transform .4s var(--ease)}\n.asa .asa-step:hover .asa-n{background:var(--orange);transform:scale(1.1)}\n.asa .asa-step:not(:last-child)::after{content:\"\";position:absolute;top:46px;right:-17px;width:18px;height:2px;background:var(--line)}\n.asa .asa-step h3{font-size:1.12rem;margin-bottom:6px;letter-spacing:-.015em}\n.asa .asa-step p{color:var(--muted);font-size:.94rem;line-height:1.6}\n.asa .asa-adm-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start}\n.asa .asa-box{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow)}\n.asa .asa-box h3{font-size:1.5rem;margin-bottom:6px}\n.asa .asa-box>p{color:var(--muted);font-size:.97rem;margin-bottom:22px}\n.asa .asa-fee-pick{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}\n.asa .asa-fee-pick button{padding:10px 16px;border-radius:999px;border:1.5px solid var(--line);font-size:.88rem;font-weight:700;color:var(--muted);transition:all .25s var(--ease)}\n.asa .asa-fee-pick button:hover{border-color:var(--green);color:var(--green);transform:translateY(-2px)}\n.asa .asa-fee-pick button[aria-pressed=\"true\"]{background:var(--green);border-color:var(--green);color:#fff}\n.asa .asa-fee-sum{display:grid;grid-template-columns:1.2fr 1fr;gap:12px;margin-bottom:20px}\n.asa .asa-fee-sum div{padding:20px 22px;border-radius:18px;background:var(--mint)}\n.asa .asa-fee-sum div:first-child{background:var(--green);color:#fff}\n.asa .asa-fee-sum small{display:block;font-size:.85rem;font-weight:600;opacity:.8}\n.asa .asa-fee-sum strong{font-size:clamp(1.8rem,3vw,2.3rem);font-weight:800;letter-spacing:-.04em;line-height:1.15;font-variant-numeric:tabular-nums}\n.asa .asa-table{width:100%;border-collapse:collapse;font-size:.95rem;margin:0;border:0;table-layout:auto}\n.asa .asa-table th,.asa .asa-table td{padding:11px 0;border:0;border-bottom:1px dashed var(--line);text-align:left;background:none;vertical-align:middle;color:var(--ink)}\n.asa .asa-table td:first-child{color:var(--muted)}\n.asa .asa-table td:last-child{text-align:right;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}\n.asa .asa-table tr{animation:asaFade .4s var(--ease) both}\n.asa .asa-table tr.asa-total td{border-bottom:0;border-top:2px solid var(--green);padding-top:14px;font-weight:800;color:var(--green);font-size:1.05rem}\n.asa .asa-form{display:grid;gap:14px}\n.asa .asa-field label{display:block;font-size:.86rem;font-weight:700;margin-bottom:6px;color:var(--ink)}\n.asa .asa-field input,.asa .asa-field select,.asa .asa-field textarea{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:14px;background:var(--cream);font-size:1rem;line-height:1.4;box-shadow:none;margin:0;height:auto;transition:border-color .25s,background .25s,box-shadow .25s}\n.asa .asa-field input:focus,.asa .asa-field select:focus,.asa .asa-field textarea:focus{outline:none;border-color:var(--green);background:#fff;box-shadow:0 0 0 4px rgba(31,77,54,.1)}\n.asa .asa-field textarea{min-height:96px;resize:vertical}\n.asa .asa-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}\n.asa .asa-field.asa-err input{border-color:#C0392B;animation:asaShake .35s}\n@keyframes asaShake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}\n.asa .asa-form .asa-btn{width:100%;margin-top:4px}\n.asa .asa-status{font-size:.92rem;padding:12px 14px;border-radius:12px;background:var(--mint);color:var(--green);display:none;font-weight:500}\n.asa .asa-status.asa-show{display:block;animation:asaFade .4s var(--ease)}\n.asa .asa-alt{font-size:.9rem;color:var(--muted);text-align:center}\n.asa .asa-alt a{color:var(--green);font-weight:700}\n@media (max-width:960px){\n  .asa .asa-adm-grid{grid-template-columns:1fr;gap:36px}\n  .asa .asa-steps{grid-template-columns:repeat(2,1fr)}\n  .asa .asa-step::after{display:none}\n}\n@media (max-width:640px){\n  .asa .asa-row,.asa .asa-fee-sum,.asa .asa-steps{grid-template-columns:1fr}\n  .asa .asa-box{padding:24px 20px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-admission\">\n<section class=\"asa-sec\" id=\"asa-admission\">\n  <div class=\"asa-wrap\">\n<div class=\"asa-head\" data-reveal>\n<h2>Check the fees and apply<\/h2>\n<p>Admission opens in November. Check the fees for your program below and send us an inquiry in less than a minute.<\/p>\n<\/div>\n    \n    \n\n    <div class=\"asa-adm-grid\">\n      <div class=\"asa-box\" data-reveal>\n        <h3>Check the fees<\/h3>\n        <p>Select a program to see the total cost at admission and the monthly tuition.<\/p>\n        <div class=\"asa-fee-pick\" id=\"asa-fee-pick\" role=\"group\" aria-label=\"Select program\"><\/div>\n        <div class=\"asa-fee-sum\">\n          <div><small>Total at admission<\/small><strong id=\"asa-fee-total\">\u09f30<\/strong><\/div>\n          <div><small id=\"asa-fee-mlabel\">Monthly tuition<\/small><strong id=\"asa-fee-monthly\">\u09f30<\/strong><\/div>\n        <\/div>\n        <table class=\"asa-table\" id=\"asa-fee-table\" aria-live=\"polite\"><\/table>\n        <p class=\"asa-note\"><svg class=\"asa-i\"><use href=\"#asa-i-info\"\/><\/svg><span id=\"asa-fee-note\"><\/span><\/p>\n      <\/div>\n\n      <div class=\"asa-box\" id=\"asa-inquiry\" data-reveal=\"2\">\n        <h3>Send an inquiry<\/h3>\n        <p>Fill in the details and your email app will open with the message ready to send.<\/p>\n        <form class=\"asa-form\" id=\"asa-form\" novalidate>\n          <div class=\"asa-row\">\n            <div class=\"asa-field\"><label for=\"asa-f-student\">Student name<\/label><input id=\"asa-f-student\" name=\"student\" type=\"text\" autocomplete=\"off\" required><\/div>\n            <div class=\"asa-field\"><label for=\"asa-f-guardian\">Guardian name<\/label><input id=\"asa-f-guardian\" name=\"guardian\" type=\"text\" autocomplete=\"name\" required><\/div>\n          <\/div>\n          <div class=\"asa-row\">\n            <div class=\"asa-field\"><label for=\"asa-f-phone\">Phone number<\/label><input id=\"asa-f-phone\" name=\"phone\" type=\"tel\" inputmode=\"tel\" placeholder=\"01XXXXXXXXX\" autocomplete=\"tel\" required><\/div>\n            <div class=\"asa-field\"><label for=\"asa-f-course\">Program<\/label>\n              <select id=\"asa-f-course\" name=\"course\">\n                <option>Academic classes<\/option>\n                <option>Early years (KG)<\/option>\n                <option>Primary (Grade 1 to 5)<\/option>\n                <option>Dars-e-Nizami (Grade 6 to 10)<\/option>\n                <option>Higher Islamic studies<\/option>\n                <option>Noorani Section<\/option>\n                <option>Nazera \/ Qaidah (Full time)<\/option>\n                <option>Hifz \/ Quran<\/option>\n                <option>Taheli Section<\/option>\n                <option>Kitab Section<\/option>\n                <option>Nazera \/ Qaidah (Part time, girls)<\/option>\n                <option>Quran program for elderly women<\/option>\n                <option>Spoken English \/ Arabic<\/option>\n                <option>Calligraphy \/ Creative clubs<\/option>\n                <option>Hostel \/ Residential<\/option>\n              <\/select>\n            <\/div>\n          <\/div>\n          <div class=\"asa-field\"><label for=\"asa-f-msg\">Message (optional)<\/label><textarea id=\"asa-f-msg\" name=\"message\" placeholder=\"Child's age, current class, hostel needs or any question\"><\/textarea><\/div>\n          <button type=\"submit\" class=\"asa-btn asa-btn-orange\">Send inquiry <svg class=\"asa-i asa-arrow\"><use href=\"#asa-i-arrow\"\/><\/svg><\/button>\n          <p class=\"asa-status\" id=\"asa-status\" role=\"status\"><\/p>\n          <p class=\"asa-alt\">Prefer to talk? Call <a href=\"tel:+8801843222118\">01843-222118<\/a><\/p>\n        <\/form>\n      <\/div>\n    <\/div>\n  <div class=\"asa-head asa-steps-head\" data-reveal style=\"margin-top:clamp(56px,7vw,88px)\">\n<h2>Admission in four easy steps<\/h2>\n<\/div>\n<ol class=\"asa-steps\">\n      <li class=\"asa-step\" data-reveal><span class=\"asa-n\">1<\/span><h3>Choose a program<\/h3><p>Pick an academic grade or a Quran program.<\/p><\/li>\n      <li class=\"asa-step\" data-reveal=\"2\"><span class=\"asa-n\">2<\/span><h3>Call the office<\/h3><p>Confirm seat availability and eligibility.<\/p><\/li>\n      <li class=\"asa-step\" data-reveal=\"3\"><span class=\"asa-n\">3<\/span><h3>Fill in the form<\/h3><p>Collect the admission form and prepare documents.<\/p><\/li>\n      <li class=\"asa-step\" data-reveal=\"4\"><span class=\"asa-n\">4<\/span><h3>Start learning<\/h3><p>Pay the fees and get your class and start date.<\/p><\/li>\n    <\/ol>\n<\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  \/* Admission fees from the published Admission Information. Edit amounts here; totals update automatically. *\/\n  var CORE=[['Form fee',300],['Admission fee',7000],['Dress fee',2500],['Tuition fee book',100],['ID card',300]];\n  var FEES=[\n    {label:'Academy',items:CORE.concat([['Diary',100],['Exam fee',1200],['Note books',1000],['First month tuition',2500]]),m:2500,ml:'Monthly tuition',note:'Class-wise textbooks are charged separately based on the student\\'s grade.'},\n    {label:'Nazera \/ Qaidah (Full time)',items:CORE.concat([['Hifz \/ Nazera diary',100],['Exam fee',1200],['Note books',1000],['First month tuition',3500]]),m:3500,ml:'Monthly tuition',note:'The total includes the first month\\'s tuition.'},\n    {label:'Hifz \/ Quran',items:CORE.concat([['Hifz \/ Nazera diary',100],['Exam fee',1200],['Note books',1000],['First month tuition',4500]]),m:4500,ml:'Monthly tuition',note:'For Hifz residential fees, see the hostel section.'},\n    {label:'Part time (Girls)',items:[['Form fee',300],['Admission fee',1500],['Tuition fee',2000]],m:2000,ml:'Tuition fee',note:'A part-time Nazera and Qaidah program for school-going girls. Confirm the schedule with the office.'},\n    {label:'Elderly women',items:[['Form fee',300],['Admission fee',1500],['First month tuition',2000]],m:2000,ml:'Monthly tuition',note:'Quran program for elderly women. The total includes the first month\\'s tuition.'}\n  ];\n  var EMAIL='assuffahacademy1445@gmail.com', PHONE='01843-222118';\n\n  function init(){\n    var pick=document.getElementById('asa-fee-pick'); if(!pick) return;\n    var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    var q=function(id){return document.getElementById(id)};\n    var tk=function(n){return '\u09f3'+Math.round(n).toLocaleString('en-IN')};\n    var countTo=function(el,to){ if(window.ASA) ASA.countTo(el,to,tk); else el.textContent=tk(to); };\n    var sum=function(items){return items.reduce(function(a,b){return a+b[1]},0)};\n\n    \/* Fee explorer *\/\n    function rows(items){\n      var h='<tbody>'; items.forEach(function(r,i){h+='<tr style=\"animation-delay:'+(i*35)+'ms\"><td>'+r[0]+'<\/td><td>'+tk(r[1])+'<\/td><\/tr>'});\n      return h+'<tr class=\"asa-total\" style=\"animation-delay:'+(items.length*35)+'ms\"><td>Total at admission<\/td><td>'+tk(sum(items))+'<\/td><\/tr><\/tbody>';\n    }\n    function show(i){\n      var f=FEES[i];\n      [].forEach.call(pick.children,function(b,j){b.setAttribute('aria-pressed',j===i)});\n      countTo(q('asa-fee-total'),sum(f.items)); countTo(q('asa-fee-monthly'),f.m);\n      q('asa-fee-mlabel').textContent=f.ml;\n      q('asa-fee-table').innerHTML=rows(f.items);\n      q('asa-fee-note').textContent=f.note+' Fees follow the published admission information and may change, so please confirm with the office.';\n    }\n    FEES.forEach(function(f,i){\n      var b=document.createElement('button'); b.type='button'; b.textContent=f.label;\n      b.addEventListener('click',function(){show(i)}); pick.appendChild(b);\n    });\n    show(0);\n\n    \/* Any \"Ask about this\" button on the page fills in the Program field *\/\n    var sel=q('asa-f-course');\n    document.addEventListener('click',function(e){\n      var b=e.target.closest&&e.target.closest('[data-ask]'); if(!b||!sel) return;\n      var v=b.getAttribute('data-ask');\n      [].forEach.call(sel.options,function(o){if(o.text===v) sel.value=o.value});\n      q('asa-inquiry').scrollIntoView({behavior:reduce?'auto':'smooth',block:'center'});\n      sel.style.boxShadow='0 0 0 4px rgba(224,122,52,.35)'; setTimeout(function(){sel.style.boxShadow=''},1600);\n      setTimeout(function(){q('asa-f-student').focus({preventScroll:true})},700);\n    });\n\n    \/* Inquiry form opens the visitor's email app *\/\n    q('asa-form').addEventListener('submit',function(e){\n      e.preventDefault();\n      var ok=true, f=e.target, status=q('asa-status');\n      ['student','guardian','phone'].forEach(function(n){\n        var el=f.elements[n], bad=!el.value.trim()||(n==='phone'&&el.value.replace(\/\\D\/g,'').length<10);\n        el.parentNode.classList.remove('asa-err'); void el.offsetWidth; if(bad){el.parentNode.classList.add('asa-err'); ok=false;}\n      });\n      if(!ok){status.textContent='Please add the student name, guardian name and a valid phone number.'; status.classList.add('asa-show'); return;}\n      var body='Assalamu Alaikum,\\n\\nI would like to know more about admission.\\n\\nStudent name: '+f.student.value+'\\nGuardian name: '+f.guardian.value+'\\nPhone: '+f.phone.value+'\\nProgram: '+f.course.value+'\\n\\n'+(f.message.value?'Message: '+f.message.value+'\\n\\n':'')+'JazakAllahu khairan.';\n      window.location.href='mailto:'+EMAIL+'?subject='+encodeURIComponent('Admission inquiry: '+f.course.value)+'&body='+encodeURIComponent(body);\n      status.textContent='Your email app should open with the inquiry ready to send. If it does not, please call '+PHONE+'.';\n      status.classList.add('asa-show');\n    });\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-c4ebf0f e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"c4ebf0f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"c4ebf0f\">\n    \t\t<div class=\"elementor-element elementor-element-048aa7e elementor-widget elementor-widget-html\" data-id=\"048aa7e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | FAQ\n  Questions and answers. Copy one <details> block to add a new question.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}\n.asa .asa-faq-list{display:grid;gap:10px}\n.asa .asa-faq details{background:#fff;border:1px solid var(--line);border-radius:18px;transition:border-color .3s,box-shadow .3s}\n.asa .asa-faq details[open]{border-color:transparent;box-shadow:var(--shadow-lg)}\n.asa .asa-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 22px;font-weight:700;font-size:1.03rem;color:var(--ink);letter-spacing:-.01em}\n.asa .asa-faq summary::-webkit-details-marker{display:none}\n.asa .asa-faq summary:hover{color:var(--green)}\n.asa .asa-plus{width:32px;height:32px;border-radius:50%;background:var(--mint);display:grid;place-items:center;flex:none;transition:transform .35s var(--ease),background .3s,color .3s;color:var(--green)}\n.asa .asa-faq details[open] .asa-plus{transform:rotate(135deg);background:var(--orange);color:#fff}\n.asa .asa-ans{padding:0 22px 22px;color:var(--muted);animation:asaFade .4s var(--ease)}\n.asa .asa-ans p+p{margin-top:8px}\n.asa .asa-ans b{color:var(--ink)}\n@media (max-width:960px){\n  .asa .asa-faq-grid{grid-template-columns:1fr;gap:36px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-faq\">\n<section class=\"asa-sec asa-faq\" id=\"asa-faq\" style=\"padding-top:0\">\n  <div class=\"asa-wrap asa-faq-grid\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Questions parents ask<\/h2>\n      <p>Cannot find your answer here? Our admission office is happy to help on the phone.<\/p>\n      <div style=\"margin-top:26px\"><a href=\"tel:+8801843222118\" class=\"asa-btn asa-btn-green\"><svg class=\"asa-i\"><use href=\"#asa-i-phone\"\/><\/svg>Call the office<\/a><\/div>\n    <\/div>\n    <div class=\"asa-faq-list\" id=\"asa-faq-list\" data-reveal=\"2\">\n      <details open>\n        <summary>When does admission start?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Admission for the new session opens in November. Seats in each grade are limited, so we suggest calling early to confirm availability.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>Which classes and programs can my child join?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Academic classes run from Kindergarten-1 (Play) to Grade 10 (Dars-e-Nizami), followed by Sanawiyyah, Meshkat and Dawrah-e-Hadith. Quran students can join the Noorani, Nazera, Hifz, Taheli or Kitab section.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>Is there a hostel, and what food is provided?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Yes, the academy has an air-conditioned hostel. Category 01 includes breakfast, brunch, lunch, snacks and dinner. Category 02 includes breakfast, lunch and dinner. Day-care (Category 03) includes lunch and snacks.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>What should a residential student bring?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Each student should bring two bed covers, two pillow cases and their personal essentials.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>What is the school uniform?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p><b>Boys (KG-1 to Grade 3):<\/b> beige kurta, beige salwar, white taqiyah, school monogram, white socks and black converse shoes.<\/p><p><b>Girls:<\/b> olive green frock, beige salwar, beige belt, white scarf, school monogram, white socks and black converse shoes.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>Are there Quran classes for adult women?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Yes. We run a Quran program for elderly women and a part-time Nazera and Qaidah course for school-going girls. Female teachers lead both.<\/p><\/div>\n      <\/details>\n      <details>\n        <summary>Are textbooks included in the admission fee?<span class=\"asa-plus\"><svg class=\"asa-i\" style=\"width:16px;height:16px\"><use href=\"#asa-i-plus\"\/><\/svg><\/span><\/summary>\n        <div class=\"asa-ans\"><p>Note books are included. For academic students, class-wise textbooks are charged separately by grade. The office will share the exact book list and cost.<\/p><\/div>\n      <\/details>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  function init(){\n    \/* Only one answer stays open at a time *\/\n    var list=document.getElementById('asa-faq-list'); if(!list) return;\n    var items=[].slice.call(list.querySelectorAll('details'));\n    items.forEach(function(d){d.addEventListener('toggle',function(){if(d.open) items.forEach(function(o){if(o!==d) o.open=false})})});\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-50b5062 e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"50b5062\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"50b5062\">\n    \t\t<div class=\"elementor-element elementor-element-e8ca74b elementor-widget elementor-widget-html\" data-id=\"e8ca74b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | GALLERY\n  Six photo slots with a click-to-zoom viewer.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-gallery{background:var(--sand)}\n.asa .asa-gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:14px}\n.asa .asa-gal figure{position:relative;border-radius:var(--r);overflow:hidden;cursor:zoom-in}\n.asa .asa-gal figure.asa-big{grid-column:span 2;grid-row:span 2}\n.asa .asa-gal figure.asa-wide{grid-column:span 2}\n.asa .asa-gal figcaption{position:absolute;left:14px;bottom:14px;z-index:2;background:rgba(255,255,255,.92);color:var(--ink);font-weight:700;font-size:.86rem;padding:7px 14px;border-radius:999px;transition:transform .35s var(--ease)}\n.asa .asa-gal figure::after{content:\"\";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 55%,rgba(18,48,31,.35));opacity:0;transition:opacity .35s}\n.asa .asa-gal figure:hover::after{opacity:1}\n.asa .asa-gal figure:hover figcaption{transform:translateY(-4px)}\n.asa .asa-gal figure:hover .asa-photo img{transform:scale(1.06)}\n.asa .asa-lightbox{position:fixed;inset:0;z-index:99999;background:rgba(10,24,16,.9);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:24px}\n.asa .asa-lightbox.asa-show{display:flex;animation:asaFade .3s var(--ease)}\n.asa .asa-lb-inner{max-width:1000px;width:100%;position:relative}\n.asa .asa-lb-inner .asa-photo{aspect-ratio:16\/10;border-radius:var(--r);height:auto;max-height:78vh}\n.asa .asa-lb-cap{color:#E8F0EA;margin-top:14px;text-align:center;font-weight:600}\n.asa .asa-lb-btn{position:absolute;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;transition:background .25s}\n.asa .asa-lb-btn:hover{background:var(--orange)}\n.asa .asa-lb-close{top:-58px;right:0}\n.asa .asa-lb-prev{left:-62px;top:calc(50% - 40px)}\n.asa .asa-lb-next{right:-62px;top:calc(50% - 40px)}\n@media (max-width:1100px){\n  .asa .asa-lb-prev{left:8px}\n  .asa .asa-lb-next{right:8px}\n}\n@media (max-width:960px){\n  .asa .asa-gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:180px}\n}\n@media (max-width:640px){\n  .asa .asa-gal{grid-auto-rows:140px;gap:10px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-gallery\">\n<section class=\"asa-sec asa-gallery\" id=\"asa-gallery\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Life at As Suffah<\/h2>\n      <p>Classrooms, Quran halls, hostel rooms and student life. Tap any photo to see it larger.<\/p>\n    <\/div>\n    <div class=\"asa-gal\" data-reveal>\n      <!-- Paste your photo URLs inside each src=\"\" below -->\n      <figure class=\"asa-big\" tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Classroom photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/classrooom-2.webp\" alt=\"Smart classroom with laptops and a digital skills orientation banner at As Suffah Academy\" width=\"1354\" height=\"1016\" loading=\"lazy\"><\/div><figcaption>Smart classrooms<\/figcaption><\/figure>\n      <figure tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Quran class photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/paper.webp\" alt=\"Arabic letters written on paper for Quran reading practice\" width=\"780\" height=\"1040\" loading=\"lazy\"><\/div><figcaption>Quran learning<\/figcaption><\/figure>\n      <figure tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Hostel photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/Laptop-room.webp\" alt=\"Laptops on a table with chairs in a room at As Suffah Academy\" width=\"1016\" height=\"1355\" loading=\"lazy\"><\/div><figcaption>Hostel rooms<\/figcaption><\/figure>\n      <figure class=\"asa-wide\" tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Activity photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/class-room.webp\" alt=\"Blue and white balloon wall for the Our Last Day celebration at As Suffah Academy\" width=\"1040\" height=\"780\" loading=\"lazy\"><\/div><figcaption>Student activities<\/figcaption><\/figure>\n      <figure tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Dining photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/WhatsApp-Image-2026-11-03-at-23.54.47.webp\" alt=\"Table and chairs in the dining area at As Suffah Academy\" width=\"1600\" height=\"1200\" loading=\"lazy\"><\/div><figcaption>Dining<\/figcaption><\/figure>\n      <figure tabindex=\"0\"><div class=\"asa-photo\" data-label=\"Campus photo\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/WhatsApp-Image-2026-11-03-at-23.54.48.webp\" alt=\"Children's play area with a slide and ride-on toys at As Suffah Academy\" width=\"1600\" height=\"1200\" loading=\"lazy\"><\/div><figcaption>Campus<\/figcaption><\/figure>\n    <\/div>\n  <\/div>\n  <div class=\"asa-lightbox\" id=\"asa-lightbox\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Photo viewer\">\n    <div class=\"asa-lb-inner\">\n      <button class=\"asa-lb-btn asa-lb-close\" id=\"asa-lb-close\" aria-label=\"Close photo\"><svg class=\"asa-i\"><use href=\"#asa-i-x\"\/><\/svg><\/button>\n      <button class=\"asa-lb-btn asa-lb-prev\" id=\"asa-lb-prev\" aria-label=\"Previous photo\"><svg class=\"asa-i\"><use href=\"#asa-i-left\"\/><\/svg><\/button>\n      <button class=\"asa-lb-btn asa-lb-next\" id=\"asa-lb-next\" aria-label=\"Next photo\"><svg class=\"asa-i\"><use href=\"#asa-i-right\"\/><\/svg><\/button>\n      <div class=\"asa-photo\" id=\"asa-lb-photo\" data-label=\"Photo coming soon\"><img decoding=\"async\" src=\"\" alt=\"\"><\/div>\n      <p class=\"asa-lb-cap\" id=\"asa-lb-cap\"><\/p>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\n<script>\n(function(){\n  function init(){\n    var lb=document.getElementById('asa-lightbox'); if(!lb) return;\n    var figs=[].slice.call(document.querySelectorAll('#asa-gallery .asa-gal figure'));\n    var img=document.querySelector('#asa-lb-photo img'), cap=document.getElementById('asa-lb-cap'), cur=0, last=null;\n    function show(i){\n      cur=(i+figs.length)%figs.length; var src=figs[cur].querySelector('img');\n      img.setAttribute('src',src.getAttribute('src')||''); img.alt=src.alt;\n      cap.textContent=figs[cur].querySelector('figcaption').textContent+'  ('+(cur+1)+' of '+figs.length+')';\n    }\n    function open(i){last=figs[i]; show(i); lb.classList.add('asa-show'); document.getElementById('asa-lb-close').focus();}\n    function close(){lb.classList.remove('asa-show'); if(last) last.focus();}\n    figs.forEach(function(f,i){\n      f.addEventListener('click',function(){open(i)});\n      f.addEventListener('keydown',function(e){if(e.key==='Enter'||e.key===' '){e.preventDefault(); open(i)}});\n    });\n    document.getElementById('asa-lb-close').addEventListener('click',close);\n    document.getElementById('asa-lb-prev').addEventListener('click',function(){show(cur-1)});\n    document.getElementById('asa-lb-next').addEventListener('click',function(){show(cur+1)});\n    lb.addEventListener('click',function(e){if(e.target===lb) close()});\n    document.addEventListener('keydown',function(e){\n      if(!lb.classList.contains('asa-show')) return;\n      if(e.key==='Escape') close(); if(e.key==='ArrowLeft') show(cur-1); if(e.key==='ArrowRight') show(cur+1);\n    });\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-13f5b6b e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"13f5b6b\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"13f5b6b\">\n    \t\t<div class=\"elementor-element elementor-element-eeddc23 elementor-widget elementor-widget-html\" data-id=\"eeddc23\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | CONTACT\n  Address, phone numbers, email and Google Map.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px;align-items:stretch}\n.asa .asa-cards{display:grid;gap:12px;align-content:start}\n.asa .asa-ccard{display:flex;gap:16px;align-items:flex-start;padding:22px;background:#fff;border:1px solid var(--line);border-radius:var(--r);transition:transform .3s var(--ease),box-shadow .3s}\n.asa .asa-ccard:hover{transform:translateY(-3px);box-shadow:var(--shadow)}\n.asa .asa-ccard .asa-ic{width:46px;height:46px;border-radius:14px;background:var(--green);color:#fff;display:grid;place-items:center;flex:none}\n.asa .asa-ccard h3{font-size:1.05rem;margin-bottom:4px;letter-spacing:-.01em}\n.asa .asa-ccard p{color:var(--muted);font-size:.96rem}\n.asa .asa-phones{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}\n.asa .asa-phones a{font-weight:700;font-size:.93rem;padding:7px 13px;border-radius:999px;background:var(--mint);color:var(--green);transition:background .25s,color .25s}\n.asa .asa-phones a:hover{background:var(--green);color:#fff}\n.asa .asa-ccard a.asa-mail{font-weight:700;color:var(--ink);word-break:break-all}\n.asa .asa-ccard a.asa-mail:hover{color:var(--orange-700)}\n.asa .asa-map{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);min-height:440px;background:var(--sand);position:relative}\n.asa .asa-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}\n@media (max-width:960px){\n  .asa .asa-contact-grid{grid-template-columns:1fr;gap:36px}\n}\n@media (max-width:640px){\n  .asa .asa-map{min-height:300px}\n}\n<\/style>\n\n<div class=\"asa asa-blk-contact\">\n<section class=\"asa-sec\" id=\"asa-contact\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-head\" data-reveal>\n      <h2>Visit us or get in touch<\/h2>\n      <p>Our admission office will guide you on classes, fees and hostel seats. Tap a number to call directly.<\/p>\n    <\/div>\n    <div class=\"asa-contact-grid\">\n      <div class=\"asa-cards\" data-reveal>\n        <div class=\"asa-ccard\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-pin\"\/><\/svg><\/span>\n          <div><h3>Address<\/h3><p>Chayaneer-193, Road No. 08, Block B, Chandgaon Residential Area, Chattogram, Bangladesh<\/p><\/div>\n        <\/div>\n        <div class=\"asa-ccard\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-phone\"\/><\/svg><\/span>\n          <div><h3>Phone<\/h3>\n            <div class=\"asa-phones\">\n              <a href=\"tel:+8801843222118\">01843-222118<\/a>\n              <a href=\"tel:+8801811204726\">01811-204726<\/a>\n              <a href=\"tel:+8801839689696\">01839-689696<\/a>\n            <\/div>\n          <\/div>\n        <\/div>\n        <div class=\"asa-ccard\">\n          <span class=\"asa-ic\"><svg class=\"asa-i\"><use href=\"#asa-i-mail\"\/><\/svg><\/span>\n          <div><h3>Email<\/h3><a class=\"asa-mail\" href=\"mailto:assuffahacademy1445@gmail.com\">assuffahacademy1445@gmail.com<\/a><\/div>\n        <\/div>\n        <a class=\"asa-btn asa-btn-green\" href=\"https:\/\/www.google.com\/maps\/search\/?api=1&query=Chandgaon+Residential+Area+Block+B+Road+8+Chattogram\" target=\"_blank\" rel=\"noopener\"><svg class=\"asa-i\"><use href=\"#asa-i-pin\"\/><\/svg>Get directions<\/a>\n      <\/div>\n      <div class=\"asa-map\" data-reveal=\"2\">\n        <!-- For an exact pin: Google Maps > find the academy > Share > Embed a map > copy the src link here -->\n        <iframe title=\"As Suffah Academy location map\" loading=\"lazy\" referrerpolicy=\"no-referrer-when-downgrade\" src=\"https:\/\/maps.google.com\/maps?q=Chandgaon%20Residential%20Area%20Block%20B%20Road%208%20Chattogram&z=15&output=embed\"><\/iframe>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-da3f04a e-con e-atomic-element e-flexbox-base e-default-div \" data-id=\"da3f04a\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"da3f04a\">\n    \t\t<div class=\"elementor-element elementor-element-3bf1a83 elementor-widget elementor-widget-html\" data-id=\"3bf1a83\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  AS SUFFAH ACADEMY | FOOTER\n  Orange admission band, footer links, back-to-top button and the mobile Call \/ Apply bar.\n  How to use: add a \"Custom HTML\" block in WordPress and paste this whole file into it.\n  This block needs \"00-global-setup\" on the same page (paste that one first, at the very top).\n  Edit the text inside the HTML part. You can leave the <style> and <script> parts as they are.\n-->\n<style>\n.asa .asa-band{margin-bottom:-80px;position:relative;z-index:2}\n.asa .asa-band-in{position:relative;overflow:hidden;background:var(--orange);color:#fff;border-radius:var(--r-lg);padding:44px 48px;display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:center}\n.asa .asa-band-in::before{content:\"\";position:absolute;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.12);right:-90px;top:-170px}\n.asa .asa-band h2{color:#fff;font-size:clamp(1.6rem,3vw,2.3rem);max-width:18em;position:relative}\n.asa .asa-band p{color:rgba(255,255,255,.88);margin-top:8px;position:relative}\n.asa .asa-band .asa-btn{background:#fff;color:var(--orange-700);position:relative}\n.asa .asa-band .asa-btn:hover{background:var(--green-900);color:#fff;transform:translateY(-2px)}\n.asa .asa-footer{background:var(--green-900);color:rgba(220,231,224,.78);padding:150px 0 30px;font-size:.95rem}\n.asa .asa-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}\n.asa .asa-footer .asa-brand-name{color:#fff}\n.asa .asa-footer .asa-brand-sub{color:rgba(220,231,224,.6)}\n.asa .asa-footer h4{color:#fff;font-size:1rem;margin-bottom:14px;letter-spacing:-.01em}\n.asa .asa-footer li{padding:4px 0}\n.asa .asa-footer a{transition:color .2s}\n.asa .asa-footer a:hover{color:var(--orange)}\n.asa .asa-foot-bottom{padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:.88rem}\n.asa .asa-top{position:fixed;right:22px;bottom:22px;z-index:65;width:52px;height:52px;border-radius:50%;background:#fff;box-shadow:var(--shadow-lg);display:grid;place-items:center;color:var(--green);opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;transition:opacity .3s,transform .3s var(--ease)}\n.asa .asa-top.asa-show{opacity:1;transform:none;pointer-events:auto}\n.asa .asa-top:hover{color:var(--orange)}\n.asa .asa-top svg.asa-ring{position:absolute;inset:0;width:52px;height:52px;transform:rotate(-90deg)}\n.asa .asa-top .asa-ring circle{fill:none;stroke-width:3}\n.asa .asa-top .asa-ring .bg{stroke:var(--mint)}\n.asa .asa-top .asa-ring .fg{stroke:var(--orange);stroke-linecap:round;stroke-dasharray:151;stroke-dashoffset:151}\n.asa .asa-mbar{display:none}\n@media (max-width:960px){\n  .asa .asa-foot-grid{grid-template-columns:1fr 1fr}\n  .asa .asa-foot-grid>div:first-child{grid-column:1\/-1}\n  .asa .asa-mbar{display:grid;grid-template-columns:1fr 1.5fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:70;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s var(--ease)}\n  .asa .asa-mbar.asa-show{transform:none}\n  .asa .asa-mbar .asa-btn{padding:13px 10px;width:100%}\n  .asa .asa-top{bottom:88px;right:14px;width:46px;height:46px}\n  .asa .asa-top svg.asa-ring{width:46px;height:46px}\n  .asa .asa-footer{padding-bottom:100px}\n}\n@media (max-width:640px){\n  .asa .asa-foot-grid{grid-template-columns:1fr}\n  .asa .asa-band-in{padding:32px 24px}\n  .asa .asa-band .asa-btn{width:100%}\n}\n<\/style>\n\n<div class=\"asa asa-blk-footer\">\n<!-- CTA band -->\n<div class=\"asa-band\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-band-in\" data-reveal>\n      <div>\n        <h2>Ready to begin your child's journey?<\/h2>\n        <p>Seats are limited for the new session. Reserve yours today.<\/p>\n      <\/div>\n      <a href=\"#asa-admission\" class=\"asa-btn\">Apply for admission <svg class=\"asa-i asa-arrow\"><use href=\"#asa-i-arrow\"\/><\/svg><\/a>\n    <\/div>\n  <\/div>\n<\/div>\n\n<footer class=\"asa-footer\">\n  <div class=\"asa-wrap\">\n    <div class=\"asa-foot-grid\">\n      <div>\n        <div class=\"asa-brand\" style=\"margin-bottom:16px\">\n          <span class=\"asa-logo\"><img decoding=\"async\" src=\"https:\/\/assuffahacademy.com\/wp-content\/uploads\/2026\/11\/as-suffah-academy-logo-transparent.webp\" alt=\"As Suffah Academy logo\" width=\"66\" height=\"44\"><\/span>\n          <span><span class=\"asa-brand-name\">As Suffah Academy<\/span><span class=\"asa-brand-sub\">Ilm, Amal, Dawah<\/span><\/span>\n        <\/div>\n        <p style=\"max-width:30em\">A women-led academy combining Quranic education, Islamic studies and academic learning in Chattogram.<\/p>\n      <\/div>\n      <div>\n        <h4>Quick links<\/h4>\n        <ul>\n          <li><a href=\"#asa-about\">About the academy<\/a><\/li>\n          <li><a href=\"#asa-programs\">Programs<\/a><\/li>\n          <li><a href=\"#asa-hostel\">Hostel<\/a><\/li>\n          <li><a href=\"#asa-admission\">Admission and fees<\/a><\/li>\n          <li><a href=\"#asa-faq\">FAQ<\/a><\/li>\n        <\/ul>\n      <\/div>\n      <div>\n        <h4>Admission office<\/h4>\n        <ul>\n          <li><a href=\"tel:+8801843222118\">01843-222118<\/a><\/li>\n          <li><a href=\"tel:+8801811204726\">01811-204726<\/a><\/li>\n          <li><a href=\"tel:+8801839689696\">01839-689696<\/a><\/li>\n          <li><a href=\"mailto:assuffahacademy1445@gmail.com\">assuffahacademy1445@gmail.com<\/a><\/li>\n          <!-- Facebook: <li><a href=\"YOUR-FACEBOOK-PAGE-URL\" target=\"_blank\" rel=\"noopener\">Facebook page<\/a><\/li> -->\n        <\/ul>\n      <\/div>\n    <\/div>\n    <div class=\"asa-foot-bottom\">\n      <span>\u00a9 <span id=\"asa-year\">2026<\/span> As Suffah Academy. All rights reserved.<\/span>\n      <span>Chandgaon, Chattogram, Bangladesh<\/span>\n    <\/div>\n  <\/div>\n<\/footer>\n\n<!-- Back to top -->\n<button class=\"asa-top\" id=\"asa-top\" aria-label=\"Back to top\">\n  <svg class=\"asa-ring\" viewBox=\"0 0 52 52\" aria-hidden=\"true\"><circle class=\"bg\" cx=\"26\" cy=\"26\" r=\"24\"\/><circle class=\"fg\" id=\"asa-ring\" cx=\"26\" cy=\"26\" r=\"24\"\/><\/svg>\n  <svg class=\"asa-i\"><use href=\"#asa-i-up\"\/><\/svg>\n<\/button>\n\n<!-- Mobile action bar -->\n<div class=\"asa-mbar\" id=\"asa-mbar\">\n  <a href=\"tel:+8801843222118\" class=\"asa-btn asa-btn-line\"><svg class=\"asa-i\"><use href=\"#asa-i-phone\"\/><\/svg>Call<\/a>\n  <a href=\"#asa-admission\" class=\"asa-btn asa-btn-orange\">Apply now<\/a>\n<\/div>\n<\/div>\n\n<script>\n(function(){\n  function init(){\n    var mbar=document.getElementById('asa-mbar'), top=document.getElementById('asa-top'), ring=document.getElementById('asa-ring');\n    var reduce=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    var yr=document.getElementById('asa-year'); if(yr) yr.textContent=new Date().getFullYear();\n    if(top) top.addEventListener('click',function(){window.scrollTo({top:0,behavior:reduce?'auto':'smooth'})});\n\n    \/* Show the mobile Call\/Apply bar and back-to-top button after the first screen *\/\n    var tick=false;\n    function onScroll(){\n      tick=false; var d=document.documentElement, y=window.scrollY||d.scrollTop, max=d.scrollHeight-window.innerHeight, p=max>0?Math.min(1,y\/max):0;\n      var hero=document.getElementById('asa-home'), contact=document.getElementById('asa-contact');\n      var past=hero?hero.getBoundingClientRect().bottom<0:y>window.innerHeight;\n      var nearEnd=contact?contact.getBoundingClientRect().top<window.innerHeight*.6:p>.92;\n      if(mbar) mbar.classList.toggle('asa-show',past&&!nearEnd);\n      if(top) top.classList.toggle('asa-show',past);\n      if(ring) ring.style.strokeDashoffset=(151-151*p).toFixed(1);\n    }\n    window.addEventListener('scroll',function(){if(!tick){tick=true;requestAnimationFrame(onScroll)}},{passive:true}); onScroll();\n  }\n  if(document.readyState==='loading') document.addEventListener('DOMContentLoaded',init); else init();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","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":"disabled","footer-sml-layout":"disabled","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-12","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/12","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12"}],"version-history":[{"count":45,"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/12\/revisions"}],"predecessor-version":[{"id":76,"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=\/wp\/v2\/pages\/12\/revisions\/76"}],"wp:attachment":[{"href":"https:\/\/assuffahacademy.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}