:root{--green-950:#061f18;--green-900:#083428;--green-800:#0b4b36;--green-700:#17623f;--green-600:#2b7b3d;--green-500:#5a9f2d;--green-100:#eaf3e8;--green-50:#f5f9f3;--ink:#14211c;--muted:#5d6a64;--line:#dfe7e1;--white:#fff;--shadow:0 14px 40px rgba(7,47,35,.12);--radius:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.6}img{max-width:100%;display:block}a{color:inherit}.container{width:min(1080px,92%);margin-inline:auto}.skip-link{position:absolute;left:-999px}.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:.7rem 1rem;z-index:9999}.topbar{background:#041a14;color:#dce9df;font-size:.9rem}.topbar-inner{display:flex;justify-content:space-between;gap:1rem;padding:.45rem 0}.site-header{background:linear-gradient(135deg,#071b15,#0b3326);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 6px 18px rgba(0,0,0,.15)}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:2rem}.brand img{width:190px;height:auto;max-height:64px;object-fit:contain;object-position:left center}.nav{display:flex;align-items:center;gap:1.35rem;font-weight:700;font-size:.95rem}.nav a{text-decoration:none;padding:.6rem 0;border-bottom:2px solid transparent}.nav a:hover,.nav a.active{color:#8ac647;border-color:#8ac647}.nav .donate-link{background:#3b7f2f;color:#fff;padding:.72rem 1.1rem;border-radius:10px;border:0}.menu-toggle{display:none;background:#fff;border:0;border-radius:8px;padding:.65rem .9rem;font-weight:700}.site-banner-table{width:100%;border-collapse:collapse;background:#062219}.site-banner-table td{padding:0}.site-banner-table img{width:100%;height:auto;max-height:none;object-fit:contain;object-position:center;display:block}.hero{background:radial-gradient(circle at 75% 40%,rgba(98,145,83,.25),transparent 33%),linear-gradient(135deg,#061f18,#0b3328 70%,#0e412f);color:#fff;padding:3.2rem 0}.hero-inner{display:grid;grid-template-columns:minmax(0,720px) 1fr;align-items:center}.arabic{font-family:Georgia,serif;color:#9ccc56;font-size:1.35rem;margin-bottom:1rem}.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-weight:800;color:#4d8c31;font-size:.78rem}.eyebrow.light{color:#c8ed93}.hero h1,.section-title{font-family:Georgia,'Times New Roman',serif}.hero h1{font-size:clamp(2.25rem,5vw,4rem);line-height:1.02;margin:.4rem 0 1.2rem;max-width:780px}.hero h1 span{color:#a9d56b}.hero-copy{max-width:650px;color:#e7eee9;font-size:1.08rem}.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.5rem}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:10px;padding:.82rem 1.2rem;font-weight:800;border:1px solid transparent;cursor:pointer}.btn-primary{background:#3e832f;color:#fff}.btn-secondary{background:transparent;color:inherit;border-color:currentColor}.btn-light{background:#fff;color:#173a2d}.section{padding:3.4rem 0}.section-sm{padding:2rem 0}.section-title{font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.15;margin:.3rem 0 .8rem;color:#0a3a2a}.section-intro{max-width:760px;color:var(--muted);font-size:1.05rem}.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}.card,.contact-card,.importance-card,.pillar-content-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow)}.card h3{color:#0b4b36}.icon-box{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#eaf4e2;color:#277233;font-size:1.35rem;font-weight:900}.card-link{color:#287c35;font-weight:800;text-decoration:none}.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}.media-panel{border-radius:22px;overflow:hidden;box-shadow:var(--shadow);background:#e9f1eb;min-height:360px}.media-panel img{width:100%;height:100%;min-height:360px;object-fit:cover}.check-list{padding-left:1.2rem}.check-list li{margin:.6rem 0}.imam-section{background:#f8faf8}.imam-grid{display:grid;grid-template-columns:320px 1fr;gap:2.5rem;align-items:center}.imam-photo-wrap{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);background:#0a3728}.imam-photo-wrap img{width:100%;height:330px;object-fit:cover;object-position:center top}.tax-section{background:#f2f6f0}.tax-card{max-width:1000px}.band{background:#0b3d2d;color:#fff}.band-inner{display:flex;justify-content:space-between;align-items:center;gap:2rem}.band h2{margin:0}.home-prayer-section{padding:2.3rem 0;background:#eef4ef}.home-prayer-calendar{background:linear-gradient(rgba(4,27,20,.72),rgba(4,27,20,.82)),url('../images/kaaba-compass.png') center/cover;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);color:#fff}.home-prayer-overlay{padding:1.5rem}.prayer-panel-head{display:flex;justify-content:space-between;gap:1rem;align-items:end;margin-bottom:1rem}.prayer-panel-head h2{font:700 1.8rem Georgia,serif;margin:.2rem 0}.prayer-location{color:#748079;font-size:.94rem}.home-prayer-calendar .prayer-location{color:#d5e5da}.prayer-list-vertical,.prayer-grid-vertical{display:grid;gap:.75rem}.prayer-row,.prayer-item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.8rem;padding:.72rem .9rem;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:rgba(0,0,0,.16)}.prayer-grid-vertical .prayer-item{background:#fff;border-color:var(--line);box-shadow:0 8px 22px rgba(6,45,33,.07)}.prayer-name{font-weight:800}.prayer-time{font-size:1.15rem;font-weight:900;color:#8dcf4d}.prayer-grid-vertical .prayer-time{color:#2e7e38}.next-prayer{display:flex;justify-content:space-between;align-items:center;gap:1rem;background:#0c4a36;color:#fff;padding:1rem 1.2rem;border-radius:12px}.next-prayer strong{display:block}.countdown{font-size:1.3rem;font-weight:900;font-variant-numeric:tabular-nums}.prayer-note{font-size:.92rem;color:#66746d}.home-prayer-note{color:#d8e6dc}.footer{background:#071b15;color:#dce5df;padding-top:2.2rem}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.6fr;gap:2rem}.footer a{color:#e7eee9}.footer-brand{display:flex;align-items:center;gap:.8rem;text-decoration:none}.footer-brand img{width:150px;height:auto}.footer-links{list-style:none;margin:0;padding:0}.footer-links li{margin:.45rem 0}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:2rem;padding:1rem 0 1.5rem;display:flex;justify-content:space-between;gap:1rem;font-size:.88rem;color:#aebbb4}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.contact-list{display:grid;gap:1rem}.contact-line{padding:1rem;border:1px solid var(--line);border-radius:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.field{display:grid;gap:.35rem}.field.full{grid-column:1/-1}.field label{font-weight:800}.field input,.field textarea,.field select{width:100%;padding:.8rem .9rem;border:1px solid #cfdad3;border-radius:9px;font:inherit;background:#fff}.field textarea{min-height:150px;resize:vertical}.notice,.form-status{padding:1rem;border-radius:10px;background:#eef6e9;border:1px solid #c9dec0}.form-status-error{background:#fff1f1;border-color:#e7c1c1}.qr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}.qr-card{border:1px solid var(--line);border-radius:16px;padding:1rem;text-align:center;background:#fff}.qr-card img{margin:auto;max-height:280px}.donation-choice{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.donation-choice a{padding:1.5rem;border-radius:14px;background:#eff6ec;text-decoration:none;border:1px solid #d2e2cc}.table-wrap{overflow-x:auto}.schedule-table{width:100%;border-collapse:collapse}.schedule-table th,.schedule-table td{padding:.8rem;border-bottom:1px solid var(--line);text-align:left}.pillar-content-grid{display:grid;grid-template-columns:240px 1fr;gap:2rem}.pillar-side-nav{display:grid;gap:.5rem}.pillar-link{padding:.7rem;border-radius:8px;text-decoration:none;background:#eef5eb}.pillar-badge,.pillar-number{display:inline-grid;place-items:center;background:#2f7d38;color:#fff;border-radius:999px;padding:.3rem .7rem;font-weight:800}.reveal{opacity:1;transform:none}
@media(max-width:900px){.menu-toggle{display:block}.nav{display:none;position:absolute;top:100%;left:0;right:0;background:#08261c;padding:1rem 4%;flex-direction:column;align-items:stretch}.nav.open{display:flex}.header-inner{min-height:80px}.brand img{width:175px}.hero{padding:3.5rem 0}.hero-inner{grid-template-columns:1fr}.cards-3,.split,.contact-grid,.imam-grid,.footer-grid,.donation-choice,.qr-grid,.pillar-content-grid{grid-template-columns:1fr}.imam-photo-wrap{max-width:360px}.band-inner,.topbar-inner,.footer-bottom,.prayer-panel-head{align-items:flex-start;flex-direction:column}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.site-banner-table img{height:auto;max-height:none}}
@media(max-width:560px){.container{width:min(94%,1160px)}.topbar{display:none}.brand img{width:150px}.section{padding:2.8rem 0}.hero h1{font-size:2.25rem}.site-banner-table img{height:auto;max-height:none}.home-prayer-overlay{padding:1.2rem}.prayer-row,.prayer-item{padding:.75rem}.next-prayer{align-items:flex-start;flex-direction:column}}

/* Compact restoration adjustments */
.time-left-label{display:block;font-size:.78rem;opacity:.82;text-align:right;margin-bottom:.05rem}.home-next-prayer{margin-top:.9rem}.home-next-prayer .countdown{min-width:105px;text-align:right}@media(max-width:560px){.time-left-label,.home-next-prayer .countdown{text-align:left}.home-next-prayer .countdown{min-width:0}}

/* 2026-09-06 RESTORE ORIGINAL-SCALE OVERRIDES
   Purpose: restore the compact white navigation, normal typography,
   vertically stacked Five Pillars, and compact footer without changing
   the banner proportions or prayer countdown functionality. */

html { font-size: 15px; }
body { font-size: 1rem; line-height: 1.5; }

/* White top navigation, as in the original site */
.site-header {
  background: #ffffff !important;
  color: #0b241a !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.08) !important;
}
.header-inner { min-height: 66px !important; gap: 1.5rem !important; }
.brand img { width: 170px !important; max-height: 56px !important; }
.nav { gap: 1.15rem !important; font-size: .88rem !important; }
.nav a { color: #111 !important; padding: .45rem 0 !important; }
.nav a:hover,
.nav a.active { color: #1f6a32 !important; border-color: #1f6a32 !important; }
.nav .donate-link { color: #fff !important; background: #1f6a32 !important; padding: .62rem .95rem !important; border-radius: 7px !important; }
.menu-toggle { color: #173a2d !important; border: 1px solid #d7dfda !important; }

/* Restore compact typography */
.hero { padding: 2.2rem 0 !important; }
.hero h1 { font-size: clamp(2rem,4vw,3.15rem) !important; line-height: 1.06 !important; margin-bottom: .9rem !important; }
.hero-copy { font-size: 1rem !important; }
.arabic { font-size: 1.15rem !important; margin-bottom: .7rem !important; }
.section { padding: 2.6rem 0 !important; }
.section-sm { padding: 1.5rem 0 !important; }
.section-title { font-size: clamp(1.55rem,2.8vw,2.05rem) !important; }
.section-intro { font-size: 1rem !important; }
.card h3 { font-size: 1.05rem !important; }
.prayer-panel-head h2 { font-size: 1.5rem !important; }
.prayer-time { font-size: 1.05rem !important; }
.countdown { font-size: 1.15rem !important; }
.btn { padding: .68rem 1rem !important; font-size: .92rem !important; }

/* Five Pillars: full-size vertical stack */
.pillars-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.25rem;
  box-shadow: var(--shadow);
}
.pillars-panel h2 { margin: 0 0 .35rem; font-size: 1.55rem; color: #0a3a2a; }
.pillars-panel > p { margin: 0 0 1rem; color: var(--muted); }
.pillar-links {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: .65rem !important;
  width: 100% !important;
}
.pillar-links .pillar-link {
  display: grid !important;
  grid-template-columns: 38px 1fr auto !important;
  align-items: center !important;
  gap: .8rem !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: .72rem .85rem !important;
  border-radius: 10px !important;
  background: #f4f8f2 !important;
  border: 1px solid #dce8d8 !important;
  text-decoration: none !important;
}
.pillar-links .pillar-number {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}
.pillar-links .pillar-link strong { display: block; font-size: 1rem !important; color: #0a3a2a; }
.pillar-links .pillar-link small { display: block; font-size: .84rem !important; color: #65736b; margin-top: .08rem; }
.pillar-arrow { font-size: 1.05rem; color: #2f7d38; }

/* Compact footer restored */
.footer { padding-top: 1rem !important; }
.footer-grid { gap: 1.15rem !important; font-size: .86rem !important; }
.footer-brand img { width: 115px !important; }
.footer-links li { margin: .25rem 0 !important; }
.footer h3, .footer h4 { margin-top: .2rem !important; margin-bottom: .45rem !important; font-size: .95rem !important; }
.footer p { margin: .28rem 0 !important; }
.footer-bottom {
  margin-top: .8rem !important;
  padding: .55rem 0 .7rem !important;
  font-size: .78rem !important;
}

@media (max-width: 900px) {
  .site-header { background: #fff !important; }
  .nav { background: #fff !important; box-shadow: 0 8px 16px rgba(0,0,0,.08); }
  .nav a { color: #111 !important; }
  .header-inner { min-height: 66px !important; }
  .brand img { width: 155px !important; }
  .pillar-links { grid-template-columns: 1fr !important; }
}

@media (max-width: 560px) {
  html { font-size: 14.5px; }
  .brand img { width: 145px !important; }
  .section { padding: 2.1rem 0 !important; }
  .hero h1 { font-size: 2rem !important; }
  .footer { padding-top: .8rem !important; }
}

/* Preserve the compact footer logo slot with the original circular logo. */
.footer-brand img { height: 38px; object-fit: contain; object-position: left center; }

/* Requested corrections: Imam backdrop, prayer separators and donation stacks. */
body[data-page="home"] .imam-section,
body[data-page="home"] .imam-photo-wrap { background: #000; }
body[data-page="home"] .imam-section .section-title { color: #fff; }
body[data-page="home"] .imam-section .section-intro { color: #e5e5e5; }
body[data-page="home"] .imam-section .eyebrow { color: #a9d56b; }
body[data-page="home"] .imam-photo-wrap img { object-fit: contain; background: #000; }
[data-prayer-widget] .prayer-row,
[data-prayer-widget] .prayer-item { border: 0; box-shadow: none; background: transparent; border-radius: 0; }
[data-prayer-widget] .prayer-list-vertical,
[data-prayer-widget] .prayer-grid-vertical { gap: 0; border: 0; }
body[data-page="donate"] .donation-choice { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: .8rem; align-content: start; }
body[data-page="donate"] .donation-choice h3,
body[data-page="donate"] .donation-choice p { margin: 0; }
body[data-page="donate"] .donation-choice a { padding: .68rem 1rem; background: #1f6a32; border: 0; }
body[data-page="donate"] .qr-card { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto 1fr; gap: .8rem; align-content: start; }
body[data-page="donate"] .qr-card h2,
body[data-page="donate"] .qr-card p { margin: 0; }
body[data-page="donate"] .qr-card img { max-width: 100%; height: auto; align-self: start; margin: 0 auto; }
body[data-page="donate"] .donation-payment-area { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
body[data-page="donate"] .donation-qr-option { display: grid; justify-items: center; gap: .5rem; text-align: center; }
body[data-page="donate"] .donation-qr-option img { max-width: 100%; max-height: 220px; width: auto; height: auto; }

/* Temporary donation notices until payment QR codes are supplied. */
body[data-page="donate"] .qr-coming-soon { margin: 0; padding: 1rem; width: 100%; border-radius: 8px; background: var(--green-50); color: var(--muted); text-align: center; font-size: .9rem; }

/* Home page: separate photo and introduction cards for the Imam. */
body[data-page="home"] .imam-grid { align-items: stretch; }
body[data-page="home"] .imam-card { min-width: 0; border: 1px solid #4a4a4a; border-radius: 18px; background: #000; overflow: hidden; }
body[data-page="home"] .imam-introduction { padding: 1.5rem; display: flex; flex-direction: column; justify-content: center; }
body[data-page="home"] .imam-introduction .section-intro { margin-bottom: 0; }
@media (max-width: 900px) { body[data-page="home"] .imam-photo-wrap { max-width: none; } }

/* Final requested details: readable Donate states and separated Imam panels. */
.site-header .nav a.donate-link,
.site-header .nav a.donate-link:hover,
.site-header .nav a.donate-link:focus,
.site-header .nav a.donate-link:active { color: #fff !important; background: #1f6a32 !important; }
.site-header .nav a.donate-link:focus-visible { outline: 2px solid #173a2d; outline-offset: 3px; }
body[data-page="home"] .imam-section,
body[data-page="home"] .imam-introduction { background: #fff; color: #111; }
body[data-page="home"] .imam-card { border: 0; box-shadow: none; }
body[data-page="home"] .imam-photo-wrap,
body[data-page="home"] .imam-photo-wrap img { background: #000; }
body[data-page="home"] .imam-section .section-title,
body[data-page="home"] .imam-section .section-intro,
body[data-page="home"] .imam-section .eyebrow { color: #111; }
.footer-brand img { width: 38px !important; height: 38px; flex: 0 0 38px; object-fit: contain; clip-path: circle(45% at 50% 50%); }

/* Contact: form first, separate information area below. */
body[data-page="contact"] .contact-form-container { max-width: 800px; }
body[data-page="contact"] .contact-information-section { background: #eaf3e8; }
body[data-page="contact"] .contact-information-section .contact-card { background: transparent; border: 0; box-shadow: none; padding: 0; }
body[data-page="contact"] .contact-line { display: grid; gap: .25rem; background: #fff; }
body[data-page="contact"] #contact-result { scroll-margin-top: 100px; }
body[data-page="contact"] #contact-result[hidden] { display: none; }
body[data-page="contact"] #contact-form .field[hidden] { display: none; }

/* Lighter green welcome section immediately below the home-page banner. */
body[data-page="home"] .hero { background: #dcefd7; color: #142b1b; }
body[data-page="home"] .hero h1 span { color: #245f32; }
body[data-page="home"] .hero .hero-copy { color: #253c2c; }
body[data-page="home"] .hero .arabic,
body[data-page="home"] .hero .eyebrow { color: #245f32; }