:root{
  --green-deep:#0b3d24;
  --green:#136b3c;
  --red:#c8102e;
  --cream:#f7f3ea;
  --ink:#101210;
  --gold:#d9a441;
  --line:#e4ddc9;
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:'Helvetica Neue', Arial, sans-serif; line-height:1.55;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.container{max-width:1080px; margin:0 auto; padding:0 6%;}

nav.site-nav{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 6%; background:var(--green-deep); color:var(--cream);
  position:sticky; top:0; z-index:50; flex-wrap:wrap; gap:12px;
  border-bottom:1px solid rgba(217,164,65,0.25);
}
.brand{display:flex; align-items:center; gap:12px; font-weight:800; font-size:1.1rem;}
.brand img{width:42px; height:42px; border-radius:50%; object-fit:cover; border:2px solid var(--cream); background:white; padding:2px;}
nav.site-nav ul{list-style:none; display:flex; gap:22px; padding:0; margin:0; flex-wrap:wrap;}
nav.site-nav ul a{
  text-decoration:none; color:var(--cream); opacity:0.9; font-size:0.8rem;
  text-transform:uppercase; letter-spacing:0.05em; font-weight:600;
  padding:6px 2px; border-bottom:2px solid transparent; transition:border-color 0.15s, opacity 0.15s;
}
nav.site-nav ul a:hover{opacity:1; border-bottom-color:var(--red);}
.nav-donate{background:var(--red); color:white; padding:10px 22px; border-radius:2px; text-decoration:none; font-weight:700; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.04em;}

/* Mobile hamburger toggle */
.nav-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:32px; height:26px; background:none; border:none; cursor:pointer; padding:0;}
.nav-toggle span{display:block; height:3px; width:100%; background:var(--cream); border-radius:2px; transition:transform 0.2s, opacity 0.2s;}
.nav-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg);}
li.nav-donate-mobile{display:none;}

.hero{
  background:linear-gradient(135deg, var(--green-deep) 0%, var(--green) 60%);
  color:var(--cream); padding:80px 6%;
}
.hero-inner{max-width:640px;}
.hero .eyebrow{color:var(--gold); font-weight:600; margin-bottom:14px; font-size:0.9rem;}
.hero h1{font-size:2.8rem; line-height:1.05; margin:0 0 20px;}
.hero p{font-size:1.08rem; opacity:0.92; max-width:480px; margin-bottom:28px;}
.btn{display:inline-block; padding:14px 28px; border-radius:2px; text-decoration:none; font-weight:700; font-size:0.95rem; border:none; cursor:pointer;}
.btn-primary{background:var(--red); color:white;}
.btn-ghost{background:transparent; border:1.5px solid rgba(247,243,234,0.5); color:var(--cream);}
.btn-dark{background:var(--ink); color:var(--cream);}
.cta-row{display:flex; gap:14px; flex-wrap:wrap;}

.warning-banner{
  background:#fff4e5; border:1px solid var(--gold); color:#5a4319;
  padding:16px 6%; font-size:0.9rem;
}

section{padding:64px 6%;}
.section-head{max-width:600px; margin-bottom:36px;}
.section-head h2{font-size:2rem; color:var(--green-deep); margin:0 0 10px;}
.section-head p{color:#4a4a44; margin:0;}

.quote-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px;}
.quote-card{background:white; border-left:4px solid var(--red); padding:26px; box-shadow:0 1px 3px rgba(0,0,0,0.06);}
.quote-card p{font-style:italic; margin:0 0 12px; font-size:1.05rem;}
.quote-card span{font-size:0.82rem; color:var(--green); font-weight:700;}

