@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Marcellus&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Allura&display=swap");
@font-face {
    font-family: 'Autumn Brush';
    src: url('../font/Autumn\ Brush.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Fighter Attack";
    src: url("../fonts/Fighter\ Attack.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

:root {

  --pbf-blue: #1c5b8e;

  --pbf-blue-dark: #123f63;

  --pbf-green: #2f9e58;

  --pbf-green-dark: #1f7a41;

  --pbf-orange: #f4821f;

  --pbf-orange-dark: #d96e10;

  --pbf-cream: #eef6fb;

  --navy: #0d2b52;

  --blue: #1f7ee0;

  --orange: #f5821f;

  --green: #4caf50;

  --text-gray: #5b6470;

  --bg-panel: #f2f3f5;

  --border-light: #e4e6ea;

  --green: #4caf6d;

  --orange: #f5843c;

  --navy: #10254c;

  --blue: #1e63e9;

  --text-muted: #6b7a90;

  --card-bg: #f7f8fa;

  --card-bg-active: #10254c;

  --green: #4caf6d;

  --orange: #f5843c;

  --navy: #10254c;

  --blue: #1e63e9;

  --text-muted: #6b7a90;

  --card-bg: #f7f8fa;

  --navy: #0c2c5e;

  --navy-deep: #081f45;

  --card: rgba(255, 255, 255, 0.06);

  --card-border: rgba(255, 255, 255, 0.1);

  --orange: #f07830;

  --orange-deep: #d8621d;

  --green: #4caf6d;

  --white: #ffffff;

  --muted: rgba(255, 255, 255, 0.72);
   --navy: #0e2a5e;
    --navy-deep: #081b3f;
    --orange: #f4791f;
    --orange-deep: #d9660f;
    --green: #3fa14a;
    --bg-soft: #f4f6f9;
    --text-dark: #1c2b3a;
    --text-gray: #67748a;
    font-family: 'Inter', sans-serif;
    background: var(--bg-soft);
     --navy: #0e2a5e;
    --navy-deep: #081b3f;
    --orange: #f4791f;
    --orange-deep: #d9660f;
    --green: #3fa14a;
    --green-soft: #e7f5e8;
    --bg-soft: #f7f9fc;
    --text-dark: #1c2b3a;
    --text-gray: #67748a;
    font-family: 'Inter', sans-serif;
    background: var(--bg-soft);

}



* {

  box-sizing: border-box;

}

body,html{
  overflow-x: hidden;
}

body {

  font-family: "Poppins", sans-serif;

  color: #2b2b2b;

}



.script-font {

  font-family: "Dancing Script", cursive;

}

/*======================== HEADER ========================*/

/*==========================

        HEADER

==========================*/



.pbf-header {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  z-index: 9999;

  border-bottom: 1px solid #106caf;

}



.pbf-header .navbar {

  padding: 0;

  height: 130px;

}



.pbf-header .container-fluid {

  display: flex;

  align-items: center;

  justify-content: space-between;

  position: relative;

}



/*==========================

          LOGO

==========================*/



.logo {

  position: relative;

  z-index: 10002;

  padding-top: 70px;

}



.logo img {

}



/*==========================

        DESKTOP MENU

==========================*/



.pbf-nav .navbar-nav {

  padding: 35px 0;

}



.pbf-nav .nav-link {

  color:#043375;

  font-size: 15px;

  font-weight: 500;

  padding: 0 25px !important;

  transition: 0.3s;

}



.pbf-nav .nav-link:hover,

.pbf-nav .nav-link.active {

  color: var(--pbf-green);

}



/*==========================

       DONATE BUTTON

==========================*/



.pbf-donate-btn {

  background: var(--pbf-orange);

  color: #fff;

  border: none;

  border-radius: 6px;

  padding: 12px 30px;

  font-weight: 600;

  transition: 0.3s;

}



.pbf-donate-btn:hover {

  background: var(--pbf-orange-dark);

  color: #fff;

}



/*==========================

       HAMBURGER

==========================*/



.pbf-toggler {

  display: none;

  border: 0 !important;

  background: transparent;

  box-shadow: none !important;

  margin-left: auto;

  z-index: 10002;

}



.pbf-toggler span {

  display: block;

  width: 28px;

  height: 3px;

  background: #143d6b;

  margin: 6px 0;

  border-radius: 30px;

  transition: 0.35s;

}



.pbf-toggler.active span:nth-child(1) {

  transform: translateY(9px) rotate(45deg);

}



.pbf-toggler.active span:nth-child(2) {

  opacity: 0;

}



.pbf-toggler.active span:nth-child(3) {

  transform: translateY(-9px) rotate(-45deg);

}



/*==========================

        OVERLAY

==========================*/



.pbf-overlay {

  position: fixed;

  inset: 0;

  background: rgba(0, 0, 0, 0.45);

  opacity: 0;

  visibility: hidden;

  transition: 0.35s;

  z-index: 9997;

}



.pbf-overlay.show {

  opacity: 1;

  visibility: visible;

}



/*==========================

      MOBILE MENU

==========================*/



@media (max-width: 991px) {

  .logo img {

    max-height: 65px;

  }



  .pbf-toggler {

    display: block;

  }



  .pbf-nav {

    position: fixed;

    top: 0;

    right: -320px;

    width: 300px;

    height: 100vh;

    background: #fff;



    display: flex !important;

    flex-direction: column;

    justify-content: flex-start;



    padding: 90px 25px 40px;



    overflow-y: auto;



    transition: 0.45s ease;



    box-shadow: -8px 0 25px rgba(0, 0, 0, 0.15);



    z-index: 9998;

  }



  .pbf-nav.show {

    right: 0;

  }



  .pbf-nav .navbar-nav {

    width: 100%;

    padding: 0;

    margin: 0;

  }



  .pbf-nav .nav-item {

    width: 100%;

    border-bottom: 1px solid #ececec;



    opacity: 0;

    transform: translateX(40px);



    transition: 0.35s;

  }



  .pbf-nav.show .nav-item {

    opacity: 1;

    transform: translateX(0);

  }



  .pbf-nav.show .nav-item:nth-child(1) {

    transition-delay: 0.08s;

  }



  .pbf-nav.show .nav-item:nth-child(2) {

    transition-delay: 0.14s;

  }



  .pbf-nav.show .nav-item:nth-child(3) {

    transition-delay: 0.2s;

  }



  .pbf-nav.show .nav-item:nth-child(4) {

    transition-delay: 0.26s;

  }



  .pbf-nav.show .nav-item:nth-child(5) {

    transition-delay: 0.32s;

  }



  .pbf-nav.show .nav-item:nth-child(6) {

    transition-delay: 0.38s;

  }



  .pbf-nav .nav-link {

    display: block;

    width: 100%;

    padding: 16px 0 !important;

    font-size: 16px;

  }



  .pbf-donate-wrap {

    width: 100%;

    margin-top: 30px;



    opacity: 0;

    transform: translateX(40px);



    transition: 0.35s 0.45s;

  }



  .pbf-nav.show .pbf-donate-wrap {

    opacity: 1;

    transform: translateX(0);

  }



  .pbf-donate-btn {

    width: 100%;

  }



  body.menu-open {

    overflow: hidden;

  }

}



/*==========================

      DESKTOP ONLY

==========================*/



@media (min-width: 992px) {

  .pbf-nav {

    display: flex !important;

    align-items: center;

  }

}



/* ============================== HERO / BANNER ============================= */

.pbf-hero {

  position: relative;

  width: 100%;

  aspect-ratio: 1920 / 1230;

  background-image: url(images/banner.jpg);

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  overflow: hidden;

  padding-top: 240px;

}



/* ---------- Top-right lockup ---------- */

.together-lockup {

  position: absolute;

  top: 35%;

  right: 4.5%;

  display: flex;

  align-items: center;

  gap: 0.7vw;

  text-align: right;

}

.together-lockup .together-text {

  font-weight: 700;

  line-height: 1.25;

  font-size: clamp(12px, 1.15vw, 22px);

}

.together-lockup .together-text .g {

  color: var(--green);

}

.together-lockup .together-text .b {

  color: var(--blue);

}

.together-lockup svg {

  width: clamp(34px, 3.4vw, 66px);

  height: auto;

  flex-shrink: 0;

}



/* ---------- Left content block ---------- */

.left-content {

  max-width: 50%;

  padding-top: 1%;

}

.logo img {

  width: 200px;

}

.brand-row img {

  width: 100px;

}



.brand-row {

  display: flex;

  align-items: center;

  gap: 35px;

  margin-bottom: 0.4%;

}

.brand-row svg.kidney-icon {

  width: clamp(34px, 3.3vw, 64px);

  height: auto;

  flex-shrink: 0;

}



.brand-title {

  font-family: "Tinos", serif;

  font-weight: 800;

  font-size: 45px;
  
  color: #0f6eaf;

  letter-spacing: 0.5px;

}



.grateful {

  font-family: "Fighter Attack", cursive;


  /* font-weight: 700; */

  font-size: 110px;

  /* line-height: 0.9; */

  margin: -1% 0 1.5% 1%;

  background: linear-gradient(

    90deg,

    var(--green) 0%,

    var(--green) 42%,

    var(--blue) 78%,

    var(--blue) 100%

  );

  -webkit-background-clip: text;

  background-clip: text;

  color: transparent;

  display: flex;

  align-items: flex-end;

  gap: 0.6vw;

}

.grateful svg {

  width: clamp(20px, 2.1vw, 40px);

  height: auto;

  margin-bottom: 8%;

  -webkit-text-fill-color: initial;

  flex-shrink: 0;

}

.grateful svg path,

.grateful svg polyline {

  stroke: var(--blue);

}



.divider {

  display: flex;

  align-items: center;

  gap: 0.8vw;

  margin: 1.4% 0 2.2%;

  width: 470px;

}

.divider .line {

  height: 2px;

  background: linear-gradient(90deg, var(--green), var(--blue));

  flex: 1;

  opacity: 0.55;

}

.divider svg {

 width: 40px;

  height: auto;

}



.tagline {

  font-weight: 500;

  font-size: clamp(15px, 1.65vw, 32px);

  color: #1370ac;

  margin: 0 0 1.6%;

}

.tagline .blue {

  color: #4fae71;

}

.tagline .green {

  color: var(--green);

}



.subtext {

  font-size: clamp(11px, 1.05vw, 20px);

  color: #3d4f57;

  line-height: 1.5;

  font-weight: 400;

  margin-bottom: 38px;

  max-width: 90%;

}



.thankyou-bar {

  display: flex;

  align-items: center;

  gap: 1vw;

  color: #fff;

  padding: 1.1% 1.6vw;

  border-radius: 0 30px 30px 0;

  margin-left: -5.5%;

  padding-left: 5.5%;

  max-width: 92%;

     margin-bottom: 60px;

}
.line-1 {
    border-right: 0.5px solid #378c6052;
}
.thankyou-bar::before {
  content: "";
  position: absolute;
  left: 0;
  background: linear-gradient(90deg, var(--blue) 0%, #358f54 70%, rgb(58 163 89 / 0%) 100%);
  height: 85px;
  width: 42%;
}



.thankyou-bar svg {
  position: relative;
  width: 50px;
  height: auto;
  flex-shrink: 0;
}

.thankyou-bar .txt {

  font-size: clamp(11px, 1.15vw, 21px);

  line-height: 1.35;

  z-index: 1;

}

.thankyou-bar .txt b {

  font-weight: 700;

  display: block;

}



.icon-row {

  display: flex;

  gap: clamp(14px, 3vw, 56px);

}

.icon-item {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 0.5vw;

  width: clamp(60px, 6vw, 110px);

}

.icon-item img {

  width: 90px;

}

.icon-item svg {

  width: clamp(28px, 2.6vw, 50px);

  height: auto;

}

.icon-item span {

  font-size: clamp(9px, 0.85vw, 15px);

  font-weight: 600;

  color: var(--ink);

  text-align: center;

  line-height: 1.2;

}



@media (max-width: 760px) {

  .left-content {

    max-width: 62%;

  }

  .together-lockup {

    top: 3%;

    right: 3%;

  }

  .thankyou-bar {

    border-radius: 0 18px 18px 0;

  }

}



/* ==========================About-css================================= */



.about-section {

  padding: 40px 0 110px 0;

  align-items: center;

}



/* ---------- LEFT: image collage ---------- */

.collage {

  position: relative;

  width: 100%;

  aspect-ratio: 1/1.05;

  justify-self: center;

}



.collage img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



.img-top {

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 500px;

  overflow: hidden;

  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);

  z-index: 1;

}



.img-bottom {

  position: absolute;

  bottom: -40%;

  right: 0;

  border-radius: 500px;

  width: 392px;

  height: 610px;

  overflow: hidden;

  /* box-shadow:0 20px 40px rgba(0,0,0,0.14); */

  z-index: 2;

  border: 4px solid #f9f9f9;

}

.img-bottom img {

  width: 370px;

  height: 627px;

  border-radius: 500px;

}



.badge-experience {

  font-family: "Figtree", sans-serif;

  position: absolute;

  left: 27%;

  bottom: -10%;

  background: var(--green);

  color: #fff;

  padding: 9px 12px;

  text-align: left;

  line-height: 1.15;

  box-shadow: 0 12px 24px rgba(76, 175, 80, 0.35);

  border: 6px solid #ffffff;

  z-index: 3;

  text-align: center;

  border-radius: 5px;

}



.badge-experience strong {

  font-family: "Figtree", sans-serif;

  display: block;

  font-size: 40px;

  font-weight: 800;

  margin-bottom: 2px;

}



.badge-experience span {

  font-family: "Figtree", sans-serif;

  font-size: 16px;

  font-weight: 400;

  opacity: 0.95;

}



/* ---------- RIGHT: content ---------- */

.content .eyebrow {

  font-family: "Barlow Semi Condensed", sans-serif;

  display: inline-block;

  background: var(--bg-panel);

  color: #043375;

  font-size: 20px;

  font-weight: 600;

  letter-spacing: 0.3px;

  padding: 7px 16px;

  border-radius: 3px;

  margin-bottom: 10px;

}



.content h2 {

  font-family: "Barlow Semi Condensed", sans-serif;

  font-size: 60px;

  line-height: 1.18;

  font-weight: bold;

  margin-bottom: 15px;

}



.content h2 .line1 {

  display: block;

  color: var(--navy);

}



.content h2 .line2 {

  display: block;

  color: var(--blue);

}



.content p {

  font-size: 17px;

  line-height: 1.75;

  color: #470b00;

}



/* Expert talk panel */

.expert-panel {

  display: flex;

  align-items: stretch;

  justify-content: space-between;

  gap: 20px;

  background: var(--bg-panel);

  border-radius: 16px;

  margin-top: 30px;

  margin-bottom: 26px;

}

.expert-text {

  padding: 40px;

}



.expert-text .expert-label {

  font-family: "Figtree", sans-serif;

  color: var(--green);

  font-weight: 600;

  font-size: 18px;

  margin-bottom: 8px;

}



.expert-text p {

  font-size: 13px;

  line-height: 1.6;

  color: #470b00;

  margin-bottom: 10px;

  max-width: 340px;

}



.expert-text .expert-name {

  font-family: "Figtree", sans-serif;

  color: var(--orange);

  font-weight: 400;

  font-size: 16px;

}



.expert-photo {

  flex-shrink: 0;

  border-radius: 0;

  overflow: hidden;

  border-radius: 0px 16px 16px 0px;

  width: 240px;

}



.expert-photo img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



hr.divider {

  border: none;

  border-top: 1px solid #000;

  margin-bottom: 24px;

}



.cta-row {

  display: flex;

  align-items: center;

  gap: 28px;

  flex-wrap: wrap;

}



.btn-more {

  font-family: "Figtree", sans-serif;

  background: var(--orange);

  color: #fff;

  border: none;

  padding: 15px 30px;

  font-size: 18px;

  font-weight: 500;

  letter-spacing: 0.5px;

  border-radius: 4px;

  cursor: pointer;

  text-decoration: none;

  display: inline-block;

  transition:

    background 0.2s ease,

    transform 0.2s ease;

}



.btn-more:hover {

  background: #e07417;

  transform: translateY(-1px);

}



.watch-videos {

  font-family: "Figtree", sans-serif;

  display: flex;

  align-items: center;

  gap: 10px;

  text-decoration: none;

  color: #470b00;

  font-weight: 400;

  font-size: 23px;

  background: none;

  border: none;

  padding: 0;

  cursor: pointer;

  font-family: inherit;

}



.play-circle {

  width: 60px;

  height: 60px;

  border-radius: 50%;

  background: var(--navy);

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  transition: background 0.2s ease;

}



.watch-videos:hover .play-circle {

  background: var(--blue);

}



.play-circle svg {

  width: 35px;

  height: 35px;

  fill: #fff;

  margin-left: 2px;

}



/* ---------- Video Modal ---------- */

.video-modal {

  display: none;

  position: fixed;

  inset: 0;

  background: rgba(10, 15, 25, 0.82);

  z-index: 1000;

  align-items: center;

  justify-content: center;

  padding: 20px;

  opacity: 0;

  transition: opacity 0.25s ease;

}



.video-modal.open {

  display: flex;

  opacity: 1;

}



.video-modal-content {

  position: relative;

  width: 100%;

  max-width: 860px;

  background: #000;

  border-radius: 10px;

  overflow: hidden;

  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5);

  transform: scale(0.94);

  transition: transform 0.25s ease;

}



.video-modal.open .video-modal-content {

  transform: scale(1);

}



.video-modal-content .video-wrap {

  position: relative;

  width: 100%;

  padding-top: 56.25%; /* 16:9 */

}



.video-modal-content iframe,

.video-modal-content video {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 0;

  display: block;

}



.video-modal-close {

  position: absolute;

  top: -46px;

  right: 0;

  width: 36px;

  height: 36px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.12);

  border: none;

  color: #fff;

  font-size: 20px;

  line-height: 1;

  cursor: pointer;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: background 0.2s ease;

}



.video-modal-close:hover {

  background: rgba(255, 255, 255, 0.25);

}



@media (max-width: 600px) {

  .video-modal-close {

    top: -42px;

    right: 0;

    width: 32px;

    height: 32px;

    font-size: 18px;

  }

}



/* ---------- Responsive ---------- */

@media (max-width: 900px) {

  .about-section {

    grid-template-columns: 1fr;

    padding: 50px 20px;

  }

  .collage {

    max-width: 360px;

    margin-bottom: 20px;

  }

}



@media (max-width: 480px) {

  .content h1 {

    font-size: 29px;

  }

  .expert-panel {

    flex-direction: column;

  }

  .expert-photo {

    width: 100%;

    height: 150px;

  }

}



.img-top img {

  width: 460px;

  height: 694px;

  border-radius: 500px;

}



/* ========================services-css================================== */



.services-wrap {

  padding: 100px 0;

}

.services-wrap .content {

  text-align: center;

  margin-bottom: 50px;

}

.services-wrap .content h2 span {

  display: inline;

}

.service-slide {

  padding: 12px;

}



/* ---- Card ---- */

.service-card {

  position: relative;

  border-radius: 14px;

  height: 100%;

  min-height: 300px;

  overflow: hidden;

  background: var(--card-bg);

  box-shadow: 0 2px 6px rgba(16, 37, 76, 0.04);

  transition: box-shadow 0.4s ease;

}



.card-inner {

  position: relative;

  z-index: 2;

  padding: 34px 28px 30px;

  height: 100%;

  display: flex;

  flex-direction: column;

}



/* background photo layer - hidden until slide is active */

.card-bg {

  position: absolute;

  inset: 0;

  background-size: cover;

  background-position: center;

  opacity: 0;

  transform: scale(1.08);

  transition:

    opacity 0.6s ease,

    transform 0.8s ease;

  z-index: 0;

  transform: scale(1);

  transition: transform 0.6s ease;

}



.card-overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(

    180deg,

    rgba(16, 24, 42, 0.35) 0%,

    rgba(10, 16, 30, 0.82) 100%

  );

  opacity: 0;

  transition: opacity 0.6s ease;

  z-index: 1;

}



