:root{--teal:#00bfa6;--teal-d:#00877a;--teal-dd:#065f56;--ink:#414042;--ink-d:#232224;--gold:#e0b44c;--gold-d:#c9982b;--bg:#fff;--alt:#f3faf9;--line:#dfe9e7;--r:14px;--sh:0 8px 30px rgba(6,95,86,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.7 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg)}
img{max-width:100%;height:auto;display:block}a{color:var(--teal-d)}a:hover{color:var(--teal-dd)}
h1,h2,h3,h4{color:var(--ink-d);line-height:1.2;margin:0 0 .6em;font-weight:700}h1{font-size:clamp(2rem,4.5vw,3.2rem)}h2{font-size:clamp(1.5rem,3vw,2.1rem)}h3{font-size:1.2rem}
.wrap{width:min(1180px,100% - 40px);margin:0 auto}.narrow{width:min(860px,100% - 40px)}.center{text-align:center}.small{font-size:.85rem}.sr{position:absolute;left:-9999px}
.skip{position:absolute;left:-999px;top:0;background:#000;color:#fff;padding:10px;z-index:99}.skip:focus{left:0}
.topbar{background:var(--alt);color:var(--ink);font-size:.82rem;border-bottom:1px solid var(--line)}.topbar .wrap{display:flex;justify-content:space-between;gap:16px;padding:7px 0;flex-wrap:wrap}.topbar a{color:var(--teal-dd);text-decoration:none;margin-inline-start:18px;font-weight:600}
.site-header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 1px 0 var(--line)}.bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink-d)}.brand img{height:50px;width:auto}.brand span{display:flex;flex-direction:column;line-height:1.15}.brand b{font-size:1.35rem;letter-spacing:.04em}.brand small{font-size:.68rem;color:#6b6a6c}
.nav{display:flex;align-items:center;gap:4px}.nav>a,.dd>a{color:var(--ink);text-decoration:none;padding:10px 13px;border-radius:8px;font-weight:600;font-size:.93rem;display:block}
.nav>a:hover,.dd>a:hover,.nav a.active{color:var(--teal-d);background:var(--alt)}.nav>a.nav-cta{color:#2a2008;margin-inline-start:8px;background:var(--gold)}.nav .nav-cta:hover{color:#2a2008;background:var(--gold-d)}
.dd{position:relative}.dd-menu{display:none;position:absolute;inset-inline-start:0;top:100%;min-width:210px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh);padding:8px}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:block}.dd-menu a{display:block;padding:9px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:.9rem;font-weight:500}.dd-menu a:hover,.dd-menu a.active{background:var(--alt);color:var(--teal-d)}
.burger{display:none;background:none;border:0;padding:10px;cursor:pointer}.burger span{display:block;width:26px;height:3px;background:var(--ink);margin:5px 0;border-radius:2px}
.btn{display:inline-block;background:var(--teal-d);color:#fff;border:2px solid var(--teal-d);padding:12px 24px;border-radius:999px;font:600 .95rem Inter,sans-serif;text-decoration:none;cursor:pointer;transition:.2s}
.btn:hover{background:var(--teal-dd);border-color:var(--teal-dd);color:#fff;transform:translateY(-1px)}.btn-gold{background:var(--gold);border-color:var(--gold);color:#2a2008}.btn-gold:hover{background:var(--gold-d);border-color:var(--gold-d);color:#2a2008}
.btn-out{background:transparent;color:var(--teal-d)}.btn-out:hover{background:var(--teal-d);color:#fff}.btn-ghost{background:transparent;border-color:var(--teal-d);color:var(--teal-d)}.btn-ghost:hover{background:var(--teal-d);color:#fff}
.btn-lg{padding:15px 32px;font-size:1.05rem}.btn-sm{padding:6px 14px;font-size:.8rem}.block{display:block;width:100%}.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero{background:radial-gradient(900px 400px at 85% 10%,rgba(0,191,166,.16),transparent 70%),linear-gradient(180deg,#f3faf9,#fff);color:var(--ink);padding:56px 0 64px;border-bottom:1px solid var(--line)}
.hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}.hero h1{color:var(--ink-d);font-size:clamp(2rem,5vw,3.6rem)}.lead{font-size:1.2rem;color:var(--ink)}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:700;color:var(--teal-d);margin:0 0 12px}.eyebrow.dark{color:var(--teal-d)}
.hero-card{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--sh)}.hero-card h2{font-size:1.05rem;margin-bottom:10px}.hero-card .more{display:block;text-align:end;font-weight:600;font-size:.9rem;margin-top:8px}
.widget{display:block;width:100%;height:330px;border:0}.mobile{display:none;width:100%;height:520px;border:0}.mawaqit{margin:24px auto;max-width:900px}.mawaqit .widget{height:560px}
.donate-band{background:#fff8e6;color:var(--ink);border-bottom:1px solid #f0e2b8}.band-in{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:30px 0;flex-wrap:wrap}.donate-band h2{margin-bottom:6px}.donate-band p{margin:0 0 6px;max-width:680px}
.progress{height:12px;background:#ece3c6;border-radius:99px;overflow:hidden;margin:14px 0 6px;max-width:520px}.progress span{display:block;height:100%;background:var(--teal-d);border-radius:99px}.progress.big{background:#e4eeec;height:16px;max-width:none}
.sec{padding:72px 0}.sec.alt{background:var(--alt)}.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:26px}.sec-head h2{margin:0}.sec-head a{font-weight:600;text-decoration:none}
.page-hero{background:linear-gradient(180deg,#eaf7f5,#f8fcfb);color:var(--ink);padding:44px 0;border-bottom:1px solid var(--line)}.page-hero h1{color:var(--ink-d);margin:0}.page-hero .lead{margin:.6em 0 0}.crumb{margin:0 0 8px;font-size:.85rem;color:#6b6a6c}.crumb a{color:var(--teal-d)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.cards.three{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:26px 0}
.card{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 22px;text-decoration:none;color:var(--ink);box-shadow:var(--sh);transition:.2s}a.card:hover{transform:translateY(-4px);border-color:var(--teal)}.card.flat{box-shadow:none;background:var(--alt)}.card h3{margin-bottom:.3em}.card p{margin:0;font-size:.92rem}.ico{font-size:2rem;display:block;margin-bottom:8px}
.person{text-align:center}.avatar{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--teal-d);color:#fff;font-weight:700;margin-bottom:10px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}.split.rev>:first-child{order:0}.media img{border-radius:var(--r);box-shadow:var(--sh);width:100%;max-height:560px;object-fit:contain;background:var(--alt)}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:24px}.grid4{display:grid;grid-template-columns:1.1fr .8fr 1.2fr 1.2fr;gap:36px}
.ev-card{background:#fff;border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--sh);display:flex;flex-direction:column;transition:.2s}.ev-card:hover{transform:translateY(-4px)}
.ev-img{aspect-ratio:16/10;background:var(--alt) url(/assets/img/logo.png) center/70px no-repeat;overflow:hidden}.ev-img img{width:100%;height:100%;object-fit:cover;object-position:top}.ev-body{padding:18px 20px 22px}.ev-body small{color:var(--teal-d);font-weight:600}.ev-body h3{margin:.3em 0}.ev-body p{margin:0;font-size:.92rem}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gal.big{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.gal a,.gitem{display:block;border-radius:10px;overflow:hidden;aspect-ratio:3/2;margin:0}.gal img{width:100%;height:100%;object-fit:cover;transition:.3s}.gal a:hover img{transform:scale(1.06)}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.92);display:grid;place-items:center;z-index:200;cursor:zoom-out}.lb img{max-width:94vw;max-height:92vh;border-radius:8px}
.prose p,.prose li{font-size:1.02rem}.lead-d{font-size:1.2rem;color:var(--teal-d);font-weight:600}.quote{background:var(--alt);border-inline-start:5px solid var(--teal);border-radius:10px;padding:18px 24px;margin:28px 0}.quote h3{margin:0 0 4px}.quote p{margin:0;font-size:1.1rem;font-weight:600}.quote .ar{font-family:Amiri,serif;font-size:1.35rem;font-weight:400}
.steps{padding-left:0;list-style:none;counter-reset:s}.steps li{counter-increment:s;position:relative;padding:12px 0;padding-inline-start:54px}.steps li:before{content:counter(s);position:absolute;inset-inline-start:0;top:8px;width:36px;height:36px;border-radius:50%;background:var(--teal-d);color:#fff;display:grid;place-items:center;font-weight:700}
.timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:32px 0}.timeline div{background:var(--alt);border-radius:12px;padding:14px;border-top:4px solid var(--teal)}.timeline b{display:block;color:var(--teal-d);font-size:1.2rem}.timeline span{font-size:.85rem}
.list-links{list-style:none;padding:0}.list-links li{padding:10px 0;border-bottom:1px solid var(--line)}.facts{background:var(--alt);padding:14px 20px;border-radius:12px;margin:20px 0}.facts p{margin:.3em 0}
.soon-ico{margin:0 auto 20px;opacity:.9;border-radius:var(--r)}
.info{margin-bottom:18px}.info h3{margin-bottom:.2em}.info p{margin:0}.map{width:100%;height:280px;border:0;border-radius:var(--r);margin-top:12px}
.form label,.give label{display:block;font-weight:600;font-size:.88rem;margin:0 0 14px}.form input,.form textarea,.form select,.give input:not([type=checkbox]):not([type=radio]){display:block;width:100%;margin-top:5px;padding:12px 14px;border:1px solid #c5d3d0;border-radius:10px;font:inherit;background:#fff;color:var(--ink)}
.form input:focus,.form textarea:focus,.give input:focus{outline:3px solid rgba(0,191,166,.3);border-color:var(--teal)}.form{background:#fff}.form.wide{max-width:760px}.hp{position:absolute;left:-9999px;height:0;overflow:hidden}.chk{display:flex!important;gap:10px;align-items:center;font-weight:500!important}.chk input{width:auto!important;margin:0!important}
.alert{background:#fdecec;border:1px solid #f3b5b5;color:#8a1f1f;padding:10px 14px;border-radius:10px}.alert.info{background:#eef7ff;border-color:#b9d9f5;color:#164b78}
.flash{padding:12px 0;font-weight:600}.flash.ok{background:#e3f8f4;color:var(--teal-dd)}.flash.err{background:#fdecec;color:#8a1f1f}
.give{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;box-shadow:var(--sh);position:sticky;top:96px}.freq{display:grid;grid-template-columns:1fr 1fr;gap:8px;border:0;padding:0;margin:0 0 14px}.freq label{margin:0!important}.freq input{position:absolute;opacity:0}.freq span{display:block;text-align:center;padding:11px;border:2px solid var(--line);border-radius:10px;cursor:pointer;font-weight:600}.freq input:checked+span{border-color:var(--teal-d);background:var(--alt);color:var(--teal-dd)}.freq input:focus-visible+span{outline:3px solid var(--teal)}
.amounts{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:14px}.amt{padding:11px 0;border:2px solid var(--line);background:#fff;border-radius:10px;font:700 .95rem Inter;cursor:pointer;color:var(--ink)}.amt.on,.amt:hover{border-color:var(--teal-d);background:var(--alt);color:var(--teal-dd)}
.trust{display:grid;gap:12px;margin:22px 0}.trust div{background:var(--alt);padding:12px 16px;border-radius:12px}.trust span{display:block;font-size:.88rem}
.bank{border-collapse:collapse;width:100%;max-width:520px}.bank th,.bank td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:start}.bank th{width:42%;color:var(--teal-dd)}
.demo-note{background:#fff7dd;border:1px dashed #d4a72c;color:#6a4e00;padding:10px 14px;border-radius:10px;font-size:.88rem}.demo-box{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px;box-shadow:var(--sh)}.big-ok{font-size:4rem;color:var(--teal-d);margin:0;line-height:1}
.site-footer{background:var(--alt);color:var(--ink);border-top:1px solid var(--line)}.site-footer .grid4{padding:56px 0 36px}.site-footer h4{color:var(--ink-d);margin-bottom:14px}.site-footer a{color:var(--teal-dd);text-decoration:none}.site-footer a:hover{text-decoration:underline}.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin:7px 0}.flogo{background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px;width:76px;height:auto;margin-bottom:14px}.muted-w{color:#5a595b;font-size:.92rem}.social{display:flex;gap:14px;margin-top:12px;flex-wrap:wrap}.copy{border-top:1px solid var(--line);padding:16px 0;font-size:.85rem;color:#6b6a6c;background:#fff}
/* admin */
.adm{background:#f4f7f6}.adm-bar{background:var(--ink-d)}.adm-bar .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:10px 0}.adm-bar .brand{color:#fff}.adm-bar .brand img{height:32px;background:#fff;border-radius:6px;padding:2px}.adm-bar nav{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.adm-bar nav a{color:#cfcfd1;text-decoration:none;padding:7px 11px;border-radius:8px;font-size:.88rem;font-weight:600}.adm-bar nav a.active,.adm-bar nav a:hover{background:var(--teal-d);color:#fff}
.inline{display:inline}.link{background:none;border:0;color:#cfcfd1;font:600 .88rem Inter;cursor:pointer;padding:7px 11px}.adm-main{padding:34px 0 80px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:20px 0 30px}.stats div{background:#fff;border-radius:12px;padding:18px;box-shadow:var(--sh)}.stats span{display:block;font-size:.8rem;color:#6b6a6c;font-weight:600}.stats b{font-size:1.7rem;color:var(--teal-dd)}.stats small{display:block}
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--sh);font-size:.88rem}.tbl th,.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}.tbl th{background:#e9f3f1;color:var(--teal-dd)}.scroll{overflow-x:auto}
.st{padding:2px 9px;border-radius:99px;font-size:.75rem;font-weight:700;background:#eee}.st-paid{background:#d8f5ee;color:#065f56}.st-pending{background:#fff3cf;color:#7a5a00}.st-failed,.st-review{background:#fde1e1;color:#8a1f1f}.st-refunded{background:#e5e5ff;color:#33337a}
.pill{display:inline-block;padding:5px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;text-decoration:none;font-size:.85rem;margin-right:6px}.pill.on{background:var(--teal-d);color:#fff;border-color:var(--teal-d)}.filters{margin:14px 0}
.msg{background:#fff;border-radius:12px;padding:16px 20px;margin-bottom:14px;box-shadow:var(--sh)}.msg.unread{border-inline-start:5px solid var(--teal)}.msg header small{color:#888;margin-left:8px}
.login-box{max-width:400px;margin:60px auto;background:#fff;border-radius:var(--r);padding:34px;box-shadow:var(--sh);text-align:center}.login-box .form{text-align:start}.login-box img{margin:0 auto 10px}
.inline-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;align-items:end;margin-bottom:24px;max-width:none!important}.gitem{position:relative;aspect-ratio:auto}.gitem img{aspect-ratio:3/2}.gitem form{padding:6px 0}
@media(max-width:960px){.hero-in,.split,.donate-grid{grid-template-columns:1fr}.grid4{grid-template-columns:1fr 1fr}.gal{grid-template-columns:repeat(2,1fr)}.give{position:static}.sec{padding:52px 0}
 .burger{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px 20px;box-shadow:0 14px 24px rgba(0,0,0,.12);max-height:80vh;overflow:auto}.nav.open{display:flex}.dd-menu{display:block;position:static;border:0;box-shadow:none;padding:0 0 0 14px}.nav .nav-cta{margin:8px 0 0;text-align:center}.site-header{position:sticky}.bar{position:relative}}
@media(max-width:700px){.widget{display:none}.mobile{display:block}.mawaqit .widget{display:none}.grid4{grid-template-columns:1fr}.topbar-r{display:none}.amounts{grid-template-columns:repeat(3,1fr)}.brand small{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* mobile polish */
html,body{overflow-x:hidden}input,textarea,select,button{font-size:16px}.btn,.amt,.nav a{min-height:44px}
@media(max-width:700px){.wrap{width:calc(100% - 32px)}.hero{padding:34px 0 40px}.hero-card{padding:12px}.page-hero{padding:30px 0}.sec{padding:40px 0}.band-in{padding:24px 0}.band-in .btn{width:100%;text-align:center}.btns .btn{flex:1 1 100%;text-align:center}.give{padding:20px}.tbl{font-size:.8rem}.gal{grid-template-columns:repeat(2,1fr)}.sec-head{flex-direction:column;gap:4px}.timeline{grid-template-columns:1fr 1fr}.adm-bar nav a{padding:6px 8px}.stats b{font-size:1.4rem}.mobile{height:480px}}

/* ===== language switcher + RTL ===== */
.langsw{display:inline-flex;gap:2px;margin-inline-end:6px}.topbar .langsw a{margin:0;padding:2px 9px;border-radius:99px;font-size:.78rem;color:var(--ink)}.topbar .langsw a.on{background:var(--teal-d);color:#fff}
html[lang=ar] body{font-family:'Noto Sans Arabic',Inter,system-ui,sans-serif}
html[lang=ur] body{font-family:'Noto Nastaliq Urdu','Noto Sans Arabic',serif;line-height:2.1}
html[lang=ur] h1,html[lang=ur] h2,html[lang=ur] h3,html[lang=ur] h4{line-height:1.9}html[lang=ur] .btn{line-height:1.9;padding-top:8px;padding-bottom:8px}
[dir=rtl] .eyebrow,[dir=rtl] .brand small{letter-spacing:0}[dir=rtl] .form label,[dir=rtl] .give label{text-align:start}
/* ===== fundraising milestones ===== */
.mile{margin:18px 0 6px;max-width:640px}.mile-top{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:10px}.mile-big{font-size:clamp(1.6rem,4vw,2.3rem);font-weight:800;color:var(--teal-dd)}.mile-big.dim{color:var(--ink)}.mile-lbl{font-weight:600;color:#6b6a6c}
.mile-pct{margin-inline-start:auto;background:var(--teal-d);color:#fff;border-radius:99px;padding:2px 14px;font-weight:700;font-size:.95rem}
.mbar{position:relative;height:20px;background:#e3ece9;border-radius:99px}.mfill{position:absolute;top:0;bottom:0;inset-inline-start:0;background:linear-gradient(90deg,var(--teal),var(--teal-d));border-radius:99px;min-width:12px}
.tick{position:absolute;top:-3px;bottom:-3px;width:3px;background:#fff;border-radius:2px;margin-inline-start:-1px}
.mlabels{position:relative;height:26px;margin-top:6px}.ml{position:absolute;font-size:.78rem;font-weight:700;color:#7a7a7c;white-space:nowrap;transform:translateX(-50%)}.ml:last-child{transform:translateX(-100%)}[dir=rtl] .ml{transform:translateX(50%)}[dir=rtl] .ml:last-child{transform:translateX(100%)}.ml.hit{color:var(--teal-dd)}
[dir=rtl] .mbar .tick,[dir=rtl] .mlabels .ml{}
.mile-foot{margin:6px 0 0;font-weight:600}.mile-foot b{font-size:1.15rem;color:var(--ink-d)}
/* donate form: funds */
.funds{border:0;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.funds legend{font-weight:600;font-size:.88rem;margin-bottom:6px;grid-column:1/-1;padding:0}.funds label{margin:0!important}.funds input{position:absolute;opacity:0}.funds span{display:block;text-align:center;padding:10px 6px;border:2px solid var(--line);border-radius:10px;cursor:pointer;font-weight:600;font-size:.86rem}.funds input:checked+span{border-color:var(--teal-d);background:var(--alt);color:var(--teal-dd)}.funds input:focus-visible+span{outline:3px solid var(--teal)}
.fund-note{background:#fff7dd;border-radius:8px;padding:8px 12px}
/* ===== forms ===== */
.form.box{border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--sh)}.checks{border:0;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}.checks legend{font-weight:600;font-size:.88rem;margin-bottom:6px;grid-column:1/-1;padding:0}.checks .chk{margin:4px 0!important}
.zres{background:var(--alt);border-radius:12px;padding:16px 18px;margin-top:8px}.zres p{display:flex;justify-content:space-between;gap:12px;margin:.3em 0}.zres .big b{font-size:1.8rem;color:var(--teal-dd)}[hidden]{display:none!important}
/* ===== prayer timetable ===== */
.sec.tight{padding-top:34px}.h-sm{font-size:1.05rem;margin-bottom:10px}.muted{color:#6b6a6c}
.tabs{display:inline-flex;background:var(--alt);border:1px solid var(--line);border-radius:99px;padding:4px;margin-bottom:22px}.tab{padding:9px 26px;border-radius:99px;text-decoration:none;font-weight:700;color:var(--ink);font-size:.92rem}.tab.on{background:var(--teal-d);color:#fff}
.live-widget{margin-bottom:30px}.live-widget .mawaqit{margin:0;max-width:none}.live-widget .widget{height:330px}
.pt-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:6px 0 14px}.pt-nav{display:flex;align-items:center;gap:14px}.pt-nav h2{margin:0;font-size:clamp(1.4rem,3vw,2rem)}.pt-nav h2 span{color:var(--teal-d)}
.arrow{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--teal-dd);text-decoration:none;font-size:1.6rem;line-height:1;box-shadow:var(--sh)}.arrow:hover{background:var(--teal-d);color:#fff}.arrow.off{opacity:.3;box-shadow:none}[dir=rtl] .arrow{transform:scaleX(-1)}
.pt-tools{display:flex;gap:10px;align-items:center}.pt-pick{display:flex;gap:8px}.pt-pick select{padding:9px 12px;border:1px solid #c5d3d0;border-radius:10px;background:#fff;font:600 .9rem Inter,sans-serif;color:var(--ink);min-height:44px}
.mpills{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 12px;margin-bottom:6px;scrollbar-width:thin}.mp{flex:0 0 auto;padding:8px 16px;border-radius:99px;border:1px solid var(--line);background:#fff;text-decoration:none;font-weight:600;font-size:.85rem;color:var(--ink)}.mp.on,.mp:hover{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
.pt-wrap{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:#fff;margin-bottom:18px}
.pt{width:100%;border-collapse:collapse;text-align:center;font-variant-numeric:tabular-nums}.pt th,.pt td{padding:11px 8px;border-bottom:1px solid var(--line);font-size:.95rem}.pt thead th{background:var(--teal-dd);color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.pt .pt-date{text-align:start;padding-inline-start:16px;white-space:nowrap;background:#fbfdfc;font-weight:600}.pt .pt-date b{font-size:1.05rem;margin-inline-end:4px}.pt .pt-date span{color:#6b6a6c;font-weight:500;font-size:.85rem}
.pt tbody tr:nth-child(even) td{background:#fafdfc}.pt tr.fri td,.pt tr.fri .pt-date{background:#eefaf7}.pt tr.today td,.pt tr.today .pt-date{background:#fff3cf!important;font-weight:700}
.badge{font-style:normal;font-size:.68rem;font-weight:700;background:var(--gold);color:#2a2008;border-radius:99px;padding:2px 8px;margin-inline-start:6px;vertical-align:middle}.badge.b2{background:var(--teal);color:#fff}
.pt .clk-row td{background:#eaf4ff!important;color:#164b78;font-weight:600;font-size:.85rem;text-align:center}
.pt-month{display:flex;align-items:center;gap:10px;margin:34px 0 12px;scroll-margin-top:90px}.pt-month span{color:var(--teal-d)}.pt-month .up{margin-inline-start:auto;font-size:1rem;text-decoration:none}
.pt.compact th,.pt.compact td{padding:7px 6px;font-size:.88rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:700px){
 .pt-head{flex-direction:column;align-items:stretch}.pt-nav{justify-content:space-between}.pt-tools{justify-content:space-between}.pt-pick{flex:1}.pt-pick select{flex:1}
 .pt-wrap{border:0;box-shadow:none;background:none;border-radius:0;overflow:visible}
 .pt,.pt tbody{display:block}.pt thead{display:none}
 .pt tr{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden;box-shadow:var(--sh)}
 .pt .pt-date{grid-column:1/-1;display:flex;align-items:center;gap:6px;background:var(--alt)!important;padding:9px 14px;border-bottom:1px solid var(--line)}
 .pt td{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-bottom:1px solid var(--line);font-weight:700;font-size:1rem;background:#fff!important}
 .pt td:before{content:attr(data-label);font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:#6b6a6c;font-weight:600}
 .pt td:nth-child(n+5){border-bottom:0}
 .pt tr.today{border:2px solid var(--gold)}.pt tr.today .pt-date{background:#fff3cf!important}.pt tr.fri .pt-date{background:#e1f6f1!important}
 .pt tr.clk-row{display:block;background:#eaf4ff;border-color:#b9d9f5;box-shadow:none;margin-top:-4px}.pt .clk-row td{display:block;border:0;background:#eaf4ff!important;font-size:.82rem;padding:8px 12px}.pt .clk-row td:before{content:none}
 .mpills{margin-inline:-16px;padding-inline:16px}.live-widget .widget{display:none}.live-widget .mobile{display:block}
 .checks{grid-template-columns:1fr}.mile-pct{margin-inline-start:0}
 .topbar .wrap{justify-content:center}.topbar-r>a{display:none}
}
@media print{.topbar,.site-header,.site-footer,.no-print,.live-widget,.flash,.skip{display:none!important}.page-hero{padding:10px 0;background:none;border:0}.sec{padding:10px 0}.pt-wrap{box-shadow:none}.pt-month{break-after:avoid}.pt th,.pt td{padding:4px 6px;font-size:10.5pt}.pt thead th{background:#ddd!important;color:#000}.pt tr{break-inside:avoid}}

/* ===== PREMIUM LAYER ===== */
:root{--serif:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--gold-l:#f4e3b0}
h1,h2,.brand b,.mile-big,.stat b{font-family:var(--serif);letter-spacing:-.01em}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] .brand b,html[lang=ar] .mile-big,html[lang=ar] .stat b{font-family:'Noto Sans Arabic',serif;letter-spacing:0}
html[lang=ur] h1,html[lang=ur] h2,html[lang=ur] .brand b,html[lang=ur] .mile-big,html[lang=ur] .stat b{font-family:'Noto Nastaliq Urdu',serif;letter-spacing:0}
body{background:#fff}
.site-header{box-shadow:0 6px 24px rgba(6,95,86,.07);border-bottom:3px solid var(--gold)}
.topbar{background:linear-gradient(90deg,var(--teal-dd),var(--teal-d));color:#e3f7f4;border:0}.topbar a{color:#fff}.topbar .langsw a{color:#e3f7f4}.topbar .langsw a.on{background:#fff;color:var(--teal-dd)}
.brand img{height:54px}.brand b{font-size:1.5rem;color:var(--teal-dd)}
.btn{box-shadow:0 6px 16px rgba(0,135,122,.22)}.btn:hover{box-shadow:0 10px 22px rgba(0,135,122,.3)}.btn-gold{box-shadow:0 6px 16px rgba(201,152,43,.32)}.btn-out,.btn-ghost{box-shadow:none}
/* hero */
.hero{position:relative;background:linear-gradient(180deg,#f3faf9 0,#f3faf9 55%,#fff 100%);border-bottom:0;padding:64px 0 90px}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:46px;background:#fff;clip-path:ellipse(60% 100% at 50% 100%)}
.hero h1{font-size:clamp(2.3rem,5.4vw,4.1rem);line-height:1.08}.hero h1,.hero .lead{max-width:640px}
.bismillah{font-family:Amiri,serif;font-size:1.7rem;color:var(--teal-dd);margin:0 0 6px;line-height:1.6;text-align:start}
.hero .lead{font-size:1.3rem;color:#4b4a4c}
.badges{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:26px 0 0}.badges li{background:#fff;border:1px solid var(--line);border-radius:99px;padding:7px 16px;font-size:.82rem;font-weight:600;box-shadow:0 4px 12px rgba(6,95,86,.06)}.badges b{color:var(--teal-d)}
.hero-card{border-radius:22px;border:1px solid #cfe7e3;box-shadow:0 30px 60px rgba(6,95,86,.18);position:relative}.hero-card:before{content:"";position:absolute;inset:-9px;border:1px solid rgba(224,180,76,.55);border-radius:28px;pointer-events:none}
.hero-card h2{font-family:var(--serif)}
/* stats strip */
.stats-strip{margin-top:-34px;position:relative;z-index:3}.stats-in{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:20px;box-shadow:0 20px 50px rgba(6,95,86,.14);border:1px solid var(--line);overflow:hidden}
.stat{padding:22px 18px;text-align:center;border-inline-end:1px solid var(--line)}.stat:last-child{border:0}.stat b{display:block;font-size:1.65rem;color:var(--teal-d);line-height:1.2}.stat span{font-size:.84rem;color:#5d5c5f;font-weight:500}
/* section titles */
.sec{padding:84px 0}.sec-head h2,.sec h2{position:relative}.orn{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 10px;color:var(--gold-d)}.orn:before,.orn:after{content:"";height:1px;width:56px;background:linear-gradient(90deg,transparent,var(--gold))}.orn:after{transform:scaleX(-1)}
.eyebrow.dark{display:inline-block;padding:4px 14px;background:var(--alt);border-radius:99px;border:1px solid var(--line)}
/* page hero */
.page-hero{position:relative;background:linear-gradient(180deg,#f3faf9,#f8fcfb);border-bottom:0;padding:52px 0 50px}.page-hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.page-hero h1{font-size:clamp(1.9rem,4.4vw,3rem)}
/* cards with icons */
.card{border-radius:20px;border:1px solid var(--line);padding:30px 24px;position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset-inline:0;top:0;height:4px;background:linear-gradient(90deg,var(--teal),var(--gold));transform:scaleX(0);transform-origin:left;transition:.3s}a.card:hover:before{transform:scaleX(1)}
.card.flat:before{display:none}
.ico{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#e1f6f2,#c9ede7);color:var(--teal-dd);margin-bottom:14px}.ico svg{width:30px;height:30px}
.card h3{font-family:var(--serif);font-size:1.2rem}
/* arch photo */
.arch{max-width:430px;margin-inline:auto;position:relative}.arch img{aspect-ratio:4/5;object-fit:cover;max-height:none;border-radius:999px 999px 20px 20px;border:6px solid #fff;box-shadow:0 24px 50px rgba(6,95,86,.22)}.arch:before{content:"";position:absolute;inset:-14px -14px 0;border:2px solid var(--gold);border-radius:999px 999px 28px 28px;opacity:.6;z-index:-1}
.media:not(.arch) img{border-radius:20px}
/* verse band */
.verse{background:linear-gradient(135deg,var(--teal-dd),var(--teal-d));color:#fff;position:relative;overflow:hidden;padding:64px 0}
.verse .wrap{position:relative}.ar-verse{font-family:Amiri,serif;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.9;margin:0 0 12px;color:var(--gold-l)}.verse-tr{font-family:var(--serif);font-size:clamp(1.1rem,2.4vw,1.5rem);font-style:italic;margin:0 0 8px}.verse-src{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85;margin:0}
html[lang=ar] .verse-tr,html[lang=ur] .verse-tr{font-family:inherit;font-style:normal}
/* donate band */
.donate-band{background:linear-gradient(135deg,#fffaf0,#fff3d6);border-block:1px solid #f0e2b8}.donate-band h2{font-size:clamp(1.5rem,3vw,2.1rem)}
.mfill{background:linear-gradient(90deg,var(--teal),var(--teal-d) 70%,var(--gold))}.mbar{height:22px;box-shadow:inset 0 2px 5px rgba(0,0,0,.08)}.tick{background:rgba(255,255,255,.9)}
/* event cards */
.ev-card{border-radius:20px;border:1px solid var(--line)}.ev-body h3{font-family:var(--serif)}
.gal a{border-radius:14px}
/* footer */
.site-footer{background:#f3faf9;border-top:4px solid var(--gold)}.site-footer h4{font-family:var(--serif);font-size:1.1rem}.copy{background:var(--teal-dd);color:#d7f5f1;border:0}
/* timetable polish */
.pt thead th{background:linear-gradient(180deg,var(--teal-d),var(--teal-dd))}.pt-wrap{border-radius:20px}
@media(max-width:960px){.stats-in{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-inline-end:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.hero{padding:44px 0 80px}.bismillah{font-size:1.4rem}.arch{max-width:340px}}
@media(max-width:700px){.sec{padding:52px 0}.brand img{height:44px}.brand b{font-size:1.25rem}.hero-card:before{display:none}.badges li{font-size:.76rem;padding:6px 12px}.verse{padding:46px 0}}

.bismillah{text-align:left}[dir=rtl] .bismillah{text-align:right}

/* ===== LIBRARY + TYPOGRAPHY (Inter: highly legible on phones and desktop) ===== */
body{font-size:17px;line-height:1.7;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-weight:700;letter-spacing:-.02em;line-height:1.2}h1{font-weight:800}
p,li{max-width:75ch}.center p,.split p,.cards p,.hero p,.page-hero p,.stat span,.otd p{max-width:none}
.btn,input,select,textarea,button{font-family:inherit}.btn{font-weight:600;letter-spacing:0}
.nav>a,.dd>a{font-weight:600;font-size:.95rem}
.eyebrow{letter-spacing:.1em;font-size:.76rem}
.small{font-size:.88rem}
/* Quran / Hadith */
.sub{opacity:.85;margin:.2em 0 0}.surah-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.surah-head h1{margin:0}.sa-big{margin-inline-start:auto;font-family:'Amiri Quran',Amiri,serif;font-size:2.4rem;color:var(--teal-dd)}
.sn{flex:0 0 auto;width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#e1f6f2,#c9ede7);color:var(--teal-dd);display:grid;place-items:center;font-weight:700;font-size:.95rem}.sn.lg{width:60px;height:60px;font-size:1.3rem;border-radius:16px;background:var(--teal-d);color:#fff}
.lib-search{display:flex;gap:10px;margin:0 0 18px;flex-wrap:wrap}.lib-search input,.lib-search select,.surah-filter{flex:1 1 220px;min-height:50px;padding:12px 16px;border:1px solid #c5d3d0;border-radius:14px;font-size:16px;background:#fff}.surah-filter{width:100%;margin:0 0 18px}.lib-search select{flex:0 1 200px}
.surahs{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;margin-bottom:26px}
.surah-card,.book-row{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 16px;text-decoration:none;color:var(--ink);transition:.2s}.surah-card:hover,.book-row:hover{border-color:var(--teal);box-shadow:var(--sh);transform:translateY(-2px)}
.sm{display:flex;flex-direction:column;line-height:1.3}.sm b{font-size:1.02rem}.sm small{color:#6b6a6c;font-size:.8rem}.sa{margin-inline-start:auto;font-family:'Amiri Quran',Amiri,serif;font-size:1.5rem;color:var(--teal-dd)}
.books{display:grid;gap:10px}.book-row[hidden],.surah-card[hidden]{display:none!important}
.otd{background:linear-gradient(135deg,#fffaf0,#fff3d6);border:1px solid #f0e2b8;border-radius:20px;padding:24px;margin-bottom:24px;text-align:center}.otd .ar-q{margin:.4em 0}.otd-tr{margin:0 auto .6em;font-size:1.05rem;color:#4b4a4c}.otd-ref{font-weight:700;text-decoration:none}
.reader-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:22px;position:sticky;top:78px;z-index:20;background:rgba(255,255,255,.96);padding:10px 0;backdrop-filter:blur(6px)}
.seg-tabs{display:inline-flex;background:var(--alt);border:1px solid var(--line);border-radius:99px;padding:3px}.stab{padding:9px 18px;border-radius:99px;text-decoration:none;font-weight:600;font-size:.88rem;color:var(--ink);min-height:40px;display:grid;place-items:center}.stab.on{background:var(--teal-d);color:#fff}
.fsize{display:flex;gap:6px}.fsize button{min-width:46px;min-height:44px;border:1px solid var(--line);background:#fff;border-radius:12px;font-weight:700;cursor:pointer;color:var(--teal-dd)}
.bismillah-q,.ar-q,.ar-h{font-family:'Amiri Quran','Amiri','Noto Naskh Arabic','Noto Sans Arabic',serif}.bismillah-q{text-align:center;font-size:2rem;margin:10px 0 20px;color:var(--teal-dd);line-height:2}
.reader{--q:2.1rem;--t:1.08rem}.ayah{padding:20px 4px;border-bottom:1px solid var(--line);position:relative;scroll-margin-top:140px}.ayah:target{background:#fff8e6;border-radius:12px;padding-inline:14px}
.ayah-no{display:inline-block;font-size:.75rem;font-weight:700;color:var(--teal-d);background:var(--alt);border:1px solid var(--line);border-radius:99px;padding:2px 12px;text-decoration:none;margin-bottom:10px}
.ar-q{font-size:var(--q);line-height:2.25;text-align:right;margin:0 0 10px;color:#1c1b1d;max-width:none}.ar-q .end{color:var(--gold-d);font-size:.8em}
.tr{font-size:var(--t);line-height:1.75;color:#38373a;margin:0;max-width:none}.tr-ur{font-family:'Noto Nastaliq Urdu','Noto Sans Arabic',serif;line-height:2.3;font-size:calc(var(--t) + .1rem)}
.reader-nav{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:28px 0 14px}
.hadith{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;margin-bottom:16px;box-shadow:var(--sh);scroll-margin-top:140px}.hadith:target{border-color:var(--gold)}
.hadith header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px;font-size:.85rem}.hno{background:var(--teal-d);color:#fff;border-radius:99px;padding:3px 14px;font-weight:600}.hbook{color:#6b6a6c}
.ar-h{font-size:calc(var(--q) - .35rem);line-height:2.2;text-align:right;margin:0 0 12px;max-width:none;font-family:'Amiri',serif}.hadith footer{margin-top:10px;font-size:.82rem}
.card.coll{text-align:center}.card.coll .sa-big{display:block;margin:0 0 6px}
@media(max-width:700px){.reader{--q:1.75rem;--t:1.02rem}.reader-bar{top:64px}.surahs{grid-template-columns:1fr}.hadith{padding:16px}.sa-big{font-size:2rem}.stab{padding:8px 12px}}
[dir=rtl] .ar-q{text-align:right}

/* ===== MAWAQIT widget: proportional height, never clipped ===== */
.widget,.live-widget .widget,.mawaqit .widget{height:auto!important;aspect-ratio:2.05/1;min-height:300px;width:100%}
.hero-card .widget{aspect-ratio:auto;height:360px!important;min-height:0}
.give.idonate p{max-width:none}.give.idonate .or{display:flex;align-items:center;gap:12px;color:#8a8a8c;margin:18px 0}.give.idonate .or:before,.give.idonate .or:after{content:"";flex:1;height:1px;background:var(--line)}
@media(max-width:700px){.widget{display:none!important}}

/* ===== HERO TIDY ===== */
.hero{padding:56px 0 60px}.hero:after{display:none}
.hero-card{padding:16px 16px 14px;border-radius:20px;border:1px solid var(--line);box-shadow:0 18px 44px rgba(6,95,86,.14)}.hero-card:before{display:none}
.hero-card h2{font-size:1rem;margin:0 0 10px;display:flex;align-items:center;gap:8px}.hero-card h2:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px rgba(0,191,166,.18)}
.hero-card .widget{height:auto!important;aspect-ratio:2.05/1;min-height:0!important;border-radius:12px;overflow:hidden;background:#0b1020}
.hero-card .more{display:block;text-align:center;margin-top:12px;padding:10px;border-radius:12px;background:var(--alt);text-decoration:none;font-weight:600;font-size:.92rem}.hero-card .more:hover{background:#e1f6f2}
.stats-strip{margin-top:0;padding:46px 0 6px}.stats-in{box-shadow:0 10px 30px rgba(6,95,86,.08)}
.donate-band{border-top:0}


/* ===== NAV FIT: never wrap menu labels; collapse to the burger menu earlier ===== */
.nav>a,.dd>a{white-space:nowrap}
@media(min-width:1101px){.nav>a,.dd>a{padding:10px 11px;font-size:.92rem}.nav .nav-cta{margin-inline-start:6px}}
@media(max-width:1100px){
 .burger{display:block}
 .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:stretch;gap:2px;padding:12px 20px 20px;box-shadow:0 14px 24px rgba(0,0,0,.12);max-height:80vh;overflow:auto}
 .nav.open{display:flex}.nav>a,.dd>a{padding:12px 10px;white-space:normal}
 .dd-menu{display:block;position:static;border:0;box-shadow:none;padding:0 0 0 14px;min-width:0}
 .nav .nav-cta{margin:8px 0 0;text-align:center}.bar{position:relative}
}

/* ===== TOP BISMILLAH (small, short, never clipped: no overflow clipping and generous line-height for the letter tails) ===== */
.bm-strip{text-align:center;background:#f3faf9;border:0;padding:3px 0 5px;line-height:1;overflow:visible}.bm-strip span{display:inline-block;max-width:100%;font-family:'Amiri Quran','Amiri','Noto Naskh Arabic',serif;font-weight:400;font-size:1.2rem;line-height:2.3;color:#111;letter-spacing:0;white-space:nowrap;overflow:visible}
@media(max-width:700px){.bm-strip span{font-size:1.1rem}}
.hero,.page-hero{background-color:#f3faf9}
/* home card grid: 4 x 2 on desktop */
.home-cards{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.home-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.home-cards{grid-template-columns:1fr}}

/* ===== LEARN + STORIES ===== */
.notice{background:#f1faf8;border:1px solid #cfe7e3;border-radius:16px;padding:16px 20px;margin-bottom:22px;color:#2f4a46;line-height:1.6}.notice.center{text-align:center}
.learn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.learn-card{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px 24px;text-decoration:none;color:var(--ink);box-shadow:var(--sh);transition:.25s;position:relative;overflow:hidden}.learn-card:hover{transform:translateY(-5px);border-color:var(--teal)}.learn-card h3{margin:4px 0 0;font-size:1.25rem}.learn-card p{margin:0;font-size:.95rem;color:#4b4a4c}
.lc-ico{width:62px;height:62px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--teal),var(--teal-dd));color:#fff;margin-bottom:6px}.lc-ico svg{width:32px;height:32px}.lc-ar{font-family:'Amiri Quran','Amiri',serif;font-size:1.7rem;color:var(--teal-dd);line-height:1.6}.lc-go{margin-top:auto;padding-top:10px;font-weight:700;color:var(--teal-d);font-size:.92rem}
.story-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px}.story-card{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px;text-decoration:none;color:var(--ink);transition:.2s}.story-card:hover{border-color:var(--teal);box-shadow:var(--sh);transform:translateY(-2px)}
.passage-h{font-size:1.1rem;margin:26px 0 4px;padding-bottom:8px;border-bottom:2px solid var(--gold)}.passage-h small{color:var(--teal-d);font-weight:600;margin-inline-start:6px}
/* icon tiles on the home page (replace the old photos) */
.feature-tile{border-radius:26px;background:linear-gradient(145deg,var(--teal-dd),var(--teal-d));color:#fff;padding:44px 28px;text-align:center;box-shadow:0 24px 50px rgba(6,95,86,.22);min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}
.feature-tile:before{content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.25);border-radius:18px;pointer-events:none}
.feature-tile.alt{background:linear-gradient(145deg,#0b4a43,var(--teal-dd))}
.ft-ico{width:86px;height:86px;border-radius:24px;background:rgba(255,255,255,.14);display:grid;place-items:center;margin-bottom:14px}.ft-ico svg{width:46px;height:46px}
.ft-ar{font-family:'Amiri Quran','Amiri',serif;font-size:clamp(2.3rem,5vw,3.2rem);line-height:1.7;margin:0;color:#f4e3b0;max-width:none}.ft-cap{margin:0 0 14px;font-weight:600;letter-spacing:.04em;max-width:none}
.ft-list{list-style:none;display:flex;gap:8px;padding:0;margin:0;flex-wrap:wrap;justify-content:center}.ft-list li{background:rgba(255,255,255,.14);border-radius:99px;padding:5px 16px;font-size:.85rem;font-weight:600}
@media(max-width:900px){.learn-grid{grid-template-columns:1fr}.feature-tile{min-height:260px;padding:34px 20px}}

/* ===== ADMIN DASHBOARD (mobile-first) ===== */
.adm{background:#f1f5f4;font-size:15px}.adm h1{font-size:1.7rem;margin:0}.adm h2{font-size:1.05rem;margin:0 0 12px;letter-spacing:-.01em}
.adm-bar{position:sticky;top:0;z-index:30}.adm-bar nav{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap;max-width:100%;scrollbar-width:thin}.adm-bar .wrap{flex-wrap:wrap}
.adm-main{padding:26px 0 90px}.dash-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:16px}.dash-head p{margin:4px 0 0}.range{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:0 0 18px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:0 2px 10px rgba(6,95,86,.05)}.kpi span{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:#6b6a6c;font-weight:600}.kpi b{display:block;font-size:1.85rem;line-height:1.25;color:var(--ink-d);font-variant-numeric:tabular-nums}.kpi b.sm-b{font-size:1.3rem}.kpi small{color:#6b6a6c;font-size:.8rem}.kpi small.up{color:#0a7a4d;font-weight:700}.kpi small.down{color:#b3261e;font-weight:700}
.kpi.accent{background:linear-gradient(135deg,var(--teal-dd),var(--teal-d));border:0}.kpi.accent span,.kpi.accent small{color:#cdeee9}.kpi.accent b{color:#fff}
.live{display:inline-block;width:10px;height:10px;border-radius:50%;background:#1dbf73;box-shadow:0 0 0 0 rgba(29,191,115,.6);animation:pulse 2s infinite}@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(29,191,115,0)}100%{box-shadow:0 0 0 0 rgba(29,191,115,0)}}
.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin-bottom:16px;box-shadow:0 2px 10px rgba(6,95,86,.05)}.panel .more{display:inline-block;margin-top:8px;font-weight:600;font-size:.88rem;text-decoration:none}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.three{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px}.four{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.two .panel,.three .panel,.four .panel{margin-bottom:0}.two,.three,.four{margin-bottom:16px}
.legend-row{display:flex;gap:16px;font-size:.8rem;color:#6b6a6c;margin:-4px 0 6px}.legend-row .sw{display:inline-block;vertical-align:middle;margin-inline-end:6px}
.sw{width:12px;height:12px;border-radius:3px}.sw.bar{background:#9bd9d1}.sw.ln{height:3px;width:16px;background:var(--teal-dd);border-radius:2px}
.chart{width:100%;height:auto;aspect-ratio:3/1;display:block}.chart .grid{stroke:#e6eeec;stroke-width:1}.chart .ax{font-size:11px;fill:#8a8a8c;font-family:Inter,sans-serif}.chart .bar{fill:#9bd9d1}.chart .hov{fill:transparent}.chart .hov:hover{fill:rgba(0,135,122,.1)}.chart .ln{stroke:var(--teal-dd);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.donut{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.donut svg{width:120px;height:120px;transform:rotate(-0deg)}.dbg{stroke:#e9f0ee;stroke-width:5}.seg{stroke-width:5}.seg.c0,.sw.c0{stroke:#00877a;background:#00877a}.seg.c1,.sw.c1{stroke:#e0b44c;background:#e0b44c}.seg.c2,.sw.c2{stroke:#4aa3df;background:#4aa3df}.seg.c3,.sw.c3{stroke:#8f6bd6;background:#8f6bd6}.seg.c4,.sw.c4{stroke:#e0735a;background:#e0735a}.seg.c5,.sw.c5{stroke:#9aa5a3;background:#9aa5a3}
.legend{list-style:none;margin:0;padding:0;flex:1 1 120px;font-size:.85rem}.legend li{display:flex;align-items:center;gap:8px;padding:3px 0}.legend .sw{display:inline-block;flex:0 0 auto}.legend b{margin-inline-start:auto}
.tbl.s th,.tbl.s td{padding:8px 10px;font-size:.84rem}.tbl.s .path{word-break:break-all;max-width:240px}.tbl{box-shadow:none}
.al{border-radius:12px;padding:11px 16px;margin-bottom:10px;font-size:.9rem;line-height:1.5}.al-err{background:#fde8e6;color:#8a1f1f;border:1px solid #f4b9b3}.al-warn{background:#fff6dc;color:#6a4e00;border:1px solid #f0dca0}.al-info{background:#e8f3fd;color:#164b78;border:1px solid #b9d9f5}
.checks-list{list-style:none;margin:0;padding:0}.checks-list li{padding:7px 0;border-bottom:1px solid var(--line);font-size:.9rem}.checks-list li:last-child{border:0}.checks-list .ok{color:#0a6a43}.checks-list .warn{color:#8a6100}.checks-list .bad{color:#b3261e}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.filter-bar input,.filter-bar select{flex:1 1 160px;min-height:42px;padding:8px 12px;border:1px solid #c5d3d0;border-radius:10px;font-size:15px;background:#fff}
.adm .badge{background:#eee;color:#555;font-size:.68rem}.adm .badge.b2{background:#d8f5ee;color:#065f56}
@media(max-width:1000px){.three{grid-template-columns:1fr 1fr}.four{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.two,.three,.four{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:13px 14px}.kpi b{font-size:1.45rem}.panel{padding:14px}.chart{aspect-ratio:16/10}.adm h1{font-size:1.4rem}.dash-head{align-items:flex-start}}

/* mobile: keep the language switcher visible in the top bar */
@media(max-width:700px){.topbar .wrap{justify-content:space-between;gap:8px;flex-wrap:nowrap}.topbar .wrap>span:first-child{font-size:.72rem}.topbar-r{display:inline-flex!important;align-items:center}.topbar-r>a{display:none!important}.topbar .langsw a{padding:3px 10px;font-size:.8rem}}

/* ===== RTL SAFE HIDING: never park elements at left:-9999px (in right-to-left pages that adds a scroll area and shoves the page sideways on phones) ===== */
.skip{position:absolute;left:0!important;top:0;transform:translateY(-200%);z-index:999}.skip:focus{transform:none}
.sr{position:absolute!important;left:auto!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.hp{position:absolute!important;left:auto!important;top:auto;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
html,body{max-width:100%;overflow-x:clip}
[dir=rtl] .topbar .wrap{flex-wrap:wrap}

/* ===== HOME: services -> footer redesign ===== */
.sec-title{text-align:center;max-width:680px;margin:0 auto 38px}.sec-title h2{margin:.2em 0 .3em}.sec-sub{color:#5d5c5f;margin:0 auto}
.sec-head{align-items:flex-end}.sec-head h2{margin:.15em 0 0}.link-arrow{font-weight:700;text-decoration:none;color:var(--teal-d);white-space:nowrap}.link-arrow:hover{color:var(--teal-dd);text-decoration:underline}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px 26px 26px;box-shadow:0 14px 40px rgba(6,95,86,.08);position:relative;display:flex;flex-direction:column;transition:.25s;overflow:hidden}
.svc-card:before{content:"";position:absolute;inset-inline:0;top:0;height:5px;background:var(--acc)}.svc-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(6,95,86,.14)}
.svc-ico{width:64px;height:64px;border-radius:20px;background:var(--acc-bg);color:var(--acc);display:grid;place-items:center;margin-bottom:16px}.svc-ico svg{width:34px;height:34px}
.svc-card h3{font-size:1.35rem;margin:0 0 .4em}.svc-card>p{color:#4b4a4c;margin:0 0 14px;max-width:none}
.tick-list{list-style:none;margin:0 0 22px;padding:0;flex:1}.tick-list li{position:relative;padding:6px 0;padding-inline-start:30px;font-size:.95rem;color:#38373a;max-width:none}
.tick-list li:before{content:"";position:absolute;inset-inline-start:0;top:9px;width:20px;height:20px;border-radius:50%;background:var(--acc-bg,#e1f6f2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.500 10.500l3 3 6-6.500' fill='none' stroke='%23065f56' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.svc-cta{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line)}
.visit{padding:10px 0 70px}.visit-in{background:linear-gradient(135deg,#065f56,#00877a);border-radius:28px;padding:36px 38px;color:#fff;display:grid;grid-template-columns:1fr 2fr auto;gap:28px;align-items:center;box-shadow:0 24px 50px rgba(6,95,86,.22)}
.visit-head h2{color:#fff;margin:.2em 0 0;font-size:1.5rem}.visit .eyebrow.dark{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#f4e3b0}
.visit-tiles{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:12px}.vt{display:flex;gap:12px;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:12px 14px;color:#fff;text-decoration:none;min-width:0}a.vt:hover{background:rgba(255,255,255,.18)}
.vt-ico{flex:0 0 auto;width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.16);display:grid;place-items:center}.vt-ico svg{width:22px;height:22px}.vt b{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:#cdeee9}.vt span:not(.vt-ico){display:block;font-size:.9rem;overflow-wrap:anywhere;line-height:1.4}
.ev-card{border-radius:22px;box-shadow:0 12px 34px rgba(6,95,86,.09)}.ev-card .ev-body{display:flex;flex-direction:column;gap:6px}.ev-date{align-self:flex-start;background:var(--alt);color:var(--teal-dd);border:1px solid var(--line);border-radius:99px;padding:3px 12px;font-size:.74rem;font-weight:700}.ev-body h3{margin:.2em 0 0}.ev-body p{color:#4b4a4c}.ev-body .link-arrow{margin-top:6px;font-size:.9rem}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gal-grid .g{position:relative;display:block;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--alt)}.gal-grid .g img{width:100%;height:100%;object-fit:cover;transition:.4s}
.gal-grid .g:hover img{transform:scale(1.07)}.g-zoom{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,transparent 40%,rgba(6,95,86,.55));opacity:0;transition:.25s;color:#fff}.g-zoom svg{width:34px;height:34px}.gal-grid .g:hover .g-zoom{opacity:1}
.tight-b{padding-top:20px}.story-banner{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;align-items:center;background:linear-gradient(135deg,#0b4a43,#00877a);border-radius:28px;padding:42px 44px;color:#fff;box-shadow:0 24px 50px rgba(6,95,86,.22);position:relative;overflow:hidden}
.story-banner:after{content:"";position:absolute;inset-inline-end:-80px;bottom:-80px;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.06)}
.story-banner h2{color:#fff;margin:.2em 0 .4em}.story-banner p{color:#d9f3ef;max-width:52ch}.eyebrow.gold{color:#f4e3b0}
.chips{list-style:none;display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 22px;padding:0}.chips li{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:99px;padding:5px 18px;font-weight:600;font-size:.9rem}
.sb-art{text-align:center;position:relative;z-index:1}.sb-art .ft-ico{margin:0 auto 6px}.sb-art .ft-ar{margin:0}
.cta-band{background:linear-gradient(135deg,#fff8e6,#f9ebc4);border-top:1px solid #f0e2b8;padding:46px 0}.cta-in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.cta-in h2{margin:0 0 .2em}.cta-in p{margin:0;color:#4b4a4c}.cta-btns{display:flex;gap:12px;flex-wrap:wrap}
.btn-ghost-w{background:#fff;border-color:var(--teal-d);color:var(--teal-d);box-shadow:none}.btn-ghost-w:hover{background:var(--teal-d);color:#fff}
@media(max-width:1000px){.svc-grid{grid-template-columns:1fr}.visit-in{grid-template-columns:1fr}.visit-tiles{grid-template-columns:1fr}.gal-grid{grid-template-columns:repeat(2,1fr)}.story-banner{grid-template-columns:1fr;padding:32px 24px}.sb-art{order:-1;text-align:start}.sb-art .ft-ico{margin:0}}
@media(max-width:700px){.svc-card{padding:24px 20px}.sec-title{margin-bottom:26px}.visit{padding-bottom:46px}.visit-in{padding:26px 20px;border-radius:22px}.cta-btns .btn{flex:1 1 100%;text-align:center}.cta-in{text-align:center;justify-content:center}.svc-cta .btn{flex:1 1 auto;text-align:center}}

/* ===== INNER PAGES: compact modern header + consistent rhythm ===== */
.bm-strip{padding:2px 0 0}
.page-hero{padding:20px 0 24px!important;background:linear-gradient(180deg,#f3faf9,#fff)!important;border-bottom:1px solid var(--line)!important}
.page-hero:after{display:none!important}
.page-hero .wrap{display:flex;flex-direction:column;gap:4px}
.crumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0!important;font-size:.82rem;color:#6b6a6c!important;max-width:none}.crumb a{color:var(--teal-d)!important;text-decoration:none}.crumb a:hover{text-decoration:underline}
.page-hero h1{font-size:clamp(1.65rem,3.4vw,2.35rem)!important;margin:2px 0 0!important;line-height:1.15;color:var(--ink-d)!important}
.page-hero h1:after{content:"";display:block;width:54px;height:4px;border-radius:4px;background:var(--gold);margin-top:12px}
.page-hero .lead{font-size:1.05rem!important;margin:6px 0 0!important;color:#4b4a4c!important;max-width:70ch}
.page-hero .surah-head h1:after{display:none}
.sec{padding:56px 0}.sec.tight{padding-top:30px;padding-bottom:50px}
/* readable text pages */
.prose,.narrow>p,.narrow>ul,.narrow>ol{font-size:1.02rem}
.narrow h2{margin:1.6em 0 .5em;font-size:1.45rem}.narrow h2:first-child{margin-top:0}.narrow h3{margin:1.4em 0 .4em}
.narrow>p,.prose p{max-width:70ch}
.narrow ul{padding-inline-start:1.2em}.narrow li{margin:.3em 0}
.quote{border-radius:16px}
/* white cards on the soft background look modern */
.cards.three{margin:22px 0}.card.flat{background:#fff;border:1px solid var(--line);box-shadow:0 8px 24px rgba(6,95,86,.06)}
.btns{margin-top:18px}
@media(max-width:700px){.page-hero{padding:14px 0 18px!important}.page-hero h1{font-size:1.55rem!important}.sec{padding:36px 0}.sec.tight{padding-top:22px;padding-bottom:36px}}

/* ===== CONTACT + aligned two-column pages ===== */
.split.top,.split.donate-grid{align-items:start}
.info-cards{display:grid;gap:12px;margin-bottom:16px}.ic{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 16px;text-decoration:none;color:var(--ink);box-shadow:0 6px 18px rgba(6,95,86,.05)}a.ic:hover{border-color:var(--teal);transform:translateY(-2px)}
.ic-ico{flex:0 0 auto;width:46px;height:46px;border-radius:14px;background:#e1f6f2;color:var(--teal-dd);display:grid;place-items:center}.ic-ico svg{width:24px;height:24px}.ic b{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:#6b6a6c}.ic span span{display:block;font-weight:600;color:var(--ink-d);overflow-wrap:anywhere}
.map{border-radius:18px;box-shadow:0 8px 24px rgba(6,95,86,.08)}

/* ===== FLOATING DONATE (phones and tablets) ===== */
.fab-donate{display:none}
@media(max-width:900px){
 .fab-donate{display:inline-flex;align-items:center;gap:8px;position:fixed;z-index:60;inset-inline-end:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));background:linear-gradient(135deg,#e8bf55,#d9a52e);color:#2a2008;text-decoration:none;font-weight:800;font-size:1rem;padding:13px 20px;border-radius:99px;box-shadow:0 10px 26px rgba(150,105,10,.45),0 2px 6px rgba(0,0,0,.15);min-height:50px;animation:fabpulse 2.6s infinite}
 .fab-donate svg{width:22px;height:22px;color:#b3261e}.fab-donate small{background:rgba(42,32,8,.14);border-radius:99px;padding:2px 9px;font-size:.78rem;font-weight:700}
 .fab-donate:active{transform:scale(.96)}
 body{padding-bottom:84px}
}
@keyframes fabpulse{0%{box-shadow:0 10px 26px rgba(150,105,10,.45),0 0 0 0 rgba(217,165,46,.55)}70%{box-shadow:0 10px 26px rgba(150,105,10,.45),0 0 0 16px rgba(217,165,46,0)}100%{box-shadow:0 10px 26px rgba(150,105,10,.45),0 0 0 0 rgba(217,165,46,0)}}
@media(prefers-reduced-motion:reduce){.fab-donate{animation:none}}
@media print{.fab-donate{display:none!important}}

.fab-donate{z-index:40!important}

/* ===== SINGLE LOGO (the logo already contains the name, so no duplicate text next to it) ===== */
.site-header .brand{gap:0}.site-header .brand img{height:62px;width:auto}
@media(max-width:700px){.site-header .brand img{height:50px}}

/* ===== MOBILE HEADER NAME: logo | name | menu button ===== */
.hdr-name{display:none}
@media(max-width:1100px){
 .site-header .bar{gap:10px}
 .hdr-name{display:block;flex:1 1 auto;min-width:0;text-align:center;text-decoration:none;color:var(--teal-dd);font-weight:800;font-size:1rem;line-height:1.25;letter-spacing:-.01em}
 html[lang=ar] .hdr-name,html[lang=ur] .hdr-name{letter-spacing:0;line-height:1.6;font-size:.95rem}
}
@media(max-width:380px){.hdr-name{font-size:.88rem}}

@media(min-width:901px){.learn-grid.two{grid-template-columns:repeat(2,1fr)}}

/* ===== RCN ONE LINE ===== */
.topbar .rcn{white-space:nowrap}.topbar .rcn-short{display:none}
@media(max-width:560px){.topbar .rcn-long{display:none}.topbar .rcn-short{display:inline}.topbar .wrap{flex-wrap:nowrap!important}.topbar .rcn,.topbar .rcn b{font-size:.78rem}}

.tr-note{display:inline-block;background:#fff7dd;border:1px solid #f0e2b8;color:#6a4e00;border-radius:10px;padding:4px 12px;font-size:.82rem;margin:0 0 8px}

/* ===== BIDI SAFE: phone numbers, emails, addresses, IBANs and times keep their left-to-right order inside Arabic / Urdu pages ===== */
a[href^="tel:"],a[href^="mailto:"]{direction:ltr;unicode-bidi:isolate;display:inline-block}
[dir=rtl] .topbar-r{direction:rtl}
[dir=rtl] .topbar-r>a{margin-inline-start:18px}
[dir=rtl] .rcn b,[dir=rtl] .contact-list li,[dir=rtl] .vt span:not(.vt-ico),[dir=rtl] .ic span span,[dir=rtl] .bank td,[dir=rtl] .pt td,[dir=rtl] .ev-date,[dir=rtl] .facts p,[dir=rtl] .mile-big,[dir=rtl] .mile-foot b{direction:ltr;unicode-bidi:isolate}
[dir=rtl] .contact-list li,[dir=rtl] .vt span:not(.vt-ico),[dir=rtl] .ic span span,[dir=rtl] .bank td{text-align:right}
[dir=rtl] .contact-list li a,[dir=rtl] .vt,[dir=rtl] .ic{unicode-bidi:isolate}

/* ===== QURAN BISMILLAH: same font, size and colour as the ayahs, centred ===== */
.reader .bismillah-q{display:block;width:100%;font-family:'Amiri Quran','Amiri','Noto Naskh Arabic',serif;font-size:var(--q);line-height:2.25;color:#1c1b1d;text-align:center;margin:6px 0 10px;padding:6px 0 18px;border-bottom:1px solid var(--line);max-width:none}
