
body{
font-family:'Poppins',sans-serif;
}

/* ---------------- TOPBAR ---------------- */

.topbar{
background:#f8fafc;
font-size:14px;
padding:6px 0;
border-bottom:1px solid rgba(0,0,0,0.05);
}

.topbar-left i{
color:#16a34a;
}

.topbar-right a{
display:inline-flex;
align-items:center;
justify-content:center;
width:32px;
height:32px;
border-radius:50%;
background:#f1f5f9;
color:#374151;
margin-left:8px;
text-decoration:none;
font-size:16px;
transition:0.3s;
}

.topbar-right a:hover{
background:#16a34a;
color:#fff;
}

/* ---------------- NAVBAR ---------------- */

.navbar{
background:#ffffff;
border-bottom:1px solid rgba(0,0,0,0.06);
}

.navbar-brand img{
height:65px;
}

.site-brand h2{
font-size:22px;
font-weight:700;
color:#1f2937;
margin:0;
}

.site-brand span{
font-size:13px;
color:#ef4444;
}

.navbar-nav .nav-link{
font-size:15px;
font-weight:600;
color:#374151 !important;
padding:10px 14px !important;
border-radius:6px;
transition:0.25s;
}

.navbar-nav .nav-link:hover{
background:#f3f4f6;
color:#16a34a !important;
}

.navbar-nav .nav-link.active{
color:#16a34a !important;
}

.dropdown-menu{
border:none;
border-radius:10px;
padding:8px;
box-shadow:0 15px 40px rgba(0,0,0,0.12);
min-width:220px;
}

.dropdown-item{
padding:10px 14px;
border-radius:6px;
font-size:14px;
}

.dropdown-item:hover{
background:#f3f4f6;
color:#16a34a;
}

.donate-btn{
background:#16a34a;
color:#fff !important;
padding:8px 16px !important;
border-radius:30px;
font-weight:600;
}

.donate-btn:hover{
background:#15803d;
}

/* ---------------- HERO SLIDER ---------------- */

.carousel-item img{
height:600px;
object-fit:cover;
}

.carousel-caption{
bottom:35%;
}

.carousel-caption h1{
font-size:48px;
}

.carousel-caption p{
font-size:20px;
}

/* ---------------- WELCOME SECTION ---------------- */

