/* ===========================================================
   Inner page styles — page-hero, pagination, split, listings,
   single-article, project detail, media single, contact form.
   Loaded on all non-front-page requests (see inc/enqueue.php).
   =========================================================== */

/* ---- Page hero ---- */
.page-hero{
	position:relative;
	min-height:300px;
	display:flex;
	align-items:center;
	background-size:cover;
	background-position:center;
	background-color:var(--primary-green);
	margin-top:0;
}
.page-hero-overlay{
	position:absolute;
	inset:0;
	background:var(--gradient-page-hero-overlay);
}
.page-hero-inner{
	position:relative;
	z-index:1;
	text-align:center;
	padding:80px 24px;
}
.page-hero-inner .eyebrow{
	display:inline-block;
	background:rgba(255,255,255,0.15);
	color:var(--light-gold);
}
.page-hero-inner h1{
	font-family:var(--font-display);
	color:#fff;
	font-size:clamp(28px,4vw,44px);
	font-weight:800;
	line-height:1.3;
	margin-top:14px;
}
.page-hero-text{
	color:rgba(255,255,255,0.88);
	font-size:clamp(15px,1.5vw,18px);
	max-width:640px;
	margin:14px auto 0;
}

/* ---- CTA band ---- */
.cta-band-section{padding:80px 0;}
.cta-band{
	background:var(--gradient-green-band);
	border-radius:var(--radius-lg);
	padding:48px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:32px;
	flex-wrap:wrap;
}
.cta-band-text h2{color:#fff; font-size:clamp(22px,2.5vw,30px); font-family:var(--font-display); font-weight:800;}
.cta-band-text p{color:rgba(255,255,255,0.85); margin-top:8px; max-width:480px;}
.cta-band-actions{display:flex; gap:14px; flex-wrap:wrap;}

/* ---- Pagination ---- */
.pagination{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:8px;
	padding:60px 0 20px;
	flex-wrap:wrap;
}
.pagination .page-numbers{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:44px;
	height:44px;
	padding:0 12px;
	border-radius:12px;
	border:1.5px solid var(--border);
	background:var(--card);
	color:var(--text);
	font-weight:600;
	font-size:15px;
	transition:all .2s ease;
}
.pagination .page-numbers:hover{
	border-color:var(--primary-green);
	color:var(--primary-green);
}
.pagination .page-numbers.current{
	background:var(--primary-green);
	border-color:var(--primary-green);
	color:#fff;
}
.pagination .page-numbers.dots{border:none; background:none;}

/* ---- Split layout (about + contact) ---- */
.split{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:60px;
	align-items:center;
}
.split-img{
	border-radius:var(--radius-card);
	overflow:hidden;
	box-shadow:var(--shadow-soft);
}
.split-img img{width:100%; height:auto; display:block;}
.split-content h2{font-family:var(--font-display); font-size:clamp(24px,3vw,34px); margin-bottom:18px;}
.split-content p{color:var(--text-secondary); margin-bottom:14px; line-height:1.8;}

/* ---- Values grid (about page) ---- */
.values-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}
.value-card{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-card);
	padding:36px 28px;
	text-align:center;
	transition:transform .3s ease, box-shadow .3s ease;
}
.value-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-soft);}
.value-card .value-icon{
	width:72px;
	height:72px;
	margin:0 auto 18px;
	border-radius:50%;
	background:var(--gradient-icon-bg);
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--primary-green);
}
.value-card .value-icon svg{width:32px; height:32px;}
.value-card h3{font-family:var(--font-display); font-size:18px; margin-bottom:8px;}
.value-card p{color:var(--text-secondary); font-size:14px;}

