/* Static public landing look, matched to the homepage design. */
:root{
  --ink:#13221d;
  --muted:#64736e;
  --line:#dfe8e4;
  --paper:#fff;
  --soft:#f4f8f6;
  --green:#0b6b4a;
  --green-2:#084d37;
  --mint:#e7f5ef;
  --gold:#f4b23e;
  --shadow:0 14px 40px rgba(12,35,28,.09);
  --ur:'Noor-e-Nastaliq','Noori Nastaleeq','Jameel Noori Nastaleeq','Noto Nastaliq Urdu','Noto Nastaliq Urdu UI',serif;
  --en:'Noto Sans',sans-serif;
}
html{scroll-behavior:smooth}
body{background:var(--soft) !important;color:var(--ink) !important}
a{text-decoration:none}
.wrap{width:min(1160px,calc(100% - 32px));margin-inline:auto}
.top{background:#083728 !important;color:#dff4ec !important;font-family:var(--en);font-size:12px}
.top .wrap{display:flex;justify-content:space-between;gap:16px;padding:7px 0}
.nav,#nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94) !important;color:var(--ink) !important;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:none !important}
.nav>.wrap,#nav .ni{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0}
.brand,.nb{display:flex;align-items:center;gap:14px;min-width:300px;color:var(--ink) !important;flex:0 1 410px}
.brand img,.nl{width:64px;height:64px;border-radius:50%;object-fit:contain;border:0;overflow:hidden;background:#fff;flex:0 0 auto}
.nl img{width:100%;height:100%;object-fit:cover}
.brand-title,.nt{font-family:var(--en);font-weight:800;font-size:18px;letter-spacing:0;color:var(--ink) !important}
.brand-title-en{line-height:1.18;white-space:normal}
.brand-title-en span{display:block;font-weight:800}
.brand-title-ur{font-family:var(--ur) !important;font-size:23px;line-height:1.75;font-weight:700;text-align:right}
.brand-sub,.ns{font-size:13px;color:var(--muted) !important;margin-top:-2px}
.links,.nav-links{display:flex;gap:2px;align-items:center;justify-content:center;font-family:var(--en);flex:1 1 auto;min-width:0}
.nav-actions{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.links>a,.links>.nav-drop>.nav-drop-toggle,.nav-links a,.lang button{border:0;background:transparent !important;padding:8px 8px;border-radius:7px;color:#33423e !important;font-size:13px;white-space:nowrap}
.links>a:hover,.links>a.active,.links>.nav-drop>.nav-drop-toggle:hover,.links>.nav-drop>.nav-drop-toggle.active,.nav-links a:hover,.nav-links a.active,.lang button.active{background:var(--mint) !important;color:var(--green) !important}
.nav-drop{position:relative;display:flex;align-items:center}
.nav-drop-toggle{display:inline-flex;align-items:center;gap:4px}
.nav-drop-toggle i{font-size:13px}
.nav-submenu{position:absolute;top:100%;left:0;z-index:90;width:260px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 18px 40px rgba(12,35,28,.14);padding:8px;display:none !important}
.nav-submenu:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
html[dir="rtl"] .nav-submenu{left:auto;right:0;text-align:right}
.nav-drop:hover .nav-submenu,.nav-drop:focus-within .nav-submenu{display:grid !important;gap:4px}
.nav-submenu a{display:flex !important;align-items:center;gap:9px;width:100%;padding:10px 11px !important;border-radius:7px;white-space:normal !important;line-height:1.35}
.nav-submenu a i{color:var(--green);font-size:18px;flex:0 0 auto}
.nav-submenu a span{display:block}
.lang{display:flex;border:1px solid var(--line);border-radius:8px;padding:2px;background:#fff !important;gap:2px}
.hero{background:linear-gradient(135deg,#f7fbf9 0%,#eef7f2 48%,#fff6df 100%) !important;color:var(--ink) !important;border-bottom:1px solid var(--line);text-align:inherit !important}
.hero .wrap{padding:46px 0 34px !important}
.hero h1{font-family:var(--en);font-size:clamp(31px,4.2vw,56px) !important;line-height:1.12 !important;margin:12px 0;color:#0f3025 !important}
.hero p,.lead{font-size:18px;color:#40514c !important;max-width:760px;line-height:1.75}
.eyebrow{display:inline-flex;gap:8px;align-items:center;background:#fff !important;border:1px solid var(--line);border-radius:999px;padding:7px 12px;color:var(--green) !important;font-family:var(--en);font-size:13px;font-weight:800;text-transform:none;letter-spacing:0}
.btn,.cta-btn,.cat-chip,.member-link{border-radius:8px}
.btn:not(.alt),.btn-green,.cta-btn{background:var(--green) !important;color:#fff !important;border:0}
.btn.alt,.btn-light{background:#fff !important;color:var(--green) !important;border:1px solid var(--line) !important}
.btn-gold{background:var(--gold) !important;color:#18251f !important}
.panel,.card,.stat,.svc,.post-card,.rel-card,.member-card,.contact-card,.zila-card,.day-card,.event-card,.empty{background:#fff !important;border:1px solid var(--line) !important;border-radius:8px !important;box-shadow:0 5px 18px rgba(0,0,0,.04)}
.panel h2,.num,.member-name,.post-title,.cat-chip.active{color:var(--green) !important}
.footer,.foot{background:#062d22 !important;color:#d4e8e0 !important;padding:28px 1rem 22px;text-align:inherit;font-family:var(--en);font-size:13px}
.footer a,.foot a{color:#d4e8e0 !important}
.foot-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:32px;text-align:left;margin-bottom:22px}
.foot-grid h4{margin:0 0 10px;color:#fff;font-size:16px}
.foot-grid p{margin:0 0 8px;color:#d4e8e0}
.foot-grid a{display:block;margin:7px 0}
.foot-bottom{text-align:center;border-top:1px solid rgba(255,255,255,.12);padding-top:16px;color:#d4e8e0}
.foot-bottom a{display:inline !important;margin:0 !important;color:#d4e8e0 !important}
.mobile-dock{background:rgba(255,255,255,.92);border:1px solid var(--line);box-shadow:var(--shadow)}
@media(max-width:940px){
  .nav>.wrap,#nav .ni{flex-wrap:wrap;align-items:center;padding:10px 0}
  .brand,.nb{flex:1 1 100%;min-width:0}
  .links,.nav-links{order:3;flex:1 1 100%;flex-wrap:wrap;justify-content:flex-start}
  .nav-drop{position:static}
  .nav-submenu{position:static;width:100%;box-shadow:none;margin-top:4px}
  .nav>.wrap,#nav .ni{height:auto;min-height:64px;padding:10px 0}
  .foot-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .wrap{width:min(100% - 22px,1160px)}
  .top{display:none}
  .brand img,.nl{width:48px;height:48px}
  .brand-title,.nt{font-size:13px;line-height:1.25;max-width:185px;white-space:normal;overflow:hidden}
  .brand-title-ur{font-size:16px;line-height:1.7}
  .brand-sub,.ns{display:none}
  .nav-actions{gap:6px;flex-shrink:0}
  .nav-actions .btn-light{display:none}
  .nav-actions .btn-green{width:52px;padding:8px}
  .nav-actions .btn-green span{display:none}
  .links a,.nav-links a,.lang button{padding:7px 8px;font-size:12px}
  .hero .wrap{padding:28px 0 24px !important}
  .hero h1{font-size:31px !important}
  .hero p,.lead{font-size:15px}
}

/* Final public theme overrides: keep every public page visually aligned with the landing page. */
body,
body.rtl,
body.ltr{
  font-family:var(--ur) !important;
  background:var(--soft) !important;
  color:var(--ink) !important;
  line-height:1.75 !important;
}
html[lang="en"] body,
body.ltr{
  font-family:var(--en) !important;
  line-height:1.58 !important;
}
.subhero,
.hero{
  background:linear-gradient(135deg,#f7fbf9 0%,#eef7f2 48%,#fff6df 100%) !important;
  color:var(--ink) !important;
  border-bottom:1px solid var(--line) !important;
  text-align:inherit !important;
}
.subhero .wrap,
.hero .wrap{
  padding:46px 0 34px !important;
}
.subhero h1,
.hero h1,
.post-title,
.sec-title{
  color:#0f3025 !important;
  font-family:var(--en) !important;
  letter-spacing:0 !important;
}
html[lang="ur"] .subhero h1,
html[lang="ur"] .hero h1,
html[lang="ur"] .sec-title{
  font-family:var(--ur) !important;
  line-height:1.45 !important;
}
html[lang="ur"] .top,
html[lang="ur"] .links,
html[lang="ur"] .nav-links,
html[lang="ur"] .links a,
html[lang="ur"] .nav-links a,
html[lang="ur"] .nav-drop-toggle,
html[lang="ur"] .nav-submenu a,
html[lang="ur"] .lang button,
html[lang="ur"] .btn,
html[lang="ur"] .footer,
html[lang="ur"] .foot,
html[lang="ur"] .foot-grid,
html[lang="ur"] .mobile-dock a,
html[lang="ur"] input,
html[lang="ur"] select,
html[lang="ur"] textarea{
  font-family:var(--ur) !important;
  letter-spacing:0 !important;
}
html[lang="ur"] .links a,
html[lang="ur"] .nav-links a,
html[lang="ur"] .nav-drop-toggle,
html[lang="ur"] .nav-submenu a,
html[lang="ur"] .lang button{
  font-size:15px !important;
  line-height:1.75 !important;
}
html[lang="ur"] .btn{
  font-size:16px !important;
  line-height:1.55 !important;
}
html[lang="ur"] .foot-grid{
  text-align:right !important;
}
.subhero .lead,
.subhero p,
.hero p,
.lead{
  color:#40514c !important;
}
.subhero .eyebrow,
.hero .eyebrow,
.eyebrow,
.sec-kicker{
  color:var(--green) !important;
  background:#fff !important;
  border-color:var(--line) !important;
  font-family:var(--en) !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.btn,
.btnlink,
.btn-send,
.cta a,
button.btn,
input[type="submit"],
.small-btn,
.pg.active,
.chip.active,
.cat-chip.active{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  min-height:42px !important;
  border-radius:8px !important;
  padding:10px 15px !important;
  font:800 13px var(--en) !important;
  background:var(--green) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}
.btn:hover,
.btnlink:hover,
.btn-send:hover,
.cta a:hover,
button.btn:hover,
input[type="submit"]:hover{
  background:var(--green-2) !important;
}
.btn-light,
.btn.alt,
.btnlink.alt,
.small-btn,
.chip,
.cat-chip,
.pg{
  background:#fff !important;
  color:var(--green) !important;
  border:1px solid var(--line) !important;
}
.btn-gold{
  background:var(--gold) !important;
  color:#18251f !important;
}
.panel-head,
.notice,
.cta,
.zila-intro{
  background:#083728 !important;
  color:#fff !important;
}
.panel-head small,
.notice p,
.cta p,
.zila-intro p{
  color:#dff4ec !important;
}
.panel,
.card,
.stat,
.district-card,
.member-card,
.post-header,
.post-body,
.rel-card,
.service,
.step,
.slot,
.event,
.day,
.row,
.zila,
.empty{
  border-radius:8px !important;
  border:1px solid var(--line) !important;
  background:#fff !important;
  box-shadow:0 5px 18px rgba(0,0,0,.04) !important;
}
input,
select,
textarea{
  border-radius:8px !important;
  border:1px solid var(--line) !important;
  font-family:inherit !important;
}
input:focus,
select:focus,
textarea:focus{
  outline:3px solid rgba(11,107,74,.13) !important;
  border-color:var(--green) !important;
  box-shadow:none !important;
}
.links{display:flex !important}
@media(max-width:940px){
  .links{display:flex !important}
}