.update-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px;}
.update-card{background:white; overflow:hidden; border:1px solid var(--line);}
.update-thumb{height:150px; background:#e8e2cf; display:flex; align-items:center; justify-content:center; color:#8a8367; font-size:0.85rem;}
.update-thumb img{width:100%; height:100%; object-fit:cover;}
.update-body{padding:18px;}
.update-date{font-size:0.75rem; color:var(--red); font-weight:700; margin-bottom:6px;}
.update-body h3{margin:0 0 8px; font-size:1.05rem;}
.update-body p{margin:0; font-size:0.9rem; color:#5a5a52;}
.update-source{font-size:0.72rem; color:#9a9483; margin-top:8px;}

.gallery-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px;}
.gallery-item{background:white; border:1px solid var(--line); overflow:hidden;}
.gallery-item img, .gallery-item video{width:100%; height:200px; object-fit:cover; display:block;}
.gallery-item .video-embed{width:100%; height:200px; padding-top:0;}
.gallery-caption{padding:10px 14px; font-size:0.85rem; color:#5a5a52;}

.donate-panel{max-width:900px; background:white; border:1px solid var(--line);}
.acct-block{padding:32px;}
.acct-block h3{color:var(--green-deep); margin-top:0;}
.acct-row{display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid #f0ebdd; font-size:0.95rem;}
.acct-row .k{color:#8a8367;}
.acct-row .v{font-weight:700;}
.verify-note{margin-top:20px; font-size:0.85rem; color:#5a4319; background:#fff4e5; padding:14px 18px; border-left:3px solid var(--gold);}

.wa-fab{
  position:fixed; bottom:26px; right:26px; z-index:60;
  width:58px; height:58px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 14px rgba(0,0,0,0.25); text-decoration:none;
}
.wa-fab svg{width:28px; height:28px; fill:white;}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink); color:rgba(247,243,234,0.75); padding:50px 6% 0;}
.footer-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px; max-width:1200px; margin:0 auto; padding-bottom:36px; border-bottom:1px solid rgba(247,243,234,0.12);}
.footer-brand p{font-size:0.85rem; margin-top:10px; max-width:280px; color:rgba(247,243,234,0.55);}
.footer-logo{display:flex; align-items:center; gap:10px; font-weight:700; color:var(--cream);}
.footer-logo img{width:36px; height:36px; border-radius:4px; object-fit:cover;}
.footer-col h4{color:var(--gold); font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; margin:0 0 14px;}
.footer-col a{display:block; color:rgba(247,243,234,0.7); text-decoration:none; font-size:0.9rem; margin-bottom:10px;}
.footer-col a:hover{color:var(--cream);}
.footer-bottom{max-width:1200px; margin:0 auto; padding:20px 0; font-size:0.8rem; color:rgba(247,243,234,0.45);}
@media (max-width:720px){ .footer-grid{grid-template-columns:1fr 1fr;} }

/* ---------- Admin ---------- */
.admin-body{background:#f3f1ea; font-family:'Helvetica Neue', Arial, sans-serif;}
.admin-shell{display:flex; min-height:100vh;}
.admin-sidebar{width:220px; background:var(--green-deep); color:var(--cream); padding:24px 0; flex-shrink:0;}
.admin-sidebar .brand{padding:0 20px 24px; font-size:1.05rem;}
.admin-sidebar a{display:block; padding:12px 20px; color:rgba(247,243,234,0.85); text-decoration:none; font-size:0.92rem;}
.admin-sidebar a:hover, .admin-sidebar a.active{background:rgba(255,255,255,0.08); color:white;}
.admin-main{flex:1; padding:36px 40px; max-width:980px;}
.admin-main h1{margin-top:0; font-size:1.6rem; color:var(--green-deep);}
.card{background:white; border:1px solid var(--line); padding:24px; margin-bottom:24px;}
.form-grid{display:grid; gap:16px;}
.form-grid label{font-size:0.85rem; font-weight:600; color:#4a4a44; display:block; margin-bottom:6px;}
.form-grid input[type=text], .form-grid input[type=number], .form-grid input[type=date], .form-grid input[type=password], .form-grid textarea{
  width:100%; padding:10px 12px; border:1px solid var(--line); font-size:0.92rem; font-family:inherit;
}
.form-grid textarea{min-height:100px; resize:vertical;}
.admin-table{width:100%; border-collapse:collapse; font-size:0.9rem;}
.admin-table th, .admin-table td{text-align:left; padding:10px; border-bottom:1px solid var(--line); vertical-align:top;}
.btn-sm{padding:6px 14px; font-size:0.82rem;}
.btn-danger{background:var(--red); color:white; border:none;}
.btn-approve{background:var(--green); color:white; border:none;}
.pill{display:inline-block; padding:3px 10px; border-radius:20px; font-size:0.72rem; font-weight:700;}
.pill-yes{background:#dbe7dd; color:var(--green-deep);}
.pill-no{background:#f5e2d0; color:#8a5a1f;}
.login-shell{display:flex; align-items:center; justify-content:center; min-height:100vh; background:var(--green-deep);}
.login-box{background:white; padding:40px; width:100%; max-width:360px;}
.login-box h1{font-size:1.3rem; color:var(--green-deep);}
.error-msg{color:var(--red); font-size:0.85rem; margin-bottom:12px;}
.stat-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; margin-bottom:30px;}
.stat-card{background:white; border:1px solid var(--line); padding:20px;}
.stat-card .n{font-size:1.8rem; font-weight:800; color:var(--green-deep);}
.stat-card .l{font-size:0.82rem; color:#8a8367;}

@media(max-width:860px){
  nav.site-nav{position:relative; padding:12px 5%;}
  .nav-toggle{display:flex;}
  .nav-donate{display:none;}
  nav.site-nav ul{
    display:none; flex-direction:column; gap:0; width:100%;
    position:absolute; top:100%; left:0; right:0;
    background:var(--green-deep); padding:8px 5% 16px;
    box-shadow:0 10px 20px rgba(0,0,0,0.25); z-index:60;
  }
  nav.site-nav ul.open{display:flex;}
  nav.site-nav ul li{width:100%;}
  nav.site-nav ul a{display:block; padding:14px 4px; border-bottom:1px solid rgba(255,255,255,0.1);}
  li.nav-donate-mobile{display:block;}
  li.nav-donate-mobile a{color:var(--gold); font-weight:800;}
}

@media(max-width:800px){
  .hero h1{font-size:2rem;}
  .admin-shell{flex-direction:column;}
  .admin-sidebar{width:100%; display:flex; overflow-x:auto; padding:12px;}
  .admin-sidebar .brand{display:none;}
  .admin-main{padding:24px;}
}

@media(max-width:600px){
  .hero, .hero-slider .hero-inner{padding:56px 6%;}
  .hero h1{font-size:1.6rem; line-height:1.25;}
  .hero p, .hero-slider p{font-size:0.95rem;}
  .cta-row{flex-direction:column; align-items:stretch;}
  .cta-row .btn{text-align:center; width:100%;}
  .hero-slider{min-height:360px;}
  .section-head, .notif-section, section:not(.hero):not(.hero-slider){padding:36px 5%;}
  .section-head h2{font-size:1.35rem;}
  .footer-grid{grid-template-columns:1fr; text-align:left;}
  .footer-brand p{max-width:none;}
  .notif-grid, .gallery-grid, .social-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));}
  .notif-icon{width:76px; height:76px;}
  .admin-table{display:block; overflow-x:auto; white-space:nowrap;}
  .donation-ticker-item{font-size:0.78rem; padding:0 20px;}
  .update-filters{flex-direction:column; align-items:stretch;}
  .update-filters input[type="text"], .update-filters select{width:100%;}
}

@media(max-width:400px){
  .brand span{display:none;} /* keep just the logo mark on very narrow phones */
  .notif-grid, .gallery-grid, .social-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));}
}

/* --- Update filters, categories, pagination --- */
.update-filters{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:26px;}
.update-filters input[type="text"]{padding:10px 12px; border:1px solid var(--line); font-size:0.9rem; flex:1; min-width:180px;}
.update-filters select{padding:10px 12px; border:1px solid var(--line); font-size:0.9rem; background:white;}
.btn-ghost-dark{background:transparent; border:1.5px solid var(--line); color:var(--ink); padding:14px 20px; font-size:0.9rem;}
.update-category{display:inline-block; font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--green-deep); background:rgba(19,107,60,0.1); padding:3px 8px; border-radius:2px; margin-bottom:8px;}
.pagination{display:flex; gap:6px; flex-wrap:wrap; margin-top:30px;}
.page-link{display:inline-block; padding:8px 14px; border:1px solid var(--line); color:var(--ink); text-decoration:none; font-size:0.85rem;}
.page-link.active{background:var(--green-deep); border-color:var(--green-deep); color:white;}