.welcome-section{
background:linear-gradient(135deg,#0f172a,#14532d);
color:white;
}
.section-title{
font-size:30px;
font-weight:700;
line-height:1.3;
margin-bottom:15px;
}

.section-title span{
color:#22c55e;
}

.welcome-text{
color:#cfd6de;
font-size:15px;
margin-bottom:20px;
}

.welcome-image{
border-radius:12px;
overflow:hidden;
box-shadow:0 15px 35px rgba(0,0,0,0.4);
}

.welcome-image img{
width:100%;
transition:0.4s;
}

.welcome-image img:hover{
transform:scale(1.05);
}

/* ---------------- FEATURE CARDS ---------------- */

.feature-card{
background:#1e293b;
padding:25px;
border-radius:12px;
transition:0.3s;
height:100%;
border:1px solid rgba(255,255,255,0.08);
}

.feature-card:hover{
transform:translateY(-6px);
box-shadow:0 15px 40px rgba(34,197,94,0.35);
border-color:#22c55e;
}

.feature-icon{
font-size:28px;
color:#22c55e;
}

.feature-card a{
color:#22c55e;
font-weight:500;
text-decoration:none;
}

.feature-card a:hover{
color:#4ade80;
}
.feature-card p{
font-size:14px;
color:#d3d3d3;
}

/* ---------------- CARDS ---------------- */

.card-shadow{
border:none;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
transition:0.3s;
}

.card-shadow:hover{
transform:translateY(-5px);
}

.card{
border-radius:8px;
transition:0.3s;
}

.card:hover{
transform:translateY(-5px);
box-shadow:0 10px 30px rgba(0,0,0,0.25);
}

/* ---------------- WORK SECTION ---------------- */

.work-card{
padding:30px;
color:white;
text-align:center;
border-radius:6px;
}

.work-card img{
width:60px;
margin-bottom:15px;
}

.bg-blue{background:#2c7be5;}
.bg-teal{background:#20c997;}
.bg-red{background:#dc3545;}
.bg-purple{background:#6f42c1;}
.bg-orange{background:#fd7e14;}

/* ---------------- CTA ---------------- */

.cta{
background:#2c7be5;
color:white;
padding:40px 0;
text-align:center;
font-size:24px;
}

/* ---------------- MOBILE ---------------- */

@media (max-width:768px){

.site-brand h2{
font-size:16px;
}

.site-brand span{
font-size:11px;
}

.navbar-brand img{
height:40px;
}

.navbar-collapse{
background:#fff;
padding:10px;
margin-top:10px;
border-radius:10px;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.carousel-item img{
height:420px;
}

.carousel-caption h1{
font-size:28px;
}

}

/* Desktop hover dropdown */

@media (min-width:992px){

.navbar .dropdown:hover .dropdown-menu{
display:block;
margin-top:0;
}

}

/* Brand Area */

.brand-area{
gap:14px;
}

.brand-logo{
height:60px;
border-radius:4px;
}

/* Title */

.brand-text h2{
font-size:28px;
font-weight:700;
color:#1f2937;
margin:0;
letter-spacing:0.5px;
}

/* Tagline */

.brand-text p{
font-size:14px;
color:#ef4444;
margin:2px 0 0;
font-weight:500;
}

/* Add brand underline */

.brand-text p::after{
content:"";
display:block;
width:80px;
height:3px;
background:linear-gradient(90deg,#f97316,#16a34a);
margin-top:6px;
border-radius:2px;
}

/* Vision Mission Section */

.vm-section{
background:#f8fafc;
}

.vm-card{
background:white;
padding:30px;
border-radius:12px;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
transition:0.3s;
height:100%;
}

.vm-card:hover{
transform:translateY(-6px);
box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

.vm-card h4{
font-weight:700;
margin-top:15px;
margin-bottom:10px;
}

.vm-card p{
font-size:14px;
color:#555;
}

/* Icons */

.vm-icon{
width:60px;
height:60px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
color:white;
font-size:24px;
}

/* Colors */

.bg-orange{background:#f97316;}
.bg-green{background:#16a34a;}
.bg-blue{background:#2563eb;}

/* Read more */

.read-btn{
display:inline-block;
margin-top:10px;
color:#16a34a;
font-weight:600;
text-decoration:none;
}

.read-btn:hover{
text-decoration:underline;
}

/* Projects Section */

.projects-section{
background:#f8fafc;
}

.section-desc{
max-width:700px;
margin:auto;
color:#555;
}

/* Project Card */

.project-card{
position:relative;
overflow:hidden;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

.project-card img{
width:100%;
height:260px;
object-fit:cover;
transition:0.5s;
}

/* Overlay */

.project-overlay{
position:absolute;
bottom:0;
left:0;
width:100%;
height:100%;
background:linear-gradient(to top,rgba(0,0,0,0.7),transparent);
display:flex;
flex-direction:column;
justify-content:flex-end;
align-items:center;
padding:20px;
text-align:center;
opacity:0;
transition:0.4s;
}

.project-overlay h5{
color:white;
font-weight:600;
margin-bottom:10px;
}s

/* Button */

.project-btn{
background:#16a34a;
color:white;
padding:6px 16px;
border-radius:20px;
text-decoration:none;
font-size:14px;
}

.project-btn:hover{
background:#15803d;
}

/* Hover Effects */

.project-card:hover img{
transform:scale(1.1);
}

.project-card:hover .project-overlay{
opacity:1;
}

/* Show All Projects Button */

.projects-btn{
display:inline-flex;
align-items:center;
gap:8px;
background:linear-gradient(135deg,#16a34a,#22c55e);
color:white;
padding:12px 28px;
border-radius:30px;
font-weight:600;
text-decoration:none;
box-shadow:0 10px 25px rgba(0,0,0,0.15);
transition:0.3s;
}

.projects-btn i{
font-size:16px;
transition:0.3s;
}

.projects-btn:hover{
transform:translateY(-3px);
box-shadow:0 15px 35px rgba(0,0,0,0.25);
background:linear-gradient(135deg,#15803d,#16a34a);
color:white;
}

.projects-btn:hover i{
transform:translateX(5px);
}
.project-btn{
display:inline-flex;
align-items:center;
gap:8px;
background:#16a34a;
color:#fff;
padding:8px 18px;
border-radius:25px;
font-size:14px;
font-weight:600;
text-decoration:none;
box-shadow:0 6px 15px rgba(0,0,0,0.2);
transition:0.3s;
}

.project-btn i{
transition:0.3s;
}

.project-btn:hover{
background:#15803d;
transform:translateY(-2px);
box-shadow:0 10px 25px rgba(0,0,0,0.3);
color:#fff;
}

.project-btn:hover i{
transform:translateX(5px);
}

.work-box{
background:#ffffff;
padding:35px 20px;
text-align:center;
border-radius:14px;
box-shadow:0 10px 30px rgba(0,0,0,0.08);
transition:0.35s;
height:100%;
}

.work-icon{
width:70px;
height:70px;
margin:auto;
border-radius:50%;
background:linear-gradient(135deg,#16a34a,#22c55e);
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:28px;
margin-bottom:15px;
}

.work-box h5{
font-size:16px;
font-weight:600;
color:#1f2937;
}

.work-box:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,0.15);
}

.cta-section{
background:linear-gradient(135deg,#15803d,#22c55e);
padding:70px 0;
color:white;
text-align:center;
}

.cta-section h2{
font-size:32px;
font-weight:700;
margin-bottom:10px;
}

.cta-section p{
opacity:0.9;
margin-bottom:25px;
}

.cta-btn{
background:white;
color:#15803d;
padding:12px 28px;
border-radius:30px;
font-weight:600;
text-decoration:none;
transition:0.3s;
}

.cta-btn:hover{
background:#14532d;
color:white;
transform:translateY(-3px);
}


.site-footer{
background:#0f172a;
color:#cbd5e1;
padding:60px 0 30px;
}

.footer-title{
color:white;
font-weight:600;
margin-bottom:20px;
}

.footer-links{
list-style:none;
padding:0;
}

.footer-links li{
margin-bottom:8px;
}

.footer-links a{
color:#cbd5e1;
text-decoration:none;
transition:0.3s;
}

.footer-links a:hover{
color:#22c55e;
}

.footer-social a{
display:inline-flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
border-radius:50%;
background:#1e293b;
color:white;
margin-right:8px;
text-decoration:none;
transition:0.3s;
}

.footer-social a:hover{
background:#22c55e;
transform:translateY(-3px);
}

.footer-divider{
border-color:#1e293b;
margin:40px 0 20px;
}

.footer-bottom{
font-size:14px;
opacity:0.8;
}

/* NGO Brand Title */

.site-brand h2{
font-size:26px;
font-weight:700;
margin:0;
color:#14532d;   /* dark green */
letter-spacing:0.3px;
}

/* Tagline */

.site-brand span{
font-size:14px;
color:#16a34a;   /* main green */
font-weight:500;
position:relative;
display:inline-block;
padding-bottom:6px;
}

/* Green underline accent */

.site-brand span::after{
content:"";
position:absolute;
left:0;
bottom:0;
width:80px;
height:3px;
background:#22c55e;
border-radius:3px;
}

.hero-btn{
display:inline-block;
background:#16a34a;
color:#fff !important;
padding:12px 28px;
border-radius:30px;
font-size:16px;
font-weight:600;
text-decoration:none;
box-shadow:0 6px 20px rgba(0,0,0,0.25);
transition:all .3s ease;
}

.hero-btn:hover{
background:#15803d;
color:#fff !important;
transform:translateY(-3px);
box-shadow:0 12px 30px rgba(0,0,0,0.35);
}

.hero-btn i{
margin-left:6px;
transition:0.3s;
}

.hero-btn:hover i{
transform:translateX(5px);
}

.navbar-nav{
gap:2px;
margin-left:20px;
}

.navbar-nav .nav-link{
white-space: nowrap;
font-weight:600;
font-size:14px;
}

/* Section Titles */
.section-title{
color:#16a34a;
font-weight:700;
margin-bottom:15px;
border-left:5px solid #16a34a;
padding-left:12px;
}

/* Paragraph Styling */
.container p{
font-family:Poppins, sans-serif;
font-size:15px;
line-height:1.8;
color:#444;
}

/* Table Styling */
.table{
background:#fff;
border-radius:8px;
overflow:hidden;
box-shadow:0 3px 12px rgba(0,0,0,0.08);
}

.table td{
padding:12px 15px;
}

/* Table Section Headers */
.table-secondary{
background:#16a34a !important;
color:#fff;
font-weight:600;
}

/* Alternate row color */
.table tr:nth-child(even){
background:#f8fafc;
}

/* Section spacing */
.container > div{
margin-bottom:45px;
}

.about-banner{
position:relative;
background-size:cover;
background-position:center;
}

.about-banner::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.55);
}

.about-banner .container{
position:relative;
z-index:2;
color:white;
}

.about-banner h1{
color:#fff;
font-weight:700;
}

.about-banner p{
color:#e5e5e5;
}
.info-card{
background:#ffffff;
padding:25px;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
text-align:center;
transition:0.3s;
border-top:4px solid #16a34a;
}

.info-card:hover{
transform:translateY(-5px);
box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

.info-card i{
font-size:35px;
color:#16a34a;
margin-bottom:10px;
}

.info-card h5{
font-weight:600;
margin-bottom:10px;
}

.info-card p{
font-size:14px;
color:#555;
}

.inner-page-cover {
    height: 420px;
    min-height: 420px;
    display: flex;
    align-items: center;
}

.inner-page-cover .container {
    z-index: 2;
}

.inner-page-cover.overlay:before {
    content: "";
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: rgba(0,0,0,0.55); /* dark overlay for text visibility */
}

.inner-page-cover h1 {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
}

.inner-page-cover .lead {
    font-size: 18px;
    color: #e5e5e5;
}

/* PROJECT CARDS */

.project-card{
position:relative;
display:block;
overflow:hidden;
border-radius:12px;
}

.project-card img{
width:100%;
height:260px;
object-fit:cover;
transition:transform .4s;
}

.project-card:hover img{
transform:scale(1.08);
}

.project-overlay{
position:absolute;
bottom:0;
left:0;
width:100%;
padding:20px;
background:linear-gradient(to top, rgba(0,0,0,0.85), transparent);
color:#fff;
}

.project-overlay h4{
font-size:20px;
font-weight:600;
margin-bottom:4px;
}

.project-overlay p{
font-size:14px;
color:#d1d5db;
margin:0;
}

.gallery-img img{
width:100%;
height:220px;
object-fit:cover;
border-radius:8px;
transition:0.3s;
}

.gallery-img img:hover{
transform:scale(1.05);
box-shadow:0 10px 20px rgba(0,0,0,0.2);
}

.video-card{
border-radius:10px;
overflow:hidden;
box-shadow:0 8px 20px rgba(0,0,0,0.1);
transition:0.3s;
}

.video-card:hover{
transform:translateY(-5px);
box-shadow:0 15px 30px rgba(0,0,0,0.2);
}

.media-img{
width:100%;
height:320px;
object-fit:cover;
border-radius:8px;
transition:0.3s;
box-shadow:0 6px 18px rgba(0,0,0,0.1);
}

.media-img:hover{
transform:scale(1.05);
box-shadow:0 10px 25px rgba(0,0,0,0.2);
}
.career-card{
background:#fff;
padding:40px;
border-radius:10px;
}

.form-title{
font-weight:600;
margin-bottom:30px;
color:#1f2937;
text-align:center;
}

.form-input{
border-radius:6px;
padding:12px;
border:1px solid #d1d5db;
transition:0.3s;
}

.form-input:focus{
border-color:#22c55e;
box-shadow:0 0 0 0.1rem rgba(34,197,94,0.25);
}

.career-btn{
background:#22c55e;
color:#fff;
padding:12px 30px;
border:none;
border-radius:6px;
font-weight:500;
}

.career-btn:hover{
background:#16a34a;
}

.donate-card{
background:#ffffff;
padding:40px;
border-radius:10px;
}

.donate-title{
font-size:28px;
font-weight:600;
color:#16a34a;
margin-bottom:15px;
}

.donate-desc{
color:#4b5563;
margin-bottom:25px;
}

.bank-info{
background:#f9fafb;
border-radius:8px;
padding:20px;
}

.bank-row{
display:flex;
justify-content:space-between;
padding:10px 0;
border-bottom:1px solid #e5e7eb;
font-size:15px;
}

.bank-row:last-child{
border-bottom:none;
}

.bank-row span{
color:#6b7280;
}

.bank-row strong{
color:#111827;
}

.donate-btn{
background:#16a34a;
color:#fff;
padding:12px 28px;
border-radius:6px;
font-weight:500;
}

.donate-btn:hover{
background:#15803d;
color:#fff;
}
.contact-card{
background:#fff;
padding:35px;
border-radius:10px;
}

.contact-title{
font-size:24px;
font-weight:600;
margin-bottom:25px;
color:#16a34a;
}

.form-input{
border-radius:6px;
padding:12px;
border:1px solid #d1d5db;
}

.form-input:focus{
border-color:#22c55e;
box-shadow:0 0 0 0.1rem rgba(34,197,94,0.25);
}

.contact-btn{
background:#16a34a;
color:#fff;
padding:12px 28px;
border-radius:6px;
font-weight:500;
}

.contact-btn:hover{
background:#15803d;
color:#fff;
}

.contact-info-card{
background:#fff;
padding:30px;
border-radius:10px;
}

.contact-info-card a{
color:#2563eb;
text-decoration:none;
}

.contact-info-card a:hover{
text-decoration:underline;
}

.map-box iframe{
width:100%;
height:300px;
border:0;
border-radius:10px;
}
.partners-section{
background:#f8fafc;
}

.partner-card{
background:#ffffff;
padding:25px;
border-radius:10px;
text-align:center;
font-weight:500;
font-size:17px;
color:#333;
box-shadow:0 6px 18px rgba(0,0,0,0.08);
transition:all .3s ease;
border-top:4px solid #198754;
height:100%;
display:flex;
align-items:center;
justify-content:center;
min-height:90px;
}

.partner-card:hover{
transform:translateY(-6px);
box-shadow:0 12px 25px rgba(0,0,0,0.15);
border-top:4px solid #146c43;
color:#198754;
}



