/************ Template Info ***************
Created by : Shipra Das
Created on : 16/Feb/2026
************ Template Info ***************/

.header-section-3{
  position: relative;
  background-image: url("../img/hero-shape-12.png");
  background-size: cover;
  background-position: center;
}

.header-section-3 .header-bottom{
  position:relative;
  z-index:2;
}



/*********counter design********/
.service-card .service-top h5{
  font-size: 28px;
  color: #004540;
  font-weight: 500;
}


/*************/


/* IMPACT GRID */

.impact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 20px;
  background: #fff;
  margin-bottom: 20px;
  border-radius: 10px;
  padding: 0px;
  border: 1px solid #bfdc89;
  box-shadow: 2px 2px 5px #bfdc89;
}

.impact-item {
  text-align: center;
  padding: 20px 15px;
  border-right: 1px solid #bfdc89;
  border-bottom: 1px solid #bfdc89;
  transition: 0.3s;
  position: relative;
  overflow: hidden;
}

/* RIGHT TOP BG PATTERN */

.impact-item::after{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:220px;
  height:390px;
  background:url("../img/services-three-shape-1.png") no-repeat;
  background-size:cover;
  opacity:0.20;
  pointer-events:none;
}

.impact-item:hover {
  background: #bfdc89;
}

/* ICON */

.impact-icon{
  width:85px;
  height:85px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
  font-size:40px;
  background:#fff !important;
  border:2px solid #f8b138;
  transition:.3s;
}

.impact-item:hover{
  background:#bfdc89;
}

.impact-icon:hover{
  background:#fff !important;
  color:#fff;
}

/* NUMBER */

.impact-item h3 {
  font-size: 30px;
  font-weight: 600;
  color: #000;
  margin-bottom: 6px;
}

/* TEXT */

.impact-item p {
  font-size: 15px;
  color: #000;
  max-width: 290px;
  margin: auto;
  line-height: 1.5;
}

/* remove right border last column */

.impact-item:nth-child(3n) {
  border-right: none;
}

/* remove bottom border last row */

.impact-item:nth-last-child(-n+3) {
  border-bottom: none;
}


/* =========================
RESPONSIVE
========================= */

@media (max-width:992px) {

  .impact-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .impact-item:nth-child(3n) {
    border-right: 1px solid #e8e8e8;
  }

  .impact-item:nth-child(2n) {
    border-right: none;
  }

  .impact-item:nth-last-child(-n+3) {
    border-bottom: 1px solid #e8e8e8;
  }

  .impact-item:nth-last-child(-n+2) {
    border-bottom: none;
  }

}


@media (max-width:576px) {

  .impact-grid {
    grid-template-columns: 1fr;
  }

  .impact-item {
    border-right: none;
  }

  .impact-item:not(:last-child) {
    border-bottom: 1px solid #e8e8e8;
  }

}


/*Impact counter end here*/




/*album gallery css start*/
.album-item {
  cursor: pointer;
  transition: 0.3s;
}
.album-item:hover {
  transform: translateY(-6px);
}

/* Lightbox */
.album-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.9);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.album-lightbox.active {
  display: flex;
}

.lightbox-inner {
  position: relative;
  max-width: 800px;
  width: 90%;
  text-align: center;
}

.lightbox-image {
  width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 10px;
}

.lightbox-title {
  color: #fff;
  margin-top: 15px;
}

.lightbox-close {
  position: absolute;
  top: -40px;
  right: 0;
  font-size: 30px;
  color: #fff;
  cursor: pointer;
}

.nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.2);
  border: none;
  font-size: 30px;
  padding: 10px 15px;
  cursor: pointer;
  color: #fff;
}

.prev { left: -60px; }
.next { right: -60px; }

@media(max-width:768px){
  .prev { left: 10px; }
  .next { right: 10px; }
}

/*album gallery css end*/
.why-us-section{
  position: relative;
}

.why-us-section .vl-hero-right-shape {
  position: absolute;
  right: 0;
  top: 0px;
}

.donate-one__shape-3 {
  left: 2%;
  top: 10px;
  animation: 2s linear 0s infinite normal none running moveHorizontal2;
}