/* --- Authorization / transparency page --- */
.auth-block{margin-bottom:32px; padding-bottom:28px; border-bottom:1px solid var(--line);}
.auth-block:last-child{border-bottom:none;}
.auth-block h3{color:var(--green-deep); margin:0 0 10px;}

/* --- Social media hub --- */
.social-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px;}
.social-card{display:block; background:white; border:1px solid var(--line); padding:20px; text-decoration:none; transition:border-color 0.15s;}
.social-card:hover{border-color:var(--green);}
.social-platform{font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--red); margin-bottom:6px;}
.social-label{font-size:1.05rem; color:var(--ink); font-weight:600;}

/* --- Notifications tab (matches PTI's own category-tile layout) --- */
.notif-section{padding:50px 6%; max-width:1100px; margin:0 auto;}
.notif-title{text-align:center; margin-bottom:44px;}
.notif-title h2{font-size:1.7rem; color:var(--ink); margin:0 0 12px; letter-spacing:0.02em;}
.notif-underline{display:inline-block; width:60px; height:3px; background:var(--green); border-radius:2px;}
.notif-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:32px 24px;}
.notif-card{display:flex; flex-direction:column; align-items:center; text-align:center; text-decoration:none; gap:12px;}
.notif-icon{width:96px; height:96px; border-radius:50%; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.12); background:white;}
.notif-icon img{width:100%; height:100%; object-fit:cover;}
.notif-icon-placeholder{width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:var(--green-deep); color:var(--gold); font-size:2rem; font-weight:800;}
.notif-name{font-size:0.85rem; color:var(--green); font-weight:600;}
.notif-count{color:#999; font-weight:400;}
.notif-card:hover .notif-name{color:var(--red);}

/* --- Homepage hero slider --- */
.hero-slider{position:relative; min-height:440px; overflow:hidden;}
.hero-slide{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 0.8s ease;
  display:flex; align-items:center;
}
.hero-slide.active{opacity:1; z-index:1;}
.hero-slide:not(.active){pointer-events:none;}
.hero-slide-overlay{position:absolute; inset:0; background:linear-gradient(120deg, rgba(11,61,36,0.88) 0%, rgba(11,61,36,0.5) 55%, rgba(11,61,36,0.25) 100%);}
.hero-slider .hero-inner{position:relative; z-index:1; max-width:640px; padding:80px 6%; color:var(--cream);}
.hero-slider .eyebrow{color:var(--gold); font-weight:600; margin-bottom:14px; font-size:0.9rem;}
.hero-dots{position:absolute; bottom:20px; left:0; right:0; display:flex; justify-content:center; gap:8px; z-index:2;}
.hero-dot{width:10px; height:10px; border-radius:50%; border:1.5px solid var(--cream); background:transparent; cursor:pointer; padding:0;}
.hero-dot.active{background:var(--gold); border-color:var(--gold);}

/* --- Recent donations ticker --- */
.donation-ticker{background:var(--gold); overflow:hidden; white-space:nowrap; border-bottom:1px solid rgba(0,0,0,0.08);}
.donation-ticker-track{display:inline-block; padding:10px 0; animation:ticker-scroll 30s linear infinite;}
.donation-ticker-item{display:inline-block; padding:0 32px; font-size:0.85rem; color:var(--ink); font-weight:600;}
.donation-ticker-item strong{color:var(--green-deep);}
@keyframes ticker-scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* --- YouTube embeds in gallery --- */
.video-embed{position:relative; width:100%; padding-top:56.25%; height:0; background:#000;}
.video-embed iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0;}