/* ---- News listing ---- */
.news-listing{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}
.news-card{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-card);
	overflow:hidden;
	transition:transform .3s ease, box-shadow .3s ease;
}
.news-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-soft);}
.news-card-img{aspect-ratio:3/2; overflow:hidden;}
.news-card-img img{width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
.news-card:hover .news-card-img img{transform:scale(1.05);}
.news-card-body{padding:22px;}
.news-card-date{font-size:13px; color:var(--gold); font-weight:600; margin-bottom:8px;}
.news-card h3{font-family:var(--font-display); font-size:17px; margin-bottom:8px; line-height:1.4;}
.news-card p{color:var(--text-secondary); font-size:14px; line-height:1.6;}

/* ---- Single article (news single) ---- */
.single-article{padding:80px 0;}
.single-article-body{
	max-width:780px;
	margin:0 auto;
}
.single-article-body h2,
.single-article-body h3{font-family:var(--font-display); margin:28px 0 14px; line-height:1.4;}
.single-article-body p{margin-bottom:18px; line-height:1.9; color:var(--text);}
.single-article-body img{border-radius:var(--radius-icon); margin:24px 0;}
.single-meta{
	display:flex;
	align-items:center;
	gap:16px;
	flex-wrap:wrap;
	padding:16px 0;
	border-bottom:1px solid var(--border);
	margin-bottom:30px;
}
.single-meta .meta-date{font-size:14px; color:var(--gold); font-weight:600;}

/* ---- Back link (RTL — arrow points right) ---- */
.back-link{
	display:inline-flex;
	align-items:center;
	gap:8px;
	color:var(--primary-green);
	font-weight:600;
	font-size:15px;
	padding:14px 0;
	transition:gap .2s ease;
}
.back-link:hover{gap:12px;}
.back-link svg{width:18px; height:18px; transform:scaleX(-1);}

/* ---- Related grid (shared by singles) ---- */
.related-section{padding:60px 0 80px; background:var(--bg);}
.related-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:24px;
}
.related-card{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-card-sm);
	overflow:hidden;
	transition:transform .3s ease, box-shadow .3s ease;
}
.related-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-card);}
.related-card img{aspect-ratio:3/2; object-fit:cover; width:100%;}
.related-card-body{padding:18px;}
.related-card h4{font-size:15px; font-family:var(--font-display); line-height:1.4;}

/* ---- Project detail (single-project) ---- */
.project-detail{padding:80px 0;}
.project-detail-header{
	display:grid;
	grid-template-columns:1.4fr 1fr;
	gap:48px;
	align-items:start;
	margin-bottom:48px;
}
.project-detail-image{
	border-radius:var(--radius-card);
	overflow:hidden;
	box-shadow:var(--shadow-soft);
}
.project-detail-image img{width:100%; display:block;}
.project-progress-card{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-card);
	padding:36px;
}
.project-progress-card .tag{
	display:inline-block;
	padding:4px 14px;
	border-radius:var(--radius-pill);
	font-size:13px;
	font-weight:600;
	margin-bottom:18px;
}
.tag-urgent{background:rgba(201,154,66,0.15); color:var(--gold);}
.tag-edu{background:rgba(30,138,98,0.12); color:var(--secondary-green);}
.tag-housing{background:rgba(15,92,74,0.12); color:var(--primary-green);}
.project-progress-amount{
	font-family:var(--font-display);
	font-size:36px;
	font-weight:800;
	color:var(--primary-green);
}
.project-progress-goal{color:var(--text-secondary); font-size:15px; margin-bottom:20px;}
.project-progress-bar-large{
	height:14px;
	background:var(--border);
	border-radius:var(--radius-pill);
	overflow:hidden;
	margin-bottom:20px;
}
.project-progress-bar-large .bar-fill{
	height:100%;
	background:var(--gradient-progress);
	border-radius:var(--radius-pill);
	transition:width 1s ease;
}
.project-progress-stats{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
	padding-top:20px;
	border-top:1px solid var(--border);
}
.project-progress-stats .stat-num{font-family:var(--font-display); font-size:24px; font-weight:700; color:var(--primary-green);}
.project-progress-stats .stat-lbl{font-size:13px; color:var(--text-secondary);}
.project-detail-body{max-width:780px; line-height:1.9; color:var(--text);}
.project-detail-body p{margin-bottom:18px;}

/* ---- Program detail (single-program) ---- */
.program-detail{padding:80px 0;}
.program-detail-header{
	text-align:center;
	max-width:640px;
	margin:0 auto 48px;
}
.program-detail-icon{
	width:96px;
	height:96px;
	margin:0 auto 24px;
	border-radius:var(--radius-card);
	background:var(--gradient-icon-bg);
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--primary-green);
}
.program-detail-icon svg{width:48px; height:48px;}
.program-detail-header h1{font-family:var(--font-display); font-size:clamp(26px,3vw,36px); margin-bottom:12px;}
.program-detail-header .program-short{color:var(--text-secondary); font-size:17px;}
.program-detail-body{max-width:780px; margin:0 auto; line-height:1.9;}
.program-detail-body p{margin-bottom:18px;}