/* when Slick marks this slide as the current/centered one */

.slick-current .service-card {

  box-shadow: 0 20px 40px rgba(16, 37, 76, 0.22);

}



.slick-current .card-bg,

.slick-current .card-overlay {

  opacity: 1;

}



.slick-current .card-bg {

  transform: scale(1);

}



.slick-current .service-title {

  color: #fff;

}

.slick-current .service-desc {

  color: rgba(255, 255, 255, 0.82);

}

.slick-current .service-footer {

  border-top-color: rgba(255, 255, 255, 0.25);

}

.slick-current .know-more {

  color: #fff;

}

.slick-current .icon-badge {

  background: rgba(255, 255, 255, 0.18);

}



.icon-badge {

  width: 54px;

  height: 54px;

  border-radius: 50%;

  background: #55b34e;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 22px;

  flex-shrink: 0;

  transition: background 0.5s ease;

}

.icon-badge svg {

  width: 26px;

  height: 26px;

  stroke: #fff;

}



.service-title {

  font-size: 19px;

  font-weight: 600;

  color: var(--navy);

  margin: 0 0 10px;

  line-height: 1.35;

  transition: color 0.5s ease;

}



.service-desc {

  font-size: 14.5px;

  color: var(--text-muted);

  line-height: 1.65;

  margin: 0 0 24px;

  flex-grow: 1;

  transition: color 0.5s ease;

}



.service-footer {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding-top: 18px;

  border-top: 1px dashed rgba(16, 37, 76, 0.14);

  transition: border-color 0.5s ease;

}



.know-more {

  font-size: 15px;

  font-weight: 400;

  color: #1981e7;

  text-decoration: none;

  transition: color 0.5s ease;

}



.arrow-btn {

  width: 36px;

  height: 36px;

  border-radius: 50%;

  background: var(--orange);

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

}

.arrow-btn svg {

  width: 15px;

  height: 15px;

  stroke: #fff;

}



/* ---- Slick tweaks ---- */

.slick-slide {

  outline: none;

}

.slick-list {

  margin: 0 -12px;

  padding: 10px 0 10px !important;

}



/* ---- Nav arrows top-right ---- */

.nav-arrows {

  position: absolute;

  right: 16%;

  display: flex;

  gap: 10px;

}

.nav-arrows button {

  width: 40px;

  height: 40px;

  border-radius: 8px;

  border: none;

  background: var(--blue);

  display: flex;

  align-items: center;

  justify-content: center;

  cursor: pointer;

  transition:

    background 0.25s ease,

    transform 0.25s ease;

  z-index: 999;

}

.nav-arrows button:hover {

  background: var(--navy);

  transform: translateY(-2px);

}

.nav-arrows button svg {

  width: 16px;

  height: 16px;

  stroke: #fff;

}



@media (max-width: 640px) {

  .nav-arrows {

    display: none;

  }

}



/* =========================impact-css============================ */



.impact-section {

  padding: 80px 0;

  background-color: #f9f9f9;

}



.impact-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 50px;

  align-items: center;

}



/* ---------- LEFT: feature card ---------- */

.feature-card {

  background: #ffffff;

  border-radius: 16px;

  padding: 38px 34px;

  box-shadow: 0 10px 30px rgba(16, 37, 76, 0.06);

}



.feature-item {

  display: flex;

  gap: 18px;

  align-items: flex-start;

}



.feature-item + .feature-item {

  margin-top: 26px;

  padding-top: 26px;

  border-top: 1px dashed #e4e8ef;

}



.feature-icon {

  width: 48px;

  height: 48px;

  border-radius: 12px;

  background: #55b34e;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

}



.feature-icon img {

  width: 30px;

}



.feature-title {

  font-size: 17.5px;

  font-weight: 600;

  color: var(--orange);

  margin: 2px 0 8px;

}



.feature-desc {

  font-size: 14px;

  line-height: 1.65;

  color: #000;

  margin: 0;

}



/* ---------- RIGHT: overlapping images ---------- */

.impact-visual {

  position: relative;

  width: 100%;

  padding-bottom: 20px;

}



.visual-main {

  width: 88%;

  margin-left: auto;

  /* border-radius: 16px; */

  overflow: hidden;

  box-shadow: 0 20px 40px rgba(16, 37, 76, 0.18);

}



.visual-main img {

  width: 100%;

  object-fit: cover;

  display: block;

}



.visual-secondary {

  position: absolute;

  left: 0;

  bottom: -20px;

  width: 55%;

  border-radius: 0;

  overflow: hidden;

  border: 6px solid #ffffff;

  box-shadow: 0 16px 32px rgba(16, 37, 76, 0.2);

}



.visual-secondary img {

  width: 100%;

  object-fit: cover;

  display: block;

}



/* ---------- Responsive ---------- */

@media (max-width: 860px) {

  .impact-grid {

    grid-template-columns: 1fr;

  }

  .impact-visual {

    order: -1;

    padding-bottom: 40px;

  }

}



@media (max-width: 480px) {

  .visual-main img {

    height: 260px;

  }

  .visual-secondary img {

    height: 140px;

  }

  .feature-card {

    padding: 28px 22px;

  }

}



/*=================================== work-benifit====================================== */

.work-benefits {

  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);

  padding: 90px 0 100px;

  position: relative;

  /* overflow: hidden; */

}



/* soft ambient glow, purely decorative */

.work-benefits::before {

  content: "";

  position: absolute;

  top: -120px;

  right: -120px;

  width: 420px;

  height: 420px;

  background: radial-gradient(

    circle,

    rgba(240, 120, 48, 0.16) 0%,

    transparent 70%

  );

  pointer-events: none;

}

.work-benefits::after {

  content: "";

  position: absolute;

  bottom: -160px;

  left: -100px;

  width: 380px;

  height: 380px;

  background: radial-gradient(

    circle,

    rgba(76, 175, 109, 0.14) 0%,

    transparent 70%

  );

  pointer-events: none;

}



.work-benefits .container {

  position: relative;

  z-index: 1;

}



.badge-pill {

  display: inline-block;

  background: rgba(255, 255, 255, 0.92);

  color: var(--navy-deep);

  font-family: "Inter", sans-serif;

  font-size: 13px;

  font-weight: 600;

  padding: 8px 18px;

  border-radius: 999px;

  margin-bottom: 20px;

}



.wb-heading {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: clamp(28px, 3.6vw, 42px);

  line-height: 1.18;

  color: var(--white);

  margin: 0;

}



.wb-description p {

  color: var(--muted);

  font-size: 14.5px;

  line-height: 1.75;

  margin: 0 0 20px;

}



.btn-contact {

  background: var(--orange);

  color: #fff;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 14px;

  border: none;

  padding: 14px 30px;

  border-radius: 8px;

  text-decoration: none;

  display: inline-block;

  box-shadow: 0 10px 24px rgba(240, 120, 48, 0.28);

  transition:

    transform 0.25s ease,

    box-shadow 0.25s ease,

    background 0.25s ease;

}



.btn-contact:hover {

  background: var(--orange-deep);

  color: #fff;

  transform: translateY(-3px);

  box-shadow: 0 14px 30px rgba(240, 120, 48, 0.38);

}



/* ---------- cards ---------- */

.wb-card {

  background: var(--card);

  border: 1px solid var(--card-border);

  border-radius: 20px;

  padding: 32px 28px;

  backdrop-filter: blur(6px);

  height: 100%;

}



/* ----- card 1: stat ----- */

.stat-number {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 44px;

  color: var(--white);

  margin: 0 0 22px;

  line-height: 1;

}



.icon-circle {

  width: 52px;

  height: 52px;

  border-radius: 50%;

  background: var(--green);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 26px;

  animation: pulse-ring 2.8s ease-out infinite;

}



.icon-circle svg {

  width: 24px;

  height: 24px;

  color: #fff;

}



.wb-card h3 {

  font-family: "Figtree", sans-serif;

  font-weight: 500;

  font-size: 32px;

  color: var(--white);

  margin: 0 0 25px;

}

.stat-number {

  font-size: 40px !important;

  margin-bottom: 45px !important;

  font-weight: 600;

}



.stat-divider {

  width: 100%;

  height: 1px;

  background: rgba(255, 255, 255, 0.14);

  margin-bottom: 16px;

}



.wb-card p {

  color: #fff;

  font-size: 13.5px;

  line-height: 1.7;

  margin: 0;

}



/* ----- card 2: image ----- */

.wb-image-card {

  padding: 0;

  overflow: hidden;

  position: relative;

  min-height: 380px;

}



.wb-image-card img {

  width: 100%;

  height: 100%;

  min-height: 380px;

  object-fit: cover;

  display: block;

  transition: transform 0.6s ease;

}



.wb-image-card:hover img {

  transform: scale(1.06);

}



.wb-image-card::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(

    180deg,

    rgba(8, 31, 69, 0) 55%,

    rgba(8, 31, 69, 0.55) 100%

  );

  pointer-events: none;

}



/* ----- card 3: community ----- */

.avatar-row {

  display: flex;

  margin-bottom: 24px;

}



.avatar-row img {

  width: 48px;

  height: 48px;

  border-radius: 50%;

  border: 3px solid var(--navy);

  object-fit: cover;

  margin-left: -14px;

  transition: transform 0.3s ease;

}



.avatar-row img:first-child {

  margin-left: 0;

}



.wb-card:hover .avatar-row img {

  transform: translateY(-3px);

}



.wb-card:hover .avatar-row img:nth-child(2) {

  transition-delay: 0.05s;

}

.wb-card:hover .avatar-row img:nth-child(3) {

  transition-delay: 0.1s;

}



.wb-list {

  list-style: none;

  margin: 16px 0 0;

  padding: 0;

  display: flex;

  flex-direction: column;

  gap: 12px;

}



.wb-list li {

  display: flex;

  align-items: flex-start;

  gap: 10px;

  color: #fff;

  font-size: 13.5px;

  line-height: 1.65;

}



.wb-list li svg {

  flex: none;

  width: 16px;

  height: 16px;

  margin-top: 2px;

  color: var(--orange);

}



@media (max-width: 991.98px) {

  .wb-image-card {

    min-height: 280px;

    order: -1;

  }

  .wb-image-card img {

    min-height: 280px;

  }

}



@media (max-width: 575.98px) {

  .work-benefits {

    padding: 64px 0 72px;

  }

  .wb-card {

    padding: 26px 22px;

  }

}



@media (prefers-reduced-motion: reduce) {

  .reveal {

    opacity: 1;

    transform: none;

    transition: none;

  }

  .icon-circle {

    animation: none;

  }

  .wb-image-card img,

  .btn-contact,

  .avatar-row img {

    transition: none;

  }

}



.work-benefits h2 .line1 {

  color: #fff;

}

.work-benefits h2 .line2 {

  color: #fff;

}

.icon-circle img {

  width: 30px;

}



.dbs-donate-banner {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 60px;

  background-color: #f4761f;

  padding: 22px 24px;

  font-family: "Segoe UI", Arial, Helvetica, sans-serif;

  box-sizing: border-box;

  width: 100%;

}



.dbs-donate-banner__icon-circle {

  flex-shrink: 0;

  width: 60px;

  height: 60px;

  border-radius: 50%;

  background-color: #4caf6e;

  display: flex;

  align-items: center;

  justify-content: center;

}



.dbs-donate-banner__icon-circle svg {

  width: 30px;

  height: 30px;

  stroke: #ffffff;

  fill: none;

  stroke-width: 1.6;

}



.dbs-donate-banner p {

  font-size: 20px;

  font-weight: 700;

  color: #1a1a1a;

  white-space: nowrap;

  margin-bottom: 0;

}



.dbs-donate-banner__cta {

  flex-shrink: 0;

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background-color: #043375;

  color: #ffffff;

  text-decoration: none;

  font-size: 16px;

  /* font-weight: 600; */

  padding: 12px 40px;

  border-radius: 24px;

  border: none;

  cursor: pointer;

  white-space: nowrap;

}



.dbs-donate-banner__cta svg {

  width: 16px;

  height: 16px;

  fill: none;

  stroke: #ffffff;

  stroke-width: 1.8;

}



@media (max-width: 700px) {

  .dbs-donate-banner {

    flex-wrap: wrap;

    text-align: center;

    gap: 14px;

  }

  .dbs-donate-banner__message {

    white-space: normal;

    font-size: 17px;

  }

}

.dbs-donate-banner__icon-circle img {

  width: 42px;

}



.op-our-programs {

  font-family: "Segoe UI", Arial, Helvetica, sans-serif;

  padding: 80px 0;

  box-sizing: border-box;

  background-color: #ffffff;

}



.op-our-programs__wrap {

  max-width: 1200px;

  margin: 0 auto;

}



/* slick gives each slide a wrapping div, add side gutters here */

.op-our-programs__slider .slick-slide > div {

  margin: 0 5px;

}

.op-our-programs__slider {

  margin: 0 -22px;

}



.op-our-programs__card {

  position: relative;

  height: 300px;

  border-radius: 14px;

  overflow: hidden;

  background-size: cover;

  background-position: center;

  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);

}



