@import url('https://fonts.googleapis.com/css2?family=Noto+Nastaliq+Urdu:wght@400;600;700&family=Noto+Sans+Arabic:wght@400;600;700;800&display=swap');

:root{
  --green:#006633;
  --dark-green:#003d1f;
  --gold:#d4af37;
  --white:#ffffff;
  --soft:#f6fbf7;
  --ink:#102017;
  --muted:#5a6b60;
  --card:#ffffff;
  --shadow:0 18px 45px rgba(0,61,31,.13);
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Noto Sans Arabic','Noto Nastaliq Urdu',serif;
  background:linear-gradient(180deg,#eef8f0 0%,#ffffff 42%,#f7faf8 100%);
  color:var(--ink);
  direction:rtl;
  text-align:right;
  line-height:1.85;
}
a{color:inherit;text-decoration:none}
.container{width:min(1120px,92%);margin:auto}
.topbar{background:var(--dark-green);color:#dff7e8;font-size:.92rem;padding:.55rem 0;text-align:center}
header{
  background:radial-gradient(circle at 20% 10%,rgba(212,175,55,.28),transparent 30%),linear-gradient(135deg,var(--green),var(--dark-green));
  color:white;
  position:relative;
  overflow:hidden;
}
header:after{
  content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 0 48%,rgba(255,255,255,.07) 48% 52%,transparent 52%);background-size:55px 55px;opacity:.45
}
.hero{position:relative;z-index:1;padding:3.8rem 0 3rem;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center}
.brand{font-size:clamp(2.3rem,5vw,5rem);font-weight:800;letter-spacing:.03em;margin:0;color:#fff;text-shadow:0 6px 20px rgba(0,0,0,.25)}
.hero h2{font-size:clamp(1.45rem,3vw,2.5rem);margin:.3rem 0 1rem;color:#fff}
.hero p{font-size:1.08rem;color:#edf9ef;margin:0 0 1.4rem}.badge{display:inline-flex;gap:.5rem;align-items:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);padding:.5rem 1rem;border-radius:999px;color:#fff;margin-bottom:1rem}.cta-row{display:flex;gap:.8rem;flex-wrap:wrap}.btn{display:inline-block;background:var(--gold);color:#111;padding:.78rem 1.15rem;border-radius:999px;font-weight:800;box-shadow:0 12px 25px rgba(0,0,0,.18)}.btn.secondary{background:rgba(255,255,255,.15);color:white;border:1px solid rgba(255,255,255,.35)}.score-card{background:rgba(255,255,255,.96);color:var(--ink);border-radius:26px;padding:1.3rem;box-shadow:var(--shadow);border:1px solid rgba(212,175,55,.25)}.score-card h3{margin:.2rem 0 1rem;color:var(--green)}.match{display:flex;justify-content:space-between;gap:1rem;padding:.8rem;border-radius:16px;background:#f1f8f3;margin:.6rem 0;border-right:4px solid var(--gold)}nav{position:sticky;top:0;z-index:5;background:#ffffffcc;backdrop-filter:blur(14px);border-bottom:1px solid #dcebe1}nav .nav-inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 0}.logo{font-weight:900;color:var(--green);font-size:1.45rem}.links{display:flex;gap:.35rem;flex-wrap:wrap}.links a{padding:.58rem .9rem;border-radius:999px;font-weight:700;color:#23422d}.links a:hover,.links a.active{background:var(--green);color:white}main{padding:2.5rem 0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}.card{background:var(--card);border-radius:22px;padding:1.35rem;box-shadow:var(--shadow);border:1px solid #e4efe8}.card h3,.card h2{color:var(--green);margin-top:0}.section-title{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--dark-green);margin:0 0 .7rem}.lead{font-size:1.08rem;color:var(--muted);max-width:850px}.feature{display:flex;gap:1rem;align-items:flex-start}.icon{min-width:46px;height:46px;border-radius:15px;background:#e8f5ec;color:var(--green);display:grid;place-items:center;font-weight:900}.wide{grid-column:span 2}.comments{margin-top:2rem}.quote{background:#fff;border-right:5px solid var(--gold);padding:1rem 1.2rem;border-radius:18px;margin:.8rem 0;box-shadow:0 10px 30px rgba(0,0,0,.06)}.form{display:grid;gap:.8rem}.form input,.form textarea{width:100%;padding:.9rem 1rem;border-radius:14px;border:1px solid #cdded2;font:inherit;background:#fbfffc}.form button{border:0;cursor:pointer;font:inherit}.notice{background:#fff8df;border:1px solid #ead27a;color:#614d00;padding:1rem;border-radius:18px;margin:1rem 0}footer{background:#102017;color:#dceee3;padding:2rem 0;margin-top:2rem}.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}footer a{color:#fff}
@media(max-width:760px){.hero{grid-template-columns:1fr;padding:2.4rem 0}.grid{grid-template-columns:1fr}.wide{grid-column:auto}.links{width:100%;justify-content:center}.nav-inner{flex-direction:column}.footer-grid{grid-template-columns:1fr}.match{flex-direction:column}.cta-row{justify-content:flex-start}}