/* ---- Media single ---- */
.media-single{padding:80px 0;}
.media-single-wrap{max-width:900px; margin:0 auto; text-align:center;}
.media-single-wrap img{
	border-radius:var(--radius-lg);
	width:100%;
	margin-bottom:20px;
}
.media-single-wrap .media-caption{color:var(--text-secondary); font-size:15px;}

/* ---- Contact page ---- */
.contact-split{
	display:grid;
	grid-template-columns:1fr 1.2fr;
	gap:48px;
	padding:80px 0;
}
.contact-info-card{
	background:var(--gradient-green-band);
	border-radius:var(--radius-card);
	padding:40px;
	color:#fff;
}
.contact-info-card h3{font-family:var(--font-display); font-size:22px; margin-bottom:24px;}
.contact-info-list{display:flex; flex-direction:column; gap:20px;}
.contact-info-list li{display:flex; align-items:flex-start; gap:14px;}
.contact-info-list .ci-icon{
	width:44px; height:44px;
	border-radius:12px;
	background:rgba(255,255,255,0.12);
	display:flex; align-items:center; justify-content:center;
	flex-shrink:0;
}
.contact-info-list .ci-icon svg{width:22px; height:22px;}
.contact-info-list .ci-label{font-size:13px; opacity:0.7;}
.contact-info-list .ci-value{font-size:16px; font-weight:600;}

.contact-form-card{
	background:var(--card);
	border:1px solid var(--border);
	border-radius:var(--radius-card);
	padding:40px;
}
.contact-form .form-row{margin-bottom:20px;}
.contact-form .form-grid2{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.contact-form label{display:block; font-size:14px; font-weight:600; margin-bottom:6px;}
.contact-form input,
.contact-form textarea,
.contact-form select{
	width:100%;
	padding:12px 16px;
	border:1.5px solid var(--border);
	border-radius:12px;
	font-family:var(--font-body);
	font-size:15px;
	background:var(--bg);
	transition:border-color .2s ease;
}
.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus{outline:none; border-color:var(--primary-green);}
.contact-form textarea{resize:vertical; min-height:120px;}

/* ---- Success notice ---- */
.form-success-notice{
	background:rgba(30,138,98,0.1);
	border:1px solid rgba(30,138,98,0.25);
	border-radius:var(--radius-icon);
	padding:20px 24px;
	margin-bottom:24px;
	color:var(--primary-green);
	font-weight:600;
}

/* ---- Events page ---- */
.events-cols{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:60px;
}
.events-col h2{font-family:var(--font-display); font-size:22px; margin-bottom:24px; padding-bottom:12px; border-bottom:2px solid var(--border);}

/* ---- Generic content page ---- */
.page-content{padding:80px 0;}
.page-content-body{max-width:780px; margin:0 auto; line-height:1.9;}
.page-content-body p{margin-bottom:18px;}

/* ---- Responsive ---- */
@media (max-width:1080px){
	.news-listing{grid-template-columns:repeat(2,1fr);}
	.related-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
	.split{grid-template-columns:1fr; gap:32px;}
	.values-grid{grid-template-columns:1fr;}
	.news-listing{grid-template-columns:1fr;}
	.related-grid{grid-template-columns:1fr;}
	.project-detail-header{grid-template-columns:1fr;}
	.contact-split{grid-template-columns:1fr;}
	.events-cols{grid-template-columns:1fr; gap:40px;}
	.cta-band{flex-direction:column; text-align:center; padding:36px;}
}
@media (max-width:640px){
	.page-hero{min-height:220px;}
	.page-hero-inner{padding:50px 24px;}
	.cta-band-actions{flex-direction:column; width:100%;}
	.cta-band-actions .btn{width:100%;}
	.contact-form .form-grid2{grid-template-columns:1fr;}
}
@media (max-width:560px){
	.news-listing{grid-template-columns:1fr;}
	.project-progress-stats{grid-template-columns:1fr;}
}
