/*
Theme Name: Hope Welfare Foundation
Theme URI: https://hopewelfarepk.org
Author: Hope Welfare Foundation
Description: Custom WordPress theme for Hope Welfare Foundation - education, health, and food services NGO.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: hope-welfare
*/

:root{
  --bg:#F6FAF3;
  --paper:#EEF5E9;
  --ink:#152016;
  --green:#1E8449;
  --green-deep:#123D22;
  --sky:#6FB8DE;
  --gold:#E4A73B;
  --line:#D7E2CE;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--ink);font-family:'Work Sans',sans-serif;line-height:1.55;}
.urdu{font-family:'Noto Nastaliq Urdu',serif;direction:rtl;}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:600;letter-spacing:-0.01em;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px;}
img{max-width:100%;display:block;}

nav{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;gap:12px;font-family:'Fraunces',serif;font-weight:600;font-size:1.15rem;}
.brand img{width:46px;height:46px;border-radius:50%;}
.navlinks{display:flex;gap:30px;font-size:.92rem;}
.navlinks a{opacity:.75;transition:opacity .2s;}
.navlinks a:hover{opacity:1;color:var(--green);}
.nav-cta{background:var(--green);color:#fff;padding:10px 20px;border-radius:3px;font-size:.88rem;font-weight:500;}

.pagehead{padding:64px 0 44px;border-bottom:1px solid var(--line);}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:16px;}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--green);}
.pagehead h1{font-size:2.6rem;max-width:640px;}
.pagehead p{max-width:520px;color:#41503f;margin-top:16px;font-size:1.02rem;}

.hero{padding:80px 0 60px;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;}
.hero h1{font-size:3rem;line-height:1.1;margin-bottom:18px;}
.hero h1 em{font-style:italic;color:var(--gold);}
.hero-urdu{font-size:1.5rem;color:var(--green);margin-bottom:20px;}
.hero p.desc{max-width:460px;color:#41503f;margin-bottom:30px;}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;}
.btn{padding:14px 26px;border-radius:3px;font-weight:500;font-size:.94rem;display:inline-block;}
.btn-primary{background:var(--green);color:#fff;}
.btn-outline{border:1px solid var(--ink);}

.hero-visual{aspect-ratio:1/1.02;border-radius:6px;position:relative;overflow:hidden;background:linear-gradient(165deg,var(--sky) 0%,var(--green-deep) 100%);display:flex;align-items:flex-end;padding:26px;}
.hero-visual::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle, rgba(255,255,255,.18) 1.5px, transparent 1.5px);background-size:22px 22px;}
.hero-visual .stamp{position:relative;z-index:1;color:#fff;}
.hero-visual .stamp .num{font-family:'Fraunces',serif;font-size:2.5rem;}
.hero-visual .stamp .lbl{font-size:.8rem;opacity:.85;text-transform:uppercase;letter-spacing:.08em;}
.hero-visual .badge{position:absolute;top:22px;right:22px;width:78px;height:78px;border-radius:50%;z-index:1;box-shadow:0 4px 18px rgba(0,0,0,.25);}

.section{padding:66px 0;border-top:1px solid var(--line);}
.section-head{max-width:540px;margin-bottom:44px;}
.section-head h2{font-size:2rem;}

.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.pillar{padding:36px 28px;border-right:1px solid var(--line);background:var(--paper);}
.pillar:last-child{border-right:none;}
.pillar .mark{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:20px;font-family:'Fraunces',serif;font-size:1.05rem;color:#fff;}
.pillar:nth-child(1) .mark{background:var(--gold);}
.pillar:nth-child(2) .mark{background:var(--sky);color:var(--green-deep);}
.pillar:nth-child(3) .mark{background:var(--green);}
.pillar h3{font-size:1.28rem;margin-bottom:10px;}
.pillar p{font-size:.92rem;color:#41503f;margin-bottom:14px;}
.pillar .tag{font-size:.78rem;color:#6b7a67;letter-spacing:.04em;}

.ledger{background:var(--green-deep);color:#fff;}
.ledger .section-head{color:#fff;}
.ledger .eyebrow{color:var(--gold);}
.ledger .eyebrow::before{background:var(--gold);}
.ledger-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:28px;}
.ledger-item{flex:1;min-width:170px;border:1px solid rgba(255,255,255,.25);border-radius:50%;aspect-ratio:1/1;max-width:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-3deg);}
.ledger-item:nth-child(even){transform:rotate(2deg);}
.ledger-item .num{font-family:'Fraunces',serif;font-size:2rem;}
.ledger-item .lbl{font-size:.7rem;text-align:center;padding:0 10px;opacity:.85;text-transform:uppercase;letter-spacing:.05em;margin-top:4px;}
.ledger-note{margin-top:30px;font-size:.8rem;opacity:.65;}

.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center;}
.about-img{aspect-ratio:4/5;border-radius:6px;background:linear-gradient(155deg,var(--sky),var(--paper));}
.about p{color:#41503f;margin-bottom:16px;max-width:520px;}

.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.team-card{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:24px;}
.team-photo{aspect-ratio:1/1;border-radius:50%;width:72px;background:linear-gradient(155deg,var(--gold),var(--sky));margin-bottom:16px;}
.team-card h4{font-family:'Fraunces',serif;font-size:1.05rem;margin-bottom:4px;}
.team-card .role{font-size:.8rem;color:var(--green);letter-spacing:.03em;}

.service-detail{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center;padding:56px 0;border-bottom:1px solid var(--line);}
.service-detail:nth-child(even) .sd-img{order:2;}
.sd-img{aspect-ratio:5/4;border-radius:6px;}
.service-detail h3{font-size:1.7rem;margin-bottom:14px;}
.service-detail p{color:#41503f;margin-bottom:14px;max-width:480px;}
.stat-row{display:flex;gap:26px;margin-top:20px;}
.stat-row .num{font-family:'Fraunces',serif;font-size:1.6rem;color:var(--green);}
.stat-row .lbl{font-size:.76rem;color:#6b7a67;text-transform:uppercase;letter-spacing:.04em;}

.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.gallery-item{aspect-ratio:1/1;border-radius:5px;}

.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
.contact-card{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:32px;}
.contact-card h4{font-family:'Fraunces',serif;font-size:1.15rem;margin-bottom:6px;}
.contact-card p{color:#41503f;font-size:.92rem;margin-bottom:20px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:.8rem;margin-bottom:6px;color:#41503f;}
.field input,.field textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:3px;background:#fff;font-family:inherit;font-size:.92rem;}
.info-item{display:flex;gap:14px;margin-bottom:22px;}
.info-item .ic{width:38px;height:38px;border-radius:50%;background:var(--green);flex-shrink:0;}
.info-item h5{font-size:.95rem;margin-bottom:2px;}
.info-item p{font-size:.86rem;color:#41503f;}

.cta-banner{margin:0 auto 70px;max-width:1100px;padding:52px 46px;background:var(--gold);color:#221a06;border-radius:6px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:22px;}
.cta-banner h3{font-size:1.6rem;max-width:420px;}
.cta-banner .btn-primary{background:var(--green-deep);color:#fff;}

footer{border-top:1px solid var(--line);padding:44px 0 28px;font-size:.88rem;color:#4a5747;}
.footer-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;}
.footer-cols{display:flex;gap:56px;flex-wrap:wrap;}
.footer-cols h4{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink);margin-bottom:12px;}
.footer-cols a{display:block;margin-bottom:8px;opacity:.85;}
.footer-bottom{margin-top:34px;padding-top:18px;border-top:1px solid var(--line);opacity:.65;}

@media(max-width:760px){
  .hero-grid,.about-grid,.service-detail,.contact-grid{grid-template-columns:1fr!important;}
  .pillar-grid,.team-grid,.gallery-grid{grid-template-columns:1fr;}
  .pillar{border-right:none;border-bottom:1px solid var(--line);}
  .hero h1,.pagehead h1{font-size:2.1rem;}
  .navlinks{display:none;}
  .service-detail .sd-img{order:0!important;}
}