.op-our-programs__card--awareness {

  background-image: linear-gradient(135deg, #d98a4f 0%, #b3603a 100%);

}

.op-our-programs__card--camps {

  background-image: linear-gradient(135deg, #8fae7a 0%, #5f7f56 100%);

}

.op-our-programs__card--transplant {

  background-image: linear-gradient(135deg, #3d5a73 0%, #223447 100%);

}

.op-our-programs__card--general {

  background-image: linear-gradient(135deg, #b5763f 0%, #7d4f2a 100%);

}



.op-our-programs__date {

  position: absolute;

  top: 16px;

  left: 16px;

  background-color: #1981e7;

  color: #fff;

  font-size: 12px;

  font-weight: 600;

  padding: 6px 12px;

  border-radius: 6px;

  z-index: 2;

}



.op-our-programs__arrow-badge {

  position: absolute;

  top: 16px;

  right: 16px;

  width: 35px;

  height: 35px;

  border-radius: 50%;

  background-color: #3fae5c;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;

}



.op-our-programs__arrow-badge svg {

  width: 23px;

  height: 23px;

  stroke: #ffffff;

  stroke-width: 2.2;

  fill: none;

}



.op-our-programs__overlay {

  position: absolute;

  bottom: 16px;

  left: 16px;

  right: 16px;

  background-color: #ef7d29;

  border-radius: 10px;

  padding: 16px 18px;

  text-align: center;

  color: #ffffff;

  z-index: 2;

}



.op-our-programs__title {

  margin: 0 0 8px;

  font-size: 17px;

  font-weight: 700;

}



.op-our-programs__desc {

  margin: 0;

  font-size: 12.5px;

  line-height: 1.5;

  opacity: 0.95;

}



/* Slick nav arrow styling */

.op-our-programs__slider .slick-prev,

.op-our-programs__slider .slick-next {

  width: 40px;

  height: 40px;

  z-index: 3;

}

.op-our-programs__slider .slick-prev {

  left: -46px;

}

.op-our-programs__slider .slick-next {

  right: -46px;

}

.op-our-programs__slider .slick-prev:before,

.op-our-programs__slider .slick-next:before {

  color: #ef7d29;

  font-size: 32px;

  opacity: 1;

}



/* Slick dots styling */

.op-our-programs__slider .slick-dots {

  bottom: -40px;

}

.op-our-programs__slider .slick-dots li button:before {

  font-size: 10px;

  color: #ef7d29;

  opacity: 0.4;

}

.op-our-programs__slider .slick-dots li.slick-active button:before {

  opacity: 1;

  color: #ef7d29;

}

.op-our-programs__slider .slick-dots li button:before {

  content: "" !important;

  width: 14px !important;

  height: 14px !important;

  background: #ef7d29 !important;

  border-radius: 50%;

  display: block;

  opacity: 0.4;

}



.op-our-programs__slider .slick-dots li.slick-active button:before {

  opacity: 1;

}

@media (max-width: 700px) {

  .op-our-programs {

    padding: 40px 20px 60px;

  }

  .op-our-programs__slider .slick-prev {

    left: -6px;

  }

  .op-our-programs__slider .slick-next {

    right: -6px;

  }

}



.op-our-programs .content h2 span {

  display: inline;

}

.op-our-programs .content {

  text-align: center;

  margin-bottom: 40px;

}



/* footer-css */



.ftr-site-footer {

  font-family: "Segoe UI", Arial, Helvetica, sans-serif;

  background-color: #043375;

  color: #ffffff;

}



.ftr-site-footer__container {

  padding: 50px 0 40px;

}



/* Brand column */

.ftr-site-footer__brand {

  max-width: 260px;

}



.ftr-site-footer__logo-circle {

  /* width: 92px;

    height: 92px;

    border-radius: 50%;

    background-color: #0e0e0e;

    border: 2px dotted #4f7db8;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center; */

  margin-bottom: 16px;

}



.ftr-site-footer__logo-circle svg {

  width: 34px;

  height: 22px;

}



.ftr-site-footer__logo-name {

  font-size: 12px;

  font-weight: 700;

  color: #e0b25a;

  margin-top: 4px;

  letter-spacing: 0.3px;

}



.ftr-site-footer__logo-tag {

  font-size: 6px;

  letter-spacing: 1.5px;

  color: #cfcfcf;

  margin-top: 2px;

}



.ftr-site-footer__brand p {

  font-size: 13.5px;

  line-height: 1.7;

  color: #c7d3e3;

  margin: 0;

}



/* Link columns */



.ftr-site-footer__heading {

  font-family: "Marcellus", serif;

  font-size: 17px;

  font-weight: 600;

  margin: 0 0 35px;

  color: #ffffff;

}



.ftr-site-footer__links {

  list-style: none;

  margin: 0;

  padding: 0;

}



.ftr-site-footer__links li {

  margin-bottom: 22px;

}



.ftr-site-footer__links a {

  color: #fff;

  text-decoration: none;

  font-size: 15px;

  transition: color 0.2s ease;

}



.ftr-site-footer__links a:hover {

  color: #ffffff;

}



/* Contact column */

.ftr-site-footer__contact-item {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 16px;

  font-size: 15px;

  color: #fff;

}



.ftr-site-footer__contact-item svg {

  width: 15px;

  height: 15px;

  stroke: #ffffff;

  fill: none;

  stroke-width: 1.8;

  flex-shrink: 0;

}



.ftr-site-footer__social {

  display: flex;

  gap: 12px;

  margin-top: 22px;

}



.ftr-site-footer__social a {

  width: 30px;

  height: 30px;

  border-radius: 50%;

  border: 1px solid #4f7db8;

  display: flex;

  align-items: center;

  justify-content: center;

}



.ftr-site-footer__social svg {

  width: 14px;

  height: 14px;

  fill: #ffffff;

}



/* Bottom bar */

.ftr-site-footer__bottom {

  background-color: #081f42;

  text-align: center;

  padding: 16px 20px;

  font-size: 12.5px;

  color: #9fb1cb;

}



@media (max-width: 700px) {

  .ftr-site-footer__main {

    flex-direction: column;

  }

}

.ftr-site-footer__logo-circle img {

  width: 150px;

  height: 130px;

}



/* ============================About Us Page================================ */

/* ==========================================================

   0. BASE / RESET (scoped — no global overwrite, no :root)

   ========================================================== */

.pbkf-about-page {

  --pbkf-navy: #123f7a;

  --pbkf-blue: #1e63c6;

  --pbkf-green: #56b34d;

  --pbkf-orange: #f68b1f;

  --pbkf-white: #ffffff;

  --pbkf-light-bg: #f8fafd;

  --pbkf-text-dark: #16294a;

  font-family: "Poppins", sans-serif;

  color: var(--pbkf-text-dark);

  background: var(--pbkf-white);

  overflow-x: hidden;

  position: relative;

}



.pbkf-about-page * {

  box-sizing: border-box;

  margin: 0;

  padding: 0;

}



.pbkf-about-page img {

  max-width: 100%;

  display: block;

}



.pbkf-about-page a {

  text-decoration: none;

  color: inherit;

}



.pbkf-about-page ul {

  list-style: none;

}



.pbkf-section-container {

  max-width: 1240px;

  margin: 0 auto;

  padding: 0 32px;

}



.pbkf-eyebrow-label {

  display: inline-block;

  background: var(--pbkf-light-bg);

  color: var(--pbkf-blue);

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 0.06em;

  text-transform: uppercase;

  padding: 8px 22px;

  border-radius: 30px;

  margin-bottom: 18px;

}



.pbkf-heading-display {

  font-family: "Playfair Display", serif;

  font-weight: 700;

  color: var(--pbkf-navy);

  line-height: 1.18;

}



.pbkf-heading-display .pbkf-accent-text {

  color: var(--pbkf-blue);

}



.pbkf-body-text {

  font-size: 16px;

  line-height: 1.85;

  color: #4c5b73;

  font-weight: 400;

}



.pbkf-script-accent {

  font-family: "Dancing Script", cursive;

  color: var(--pbkf-green);

}



/* Curved wave divider used as recurring signature motif */

.pbkf-wave-divider {

  position: relative;

  width: 100%;

  height: 90px;

  overflow: hidden;

  line-height: 0;

}



.pbkf-wave-divider svg {

  width: 100%;

  height: 100%;

  display: block;

}



/* ==========================================================

   1. HERO SECTION

   ========================================================== */

.pbkf-hero-section {

  position: relative;

  min-height: 560px;

  display: flex;

  align-items: center;

  background:

    linear-gradient(

      135deg,

      rgba(18, 63, 122, 0.88) 0%,

      rgba(30, 99, 198, 0.72) 55%,

      rgba(86, 179, 77, 0.35) 100%

    ),

    url("https://images.unsplash.com/photo-1666887360355-e6a9c3ba1b3f?w=1600&q=80")

      center/cover no-repeat;

  padding: 190px 0 130px;

}



.pbkf-hero-decor-shape-one {

  position: absolute;

  top: 60px;

  right: 8%;

  width: 130px;

  height: 130px;

  border: 2px solid rgba(255, 255, 255, 0.35);

  border-radius: 50%;

  animation: pbkf-float-slow 6s ease-in-out infinite;

}



.pbkf-hero-decor-shape-two {

  position: absolute;

  bottom: 130px;

  left: 6%;

  width: 70px;

  height: 70px;

  background: rgba(86, 179, 77, 0.25);

  border-radius: 50%;

  animation: pbkf-float-slow 5s ease-in-out infinite reverse;

}



.pbkf-hero-decor-shape-three {

  position: absolute;

  top: 40%;

  right: 20%;

  width: 40px;

  height: 40px;

  background: rgba(246, 139, 31, 0.3);

  border-radius: 12px;

  transform: rotate(20deg);

  animation: pbkf-float-slow 7s ease-in-out infinite;

}



@keyframes pbkf-float-slow {

  0%,

  100% {

    transform: translateY(0px);

  }

  50% {

    transform: translateY(-18px);

  }

}



.pbkf-hero-content-wrap {

  position: relative;

  z-index: 2;

  max-width: 720px;

}



.pbkf-breadcrumb-nav {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 26px;

}



.pbkf-breadcrumb-nav .pbkf-crumb-item {

  color: rgb(0 0 0 / 85%);

  font-size: 14px;

  font-weight: 500;

  letter-spacing: 0.02em;

}



.pbkf-breadcrumb-nav .pbkf-crumb-item.pbkf-crumb-active {

  color: var(--pbkf-white);

  font-weight: 700;

}



.pbkf-breadcrumb-nav .pbkf-crumb-sep {

  color: rgba(255, 255, 255, 0.5);

  font-size: 12px;

}



.pbkf-hero-eyebrow {

  display: inline-block;

  background: rgba(255, 255, 255, 0.15);

  backdrop-filter: blur(6px);

  color: var(--pbkf-white);

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 0.08em;

  text-transform: uppercase;

  padding: 8px 22px;

  border-radius: 30px;

  margin-bottom: 22px;

  border: 1px solid rgba(255, 255, 255, 0.3);

}



.pbkf-hero-heading {

  font-family: "Playfair Display", serif;

  font-weight: 800;

  font-size: 58px;

  line-height: 1.12;

  color: var(--pbkf-white);

  margin-bottom: 22px;

}



.pbkf-hero-heading .pbkf-script-accent {

  color: #a9e39f;

}



.pbkf-hero-tagline-wrap {

  max-width: 540px;

}



.pbkf-hero-tagline-text {

  font-size: 17px;

  line-height: 1.8;

  color: rgba(255, 255, 255, 0.92);

  font-weight: 300;

}



.pbkf-hero-wave-bottom {

  position: absolute;

  left: 0;

  bottom: -2px;

  width: 100%;

  line-height: 0;

  z-index: 3;

}



.pbkf-hero-wave-bottom svg {

  width: 100%;

  height: 100px;

  display: block;

}



/* ==========================================================

   2. OUR STORY SECTION

   ========================================================== */

.pbkf-story-section {
  padding: 40px 0;
  background: var(--pbkf-white);
  position: relative;
}



.pbkf-story-grid {

  display: grid;

  grid-template-columns: 0.95fr 1.05fr;

  gap: 70px;

  align-items: center;

}



.pbkf-story-media-col {

  position: relative;

}



.pbkf-story-image-primary {

  position: relative;

  border-radius: 28px;

  overflow: hidden;

  box-shadow: 0 30px 60px -20px rgba(18, 63, 122, 0.28);

  z-index: 2;

}



.pbkf-story-image-primary img {

  width: 100%;

  height: 460px;

  object-fit: cover;

}



.pbkf-story-image-floating {

  position: absolute;

  bottom: -50px;

  right: -40px;

  width: 220px;

  border-radius: 20px;

  overflow: hidden;

  border: 6px solid var(--pbkf-white);

  box-shadow: 0 20px 45px -15px rgba(18, 63, 122, 0.35);

  z-index: 3;

}



.pbkf-story-image-floating img {

  width: 100%;

  height: 160px;

  object-fit: cover;

}



.pbkf-story-decor-blob {

  position: absolute;

  top: -30px;

  left: -30px;

  width: 140px;

  height: 140px;

  background: var(--pbkf-light-bg);

  border-radius: 50% 50% 45% 55% / 55% 45% 55% 45%;

  z-index: 1;

}



.pbkf-story-experience-badge {

  position: absolute;

  top: -30px;

  right: 20px;

  z-index: 4;

  background: var(--pbkf-green);

  color: var(--pbkf-white);

  border-radius: 50%;

  width: 108px;

  height: 108px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  text-align: center;

  box-shadow: 0 15px 30px -8px rgba(86, 179, 77, 0.55);

}



.pbkf-story-experience-badge .pbkf-badge-number {

  font-family: "Playfair Display", serif;

  font-size: 26px;

  font-weight: 800;

  line-height: 1;

}



.pbkf-story-experience-badge .pbkf-badge-label {

  font-size: 10px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 0.03em;

  margin-top: 4px;

}



.pbkf-story-content-col {

  padding-top: 10px;

}



.pbkf-story-heading {

  font-size: 42px;

  margin-bottom: 26px;

}



.pbkf-story-paragraphs .pbkf-body-text {

  margin-bottom: 18px;

}



.pbkf-story-quote-block {

  display: flex;

  gap: 18px;

  align-items: flex-start;

  background: var(--pbkf-light-bg);

  border-left: 4px solid var(--pbkf-orange);

  border-radius: 16px;

  padding: 26px 28px;

  margin: 28px 0 30px;

}



.pbkf-story-quote-icon {

  font-family: "Playfair Display", serif;

  font-size: 40px;

  color: var(--pbkf-orange);

  line-height: 0.6;

  flex-shrink: 0;

}



.pbkf-story-quote-text {

  font-family: "Playfair Display", serif;

  font-style: italic;

  font-size: 18px;

  color: var(--pbkf-navy);

  line-height: 1.6;

}



.pbkf-story-signature-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 34px;

  flex-wrap: wrap;

  gap: 20px;

}



.pbkf-story-signature-name {

  font-family: "Dancing Script", cursive;

  font-size: 30px;

  color: var(--pbkf-navy);

}



.pbkf-story-signature-role {

  font-size: 13px;

  color: #7c8aa0;

  letter-spacing: 0.03em;

  margin-top: 2px;

}



.pbkf-btn-primary-orange {

  display: inline-block;

  background: var(--pbkf-orange);

  color: var(--pbkf-white);

  font-size: 14px;

  font-weight: 600;

  letter-spacing: 0.03em;

  text-transform: uppercase;

  padding: 16px 34px;

  border-radius: 30px;

  transition: all 0.35s ease;

  box-shadow: 0 12px 24px -8px rgba(246, 139, 31, 0.5);

}



.pbkf-btn-primary-orange:hover {

  background: var(--pbkf-navy);

  transform: translateY(-3px);

  box-shadow: 0 18px 30px -8px rgba(18, 63, 122, 0.4);

}



/* ==========================================================

   3. VISION & MISSION

   ========================================================== */

.pbkf-vision-mission-section {

  padding: 100px 0 130px;

  background: var(--pbkf-light-bg);

  position: relative;

}



.pbkf-section-heading-wrap {

  text-align: center;

  /* max-width: 640px; */

  margin: 0 auto 60px;

}



.pbkf-section-heading-wrap .pbkf-heading-display {

  font-size: 40px;

}



.pbkf-vm-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 34px;

}



.pbkf-vm-card {

  background: var(--pbkf-white);

  border-radius: 24px;

  padding: 48px 42px;

  border: 1px solid transparent;

  box-shadow: 0 10px 30px -12px rgba(18, 63, 122, 0.12);

  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);

  height: 100%;

  display: flex;

  flex-direction: column;

}



.pbkf-vm-card:hover {

  transform: translateY(-10px);

  border-color: var(--pbkf-green);

  box-shadow: 0 25px 45px -15px rgba(86, 179, 77, 0.28);

}



.pbkf-vm-icon-circle {

  width: 68px;

  height: 68px;

  border-radius: 20px;

  background: var(--pbkf-light-bg);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 26px;

  transition:

    transform 0.5s ease,

    background 0.4s ease;

}



.pbkf-vm-card:hover .pbkf-vm-icon-circle {

  transform: rotate(-8deg) scale(1.08);

  background: var(--pbkf-green);

}



.pbkf-vm-icon-circle svg {

  width: 30px;

  height: 30px;

}

.pbkf-vm-card:hover .pbkf-vm-icon-circle svg .pbkf-icon-stroke {

  stroke: var(--pbkf-white);

}



.pbkf-vm-card-heading {

  font-family: "Playfair Display", serif;

  font-size: 24px;

  font-weight: 700;

  color: var(--pbkf-navy);

  margin-bottom: 14px;

}



/* ==========================================================

   4. OUR JOURNEY — TIMELINE (signature section)

   ========================================================== */

.pbkf-journey-section {

  padding: 130px 0;

  background: var(--pbkf-white);

  position: relative;

  overflow: hidden;

}



.pbkf-journey-bg-decor {

  position: absolute;

  top: 10%;

  right: -80px;

  width: 260px;

  height: 260px;

  border-radius: 50%;

  background: radial-gradient(circle, rgba(86, 179, 77, 0.08), transparent 70%);

}



.pbkf-timeline-wrap {

  position: relative;

  max-width: 980px;

  margin: 70px auto 0;

}



.pbkf-timeline-wrap::before {

  content: "";

  position: absolute;

  top: 0;

  left: 50%;

  transform: translateX(-50%);

  width: 3px;

  height: 100%;

  background: repeating-linear-gradient(

    to bottom,

    var(--pbkf-blue) 0,

    var(--pbkf-blue) 8px,

    transparent 8px,

    transparent 16px

  );

  border-radius: 4px;

}



.pbkf-timeline-item {

  position: relative;

  display: grid;

  grid-template-columns: 1fr 60px 1fr;

  align-items: center;

  margin-bottom: 64px;

}



.pbkf-timeline-item:last-child {

  margin-bottom: 0;

}



.pbkf-timeline-node {

  grid-column: 2;

  width: 54px;

  height: 54px;

  border-radius: 50%;

  background: var(--pbkf-white);

  border: 3px solid var(--pbkf-green);

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 2;

  box-shadow: 0 8px 18px -6px rgba(86, 179, 77, 0.4);

  transition: transform 0.4s ease;

}



.pbkf-timeline-item:hover .pbkf-timeline-node {

  transform: scale(1.12);

  background: var(--pbkf-green);

}



.pbkf-timeline-node svg {

  width: 22px;

  height: 22px;

}



.pbkf-timeline-card {

  background: var(--pbkf-light-bg);

  border-radius: 20px;

  padding: 30px 32px;

  transition:

    box-shadow 0.4s ease,

    transform 0.4s ease;

}



.pbkf-timeline-item:hover .pbkf-timeline-card {

  box-shadow: 0 18px 35px -14px rgba(18, 63, 122, 0.22);

  transform: translateY(-4px);

}



.pbkf-timeline-item:nth-child(odd) .pbkf-timeline-card {

  grid-column: 1;

  text-align: right;

}

.pbkf-timeline-item:nth-child(even) .pbkf-timeline-card {

  grid-column: 3;

  text-align: left;

}

.pbkf-timeline-item:nth-child(odd) .pbkf-timeline-spacer {

  grid-column: 3;

}

.pbkf-timeline-item:nth-child(even) .pbkf-timeline-spacer {

  grid-column: 1;

}



.pbkf-timeline-year {

  display: inline-block;

  color: var(--pbkf-orange);

  font-weight: 700;

  font-size: 14px;

  letter-spacing: 0.05em;

  margin-bottom: 8px;

}



.pbkf-timeline-title {

  font-family: "Playfair Display", serif;

  font-size: 21px;

  font-weight: 700;

  color: var(--pbkf-navy);

  margin-bottom: 10px;

}



.pbkf-timeline-desc {

  font-size: 14.5px;

  line-height: 1.75;

  color: #57647a;

}



/* ==========================================================

   5. CORE VALUES

   ========================================================== */

.pbkf-values-section {

  padding: 110px 0 130px;

  background: var(--pbkf-light-bg);

}



.pbkf-values-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 28px;

}



.pbkf-value-card {

  background: var(--pbkf-white);

  border-radius: 20px;

  padding: 38px 32px;

  border: 1px solid #ecf1f8;

  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);

  position: relative;

  overflow: hidden;

}



.pbkf-value-card::before {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(135deg, var(--pbkf-navy), var(--pbkf-blue));

  opacity: 0;

  transition: opacity 0.4s ease;

  z-index: 0;

}



.pbkf-value-card:hover {

  transform: translateY(-8px);

  border-color: transparent;

  box-shadow: 0 25px 40px -15px rgba(18, 63, 122, 0.3);

}



.pbkf-value-card:hover::before {

  opacity: 1;

}



.pbkf-value-card-inner {

  position: relative;

  z-index: 1;

}



.pbkf-value-icon-circle {

  width: 58px;

  height: 58px;

  border-radius: 16px;

  background: var(--pbkf-light-bg);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 20px;

  transition:

    transform 0.5s ease,

    background 0.4s ease;

}



.pbkf-value-card:hover .pbkf-value-icon-circle {

  background: rgba(255, 255, 255, 0.15);

  transform: scale(1.12) rotate(6deg);

}



.pbkf-value-icon-circle svg {

  width: 26px;

  height: 26px;

}

.pbkf-value-card:hover .pbkf-value-icon-circle svg .pbkf-icon-stroke {

  stroke: var(--pbkf-white);

}

.pbkf-value-card:hover .pbkf-value-icon-circle svg .pbkf-icon-fill {

  fill: var(--pbkf-white);

}



.pbkf-value-card-heading {

  font-size: 19px;

  font-weight: 700;

  color: var(--pbkf-navy);

  margin-bottom: 10px;

  transition: color 0.4s ease;

}



.pbkf-value-card:hover .pbkf-value-card-heading {

  color: var(--pbkf-white);

}



.pbkf-value-card-desc {

  font-size: 14px;

  line-height: 1.75;

  color: #63708a;

  transition: color 0.4s ease;

}



.pbkf-value-card:hover .pbkf-value-card-desc {

  color: rgba(255, 255, 255, 0.88);

}



/* ==========================================================

   6. WHY CHOOSE US

   ========================================================== */

.pbkf-why-section {

  padding: 130px 0;

  background: var(--pbkf-white);

}



.pbkf-why-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 70px;

  align-items: center;

}



.pbkf-why-heading {

  font-size: 38px;

  margin-bottom: 18px;

}



.pbkf-why-intro-text {

  margin-bottom: 34px;

  max-width: 460px;

}



.pbkf-why-feature-list {

  display: flex;

  flex-direction: column;

  gap: 16px;

}



.pbkf-why-feature-card {

  display: flex;

  align-items: center;

  gap: 18px;

  background: var(--pbkf-light-bg);

  border-radius: 16px;

  padding: 18px 22px;

  border: 1px solid transparent;

  transition: all 0.35s ease;

}



.pbkf-why-feature-card:hover {

  background: var(--pbkf-white);

  border-color: var(--pbkf-green);

  box-shadow: 0 14px 28px -12px rgba(18, 63, 122, 0.18);

  transform: translateX(6px);

}



.pbkf-why-feature-icon {

  width: 46px;

  height: 46px;

  border-radius: 12px;

  background: var(--pbkf-green);

  flex-shrink: 0;

  display: flex;

  align-items: center;

  justify-content: center;

}



.pbkf-why-feature-icon svg {

  width: 22px;

  height: 22px;

}



.pbkf-why-feature-title {

  font-size: 16px;

  font-weight: 600;

  color: var(--pbkf-navy);

}



.pbkf-why-media-col {

  position: relative;

  height: 520px;

}



.pbkf-why-img-one {

  position: absolute;

  top: 0;

  left: 0;

  width: 62%;

  height: 320px;

  border-radius: 22px;

  overflow: hidden;

  box-shadow: 0 25px 50px -18px rgba(18, 63, 122, 0.3);

  z-index: 2;

}



.pbkf-why-img-two {

  position: absolute;

  bottom: 0;

  right: 0;

  width: 55%;

  height: 260px;

  border-radius: 22px;

  overflow: hidden;

  border: 6px solid var(--pbkf-white);

  box-shadow: 0 25px 50px -18px rgba(18, 63, 122, 0.3);

  z-index: 3;

}



.pbkf-why-img-badge {

  position: absolute;

  bottom: 30px;

  left: 10px;

  z-index: 4;

  background: var(--pbkf-orange);

  color: var(--pbkf-white);

  border-radius: 18px;

  padding: 18px 22px;

  box-shadow: 0 18px 30px -10px rgba(246, 139, 31, 0.5);

}



.pbkf-why-img-badge .pbkf-badge-number {

  font-family: "Playfair Display", serif;

  font-size: 24px;

  font-weight: 800;

}

.pbkf-why-img-badge .pbkf-badge-label {

  font-size: 11px;

  font-weight: 600;

}



.pbkf-why-img-one img,

.pbkf-why-img-two img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



/* ==========================================================

   7. OUR IMPACT — STATS

   ========================================================== */

.pbkf-impact-section {

  padding: 100px 0;

  background: linear-gradient(160deg, var(--pbkf-navy) 0%, #0e3057 100%);

  position: relative;

  overflow: hidden;

}



.pbkf-impact-section .pbkf-eyebrow-label {

  background: rgba(255, 255, 255, 0.1);

  color: var(--pbkf-white);

}

.pbkf-impact-section .pbkf-heading-display {

  color: var(--pbkf-white);

}

.pbkf-impact-section .pbkf-body-text {

  color: rgba(255, 255, 255, 0.75);

}



.pbkf-impact-grid {

  display: grid;

  grid-template-columns: repeat(5, 1fr);

  gap: 22px;

  margin-top: 60px;

}



.pbkf-impact-card {

  background: rgba(255, 255, 255, 0.06);

  border: 1px solid rgba(255, 255, 255, 0.12);

  border-radius: 20px;

  padding: 32px 22px;

  text-align: center;

  transition: all 0.4s ease;

}



.pbkf-impact-card:hover {

  background: rgba(255, 255, 255, 0.12);

  transform: translateY(-8px);

  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.35);

}



.pbkf-impact-icon-circle {

  width: 54px;

  height: 54px;

  border-radius: 50%;

  background: var(--pbkf-green);

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto 18px;

  transition: transform 0.5s ease;

}



.pbkf-impact-card:hover .pbkf-impact-icon-circle {

  transform: scale(1.15) rotate(-8deg);

}

.pbkf-impact-icon-circle svg {

  width: 24px;

  height: 24px;

}



.pbkf-impact-number {

  font-family: "Playfair Display", serif;

  font-size: 34px;

  font-weight: 800;

  color: var(--pbkf-white);

  margin-bottom: 6px;

}



.pbkf-impact-label {

  font-size: 13px;

  color: rgba(255, 255, 255, 0.7);

  font-weight: 500;

  letter-spacing: 0.02em;

}



/* ==========================================================

   8. LEADERSHIP TEAM

   ========================================================== */

.pbkf-team-section {

  padding: 130px 0;

  background:#f8fafd;

}



.pbkf-team-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 28px;

}



.pbkf-team-card {

  border-radius: 22px;

  overflow: hidden;

  background: var(--pbkf-light-bg);

  box-shadow: 0 10px 26px -14px rgba(18, 63, 122, 0.16);

  transition: all 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);

}



.pbkf-team-card:hover {

  transform: translateY(-10px);

  box-shadow: 0 28px 48px -18px rgba(18, 63, 122, 0.3);

}



.pbkf-team-img-wrap {

  overflow: hidden;

  height: 260px;

}



.pbkf-team-img-wrap img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 0.6s ease;

}



.pbkf-team-card:hover .pbkf-team-img-wrap img {

  transform: scale(1.1);

}



.pbkf-team-info {

  padding: 24px 22px 28px;

  text-align: center;

}



.pbkf-team-name {

  font-family: "Playfair Display", serif;

  font-size: 19px;

  font-weight: 700;

  color: var(--pbkf-navy);

  margin-bottom: 4px;

}



.pbkf-team-role {

  font-size: 13px;

  color: var(--pbkf-orange);

  font-weight: 600;

  letter-spacing: 0.02em;

  margin-bottom: 12px;

}



.pbkf-team-bio {

  font-size: 13.5px;

  color: #63708a;

  line-height: 1.7;

  margin-bottom: 18px;

}



.pbkf-team-social-row {

  display: flex;

  justify-content: center;

  gap: 10px;

}



.pbkf-team-social-icon {

  width: 34px;

  height: 34px;

  border-radius: 50%;

  background: var(--pbkf-white);

  border: 1px solid #e1e8f2;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: all 0.35s ease;

}



.pbkf-team-social-icon:hover {

  background: var(--pbkf-blue);

  border-color: var(--pbkf-blue);

}

.pbkf-team-social-icon svg {

  width: 14px;

  height: 14px;

}

.pbkf-team-social-icon:hover svg .pbkf-icon-fill {

  fill: var(--pbkf-white);

}



/* ==========================================================

   9. GALLERY PREVIEW

   ========================================================== */

.pbkf-gallery-section {

  padding: 110px 0 130px;

  background: var(--pbkf-light-bg);

}



.pbkf-gallery-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  grid-template-rows: repeat(2, 180px);

  gap: 18px;

  margin-bottom: 54px;

}



.pbkf-gallery-item {

  position: relative;

  border-radius: 18px;

  overflow: hidden;

}



.pbkf-gallery-item.pbkf-gallery-item-wide {

  grid-column: span 2;

}

.pbkf-gallery-item.pbkf-gallery-item-tall {

  grid-row: span 2;

}



.pbkf-gallery-item img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 0.6s ease;

}



.pbkf-gallery-item:hover img {

  transform: scale(1.12);

}



.pbkf-gallery-overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(to top, rgba(18, 63, 122, 0.75), transparent 60%);

  opacity: 0;

  transition: opacity 0.4s ease;

  display: flex;

  align-items: flex-end;

  padding: 18px;

}



.pbkf-gallery-item:hover .pbkf-gallery-overlay {

  opacity: 1;

}



.pbkf-gallery-overlay-text {

  color: var(--pbkf-white);

  font-size: 13px;

  font-weight: 600;

}



.pbkf-gallery-cta-wrap {

  text-align: center;

}



/* ==========================================================

   10. TESTIMONIALS

   ========================================================== */

.pbkf-testimonials-section {

  padding: 110px 0 130px;

  background: var(--pbkf-white);

}



.pbkf-testimonials-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 28px;

}



.pbkf-testimonial-card {

  background: var(--pbkf-light-bg);

  border-radius: 22px;

  padding: 36px 32px;

  transition: all 0.4s ease;

  border: 1px solid transparent;

}



.pbkf-testimonial-card:hover {

  background: var(--pbkf-white);

  border-color: #e1e8f2;

  box-shadow: 0 22px 40px -16px rgba(18, 63, 122, 0.2);

  transform: translateY(-8px);

}



.pbkf-testimonial-quote-icon {

  font-family: "Playfair Display", serif;

  font-size: 48px;

  color: var(--pbkf-green);

  line-height: 0.5;

  margin-bottom: 14px;

  display: block;

}



.pbkf-testimonial-quote-text {

  font-size: 14.5px;

  line-height: 1.85;

  color: #4c5b73;

  margin-bottom: 26px;

  min-height: 130px;

}



.pbkf-testimonial-author-row {

  display: flex;

  align-items: center;

  gap: 14px;

}



.pbkf-testimonial-avatar {

  width: 54px;

  height: 54px;

  border-radius: 50%;

  overflow: hidden;

  border: 3px solid var(--pbkf-white);

  box-shadow: 0 6px 14px -4px rgba(18, 63, 122, 0.25);

}



.pbkf-testimonial-avatar img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.pbkf-testimonial-name {

  font-size: 15px;

  font-weight: 700;

  color: var(--pbkf-navy);

}

.pbkf-testimonial-location {

  font-size: 12.5px;

  color: #8493ab;

  margin-top: 2px;

}



/* ==========================================================

   11. CALL TO ACTION

   ========================================================== */

.pbkf-cta-section {

  position: relative;

  background: linear-gradient(

    120deg,

    var(--pbkf-navy) 0%,

    var(--pbkf-blue) 100%

  );

  padding: 150px 0 130px;

  text-align: center;

  overflow: hidden;

}



.pbkf-cta-decor-one {

  position: absolute;

  top: -60px;

  left: -60px;

  width: 220px;

  height: 220px;

  border-radius: 50%;

  background: rgba(86, 179, 77, 0.15);

}



.pbkf-cta-decor-two {

  position: absolute;

  bottom: -80px;

  right: -40px;

  width: 260px;

  height: 260px;

  border-radius: 50%;

  background: rgba(246, 139, 31, 0.12);

}



.pbkf-cta-content-wrap {

  position: relative;

  z-index: 2;

  max-width: 680px;

  margin: 0 auto;

}



.pbkf-cta-heading {

  font-family: "Playfair Display", serif;

  font-weight: 700;

  font-size: 42px;

  color: var(--pbkf-white);

  line-height: 1.25;

  margin-bottom: 20px;

}



.pbkf-cta-subtext {

  font-size: 16px;

  color: rgba(255, 255, 255, 0.82);

  line-height: 1.8;

  margin-bottom: 40px;

}

.pbkf-btn-outline-white {

  display: inline-block;

  background: transparent;

  border: 2px solid rgba(255, 255, 255, 0.6);

  color: var(--pbkf-white);

  font-size: 14px;

  font-weight: 600;

  letter-spacing: 0.03em;

  text-transform: uppercase;

  padding: 15px 32px;

  border-radius: 30px;

  transition: all 0.35s ease;

}



.pbkf-btn-outline-white:hover {

  background: var(--pbkf-white);

  color: var(--pbkf-navy);

  border-color: var(--pbkf-white);

  transform: translateY(-3px);

}



.pbkf-cta-wave-top {

  position: absolute;

  top: -2px;

  left: 0;

  width: 100%;

  line-height: 0;

  z-index: 1;

}



.pbkf-cta-wave-top svg {

  width: 100%;

  height: 80px;

  display: block;

}



/* ==========================================================

   RESPONSIVE — TABLET

   ========================================================== */

@media (max-width: 1024px) {

  .pbkf-story-grid,

  .pbkf-why-grid {

    grid-template-columns: 1fr;

    gap: 90px;

  }

  .pbkf-why-media-col {

    order: -1;

    height: 420px;

  }

  .pbkf-values-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-team-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-impact-grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .pbkf-testimonials-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-hero-heading {

    font-size: 46px;

  }

  .pbkf-gallery-grid {

    grid-template-columns: repeat(2, 1fr);

    grid-template-rows: repeat(3, 200px);

  }

  .pbkf-gallery-item.pbkf-gallery-item-tall {

    grid-row: span 1;

  }

}



/* ==========================================================

   RESPONSIVE — MOBILE

   ========================================================== */

@media (max-width: 640px) {

  .pbkf-section-container {

    padding: 0 20px;

  }

  .pbkf-hero-section {

    padding: 150px 0 110px;

    min-height: auto;

  }

  .pbkf-hero-heading {

    font-size: 34px;

  }

  .pbkf-hero-tagline-text {

    font-size: 15px;

  }

  .pbkf-story-section,

  .pbkf-vision-mission-section,

  .pbkf-journey-section,

  .pbkf-values-section,

  .pbkf-why-section,

  .pbkf-team-section,

  .pbkf-gallery-section,

  .pbkf-testimonials-section {

    padding: 70px 0;

  }

  .pbkf-story-heading,

  .pbkf-why-heading {

    font-size: 28px;

  }

  .pbkf-section-heading-wrap .pbkf-heading-display {

    font-size: 30px;

  }

  .pbkf-vm-grid,

  .pbkf-values-grid,

  .pbkf-team-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-impact-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-story-image-floating {

    width: 140px;

    right: -10px;

    bottom: -30px;

  }

  .pbkf-story-image-primary img {

    height: 320px;

  }

  .pbkf-timeline-wrap::before {

    left: 26px;

  }

  .pbkf-timeline-item {

    grid-template-columns: 60px 1fr;

  }

  .pbkf-timeline-node {

    grid-column: 1;

    width: 44px;

    height: 44px;

  }

  .pbkf-timeline-item:nth-child(odd) .pbkf-timeline-card,

  .pbkf-timeline-item:nth-child(even) .pbkf-timeline-card {

    grid-column: 2;

    text-align: left;

  }

  .pbkf-timeline-item:nth-child(odd) .pbkf-timeline-spacer,

  .pbkf-timeline-item:nth-child(even) .pbkf-timeline-spacer {

    display: none;

  }

  .pbkf-gallery-grid {

    grid-template-columns: 1fr 1fr;

    grid-template-rows: repeat(4, 150px);

  }

  .pbkf-gallery-item.pbkf-gallery-item-wide {

    grid-column: span 2;

  }

  .pbkf-cta-heading {

    font-size: 28px;

  }

  .pbkf-cta-btn-row {

    flex-direction: column;

    align-items: center;

  }

}



/* ========================================contact us page================================ */



.pbkf-contact-page {

  font-family: "Inter", sans-serif;

  color: #12233f;

  background-color: #ffffff;

  overflow-x: hidden;

}



.pbkf-contact-page img {

  max-width: 100%;

  display: block;

}



.pbkf-contact-page .pbkf-heading-font {

  font-family: "Poppins", sans-serif;

}



.pbkf-contact-page .pbkf-eyebrow {

  display: inline-block;

  background: #eaf1fc;

  color: #1e63c6;

  font-family: "Poppins", sans-serif;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 0.04em;

  padding: 7px 20px;

  border-radius: 30px;

  margin-bottom: 18px;

}



.pbkf-contact-page .pbkf-inner-container {

  max-width: 1220px;

  margin: 0 auto;

  padding: 0 32px;

}



.pbkf-contact-page .pbkf-section-pad {

  padding: 40px 0;

}



/* =========================================================

   HERO SECTION

========================================================= */

.pbkf-contact-hero {

  position: relative;

  padding: 210px 0 170px;

  background:

    linear-gradient(

      160deg,

      rgb(255 255 255 / 92%) 0%,

      rgb(255 255 255 / 52%) 55%,

      rgb(255 255 255 / 0%) 100%

    ),

    url(https://images.unsplash.com/photo-1576091160550-2173dba999ef?q=80&w=1600&auto=format&fit=crop)

      center / cover no-repeat;

  overflow: hidden;

}



.pbkf-contact-hero .pbkf-hero-decor {

  position: absolute;

  inset: 0;

  pointer-events: none;

}



.pbkf-contact-hero .pbkf-hero-decor svg {

  position: absolute;

  opacity: 0.16;

}



.pbkf-contact-hero .pbkf-decor-1 {

  top: 14%;

  left: 6%;

  width: 70px;

  animation: pbkf-float 6s ease-in-out infinite;

}

.pbkf-contact-hero .pbkf-decor-2 {

  top: 60%;

  left: 12%;

  width: 46px;

  animation: pbkf-float 7.5s ease-in-out infinite 0.6s;

}

.pbkf-contact-hero .pbkf-decor-3 {

  top: 22%;

  right: 9%;

  width: 60px;

  animation: pbkf-float 6.8s ease-in-out infinite 1s;

}

.pbkf-contact-hero .pbkf-decor-4 {

  top: 65%;

  right: 16%;

  width: 40px;

  animation: pbkf-float 5.6s ease-in-out infinite 0.3s;

}



@keyframes pbkf-float {

  0%,

  100% {

    transform: translateY(0px);

  }

  50% {

    transform: translateY(-18px);

  }

}



.pbkf-contact-hero .pbkf-hero-content {

  position: relative;

  z-index: 2;

  text-align: center;

  max-width: 760px;

  margin: 0 auto;

}



.pbkf-contact-hero .pbkf-breadcrumb {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 10px;

  font-family: "Poppins", sans-serif;

  font-size: 14px;

  font-weight: 500;

  color: rgb(0 0 0 / 85%);

  margin-bottom: 26px;

}



.pbkf-contact-hero .pbkf-breadcrumb .pbkf-crumb-current {

  color: #f68b1f;

  font-weight: 600;

}



.pbkf-contact-hero .pbkf-hero-title {

  font-family: "Poppins", sans-serif;

  font-size: 60px;

  line-height: 1.1;

  font-weight: 800;

  color: var (--navy);

  margin-bottom: 22px;

}



.pbkf-contact-hero .pbkf-hero-tagline {

  font-size: 18px;

  line-height: 1.75;

  color: rgba(255, 255, 255, 0.92);

  font-weight: 400;

  max-width: 600px;

  margin: 0 auto;

}



.pbkf-contact-hero .pbkf-hero-curve {

  position: absolute;

  left: 0;

  right: 0;

  bottom: -2px;

  line-height: 0;

  z-index: 2;

}



.pbkf-contact-hero .pbkf-hero-curve svg {

  width: 100%;

  height: auto;

  display: block;

}



/* =========================================================

   CONTACT INFO + FORM SECTION

========================================================= */

.pbkf-contact-info-section {

  background: #ffffff;

}



.pbkf-contact-info-section .pbkf-section-head {

  text-align: center;

  max-width: 700px;

  margin: 0 auto 64px;

}



.pbkf-contact-info-section .pbkf-section-title {

  font-family: "Poppins", sans-serif;

  font-size: 42px;

  font-weight: 700;

  color: #12233f;

  line-height: 1.25;

}



.pbkf-contact-info-section .pbkf-section-title .pbkf-title-accent {

  color: #1e63c6;

}



.pbkf-contact-info-grid {

  display: grid;

  grid-template-columns: 0.85fr 1.15fr;

  gap: 46px;

  align-items: start;

}



/* --- Info Cards (left) --- */

.pbkf-info-cards-col {

  display: flex;

  flex-direction: column;

  gap: 22px;

}



.pbkf-info-card {

  display: flex;

  align-items: flex-start;

  gap: 20px;

  background: #f8fafd;

  border: 1px solid #eaf0f8;

  border-radius: 22px;

  padding: 28px 26px;

  box-shadow: 0 10px 30px rgba(18, 63, 122, 0.06);

  transition:

    transform 0.35s ease,

    box-shadow 0.35s ease,

    background 0.35s ease,

    border-color 0.35s ease;

}



.pbkf-info-card:hover {

  transform: translateY(-6px);

  box-shadow: 0 20px 45px rgba(18, 63, 122, 0.14);

  background: #ffffff;

  border-color: #dce8fa;

}



.pbkf-info-card .pbkf-info-icon {

  flex-shrink: 0;

  width: 56px;

  height: 56px;

  border-radius: 16px;

  background: linear-gradient(135deg, #56b34d, #3e9a47);

  display: flex;

  align-items: center;

  justify-content: center;

  transition: transform 0.35s ease;

}



.pbkf-info-card:hover .pbkf-info-icon {

  transform: scale(1.1) rotate(-4deg);

}



.pbkf-info-card .pbkf-info-icon svg {

  width: 26px;

  height: 26px;

}



.pbkf-info-card .pbkf-info-heading {

  font-family: "Poppins", sans-serif;

  font-size: 17px;

  font-weight: 600;

  color: #12233f;

  margin-bottom: 6px;

}



.pbkf-info-card .pbkf-info-detail {

  font-size: 14.5px;

  line-height: 1.65;

  color: #52607a;

}



.pbkf-info-card.pbkf-info-emergency {

  background: linear-gradient(135deg, #12233f, #1e63c6);

  border-color: transparent;

}



.pbkf-info-card.pbkf-info-emergency .pbkf-info-heading,

.pbkf-info-card.pbkf-info-emergency .pbkf-info-detail {

  color: #ffffff;

}



.pbkf-info-card.pbkf-info-emergency .pbkf-info-icon {

  background: linear-gradient(135deg, #f68b1f, #e07200);

}



/* --- Contact Form (right) --- */

.pbkf-contact-form-wrap {

  background: #f8fafd;

  border-radius: 30px;

  padding: 46px 44px;

  box-shadow: 0 20px 55px rgba(18, 63, 122, 0.08);

  border: 1px solid #eef3fa;

}



.pbkf-contact-form-wrap .pbkf-form-heading {

  font-family: "Poppins", sans-serif;

  font-size: 26px;

  font-weight: 700;

  color: #12233f;

  margin-bottom: 8px;

}



.pbkf-contact-form-wrap .pbkf-form-subtext {

  font-size: 15px;

  color: #52607a;

  margin-bottom: 32px;

}



.pbkf-contact-form {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 22px;

}



.pbkf-form-field {

  display: flex;

  flex-direction: column;

  gap: 8px;

}



.pbkf-form-field.pbkf-field-full {

  grid-column: 1 / -1;

}



.pbkf-form-field .pbkf-field-label {

  font-family: "Poppins", sans-serif;

  font-size: 13.5px;

  font-weight: 600;

  color: #12233f;

}



.pbkf-form-field input,

.pbkf-form-field textarea {

  font-family: "Inter", sans-serif;

  font-size: 14.5px;

  color: #12233f;

  background: #ffffff;

  border: 1.5px solid #e1e9f5;

  border-radius: 14px;

  padding: 15px 18px;

  outline: none;

  transition:

    border-color 0.3s ease,

    box-shadow 0.3s ease,

    transform 0.3s ease;

  width: 100%;

}



.pbkf-form-field textarea {

  resize: none;

  height: 130px;

}



.pbkf-form-field input:focus,

.pbkf-form-field textarea:focus {

  border-color: #1e63c6;

  box-shadow: 0 0 0 4px rgba(30, 99, 198, 0.12);

  transform: translateY(-2px);

}



.pbkf-form-submit-btn {

  grid-column: 1 / -1;

  justify-self: start;

  font-family: "Poppins", sans-serif;

  font-size: 15.5px;

  font-weight: 600;

  color: #ffffff;

  background: #f68b1f;

  border: none;

  border-radius: 40px;

  padding: 17px 42px;

  cursor: pointer;

  box-shadow: 0 12px 28px rgba(246, 139, 31, 0.32);

  transition:

    background 0.3s ease,

    transform 0.3s ease,

    box-shadow 0.3s ease;

  margin-top: 6px;

}



.pbkf-form-submit-btn:hover {

  background: #e07200;

  transform: translateY(-3px);

  box-shadow: 0 16px 34px rgba(246, 139, 31, 0.4);

}



/* =========================================================

   MAP SECTION

========================================================= */

.pbkf-map-section {

  background: #f8fafd;

}



.pbkf-map-container {

  border-radius: 30px;

  overflow: hidden;

  box-shadow: 0 20px 55px rgba(18, 63, 122, 0.1);

  border: 1px solid #eaf0f8;

}



.pbkf-map-container iframe,

.pbkf-map-container .pbkf-map-placeholder {

  width: 100%;

  height: 440px;

  border: none;

  display: block;

}



.pbkf-map-container .pbkf-map-placeholder {

  background: linear-gradient(135deg, #eaf1fc, #f8fafd);

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  gap: 14px;

  color: #1e63c6;

  font-family: "Poppins", sans-serif;

  font-weight: 600;

}



/* =========================================================

   QUICK HELP SECTION

========================================================= */

.pbkf-quickhelp-section {

  background: #ffffff;

}



.pbkf-quickhelp-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 28px;

}



.pbkf-quickhelp-card {

  position: relative;

  background: #f8fafd;

  border: 1.5px solid #eef3fa;

  border-radius: 24px;

  padding: 42px 32px;

  text-align: left;

  overflow: hidden;

  transition:

    transform 0.4s ease,

    box-shadow 0.4s ease,

    border-color 0.4s ease,

    background 0.4s ease;

}



.pbkf-quickhelp-card:hover {

  transform: translateY(-10px);

  box-shadow: 0 26px 55px rgba(18, 63, 122, 0.14);

  border-color: #1e63c6;

  background: #ffffff;

}



.pbkf-quickhelp-card .pbkf-qh-icon {

  width: 64px;

  height: 64px;

  border-radius: 18px;

  background: linear-gradient(135deg, #56b34d, #3e9a47);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 24px;

  transition: transform 0.4s ease;

}



.pbkf-quickhelp-card:nth-child(2) .pbkf-qh-icon {

  background: linear-gradient(135deg, #f68b1f, #e07200);

}



.pbkf-quickhelp-card:nth-child(3) .pbkf-qh-icon {

  background: linear-gradient(135deg, #1e63c6, #12233f);

}



.pbkf-quickhelp-card:hover .pbkf-qh-icon {

  transform: scale(1.15) rotate(6deg);

}



.pbkf-quickhelp-card .pbkf-qh-icon svg {

  width: 28px;

  height: 28px;

}



.pbkf-quickhelp-card .pbkf-qh-heading {

  font-family: "Poppins", sans-serif;

  font-size: 20px;

  font-weight: 700;

  color: #12233f;

  margin-bottom: 12px;

}



.pbkf-quickhelp-card .pbkf-qh-desc {

  font-size: 14.5px;

  line-height: 1.7;

  color: #52607a;

  margin-bottom: 24px;

}



.pbkf-qh-btn {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  font-family: "Poppins", sans-serif;

  font-size: 14px;

  font-weight: 600;

  color: #1e63c6;

  text-decoration: none;

  transition:

    gap 0.3s ease,

    color 0.3s ease;

}



.pbkf-qh-btn:hover {

  gap: 14px;

  color: #f68b1f;

}



/* =========================================================

   FAQ SECTION

========================================================= */

.pbkf-faq-section {

  background: #f8fafd;

}



.pbkf-faq-layout {

  display: grid;

  grid-template-columns: 0.8fr 1.2fr;

  gap: 60px;

  align-items: start;

}



.pbkf-faq-side .pbkf-section-title {

  font-family: "Poppins", sans-serif;

  font-size: 38px;

  font-weight: 700;

  color: #12233f;

  line-height: 1.3;

  margin-bottom: 18px;

}



.pbkf-faq-side .pbkf-faq-side-text {

  font-size: 15px;

  line-height: 1.75;

  color: #52607a;

}



.pbkf-faq-accordion {

  display: flex;

  flex-direction: column;

  gap: 16px;

}



.pbkf-faq-item {

  background: #ffffff;

  border: 1.5px solid #eef3fa;

  border-radius: 18px;

  overflow: hidden;

  transition:

    border-color 0.3s ease,

    box-shadow 0.3s ease;

}



.pbkf-faq-item:hover {

  border-color: #dce8fa;

  box-shadow: 0 10px 26px rgba(18, 63, 122, 0.06);

}



.pbkf-faq-item input[type="checkbox"] {

  display: none;

}



.pbkf-faq-item .pbkf-faq-question {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 16px;

  padding: 22px 26px;

  cursor: pointer;

  font-family: "Poppins", sans-serif;

  font-size: 15.5px;

  font-weight: 600;

  color: #12233f;

}



.pbkf-faq-item .pbkf-faq-toggle {

  flex-shrink: 0;

  width: 30px;

  height: 30px;

  border-radius: 50%;

  background: #eaf1fc;

  color: #1e63c6;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 18px;

  font-weight: 700;

  transition:

    transform 0.35s ease,

    background 0.35s ease,

    color 0.35s ease;

}



.pbkf-faq-item .pbkf-faq-answer {

  max-height: 0;

  overflow: hidden;

  transition:

    max-height 0.4s ease,

    padding 0.4s ease;

  padding: 0 26px;

}



.pbkf-faq-item .pbkf-faq-answer-text {

  font-size: 14.5px;

  line-height: 1.75;

  color: #52607a;

  padding-bottom: 22px;

}



.pbkf-faq-item input[type="checkbox"]:checked ~ .pbkf-faq-answer {

  max-height: 240px;

}



.pbkf-faq-item

  input[type="checkbox"]:checked

  ~ .pbkf-faq-question

  .pbkf-faq-toggle {

  transform: rotate(45deg);

  background: #f68b1f;

  color: #ffffff;

}



.pbkf-faq-item input[type="checkbox"]:checked ~ .pbkf-faq-question {

  color: #1e63c6;

}



/* =========================================================

   SOCIAL MEDIA SECTION

========================================================= */

.pbkf-social-section {

  background: #ffffff;

  text-align: center;

}



.pbkf-social-section .pbkf-section-head {

  max-width: 620px;

  margin: 0 auto 50px;

}



.pbkf-social-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 24px;

}



.pbkf-social-card {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 16px;

  background: #f8fafd;

  border: 1.5px solid #eef3fa;

  border-radius: 22px;

  padding: 38px 20px;

  text-decoration: none;

  transition:

    transform 0.35s ease,

    box-shadow 0.35s ease,

    border-color 0.35s ease,

    background 0.4s ease;

}



.pbkf-social-card:hover {

  transform: translateY(-8px);

  box-shadow: 0 20px 40px rgba(18, 63, 122, 0.12);

  border-color: #1e63c6;

  background: linear-gradient(160deg, #12233f, #1e63c6);

}



.pbkf-social-card .pbkf-social-icon {

  width: 58px;

  height: 58px;

  border-radius: 50%;

  background: #eaf1fc;

  display: flex;

  align-items: center;

  justify-content: center;

  transition:

    background 0.35s ease,

    transform 0.35s ease;

}



.pbkf-social-card:hover .pbkf-social-icon {

  background: #f68b1f;

  transform: scale(1.1) rotate(-8deg);

}



.pbkf-social-card .pbkf-social-icon svg {

  width: 24px;

  height: 24px;

}



.pbkf-social-card .pbkf-social-name {

  font-family: "Poppins", sans-serif;

  font-size: 15px;

  font-weight: 600;

  color: #12233f;

  transition: color 0.35s ease;

}



.pbkf-social-card:hover .pbkf-social-name {

  color: #ffffff;

}



/* =========================================================

   OFFICE GALLERY

========================================================= */

.pbkf-gallery-section {

  background: #f8fafd;

}



.pbkf-gallery-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 24px;

}



.pbkf-gallery-item {

  position: relative;

  border-radius: 22px;

  overflow: hidden;

  box-shadow: 0 14px 34px rgba(18, 63, 122, 0.08);

  aspect-ratio: 3/4;

}



.pbkf-gallery-item img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 0.6s ease;

}



.pbkf-gallery-item:hover img {

  transform: scale(1.12);

}



.pbkf-gallery-item .pbkf-gallery-overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(

    180deg,

    rgba(18, 63, 122, 0) 40%,

    rgba(18, 35, 63, 0.86) 100%

  );

  display: flex;

  align-items: flex-end;

  padding: 22px;

  opacity: 0.92;

  transition: opacity 0.4s ease;

}



.pbkf-gallery-item:hover .pbkf-gallery-overlay {

  opacity: 1;

}



.pbkf-gallery-item .pbkf-gallery-label {

  font-family: "Poppins", sans-serif;

  font-size: 15.5px;

  font-weight: 600;

  color: #ffffff;

}



/* =========================================================

   CALL TO ACTION SECTION

========================================================= */

.pbkf-cta-section {

  position: relative;

  background: linear-gradient(135deg, #12233f 0%, #123f7a 55%, #1e63c6 100%);

  padding: 130px 0 50px;

  overflow: hidden;

}



.pbkf-cta-section .pbkf-cta-curve-top {

  position: absolute;

  top: -2px;

  left: 0;

  right: 0;

  line-height: 0;

  z-index: 1;

}



.pbkf-cta-section .pbkf-cta-curve-top svg {

  width: 100%;

  display: block;

}



.pbkf-cta-content {

  position: relative;

  z-index: 2;

  text-align: center;

  max-width: 720px;

  margin: 0 auto;

}



.pbkf-cta-content .pbkf-cta-heading {

  font-family: "Poppins", sans-serif;

  font-size: 46px;

  font-weight: 800;

  line-height: 1.25;

  color: #ffffff;

  margin-bottom: 22px;

}



.pbkf-cta-content .pbkf-cta-heading .pbkf-cta-accent {

  color: #56b34d;

}



.pbkf-cta-content .pbkf-cta-text {

  font-size: 16.5px;

  line-height: 1.8;

  color: rgba(255, 255, 255, 0.88);

  margin-bottom: 40px;

}



.pbkf-cta-btn {

  font-family: "Poppins", sans-serif;

  font-size: 15.5px;

  font-weight: 600;

  padding: 17px 38px;

  border-radius: 40px;

  text-decoration: none;

  transition:

    transform 0.3s ease,

    box-shadow 0.3s ease,

    background 0.3s ease;

  display: inline-flex;

  align-items: center;

  gap: 10px;

}



.pbkf-cta-btn.pbkf-cta-btn-primary {

  background: #f68b1f;

  color: #ffffff;

  box-shadow: 0 14px 30px rgba(246, 139, 31, 0.38);

}



.pbkf-cta-btn.pbkf-cta-btn-primary:hover {

  background: #e07200;

  transform: translateY(-4px);

  box-shadow: 0 18px 36px rgba(246, 139, 31, 0.46);

}



.pbkf-cta-btn.pbkf-cta-btn-secondary {

  background: transparent;

  color: #ffffff;

  border: 1.5px solid rgba(255, 255, 255, 0.55);

}



.pbkf-cta-btn.pbkf-cta-btn-secondary:hover {

  background: rgba(255, 255, 255, 0.12);

  border-color: #ffffff;

  transform: translateY(-4px);

}



/* =========================================================

   RESPONSIVE

========================================================= */

@media (max-width: 1080px) {

  .pbkf-contact-info-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-faq-layout {

    grid-template-columns: 1fr;

  }

  .pbkf-quickhelp-grid {

    grid-template-columns: 1fr 1fr;

  }

  .pbkf-social-grid {

    grid-template-columns: 1fr 1fr;

  }

  .pbkf-gallery-grid {

    grid-template-columns: 1fr 1fr;

  }

}



@media (max-width: 720px) {

  .pbkf-contact-page .pbkf-section-pad {

    padding: 70px 0;

  }

  .pbkf-contact-hero {

    padding: 160px 0 120px;

  }

  .pbkf-contact-hero .pbkf-hero-title {

    font-size: 38px;

  }

  .pbkf-contact-hero .pbkf-hero-tagline {

    font-size: 16px;

  }

  .pbkf-contact-info-section .pbkf-section-title,

  .pbkf-faq-side .pbkf-section-title {

    font-size: 30px;

  }

  .pbkf-contact-form {

    grid-template-columns: 1fr;

  }

  .pbkf-contact-form-wrap {

    padding: 34px 24px;

  }

  .pbkf-quickhelp-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-social-grid {

    grid-template-columns: 1fr 1fr;

  }

  .pbkf-gallery-grid {

    grid-template-columns: 1fr 1fr;

  }

  .pbkf-cta-content .pbkf-cta-heading {

    font-size: 32px;

  }

  .pbkf-inner-container {

    padding: 0 20px;

  }

}



@media (max-width: 480px) {

  .pbkf-social-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-gallery-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-cta-btn-row {

    flex-direction: column;

    align-items: stretch;

  }

}



/* ======================activities=============================== */



/* ==========================================================================

   BASE / RESET

   ========================================================================== */

.pbkf-activities-page * {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



.pbkf-activities-page {

  font-family: "Inter", sans-serif;

  color: #16233d;

  background-color: #ffffff;

  overflow-x: hidden;

  -webkit-font-smoothing: antialiased;

}



.pbkf-activities-page img {

  max-width: 100%;

  display: block;

}



.pbkf-activities-page a {

  text-decoration: none;

}



.pbkf-activities-page ul {

  list-style: none;

}



.pbkf-heading-font {

  font-family: "Poppins", sans-serif;

}



.pbkf-container {

  max-width: 1240px;

  margin: 0 auto;

  padding: 0 32px;

}



.pbkf-accent-text {

  color: #1e63c6;

}



.pbkf-accent-text-green {

  color: #56b34d;

}



.pbkf-section-label {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 8px 20px;

  border-radius: 999px;

  background: #f8fafd;

  border: 1px solid #e3ecfa;

  color: #1e63c6;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 13px;

  letter-spacing: 0.06em;

  text-transform: uppercase;

  margin-bottom: 18px;

}



.pbkf-section-label-dot {

  width: 7px;

  height: 7px;

  border-radius: 50%;

  background: #f68b1f;

  flex-shrink: 0;

}



.pbkf-section-heading-wrap {

  text-align: center;

  /* max-width: 680px; */

  margin: 0 auto 60px auto;

}



.pbkf-section-heading-wrap.pbkf-align-left {

  text-align: left;

  margin: 0 0 56px 0;

}



.pbkf-section-title {

  font-size: 42px;

  font-weight: 700;

  line-height: 1.25;

  color: #123f7a;

  margin-bottom: 18px;

}



.pbkf-section-desc {

  font-size: 16px;

  line-height: 1.8;

  color: #5b6b85;

}



/* ==========================================================================

   BUTTONS

   ========================================================================== */

.pbkf-btn-primary {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background: #f68b1f;

  color: #ffffff;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 14px;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  padding: 17px 34px;

  border-radius: 999px;

  box-shadow: 0 14px 28px rgba(246, 139, 31, 0.32);

  transition:

    transform 0.35s ease,

    box-shadow 0.35s ease,

    background 0.35s ease;

  border: 2px solid transparent;

}



.pbkf-btn-primary:hover {

  transform: translateY(-3px);

  box-shadow: 0 20px 36px rgba(246, 139, 31, 0.4);

  background: #e97e10;

}



.pbkf-btn-outline {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background: transparent;

  color: #ffffff;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 14px;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  padding: 15px 32px;

  border-radius: 999px;

  border: 2px solid rgba(255, 255, 255, 0.55);

  transition: all 0.35s ease;

}



.pbkf-btn-outline:hover {

  background: rgba(255, 255, 255, 0.14);

  border-color: #ffffff;

  transform: translateY(-3px);

}



.pbkf-play-btn {

  width: 54px;

  height: 54px;

  border-radius: 50%;

  background: #123f7a;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  box-shadow: 0 10px 24px rgba(18, 63, 122, 0.3);

  transition:

    transform 0.35s ease,

    background 0.35s ease;

}



.pbkf-play-btn:hover {

  transform: scale(1.08);

  background: #1e63c6;

}



.pbkf-cta-btn-row {

  display: flex;

  align-items: center;

  gap: 22px;

  flex-wrap: wrap;

}



.pbkf-hero-decor-kidney {

  position: absolute;

  opacity: 0.16;

  pointer-events: none;

}



.pbkf-hero-decor-kidney.pbkf-decor-1 {

  top: 60px;

  left: 4%;

  width: 130px;

}



.pbkf-hero-decor-kidney.pbkf-decor-2 {

  bottom: 130px;

  right: 6%;

  width: 170px;

}



.pbkf-hero-decor-circle {

  position: absolute;

  border-radius: 50%;

  background: radial-gradient(

    circle at 30% 30%,

    rgba(86, 179, 77, 0.22),

    rgba(86, 179, 77, 0)

  );

  filter: blur(2px);

}



.pbkf-hero-decor-circle.pbkf-circle-a {

  width: 220px;

  height: 220px;

  top: 20px;

  right: 12%;

}



.pbkf-hero-decor-circle.pbkf-circle-b {

  width: 140px;

  height: 140px;

  bottom: 60px;

  left: 8%;

  background: radial-gradient(

    circle at 30% 30%,

    rgba(30, 99, 198, 0.2),

    rgba(30, 99, 198, 0)

  );

}



.pbkf-hero-inner {

  position: relative;

  z-index: 2;

  display: flex;

  flex-direction: column;

  align-items: center;

  text-align: center;

}



.pbkf-breadcrumb {

  display: flex;

  align-items: center;

  gap: 10px;

  font-size: 14px;

  font-weight: 600;

  color: #5b6b85;

  margin-bottom: 26px;

}



.pbkf-breadcrumb-current {

  color: #f68b1f;

}



.pbkf-breadcrumb-sep {

  color: #9aaac4;

}



.pbkf-hero-title {

  font-size: 68px;

  font-weight: 800;

  line-height: 1.08;

  color: #123f7a;

  margin-bottom: 26px;

}



.pbkf-hero-title-accent {

  color: #56b34d;

  font-style: italic;

}



.pbkf-hero-tagline {

  max-width: 620px;

  font-size: 18px;

  line-height: 1.8;

  color: #4b5b76;

  margin-bottom: 44px;

}



.pbkf-hero-stat-strip {

  display: flex;

  gap: 46px;

  flex-wrap: wrap;

  justify-content: center;

  margin-top: 56px;

  padding-top: 40px;

  border-top: 1px solid #dde7f6;

}



.pbkf-hero-stat-item {

  display: flex;

  align-items: center;

  gap: 14px;

}



.pbkf-hero-stat-icon {

  width: 46px;

  height: 46px;

  border-radius: 50%;

  background: #123f7a;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  flex-shrink: 0;

}



.pbkf-hero-stat-number {

  font-family: "Poppins", sans-serif;

  font-weight: 700;

  font-size: 20px;

  color: #123f7a;

}



.pbkf-hero-stat-label {

  font-size: 13px;

  color: #6c7b95;

  font-weight: 500;

}



.pbkf-hero-curve {

  position: absolute;

  left: 0;

  bottom: -2px;

  width: 100%;

  line-height: 0;

  z-index: 1;

}



/* ==========================================================================

   INTRODUCTION SECTION

   ========================================================================== */

.pbkf-intro-section {

  padding: 130px 0;

  background: #ffffff;

}



.pbkf-intro-grid {

  display: grid;

  grid-template-columns: 0.9fr 1.1fr;

  gap: 80px;

  align-items: center;

}



.pbkf-intro-media {

  position: relative;

}



.pbkf-intro-media-main {

  border-radius: 28px;

  overflow: hidden;

  box-shadow: 0 30px 60px rgba(18, 63, 122, 0.16);

  position: relative;

}



.pbkf-intro-media-main img {

  width: 100%;

  height: 560px;

  object-fit: cover;

  transition: transform 0.6s ease;

}



.pbkf-intro-media-main:hover img {

  transform: scale(1.05);

}



.pbkf-intro-media-float {

  position: absolute;

  bottom: -30px;

  right: -30px;

  width: 200px;

  height: 200px;

  border-radius: 20px;

  overflow: hidden;

  border: 6px solid #ffffff;

  box-shadow: 0 20px 40px rgba(18, 63, 122, 0.2);

}



.pbkf-intro-media-float img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.pbkf-intro-media-badge {

  position: absolute;

  top: 32px;

  left: -28px;

  background: #56b34d;

  color: #ffffff;

  border-radius: 18px;

  padding: 18px 22px;

  box-shadow: 0 18px 30px rgba(86, 179, 77, 0.35);

  text-align: center;
  z-index: 1;

}



.pbkf-intro-media-badge-number {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 30px;

  line-height: 1;

}



.pbkf-intro-media-badge-label {

  font-size: 12px;

  font-weight: 600;

  margin-top: 4px;

  opacity: 0.92;

}



.pbkf-intro-content-body {

  font-size: 16px;

  line-height: 1.9;

  color: #5b6b85;

  margin-bottom: 20px;

}



.pbkf-intro-quote {

  display: flex;

  gap: 18px;

  align-items: flex-start;

  background: #f8fafd;

  border-left: 4px solid #56b34d;

  border-radius: 16px;

  padding: 26px 28px;

  margin: 30px 0 36px 0;

}



.pbkf-intro-quote-icon {

  color: #56b34d;

  flex-shrink: 0;

}



.pbkf-intro-quote-text {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-style: italic;

  font-size: 17px;

  color: #123f7a;

  line-height: 1.6;

}



/* ==========================================================================

   ACTIVITIES CARD GRID SECTION

   ========================================================================== */

.pbkf-activities-grid-section {

  padding: 130px 0;

  background: #f8fafd;

  position: relative;

}



.pbkf-activities-cards-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 32px;

}



.pbkf-activity-card {

  background: #ffffff;

  border-radius: 22px;

  padding: 40px 32px;

  box-shadow: 0 16px 40px rgba(18, 63, 122, 0.07);

  border: 1px solid #eef3fb;

  transition:

    transform 0.4s ease,

    box-shadow 0.4s ease,

    border-color 0.4s ease;

  position: relative;

  overflow: hidden;

}



.pbkf-activity-card::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 4px;

  background: linear-gradient(90deg, #56b34d, #1e63c6);

  transform: scaleX(0);

  transform-origin: left;

  transition: transform 0.45s ease;

}



.pbkf-activity-card:hover {

  transform: translateY(-10px);

  box-shadow: 0 30px 60px rgba(18, 63, 122, 0.14);

  border-color: transparent;

}



.pbkf-activity-card:hover::before {

  transform: scaleX(1);

}



.pbkf-activity-icon-circle {

  width: 66px;

  height: 66px;

  border-radius: 18px;

  background: #56b34d;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  margin-bottom: 26px;

  transition:

    transform 0.4s ease,

    border-radius 0.4s ease;

}



.pbkf-activity-card:hover .pbkf-activity-icon-circle {

  transform: scale(1.1) rotate(-6deg);

  border-radius: 50%;

}



.pbkf-activity-title {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 19px;

  color: #123f7a;

  margin-bottom: 12px;

}



.pbkf-activity-desc {

  font-size: 14.5px;

  line-height: 1.75;

  color: #6c7b95;

  margin-bottom: 22px;

}



.pbkf-activity-link {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  font-weight: 600;

  font-size: 14px;

  color: #1e63c6;

  padding-top: 16px;

  border-top: 1px dashed #e3ecfa;

  width: 100%;

  transition:

    gap 0.35s ease,

    color 0.35s ease;

}



.pbkf-activity-link:hover {

  gap: 13px;

  color: #f68b1f;

}



.pbkf-activity-link svg {

  transition: transform 0.35s ease;

}



.pbkf-activity-link:hover svg {

  transform: translateX(3px) translateY(-3px);

}



/* ==========================================================================

   IMPACT STATISTICS SECTION

   ========================================================================== */

.pbkf-impact-section {

  position: relative;

  background: #123f7a;

  padding: 150px 0 130px 0;

  overflow: hidden;

}



.pbkf-impact-curve-top {

  position: absolute;

  top: -2px;

  left: 0;

  width: 100%;

  line-height: 0;

}



.pbkf-impact-decor-kidney {

  position: absolute;

  opacity: 0.08;

  pointer-events: none;

}



.pbkf-impact-decor-kidney.pbkf-impact-decor-1 {

  top: 100px;

  right: 6%;

  width: 200px;

}



.pbkf-impact-decor-kidney.pbkf-impact-decor-2 {

  bottom: 60px;

  left: 4%;

  width: 150px;

}



.pbkf-impact-heading-wrap .pbkf-section-title,

.pbkf-impact-heading-wrap .pbkf-section-desc {

  color: #ffffff;

}



.pbkf-impact-heading-wrap .pbkf-section-desc {

  color: #c6d5ee;

}



.pbkf-impact-stats-grid {

  display: grid;

  grid-template-columns: repeat(5, 1fr);

  gap: 24px;

  position: relative;

  z-index: 2;

}



.pbkf-impact-stat-card {

  background: rgba(255, 255, 255, 0.06);

  border: 1px solid rgba(255, 255, 255, 0.14);

  border-radius: 22px;

  padding: 36px 22px;

  text-align: center;

  backdrop-filter: blur(6px);

  transition:

    transform 0.4s ease,

    background 0.4s ease;

}



.pbkf-impact-stat-card:hover {

  transform: translateY(-8px);

  background: rgba(255, 255, 255, 0.11);

}



.pbkf-impact-stat-icon {

  width: 56px;

  height: 56px;

  border-radius: 50%;

  background: #f68b1f;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  margin: 0 auto 20px auto;

}



.pbkf-impact-stat-number {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 36px;

  color: #ffffff;

  margin-bottom: 8px;

}



.pbkf-impact-stat-label {

  font-size: 13.5px;

  font-weight: 500;

  color: #c6d5ee;

  line-height: 1.5;

}



/* ==========================================================================

   GALLERY SECTION

   ========================================================================== */

.pbkf-gallery-section {

  padding: 130px 0;

  background: #ffffff;

}



.pbkf-gallery-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  grid-auto-rows: 260px;

  gap: 24px;

}



.pbkf-gallery-item {

  position: relative;

  border-radius: 22px;

  overflow: hidden;

  box-shadow: 0 16px 34px rgba(18, 63, 122, 0.1);

}



.pbkf-gallery-item.pbkf-gallery-tall {

  grid-row: span 2;

}



.pbkf-gallery-item img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 0.6s ease;

}



.pbkf-gallery-item:hover img {

  transform: scale(1.12);

}



.pbkf-gallery-overlay {

  position: absolute;

  inset: 0;

  background: linear-gradient(

    0deg,

    rgba(18, 63, 122, 0.85) 0%,

    rgba(18, 63, 122, 0.05) 55%,

    rgba(18, 63, 122, 0) 100%

  );

  display: flex;

  align-items: flex-end;

  padding: 26px;

  opacity: 0;

  transition: opacity 0.4s ease;

}



.pbkf-gallery-item:hover .pbkf-gallery-overlay {

  opacity: 1;

}



.pbkf-gallery-caption {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 17px;

  color: #ffffff;

}



/* ==========================================================================

   WORKING PROCESS SECTION

   ========================================================================== */

.pbkf-process-section {

  padding: 40px 0;

  background: #f8fafd;

  position: relative;

}



.pbkf-process-steps-row {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 30px;

  position: relative;

}



.pbkf-process-connector-line {

  position: absolute;

  top: 44px;

  left: 12.5%;

  right: 12.5%;

  height: 2px;

  background-image: linear-gradient(

    90deg,

    #1e63c6 40%,

    rgba(255, 255, 255, 0) 0%

  );

  background-position: top;

  background-size: 16px 2px;

  background-repeat: repeat-x;

  z-index: 0;

}



.pbkf-process-step-card {

  position: relative;

  z-index: 1;

  text-align: center;

}



.pbkf-process-step-number {

  width: 88px;

  height: 88px;

  border-radius: 50%;

  background: #ffffff;

  border: 2px solid #e3ecfa;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto 26px auto;

  color: #1e63c6;

  box-shadow: 0 14px 30px rgba(18, 63, 122, 0.08);

  transition: all 0.4s ease;

}



.pbkf-process-step-card:hover .pbkf-process-step-number {

  background: #1e63c6;

  color: #ffffff;

  border-color: #1e63c6;

  transform: scale(1.08);

}



.pbkf-process-step-tag {

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 0.08em;

  color: #f68b1f;

  text-transform: uppercase;

  margin-bottom: 10px;

}



.pbkf-process-step-title {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 18px;

  color: #123f7a;

  margin-bottom: 12px;

}



.pbkf-process-step-desc {

  font-size: 14px;

  line-height: 1.7;

  color: #6c7b95;

  padding: 0 8px;

}



/* ==========================================================================

   SUCCESS STORIES SECTION

   ========================================================================== */

.pbkf-testimonials-section {

  padding: 40px 0;

  background: #ffffff;

}



.pbkf-testimonials-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



.pbkf-testimonial-card {

  background: #f8fafd;

  border-radius: 24px;

  padding: 40px 34px;

  position: relative;

  transition:

    transform 0.4s ease,

    box-shadow 0.4s ease;

  border: 1px solid #eef3fb;

}



.pbkf-testimonial-card:hover {

  transform: translateY(-8px);

  box-shadow: 0 26px 50px rgba(18, 63, 122, 0.12);

  background: #ffffff;

}



.pbkf-testimonial-quote-icon {

  color: #e3ecfa;

  margin-bottom: 18px;

}



.pbkf-testimonial-story {

  font-size: 15px;

  line-height: 1.85;

  color: #4b5b76;

  margin-bottom: 28px;

  min-height: 130px;

}



.pbkf-testimonial-person {

  display: flex;

  align-items: center;

  gap: 16px;

  padding-top: 24px;

  border-top: 1px solid #e3ecfa;

}



.pbkf-testimonial-photo {

  width: 58px;

  height: 58px;

  border-radius: 50%;

  overflow: hidden;

  flex-shrink: 0;

  border: 3px solid #ffffff;

  box-shadow: 0 8px 18px rgba(18, 63, 122, 0.15);

}



.pbkf-testimonial-photo img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.pbkf-testimonial-name {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 15.5px;

  color: #123f7a;

}



.pbkf-testimonial-location {

  font-size: 13px;

  color: #8593ab;

  margin-top: 3px;

  display: flex;

  align-items: center;

  gap: 5px;

}



/* ==========================================================================

   FINAL CTA SECTION

   ========================================================================== */

.pbkf-final-cta-section {

  position: relative;

  background: #123f7a;

  padding: 150px 0 130px 0;

  overflow: hidden;

  text-align: center;

}



.pbkf-final-cta-curve-top {

  position: absolute;

  top: -2px;

  left: 0;

  width: 100%;

  line-height: 0;

}



.pbkf-final-cta-decor {

  position: absolute;

  opacity: 0.1;

  pointer-events: none;

}



.pbkf-final-cta-decor.pbkf-fc-decor-1 {

  top: 70px;

  left: 6%;

  width: 160px;

}



.pbkf-final-cta-decor.pbkf-fc-decor-2 {

  bottom: 40px;

  right: 8%;

  width: 190px;

}



.pbkf-final-cta-inner {

  position: relative;

  z-index: 2;

  max-width: 720px;

  margin: 0 auto;

}



.pbkf-final-cta-title {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 46px;

  line-height: 1.2;

  color: #ffffff;

  margin-bottom: 22px;

}



.pbkf-final-cta-desc {

  font-size: 16.5px;

  line-height: 1.85;

  color: #c6d5ee;

  margin-bottom: 42px;

}



.pbkf-final-cta-buttons {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 22px;

  flex-wrap: wrap;

}



/* ==========================================================================

   RESPONSIVE

   ========================================================================== */

@media (max-width: 1100px) {

  .pbkf-activities-cards-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-impact-stats-grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .pbkf-gallery-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-testimonials-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-process-steps-row {

    grid-template-columns: repeat(2, 1fr);

    row-gap: 60px;

  }

  .pbkf-process-connector-line {

    display: none;

  }

  .pbkf-hero-title {

    font-size: 54px;

  }

}



@media (max-width: 900px) {

  .pbkf-intro-grid {

    grid-template-columns: 1fr;

    gap: 100px;

  }

  .pbkf-intro-media-float {

    width: 150px;

    height: 150px;

    right: 10px;

  }

}



@media (max-width: 720px) {

  .pbkf-container {

    padding: 0 20px;

  }

  .pbkf-hero-section {

    padding: 130px 0 120px 0;

  }

  .pbkf-hero-title {

    font-size: 38px;

  }

  .pbkf-hero-tagline {

    font-size: 15.5px;

  }

  .pbkf-section-title {

    font-size: 30px;

  }

  .pbkf-final-cta-title {

    font-size: 32px;

  }

  .pbkf-activities-cards-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-impact-stats-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-gallery-grid {

    grid-template-columns: 1fr;

    grid-auto-rows: 220px;

  }

  .pbkf-gallery-item.pbkf-gallery-tall {

    grid-row: span 1;

  }

  .pbkf-testimonials-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-process-steps-row {

    grid-template-columns: 1fr;

  }

  .pbkf-hero-stat-strip {

    gap: 26px 32px;

  }

  .pbkf-intro-section,

  .pbkf-activities-grid-section,

  .pbkf-gallery-section,

  .pbkf-process-section,

  .pbkf-testimonials-section {

    padding: 90px 0;

  }

  .pbkf-impact-section,

  .pbkf-final-cta-section {

    padding: 110px 0 90px 0;

  }

  .pbkf-final-cta-buttons {

    flex-direction: column;

  }

  .pbkf-final-cta-buttons a {

    width: 100%;

    justify-content: center;

  }

}



@media (max-width: 480px) {

  .pbkf-impact-stats-grid {

    grid-template-columns: 1fr 1fr;

  }

  .pbkf-hero-title {

    font-size: 32px;

  }

  .pbkf-intro-media-badge {

    left: 0;

  }

}



/* ============================popup======================================= */



.pbkf-donate-demo-page * {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



.pbkf-donate-demo-page {

}



.pbkf-donate-demo-page img {

  max-width: 100%;

  display: block;

}

.pbkf-donate-demo-page ul {

  list-style: none;

}

.pbkf-donate-demo-page a {

  text-decoration: none;

  color: inherit;

}



.pbkf-heading-font {

  font-family: "Poppins", sans-serif;

}



/* ==========================================================================

   DEMO PAGE TRIGGER (for preview purposes only)

   ========================================================================== */

.pbkf-donate-demo-content {

  text-align: center;

  max-width: 480px;

}



.pbkf-donate-demo-title {

  font-family: "Poppins", sans-serif;

  font-weight: 700;

  font-size: 28px;

  color: #123f7a;

  margin-bottom: 14px;

}



.pbkf-donate-demo-desc {

  font-size: 15px;

  line-height: 1.8;

  color: #5b6b85;

  margin-bottom: 32px;

}



.pbkf-donate-trigger-btn {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background: linear-gradient(135deg, #f68b1f, #f6a446);

  color: #ffffff;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 14px;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  padding: 18px 40px;

  border-radius: 10px;

  cursor: pointer;

  box-shadow: 0 16px 32px rgba(246, 139, 31, 0.34);

  transition:

    transform 0.35s ease,

    box-shadow 0.35s ease;

  border: none;

}



.pbkf-donate-trigger-btn:hover {

  transform: translateY(-3px);

  box-shadow: 0 22px 40px rgba(246, 139, 31, 0.42);

}



/* ==========================================================================

   CHECKBOX TOGGLE (CSS-only open/close mechanism, no JavaScript)

   ========================================================================== */

.pbkf-donate-toggle-input {

  position: absolute;

  opacity: 0;

  pointer-events: none;

  width: 0;

  height: 0;

}



/* ==========================================================================

   OVERLAY

   ========================================================================== */

.pbkf-donate-overlay {

  position: fixed;

  inset: 0;

  z-index: 999;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 30px 16px;

  visibility: hidden;

  opacity: 0;

  background: rgba(10, 22, 46, 0.6);

  backdrop-filter: blur(6px);

  -webkit-backdrop-filter: blur(6px);

  transition:

    opacity 0.4s ease,

    visibility 0.4s ease;

  overflow-y: auto;

}



.pbkf-donate-toggle-input:checked ~ .pbkf-donate-overlay {

  visibility: visible;

  opacity: 1;

}



.pbkf-donate-overlay-backdrop {

  position: absolute;

  inset: 0;

  z-index: 1;

  cursor: pointer;

}



/* ==========================================================================

   MODAL CARD

   ========================================================================== */

.pbkf-donate-modal-card {

  position: relative;

  z-index: 2;

  width: 100%;

  max-width: 620px;

  background: #ffffff;

  border-radius: 24px;

  box-shadow: 0 40px 90px rgba(18, 63, 122, 0.35);

  overflow: hidden;

  margin: auto;

  transform: scale(0.9) translateY(30px);

  opacity: 0;

  transition:

    transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1),

    opacity 0.4s ease;

}



.pbkf-donate-toggle-input:checked

  ~ .pbkf-donate-overlay

  .pbkf-donate-modal-card {

  transform: scale(1) translateY(0);

  opacity: 1;

}



.pbkf-donate-modal-scroll {

  max-height: 88vh;

  overflow-y: auto;

  padding: 46px 46px 38px 46px;

  position: relative;

}



.pbkf-donate-modal-scroll::-webkit-scrollbar {

  width: 7px;

}

.pbkf-donate-modal-scroll::-webkit-scrollbar-thumb {

  background: #dce7f8;

  border-radius: 10px;

}

.pbkf-donate-modal-scroll::-webkit-scrollbar-track {

  background: transparent;

}



/* Decorative background elements */

.pbkf-donate-modal-decor {

  position: absolute;

  opacity: 0.07;

  pointer-events: none;

  z-index: 0;

}



.pbkf-donate-modal-decor.pbkf-decor-top {

  top: -20px;

  right: -30px;

  width: 160px;

}



.pbkf-donate-modal-decor.pbkf-decor-bottom {

  bottom: 10px;

  left: -30px;

  width: 130px;

}



/* ==========================================================================

   CLOSE BUTTON

   ========================================================================== */

.pbkf-donate-close-btn {

  position: absolute;

  top: 22px;

  right: 22px;

  z-index: 5;

  width: 42px;

  height: 42px;

  border-radius: 50%;

  background: #f8fafd;

  border: 1px solid #e3ecfa;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #123f7a;

  cursor: pointer;

  box-shadow: 0 8px 20px rgba(18, 63, 122, 0.1);

  transition: all 0.35s ease;

}



.pbkf-donate-close-btn:hover {

  background: #f68b1f;

  color: #ffffff;

  transform: rotate(90deg);

  box-shadow: 0 12px 24px rgba(246, 139, 31, 0.35);

}



/* ==========================================================================

   POPUP HEADER

   ========================================================================== */

.pbkf-donate-header {

  position: relative;

  z-index: 2;

  text-align: center;

  margin-bottom: 34px;

}



.pbkf-donate-header-icon {

  width: 68px;

  height: 68px;

  border-radius: 20px;

  background: linear-gradient(135deg, #56b34d, #3f9e37);

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  margin: 0 auto 20px auto;

  box-shadow: 0 16px 30px rgba(86, 179, 77, 0.32);

  transition: transform 0.4s ease;

}



.pbkf-donate-header-icon:hover {

  transform: scale(1.08) rotate(-4deg);

}



.pbkf-donate-header-title {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 27px;

  color: #123f7a;

  margin-bottom: 12px;

}



.pbkf-donate-header-desc {

  font-size: 14.5px;

  line-height: 1.75;

  color: #5b6b85;

  max-width: 440px;

  margin: 0 auto;

}



/* ==========================================================================

   FORM SECTION LABELS

   ========================================================================== */

.pbkf-donate-section {

  position: relative;

  z-index: 2;

  margin-bottom: 30px;

}



.pbkf-donate-section-label {

  display: flex;

  align-items: center;

  gap: 8px;

  font-family: "Inter", sans-serif;

  font-weight: 700;

  font-size: 12.5px;

  letter-spacing: 0.05em;

  text-transform: uppercase;

  color: #1e63c6;

  margin-bottom: 16px;

}



.pbkf-donate-section-label-dot {

  width: 6px;

  height: 6px;

  border-radius: 50%;

  background: #f68b1f;

  flex-shrink: 0;

}



/* ==========================================================================

   DONATION AMOUNT CARDS

   ========================================================================== */

.pbkf-donate-amount-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 12px;

}



.pbkf-donate-amount-radio {

  position: absolute;

  opacity: 0;

  pointer-events: none;

  width: 0;

  height: 0;

}



.pbkf-donate-amount-option {

  display: flex;

  align-items: center;

  justify-content: center;

  text-align: center;

  padding: 16px 8px;

  border-radius: 16px;

  border: 1.5px solid #e3ecfa;

  background: #f8fafd;

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 15px;

  color: #123f7a;

  cursor: pointer;

  transition: all 0.3s ease;

  user-select: none;

}



.pbkf-donate-amount-option:hover {

  border-color: #1e63c6;

  transform: translateY(-3px);

  box-shadow: 0 12px 22px rgba(18, 63, 122, 0.1);

}



.pbkf-donate-amount-radio:checked + .pbkf-donate-amount-option {

  background: linear-gradient(135deg, #1e63c6, #123f7a);

  border-color: #123f7a;

  color: #ffffff;

  transform: translateY(-3px);

  box-shadow: 0 16px 28px rgba(18, 63, 122, 0.28);

}



.pbkf-donate-other-amount-wrap {

  margin-top: 14px;

  max-height: 0;

  opacity: 0;

  overflow: hidden;

  transition:

    max-height 0.4s ease,

    opacity 0.4s ease,

    margin-top 0.4s ease;

}



#pbkf-amount-other:checked ~ .pbkf-donate-other-amount-wrap {

  max-height: 90px;

  opacity: 1;

}



/* ==========================================================================

   FORM FIELDS

   ========================================================================== */

.pbkf-donate-form-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 18px;

}



.pbkf-donate-field-full {

  grid-column: 1 / -1;

}



.pbkf-donate-field {

  display: flex;

  flex-direction: column;

  gap: 8px;

}



.pbkf-donate-field-label {

  font-size: 13px;

  font-weight: 600;

  color: #123f7a;

}



.pbkf-donate-input,

.pbkf-donate-textarea {

  width: 100%;

  font-family: "Inter", sans-serif;

  font-size: 14.5px;

  color: #16233d;

  background: #f8fafd;

  border: 1.5px solid #e3ecfa;

  border-radius: 14px;

  padding: 14px 16px;

  transition:

    border-color 0.3s ease,

    box-shadow 0.3s ease,

    background 0.3s ease;

}



.pbkf-donate-textarea {

  resize: none;

  min-height: 90px;

  font-family: "Inter", sans-serif;

}



.pbkf-donate-input::placeholder,

.pbkf-donate-textarea::placeholder {

  color: #9aaac4;

}



.pbkf-donate-input:focus,

.pbkf-donate-textarea:focus {

  outline: none;

  border-color: #1e63c6;

  background: #ffffff;

  box-shadow: 0 0 0 4px rgba(30, 99, 198, 0.12);

}



/* ==========================================================================

   PAYMENT METHOD CARDS

   ========================================================================== */

.pbkf-donate-payment-grid {

  display: grid;

  grid-template-columns: repeat(5, 1fr);

  gap: 10px;

}



.pbkf-donate-payment-radio {

  position: absolute;

  opacity: 0;

  pointer-events: none;

  width: 0;

  height: 0;

}



.pbkf-donate-payment-option {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 8px;

  padding: 16px 6px;

  border-radius: 16px;

  border: 1.5px solid #e3ecfa;

  background: #f8fafd;

  cursor: pointer;

  transition: all 0.3s ease;

  text-align: center;

}



.pbkf-donate-payment-icon {

  width: 32px;

  height: 32px;

  border-radius: 10px;

  background: #ffffff;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #1e63c6;

  transition: all 0.3s ease;

}



.pbkf-donate-payment-label {

  font-size: 11.5px;

  font-weight: 600;

  color: #123f7a;

}



.pbkf-donate-payment-option:hover {

  border-color: #1e63c6;

  transform: translateY(-3px);

  box-shadow: 0 12px 22px rgba(18, 63, 122, 0.1);

}



.pbkf-donate-payment-radio:checked + .pbkf-donate-payment-option {

  border-color: #56b34d;

  background: #ffffff;

  box-shadow: 0 14px 26px rgba(86, 179, 77, 0.22);

}



.pbkf-donate-payment-radio:checked

  + .pbkf-donate-payment-option

  .pbkf-donate-payment-icon {

  background: #56b34d;

  color: #ffffff;

  transform: scale(1.12);

}



.pbkf-donate-payment-radio:checked

  + .pbkf-donate-payment-option

  .pbkf-donate-payment-label {

  color: #56b34d;

}



/* ==========================================================================

   DONATION SUMMARY

   ========================================================================== */

.pbkf-donate-summary-card {

  background: #f8fafd;

  border: 1px solid #e3ecfa;

  border-radius: 18px;

  padding: 24px 26px;

}



.pbkf-donate-summary-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  font-size: 14px;

  color: #5b6b85;

  padding: 9px 0;

}



.pbkf-donate-summary-row-value {

  font-weight: 600;

  color: #123f7a;

}



.pbkf-donate-summary-divider {

  height: 1px;

  background: #e3ecfa;

  margin: 8px 0;

}



.pbkf-donate-summary-total-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding-top: 10px;

}



.pbkf-donate-summary-total-label {

  font-family: "Poppins", sans-serif;

  font-weight: 600;

  font-size: 16px;

  color: #123f7a;

}



.pbkf-donate-summary-total-value {

  font-family: "Poppins", sans-serif;

  font-weight: 800;

  font-size: 24px;

  color: #56b34d;

}



/* ==========================================================================

   CTA BUTTONS

   ========================================================================== */

.pbkf-donate-cta-row {

  display: flex;

  align-items: center;

  gap: 16px;

  margin-top: 8px;

}



.pbkf-donate-submit-btn {

  flex: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

  background: linear-gradient(135deg, #f68b1f, #f6a446);

  color: #ffffff;

  font-family: "Inter", sans-serif;

  font-weight: 700;

  font-size: 15px;

  letter-spacing: 0.02em;

  padding: 18px 20px;

  border-radius: 999px;

  border: none;

  cursor: pointer;

  box-shadow: 0 16px 32px rgba(246, 139, 31, 0.34);

  transition:

    transform 0.35s ease,

    box-shadow 0.35s ease;

}



.pbkf-donate-submit-btn:hover {

  transform: translateY(-3px);

  box-shadow: 0 22px 40px rgba(246, 139, 31, 0.42);

}



.pbkf-donate-cancel-btn {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 18px 26px;

  border-radius: 999px;

  border: 1.5px solid #e3ecfa;

  background: #ffffff;

  color: #5b6b85;

  font-family: "Inter", sans-serif;

  font-weight: 600;

  font-size: 14.5px;

  cursor: pointer;

  transition: all 0.3s ease;

}



.pbkf-donate-cancel-btn:hover {

  background: #f8fafd;

  border-color: #c9d8ef;

  color: #123f7a;

}



/* ==========================================================================

   TRUST SECTION

   ========================================================================== */

.pbkf-donate-trust-grid {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 14px 20px;

  margin-top: 30px;

  padding-top: 26px;

  border-top: 1px dashed #e3ecfa;

}



.pbkf-donate-trust-item {

  display: flex;

  align-items: center;

  gap: 10px;

}



.pbkf-donate-trust-icon {

  width: 34px;

  height: 34px;

  border-radius: 50%;

  background: #f8fafd;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #56b34d;

  flex-shrink: 0;

}



.pbkf-donate-trust-label {

  font-size: 12.5px;

  font-weight: 600;

  color: #4b5b76;

  line-height: 1.4;

}



/* ==========================================================================

   RESPONSIVE

   ========================================================================== */

@media (max-width: 620px) {

  .pbkf-donate-modal-scroll {

    padding: 60px 26px 30px 26px;

  }

  .pbkf-donate-header-title {

    font-size: 23px;

  }

  .pbkf-donate-amount-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  .pbkf-donate-payment-grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .pbkf-donate-form-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-donate-trust-grid {

    grid-template-columns: 1fr;

  }

  .pbkf-donate-cta-row {

    flex-direction: column-reverse;

  }

  .pbkf-donate-cancel-btn,

  .pbkf-donate-submit-btn {

    width: 100%;

  }

}



@media (max-width: 380px) {

  .pbkf-donate-payment-grid {

    grid-template-columns: repeat(3, 1fr);

  }

  .pbkf-donate-amount-grid {

    grid-template-columns: repeat(2, 1fr);

  }

}

/* GALLERY-CSS */
    /* faint decorative kidney-bean blob, echoes hero shapes */
  .gallery-section::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -140px;
    width: 420px;
    height: 420px;
    border-radius: 42% 58% 65% 35% / 45% 40% 60% 55%;
    background: linear-gradient(135deg, rgba(63,161,74,0.08), rgba(14,42,94,0.06));
    z-index: 0;
  }
 
  .gallery-inner {
    position: relative;
    z-index: 1;
    /* max-width: 1280px; */
    /* margin: 0 auto; */
  }
 
  /* ---- Header ---- */
  .gallery-header { text-align: center; margin-bottom: 46px; }
 
  .gallery-eyebrow {
    display: inline-block;
    background: #e7ebf1;
    color: var(--text-dark);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 7px 20px;
    border-radius: 20px;
    margin-bottom: 18px;
  }
 
  .gallery-heading {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4vw, 42px);
    color: var(--navy);
    margin: 0 0 14px;
    line-height: 1.2;
  }
  .gallery-heading span { color: var(--orange); }
 
  .gallery-sub {
    max-width: 620px;
    margin: 0 auto;
    color: var(--text-gray);
    font-size: 15.5px;
    line-height: 1.7;
  }
 
  /* ---- Filter tabs ---- */
  .gallery-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 36px 0 44px;
  }
  .gallery-filter-btn {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 14px;
    color: var(--navy);
    background: #fff;
    border: 1.5px solid #e1e6ee;
    padding: 10px 22px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.25s ease;
  }
  .gallery-filter-btn:hover {
    border-color: var(--orange);
    color: var(--orange-deep);
  }
  .gallery-filter-btn.active {
    background:#55b34e;
    border-color:#55b34e;
    color: #fff;
    box-shadow: 0 8px 18px rgba(244,121,31,0.28);
  }
 
  /* ---- Masonry-style grid ---- */
  .gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 130px;
    gap: 18px;
  }
 
  .gallery-item {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    grid-row: span 2;
    cursor: pointer;
    background: #dfe4ea;
    display: block;
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.35s ease, transform 0.35s ease;
  }
  .gallery-item.is-hidden {
    display: none;
  }
 
  .gallery-item.tall  { grid-row: span 3; }
  .gallery-item.wide  { grid-column: span 2; grid-row: span 2; }
 
  .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.55s ease;
  }
  .gallery-item:hover img { transform: scale(1.08); }
 
  .gallery-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8,27,63,0) 40%, rgba(8,27,63,0.88) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 16px;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .gallery-item:hover .gallery-overlay { opacity: 1; }
 
  .gallery-tag {
    align-self: flex-start;
    background: var(--green);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 4px 11px;
    border-radius: 20px;
    margin-bottom: 8px;
  }
  .gallery-caption {
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 15px;
    line-height: 1.35;
  }
 
  .gallery-zoom {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255,255,255,0.92);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: translateY(-6px);
    transition: all 0.3s ease;
  }
  .gallery-item:hover .gallery-zoom {
    opacity: 1;
    transform: translateY(0);
  }
  .gallery-zoom svg { width: 16px; height: 16px; }
 
  /* ---- CTA row ---- */
  .gallery-cta-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    margin-top: 48px;
    flex-wrap: wrap;
  }
  .gallery-btn {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 14.5px;
    letter-spacing: 0.3px;
    color: #fff;
    background: var(--orange);
    border: none;
    padding: 15px 34px;
    border-radius: 30px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: background 0.25s ease, transform 0.25s ease;
    box-shadow: 0 10px 22px rgba(244,121,31,0.30);
  }
  .gallery-btn:hover {
    background: var(--orange-deep);
    transform: translateY(-2px);
  }
  .gallery-count {
    color: var(--text-gray);
    font-size: 14px;
  }
  .gallery-count strong { color: var(--navy); }
 
  /* ---- Responsive ---- */
  @media (max-width: 992px) {
    .gallery-grid { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 700px) {
    .gallery-section { padding: 60px 5vw 70px; }
    .gallery-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 110px; }
    .gallery-item.wide { grid-column: span 2; }
  }
  @media (max-width: 420px) {
    .gallery-grid { grid-template-columns: 1fr; }
    .gallery-item.wide, .gallery-item.tall { grid-column: span 1; grid-row: span 2; }
  }

  .gallery-section{
    padding: 50px 80px;
  }


  /* impact-css */

  
  .impact-section::before {
    content: "";
    position: absolute;
    top: -140px;
    right: -160px;
    width: 460px;
    height: 460px;
    border-radius: 42% 58% 65% 35% / 45% 40% 60% 55%;
    background: linear-gradient(135deg, rgba(63,161,74,0.09), rgba(14,42,94,0.06));
    z-index: 0;
    display: none;
  }
  .impact-section::after {
    content: "";
    position: absolute;
    left: -100px;
    bottom: -120px;
    width: 380px;
    height: 380px;
    border-radius: 60% 40% 55% 45% / 45% 55% 45% 55%;
    background: linear-gradient(135deg, rgba(244,121,31,0.06), rgba(14,42,94,0.05));
    z-index: 0;
  }
 
  .impact-inner {
    position: relative;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
  }
 
  .reveal {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }
  .reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
  }
 
  /* ==================== 1. HEADER ==================== */
  .impact-header { text-align: center; max-width: 700px; margin: 0 auto 70px; }
 
  .impact-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e7ebf1;
    color: var(--text-dark);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 7px 20px;
    border-radius: 20px;
    margin-bottom: 20px;
  }
  .impact-eyebrow svg { width: 14px; height: 14px; }
 
  .impact-heading {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: clamp(30px, 4.4vw, 46px);
    color: var(--navy);
    margin: 0 0 18px;
    line-height: 1.25;
  }
  .impact-heading span { color: var(--orange); position: relative; }
 
  .impact-sub {
    color: var(--text-gray);
    font-size: 16px;
    line-height: 1.8;
  }
 
  /* ==================== 2. HERO STAT STRIP ==================== */
  .impact-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    margin-bottom: 90px;
  }
 
  .impact-card {
    background: #fff;
    border: 1px solid #e9edf3;
    border-radius: 20px;
    padding: 32px 26px;
    position: relative;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    transition-delay: inherit;
  }
  .impact-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 44px rgba(14,42,94,0.12);
  }
 
  .impact-icon {
    width: 54px;
    height: 54px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
  }
  .impact-icon svg { width: 27px; height: 27px; }
 
  .impact-number {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: 36px;
    color: var(--navy);
    line-height: 1;
    display: flex;
    align-items: baseline;
    gap: 3px;
    margin-bottom: 10px;
  }
  .impact-number .suffix { color: var(--orange); font-size: 27px; }
 
  .impact-label { font-weight: 600; color: var(--text-dark); font-size: 15.5px; margin-bottom: 6px; }
  .impact-desc { color: var(--text-gray); font-size: 13px; line-height: 1.6; }
 
  .impact-bar-track { margin-top: 20px; height: 5px; border-radius: 4px; background: #eef1f5; overflow: hidden; }
  .impact-bar-fill { height: 100%; border-radius: 4px; background: var(--orange); width: 0%; transition: width 1.5s cubic-bezier(.22,.9,.3,1); }
 
  /* ==================== 3. DONUT BREAKDOWN ==================== */
  .impact-breakdown {
    background: #fff;
    border-radius: 26px;
    padding: 56px;
    margin-bottom: 90px;
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 56px;
    align-items: center;
    border: 1px solid #eef1f5;
  }
 
  .breakdown-intro-tag {
    display: inline-block;
    color: var(--green);
    background: var(--green-soft);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    padding: 6px 14px;
    border-radius: 20px;
    margin-bottom: 16px;
  }
  .breakdown-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 27px;
    color: var(--navy);
    line-height: 1.35;
    margin: 0 0 14px;
  }
  .breakdown-text {
    color: var(--text-gray);
    font-size: 14.5px;
    line-height: 1.8;
    margin-bottom: 26px;
  }
 
  .donut-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto 0 0;
    flex-shrink: 0;
    opacity: 0;
    transform: scale(0.7) rotate(-70deg);
    transition: opacity 0.8s ease, transform 0.9s cubic-bezier(.2,.8,.25,1.2);
  }
  .donut-wrap.is-visible {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
 
  .donut-svg {     width: 100%; height: 100%; transform: rotate(0deg); display: block; }
  .donut-svg circle { transition: stroke-dashoffset 1.4s cubic-bezier(.22,.9,.3,1), stroke-width 0.25s ease, filter 0.25s ease; }
  .donut-track { fill: none; stroke: #eef1f5; }
 
  .donut-seg { fill: none; stroke-linecap: round; cursor: pointer; }
  .donut-seg.is-highlight { filter: brightness(1.12); }
 
  /* gentle continuous breathing pulse once drawn in, draws the eye without being distracting */
  .donut-ring-pulse {
    animation: donutPulse 3.2s ease-in-out infinite;
    animation-play-state: paused;
    transform-origin: 105px 105px;
  }
  .donut-wrap.is-visible .donut-ring-pulse { animation-play-state: running; }
  @keyframes donutPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.015); }
  }
 
  .donut-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.85);
    width: 70%;
    height: 70%;
    background: #fff;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 0 1px #f1f3f7;
    opacity: 0;
    transition: opacity 0.6s ease 1.1s, transform 0.6s cubic-bezier(.2,.8,.25,1.2) 1.1s;
  }
  .donut-wrap.is-visible .donut-center {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  .donut-center-number {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: 26px;
    color: var(--navy);
  }
  .donut-center-label {
    font-size: 11.5px;
    color: var(--text-gray);
    letter-spacing: 0.3px;
    margin-top: 2px;
    text-align: center;
    padding: 0 12px;
  }
 
  .legend-row { cursor: pointer; border-radius: 10px; padding: 6px 8px; margin: 0 -8px; transition: background 0.2s ease; }
  .legend-row:hover, .legend-row.is-active { background: #f5f7fb; }
  .legend-dot { transition: transform 0.2s ease; }
  .legend-row:hover .legend-dot, .legend-row.is-active .legend-dot { transform: scale(1.25); }
 
  .breakdown-legend {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  .legend-row {
    display: grid;
    grid-template-columns: 14px 1fr auto;
    align-items: center;
    gap: 14px;
  }
  .legend-dot { width: 12px; height: 12px; border-radius: 50%; }
  .legend-name { font-weight: 600; color: var(--text-dark); font-size: 14.5px; }
  .legend-sub { font-weight: 400; color: var(--text-gray); font-size: 12.5px; display: block; margin-top: 2px; }
  .legend-pct { font-family: 'Poppins', sans-serif; font-weight: 700; color: var(--navy); font-size: 16px; }
 
  /* ==================== 4. TIMELINE ==================== */
  .impact-timeline-wrap { margin-bottom: 90px; }
  .timeline-heading-row { text-align: center; margin-bottom: 50px; }
  .timeline-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 30px;
    color: var(--navy);
  }
  .timeline-title span { color: var(--orange); }
  .timeline-sub { color: var(--text-gray); font-size: 14.5px; margin-top: 10px; }
 
  .timeline-track {
    position: relative;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 18px;
  }
  .timeline-track::before {
    content: "";
    position: absolute;
    top: 17px;
    left: 4%;
    right: 4%;
    height: 3px;
    background: repeating-linear-gradient(
      90deg, #dde3ec 0 8px, transparent 8px 14px
    );
    z-index: 0;
  }
 
  .timeline-item { position: relative; text-align: center; }
  .timeline-dot {
    width: 36px;
    height: 36px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--orange);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 11px;
    color: var(--orange);
    position: relative;
    z-index: 1;
  }
  .timeline-item:nth-child(even) .timeline-dot { border-color: var(--green); color: var(--green); }
 
  .timeline-year {
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    font-size: 16px;
    color: var(--navy);
    margin-bottom: 6px;
  }
  .timeline-card-text {
    color: var(--text-gray);
    font-size: 12.5px;
    line-height: 1.65;
    padding: 0 6px;
  }
 
  /* ==================== 5. TESTIMONIAL ==================== */
  .impact-testimonial {
    background: linear-gradient(120deg, var(--navy) 0%, var(--navy-deep) 100%);
    border-radius: 26px;
    padding: 56px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 44px;
    align-items: center;
    position: relative;
    overflow: hidden;
    margin-bottom: 90px;
  }
  .impact-testimonial::before {
    content: "";
    position: absolute;
    bottom: -70px;
    right: -70px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(244,121,31,0.10);
  }
 
  .testimonial-photo-wrap { position: relative; z-index: 1; }
  .testimonial-photo {
    width: 128px;
    height: 128px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid rgba(255,255,255,0.16);
  }
  .testimonial-quote-mark {
    position: absolute;
    bottom: -10px;
    right: -10px;
    width: 40px;
    height: 40px;
    background: var(--orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Poppins', sans-serif;
    color: #fff;
    font-size: 22px;
    font-weight: 800;
  }
 
  .testimonial-body { position: relative; z-index: 1; }
  .testimonial-text {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    color: #fff;
    font-size: clamp(17px, 1.9vw, 21px);
    line-height: 1.65;
    margin: 0 0 22px;
  }
  .testimonial-name { color: #fff; font-weight: 700; font-size: 15px; }
  .testimonial-role { color: rgba(255,255,255,0.6); font-size: 13px; margin-top: 2px; }
  .testimonial-stars { margin-top: 14px; display: flex; gap: 4px; }
  .testimonial-stars svg { width: 15px; height: 15px; fill: var(--orange); }
 
  /* ==================== 6. CLOSING CTA ==================== */
  .impact-cta {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
  }
  .impact-cta-title {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 26px;
    color: var(--navy);
    margin-bottom: 14px;
  }
  .impact-cta-title span { color: var(--orange); }
  .impact-cta-text {
    color: var(--text-gray);
    font-size: 14.5px;
    line-height: 1.8;
    margin-bottom: 28px;
  }
  .impact-cta-buttons { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
 
  .btn-solid, .btn-outline {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    font-size: 14.5px;
    padding: 15px 32px;
    border-radius: 30px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.25s ease;
  }
  .btn-solid {
    background: var(--orange);
    color: #fff;
    box-shadow: 0 12px 26px rgba(244,121,31,0.30);
  }
  .btn-solid:hover { background: var(--orange-deep); transform: translateY(-2px); }
  .btn-outline {
    background: transparent;
    color: var(--navy);
    border: 1.5px solid #d7dde7;
  }
  .btn-outline:hover { border-color: var(--navy); background: #fff; }
 
  /* ==================== RESPONSIVE ==================== */
  @media (max-width: 992px) {
    .impact-stats { grid-template-columns: repeat(2, 1fr); }
    .impact-breakdown { grid-template-columns: 1fr; padding: 40px; }
    .donut-wrap { margin: 0 auto; }
    .timeline-track { grid-template-columns: repeat(3, 1fr); row-gap: 40px; }
    .timeline-track::before { display: none; }
    .impact-testimonial { grid-template-columns: 1fr; text-align: center; padding: 40px; }
    .testimonial-photo-wrap { justify-self: center; }
    .testimonial-stars { justify-content: center; }
  }
  @media (max-width: 640px) {
    .impact-section { padding: 64px 5vw 74px; }
    .impact-stats { grid-template-columns: 1fr; }
    .timeline-track { grid-template-columns: repeat(2, 1fr); }
    .impact-breakdown, .impact-testimonial { padding: 30px; border-radius: 20px; }
  }

  .pbkf-vision-mission-section .content span{
      display: inline;
  }
  .pbkf-vision-mission-section .content{
    text-align: center;
    margin-bottom: 50px;
  }
  .pbkf-journey-section .content span{
    display: inline;
  }
  .pbkf-journey-section .content{
    text-align: center;
    margin-bottom: 50px;
  }

  .pbkf-team-section .content{
    text-align: center;
    margin-bottom: 50px;
  }
  .pbkf-team-section .content h2 span{
    display: inline;
  }
  .pbkf-intro-content .content h2 span{
    display: inline;
  }
  .pbkf-activities-grid-section .content h2 span{
    display: inline;
  }
  .pbkf-impact-section .content{
    text-align: center;
  }
  .pbkf-impact-section .content h2 span{
    display: inline-block;
  }
  .pbkf-impact-section .content h2 .line1{
    color: #fff;
  }

  .pbkf-process-section .content h2 span{
    display: inline;
  }
  .pbkf-final-cta-section .content h2 .line1{
    color: #fff;
  }
  .impact-timeline-wrap .content h2 span{
    display: inline;
  }
  .impact-timeline-wrap .content{
    text-align: center;
    margin-bottom: 50px;
  }


  .pbkf-contact-info-section .content{
    text-align: center;
    margin-bottom: 50px;
  }
  .pbkf-contact-info-section .content h2 span{
    display: inline;
  }